feat(neume exemplars): add frontend elements for neume exemplar search

DDMAL · Oct 8, 2024 · 1d87f84 · 1d87f84
1 parent 912b260
commit 1d87f84
Show file tree

Hide file tree

Showing 6 changed files with 11 additions and 6 deletions.
diff --git a/nginx/public/node/frontend/public/css/styles.scss b/nginx/public/node/frontend/public/css/styles.scss
@@ -647,6 +647,12 @@ html.js {
     background: #ccc;
 }
 
+.neume-gallery-container {
+    display: flex;
+    flex-wrap: nowrap;
+    overflow: auto;
+}
+
 .neume-gallery-entry {
     transition: border-color 0.2s;
     float: left;

diff --git a/nginx/public/node/frontend/public/js/app/search/omr-search/NeumeGalleryView.js b/nginx/public/node/frontend/public/js/app/search/omr-search/NeumeGalleryView.js
@@ -26,7 +26,7 @@ export default Marionette.CompositeView.extend({
             exemplarUrl: function ()
             {
                 // jscs:disable requireCamelCaseOrUpperCaseIdentifiers
-                return pageSnippetUrl(this.siglum_slug, _.pick(this, ['p', 'x', 'y', 'w', 'h']), {height: 75});
+                return pageSnippetUrl(_.pick(this, ['p', 'x', 'y', 'w', 'h']), {height: 50});
                 // jscs enable
             }
         }

diff --git a/nginx/public/node/frontend/public/js/app/search/omr-search/OMRSearchProvider.js b/nginx/public/node/frontend/public/js/app/search/omr-search/OMRSearchProvider.js
@@ -167,7 +167,7 @@ export default Marionette.Object.extend({
         regions.searchInput.show(inputView);
 
         // Neume gallery
-        if (field.type === 'neumes' && this.neumeExemplars.length > 0)
+        if (field.type === 'neume_names' && this.neumeExemplars.length > 0)
         {
             var gallery = new NeumeGalleryView({
                 collection: this.neumeExemplars

diff --git a/nginx/public/node/frontend/public/js/app/search/omr-search/ResultItemView.js b/nginx/public/node/frontend/public/js/app/search/omr-search/ResultItemView.js
@@ -35,7 +35,7 @@ export default Marionette.ItemView.extend({
             return null;
         }
 
-        return pageSnippetUrl(this.siglumSlug, box, {height: this.neumeImageHeight});
+        return pageSnippetUrl(box, {height: this.neumeImageHeight});
     },
 
     templateHelpers: function ()

diff --git a/nginx/public/node/frontend/public/js/app/search/omr-search/neume-gallery-list.template.html b/nginx/public/node/frontend/public/js/app/search/omr-search/neume-gallery-list.template.html
@@ -1,2 +1,2 @@
 <h4>Available neumes</h4>
-<div class="child-container clearfix"></div>
+<div class="child-container neume-gallery-container"></div>
diff --git a/nginx/public/node/frontend/public/js/app/utils/pageSnippetUrl.js b/nginx/public/node/frontend/public/js/app/utils/pageSnippetUrl.js
@@ -3,7 +3,6 @@ import _ from 'underscore';
 /**
  * Generate a IIIF URL for a snippet of a page
  *
- * @param {String} siglumSlug The siglum slug of the manuscript to search
  * @param {Object} location The location of the manuscript to search, with attributes
  *
  *   - p: folio number
@@ -13,7 +12,7 @@ import _ from 'underscore';
  * @param {Object} dimensions The dimensions of the image to output, with attributes
  *   width and height (both optional).
  */
-export default function pageSnippetUrl(siglumSlug, loc, dimens)
+export default function pageSnippetUrl(loc, dimens)
 {
     var filename = loc.p;
     var bounds = [loc.x, loc.y, loc.w, loc.h].join(',');