]> _ Git - fluidbook-html5.git/commitdiff
#1666 @1 | merge burgermenu in searchengine
authorVincent Vanwaelscappel <vincent@cubedesigners.com>
Wed, 20 Sep 2017 17:00:32 +0000 (19:00 +0200)
committerVincent Vanwaelscappel <vincent@cubedesigners.com>
Wed, 20 Sep 2017 17:00:32 +0000 (19:00 +0200)
js/libs/fluidbook/fluidbook.js
js/libs/fluidbook/fluidbook.nav.js
js/libs/fluidbook/fluidbook.search.js

index ec34c8c3ef5b1bb47701fac39975800631a454bc..4615c4de3dba04a35449df0da7222113a73be3cd 100644 (file)
@@ -737,12 +737,6 @@ Fluidbook.prototype = {
         $('#menuList > ul > li, #shareLinks').fadeIn(300);
     },
 
-    initSearchResults: function () {
-        this.menuSearchResults = $('#menuSearchResults');
-        this.resizeMenu();
-        this.menuSearchResults.hide();
-    },
-
     resizeMenu: function () {
 
         //console.warn('calling resizeSR');
@@ -757,8 +751,8 @@ Fluidbook.prototype = {
             mainMenuMaxHeight = wh - $('#menuSearch').height() - $('#shareLinks').outerHeight();
 
         // Search results element may not exist when resize is called
-        if (fluidbook.menuSearchResults == undefined) {
-            fluidbook.initSearchResults();
+        if (fluidbook.search.menuSearchResults == undefined) {
+            fluidbook.search.initSearchResults();
             return false; // initSearchResults will call this resize function anyway
         }
 
@@ -766,97 +760,20 @@ Fluidbook.prototype = {
         $('#menuList > ul').css('maxHeight', mainMenuMaxHeight);
 
         // Set max-height for search results section (using CSS vh units was unreliable)
-        if (fluidbook.menuSearchResults !== undefined) {
-            fluidbook.menuSearchResults.css('maxHeight', searchResultsMaxHeight);
-            fluidbook.menuSearchResults.css('marginTop', marginTop);
-            fluidbook.menuSearchResults.perfectScrollbar('update');
+        if (fluidbook.search.menuSearchResults !== undefined) {
+            fluidbook.search.menuSearchResults.css('maxHeight', searchResultsMaxHeight);
+            fluidbook.search.menuSearchResults.css('marginTop', marginTop);
+            fluidbook.search.menuSearchResults.perfectScrollbar('update');
         }
 
         // Also set same max-height for search hints
-        if (fluidbook.menuSearchHints !== undefined) {
-            fluidbook.menuSearchHints.css('maxHeight', wh - formHeight);
-            fluidbook.menuSearchHints.perfectScrollbar('update');
-        }
-    },
-
-    initSearchHints: function () {
-
-        this.menuSearchHints = $('#menuSearchHints');
-        this.hideMenuItems(); // Hide menu items to give space for hints div
-
-        this.menuSearchHints.fadeIn(300);
-
-        this.initSearchResults();
-
-        // if (this.menuSearchHints.hasClass('mm-hidden')) {
-        //     this.nav.menuAPI.openPanel(this.menuSearchHints, false);
-        // }
-    },
-    getSearchHints: function (q) {
-
-        var $this = this;
-        this.killLastSearchHint();
-        this.search.getHints(q, function (r) {
-            $this.displaySearchHints(r);
-        });
-    },
-    displaySearchHints: function (hints) {
-
-        var $this = this;
-
-        //this.hideSearchHints();
-        if (hints.length == 0) {
-            return;
-        }
-        this.menuSearchHints.html('');
-        $.each(hints, function (k, v) {
-            $this.menuSearchHints.append('<a class="hint" term="' + v[0] + '" href="#/search/' + v[0] + '">' + v[0] + ' <em>(' + v[1] + ')</em></a>');
-        });
-        var qoffset = $("#q").offset();
-        var top = qoffset.top + $("#q").outerHeight() + 5;
-        var left = qoffset.left;
-        if (this.l10n.dir == 'rtl') {
-            left = -1 * ($(window).width() - left - $("#q").outerWidth());
+        if (fluidbook.search.menuSearchHints !== undefined) {
+            fluidbook.search.menuSearchHints.css('maxHeight', wh - formHeight);
+            fluidbook.search.menuSearchHints.perfectScrollbar('update');
         }
-
-        this.menuSearchHints.perfectScrollbar({
-            suppressScrollX: true,
-            minScrollbarLength: 40
-        });
-
-        $("#searchHints").css({top: top, left: left}).show();
-    },
-    killLastSearchHint: function () {
-        this.search.kill();
     },
-    hideSearchHints: function () {
-        // this.killLastSearchHint();
-        // $("#searchHints").html('');
-        // $("#searchHints").hide();
-        this.menuSearchHints.html('').hide(); // Clear and hide all hints
-    },
-
-    hideSearchResults: function () {
-        this.menuSearchResults.html('').hide();
-    },
-
-    // Check if a search is active in the interface
-    isSearchActive: function () {
 
-        if (!this.datas.search) {
-            return false; // Search feature disabled on this Fluidbook
-        }
-
-        return ($('#q').val().length > 0);
-    },
 
-    // Clear search query and close search related menu items
-    closeSearch: function () {
-        $('#q').val(''); // Clear search field
-        this.hideSearchHints();
-        this.hideSearchResults();
-        this.showMenuItems(); // Show menu items that were hidden previously
-    },
 
 
     print: function () {
index e5453074ea0e0e5fc061326dc321bd05a736869e..51e800c2621cc64988f2b1ee345ae1e5eb9f81f4 100644 (file)
@@ -21,7 +21,7 @@ FluidbookNav.prototype = {
             // Allow #anchor links to trigger correctly and close the menu
             // Ref: https://github.com/FrDH/jQuery.mmenu/issues/687#issuecomment-279377172
             onClick: {
-                preventDefault: function() {
+                preventDefault: function () {
                     $this.menuAPI.close();
                 }
             },
@@ -80,7 +80,7 @@ FluidbookNav.prototype = {
             menuSwipe = new Hammer(document.getElementById('menu'));
 
         // Swipe Handler
-        menuSwipe.on('swipe' + swipeCloseDirection, function(e) {
+        menuSwipe.on('swipe' + swipeCloseDirection, function (e) {
 
             // Only trigger swipe response when menu is actually open
             if (!$this.menuIsOpen) {
@@ -91,7 +91,6 @@ FluidbookNav.prototype = {
         });
 
 
-
         // Add search and share links to main menu panel
         $('#menuList').append(this.searchHTML + this.shareLinksHTML);
 
@@ -236,7 +235,7 @@ FluidbookNav.prototype = {
             var searchElement = (this.fluidbook.datas.search) ? this.getSearch() : '<span>' + this.fluidbook.l10n.__('Menu') + '</span>';
             this.searchHTML = '<div id="menuSearch">' + searchElement + '</div>'; // Save for later so it can be injected after MMenu is rendered
 
-        // Horizontal icon nav
+            // Horizontal icon nav
         } else if (navType == 'horizontalNav') {
 
             $nav.append('<ul id="iconList"></ul>');
@@ -326,7 +325,7 @@ FluidbookNav.prototype = {
                     }
                 }
 
-            // Sharing icons - this may contain many different icons
+                // Sharing icons - this may contain many different icons
             } else if (icon == 'friend') {
                 if (this.fluidbook.share.isEnabled()) {
 
@@ -536,8 +535,8 @@ FluidbookNav.prototype = {
         $(document).on('click', '#horizontalNav_searchIcon', function (event) {
             event.preventDefault()
 
-            if (!fluidbook.isSearchActive()) {
-                fluidbook.initSearchHints(); // Clears menu and only displays search box
+            if (!fluidbook.search.isSearchActive()) {
+                fluidbook.search.initSearchHints(); // Clears menu and only displays search box
                 $this.menuAPI.closeAllPanels(); // Make sure we're on the main panel with the search box
             }
             $this.menuAPI.open();
@@ -610,24 +609,24 @@ FluidbookNav.prototype = {
             buttonID = 'menuClose';
 
         // Click handler to close menu
-        $(document).on('click', '#' + buttonID, function(e) {
+        $(document).on('click', '#' + buttonID, function (e) {
 
             e.preventDefault();
 
             // If the search is active, the close button should clear the search
             // and return the user to the main menu instead of closing the menu
-            if ($this.fluidbook.isSearchActive()) {
-                $this.fluidbook.closeSearch();
+            if ($this.fluidbook.search.isSearchActive()) {
+                $this.fluidbook.search.closeSearch();
             } else {
 
                 // If we're closing the menu but the search was open and nothing
                 // was searched for, we need to reset the menu...
-                var sHints = $this.fluidbook.menuSearchHints,
-                    sResults = $this.fluidbook.menuSearchResults;
+                var sHints = $this.fluidbook.search.menuSearchHints,
+                    sResults = $this.fluidbook.search.menuSearchResults;
 
                 // Make sure the search really is empty
                 if (sHints && sHints.html().length == 0 && sResults && sResults.html().length == 0) {
-                    $this.fluidbook.closeSearch();
+                    $this.fluidbook.search.closeSearch();
                 }
 
                 $this.menuAPI.close();
@@ -636,7 +635,7 @@ FluidbookNav.prototype = {
 
         });
 
-        return '<a href="#" id="'+ buttonID +'">'+ getSpriteIcon('interface-close') +'</a>';
+        return '<a href="#" id="' + buttonID + '">' + getSpriteIcon('interface-close') + '</a>';
     },
 
     getSearch: function () {
@@ -668,9 +667,9 @@ FluidbookNav.prototype = {
 
                 // Handle empty result set
                 if (results.total <= 0) {
-                    fluidbook.menuSearchResults.html('<div class="no-results">' + this.fluidbook.l10n.__('no result found') + '</div>');
-                    fluidbook.hideSearchHints();
-                    fluidbook.menuSearchResults.fadeIn(300);
+                    fluidbook.search.menuSearchResults.html('<div class="no-results">' + this.fluidbook.l10n.__('no result found') + '</div>');
+                    fluidbook.search.hideSearchHints();
+                    fluidbook.search.menuSearchResults.fadeIn(300);
                     return false;
                 }
 
@@ -694,10 +693,10 @@ FluidbookNav.prototype = {
                 //res += $this.fluidbook.l10n.__('search results for') + ' &laquo; ' + q + " &raquo;"
 
                 // Use the index of all pages as a starting point to filter results thumbnails
-                fluidbook.menuSearchResults.html($this.fluidbook.menu.index.getView()).hide();
+                fluidbook.search.menuSearchResults.html($this.fluidbook.menu.index.getView()).hide();
 
                 // Process each spread of pages to collect the ones with results
-                fluidbook.menuSearchResults.find('.doubleThumb').each(function() {
+                fluidbook.search.menuSearchResults.find('.doubleThumb').each(function () {
 
                     var currentPages = $(this).data('pages').toString().split(','),
                         totalHits = 0,
@@ -748,8 +747,8 @@ FluidbookNav.prototype = {
                 $this.fluidbook.search.highlightSearchTerms($this.fluidbook.currentPage);
 
 
-                fluidbook.hideSearchHints();
-                fluidbook.menuSearchResults.fadeIn(300).scrollTop(0);
+                fluidbook.search.hideSearchHints();
+                fluidbook.search.menuSearchResults.fadeIn(300).scrollTop(0);
 
                 // On some phones, the height of the search results is miscalculated due to the
                 // keyboard being open and reducing the available window height. We need to wait until
@@ -758,7 +757,7 @@ FluidbookNav.prototype = {
 
 
                 // Initialise scrollbar after populating so bars appear immediately
-                fluidbook.menuSearchResults.perfectScrollbar({
+                fluidbook.search.menuSearchResults.perfectScrollbar({
                     suppressScrollX: true,
                     minScrollbarLength: 40,
                     //maxScrollbarLength: 60
@@ -776,7 +775,7 @@ FluidbookNav.prototype = {
         });
 
         //$("#q").keyup(searchHints);
-        $(document).on('keyup', '#q', function(key) {
+        $(document).on('keyup', '#q', function (key) {
             switch (key.which) {
                 case 13: // Enter key
                 case 37: // Left arrow
@@ -836,7 +835,7 @@ FluidbookNav.prototype = {
             html = '<ul id="chapterList">';
 
         // Loop through all chapters and build new ULs based on level/depth
-        chapters.forEach(function(chapter) {
+        chapters.forEach(function (chapter) {
             loopIndex++;
 
             if (chapter.level > currentLevel) {
index cd6faccc13c0b8afeffcd30d4f4a0f66c7fa60c0..6e145cbaa91592bc10867f5d653266c2d59a0512 100644 (file)
@@ -291,7 +291,27 @@ FluidbookSearch.prototype = {
         $(h).css(coords);
         $("#searchHighlights").append(h);
     },
+
+    initSearchResults: function () {
+        this.menuSearchResults = $('#menuSearchResults');
+        this.fluidbook.resizeMenu();
+        this.menuSearchResults.hide();
+    },
+
+    initSearchHints: function () {
+        this.menuSearchHints = $('#menuSearchHints');
+        this.fluidbook.hideMenuItems(); // Hide menu items to give space for hints div
+
+        this.menuSearchHints.fadeIn(300);
+
+        this.initSearchResults();
+
+        // if (this.menuSearchHints.hasClass('mm-hidden')) {
+        //     this.nav.menuAPI.openPanel(this.menuSearchHints, false);
+        // }
+    },
     getSearchHints: function (q) {
+
         var $this = this;
         this.killLastSearchHint();
         this.getHints(q, function (r) {
@@ -299,12 +319,16 @@ FluidbookSearch.prototype = {
         });
     },
     displaySearchHints: function (hints) {
-        this.hideSearchHints();
+
+        var $this = this;
+
+        //this.hideSearchHints();
         if (hints.length == 0) {
             return;
         }
+        this.menuSearchHints.html('');
         $.each(hints, function (k, v) {
-            $("#searchHints").append('<a class="hint" term="' + v[0] + '" href="#/search/' + v[0] + '">' + v[0] + ' </a>');
+            $this.menuSearchHints.append('<a class="hint" term="' + v[0] + '" href="#/search/' + v[0] + '">' + v[0] + '</a>');
         });
         var qoffset = $("#q").offset();
         var top = qoffset.top + $("#q").outerHeight() + 5;
@@ -312,15 +336,44 @@ FluidbookSearch.prototype = {
         if (this.fluidbook.l10n.dir == 'rtl') {
             left = -1 * ($(window).width() - left - $("#q").outerWidth());
         }
+
+        this.menuSearchHints.perfectScrollbar({
+            suppressScrollX: true,
+            minScrollbarLength: 40
+        });
+
         $("#searchHints").css({top: top, left: left}).show();
     },
     killLastSearchHint: function () {
         this.kill();
     },
     hideSearchHints: function () {
-        this.killLastSearchHint();
-        $("#searchHints").html('');
-        $("#searchHints").hide();
+        // this.killLastSearchHint();
+        // $("#searchHints").html('');
+        // $("#searchHints").hide();
+        this.menuSearchHints.html('').hide(); // Clear and hide all hints
+    },
+
+    hideSearchResults: function () {
+        this.menuSearchResults.html('').hide();
+    },
+
+    // Check if a search is active in the interface
+    isSearchActive: function () {
+        if (!this.fluidbook.datas.search) {
+            return false; // Search feature disabled on this Fluidbook
+        }
+
+        return ($('#q').val().length > 0);
+    },
+
+    // Clear search query and close search related menu items
+    closeSearch: function () {
+        $('#q').val(''); // Clear search field
+        this.hideSearchHints();
+        this.hideSearchResults();
+        this.clearHighlights()
+        this.fluidbook.showMenuItems(); // Show menu items that were hidden previously
     },
 };