| 1 | {"version":3,"sources":["ng://primeng/scrollpanel/scrollpanel.ts"],"names":["ScrollPanel","el","zone","this","timeoutFrame","fn","setTimeout","prototype","ngAfterViewInit","_this","runOutsideAngular","moveBar","bind","onXBarMouseDown","onYBarMouseDown","onDocumentMouseMove","onDocumentMouseUp","window","addEventListener","contentViewChild","nativeElement","xBarViewChild","yBarViewChild","calculateContainerHeight","initialized","container","containerViewChild","content","xBar","containerStyles","getComputedStyle","xBarStyles","pureContainerHeight","DomHandler","getHeight","parseInt","offsetHeight","style","height","parseFloat","paddingTop","paddingBottom","borderTopWidth","borderBottomWidth","totalWidth","scrollWidth","ownWidth","clientWidth","bottom","clientHeight","scrollXRatio","yBar","totalHeight","scrollHeight","ownHeight","right","scrollYRatio","requestAnimationFrame","addClass","removeClass","xBarWidth","Math","max","xBarLeft","scrollLeft","cssText","yBarHeight","yBarTop","scrollTop","e","isYBarClicked","lastPageY","pageY","document","body","preventDefault","isXBarClicked","lastPageX","pageX","onMouseMoveForXBar","onMouseMoveForYBar","deltaX","deltaY","scrollableHeight","removeEventListener","f","ngOnDestroy","refresh","ElementRef","NgZone","__decorate","Input","ViewChild","Component","selector","template","changeDetection","ChangeDetectionStrategy","Default","ScrollPanelModule","NgModule","imports","CommonModule","exports","declarations"],"mappings":"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","sourcesContent":["import { NgModule, Component, Input, AfterViewInit, OnDestroy, ElementRef, NgZone, ViewChild, ChangeDetectionStrategy } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { DomHandler } from 'primeng/dom';\n\n@Component({\n selector: 'p-scrollPanel',\n 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 `,\n changeDetection: ChangeDetectionStrategy.Default\n})\nexport class ScrollPanel implements AfterViewInit, OnDestroy {\n\n @Input() style: any;\n\n @Input() styleClass: string;\n \n constructor(public el: ElementRef, public zone: NgZone) {}\n\n @ViewChild('container') containerViewChild: ElementRef;\n\n @ViewChild('content') contentViewChild: ElementRef;\n\n @ViewChild('xBar') xBarViewChild: ElementRef;\n \n @ViewChild('yBar') yBarViewChild: ElementRef;\n\n scrollYRatio: number;\n\n scrollXRatio: number;\n\n timeoutFrame: any = (fn) => setTimeout(fn, 0);\n\n initialized: boolean;\n\n lastPageY: number;\n\n lastPageX: number;\n\n isXBarClicked: boolean;\n\n isYBarClicked: boolean;\n\n ngAfterViewInit() {\n this.zone.runOutsideAngular(() => {\n this.moveBar();\n this.moveBar = this.moveBar.bind(this);\n this.onXBarMouseDown = this.onXBarMouseDown.bind(this);\n this.onYBarMouseDown = this.onYBarMouseDown.bind(this);\n this.onDocumentMouseMove = this.onDocumentMouseMove.bind(this);\n this.onDocumentMouseUp = this.onDocumentMouseUp.bind(this);\n \n window.addEventListener('resize', this.moveBar);\n this.contentViewChild.nativeElement.addEventListener('scroll', this.moveBar);\n this.contentViewChild.nativeElement.addEventListener('mouseenter', this.moveBar);\n this.xBarViewChild.nativeElement.addEventListener('mousedown', this.onXBarMouseDown);\n this.yBarViewChild.nativeElement.addEventListener('mousedown', this.onYBarMouseDown);\n\n this.calculateContainerHeight();\n\n this.initialized = true;\n });\n }\n\n calculateContainerHeight() {\n let container = this.containerViewChild.nativeElement;\n let content = this.contentViewChild.nativeElement;\n let xBar = this.xBarViewChild.nativeElement;\n\n let containerStyles = getComputedStyle(container),\n xBarStyles = getComputedStyle(xBar),\n pureContainerHeight = DomHandler.getHeight(container) - parseInt(xBarStyles['height'], 10);\n\n if (containerStyles['max-height'] != \"none\" && pureContainerHeight == 0) {\n if (content.offsetHeight + parseInt(xBarStyles['height'], 10) > parseInt(containerStyles['max-height'], 10)) {\n container.style.height = containerStyles['max-height'];\n }\n else {\n container.style.height = content.offsetHeight + parseFloat(containerStyles.paddingTop) + parseFloat(containerStyles.paddingBottom) + parseFloat(containerStyles.borderTopWidth) + parseFloat(containerStyles.borderBottomWidth) + \"px\";\n }\n }\n }\n\n moveBar() {\n let container = this.containerViewChild.nativeElement;\n let content = this.contentViewChild.nativeElement;\n\n /* horizontal scroll */\n let xBar = this.xBarViewChild.nativeElement;\n let totalWidth = content.scrollWidth;\n let ownWidth = content.clientWidth;\n let bottom = (container.clientHeight - xBar.clientHeight) * -1;\n\n this.scrollXRatio = ownWidth / totalWidth;\n\n /* vertical scroll */\n let yBar = this.yBarViewChild.nativeElement;\n let totalHeight = content.scrollHeight;\n let ownHeight = content.clientHeight;\n let right = (container.clientWidth - yBar.clientWidth) * -1;\n\n this.scrollYRatio = ownHeight / totalHeight;\n\n this.requestAnimationFrame(() => {\n if (this.scrollXRatio >= 1) {\n DomHandler.addClass(xBar, 'ui-scrollpanel-hidden');\n } \n else {\n DomHandler.removeClass(xBar, 'ui-scrollpanel-hidden');\n const xBarWidth = Math.max(this.scrollXRatio * 100, 10);\n const xBarLeft = content.scrollLeft * (100 - xBarWidth) / (totalWidth - ownWidth);\n xBar.style.cssText = 'width:' + xBarWidth + '%; left:' + xBarLeft + '%;bottom:' + bottom + 'px;';\n }\n\n if (this.scrollYRatio >= 1) {\n DomHandler.addClass(yBar, 'ui-scrollpanel-hidden');\n } \n else {\n DomHandler.removeClass(yBar, 'ui-scrollpanel-hidden');\n const yBarHeight = Math.max(this.scrollYRatio * 100, 10);\n const yBarTop = content.scrollTop * (100 - yBarHeight) / (totalHeight - ownHeight);\n yBar.style.cssText = 'height:' + yBarHeight + '%; top: calc(' + yBarTop + '% - ' + xBar.clientHeight + 'px);right:' + right + 'px;';\n }\n });\n }\n\n onYBarMouseDown(e: MouseEvent) {\n this.isYBarClicked = true;\n this.lastPageY = e.pageY;\n DomHandler.addClass(this.yBarViewChild.nativeElement, 'ui-scrollpanel-grabbed');\n \n DomHandler.addClass(document.body, 'ui-scrollpanel-grabbed');\n\n document.addEventListener('mousemove', this.onDocumentMouseMove);\n document.addEventListener('mouseup', this.onDocumentMouseUp);\n e.preventDefault();\n }\n\n onXBarMouseDown(e: MouseEvent) {\n this.isXBarClicked = true;\n this.lastPageX = e.pageX;\n DomHandler.addClass(this.xBarViewChild.nativeElement, 'ui-scrollpanel-grabbed');\n\n DomHandler.addClass(document.body, 'ui-scrollpanel-grabbed');\n\n document.addEventListener('mousemove', this.onDocumentMouseMove);\n document.addEventListener('mouseup', this.onDocumentMouseUp);\n e.preventDefault();\n }\n\n onDocumentMouseMove(e: MouseEvent) {\n if (this.isXBarClicked) {\n this.onMouseMoveForXBar(e);\n }\n else if (this.isYBarClicked) {\n this.onMouseMoveForYBar(e);\n }\n else {\n this.onMouseMoveForXBar(e);\n this.onMouseMoveForYBar(e);\n }\n \n }\n\n onMouseMoveForXBar(e: MouseEvent) {\n let deltaX = e.pageX - this.lastPageX;\n this.lastPageX = e.pageX;\n\n this.requestAnimationFrame(() => {\n this.contentViewChild.nativeElement.scrollLeft += deltaX / this.scrollXRatio;\n });\n }\n\n onMouseMoveForYBar(e: MouseEvent) {\n let deltaY = e.pageY - this.lastPageY;\n this.lastPageY = e.pageY;\n\n this.requestAnimationFrame(() => {\n this.contentViewChild.nativeElement.scrollTop += deltaY / this.scrollYRatio;\n });\n }\n\n scrollTop(scrollTop: number) {\n let scrollableHeight = this.contentViewChild.nativeElement.scrollHeight - this.contentViewChild.nativeElement.clientHeight;\n scrollTop = scrollTop > scrollableHeight ? scrollableHeight : scrollTop > 0 ? scrollTop : 0;\n this.contentViewChild.nativeElement.scrollTop = scrollTop;\n }\n\n onDocumentMouseUp(e: Event) {\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');\n\n document.removeEventListener('mousemove', this.onDocumentMouseMove);\n document.removeEventListener('mouseup', this.onDocumentMouseUp);\n this.isXBarClicked = false;\n this.isYBarClicked = false;\n }\n\n requestAnimationFrame(f: Function) {\n let frame = window.requestAnimationFrame ||Â this.timeoutFrame;\n frame(f);\n }\n\n ngOnDestroy() {\n if (this.initialized) {\n window.removeEventListener('resize', this.moveBar);\n this.contentViewChild.nativeElement.removeEventListener('scroll', this.moveBar);\n this.contentViewChild.nativeElement.removeEventListener('mouseenter', this.moveBar);\n this.xBarViewChild.nativeElement.removeEventListener('mousedown', this.onXBarMouseDown);\n this.yBarViewChild.nativeElement.removeEventListener('mousedown', this.onYBarMouseDown);\n }\n }\n\n refresh() {\n this.moveBar();\n }\n\n}\n\n@NgModule({\n imports: [CommonModule],\n exports: [ScrollPanel],\n declarations: [ScrollPanel]\n})\nexport class ScrollPanelModule { }\n"]} |