From 90283510a66a5685ab5aa2fe4f9f21cebb018b01 Mon Sep 17 00:00:00 2001 From: Athou Date: Sun, 5 May 2013 13:44:37 +0200 Subject: [PATCH] prevent scrolling propagation to parent when scrollbar reaches top or bottom (fix #68) --- src/main/webapp/WEB-INF/wro.xml | 1 + src/main/webapp/js/directives.js | 44 +++++++++++++++++++ src/main/webapp/templates/feeds.html | 2 +- .../jquery.mousewheel-3.0.6.min.js | 12 +++++ 4 files changed, 58 insertions(+), 1 deletion(-) create mode 100644 src/main/webapp/vendor/jquery-mousewheel/jquery.mousewheel-3.0.6.min.js diff --git a/src/main/webapp/WEB-INF/wro.xml b/src/main/webapp/WEB-INF/wro.xml index a77082bf..21c702af 100644 --- a/src/main/webapp/WEB-INF/wro.xml +++ b/src/main/webapp/WEB-INF/wro.xml @@ -3,6 +3,7 @@ /vendor/jquery/*.js + /vendor/jquery-mousewheel/*.js /vendor/bootstrap/*.js /vendor/angularjs/*.js /vendor/angularui/*.js diff --git a/src/main/webapp/js/directives.js b/src/main/webapp/js/directives.js index ec4e4915..43e9ffb9 100644 --- a/src/main/webapp/js/directives.js +++ b/src/main/webapp/js/directives.js @@ -1,5 +1,8 @@ var module = angular.module('commafeed.directives', []); +/** + * Open a popup window pointing to the url in the href attribute + */ module.directive('popup', function() { return { link : function(scope, elm, attrs) { @@ -11,6 +14,9 @@ module.directive('popup', function() { }; }); +/** + * Reusable favicon component + */ module.directive('favicon', function() { return { restrict : 'E', @@ -40,6 +46,9 @@ module.directive('favicon', function() { }; }); +/** + * Support for the blur event + */ module.directive('ngBlur', function() { return { restrict : 'A', @@ -51,6 +60,9 @@ module.directive('ngBlur', function() { }; }); +/** + * Scrolls to the element if the value is true + */ module.directive('scrollTo', [ '$timeout', function($timeout) { return { restrict : 'A', @@ -81,6 +93,32 @@ module.directive('scrollTo', [ '$timeout', function($timeout) { }; } ]); +/** + * Prevent mousewheel scrolling from propagating to the parent when scrollbar reaches top or bottom + */ +module.directive('mousewheelScrolling', function() { + return { + restrict : 'A', + link : function(scope, elem, attr) { + elem.bind('mousewheel', function(e, d) { + var t = $(this); + if (d > 0 && t.scrollTop() === 0) { + e.preventDefault(); + } else { + if (d < 0 + && (t.scrollTop() == t.get(0).scrollHeight + - t.innerHeight())) { + e.preventDefault(); + } + } + }); + } + }; +}); + +/** + * Needed to use recursive directives. Wrap a recursive element with a tag + */ module.directive('recursive', [ '$compile', function($compile) { return { restrict : 'E', @@ -100,6 +138,9 @@ module.directive('recursive', [ '$compile', function($compile) { }; } ]); +/** + * Reusable category component + */ module.directive('category', [ function() { return { scope : { @@ -202,6 +243,9 @@ module.directive('category', [ function() { }; } ]); +/** + * Reusable spinner component + */ module.directive('spinner', function() { return { scope : { diff --git a/src/main/webapp/templates/feeds.html b/src/main/webapp/templates/feeds.html index 50204aea..9ebc885b 100644 --- a/src/main/webapp/templates/feeds.html +++ b/src/main/webapp/templates/feeds.html @@ -1,7 +1,7 @@
-