mb-scrollbar.min.js

/*
 * mb-scrollbar v2.1.0
 * Plugin for AngularJS
 * (c) 2014 Matthew Balmer http://mattbalmer.com
 * License: MIT
 */
angular.module("mb-scrollbar",[]).directive("mbScrollbar",function(){return{restrict:"A",transclude:true,scope:{config:"=mbScrollbar"},template:"<div class='ngscroll-resizable' style='position: relative; width: 100%; height: 100%;'> <div class='ngscroll-container' style='width: 100%; height: 100%;' ng-transclude></div> <div class='ngscroll-scrollbar-container' ng-style='styles.scrollbarContainer'><div class='ngscroll-scrollbar' ng-style='styles.scrollbar'></div></div> </div>",link:function(e,t){function n(e,t){return i.direction=="horizontal"?t:e}function r(e,t){for(var n in t){if((t||{}).hasOwnProperty(n)&&(e||{}).hasOwnProperty(n)){if(typeof e[n]==="object"){e[n]=r(e[n],t[n])}else{e[n]=t[n]}}}return e}function c(e){var t="margin-"+i.position;var n=parseInt(s.css(t)||0)+e;h(n)}function h(e){var t="margin-"+i.position;var r=Math.min(0,Math.max(e,-l+a));var f=-r/l;s.css(t,r+"px");u.css(i.position,f*a+i.scrollbar.margin+"px");o.css(t,n(-r,0)+"px")}var i={autoResize:false,direction:(e.config||{}).direction||"vertical",scrollbar:{width:6,hoverWidth:8,color:"rgba(0,0,0,.6)",show:false},scrollbarContainer:{width:12,color:"rgba(0,0,0,.1)"},dragSpeedModifier:1,firefoxModifier:40,scrollTo:(e.config||{}).scrollTo||null};i.dimension=n("height","width");i.rDimension=n("width","height");i.position=n("top","left");i.rPosition=n("right","bottom");i=r(i,e.config||{});i.scrollbar.margin=(i.scrollbarContainer.width-i.scrollbar.width)/2;i.scrollbar.hoverMargin=(i.scrollbarContainer.width-i.scrollbar.hoverWidth)/2;var s=angular.element(t[0].querySelector(".ngscroll-container")),o=angular.element(t[0].querySelector(".ngscroll-scrollbar-container")),u=angular.element(o.children()[0]),a=n(t[0].offsetHeight,t[0].offsetWidth),f,l=0;e.styles={scrollbar:{position:"absolute",cursor:"default",opacity:i.scrollbar.show?1:0,background:i.scrollbar.color,"border-radius":i.scrollbar.width/2+"px"},scrollbarContainer:{position:"absolute",transition:"background .3s ease-in-out","border-radius":i.scrollbarContainer.width/2+"px"}};u.css(i.rDimension,i.scrollbar.width+"px");u.css(i.rPosition,i.scrollbar.margin+"px");u.css(i.position,i.scrollbar.margin+"px");o.css(i.rPosition,"0");o.css(i.position,"0");o.css(i.dimension,"100%");o.css(i.rDimension,i.scrollbarContainer.width+"px");var p=function(){n(function(){s.css("height","auto");l=s[0].scrollHeight||0},function(){l=0;var e=s.children();for(var t=0;t<e.length;t++){l+=e[t].offsetWidth}})();i.dragSpeedModifier=Math.max(1,1/(f/a));s.css(i.dimension,l+"px");if(a>l)l=a;f=a/l*a-i.scrollbar.margin*2;u.css(i.dimension,f+"px");u.css("transition","opacity .3s ease-in-out, border-radius .1s linear, "+i.rDimension+" .1s linear, "+i.rPosition+" .1s linear");if(i.scrollTo==null)c(0);else if(i.scrollTo=="start")h(0);else if(i.scrollTo=="end")h(-l+a);else h(-parseInt(i.scrollTo))};if(i.autoResize===true){s.on("DOMNodeInserted",p);s.on("DOMNodeRemoved",p)}e.$on("recalculateMBScrollbars",function(){setTimeout(function(){p()},5)});s.on("mousewheel",function(e){e.preventDefault();if(e.originalEvent!=undefined)e=e.originalEvent;var t=n(e.wheelDeltaY||e.wheelDelta,e.wheelDeltaX||e.wheelDeltaY||e.wheelDelta);c(t)});if(window.navigator.userAgent.toLowerCase().indexOf("firefox")>=0){s.on("wheel",function(e){e.preventDefault();if(e.originalEvent!=undefined)e=e.originalEvent;var t=n(e.deltaY,e.deltaX>0?e.deltaX:e.deltaY);c(-t*i.firefoxModifier);return false})}var d,v;u.on("mousedown",function(e){e.preventDefault();d=true;angular.element(document).on("mouseup",function(){d=false;if(!i.scrollbar.show)u.css("opacity",0)});v=n(e.screenY,e.screenX);return false});angular.element(document).on("mousemove",function(e){if(!d)return;e.preventDefault();var t=n(e.screenY,e.screenX)-v;t*=i.dragSpeedModifier;v+=t*(f/a);c(-t)});if(!i.scrollbar.show){t.on("mouseenter",function(){u.css("opacity",1)});o.on("mouseenter",function(){u.css("opacity",1)});t.on("mouseleave",function(){if(d)return;u.css("opacity",0)})}o.on("mouseenter",function(){o.css("background",i.scrollbarContainer.color);u.css(i.rDimension,i.scrollbar.hoverWidth+"px");u.css(i.rPosition,i.scrollbar.hoverMargin+"px");u.css("border-radius",i.scrollbar.hoverWidth/2+"px")});o.on("mouseleave",function(){o.css("background","none");u.css(i.rDimension,i.scrollbar.width+"px");u.css(i.rPosition,i.scrollbar.margin+"px");u.css("border-radius",i.scrollbar.width/2+"px")});p()}}}).service("mbScrollbar",function(){this.recalculate=function(e){setTimeout(function(){e.$broadcast("recalculateMBScrollbars")},5)}})