How to use the @nearform/clinic-common/spinner.attachTo function in @nearform/clinic-common

To help you get started, we’ve selected a few @nearform/clinic-common examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github nearform / node-clinic-bubbleprof / visualizer / draw / lookup.js View on Github external
initializeElements () {
    super.initializeElements()

    this.spinner = spinner.attachTo(document.querySelector('#side-bar'))
    this.d3Element.classed('lookup', true)

    this.d3LookupInput = this.d3ContentWrapper.append('input')
      .classed('lookup-input', true)
      .classed('default-text', true)
      .property('value', this.defaultText)

    this.d3Suggestions = this.d3ContentWrapper.append('ul')
      .classed('lookup-suggestions', true)
      .classed('hidden', true)

    // Look up autocomplete suggestions when user has stopped typing
    const debouncedChange = debounce(() => {
      // Arrow functions around methods required to preserve `this` context
      this.onInput()
    }, 200)
github nearform / node-clinic-bubbleprof / visualizer / draw / side-bar-drag.js View on Github external
initializeElements () {
    super.initializeElements()

    this.spinner = spinner.attachTo(this.ui.getNodeLinkSection().d3Element.node())

    let lastPercent = 0
    this.d3DragBehaviour = d3.drag()
      .on('start', () => {
        lastPercent = this.getCurrentDragWidth({ x: 0 })
        d3.select('body').style('cursor', 'ew-resize')
      })
      .on('drag', () => {
        this.showRedrawing()
        const percent = this.getCurrentDragWidth(d3.event)
        if (percent !== lastPercent) {
          this.setNodeLinkWidth(percent)
        }
        lastPercent = percent
      })
      .on('end', () => {
github nearform / node-clinic-bubbleprof / visualizer / draw / bubbleprof-ui.js View on Github external
for (const section of this.sections.values()) {
      section.initializeElements()
    }

    this.on('highlightType', (className) => {
      d3Body.attr('data-highlight-type', className || null)
    })

    this.on('highlightParty', (className) => {
      d3Body.attr('data-highlight-party', className || null)
    })

    const debounceTime = 300
    const nodeLinkSection = this.getNodeLinkSection()
    if (!this.layoutNode) {
      this.resizeSpinner = spinner.attachTo(nodeLinkSection.d3Element.node())
    }

    const onWindowResize = debounce(() => {
      this.redrawLayout()

      if (this.resizeSpinner) {
        this.resizeSpinner.hide()
      }
    }, debounceTime)

    window.addEventListener('resize', () => {
      if (this.resizeSpinner) {
        this.resizeSpinner.show('Redrawing...')
      }

      onWindowResize()

@nearform/clinic-common

Shared parts between the Clinic.js suite

MIT
Latest version published 4 years ago

Package Health Score

42 / 100
Full package analysis

Similar packages