mb-scrollbar.min.js

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