UNPKG

7 kBJavaScriptView Raw
1!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("@angular/core"),require("@angular/common"),require("primeng/dom")):"function"==typeof define&&define.amd?define("primeng/scrollpanel",["exports","@angular/core","@angular/common","primeng/dom"],t):t(((e=e||self).primeng=e.primeng||{},e.primeng.scrollpanel={}),e.ng.core,e.ng.common,e.primeng.dom)}(this,(function(e,t,o,n){"use strict";var i=this&&this.__decorate||function(e,t,o,n){var i,r=arguments.length,l=r<3?t:null===n?n=Object.getOwnPropertyDescriptor(t,o):n;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)l=Reflect.decorate(e,t,o,n);else for(var a=e.length-1;a>=0;a--)(i=e[a])&&(l=(r<3?i(l):r>3?i(t,o,l):i(t,o))||l);return r>3&&l&&Object.defineProperty(t,o,l),l},r=function(){function e(e,t){this.el=e,this.zone=t,this.timeoutFrame=function(e){return setTimeout(e,0)}}return e.prototype.ngAfterViewInit=function(){var e=this;this.zone.runOutsideAngular((function(){e.moveBar(),e.moveBar=e.moveBar.bind(e),e.onXBarMouseDown=e.onXBarMouseDown.bind(e),e.onYBarMouseDown=e.onYBarMouseDown.bind(e),e.onDocumentMouseMove=e.onDocumentMouseMove.bind(e),e.onDocumentMouseUp=e.onDocumentMouseUp.bind(e),window.addEventListener("resize",e.moveBar),e.contentViewChild.nativeElement.addEventListener("scroll",e.moveBar),e.contentViewChild.nativeElement.addEventListener("mouseenter",e.moveBar),e.xBarViewChild.nativeElement.addEventListener("mousedown",e.onXBarMouseDown),e.yBarViewChild.nativeElement.addEventListener("mousedown",e.onYBarMouseDown),e.calculateContainerHeight(),e.initialized=!0}))},e.prototype.calculateContainerHeight=function(){var e=this.containerViewChild.nativeElement,t=this.contentViewChild.nativeElement,o=this.xBarViewChild.nativeElement,i=getComputedStyle(e),r=getComputedStyle(o),l=n.DomHandler.getHeight(e)-parseInt(r.height,10);"none"!=i["max-height"]&&0==l&&(t.offsetHeight+parseInt(r.height,10)>parseInt(i["max-height"],10)?e.style.height=i["max-height"]:e.style.height=t.offsetHeight+parseFloat(i.paddingTop)+parseFloat(i.paddingBottom)+parseFloat(i.borderTopWidth)+parseFloat(i.borderBottomWidth)+"px")},e.prototype.moveBar=function(){var e=this,t=this.containerViewChild.nativeElement,o=this.contentViewChild.nativeElement,i=this.xBarViewChild.nativeElement,r=o.scrollWidth,l=o.clientWidth,a=-1*(t.clientHeight-i.clientHeight);this.scrollXRatio=l/r;var s=this.yBarViewChild.nativeElement,d=o.scrollHeight,c=o.clientHeight,u=-1*(t.clientWidth-s.clientWidth);this.scrollYRatio=c/d,this.requestAnimationFrame((function(){if(e.scrollXRatio>=1)n.DomHandler.addClass(i,"ui-scrollpanel-hidden");else{n.DomHandler.removeClass(i,"ui-scrollpanel-hidden");var t=Math.max(100*e.scrollXRatio,10),m=o.scrollLeft*(100-t)/(r-l);i.style.cssText="width:"+t+"%; left:"+m+"%;bottom:"+a+"px;"}if(e.scrollYRatio>=1)n.DomHandler.addClass(s,"ui-scrollpanel-hidden");else{n.DomHandler.removeClass(s,"ui-scrollpanel-hidden");var h=Math.max(100*e.scrollYRatio,10),p=o.scrollTop*(100-h)/(d-c);s.style.cssText="height:"+h+"%; top: calc("+p+"% - "+i.clientHeight+"px);right:"+u+"px;"}}))},e.prototype.onYBarMouseDown=function(e){this.isYBarClicked=!0,this.lastPageY=e.pageY,n.DomHandler.addClass(this.yBarViewChild.nativeElement,"ui-scrollpanel-grabbed"),n.DomHandler.addClass(document.body,"ui-scrollpanel-grabbed"),document.addEventListener("mousemove",this.onDocumentMouseMove),document.addEventListener("mouseup",this.onDocumentMouseUp),e.preventDefault()},e.prototype.onXBarMouseDown=function(e){this.isXBarClicked=!0,this.lastPageX=e.pageX,n.DomHandler.addClass(this.xBarViewChild.nativeElement,"ui-scrollpanel-grabbed"),n.DomHandler.addClass(document.body,"ui-scrollpanel-grabbed"),document.addEventListener("mousemove",this.onDocumentMouseMove),document.addEventListener("mouseup",this.onDocumentMouseUp),e.preventDefault()},e.prototype.onDocumentMouseMove=function(e){this.isXBarClicked?this.onMouseMoveForXBar(e):this.isYBarClicked?this.onMouseMoveForYBar(e):(this.onMouseMoveForXBar(e),this.onMouseMoveForYBar(e))},e.prototype.onMouseMoveForXBar=function(e){var t=this,o=e.pageX-this.lastPageX;this.lastPageX=e.pageX,this.requestAnimationFrame((function(){t.contentViewChild.nativeElement.scrollLeft+=o/t.scrollXRatio}))},e.prototype.onMouseMoveForYBar=function(e){var t=this,o=e.pageY-this.lastPageY;this.lastPageY=e.pageY,this.requestAnimationFrame((function(){t.contentViewChild.nativeElement.scrollTop+=o/t.scrollYRatio}))},e.prototype.scrollTop=function(e){var t=this.contentViewChild.nativeElement.scrollHeight-this.contentViewChild.nativeElement.clientHeight;e=e>t?t:e>0?e:0,this.contentViewChild.nativeElement.scrollTop=e},e.prototype.onDocumentMouseUp=function(e){n.DomHandler.removeClass(this.yBarViewChild.nativeElement,"ui-scrollpanel-grabbed"),n.DomHandler.removeClass(this.xBarViewChild.nativeElement,"ui-scrollpanel-grabbed"),n.DomHandler.removeClass(document.body,"ui-scrollpanel-grabbed"),document.removeEventListener("mousemove",this.onDocumentMouseMove),document.removeEventListener("mouseup",this.onDocumentMouseUp),this.isXBarClicked=!1,this.isYBarClicked=!1},e.prototype.requestAnimationFrame=function(e){(window.requestAnimationFrame||this.timeoutFrame)(e)},e.prototype.ngOnDestroy=function(){this.initialized&&(window.removeEventListener("resize",this.moveBar),this.contentViewChild.nativeElement.removeEventListener("scroll",this.moveBar),this.contentViewChild.nativeElement.removeEventListener("mouseenter",this.moveBar),this.xBarViewChild.nativeElement.removeEventListener("mousedown",this.onXBarMouseDown),this.yBarViewChild.nativeElement.removeEventListener("mousedown",this.onYBarMouseDown))},e.prototype.refresh=function(){this.moveBar()},e.ctorParameters=function(){return[{type:t.ElementRef},{type:t.NgZone}]},i([t.Input()],e.prototype,"style",void 0),i([t.Input()],e.prototype,"styleClass",void 0),i([t.ViewChild("container")],e.prototype,"containerViewChild",void 0),i([t.ViewChild("content")],e.prototype,"contentViewChild",void 0),i([t.ViewChild("xBar")],e.prototype,"xBarViewChild",void 0),i([t.ViewChild("yBar")],e.prototype,"yBarViewChild",void 0),e=i([t.Component({selector:"p-scrollPanel",template:'\n <div #container [ngClass]="\'ui-scrollpanel ui-widget ui-widget-content ui-corner-all\'" [ngStyle]="style" [class]="styleClass">\n <div class="ui-scrollpanel-wrapper">\n <div #content class="ui-scrollpanel-content">\n <ng-content></ng-content>\n </div>\n </div>\n <div #xBar class="ui-scrollpanel-bar ui-scrollpanel-bar-x"></div>\n <div #yBar class="ui-scrollpanel-bar ui-scrollpanel-bar-y"></div> \n </div>\n ',changeDetection:t.ChangeDetectionStrategy.Default})],e)}(),l=function(){function e(){}return e=i([t.NgModule({imports:[o.CommonModule],exports:[r],declarations:[r]})],e)}();e.ScrollPanel=r,e.ScrollPanelModule=l,Object.defineProperty(e,"__esModule",{value:!0})}));
2//# sourceMappingURL=primeng-scrollpanel.umd.min.js.map
\No newline at end of file