UNPKG

ngx-teximate

Version:
2 lines 7.63 kB
!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports,require("@angular/core"),require("@angular/animations"),require("rxjs"),require("rxjs/operators"),require("@angular/common")):"function"==typeof define&&define.amd?define("ngx-teximate",["exports","@angular/core","@angular/animations","rxjs","rxjs/operators","@angular/common"],e):e(t["ngx-teximate"]={},t.ng.core,t.ng.animations,t.rxjs,t.rxjs.operators,t.ng.common)}(this,function(t,i,e,o,a,r){"use strict";var n=function(t,e){return(n=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(t,e){t.__proto__=e}||function(t,e){for(var r in e)e.hasOwnProperty(r)&&(t[r]=e[r])})(t,e)};function s(t,e){function r(){this.constructor=t}n(t,e),t.prototype=null===e?Object.create(e):(r.prototype=e.prototype,new r)}var p=function(){return(p=Object.assign||function(t){for(var e,r=1,n=arguments.length;r<n;r++)for(var i in e=arguments[r])Object.prototype.hasOwnProperty.call(e,i)&&(t[i]=e[i]);return t}).apply(this,arguments)};function u(t,e){var r="function"==typeof Symbol&&t[Symbol.iterator];if(!r)return t;var n,i,o=r.call(t),a=[];try{for(;(void 0===e||0<e--)&&!(n=o.next()).done;)a.push(n.value)}catch(s){i={error:s}}finally{try{n&&!n.done&&(r=o["return"])&&r.call(o)}finally{if(i)throw i.error}}return a}function c(){for(var t=[],e=0;e<arguments.length;e++)t=t.concat(u(arguments[e]));return t}var l=function(){function t(t,e,r){this.animationBuilder=t,this.zone=e,this.el=r,this.playEmitter=new i.EventEmitter,this.finishEmitter=new i.EventEmitter,this.players=new Map,this._state=new o.BehaviorSubject(""),this.state=this._state.pipe(a.map(function(t){return f(t)}))}return Object.defineProperty(t.prototype,"setText",{set:function(t){this._state.next(t)},enumerable:!0,configurable:!0}),Object.defineProperty(t.prototype,"isPlaying",{get:function(){return this._isPlaying},enumerable:!0,configurable:!0}),Object.defineProperty(t.prototype,"enterPlayer",{get:function(){return this.players.get("enter")},enumerable:!0,configurable:!0}),Object.defineProperty(t.prototype,"leavePlayer",{get:function(){return this.players.get("leave")},enumerable:!0,configurable:!0}),Object.defineProperty(t.prototype,"defaultPlayer",{get:function(){return this.players.get("default")},enumerable:!0,configurable:!0}),t.prototype.ngAfterViewInit=function(){this._isViewInit=!0,this.updateAnimations(!0)},t.prototype.ngOnChanges=function(){this._isViewInit&&this.updateAnimations()},t.prototype.ngOnDestroy=function(){this.players.has("enter")&&this.players.get("enter").destroy(),this.players.has("leave")&&this.players.get("leave").destroy(),this.players.has("default")&&this.players.get("default").destroy()},t.prototype.registerAnimation=function(t){var e=this,r=this.buildAnimation(t).create(this.el.nativeElement);return r.onStart(function(){e._isPlaying=!0,e.playEmitter.emit(t.id)}),r.onDone(function(){e._isPlaying=!1,e.finishEmitter.emit(t.id)}),this.players.set(t.id,r).get(t.id)},t.prototype.updateAnimations=function(e){var r=this;this.zone.runOutsideAngular(function(){if(r.enter){var t=r.registerAnimation(p({},r.enter,{id:"enter",isEnter:!0}));e&&t.play()}r.leave&&r.registerAnimation(p({},r.leave,{id:"leave"})),r.animation&&r.registerAnimation(p({id:"default"},r.animation))})},t.prototype.buildAnimation=function(t){return this.animationBuilder.build([e.query(".teximate-"+t.type,[e.style({opacity:t.isEnter?0:1}),e.stagger(t.delay,[e.useAnimation(t.animation)])])])},t.decorators=[{type:i.Component,args:[{selector:"teximate",host:{"aria-label":"text"},template:'<p *ngFor="let paragraph of state | async; index as i"\r\n class="teximate-paragraph teximate-paragraph-{{i}}">\r\n\r\n <span *ngFor="let word of paragraph; index as j"\r\n class="teximate-word teximate-word-{{j}}">\r\n\r\n <span *ngFor="let letter of word; index as k"\r\n class="teximate-letter teximate-letter-{{k}}">\r\n {{letter}}\r\n </span>\r\n </span>\r\n</p>\r\n',changeDetection:i.ChangeDetectionStrategy.OnPush,styles:[".teximate-letter,.teximate-word{display:inline-block}.teximate-word{margin-right:8px}"]}]}],t.ctorParameters=function(){return[{type:e.AnimationBuilder},{type:i.NgZone},{type:i.ElementRef}]},t.propDecorators={setText:[{type:i.Input,args:["text"]}],enter:[{type:i.Input}],leave:[{type:i.Input}],animation:[{type:i.Input}],playEmitter:[{type:i.Output,args:["play"]}],finishEmitter:[{type:i.Output,args:["finish"]}]},t}();function f(t){var r=[];return t.split("\n").map(function(t){var e=[];t.split(" ").filter(function(t){return""!==t}).map(function(t){return e.push(t.split(/(?!$)/u))}),r.push(e)}),r}var m=function(){function t(t,e){this.element=t,this.teximate=e,this.events=o.Subscription.EMPTY,this.click=new i.EventEmitter,this.hover=new i.EventEmitter}return t.prototype.ngAfterViewInit=function(){var i=this;this.events=this.teximate.state.pipe(a.filter(function(){return!!i.click.observers.length||!!i.hover.observers.length}),a.switchMap(function(){var t=o.of(null),e=o.of(null),r=i.element.nativeElement.querySelectorAll(i.selector);if(i.click.observers.length){var n=Array.from(r).map(function(t){return o.fromEvent(t,"click")});t=o.merge.apply(void 0,c(n)).pipe(a.tap(function(t){return i.click.emit(t)}))}if(i.hover.observers.length){n=Array.from(r).map(function(t){return o.fromEvent(t,"mouseenter")});e=o.merge.apply(void 0,c(n)).pipe(a.tap(function(t){return i.hover.emit(t)}))}return o.merge(t,e)})).subscribe()},t.prototype.ngOnDestroy=function(){this.events.unsubscribe()},t.ctorParameters=function(){return[{type:i.ElementRef},{type:l,decorators:[{type:i.Inject,args:[i.forwardRef(function(){return l})]}]}]},t.propDecorators={click:[{type:i.Output,args:[""]}],hover:[{type:i.Output,args:[""]}]},t}(),y=function(n){function t(t,e){var r=n.call(this,t,e)||this;return r.click=new i.EventEmitter,r.hover=new i.EventEmitter,r.selector=".teximate-paragraph",r}return s(t,n),t.decorators=[{type:i.Directive,args:[{selector:"teximate[paragraphClick], teximate[paragraphHover]"}]}],t.ctorParameters=function(){return[{type:i.ElementRef},{type:l,decorators:[{type:i.Inject,args:[i.forwardRef(function(){return l})]}]}]},t.propDecorators={click:[{type:i.Output,args:["paragraphClick"]}],hover:[{type:i.Output,args:["paragraphHover"]}]},t}(m),h=function(n){function t(t,e){var r=n.call(this,t,e)||this;return r.click=new i.EventEmitter,r.hover=new i.EventEmitter,r.selector=".teximate-word",r}return s(t,n),t.decorators=[{type:i.Directive,args:[{selector:"teximate[wordClick], teximate[wordHover]"}]}],t.ctorParameters=function(){return[{type:i.ElementRef},{type:l,decorators:[{type:i.Inject,args:[i.forwardRef(function(){return l})]}]}]},t.propDecorators={click:[{type:i.Output,args:["wordClick"]}],hover:[{type:i.Output,args:["wordHover"]}]},t}(m),g=function(n){function t(t,e){var r=n.call(this,t,e)||this;return r.click=new i.EventEmitter,r.hover=new i.EventEmitter,r.selector=".teximate-letter",r}return s(t,n),t.decorators=[{type:i.Directive,args:[{selector:"teximate[letterClick], teximate[letterHover]"}]}],t.ctorParameters=function(){return[{type:i.ElementRef},{type:l,decorators:[{type:i.Inject,args:[i.forwardRef(function(){return l})]}]}]},t.propDecorators={click:[{type:i.Output,args:["letterClick"]}],hover:[{type:i.Output,args:["letterHover"]}]},t}(m),d=function(){function t(){}return t.decorators=[{type:i.NgModule,args:[{imports:[r.CommonModule],declarations:[l,y,h,g],exports:[l,y,h,g]}]}],t}();t.teximateFactory=f,t.Teximate=l,t.TeximateModule=d,t.ɵd=g,t.ɵb=y,t.ɵa=m,t.ɵc=h,Object.defineProperty(t,"__esModule",{value:!0})}); //# sourceMappingURL=ngx-teximate.umd.min.js.map