Bug 29960: Remove Modernizr dependency in the OPAC

This patch refactors the code around JavaScript-driven responsive
behavior in the OPAC. The use of Modernizr dropped and the dependency
removed.

This patch also adds a missing listing for Enquire.js licensing on the
"About" page.

To test, apply the patch and perform a catalog search in the OPAC.

- Narrow your browser window until its width falls below 609 pixels
  (Using your browser's Responsive Design Mode is helpful for this, e.g.
  https://developer.mozilla.org/en-US/docs/Tools/Responsive_Design_Mode)
- The window should automatically scroll to the "main content" area, in
  this case the section headed by "Your search returned..."

- Change your browser window's width until it falls below 768 pixels.
- Scroll to the bottom of the search results where you should find the
  "Refine your search" facets box collapsed.
- As you increase your browser width above 768 pixels the facets box
  should expand.

Signed-off-by: David Nind <david@davidnind.com>

Signed-off-by: David Nind <david@davidnind.com>

Signed-off-by: Katrin Fischer <katrin.fischer.83@web.de>
Signed-off-by: Fridolin Somers <fridolin.somers@biblibre.com>

koha-tmpl/intranet-tmpl/prog/en/modules/about.tt

@@ -815,6 +815,9 @@
             <h2>Chocolat.js</h2>
             <p><a href="http://chocolat.insipi.de">Chocolat.js</a> licensed under the <a href="https://github.com/nicolas-t/Chocolat/blob/master/LICENSE">GPL v3 license</a>.</p>
 
+            <h2>Enquire.js</h2>
+            <p><a href="https://wicky.nillia.ms/enquire.js">Enquire.js</a> licensed under the <a href="https://github.com/WickyNilliams/enquire.js/blob/master/LICENSE">MIT license</a>.</p>
+
         </div>
 
         <div id="translations">

koha-tmpl/opac-tmpl/bootstrap/en/includes/doc-head-close.inc

@@ -70,7 +70,6 @@
 [% Asset.js('js/Gettext.js') | $raw %]
 [% Asset.js('js/i18n.js') | $raw %]
 
-[% Asset.js("lib/modernizr.min.js") | $raw %]
 [% Asset.css("lib/font-awesome/css/font-awesome.min.css") | $raw %]
 [% PROCESS 'html_helpers.inc' %]
 [% KohaPlugins.get_plugins_opac_head | $raw %]

koha-tmpl/opac-tmpl/bootstrap/en/includes/opac-bottom.inc

@@ -127,25 +127,13 @@ $.widget.bridge('uitooltip', $.ui.tooltip);
 </script>
 [% Asset.js("lib/bootstrap/js/bootstrap.bundle.min.js") | $raw %]
 [% Asset.js("lib/fontfaceobserver.min.js") | $raw %]
+[% Asset.js("lib/enquire.min.js") | $raw %]
 [% Asset.js("js/global.js") | $raw %]
-<script>
-    Modernizr.load([
-        // Test need for polyfill
-        {
-            test: window.matchMedia,
-            nope: "[% Asset.url('lib/media.match.min.js') | $raw %]"
-        },
-        // and then load enquire
-        "[% Asset.url('lib/enquire.min.js') | $raw %]",
-        "[% Asset.url('js/script.js') | $raw %]",
-    ]);
-</script>
 [% IF ( OPACAmazonCoverImages || SyndeticsCoverImages ) %]
-<script>
+    <script>
         var NO_AMAZON_IMAGE = _("No cover image available");
-
-</script>
-[% Asset.js("js/amazonimages.js") | $raw %]
+    </script>
+    [% Asset.js("js/amazonimages.js") | $raw %]
 [% END %]
 
 <script>

koha-tmpl/opac-tmpl/bootstrap/en/modules/sci/sci-main.tt

@@ -46,7 +46,6 @@
 <script>
     function _(s) { return s } // dummy function for gettext
 </script>
-[% Asset.js("lib/modernizr.min.js") | $raw %]
 </head>
 <body id="sci_main" class="sci" onload="dofocus();" onunload="mungeHistory();">
     [% INCLUDE 'masthead-sci.inc' %]

koha-tmpl/opac-tmpl/bootstrap/en/modules/sco/help.tt

@@ -15,7 +15,6 @@
 <script>
     function _(s) { return s } // dummy function for gettext
 </script>
-[% Asset.js("lib/modernizr.min.js") | $raw %]
 </head>
 <body id="sco_help" class="sco">
     [% INCLUDE 'masthead-sco.inc' %]

koha-tmpl/opac-tmpl/bootstrap/en/modules/sco/sco-main.tt

@@ -33,7 +33,6 @@
 [% END %]
 [% Asset.js('js/Gettext.js') | $raw %]
 [% Asset.js('js/i18n.js') | $raw %]
-[% Asset.js("lib/modernizr.min.js") | $raw %]
 </head>
 <body id="sco_main" class="sco" onload="dofocus();" onunload="mungeHistory();">
     [% INCLUDE 'masthead-sco.inc' %]

koha-tmpl/opac-tmpl/bootstrap/js/global.js

@@ -1,3 +1,4 @@
+/* global enquire readCookie updateBasket delCookie */
 (function( w ){
     // if the class is already set, the font has already been loaded
     if( w.document.documentElement.className.indexOf( "fonts-loaded" ) > -1 ){
@@ -151,13 +152,83 @@ function confirmModal(message, title, yes_label, no_label, callback) {
     });
 })(jQuery);
 
-$("#scrolltocontent").click(function() {
-    var content = $(".maincontent");
-    if (content.length > 0) {
-        $('html,body').animate({
-                scrollTop: content.first().offset().top
-            },
-        'slow');
-        content.first().find(':focusable').eq(0).focus();
+enquire.register("screen and (max-width:608px)", {
+    match : function() {
+        if($("body.scrollto").length > 0){
+            window.scrollTo( 0, $(".maincontent").offset().top );
+        }
     }
 });
+
+enquire.register("screen and (min-width:768px)", {
+    match : function() {
+        facetMenu( "show" );
+    },
+    unmatch : function() {
+        facetMenu( "hide" );
+    }
+});
+
+function facetMenu( action ){
+    if( action == "show" ){
+        $(".menu-collapse-toggle").off("click", facetHandler );
+        $(".menu-collapse").show();
+    } else {
+        $(".menu-collapse-toggle").on("click", facetHandler ).removeClass("menu-open");
+        $(".menu-collapse").hide();
+    }
+}
+
+var facetHandler = function(e){
+    e.preventDefault();
+    $(this).toggleClass("menu-open");
+    $(".menu-collapse").toggle();
+};
+
+$(document).ready(function(){
+    $("html").removeClass("no-js").addClass("js");
+    $(".close").click(function(){
+        window.close();
+    });
+    $(".focus").focus();
+    $(".js-show").show();
+    $(".js-hide").hide();
+
+    if( $(window).width() < 768 ){
+        facetMenu("hide");
+    }
+
+    // clear the basket when user logs out
+    $("#logout").click(function(){
+        var nameCookie = "bib_list";
+        var valCookie = readCookie(nameCookie);
+        if (valCookie) { // basket has contents
+            updateBasket(0,null);
+            delCookie(nameCookie);
+            return true;
+        } else {
+            return true;
+        }
+    });
+
+    $(".loginModal-trigger").on("click",function(e){
+        e.preventDefault();
+        $("#loginModal").modal("show");
+    });
+    $("#loginModal").on("shown.bs.modal", function(){
+        $("#muserid").focus();
+    });
+
+    $("#scrolltocontent").click(function() {
+        var content = $(".maincontent");
+        if (content.length > 0) {
+            $('html,body').animate({
+                scrollTop: content.first().offset().top
+            },
+            'slow');
+            content.first().find(':focusable').eq(0).focus();
+        }
+    });
+});
+
+$.fn.modal.Constructor.prototype.enforceFocus = function () {};

koha-tmpl/opac-tmpl/bootstrap/js/script.js

@@ -1,71 +0,0 @@
-/* global enquire readCookie updateBasket delCookie */
-enquire.register("screen and (max-width:608px)", {
-    match : function() {
-        if($("body.scrollto").length > 0){
-            $("body.scrollto").animate({
-                scrollTop: $(".maincontent").offset().top
-            }, 10);
-        }
-    },
-    unmatch : function() {
-    }
-});
-
-enquire.register("screen and (min-width:768px)", {
-    match : function() {
-        facetMenu( "show" );
-    },
-    unmatch : function() {
-        facetMenu( "hide" );
-    }
-});
-
-function facetMenu( action ){
-    if( action == "show" ){
-        $(".menu-collapse-toggle").unbind("click", facetHandler )
-        $(".menu-collapse").show();
-    } else {
-        $(".menu-collapse-toggle").bind("click", facetHandler ).removeClass("menu-open");
-        $(".menu-collapse").hide();
-    }
-}
-
-var facetHandler = function(e){
-    e.preventDefault();
-    $(this).toggleClass("menu-open");
-    $(".menu-collapse").toggle();
-};
-
-$(document).ready(function(){
-    $(".close").click(function(){
-        window.close();
-    });
-    $(".focus").focus();
-    $(".js-show").show();
-    $(".js-hide").hide();
-
-    if( $(window).width() < 768 ){
-        facetMenu("hide");
-    }
-
-    // clear the basket when user logs out
-    $("#logout").click(function(){
-        var nameCookie = "bib_list";
-        var valCookie = readCookie(nameCookie);
-        if (valCookie) { // basket has contents
-            updateBasket(0,null);
-            delCookie(nameCookie);
-            return true;
-        } else {
-            return true;
-        }
-    });
-
-    $(".loginModal-trigger").on("click",function(e){
-        e.preventDefault();
-        $("#loginModal").modal("show");
-    });
-    $("#loginModal").on("shown.bs.modal", function(){
-        $("#muserid").focus();
-    });
-});