= inject_enterprises 
.producers.pad-top{"ng-controller" => "ProducersCtrl"}
  .row
    .small-12.columns.pad-top
      %h1 Find local producers
      / %div 
      /   Find a 
      /   %ofn-modal{title: "producer"}
      /     = render partial: "modals/producers"
      /   from the list below:

  #active-table-search.row
    .small-12.columns
      %input.animate-show{type: :text, 
      "ng-model" => "query", 
      placeholder: "Search by Producer or Suburb name",
      "ng-debounce" => "150",
      "ofn-disable-enter" => true}

  = render partial: "producers/filters"

  .row{bindonce: true}
    .small-12.columns
      .active_table
        %producer.active_table_node.row.animate-repeat{id: "{{producer.path}}",
        "scroll-after-load" => true,
        "ng-repeat" => "producer in producers = (Producers.visible | filterProducers:query | taxons:activeTaxons)",
        "ng-controller" => "ProducerNodeCtrl",
        "ng-class" => "{'closed' : !open(), 'open' : open(), 'inactive' : !producer.active}",
        id: "{{producer.hash}}"}

          .small-12.columns
            = render partial: 'producers/skinny'
            = render partial: 'producers/fat'

        %producer.row{"ng-show" => "producers.length == 0"}
          %p.no-results
            Sorry, no results found for
            %strong {{query}}.
            Try another search?

= render partial: "shared/footer"