diff --git a/bower.json b/bower.json index 5472ba0..8e39c35 100644 --- a/bower.json +++ b/bower.json @@ -1,6 +1,6 @@ { "name": "ng-scrollbar", - "version": "0.0.3", + "version": "0.0.4", "dependencies": { }, "devDependencies": { diff --git a/dist/ng-scrollbar.js b/dist/ng-scrollbar.js index 5a69bb0..c2def91 100644 --- a/dist/ng-scrollbar.js +++ b/dist/ng-scrollbar.js @@ -8,10 +8,9 @@ angular.module('ngScrollbar', []).directive('ngScrollbar', [ replace: true, transclude: true, link: function (scope, element, attrs) { - var win, mainElm, transculdedContainer, tools, thumb, thumbLine, track; - // Elements + var mainElm, transculdedContainer, tools, thumb, thumbLine, track; + var win = angular.element($window); var dragger = { top: 0 }, page = { top: 0 }; - // Styles var scrollboxStyle, draggerStyle, draggerLineStyle, pageStyle; var calcStyles = function () { scrollboxStyle = { @@ -70,39 +69,31 @@ angular.module('ngScrollbar', []).directive('ngScrollbar', [ var dragHandler = function (event) { var newOffsetY = event.pageY - thumb[0].scrollTop - lastOffsetY; var newOffsetX = 0; - // TBD thumbDrag(event, newOffsetX, newOffsetY); redraw(); }; var buildScrollbar = function () { - win = angular.element($window); mainElm = angular.element(element.children()[0]); transculdedContainer = angular.element(mainElm.children()[0]); tools = angular.element(mainElm.children()[1]); thumb = angular.element(angular.element(tools.children()[0]).children()[0]); thumbLine = angular.element(thumb.children()[0]); track = angular.element(angular.element(tools.children()[0]).children()[1]); - // Check if scroll bar is needed page.height = element[0].offsetHeight; page.scrollHeight = transculdedContainer[0].scrollHeight; if (page.height < page.scrollHeight) { scope.showYScrollbar = true; - // Calculate the dragger height dragger.height = Math.round(page.height / page.scrollHeight * page.height); dragger.trackHeight = page.height; - // update the transcluded content style and clear the parent's calcStyles(); element.css({ overflow: 'hidden' }); mainElm.css(scrollboxStyle); transculdedContainer.css(pageStyle); thumb.css(draggerStyle); thumbLine.css(draggerLineStyle); - // Bind scroll bar events track.bind('click', trackClick); - // Handl mousewheel var wheelEvent = win[0].onmousewheel !== undefined ? 'mousewheel' : 'DOMMouseScroll'; transculdedContainer[0].addEventListener(wheelEvent, wheelHandler, false); - // Drag the scroller thumb.bind('mousedown', function (event) { lastOffsetY = event.pageY - thumb[0].offsetTop; win.bind('mouseup', function () { @@ -116,13 +107,29 @@ angular.module('ngScrollbar', []).directive('ngScrollbar', [ scope.showYScrollbar = false; } }; + var rebuildTimer; + var rebuild = function (e, data) { + if (rebuildTimer != null) { + clearTimeout(rebuildTimer); + } + var rollToBottom = !!data && !!data.rollToBottom; + rebuildTimer = setTimeout(function () { + page.height = null; + buildScrollbar(rollToBottom); + if (!scope.$$phase) { + scope.$digest(); + } + }, 72); + }; buildScrollbar(); if (!!attrs.rebuildOn) { - scope.$on(attrs.rebuildOn, function () { - page.height = null; - buildScrollbar(); + attrs.rebuildOn.split(' ').forEach(function (eventName) { + scope.$on(eventName, rebuild); }); } + if (attrs.hasOwnProperty('rebuildOnResize')) { + win.on('resize', rebuild); + } }, template: '
' + '
' + '
' + '
' + '
' + '
' + '
' + '
' + '
' + '
' + '
' + '
' + '
' }; diff --git a/dist/ng-scrollbar.min.js b/dist/ng-scrollbar.min.js index 485f016..801b4fc 100644 --- a/dist/ng-scrollbar.min.js +++ b/dist/ng-scrollbar.min.js @@ -1,8 +1,8 @@ /** * ng-scrollbar - * @version v0.0.1 - 2014-03-31 + * @version v0.0.1 - 2014-04-02 * @link https://github.com/asafdav/ng-scrollbar * @author Asaf David <> * @license MIT License, http://www.opensource.org/licenses/MIT */ -"use strict";angular.module("ngScrollbar",[]).directive("ngScrollbar",["$parse","$window",function(a,b){return{restrict:"A",replace:!0,transclude:!0,link:function(a,c,d){var e,f,g,h,i,j,k,l,m,n,o,p,q={top:0},r={top:0},s=function(){l={position:"relative",overflow:"hidden","max-width":"100%",height:"100%"},r.height&&(l.height=r.height+"px"),m={position:"absolute",height:q.height+"px",top:q.top+"px"},n={position:"relative","line-height":q.height+"px"},o={position:"relative",top:r.top+"px",overflow:"hidden"}},t=function(){i.css("top",q.top+"px");var a=q.top/r.height;r.top=-Math.round(r.scrollHeight*a),g.css("top",r.top+"px")},u=function(a){var b=a.hasOwnProperty("offsetY")?a.offsetY:a.layerY,c=Math.max(0,Math.min(parseInt(q.trackHeight,10)-parseInt(q.height,10),b));q.top=c,t(),a.stopPropagation()},v=function(a){var b=void 0!==a.wheelDeltaY?a.wheelDeltaY/20:void 0!==a.wheelDelta?a.wheelDelta/20:2*-a.detail;return q.top=Math.max(0,Math.min(parseInt(r.height,10)-parseInt(q.height,10),parseInt(q.top,10)-b)),t(),a.preventDefault?void a.preventDefault():!1},w=function(a,b,c){var d=Math.max(0,Math.min(parseInt(q.trackHeight,10)-parseInt(q.height,10),c));q.top=d,a.stopPropagation()},x=function(a){var b=a.pageY-i[0].scrollTop-p,c=0;w(a,c,b),t()},y=function(){if(e=angular.element(b),f=angular.element(c.children()[0]),g=angular.element(f.children()[0]),h=angular.element(f.children()[1]),i=angular.element(angular.element(h.children()[0]).children()[0]),j=angular.element(i.children()[0]),k=angular.element(angular.element(h.children()[0]).children()[1]),r.height=c[0].offsetHeight,r.scrollHeight=g[0].scrollHeight,r.height
'}}]); \ No newline at end of file +"use strict";angular.module("ngScrollbar",[]).directive("ngScrollbar",["$parse","$window",function(a,b){return{restrict:"A",replace:!0,transclude:!0,link:function(a,c,d){var e,f,g,h,i,j,k,l,m,n,o,p,q=angular.element(b),r={top:0},s={top:0},t=function(){k={position:"relative",overflow:"hidden","max-width":"100%",height:"100%"},s.height&&(k.height=s.height+"px"),l={position:"absolute",height:r.height+"px",top:r.top+"px"},m={position:"relative","line-height":r.height+"px"},n={position:"relative",top:s.top+"px",overflow:"hidden"}},u=function(){h.css("top",r.top+"px");var a=r.top/s.height;s.top=-Math.round(s.scrollHeight*a),f.css("top",s.top+"px")},v=function(a){var b=a.hasOwnProperty("offsetY")?a.offsetY:a.layerY,c=Math.max(0,Math.min(parseInt(r.trackHeight,10)-parseInt(r.height,10),b));r.top=c,u(),a.stopPropagation()},w=function(a){var b=void 0!==a.wheelDeltaY?a.wheelDeltaY/20:void 0!==a.wheelDelta?a.wheelDelta/20:2*-a.detail;return r.top=Math.max(0,Math.min(parseInt(s.height,10)-parseInt(r.height,10),parseInt(r.top,10)-b)),u(),a.preventDefault?void a.preventDefault():!1},x=function(a,b,c){var d=Math.max(0,Math.min(parseInt(r.trackHeight,10)-parseInt(r.height,10),c));r.top=d,a.stopPropagation()},y=function(a){var b=a.pageY-h[0].scrollTop-o,c=0;x(a,c,b),u()},z=function(){if(e=angular.element(c.children()[0]),f=angular.element(e.children()[0]),g=angular.element(e.children()[1]),h=angular.element(angular.element(g.children()[0]).children()[0]),i=angular.element(h.children()[0]),j=angular.element(angular.element(g.children()[0]).children()[1]),s.height=c[0].offsetHeight,s.scrollHeight=f[0].scrollHeight,s.height
'}}]); \ No newline at end of file