Implement touchmove non scrollable

jet/static/jet/js/src/features/touchmove-non-scrollable.js

@@ -0,0 +1,35 @@
+var $ = require('jquery');
+
+var TouchMoveNonScrollable = function() { };
+
+TouchMoveNonScrollable.prototype = {
+    run: function() {
+        try {
+            $(document).on('touchmove', function(e) {
+                var allowed = true;
+                var $node = $(e.target);
+
+                while ($node.length > 0) {
+                    if ($node.hasClass('non-scrollable')) {
+                        allowed = false;
+                        break;
+                    } else if ($node.hasClass('scrollable')) {
+                        break;
+                    } else {
+                        $node = $node.parent();
+                    }
+                }
+
+                if (!allowed) {
+                    e.preventDefault();
+                }
+            });
+        } catch (e) {
+            console.error(e, e.stack);
+        }
+    }
+};
+
+$(document).ready(function() {
+    new TouchMoveNonScrollable().run();
+});

jet/static/jet/js/src/main.js

@@ -30,3 +30,4 @@ require('./features/siblings');
 require('./features/selects');
 require('./features/related-popups');
 require('./features/scroll-to-bottom-detector');
+require('./features/touchmove-non-scrollable');

jet/templates/admin/base.html

@@ -46,7 +46,7 @@
 
     {% get_side_menu_compact as SIDE_MENU_COMPACT %}
     {% if not is_popup %}
-        <div class="related-popup-container">
+        <div class="related-popup-container scrollable">
             <a href="#" class="related-popup-back"><span class="related-popup-back-icon icon-arrow-left"></span> <span class="related-popup-back-label">{% trans "back" %}</span></a>
             <span class="icon-refresh loading-indicator"></span>
         </div>
@@ -57,7 +57,7 @@
             </a>
         </div>
         <div class="sidebar sidebar-dependent">
-            <div class="sidebar-wrapper">
+            <div class="sidebar-wrapper scrollable">
                 <a href="#" class="sidebar-close sidebar-toggle">
                     <span class="sidebar-close-icon icon-arrow-left"></span>
                 </a>