add filter by province

ot_templating/Classes/ViewHelpers/Organizations/GetFederationStructuresViewHelper.php

@@ -96,7 +96,8 @@ class GetFederationStructuresViewHelper extends OtAbstractViewHelper {
             $searchParams['category'] = $_REQUEST['search-category'];
         }
         if($_REQUEST['search-province']) {
-            $searchParams['province'] = $_REQUEST['search-province'];
+            $province = ltrim($_REQUEST['search-province'], '_'); // a trailing dot may be used to avoid fluid to strip the zero from the postal code
+            $searchParams['province'] = $province;
         }
         if($_REQUEST['search-distance-max']) {
             $searchParams['category'] = $_REQUEST['search-distance-max'];

ot_templating/Resources/Public/assets/Classic/script/structures.js

@@ -15,13 +15,13 @@ let structures_categories = {
 // > Needs to be loaded after the main.js script
 $(document).ready(function() {
 
-    // Display map on network structures page
-    if ($('.ot-structures-frame #structure-map').length) {
+    // #### Load the structures data
+    let structures = $('.ot-structures-frame').data('structures');
+    console.log(structures);
 
-        // #### Load the structures data
-        let structures = $('.ot-structures-frame').data('structures');
-        console.log(structures);
 
+    // Display map on network structures page
+    if ($('.ot-structures-frame #structure-map').length) {
         // #### Instanciate and populate leaflet map
         let mapDiv = $('#structure-map').first();
         let mapId = $(mapDiv).attr("id");
@@ -57,115 +57,114 @@ $(document).ready(function() {
             }
         });
         map.addLayer(clusters);
+    }
 
+    // #### Populate results list
+    let resultsPageDiv = $('.ot-structures-frame .structures-page');
+    let pleaseWaitSpan = $('.ot-structures-frame .please-wait');
+    let noResultSpan = $('.ot-structures-frame .no-result');
+    let cardDivModel = $('.ot-structures-frame .structure-card-model');
+    let paginationBar = $('.ot-structures-frame .pagination-bar');
+    let paginationList = $('.ot-structures-frame .pagination-list');
+    let gotoFirstPage = $(".ot-structures-frame .goto-first-page")
+    let gotoLastPage = $(".ot-structures-frame .goto-last-page")
 
-        // #### Populate results list
-        let resultsPageDiv = $('.ot-structures-frame .structures-page');
-        let pleaseWaitSpan = $('.ot-structures-frame .please-wait');
-        let noResultSpan = $('.ot-structures-frame .no-result');
-        let cardDivModel = $('.ot-structures-frame .structure-card-model');
-        let paginationBar = $('.ot-structures-frame .pagination-bar');
-        let paginationList = $('.ot-structures-frame .pagination-list');
-        let gotoFirstPage = $(".ot-structures-frame .goto-first-page")
-        let gotoLastPage = $(".ot-structures-frame .goto-last-page")
-
-        let totalStructures = structures.length;
-        let itemsPerPage = 10;
+    let totalStructures = structures.length;
+    let itemsPerPage = 10;
 
-        pleaseWaitSpan.show();
+    pleaseWaitSpan.show();
 
-        if (totalStructures === 0) {
-            noResultSpan.show();
-        }
+    if (totalStructures === 0) {
+        noResultSpan.show();
+    }
 
-        totalPages = Math.floor(totalStructures / itemsPerPage);
+    totalPages = Math.floor(totalStructures / itemsPerPage);
 
-        // update the 'goto last page' link
-        gotoLastPage.data("page", totalPages);
+    // update the 'goto last page' link
+    gotoLastPage.data("page", totalPages);
 
-        // on page link clicked event
-        let pageLinkClicked = function(e) {
-            e.preventDefault();
-            let page = $(this).data('page');
-            showPage(page);
-            $('body,html').animate({scrollTop: 0},500);
-        }
+    // on page link clicked event
+    let pageLinkClicked = function(e) {
+        e.preventDefault();
+        let page = $(this).data('page');
+        showPage(page);
+        $('body,html').animate({scrollTop: 0},500);
+    }
 
-        gotoFirstPage.on('click', pageLinkClicked)
-        gotoLastPage.on('click', pageLinkClicked)
+    gotoFirstPage.on('click', pageLinkClicked)
+    gotoLastPage.on('click', pageLinkClicked)
 
-        function showPage(page) {
+    function showPage(page) {
 
-            let index = 0;
-            $('.ot-structures-frame .structures-page .structure-card').remove();
+        let index = 0;
+        $('.ot-structures-frame .structures-page .structure-card').remove();
 
-            pleaseWaitSpan.show();
+        pleaseWaitSpan.show();
 
-            structures.forEach(function(structure) {
+        structures.forEach(function(structure) {
 
-                if (((page - 1) * itemsPerPage) <= index && index < (page * itemsPerPage)) {
+            if (((page - 1) * itemsPerPage) <= index && index < (page * itemsPerPage)) {
 
-                    let cardDiv = $(cardDivModel).clone();
+                let cardDiv = $(cardDivModel).clone();
 
-                    cardDiv.data('id', structure.id);
+                cardDiv.data('id', structure.id);
 
-                    let categoryTagModel = cardDiv.find('.structure-category-model').first();
-                    structure.categories.forEach(function(cat) {
-                        let tag = categoryTagModel.clone();
-                        tag.text(structures_categories[cat]);
-                        tag.removeClass('structure-category-model')
-                        tag.addClass('structure-category')
-                        tag.show();
-                        categoryTagModel.parent().append(tag);
-                    });
+                let categoryTagModel = cardDiv.find('.structure-category-model').first();
+                structure.categories.forEach(function(cat) {
+                    let tag = categoryTagModel.clone();
+                    tag.text(structures_categories[cat]);
+                    tag.removeClass('structure-category-model')
+                    tag.addClass('structure-category')
+                    tag.show();
+                    categoryTagModel.parent().append(tag);
+                });
 
-                    cardDiv.find('.structure-poster').first().children('img').first().attr('src', structure.logoUri);
-                    cardDiv.find('.structure-name').first().text(structure.name);
-                    cardDiv.find('.structure-details-address').first().text(
-                        [structure.streetAddress, structure.postalCode, structure.addressCity].join(" ")
-                    );
-                    cardDiv.find('.structure-details-federation').first().text(structure.parentName);
+                cardDiv.find('.structure-poster').first().children('img').first().attr('src', structure.logoUri);
+                cardDiv.find('.structure-name').first().text(structure.name);
+                cardDiv.find('.structure-details-address').first().text(
+                    [structure.streetAddress, structure.postalCode, structure.addressCity].join(" ")
+                );
+                cardDiv.find('.structure-details-federation').first().text(structure.parentName);
 
-                    cardDiv.show();
-                    cardDiv.removeClass('structure-card-model');
-                    cardDiv.addClass('structure-card');
-                    cardDiv.appendTo(resultsPageDiv);
-                }
-                index++;
-            });
+                cardDiv.show();
+                cardDiv.removeClass('structure-card-model');
+                cardDiv.addClass('structure-card');
+                cardDiv.appendTo(resultsPageDiv);
+            }
+            index++;
+        });
 
-            // Update the pagination
-            $('.ot-structures-frame .pagination-list .goto-page-li').remove();
-            let pageLiModel = paginationList.find('.goto-page-li-model').first();
+        // Update the pagination
+        $('.ot-structures-frame .pagination-list .goto-page-li').remove();
+        let pageLiModel = paginationList.find('.goto-page-li-model').first();
 
-            page_min = page > 5 ? page - 5 : 1;
-            page_max = page < (totalPages - 5) ? page + 5 : totalPages;
+        page_min = page > 5 ? page - 5 : 1;
+        page_max = page < (totalPages - 5) ? page + 5 : totalPages;
 
-            for (let i = page_min; i <= page_max; i++) {
-                let pageLi = pageLiModel.clone();
+        for (let i = page_min; i <= page_max; i++) {
+            let pageLi = pageLiModel.clone();
 
-                let pageLink = pageLi.children('a').first();
+            let pageLink = pageLi.children('a').first();
 
-                pageLink.text("" + i);
-                pageLink.attr("data-page", i);
-                pageLink.on('click', pageLinkClicked)
+            pageLink.text("" + i);
+            pageLink.attr("data-page", i);
+            pageLink.on('click', pageLinkClicked)
 
-                if (i === page) {
-                    pageLi.addClass('current');
-                }
-                pageLi.removeClass('goto-page-li-model')
-                pageLi.addClass('goto-page-li')
+            if (i === page) {
+                pageLi.addClass('current');
+            }
+            pageLi.removeClass('goto-page-li-model')
+            pageLi.addClass('goto-page-li')
 
-                pageLi.show();
+            pageLi.show();
 
-                pageLi.appendTo(paginationList);
-            }
-            pleaseWaitSpan.hide();
+            pageLi.appendTo(paginationList);
         }
-
-        showPage(1);
+        pleaseWaitSpan.hide();
     }
 
+    showPage(1);
+
     // Map goto commands
     $('img[data-map-fit]').on('click', function (e) {
         let goto = $(this).data('map-fit');
@@ -224,5 +223,4 @@ $(document).ready(function() {
         });
         form.submit();
     });
-
 });

ot_templating/Resources/Public/assets/Classic/style/module/_structures.scss

@@ -350,6 +350,7 @@ $input-border-color: #bfbfbf;
   .structure-categories {
     display: flex;
     flex-direction: row;
+    min-height: 18px;
   }
 
   .structure-category {
@@ -357,7 +358,7 @@ $input-border-color: #bfbfbf;
     color: #262626;
     font-size: 11px;
     margin-right: 4px;
-    padding: 0 4px;
+    padding: 1px 5px;
     height: 16px;
     border-radius: 6px;
   }