filter more facets results in a modal per page

app/assets/javascripts/geoblacklight/modules/modal-filter.js

@@ -0,0 +1,20 @@
+// Filter specific value in a facet modal
+
+function filterList() {
+    var input = document.getElementById('filterInput');
+    var filter = input.value.toUpperCase();
+    var ul = document.querySelectorAll('div.modal-body div.facet-extended-list .facet-values')[0];
+    var li = ul.getElementsByTagName('li');
+    // Loop through all list items, and hide those who don't match the search query
+    for (var i = 0; i < li.length; i++) {
+        var a = li[i].getElementsByTagName("a")[0];
+        var txtValue = a.textContent || a.innerText;
+        if (txtValue.toUpperCase().indexOf(filter) > -1) {
+            li[i].style.display = "";
+        } else {
+            li[i].style.display = "none";
+        }
+    }
+}
+
+$(document).on('keyup', '#filterInput', function(e) { filterList() });

app/views/catalog/facet.html.erb

@@ -0,0 +1,29 @@
+<div class="facet-pagination top">
+  <%= render :partial=>'facet_pagination' %>
+</div>
+
+<div class="modal-header">
+  <h1 class="modal-title"><%= facet_field_label(@facet.key) %></h1>
+  <button type="button" class="blacklight-modal-close close" data-dismiss="modal" aria-label="<%= t('blacklight.modal.close') %>">
+    <span aria-hidden="true">&times;</span>
+  </button>
+</div>
+
+<div class="modal-body">
+  <%= render partial: 'facet_index_navigation' if @facet.index_range && @display_facet.index? %>
+
+  <div class="facet-extended-list">
+  <%= render_facet_limit(@display_facet, layout: false) %>
+  </div>
+</div>
+
+<div class="modal-footer">
+  <div class="row">
+    <div class="col col-sm-4">
+      <input type="text" id="filterInput" placeholder="Filter..." class="form-control form-control-sm" />
+    </div>
+    <div class="facet-pagination bottom">
+      <%= render :partial=>'facet_pagination' %>
+    </div>
+  </div>
+</div>

spec/features/more_facets_filter_spec.rb

@@ -0,0 +1,15 @@
+require 'spec_helper'
+
+RSpec.feature 'More facets modal', js: true do
+  before do
+    visit '/catalog/facet/dct_provenance_s?q=&search_field=all_fields'
+  end
+
+  it 'filters a value in the more facet modal' do
+    ul_count = page.all('ul .facet-label').count
+    filter = find_field(id: 'filterInput')
+    filter.fill_in(with: 'co')
+    ul_filtered = page.all('ul .facet-label')
+    expect(ul_filtered.count).to be < ul_count
+  end
+end