UNPKG

16 kBJavaScriptView Raw
1!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports,require("@angular/core"),require("primeng/api"),require("@angular/common"),require("primeng/utils")):"function"==typeof define&&define.amd?define("primeng/carousel",["exports","@angular/core","primeng/api","@angular/common","primeng/utils"],e):e(((t=t||self).primeng=t.primeng||{},t.primeng.carousel={}),t.ng.core,t.primeng.api,t.ng.common,t.primeng.utils)}(this,(function(t,e,i,n,s){"use strict";var o=this&&this.__decorate||function(t,e,i,n){var s,o=arguments.length,a=o<3?e:null===n?n=Object.getOwnPropertyDescriptor(e,i):n;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)a=Reflect.decorate(t,e,i,n);else for(var r=t.length-1;r>=0;r--)(s=t[r])&&(a=(o<3?s(a):o>3?s(e,i,a):s(e,i))||a);return o>3&&a&&Object.defineProperty(e,i,a),a},a=this&&this.__read||function(t,e){var i="function"==typeof Symbol&&t[Symbol.iterator];if(!i)return t;var n,s,o=i.call(t),a=[];try{for(;(void 0===e||e-- >0)&&!(n=o.next()).done;)a.push(n.value)}catch(t){s={error:t}}finally{try{n&&!n.done&&(i=o.return)&&i.call(o)}finally{if(s)throw s.error}}return a},r=this&&this.__spread||function(){for(var t=[],e=0;e<arguments.length;e++)t=t.concat(a(arguments[e]));return t},l=function(){function t(t,i){this.el=t,this.zone=i,this.orientation="horizontal",this.verticalViewPortHeight="300px",this.contentClass="",this.dotsContainerClass="",this.circular=!1,this.autoplayInterval=0,this.onPage=new e.EventEmitter,this._numVisible=1,this._numScroll=1,this._oldNumScroll=0,this.prevState={numScroll:0,numVisible:0,value:[]},this.defaultNumScroll=1,this.defaultNumVisible=1,this._page=0,this.isRemainingItemsAdded=!1,this.remainingItems=0,this.swipeThreshold=20,this.totalShiftedItems=this.page*this.numScroll*-1}return Object.defineProperty(t.prototype,"page",{get:function(){return this._page},set:function(t){this.isCreated&&t!==this._page&&(this.autoplayInterval&&(this.stopAutoplay(),this.allowAutoplay=!1),t>this._page&&t<this.totalDots()-1?this.step(-1,t):t<this._page&&0!==t&&this.step(1,t)),this._page=t},enumerable:!0,configurable:!0}),Object.defineProperty(t.prototype,"numVisible",{get:function(){return this._numVisible},set:function(t){this._numVisible=t},enumerable:!0,configurable:!0}),Object.defineProperty(t.prototype,"numScroll",{get:function(){return this._numVisible},set:function(t){this._numScroll=t},enumerable:!0,configurable:!0}),Object.defineProperty(t.prototype,"value",{get:function(){return this._value},set:function(t){this._value=t,this.circular&&this._value&&this.setCloneItems()},enumerable:!0,configurable:!0}),t.prototype.ngAfterContentInit=function(){var t=this;this.id=s.UniqueComponentId(),this.allowAutoplay=!!this.autoplayInterval,this.circular&&this.setCloneItems(),this.responsiveOptions&&(this.defaultNumScroll=this._numScroll,this.defaultNumVisible=this._numVisible),this.createStyle(),this.calculatePosition(),this.responsiveOptions&&this.bindDocumentListeners(),this.templates.forEach((function(e){switch(e.getType()){case"item":default:t.itemTemplate=e.template}}))},t.prototype.ngAfterContentChecked=function(){var t=this.isCircular(),e=this.totalShiftedItems;if(this.value&&(this.prevState.numScroll!==this._numScroll||this.prevState.numVisible!==this._numVisible||this.prevState.value.length!==this.value.length)){this.autoplayInterval&&this.stopAutoplay(),this.remainingItems=(this.value.length-this._numVisible)%this._numScroll;var i=this._page;0!==this.totalDots()&&i>=this.totalDots()&&(i=this.totalDots()-1,this._page=i,this.onPage.emit({page:this.page})),e=i*this._numScroll*-1,t&&(e-=this._numVisible),i===this.totalDots()-1&&this.remainingItems>0?(e+=-1*this.remainingItems+this._numScroll,this.isRemainingItemsAdded=!0):this.isRemainingItemsAdded=!1,e!==this.totalShiftedItems&&(this.totalShiftedItems=e),this._oldNumScroll=this._numScroll,this.prevState.numScroll=this._numScroll,this.prevState.numVisible=this._numVisible,this.prevState.value=this._value,this.totalDots()>0&&this.itemsContainer&&this.itemsContainer.nativeElement&&(this.itemsContainer.nativeElement.style.transform=this.isVertical()?"translate3d(0, "+e*(100/this._numVisible)+"%, 0)":"translate3d("+e*(100/this._numVisible)+"%, 0, 0)"),this.isCreated=!0,this.autoplayInterval&&this.isAutoplay()&&this.startAutoplay()}t&&(0===this.page?e=-1*this._numVisible:0===e&&(e=-1*this.value.length,this.remainingItems>0&&(this.isRemainingItemsAdded=!0)),e!==this.totalShiftedItems&&(this.totalShiftedItems=e))},t.prototype.createStyle=function(){this.carouselStyle||(this.carouselStyle=document.createElement("style"),this.carouselStyle.type="text/css",document.body.appendChild(this.carouselStyle));var t="\n #"+this.id+" .ui-carousel-item {\n\t\t\t\tflex: 1 0 "+100/this.numVisible+"%\n\t\t\t}\n ";if(this.responsiveOptions){this.responsiveOptions.sort((function(t,e){var i=t.breakpoint,n=e.breakpoint;return-1*(null==i&&null!=n?-1:null!=i&&null==n?1:null==i&&null==n?0:"string"==typeof i&&"string"==typeof n?i.localeCompare(n,void 0,{numeric:!0}):i<n?-1:i>n?1:0)}));for(var e=0;e<this.responsiveOptions.length;e++){var i=this.responsiveOptions[e];t+="\n @media screen and (max-width: "+i.breakpoint+") {\n #"+this.id+" .ui-carousel-item {\n flex: 1 0 "+100/i.numVisible+"%\n }\n }\n "}}this.carouselStyle.innerHTML=t},t.prototype.calculatePosition=function(){if(this.itemsContainer&&this.responsiveOptions){for(var t=window.innerWidth,e={numVisible:this.defaultNumVisible,numScroll:this.defaultNumScroll},i=0;i<this.responsiveOptions.length;i++){var n=this.responsiveOptions[i];parseInt(n.breakpoint,10)>=t&&(e=n)}if(this._numScroll!==e.numScroll){var s=this._page;s=Math.floor(s*this._numScroll/e.numScroll);var o=e.numScroll*this.page*-1;this.isCircular()&&(o-=e.numVisible),this.totalShiftedItems=o,this._numScroll=e.numScroll,this._page=s,this.onPage.emit({page:this.page})}this._numVisible!==e.numVisible&&(this._numVisible=e.numVisible,this.setCloneItems())}},t.prototype.setCloneItems=function(){var t,e;this.clonedItemsForStarting=[],this.clonedItemsForFinishing=[],this.isCircular()&&((t=this.clonedItemsForStarting).push.apply(t,r(this.value.slice(-1*this._numVisible))),(e=this.clonedItemsForFinishing).push.apply(e,r(this.value.slice(0,this._numVisible))))},t.prototype.firstIndex=function(){return this.isCircular()?-1*(this.totalShiftedItems+this.numVisible):-1*this.totalShiftedItems},t.prototype.lastIndex=function(){return this.firstIndex()+this.numVisible-1},t.prototype.totalDots=function(){return this.value?Math.ceil((this.value.length-this._numVisible)/this._numScroll)+1:0},t.prototype.totalDotsArray=function(){var t=this.totalDots();return t<=0?[]:Array(t).fill(0)},t.prototype.containerClass=function(){return{"ui-carousel ui-widget":!0,"ui-carousel-vertical":this.isVertical(),"ui-carousel-horizontal":!this.isVertical()}},t.prototype.contentClasses=function(){return"ui-carousel-content "+this.contentClass},t.prototype.dotsContentClasses=function(){return"ui-carousel-dots-container ui-helper-reset "+this.dotsContainerClass},t.prototype.isVertical=function(){return"vertical"===this.orientation},t.prototype.isCircular=function(){return this.circular&&this.value&&this.value.length>=this.numVisible},t.prototype.isAutoplay=function(){return this.autoplayInterval&&this.allowAutoplay},t.prototype.isForwardNavDisabled=function(){return this.isEmpty()||this._page>=this.totalDots()-1&&!this.isCircular()},t.prototype.isBackwardNavDisabled=function(){return this.isEmpty()||this._page<=0&&!this.isCircular()},t.prototype.isEmpty=function(){return!this.value||0===this.value.length},t.prototype.navForward=function(t,e){(this.isCircular()||this._page<this.totalDots()-1)&&this.step(-1,e),this.autoplayInterval&&(this.stopAutoplay(),this.allowAutoplay=!1),t&&t.cancelable&&t.preventDefault()},t.prototype.navBackward=function(t,e){(this.isCircular()||0!==this._page)&&this.step(1,e),this.autoplayInterval&&(this.stopAutoplay(),this.allowAutoplay=!1),t&&t.cancelable&&t.preventDefault()},t.prototype.onDotClick=function(t,e){var i=this._page;this.autoplayInterval&&(this.stopAutoplay(),this.allowAutoplay=!1),e>i?this.navForward(t,e):e<i&&this.navBackward(t,e)},t.prototype.step=function(t,e){var i=this.totalShiftedItems,n=this.isCircular();if(null!=e)i=this._numScroll*e*-1,n&&(i-=this._numVisible),this.isRemainingItemsAdded=!1;else{i+=this._numScroll*t,this.isRemainingItemsAdded&&(i+=this.remainingItems-this._numScroll*t,this.isRemainingItemsAdded=!1);var s=n?i+this._numVisible:i;e=Math.abs(Math.floor(s/this._numScroll))}n&&this.page===this.totalDots()-1&&-1===t?(i=-1*(this.value.length+this._numVisible),e=0):n&&0===this.page&&1===t?(i=0,e=this.totalDots()-1):e===this.totalDots()-1&&this.remainingItems>0&&(i+=-1*this.remainingItems-this._numScroll*t,this.isRemainingItemsAdded=!0),this.itemsContainer&&(this.itemsContainer.nativeElement.style.transform=this.isVertical()?"translate3d(0, "+i*(100/this._numVisible)+"%, 0)":"translate3d("+i*(100/this._numVisible)+"%, 0, 0)",this.itemsContainer.nativeElement.style.transition="transform 500ms ease 0s"),this.totalShiftedItems=i,this._page=e,this.onPage.emit({page:this.page})},t.prototype.startAutoplay=function(){var t=this;this.interval=setInterval((function(){t.totalDots()>0&&(t.page===t.totalDots()-1?t.step(-1,0):t.step(-1,t.page+1))}),this.autoplayInterval)},t.prototype.stopAutoplay=function(){this.interval&&clearInterval(this.interval)},t.prototype.onTransitionEnd=function(){this.itemsContainer&&(this.itemsContainer.nativeElement.style.transition="",0!==this.page&&this.page!==this.totalDots()-1||!this.isCircular()||(this.itemsContainer.nativeElement.style.transform=this.isVertical()?"translate3d(0, "+this.totalShiftedItems*(100/this._numVisible)+"%, 0)":"translate3d("+this.totalShiftedItems*(100/this._numVisible)+"%, 0, 0)"))},t.prototype.onTouchStart=function(t){var e=t.changedTouches[0];this.startPos={x:e.pageX,y:e.pageY}},t.prototype.onTouchMove=function(t){t.cancelable&&t.preventDefault()},t.prototype.onTouchEnd=function(t){var e=t.changedTouches[0];this.isVertical()?this.changePageOnTouch(t,e.pageY-this.startPos.y):this.changePageOnTouch(t,e.pageX-this.startPos.x)},t.prototype.changePageOnTouch=function(t,e){Math.abs(e)>this.swipeThreshold&&(e<0?this.navForward(t):this.navBackward(t))},t.prototype.bindDocumentListeners=function(){var t=this;this.documentResizeListener||(this.documentResizeListener=function(e){t.calculatePosition()},window.addEventListener("resize",this.documentResizeListener))},t.prototype.unbindDocumentListeners=function(){this.documentResizeListener&&(window.removeEventListener("resize",this.documentResizeListener),this.documentResizeListener=null)},t.prototype.ngOnDestroy=function(){this.responsiveOptions&&this.unbindDocumentListeners(),this.autoplayInterval&&this.stopAutoplay()},t.ctorParameters=function(){return[{type:e.ElementRef},{type:e.NgZone}]},o([e.Input()],t.prototype,"page",null),o([e.Input()],t.prototype,"numVisible",null),o([e.Input()],t.prototype,"numScroll",null),o([e.Input()],t.prototype,"responsiveOptions",void 0),o([e.Input()],t.prototype,"orientation",void 0),o([e.Input()],t.prototype,"verticalViewPortHeight",void 0),o([e.Input()],t.prototype,"contentClass",void 0),o([e.Input()],t.prototype,"dotsContainerClass",void 0),o([e.Input()],t.prototype,"value",null),o([e.Input()],t.prototype,"circular",void 0),o([e.Input()],t.prototype,"autoplayInterval",void 0),o([e.Input()],t.prototype,"style",void 0),o([e.Input()],t.prototype,"styleClass",void 0),o([e.Output()],t.prototype,"onPage",void 0),o([e.ViewChild("itemsContainer")],t.prototype,"itemsContainer",void 0),o([e.ContentChild(i.Header)],t.prototype,"headerFacet",void 0),o([e.ContentChild(i.Footer)],t.prototype,"footerFacet",void 0),o([e.ContentChildren(i.PrimeTemplate)],t.prototype,"templates",void 0),t=o([e.Component({selector:"p-carousel",template:'\n\t\t<div [attr.id]="id" [ngClass]="containerClass()" [ngStyle]="style" [class]="styleClass">\n\t\t\t<div class="ui-carousel-header" *ngIf="headerFacet">\n\t\t\t\t<ng-content select="p-header"></ng-content>\n\t\t\t</div>\n\t\t\t<div [class]="contentClasses()">\n\t\t\t\t<div class="ui-carousel-container">\n\t\t\t\t\t<button [ngClass]="{\'ui-carousel-prev ui-button ui-widget ui-state-default ui-corner-all\':true, \'ui-state-disabled\': isBackwardNavDisabled()}" [disabled]="isBackwardNavDisabled()" (click)="navBackward($event)">\n\t\t\t\t\t\t<span [ngClass]="{\'ui-carousel-prev-icon pi\': true, \'pi-chevron-left\': !isVertical(), \'pi-chevron-up\': isVertical()}"></span>\n\t\t\t\t\t</button>\n\t\t\t\t\t<div class="ui-carousel-items-content" [ngStyle]="{\'height\': isVertical() ? verticalViewPortHeight : \'auto\'}">\n\t\t\t\t\t\t<div #itemsContainer class="ui-carousel-items-container" (transitionend)="onTransitionEnd()" (touchend)="onTouchEnd($event)" (touchstart)="onTouchStart($event)" (touchmove)="onTouchMove($event)">\n\t\t\t\t\t\t\t<div *ngFor="let item of clonedItemsForStarting; let index = index" [ngClass]= "{\'ui-carousel-item ui-carousel-item-cloned\': true,\'ui-carousel-item-active\': (totalShiftedItems * -1) === (value.length),\n\t\t\t\t\t\t\t\'ui-carousel-item-start\': 0 === index,\n\t\t\t\t\t\t\t\'ui-carousel-item-end\': (clonedItemsForStarting.length - 1) === index}">\n\t\t\t\t\t\t\t\t<ng-container *ngTemplateOutlet="itemTemplate; context: {$implicit: item}"></ng-container>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t<div *ngFor="let item of value; let index = index" [ngClass]= "{\'ui-carousel-item\': true,\'ui-carousel-item-active\': (firstIndex() <= index && lastIndex() >= index),\n\t\t\t\t\t\t\t\'ui-carousel-item-start\': firstIndex() === index,\n\t\t\t\t\t\t\t\'ui-carousel-item-end\': lastIndex() === index}">\n\t\t\t\t\t\t\t\t<ng-container *ngTemplateOutlet="itemTemplate; context: {$implicit: item}"></ng-container>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t<div *ngFor="let item of clonedItemsForFinishing; let index = index" [ngClass]= "{\'ui-carousel-item ui-carousel-item-cloned\': true,\'ui-carousel-item-active\': ((totalShiftedItems *-1) === numVisible),\n\t\t\t\t\t\t\t\'ui-carousel-item-start\': 0 === index,\n\t\t\t\t\t\t\t\'ui-carousel-item-end\': (clonedItemsForFinishing.length - 1) === index}">\n\t\t\t\t\t\t\t\t<ng-container *ngTemplateOutlet="itemTemplate; context: {$implicit: item}"></ng-container>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</div>\n\t\t\t\t\t<button [ngClass]="{\'ui-carousel-next ui-button ui-widget ui-state-default ui-corner-all\': true, \'ui-state-disabled\': isForwardNavDisabled()}" [disabled]="isForwardNavDisabled()" (click)="navForward($event)">\n\t\t\t\t\t\t<span [ngClass]="{\'ui-carousel-next-icon pi\': true, \'pi-chevron-right\': !isVertical(), \'pi-chevron-down\': isVertical()}"></span>\n\t\t\t\t\t</button>\n\t\t\t\t</div>\n\t\t\t\t<ul [class]="dotsContentClasses()">\n\t\t\t\t\t<li *ngFor="let totalDot of totalDotsArray(); let i = index" [ngClass]="{\'ui-carousel-dot-item\':true,\'ui-state-highlight\': _page === i}">\n\t\t\t\t\t\t<button class="ui-button ui-widget ui-state-default ui-corner-all" (click)="onDotClick($event, i)">\n\t\t\t\t\t\t\t<span [ngClass]="{\'ui-carousel-dot-icon pi\':true, \'pi-circle-on\': _page === i, \'pi-circle-off\': !(_page === i)}"></span>\n\t\t\t\t\t\t</button>\n\t\t\t\t\t</li>\n\t\t\t\t</ul>\n\t\t\t</div>\n\t\t\t<div class="ui-carousel-footer" *ngIf="footerFacet">\n\t\t\t\t<ng-content select="p-footer"></ng-content>\n\t\t\t</div>\n\t\t</div>\n ',changeDetection:e.ChangeDetectionStrategy.Default})],t)}(),u=function(){function t(){}return t=o([e.NgModule({imports:[n.CommonModule,i.SharedModule],exports:[n.CommonModule,l,i.SharedModule],declarations:[l]})],t)}();t.Carousel=l,t.CarouselModule=u,Object.defineProperty(t,"__esModule",{value:!0})}));
2//# sourceMappingURL=primeng-carousel.umd.min.js.map
\No newline at end of file