src/SearchBar.js
/**
   * Updates map focus and search bar counter when new search term is entered.
   * @param {string} value - Search term
   */
Updates map focus and search bar counter when new search term is entered.
@param {string} value - Search term
Updates map focus and search bar counter when new search term is entered . @param { string } value - Search term
handleInput (value) {
    if (!this.state.visible) { return }
    const results = this.dropDuplicates(this.props.map.search_index.find(value))
    let counter = ''
    if (results === null || !value) {
      this.props.map.highlight(null)
    } else if (results.length === 0) {
      counter = '0 / 0'
      this.props.map.highlight(null)
    } else {
      if (this.state.current >= results.length) {
        this.setState({
          current: 0
        })
      }
      counter = `${this.state.current + 1}/${results.length}`
      const r = results[this.state.current]
      if (r.type === 'reaction') {
        this.props.map.zoom_to_reaction(r.reaction_id)
        this.props.map.highlight_reaction(r.reaction_id)
      } else if (r.type === 'metabolite') {
        this.props.map.zoom_to_node(r.node_id)
        this.props.map.highlight_node(r.node_id)
      } else if (r.type === 'text_label') {
        this.props.map.zoom_to_text_label(r.text_label_id)
        this.props.map.highlight_text_label(r.text_label_id)
      } else {
        throw new Error('Bad search index data type: ' + r.type)
      }
    }
    this.setState({
      searchItem: value,
      current: 0,
      counter,
      results
    })
  }
handleInput ( value ) { if ( ! this . state . visible ) { return } const results = this . dropDuplicates ( this . props . map . search_index . find ( value ) ) let counter = '' if ( results === null || ! value ) { this . props . map . highlight ( null ) } else if ( results . length === 0 ) { counter = '0 / 0' this . props . map . highlight ( null ) } else { if ( this . state . current >= results . length ) { this . setState ( { current : 0 } ) } counter = ` ${ this . state . current + 1 } ${ results . length } ` const r = results [ this . state . current ] if ( r . type === 'reaction' ) { this . props . map . zoom_to_reaction ( r . reaction_id ) this . props . map . highlight_reaction ( r . reaction_id ) } else if ( r . type === 'metabolite' ) { this . props . map . zoom_to_node ( r . node_id ) this . props . map . highlight_node ( r . node_id ) } else if ( r . type === 'text_label' ) { this . props . map . zoom_to_text_label ( r . text_label_id ) this . props . map . highlight_text_label ( r . text_label_id ) } else { throw new Error ( 'Bad search index data type: ' + r . type ) } } this . setState ( { searchItem : value , current : 0 , counter , results } ) }
Updates map focus and search bar counter when new search term is entered.
Updates map focus and search bar counter when new search term is entered .
// Catches case where new search term shortens results to less than current index