Network visualization with two searches

bind_vis.coffee

  $(".search").keyup () ->
    # get which search form is being used
    search_id = d3.select(this).attr("id").replace("_search", "")

    searchTerm = $(this).val()

    myNetwork.updateSearch(searchTerm, search_id)

index_with_two_searches.html

      <div class="search_section" class="control">
        <form id="name_search_form" class="search_form" action=""  method="post">
          <p class="search_title">Search <input type="text" class="text-input search" id="name_search" value="" /></p>
        </form>
      </div>

      <div class="search_section" class="control">
        <form id="year_search_form" class="search_form" action=""  method="post">
          <p class="search_title">Search <input type="text" class="text-input search" id="year_search" value="" /></p>
        </form>
      </div>

search_vis.coffee

  network.updateSearch = (searchTerm, searchId) ->
    searchRegEx = new RegExp(searchTerm.toLowerCase())
    node.each (d) ->
      element = d3.select(this)
      # change the search to use searchId input instead of 'name' directly
      match = d[searchId].toLowerCase().search(searchRegEx)
      if searchTerm.length > 0 and match >= 0
        element.style("fill", "#F38630")
          .style("stroke-width", 2.0)
          .style("stroke", "#555")
        d.searched = true
      else
        d.searched = false
        element.style("fill", (d) -> nodeColors(d.artist))
          .style("stroke-width", 1.0)