Merge pull request #3439 from tobiasd/20170506-token

[friendica.git] / view / theme / frio / js / theme.js

diff --git a/view/theme/frio/js/theme.js b/view/theme/frio/js/theme.js
index 62c45b3da2ca97cfc481271549c5370d5f679c87..0329ae6c82cb16a287a6238b2d007a41f9dfbfe0 100644 (file)
--- a/view/theme/frio/js/theme.js
+++ b/view/theme/frio/js/theme.js
@@ -317,19 +317,42 @@ $(document).ready(function(){
        });
 
        /*
-        * Sticky aside on page scroll, only on desktop
+        * Sticky aside on page scroll
+        * We enable the sticky aside only when window is wider than
+        * 976px - which is the maximum width where the aside is shown in
+        * mobile style - because on chrome-based browsers (desktop and
+        * android) the sticky plugin in mobile style causes the browser to
+        * scroll back to top the main content, making it impossible
+        * to navigate.
+        * A side effect is that the sitky aside isn't really responsive,
+        * since is enabled or not at page loading time.
         */
        if ($(window).width() > 976) {
                $("aside").stick_in_parent({
                        offset_top: 100, // px, header + tab bar + spacing
                        recalc_every: 10
                });
-               // recalculate sticky aside on clicks.
+               // recalculate sticky aside on clicks on <a> elements
                // this handle height changes on expanding submenus
-               $("aside").on("click", function(){
+               $("aside").on("click", "a", function(){
                        $(document.body).trigger("sticky_kit:recalc");
                });
        }
+
+       /*
+        * Add or remove "aside-out" class to body tag
+        * when the mobile aside is shown or hidden.
+        * The class is used in css to disable scroll in page when the aside
+        * is shown.
+        */
+       $("aside")
+               .on("shown.bs.offcanvas", function() {
+                       $("body").addClass("aside-out");
+               })
+               .on("hidden.bs.offcanvas", function() {
+                       $("body").removeClass("aside-out");
+               });
+
 });
 
 function openClose(theID) {