ng-gallery
Advanced tools
Comparing version 0.6.2 to 0.6.3
@@ -1,1 +0,1 @@ | ||
!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("@angular/core"),require("@angular/common"),require("rxjs/BehaviorSubject"),require("rxjs/Observable"),require("rxjs/Subject"),require("rxjs/add/observable/of"),require("rxjs/add/operator/switchMap"),require("rxjs/add/operator/finally"),require("rxjs/add/operator/take"),require("rxjs/add/operator/do"),require("@angular/animations"),require("rxjs/add/observable/fromEvent"),require("rxjs/add/observable/from")):"function"==typeof define&&define.amd?define(["exports","@angular/core","@angular/common","rxjs/BehaviorSubject","rxjs/Observable","rxjs/Subject","rxjs/add/observable/of","rxjs/add/operator/switchMap","rxjs/add/operator/finally","rxjs/add/operator/take","rxjs/add/operator/do","@angular/animations","rxjs/add/observable/fromEvent","rxjs/add/observable/from"],t):t(e.ngGallery=e.ngGallery||{},e.ng.core,e.ng.common,e.Rx,e.Rx,e.Rx,e.Rx.Observable,e.Rx.Observable.prototype,e.Rx.Observable.prototype,e.Rx.Observable.prototype,e.Rx.Observable.prototype,e.ng.common)}(this,function(e,t,n,i,r,a,o,s,l,c,g,d){"use strict";function p(e){return new h(e)}var y={images:void 0,prevIndex:0,currIndex:0,hasNext:void 0,hasPrev:void 0,active:!1},m={style:{background:"#121519",width:"900px",height:"500px"},animation:"fade",loader:{width:"50px",height:"50px",position:"center",icon:"oval"},description:{position:"bottom",overlay:!1,text:!0,counter:!0,style:{color:"red"}},bullets:!1,player:{autoplay:!1,speed:3e3},thumbnails:{width:120,height:90,position:"left",space:30}},u=require("../../Observable"),b=require("../../observable/interval");u.Observable.interval=b.interval;var f=require("../../Observable"),x=require("../../operator/takeWhile");f.Observable.prototype.takeWhile=x.takeWhile;var h=function(){function e(e){var t=this;this.config=m,this.state=new i.BehaviorSubject(y),this.config=Object.assign({},m,e),this.player=new a.Subject,this.player.switchMap(function(e){return e?t.playerEngine(e):r.Observable.of(null)}).subscribe()}return e.prototype.load=function(e){this.state.next({images:e,currIndex:0,hasNext:e.length>1,hasPrev:!1,active:!1})},e.prototype.set=function(e){var t=this.state.getValue();this.state.next(Object.assign({},t,{prevIndex:t.currIndex,currIndex:e,hasNext:e<t.images.length-1,hasPrev:e>0,active:!0}))},e.prototype.next=function(){var e=this.state.getValue();if(e.hasNext){var t=e.currIndex+1;this.set(t)}else this.set(0)},e.prototype.prev=function(){var e=this.state.getValue();if(e.hasPrev){var t=e.currIndex-1;this.set(t)}else this.set(e.images.length-1)},e.prototype.close=function(){var e=this.state.getValue();this.state.next(Object.assign({},e,{active:!1,play:!1})),this.stop()},e.prototype.reset=function(){this.state.next(y),this.stop()},e.prototype.play=function(e){var t=e||this.config.player.speed||2e3;console.log("play",t);var n=this.state.getValue();this.state.next(Object.assign({},n,{play:!0,active:!0})),this.player.next(t)},e.prototype.stop=function(){this.player.next(0)},e.prototype.playerEngine=function(e){var t=this;return r.Observable.interval(e).takeWhile(function(){return t.state.getValue().play}).do(function(){t.next()}).finally(function(){t.state.next(Object.assign({},t.state.getValue(),{play:!1}))})},e}();h.decorators=[{type:t.Injectable}],h.ctorParameters=function(){return[{type:void 0,decorators:[{type:t.Optional}]}]};var v=function(){function e(e){this.gallery=e}return e.prototype.ngOnDestroy=function(){this.gallery.reset()},e}();v.decorators=[{type:t.Component,args:[{selector:"gallery",template:'<gallery-main *ngIf="gallery.state | async as state" [state]="state" [config]="gallery.config"></gallery-main>',changeDetection:t.ChangeDetectionStrategy.OnPush,styles:["\n gallery-main{display:-webkit-box;display:-ms-flexbox;display:flex;height:500px}\n "]}]}],v.ctorParameters=function(){return[{type:h}]};var w=function(){function e(e){this.gallery=e}return e}();w.decorators=[{type:t.Component,args:[{selector:"gallery-nav",template:'\n <div *ngIf="state.images.length > 1" class="g-nav">\n\n <div class="g-nav-prev" (click)="gallery.prev()">\n <i class="prev-arrow-ico"></i>\n </div>\n\n <div class="g-nav-next" (click)="gallery.next()">\n <i class="next-arrow-ico"></i>\n </div>\n\n </div>\n ',styles:["\n *{box-sizing:border-box}:host{z-index:1;position:absolute;left:0;right:0;top:0;bottom:0;display:-webkit-box;display:-ms-flexbox;display:flex}@media (max-width:480px){:host{display:none}}.g-nav{-webkit-box-flex:1;-ms-flex:1;flex:1;height:100%;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;opacity:0;-webkit-transition:all .4s linear;transition:all .4s linear;cursor:pointer}.g-nav:hover{opacity:1}.g-nav-next,.g-nav-prev{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;height:100%;opacity:.7;position:relative;overflow:hidden;-webkit-transition:all .2s ease;transition:all .2s ease;z-index:0}.g-nav-next:hover,.g-nav-prev:hover{opacity:1}.g-nav-next{padding-right:.7em;-webkit-box-flex:1;-ms-flex:1;flex:1;-webkit-box-pack:end;-ms-flex-pack:end;justify-content:flex-end}.g-nav-prev{padding-left:.7em;width:20%}.next-arrow-ico,.prev-arrow-ico{width:45px;height:80px}.next-arrow-ico{background:url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iaXNvLTg4NTktMSI/PiAgPHN2ZyB2ZXJzaW9uPSIxLjEiIGlkPSJMYXllcl8xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4PSIwcHgiIHk9IjBweCIgdmlld0JveD0iMCAwIDQxNC40OTYgNDE0LjQ5NiIgc3R5bGU9ImVuYWJsZS1iYWNrZ3JvdW5kOm5ldyAwIDAgNDE0LjQ5NiA0MTQuNDk2OyIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI+IDxkZWZzIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGZpbHRlciBpZD0iZHJvcHNoYWRvdyIgPiAgPGZlR2F1c3NpYW5CbHVyIGluPSJTb3VyY2VBbHBoYSIgc3RkRGV2aWF0aW9uPSIzIi8+ICAgPGZlT2Zmc2V0IGR4PSIyIiBkeT0iMiIgcmVzdWx0PSJvZmZzZXRibHVyIi8+ICAgPGZlTWVyZ2U+IDxmZU1lcmdlTm9kZS8+PGZlTWVyZ2VOb2RlIGluPSJTb3VyY2VHcmFwaGljIi8+ICAgPC9mZU1lcmdlPjwvZmlsdGVyPjwvZGVmcz4gIDxwb2x5Z29uIHN0eWxlPSJmaWxsOiNmZmY7IiBmaWx0ZXI9InVybCgjZHJvcHNoYWRvdykiIHBvaW50cz0iMTE4LjEyNiwwIDg5Ljc5NiwyOC4yMzggMjY4LjIyMywyMDcuMjQ4IDg5Ljc5NiwzODYuMjU4IDExOC4xMjYsNDE0LjQ5NiAzMjQuNywyMDcuMjQ4ICIvPjwvc3ZnPg==) no-repeat 50%}.prev-arrow-ico{background:url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iaXNvLTg4NTktMSI/PjxzdmcgdmVyc2lvbj0iMS4xIiBpZD0iTGF5ZXJfMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgeD0iMHB4IiB5PSIwcHgiIHZpZXdCb3g9IjAgMCA0MTQuNDk2IDQxNC40OTYiIHN0eWxlPSJlbmFibGUtYmFja2dyb3VuZDpuZXcgMCAwIDQxNC40OTYgNDE0LjQ5NjsiIHhtbDpzcGFjZT0icHJlc2VydmUiPjxkZWZzIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGZpbHRlciBpZD0iZHJvcHNoYWRvdyIgPiAgPGZlR2F1c3NpYW5CbHVyIGluPSJTb3VyY2VBbHBoYSIgc3RkRGV2aWF0aW9uPSIzIi8+ICAgPGZlT2Zmc2V0IGR4PSIyIiBkeT0iMiIgcmVzdWx0PSJvZmZzZXRibHVyIi8+ICAgPGZlTWVyZ2U+IDxmZU1lcmdlTm9kZS8+PGZlTWVyZ2VOb2RlIGluPSJTb3VyY2VHcmFwaGljIi8+ICAgPC9mZU1lcmdlPjwvZmlsdGVyPjwvZGVmcz48cG9seWdvbiBzdHlsZT0iZmlsbDojZmZmOyIgZmlsdGVyPSJ1cmwoI2Ryb3BzaGFkb3cpIiBwb2ludHM9IjMyNC43LDI4LjIzOCAyOTYuMzcsMCA4OS43OTYsMjA3LjI0OCAyOTYuMzcsNDE0LjQ5NiAzMjQuNywzODYuMjU4IDE0Ni4yNzMsMjA3LjI0OCAiLz48L3N2Zz4=) no-repeat 50%}\n "],changeDetection:t.ChangeDetectionStrategy.OnPush}]}],w.ctorParameters=function(){return[{type:h}]},w.propDecorators={state:[{type:t.Input}]};var I=function(){function e(e,t,n){this.gallery=e,this.el=t,this.renderer=n}return e.prototype.ngOnInit=function(){var e=this;if(this.contStyle=this.getContainerStyle(),this.gallery.config.gestures){if("undefined"==typeof Hammer)throw Error("[NgGallery]: HammerJS is undefined, make sure it is loaded");var t=this.el.nativeElement,n=new Hammer(t);n.on("panstart",function(){e.renderer.removeClass(t,"g-pan-reset")}),n.on("panend",function(){e.renderer.addClass(t,"g-pan-reset")}),n.on("pan",function(n){e.renderer.setStyle(t,"transform","translate3d("+n.deltaX+"px, 0px, 0px)")}),n.on("swipeleft",function(){e.gallery.next()}),n.on("swiperight",function(){e.gallery.prev()})}},e.prototype.translateThumbs=function(){return"translate3d("+-(this.state.currIndex*this.config.width+this.config.width/2)+"px, 0, 0)"},e.prototype.getContainerStyle=function(){var e="top"===this.config.position?0:2;return this.renderer.setStyle(this.el.nativeElement,"order",e),{height:this.config.height+"px",margin:this.config.space+"px"}},e.prototype.getThumbImage=function(e){return"url("+(this.state.images[e].thumbnail||this.state.images[e].src)+")"},e}();I.decorators=[{type:t.Component,args:[{selector:"gallery-thumb",template:'\n <div #container class="g-thumb-container" [ngStyle]="contStyle">\n\n <div class="g-thumbs" [style.transform]="translateThumbs()">\n\n <div class="g-thumb" *ngFor="let image of state.images; let i = index"\n [class.g-thumb-current]="i === state.currIndex"\n [style.width.px]="gallery.config.thumbnails.width"\n [style.height.px]="gallery.config.thumbnails.height">\n\n <div class="g-thumb-image" [style.backgroundImage]="getThumbImage(i)"\n [tap] (tapClick)="gallery.set(i)">\n </div>\n </div>\n\n </div>\n\n </div>\n ',styles:["\n :host{display:block;z-index:1}.g-thumb-container{position:relative;z-index:2;width:100%;height:100%;left:0}.g-thumb-container,.g-thumbs{top:0;display:-webkit-box;display:-ms-flexbox;display:flex}.g-thumbs{position:absolute;left:50%;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-transition:-webkit-transform .3s ease-in;transition:-webkit-transform .3s ease-in;transition:transform .3s ease-in;transition:transform .3s ease-in,-webkit-transform .3s ease-in;-webkit-transform:translateZ(0);transform:translateZ(0)}.g-thumb{padding:8px;opacity:.5;-webkit-transition:all .2s linear;transition:all .2s linear}.g-thumb-image{cursor:pointer;width:100%;height:100%;background-position:50%;background-size:cover;box-shadow:0 0 4px rgba(0,0,0,.3)}.g-thumb-current{opacity:1;padding:2px}\n "],changeDetection:t.ChangeDetectionStrategy.OnPush}]}],I.ctorParameters=function(){return[{type:h},{type:t.ElementRef},{type:t.Renderer2}]},I.propDecorators={state:[{type:t.Input}],config:[{type:t.Input}]};var k=function(){function e(e,t){this.el=e,this.renderer=t}return e.prototype.ngOnInit=function(){var e=this.el.nativeElement;this.config.overlay&&this.renderer.setStyle(e,"position","absolute"),"top"===this.config.position?(this.renderer.setStyle(e,"order",0),this.renderer.setStyle(e,"top",0),this.renderer.setStyle(e,"bottom","unset")):(this.renderer.setStyle(e,"order",2),this.renderer.setStyle(e,"top","unset"),this.renderer.setStyle(e,"bottom",0))},e}();k.decorators=[{type:t.Component,args:[{selector:"gallery-text",template:'\n <div class="g-text-container" [ngStyle]="config.style">\n <div *ngIf="config.text" class="g-text" [innerHtml]="state.images[state.currIndex]?.text">\n </div>\n <div *ngIf="config.counter" class="g-number">\n {{(state.currIndex + 1) + \'/\' + state.images.length}}\n </div>\n </div>\n ',styles:["\n *{box-sizing:border-box}:host{position:relative;left:0;right:0;z-index:1}.g-text-container{padding:1em 2em;color:#ccc;font-size:13px;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-ms-flex-line-pack:center;align-content:center;background-clip:padding-box;-webkit-font-smoothing:antialiased}.g-text{-webkit-box-flex:1;-ms-flex:1;flex:1}\n "],changeDetection:t.ChangeDetectionStrategy.OnPush}]}],k.ctorParameters=function(){return[{type:t.ElementRef},{type:t.Renderer2}]},k.propDecorators={state:[{type:t.Input}],config:[{type:t.Input}]};var S=[d.trigger("imgAnimate",[d.state("none",d.style({opacity:1})),d.transition("fade <=> *",[d.style({opacity:0}),d.animate("0.5s ease-in")])])],j=function(){function e(e,t,n){this.gallery=e,this.el=t,this.renderer=n}return e.prototype.ngOnInit=function(){var e=this;if(this.config.gestures){if("undefined"==typeof Hammer)throw Error("[NgGallery]: HammerJS is undefined, make sure it is loaded");var t=this.el.nativeElement,n=new Hammer(t);n.on("panstart",function(){e.renderer.removeClass(t,"g-pan-reset")}),n.on("panend",function(){e.renderer.addClass(t,"g-pan-reset")}),n.on("pan",function(n){e.renderer.setStyle(t,"transform","translate3d("+n.deltaX+"px, 0px, 0px)")}),n.on("swipeleft",function(){e.gallery.next()}),n.on("swiperight",function(){e.gallery.prev()})}},e.prototype.imageLoad=function(e){if(this.loading=!e,e)this.animate="none";else switch(this.config.animation){case"fade":this.animate="fade";break;default:this.animate="none"}},e}();j.decorators=[{type:t.Component,args:[{selector:"gallery-image",template:'\n <div [@imgAnimate]="animate" class="g-image">\n <img [lazyImage]="state.images[state.currIndex].src" (lazyLoad)="imageLoad($event)">\n </div>\n\n <gallery-loader *ngIf="loading" [config]="config.loader"></gallery-loader>\n ',styles:["\n :host{-webkit-box-ordinal-group:2;-ms-flex-order:1;order:1;-webkit-box-flex:1;-ms-flex:1;flex:1;flex-direction:column;-webkit-transform:translateZ(0);transform:translateZ(0)}.g-image,:host{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column}.g-image{position:absolute;left:0;right:0;top:0;bottom:0;background-repeat:no-repeat;background-size:contain;background-position:50%;z-index:1;flex-direction:column;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.g-image img{box-shadow:0 0 4px rgba(0,0,0,.3);pointer-events:none;display:block;max-width:100%;max-height:100%}\n "],changeDetection:t.ChangeDetectionStrategy.OnPush,animations:S}]}],j.ctorParameters=function(){return[{type:h},{type:t.ElementRef},{type:t.Renderer2}]},j.propDecorators={state:[{type:t.Input}],config:[{type:t.Input}]};var Z=function(){function e(e){this.gallery=e}return e.prototype.ngOnInit=function(){this.icon=this.getIcon(),this.styles=this.getStyle()},e.prototype.getIcon=function(){switch(this.config.icon){case"puff":return"https://cdn.rawgit.com/SamHerbert/SVG-Loaders/75b65ef5/svg-loaders/puff.svg";case"spinning-circles":return"https://cdn.rawgit.com/SamHerbert/SVG-Loaders/75b65ef5/svg-loaders/ball-triangle.svg";case"three-dots":return"https://cdn.rawgit.com/SamHerbert/SVG-Loaders/75b65ef5/svg-loaders/three-dots.svg";case"oval":return"https://cdn.rawgit.com/SamHerbert/SVG-Loaders/75b65ef5/svg-loaders/oval.svg";case"ball-triangle":return"https://cdn.rawgit.com/SamHerbert/SVG-Loaders/75b65ef5/svg-loaders/ball-triangle.svg";case"bars":return"https://cdn.rawgit.com/SamHerbert/SVG-Loaders/75b65ef5/svg-loaders/bars.svg";case"tail-spin":return"https://cdn.rawgit.com/SamHerbert/SVG-Loaders/75b65ef5/svg-loaders/tail-spin.svg";default:return this.config.icon}},e.prototype.getStyle=function(){switch(this.config.position){case"topLeft":return{"align-items":"flex-start","justify-content":"flex-start"};case"topRight":return{"align-items":"flex-start","justify-content":"flex-end"};case"bottomLeft":return{"align-items":"flex-end","justify-content":"flex-start"};case"bottomRight":return{"align-items":"flex-end","justify-content":"flex-end"};default:return{"align-items":"center","justify-content":"center"}}},e}();Z.decorators=[{type:t.Component,args:[{selector:"gallery-loader",template:'\n <div class="g-loader" [ngStyle]="styles">\n <img [src]="icon" [style.width]="config.width" [style.height]="config.height"/>\n </div>\n ',styles:["\n *{box-sizing:border-box}:host{z-index:1}.g-loader{z-index:2;position:absolute;width:100%;height:100%;display:-webkit-box;display:-ms-flexbox;display:flex;padding:1em}\n "],changeDetection:t.ChangeDetectionStrategy.OnPush}]}],Z.ctorParameters=function(){return[{type:h}]},Z.propDecorators={config:[{type:t.Input}]};var z=function(){function e(e){this.gallery=e,this.closeButton=!0}return e.prototype.keyboardInput=function(e){switch(e.keyCode){case 37:this.gallery.prev();break;case 39:this.gallery.next();break;case 13:this.gallery.next();break;case 27:this.gallery.close();break;default:return}},e.prototype.ngOnDestroy=function(){this.gallery.reset()},e}();z.decorators=[{type:t.Component,args:[{selector:"gallery-modal",template:'\n <div *ngIf="gallery.state | async as state">\n\n <div *ngIf="state.active" class="g-modal">\n\n <div class="g-btn-close-container">\n <div *ngIf="closeButton" class="g-btn-close" (click)="gallery.close()"></div>\n </div>\n\n <gallery-main [@popup] [state]="state" [config]="gallery.config"></gallery-main>\n\n <div class="g-overlay" (click)="gallery.close()"></div>\n\n </div>\n\n </div>\n ',styles:["\n *{box-sizing:border-box}.g-modal{position:fixed;left:0;right:0;top:0;bottom:0;background-color:rgba(0,0,0,.6);z-index:2;overflow:hidden;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center}@media (max-width:480px){.g-modal{padding:0}}.g-overlay{position:absolute;left:0;right:0;top:0;bottom:0}.g-btn-close-container{width:100%;display:-webkit-box;display:-ms-flexbox;display:flex}@media (max-width:480px){.g-btn-close-container{-webkit-box-pack:end;-ms-flex-pack:end;justify-content:flex-end}.g-btn-close-container .g-btn-close{margin:.5em;position:relative;right:0;top:0}}.g-btn-close{position:absolute;right:1em;top:1em;z-index:1;cursor:pointer;width:30px;height:30px;-webkit-transition:all .2s linear;transition:all .2s linear;background-image:url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iaXNvLTg4NTktMSI/PjxzdmcgdmVyc2lvbj0iMS4xIiBpZD0iQ2FwYV8xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4PSIwcHgiIHk9IjBweCIgdmlld0JveD0iMCAwIDUwIDUwIiBzdHlsZT0iZW5hYmxlLWJhY2tncm91bmQ6bmV3IDAgMCA1MCA1MDsiIHhtbDpzcGFjZT0icHJlc2VydmUiPjxjaXJjbGUgc3R5bGU9ImZpbGw6I0Q3NUE0QTsiIGN4PSIyNSIgY3k9IjI1IiByPSIyNSIvPjxwb2x5bGluZSBzdHlsZT0iZmlsbDpub25lO3N0cm9rZTojRkZGRkZGO3N0cm9rZS13aWR0aDoyO3N0cm9rZS1saW5lY2FwOnJvdW5kO3N0cm9rZS1taXRlcmxpbWl0OjEwOyIgcG9pbnRzPSIxNiwzNCAyNSwyNSAzNCwxNiAiLz48cG9seWxpbmUgc3R5bGU9ImZpbGw6bm9uZTtzdHJva2U6I0ZGRkZGRjtzdHJva2Utd2lkdGg6MjtzdHJva2UtbGluZWNhcDpyb3VuZDtzdHJva2UtbWl0ZXJsaW1pdDoxMDsiIHBvaW50cz0iMTYsMTYgMjUsMjUgMzQsMzQgIi8+PC9zdmc+)}.g-btn-close:active{-webkit-transform:rotate(180deg) scale(.9);transform:rotate(180deg) scale(.9)}\n "],changeDetection:t.ChangeDetectionStrategy.OnPush,animations:[d.trigger("popup",[d.state("in",d.style({opacity:.8,transform:"scale(0.2) translate3d(0, 100px, 0)"})),d.transition("void => *",[d.style({opacity:.8,transform:"scale(0.2) translate3d(0, 100px, 0)"}),d.animate(300)]),d.transition("* => void",[d.animate(300,d.style({opacity:1,transform:"scale(1) translate3d(0, 0, 0)"}))])])]}]}],z.ctorParameters=function(){return[{type:h}]},z.propDecorators={closeButton:[{type:t.Input}],keyboardInput:[{type:t.HostListener,args:["window:keydown",["$event"]]}]};var D=function(){function e(e,t,n){this.gallery=e,this.renderer=t,this.el=n}return e.prototype.ngOnInit=function(){if(this.config.position){var e=void 0,t=void 0,n=void 0,i="unset",r="unset";switch(this.config.position){case"bottom":e="row",n="auto",t="100%","unset",r="0";break;case"left":e="column",t="auto",n="100%";break;case"right":t="auto",n="100%",e="column",i="0";break;default:e="row",n="auto",t="100%"}this.renderer.setStyle(this.el.nativeElement,"right",i),this.renderer.setStyle(this.el.nativeElement,"bottom",r),this.renderer.setStyle(this.el.nativeElement,"width",t),this.renderer.setStyle(this.el.nativeElement,"height",n),this.renderer.setStyle(this.el.nativeElement,"flex-direction",e)}},e}();D.decorators=[{type:t.Component,args:[{selector:"gallery-bullets",template:'\n <div class="g-bullet"\n *ngFor="let image of state.images; let i = index"\n [class.g-bullet-curr]="i === state.currIndex"\n (click)="gallery.set(i)">\n\n <div class="g-bullet-inner" [ngStyle]="config.style"></div>\n\n </div>\n ',styles:["\n :host{position:absolute;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.g-bullet,:host{display:-webkit-box;display:-ms-flexbox;display:flex}.g-bullet{cursor:pointer;z-index:1}.g-bullet-inner{margin:1em;height:4px;width:4px;background-color:hsla(0,0%,100%,.5);border-radius:2px;box-shadow:0 0 6px rgba(0,0,0,.8);-webkit-transition:all .2s ease;transition:all .2s ease}.g-bullet-curr .g-bullet-inner{-webkit-transform:scale(1.5);transform:scale(1.5);background-color:#fff}\n "],changeDetection:t.ChangeDetectionStrategy.OnPush}]}],D.ctorParameters=function(){return[{type:h},{type:t.Renderer2},{type:t.ElementRef}]},D.propDecorators={state:[{type:t.Input}],config:[{type:t.Input}]};var P=function(){function e(e){this.gallery=e}return e.prototype.ngOnInit=function(){this.config.autoplay&&this.gallery.play()},e}();P.decorators=[{type:t.Component,args:[{selector:"gallery-player",template:'\n <!--<div class="g-player-btns">-->\n <!--<div *ngIf="!state.play" class="g-player-btn" (click)="gallery.play()">▶</div>-->\n <!--<div *ngIf="state.play" class="g-player-btn" (click)="gallery.stop()">⏸</div>-->\n <!--</div>-->\n ',styles:["\n :host{position:absolute;z-index:1}.g-player-btns{display:-webkit-box;display:-ms-flexbox;display:flex;padding:.5em 1em}.g-player-btn{margin-right:.5em;color:#fff;cursor:pointer}\n "],changeDetection:t.ChangeDetectionStrategy.OnPush}]}],P.ctorParameters=function(){return[{type:h}]},P.propDecorators={config:[{type:t.Input}],state:[{type:t.Input}]};var O=function(){function e(e){this.gallery=e}return e.prototype.ngOnInit=function(){var e=this.config.thumbnails.position;this.thumbDirection="left"===e||"right"===e?"row":"column"},e}();O.decorators=[{type:t.Component,args:[{selector:"gallery-main",template:'\n <div class="g-container" [style.flexDirection]="thumbDirection" [ngStyle]="config.style">\n\n <gallery-thumb *ngIf="config.thumbnails" [state]="state" [config]="config.thumbnails"\n [style.background]="config.style?.background"></gallery-thumb>\n\n <div class="g-box">\n\n <div class="g-image-box">\n\n <gallery-image [state]="state" [config]="config" (loading)="loading = $event"></gallery-image>\n\n <gallery-nav *ngIf="config.navigation" [state]="state"></gallery-nav>\n\n <!--<div class="g-layer" *ngIf="state.images[state.currIndex].layer" [innerHtml]="state.images[state.currIndex].layer"></div>-->\n\n </div>\n\n <gallery-text *ngIf="config.description" [state]="state" [config]="config.description"></gallery-text>\n\n <gallery-bullets *ngIf="config.bullets" [state]="state" [config]="config.bullets"></gallery-bullets>\n\n <gallery-player *ngIf="config.player" [state]="state" [config]="config.player"></gallery-player>\n\n </div>\n\n </div>\n ',styles:["\n gallery-main{-webkit-box-flex:1;-ms-flex:1;flex:1;width:100%;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center}gallery-main *{box-sizing:border-box}.g-container{overflow:hidden;position:relative;z-index:1;max-height:100%;max-width:100%;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}@media (max-width:480px){.g-container{width:100%!important;-webkit-box-flex:1;-ms-flex:1;flex:1;-webkit-box-orient:vertical!important;-webkit-box-direction:normal!important;-ms-flex-direction:column!important;flex-direction:column!important}}.g-box{height:100%}.g-box,.g-image-box{position:relative;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-flex:1;-ms-flex:1;flex:1;-webkit-box-ordinal-group:2;-ms-flex-order:1;order:1;height:100%}.g-layer{position:absolute;left:0;top:0;right:0;bottom:0;z-index:2}.g-pan-reset{-webkit-transition:all .3s linear;transition:all .3s linear;-webkit-transform:translateZ(0)!important;transform:translateZ(0)!important}\n "],changeDetection:t.ChangeDetectionStrategy.OnPush,encapsulation:t.ViewEncapsulation.None}]}],O.ctorParameters=function(){return[{type:h}]},O.propDecorators={state:[{type:t.Input}],config:[{type:t.Input}]};var M=require("../../Observable"),G=require("../../operator/map");M.Observable.prototype.map=G.map;var H=function(){function e(e,t,n){this.el=e,this.renderer=t,this.gallery=n}return e.prototype.ngOnInit=function(){var e=this;r.Observable.fromEvent(this.el.nativeElement,"DOMSubtreeModified").subscribe(function(t){if(e.el.nativeElement.innerHTML){var n=[],i=e.gallerize?e.gallerize.split(" ").map(function(e){return"."+e}):"",a=e.el.nativeElement.querySelectorAll("img"+i);a&&r.Observable.from(a).map(function(t,i){e.renderer.setStyle(t,"cursor","pointer"),e.renderer.setProperty(t,"onclick",function(){e.gallery.set(i)}),n.push({src:t.src,text:t.alt}),e.gallery.load(n)}).subscribe()}})},e}();H.decorators=[{type:t.Directive,args:[{selector:"[gallerize]"}]}],H.ctorParameters=function(){return[{type:t.ElementRef},{type:t.Renderer2},{type:h}]},H.propDecorators={gallerize:[{type:t.Input}]};var N=function(){function e(e,n){this.el=e,this.renderer=n,this.lazyLoad=new t.EventEmitter(!1)}return Object.defineProperty(e.prototype,"lazyImage",{set:function(e){this.getImage(e)},enumerable:!0,configurable:!0}),e.prototype.getImage=function(e){var t=this;this.lazyLoad.emit(!1);var n=this.renderer.createElement("img");n.src=e,n.onload=function(){t.renderer.setProperty(t.el.nativeElement,"src",e),t.lazyLoad.emit(!0)},n.onerror=function(e){console.error("[GalleryLazyDirective]:",e),t.lazyLoad.emit(e)}},e}();N.decorators=[{type:t.Directive,args:[{selector:"[lazyImage]"}]}],N.ctorParameters=function(){return[{type:t.ElementRef},{type:t.Renderer2}]},N.propDecorators={lazyImage:[{type:t.Input,args:["lazyImage"]}],lazyLoad:[{type:t.Output}]};var C=function(){function e(e,n,i){this.gallery=e,this.el=n,this.renderer=i,this.tapClick=new t.EventEmitter}return e.prototype.ngOnInit=function(){this.setTapEvent()},e.prototype.setTapEvent=function(){var e=this;if(this.gallery.config.gestures){if("undefined"==typeof Hammer)throw Error("[NgGallery]: HammerJS is undefined, make sure it is loaded");if("undefined"!=typeof Hammer){new Hammer(this.el.nativeElement).on("tap",function(){e.tapClick.emit(null)})}}else this.renderer.setProperty(this.el.nativeElement,"onclick",function(){e.tapClick.emit(null)})},e}();C.decorators=[{type:t.Directive,args:[{selector:"[tap]"}]}],C.ctorParameters=function(){return[{type:h},{type:t.ElementRef},{type:t.Renderer2}]},C.propDecorators={tap:[{type:t.Input}],tapClick:[{type:t.Output}]};var R=new t.InjectionToken("config"),V=function(){function e(){}return e.forRoot=function(t){return{ngModule:e,providers:[{provide:R,useValue:t},{provide:h,useFactory:p,deps:[R]}]}},e}();V.decorators=[{type:t.NgModule,args:[{imports:[n.CommonModule],declarations:[v,w,I,H,k,j,Z,z,D,P,O,C,N],exports:[v,H,z]}]}],V.ctorParameters=function(){return[]},e.GalleryModule=V,e.GalleryService=h,Object.defineProperty(e,"__esModule",{value:!0})}); | ||
!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("@angular/core"),require("@angular/common"),require("rxjs/Subject"),require("rxjs/BehaviorSubject"),require("rxjs/Observable"),require("@angular/animations"),require("rxjs/add/observable/of"),require("rxjs/add/observable/from"),require("rxjs/add/observable/fromEvent"),require("rxjs/add/observable/interval"),require("rxjs/add/operator/take"),require("rxjs/add/operator/takeWhile"),require("rxjs/add/operator/map"),require("rxjs/add/operator/switchMap"),require("rxjs/add/operator/do"),require("rxjs/add/operator/finally")):"function"==typeof define&&define.amd?define(["exports","@angular/core","@angular/common","rxjs/Subject","rxjs/BehaviorSubject","rxjs/Observable","@angular/animations","rxjs/add/observable/of","rxjs/add/observable/from","rxjs/add/observable/fromEvent","rxjs/add/observable/interval","rxjs/add/operator/take","rxjs/add/operator/takeWhile","rxjs/add/operator/map","rxjs/add/operator/switchMap","rxjs/add/operator/do","rxjs/add/operator/finally"],t):t(e.ngGallery=e.ngGallery||{},e.ng.core,e.ng.common,e.Rx,e.Rx,e.Rx,e.ng.common)}(this,function(e,t,n,i,r,a,o){"use strict";function s(e){return new g(e)}var l={images:void 0,prevIndex:0,currIndex:0,hasNext:void 0,hasPrev:void 0,active:!1},c={style:{background:"#121519",width:"900px",height:"500px"},animation:"fade",loader:{width:"50px",height:"50px",position:"center",icon:"oval"},description:{position:"bottom",overlay:!1,text:!0,counter:!0,style:{color:"red"}},bullets:!1,player:{autoplay:!1,speed:3e3},thumbnails:{width:120,height:90,position:"left",space:30}},g=function(){function e(e){var t=this;this.config=c,this.state=new r.BehaviorSubject(l),this.config=Object.assign({},c,e),this.player=new i.Subject,this.player.switchMap(function(e){return e?t.playerEngine(e):a.Observable.of(null)}).subscribe()}return e.prototype.load=function(e){this.state.next({images:e,currIndex:0,hasNext:e.length>1,hasPrev:!1,active:!1})},e.prototype.set=function(e){var t=this.state.getValue();this.state.next(Object.assign({},t,{prevIndex:t.currIndex,currIndex:e,hasNext:e<t.images.length-1,hasPrev:e>0,active:!0}))},e.prototype.next=function(){var e=this.state.getValue();if(e.hasNext){var t=e.currIndex+1;this.set(t)}else this.set(0)},e.prototype.prev=function(){var e=this.state.getValue();if(e.hasPrev){var t=e.currIndex-1;this.set(t)}else this.set(e.images.length-1)},e.prototype.close=function(){var e=this.state.getValue();this.state.next(Object.assign({},e,{active:!1,play:!1})),this.stop()},e.prototype.reset=function(){this.state.next(l),this.stop()},e.prototype.play=function(e){var t=e||this.config.player.speed||2e3;console.log("play",t);var n=this.state.getValue();this.state.next(Object.assign({},n,{play:!0,active:!0})),this.player.next(t)},e.prototype.stop=function(){this.player.next(0)},e.prototype.playerEngine=function(e){var t=this;return a.Observable.interval(e).takeWhile(function(){return t.state.getValue().play}).do(function(){t.next()}).finally(function(){t.state.next(Object.assign({},t.state.getValue(),{play:!1}))})},e}();g.decorators=[{type:t.Injectable}],g.ctorParameters=function(){return[{type:void 0,decorators:[{type:t.Optional}]}]};var d=function(){function e(e){this.gallery=e}return e.prototype.ngOnDestroy=function(){this.gallery.reset()},e}();d.decorators=[{type:t.Component,args:[{selector:"gallery",template:'<gallery-main *ngIf="gallery.state | async as state" [state]="state" [config]="gallery.config"></gallery-main>',changeDetection:t.ChangeDetectionStrategy.OnPush,styles:["\n gallery-main{display:-webkit-box;display:-ms-flexbox;display:flex;height:500px}\n "]}]}],d.ctorParameters=function(){return[{type:g}]};var p=function(){function e(e){this.gallery=e}return e}();p.decorators=[{type:t.Component,args:[{selector:"gallery-nav",template:'\n <div *ngIf="state.images.length > 1" class="g-nav">\n\n <div class="g-nav-prev" (click)="gallery.prev()">\n <i class="prev-arrow-ico"></i>\n </div>\n\n <div class="g-nav-next" (click)="gallery.next()">\n <i class="next-arrow-ico"></i>\n </div>\n\n </div>\n ',styles:["\n *{box-sizing:border-box}:host{z-index:1;position:absolute;left:0;right:0;top:0;bottom:0;display:-webkit-box;display:-ms-flexbox;display:flex}@media (max-width:480px){:host{display:none}}.g-nav{-webkit-box-flex:1;-ms-flex:1;flex:1;height:100%;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;opacity:0;-webkit-transition:all .4s linear;transition:all .4s linear;cursor:pointer}.g-nav:hover{opacity:1}.g-nav-next,.g-nav-prev{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;height:100%;opacity:.7;position:relative;overflow:hidden;-webkit-transition:all .2s ease;transition:all .2s ease;z-index:0}.g-nav-next:hover,.g-nav-prev:hover{opacity:1}.g-nav-next{padding-right:.7em;-webkit-box-flex:1;-ms-flex:1;flex:1;-webkit-box-pack:end;-ms-flex-pack:end;justify-content:flex-end}.g-nav-prev{padding-left:.7em;width:20%}.next-arrow-ico,.prev-arrow-ico{width:45px;height:80px}.next-arrow-ico{background:url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iaXNvLTg4NTktMSI/PiAgPHN2ZyB2ZXJzaW9uPSIxLjEiIGlkPSJMYXllcl8xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4PSIwcHgiIHk9IjBweCIgdmlld0JveD0iMCAwIDQxNC40OTYgNDE0LjQ5NiIgc3R5bGU9ImVuYWJsZS1iYWNrZ3JvdW5kOm5ldyAwIDAgNDE0LjQ5NiA0MTQuNDk2OyIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI+IDxkZWZzIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGZpbHRlciBpZD0iZHJvcHNoYWRvdyIgPiAgPGZlR2F1c3NpYW5CbHVyIGluPSJTb3VyY2VBbHBoYSIgc3RkRGV2aWF0aW9uPSIzIi8+ICAgPGZlT2Zmc2V0IGR4PSIyIiBkeT0iMiIgcmVzdWx0PSJvZmZzZXRibHVyIi8+ICAgPGZlTWVyZ2U+IDxmZU1lcmdlTm9kZS8+PGZlTWVyZ2VOb2RlIGluPSJTb3VyY2VHcmFwaGljIi8+ICAgPC9mZU1lcmdlPjwvZmlsdGVyPjwvZGVmcz4gIDxwb2x5Z29uIHN0eWxlPSJmaWxsOiNmZmY7IiBmaWx0ZXI9InVybCgjZHJvcHNoYWRvdykiIHBvaW50cz0iMTE4LjEyNiwwIDg5Ljc5NiwyOC4yMzggMjY4LjIyMywyMDcuMjQ4IDg5Ljc5NiwzODYuMjU4IDExOC4xMjYsNDE0LjQ5NiAzMjQuNywyMDcuMjQ4ICIvPjwvc3ZnPg==) no-repeat 50%}.prev-arrow-ico{background:url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iaXNvLTg4NTktMSI/PjxzdmcgdmVyc2lvbj0iMS4xIiBpZD0iTGF5ZXJfMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgeD0iMHB4IiB5PSIwcHgiIHZpZXdCb3g9IjAgMCA0MTQuNDk2IDQxNC40OTYiIHN0eWxlPSJlbmFibGUtYmFja2dyb3VuZDpuZXcgMCAwIDQxNC40OTYgNDE0LjQ5NjsiIHhtbDpzcGFjZT0icHJlc2VydmUiPjxkZWZzIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGZpbHRlciBpZD0iZHJvcHNoYWRvdyIgPiAgPGZlR2F1c3NpYW5CbHVyIGluPSJTb3VyY2VBbHBoYSIgc3RkRGV2aWF0aW9uPSIzIi8+ICAgPGZlT2Zmc2V0IGR4PSIyIiBkeT0iMiIgcmVzdWx0PSJvZmZzZXRibHVyIi8+ICAgPGZlTWVyZ2U+IDxmZU1lcmdlTm9kZS8+PGZlTWVyZ2VOb2RlIGluPSJTb3VyY2VHcmFwaGljIi8+ICAgPC9mZU1lcmdlPjwvZmlsdGVyPjwvZGVmcz48cG9seWdvbiBzdHlsZT0iZmlsbDojZmZmOyIgZmlsdGVyPSJ1cmwoI2Ryb3BzaGFkb3cpIiBwb2ludHM9IjMyNC43LDI4LjIzOCAyOTYuMzcsMCA4OS43OTYsMjA3LjI0OCAyOTYuMzcsNDE0LjQ5NiAzMjQuNywzODYuMjU4IDE0Ni4yNzMsMjA3LjI0OCAiLz48L3N2Zz4=) no-repeat 50%}\n "],changeDetection:t.ChangeDetectionStrategy.OnPush}]}],p.ctorParameters=function(){return[{type:g}]},p.propDecorators={state:[{type:t.Input}]};var m=function(){function e(e,t,n){this.gallery=e,this.el=t,this.renderer=n}return e.prototype.ngOnInit=function(){var e=this;if(this.contStyle=this.getContainerStyle(),this.gallery.config.gestures){if("undefined"==typeof Hammer)throw Error("[NgGallery]: HammerJS is undefined, make sure it is loaded");var t=this.el.nativeElement,n=new Hammer(t);n.on("panstart",function(){e.renderer.removeClass(t,"g-pan-reset")}),n.on("panend",function(){e.renderer.addClass(t,"g-pan-reset")}),n.on("pan",function(n){e.renderer.setStyle(t,"transform","translate3d("+n.deltaX+"px, 0px, 0px)")}),n.on("swipeleft",function(){e.gallery.next()}),n.on("swiperight",function(){e.gallery.prev()})}},e.prototype.translateThumbs=function(){return"translate3d("+-(this.state.currIndex*this.config.width+this.config.width/2)+"px, 0, 0)"},e.prototype.getContainerStyle=function(){var e="top"===this.config.position?0:2;return this.renderer.setStyle(this.el.nativeElement,"order",e),{height:this.config.height+"px",margin:this.config.space+"px"}},e.prototype.getThumbImage=function(e){return"url("+(this.state.images[e].thumbnail||this.state.images[e].src)+")"},e}();m.decorators=[{type:t.Component,args:[{selector:"gallery-thumb",template:'\n <div #container class="g-thumb-container" [ngStyle]="contStyle">\n\n <div class="g-thumbs" [style.transform]="translateThumbs()">\n\n <div class="g-thumb" *ngFor="let image of state.images; let i = index"\n [class.g-thumb-current]="i === state.currIndex"\n [style.width.px]="gallery.config.thumbnails.width"\n [style.height.px]="gallery.config.thumbnails.height">\n\n <div class="g-thumb-image" [style.backgroundImage]="getThumbImage(i)"\n [tap] (tapClick)="gallery.set(i)">\n </div>\n </div>\n\n </div>\n\n </div>\n ',styles:["\n :host{display:block;z-index:1}.g-thumb-container{position:relative;z-index:2;width:100%;height:100%;left:0}.g-thumb-container,.g-thumbs{top:0;display:-webkit-box;display:-ms-flexbox;display:flex}.g-thumbs{position:absolute;left:50%;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-transition:-webkit-transform .3s ease-in;transition:-webkit-transform .3s ease-in;transition:transform .3s ease-in;transition:transform .3s ease-in,-webkit-transform .3s ease-in;-webkit-transform:translateZ(0);transform:translateZ(0)}.g-thumb{padding:8px;opacity:.5;-webkit-transition:all .2s linear;transition:all .2s linear}.g-thumb-image{cursor:pointer;width:100%;height:100%;background-position:50%;background-size:cover;box-shadow:0 0 4px rgba(0,0,0,.3)}.g-thumb-current{opacity:1;padding:2px}\n "],changeDetection:t.ChangeDetectionStrategy.OnPush}]}],m.ctorParameters=function(){return[{type:g},{type:t.ElementRef},{type:t.Renderer2}]},m.propDecorators={state:[{type:t.Input}],config:[{type:t.Input}]};var y=function(){function e(e,t){this.el=e,this.renderer=t}return e.prototype.ngOnInit=function(){var e=this.el.nativeElement;this.config.overlay&&this.renderer.setStyle(e,"position","absolute"),"top"===this.config.position?(this.renderer.setStyle(e,"order",0),this.renderer.setStyle(e,"top",0),this.renderer.setStyle(e,"bottom","unset")):(this.renderer.setStyle(e,"order",2),this.renderer.setStyle(e,"top","unset"),this.renderer.setStyle(e,"bottom",0))},e}();y.decorators=[{type:t.Component,args:[{selector:"gallery-text",template:'\n <div class="g-text-container" [ngStyle]="config.style">\n <div *ngIf="config.text" class="g-text" [innerHtml]="state.images[state.currIndex]?.text">\n </div>\n <div *ngIf="config.counter" class="g-number">\n {{(state.currIndex + 1) + \'/\' + state.images.length}}\n </div>\n </div>\n ',styles:["\n *{box-sizing:border-box}:host{position:relative;left:0;right:0;z-index:1}.g-text-container{padding:1em 2em;color:#ccc;font-size:13px;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-ms-flex-line-pack:center;align-content:center;background-clip:padding-box;-webkit-font-smoothing:antialiased}.g-text{-webkit-box-flex:1;-ms-flex:1;flex:1}\n "],changeDetection:t.ChangeDetectionStrategy.OnPush}]}],y.ctorParameters=function(){return[{type:t.ElementRef},{type:t.Renderer2}]},y.propDecorators={state:[{type:t.Input}],config:[{type:t.Input}]};var u=[o.trigger("imgAnimate",[o.state("none",o.style({opacity:1})),o.transition("fade <=> *",[o.style({opacity:0}),o.animate("0.5s ease-in")])])],b=function(){function e(e,t,n){this.gallery=e,this.el=t,this.renderer=n}return e.prototype.ngOnInit=function(){var e=this;if(this.config.gestures){if("undefined"==typeof Hammer)throw Error("[NgGallery]: HammerJS is undefined, make sure it is loaded");var t=this.el.nativeElement,n=new Hammer(t);n.on("panstart",function(){e.renderer.removeClass(t,"g-pan-reset")}),n.on("panend",function(){e.renderer.addClass(t,"g-pan-reset")}),n.on("pan",function(n){e.renderer.setStyle(t,"transform","translate3d("+n.deltaX+"px, 0px, 0px)")}),n.on("swipeleft",function(){e.gallery.next()}),n.on("swiperight",function(){e.gallery.prev()})}},e.prototype.imageLoad=function(e){if(this.loading=!e,e)this.animate="none";else switch(this.config.animation){case"fade":this.animate="fade";break;default:this.animate="none"}},e}();b.decorators=[{type:t.Component,args:[{selector:"gallery-image",template:'\n <div [@imgAnimate]="animate" class="g-image">\n <img [lazyImage]="state.images[state.currIndex].src" (lazyLoad)="imageLoad($event)">\n </div>\n\n <gallery-loader *ngIf="loading" [config]="config.loader"></gallery-loader>\n ',styles:["\n :host{-webkit-box-ordinal-group:2;-ms-flex-order:1;order:1;-webkit-box-flex:1;-ms-flex:1;flex:1;flex-direction:column;-webkit-transform:translateZ(0);transform:translateZ(0)}.g-image,:host{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column}.g-image{position:absolute;left:0;right:0;top:0;bottom:0;background-repeat:no-repeat;background-size:contain;background-position:50%;z-index:1;flex-direction:column;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.g-image img{box-shadow:0 0 4px rgba(0,0,0,.3);pointer-events:none;display:block;max-width:100%;max-height:100%}\n "],changeDetection:t.ChangeDetectionStrategy.OnPush,animations:u}]}],b.ctorParameters=function(){return[{type:g},{type:t.ElementRef},{type:t.Renderer2}]},b.propDecorators={state:[{type:t.Input}],config:[{type:t.Input}]};var f=function(){function e(e){this.gallery=e}return e.prototype.ngOnInit=function(){this.icon=this.getIcon(),this.styles=this.getStyle()},e.prototype.getIcon=function(){switch(this.config.icon){case"puff":return"https://cdn.rawgit.com/SamHerbert/SVG-Loaders/75b65ef5/svg-loaders/puff.svg";case"spinning-circles":return"https://cdn.rawgit.com/SamHerbert/SVG-Loaders/75b65ef5/svg-loaders/ball-triangle.svg";case"three-dots":return"https://cdn.rawgit.com/SamHerbert/SVG-Loaders/75b65ef5/svg-loaders/three-dots.svg";case"oval":return"https://cdn.rawgit.com/SamHerbert/SVG-Loaders/75b65ef5/svg-loaders/oval.svg";case"ball-triangle":return"https://cdn.rawgit.com/SamHerbert/SVG-Loaders/75b65ef5/svg-loaders/ball-triangle.svg";case"bars":return"https://cdn.rawgit.com/SamHerbert/SVG-Loaders/75b65ef5/svg-loaders/bars.svg";case"tail-spin":return"https://cdn.rawgit.com/SamHerbert/SVG-Loaders/75b65ef5/svg-loaders/tail-spin.svg";default:return this.config.icon}},e.prototype.getStyle=function(){switch(this.config.position){case"topLeft":return{"align-items":"flex-start","justify-content":"flex-start"};case"topRight":return{"align-items":"flex-start","justify-content":"flex-end"};case"bottomLeft":return{"align-items":"flex-end","justify-content":"flex-start"};case"bottomRight":return{"align-items":"flex-end","justify-content":"flex-end"};default:return{"align-items":"center","justify-content":"center"}}},e}();f.decorators=[{type:t.Component,args:[{selector:"gallery-loader",template:'\n <div class="g-loader" [ngStyle]="styles">\n <img [src]="icon" [style.width]="config.width" [style.height]="config.height"/>\n </div>\n ',styles:["\n *{box-sizing:border-box}:host{z-index:1}.g-loader{z-index:2;position:absolute;width:100%;height:100%;display:-webkit-box;display:-ms-flexbox;display:flex;padding:1em}\n "],changeDetection:t.ChangeDetectionStrategy.OnPush}]}],f.ctorParameters=function(){return[{type:g}]},f.propDecorators={config:[{type:t.Input}]};var x=function(){function e(e){this.gallery=e,this.closeButton=!0}return e.prototype.keyboardInput=function(e){switch(e.keyCode){case 37:this.gallery.prev();break;case 39:this.gallery.next();break;case 13:this.gallery.next();break;case 27:this.gallery.close();break;default:return}},e.prototype.ngOnDestroy=function(){this.gallery.reset()},e}();x.decorators=[{type:t.Component,args:[{selector:"gallery-modal",template:'\n <div *ngIf="gallery.state | async as state">\n\n <div *ngIf="state.active" class="g-modal">\n\n <div class="g-btn-close-container">\n <div *ngIf="closeButton" class="g-btn-close" (click)="gallery.close()"></div>\n </div>\n\n <gallery-main [@popup] [state]="state" [config]="gallery.config"></gallery-main>\n\n <div class="g-overlay" (click)="gallery.close()"></div>\n\n </div>\n\n </div>\n ',styles:["\n *{box-sizing:border-box}.g-modal{position:fixed;left:0;right:0;top:0;bottom:0;background-color:rgba(0,0,0,.6);z-index:2;overflow:hidden;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center}@media (max-width:480px){.g-modal{padding:0}}.g-overlay{position:absolute;left:0;right:0;top:0;bottom:0}.g-btn-close-container{width:100%;display:-webkit-box;display:-ms-flexbox;display:flex}@media (max-width:480px){.g-btn-close-container{-webkit-box-pack:end;-ms-flex-pack:end;justify-content:flex-end}.g-btn-close-container .g-btn-close{margin:.5em;position:relative;right:0;top:0}}.g-btn-close{z-index:1;position:absolute;right:1em;top:1em;z-index:3;cursor:pointer;width:30px;height:30px;-webkit-transition:all .2s linear;transition:all .2s linear;background-image:url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iaXNvLTg4NTktMSI/PjxzdmcgdmVyc2lvbj0iMS4xIiBpZD0iQ2FwYV8xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4PSIwcHgiIHk9IjBweCIgdmlld0JveD0iMCAwIDUwIDUwIiBzdHlsZT0iZW5hYmxlLWJhY2tncm91bmQ6bmV3IDAgMCA1MCA1MDsiIHhtbDpzcGFjZT0icHJlc2VydmUiPjxjaXJjbGUgc3R5bGU9ImZpbGw6I0Q3NUE0QTsiIGN4PSIyNSIgY3k9IjI1IiByPSIyNSIvPjxwb2x5bGluZSBzdHlsZT0iZmlsbDpub25lO3N0cm9rZTojRkZGRkZGO3N0cm9rZS13aWR0aDoyO3N0cm9rZS1saW5lY2FwOnJvdW5kO3N0cm9rZS1taXRlcmxpbWl0OjEwOyIgcG9pbnRzPSIxNiwzNCAyNSwyNSAzNCwxNiAiLz48cG9seWxpbmUgc3R5bGU9ImZpbGw6bm9uZTtzdHJva2U6I0ZGRkZGRjtzdHJva2Utd2lkdGg6MjtzdHJva2UtbGluZWNhcDpyb3VuZDtzdHJva2UtbWl0ZXJsaW1pdDoxMDsiIHBvaW50cz0iMTYsMTYgMjUsMjUgMzQsMzQgIi8+PC9zdmc+)}.g-btn-close:active{-webkit-transform:rotate(180deg) scale(.9);transform:rotate(180deg) scale(.9)}\n "],changeDetection:t.ChangeDetectionStrategy.OnPush,animations:[o.trigger("popup",[o.state("in",o.style({opacity:.8,transform:"scale(0.2) translate3d(0, 100px, 0)"})),o.transition("void => *",[o.style({opacity:.8,transform:"scale(0.2) translate3d(0, 100px, 0)"}),o.animate(300)]),o.transition("* => void",[o.animate(300,o.style({opacity:1,transform:"scale(1) translate3d(0, 0, 0)"}))])])]}]}],x.ctorParameters=function(){return[{type:g}]},x.propDecorators={closeButton:[{type:t.Input}],keyboardInput:[{type:t.HostListener,args:["window:keydown",["$event"]]}]};var h=function(){function e(e,t,n){this.gallery=e,this.renderer=t,this.el=n}return e.prototype.ngOnInit=function(){if(this.config.position){var e=void 0,t=void 0,n=void 0,i="unset",r="unset";switch(this.config.position){case"bottom":e="row",n="auto",t="100%","unset",r="0";break;case"left":e="column",t="auto",n="100%";break;case"right":t="auto",n="100%",e="column",i="0";break;default:e="row",n="auto",t="100%"}this.renderer.setStyle(this.el.nativeElement,"right",i),this.renderer.setStyle(this.el.nativeElement,"bottom",r),this.renderer.setStyle(this.el.nativeElement,"width",t),this.renderer.setStyle(this.el.nativeElement,"height",n),this.renderer.setStyle(this.el.nativeElement,"flex-direction",e)}},e}();h.decorators=[{type:t.Component,args:[{selector:"gallery-bullets",template:'\n <div class="g-bullet"\n *ngFor="let image of state.images; let i = index"\n [class.g-bullet-curr]="i === state.currIndex"\n (click)="gallery.set(i)">\n\n <div class="g-bullet-inner" [ngStyle]="config.style"></div>\n\n </div>\n ',styles:["\n :host{position:absolute;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.g-bullet,:host{display:-webkit-box;display:-ms-flexbox;display:flex}.g-bullet{cursor:pointer;z-index:1}.g-bullet-inner{margin:1em;height:4px;width:4px;background-color:hsla(0,0%,100%,.5);border-radius:2px;box-shadow:0 0 6px rgba(0,0,0,.8);-webkit-transition:all .2s ease;transition:all .2s ease}.g-bullet-curr .g-bullet-inner{-webkit-transform:scale(1.5);transform:scale(1.5);background-color:#fff}\n "],changeDetection:t.ChangeDetectionStrategy.OnPush}]}],h.ctorParameters=function(){return[{type:g},{type:t.Renderer2},{type:t.ElementRef}]},h.propDecorators={state:[{type:t.Input}],config:[{type:t.Input}]};var v=function(){function e(e){this.gallery=e}return e.prototype.ngOnInit=function(){this.config.autoplay&&this.gallery.play()},e}();v.decorators=[{type:t.Component,args:[{selector:"gallery-player",template:'\n <!--<div class="g-player-btns">-->\n <!--<div *ngIf="!state.play" class="g-player-btn" (click)="gallery.play()">▶</div>-->\n <!--<div *ngIf="state.play" class="g-player-btn" (click)="gallery.stop()">⏸</div>-->\n <!--</div>-->\n ',styles:["\n :host{position:absolute;z-index:1}.g-player-btns{display:-webkit-box;display:-ms-flexbox;display:flex;padding:.5em 1em}.g-player-btn{margin-right:.5em;color:#fff;cursor:pointer}\n "],changeDetection:t.ChangeDetectionStrategy.OnPush}]}],v.ctorParameters=function(){return[{type:g}]},v.propDecorators={config:[{type:t.Input}],state:[{type:t.Input}]};var w=function(){function e(e){this.gallery=e}return e.prototype.ngOnInit=function(){var e=this.config.thumbnails.position;this.thumbDirection="left"===e||"right"===e?"row":"column"},e}();w.decorators=[{type:t.Component,args:[{selector:"gallery-main",template:'\n <div class="g-container" [style.flexDirection]="thumbDirection" [ngStyle]="config.style">\n\n <gallery-thumb *ngIf="config.thumbnails" [state]="state" [config]="config.thumbnails"\n [style.background]="config.style?.background"></gallery-thumb>\n\n <div class="g-box">\n\n <div class="g-image-box">\n\n <gallery-image [state]="state" [config]="config" (loading)="loading = $event"></gallery-image>\n\n <gallery-nav *ngIf="config.navigation" [state]="state"></gallery-nav>\n\n <!--<div class="g-layer" *ngIf="state.images[state.currIndex].layer" [innerHtml]="state.images[state.currIndex].layer"></div>-->\n\n </div>\n\n <gallery-text *ngIf="config.description" [state]="state" [config]="config.description"></gallery-text>\n\n <gallery-bullets *ngIf="config.bullets" [state]="state" [config]="config.bullets"></gallery-bullets>\n\n <gallery-player *ngIf="config.player" [state]="state" [config]="config.player"></gallery-player>\n\n </div>\n\n </div>\n ',styles:["\n gallery-main{-webkit-box-flex:1;-ms-flex:1;flex:1;width:100%;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center}gallery-main *{box-sizing:border-box}.g-container{overflow:hidden;position:relative;z-index:1;max-height:100%;max-width:100%;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}@media (max-width:480px){.g-container{width:100%!important;-webkit-box-flex:1;-ms-flex:1;flex:1;-webkit-box-orient:vertical!important;-webkit-box-direction:normal!important;-ms-flex-direction:column!important;flex-direction:column!important}}.g-box{height:100%}.g-box,.g-image-box{position:relative;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-flex:1;-ms-flex:1;flex:1;-webkit-box-ordinal-group:2;-ms-flex-order:1;order:1;height:100%}.g-layer{position:absolute;left:0;top:0;right:0;bottom:0;z-index:2}.g-pan-reset{-webkit-transition:all .3s linear;transition:all .3s linear;-webkit-transform:translateZ(0)!important;transform:translateZ(0)!important}\n "],changeDetection:t.ChangeDetectionStrategy.OnPush,encapsulation:t.ViewEncapsulation.None}]}],w.ctorParameters=function(){return[{type:g}]},w.propDecorators={state:[{type:t.Input}],config:[{type:t.Input}]};var I=function(){function e(e,t,n){this.el=e,this.renderer=t,this.gallery=n}return e.prototype.ngOnInit=function(){var e=this;a.Observable.fromEvent(this.el.nativeElement,"DOMSubtreeModified").subscribe(function(t){if(e.el.nativeElement.innerHTML){var n=[],i=e.gallerize?e.gallerize.split(" ").map(function(e){return"."+e}):"",r=e.el.nativeElement.querySelectorAll("img"+i);r&&a.Observable.from(r).map(function(t,i){e.renderer.setStyle(t,"cursor","pointer"),e.renderer.setProperty(t,"onclick",function(){e.gallery.set(i)}),n.push({src:t.src,text:t.alt}),e.gallery.load(n)}).subscribe()}})},e}();I.decorators=[{type:t.Directive,args:[{selector:"[gallerize]"}]}],I.ctorParameters=function(){return[{type:t.ElementRef},{type:t.Renderer2},{type:g}]},I.propDecorators={gallerize:[{type:t.Input}]};var k=function(){function e(e,n){this.el=e,this.renderer=n,this.lazyLoad=new t.EventEmitter(!1)}return Object.defineProperty(e.prototype,"lazyImage",{set:function(e){this.getImage(e)},enumerable:!0,configurable:!0}),e.prototype.getImage=function(e){var t=this;this.lazyLoad.emit(!1);var n=this.renderer.createElement("img");n.src=e,n.onload=function(){t.renderer.setProperty(t.el.nativeElement,"src",e),t.lazyLoad.emit(!0)},n.onerror=function(e){console.error("[GalleryLazyDirective]:",e),t.lazyLoad.emit(e)}},e}();k.decorators=[{type:t.Directive,args:[{selector:"[lazyImage]"}]}],k.ctorParameters=function(){return[{type:t.ElementRef},{type:t.Renderer2}]},k.propDecorators={lazyImage:[{type:t.Input,args:["lazyImage"]}],lazyLoad:[{type:t.Output}]};var j=function(){function e(e,n,i){this.gallery=e,this.el=n,this.renderer=i,this.tapClick=new t.EventEmitter}return e.prototype.ngOnInit=function(){this.setTapEvent()},e.prototype.setTapEvent=function(){var e=this;if(this.gallery.config.gestures){if("undefined"==typeof Hammer)throw Error("[NgGallery]: HammerJS is undefined, make sure it is loaded");if("undefined"!=typeof Hammer){new Hammer(this.el.nativeElement).on("tap",function(){e.tapClick.emit(null)})}}else this.renderer.setProperty(this.el.nativeElement,"onclick",function(){e.tapClick.emit(null)})},e}();j.decorators=[{type:t.Directive,args:[{selector:"[tap]"}]}],j.ctorParameters=function(){return[{type:g},{type:t.ElementRef},{type:t.Renderer2}]},j.propDecorators={tap:[{type:t.Input}],tapClick:[{type:t.Output}]};var S=new t.InjectionToken("config"),z=function(){function e(){}return e.forRoot=function(t){return{ngModule:e,providers:[{provide:S,useValue:t},{provide:g,useFactory:s,deps:[S]}]}},e}();z.decorators=[{type:t.NgModule,args:[{imports:[n.CommonModule],declarations:[d,p,m,I,y,b,f,x,h,v,w,j,k],exports:[d,I,x]}]}],z.ctorParameters=function(){return[]},e.GalleryModule=z,e.GalleryService=g,Object.defineProperty(e,"__esModule",{value:!0})}); |
# Changelog | ||
## 0.6.3 | ||
- fix umd bundle for systemjs, closes [#10](https://github.com/MurhafSousli/ng-gallery/issues/10) | ||
## 0.6.2 | ||
- fix(gestures) remove navigation element on mobile which was blocking gestures events | ||
- fix(gestures) enable/disable gestures using `config.gestures` | ||
- refactor(config) interfaces | ||
## 0.6.0 beta | ||
@@ -4,0 +14,0 @@ |
@@ -5,3 +5,2 @@ import { OnInit } from '@angular/core'; | ||
import { GalleryService } from '../../service/gallery.service'; | ||
import 'rxjs/add/observable/fromEvent'; | ||
export declare class GalleryMainComponent implements OnInit { | ||
@@ -8,0 +7,0 @@ gallery: GalleryService; |
import { ChangeDetectionStrategy, Component, Input, ViewEncapsulation } from '@angular/core'; | ||
import { GalleryService } from '../../service/gallery.service'; | ||
import 'rxjs/add/observable/fromEvent'; | ||
var GalleryMainComponent = (function () { | ||
@@ -5,0 +4,0 @@ function GalleryMainComponent(gallery) { |
@@ -38,3 +38,3 @@ import { ChangeDetectionStrategy, Component, HostListener, Input } from '@angular/core'; | ||
template: "\n <div *ngIf=\"gallery.state | async as state\">\n\n <div *ngIf=\"state.active\" class=\"g-modal\">\n\n <div class=\"g-btn-close-container\">\n <div *ngIf=\"closeButton\" class=\"g-btn-close\" (click)=\"gallery.close()\"></div>\n </div>\n\n <gallery-main [@popup] [state]=\"state\" [config]=\"gallery.config\"></gallery-main>\n\n <div class=\"g-overlay\" (click)=\"gallery.close()\"></div>\n\n </div>\n\n </div>\n ", | ||
styles: ["\n *{box-sizing:border-box}.g-modal{position:fixed;left:0;right:0;top:0;bottom:0;background-color:rgba(0,0,0,.6);z-index:2;overflow:hidden;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center}@media (max-width:480px){.g-modal{padding:0}}.g-overlay{position:absolute;left:0;right:0;top:0;bottom:0}.g-btn-close-container{width:100%;display:-webkit-box;display:-ms-flexbox;display:flex}@media (max-width:480px){.g-btn-close-container{-webkit-box-pack:end;-ms-flex-pack:end;justify-content:flex-end}.g-btn-close-container .g-btn-close{margin:.5em;position:relative;right:0;top:0}}.g-btn-close{position:absolute;right:1em;top:1em;z-index:1;cursor:pointer;width:30px;height:30px;-webkit-transition:all .2s linear;transition:all .2s linear;background-image:url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iaXNvLTg4NTktMSI/PjxzdmcgdmVyc2lvbj0iMS4xIiBpZD0iQ2FwYV8xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4PSIwcHgiIHk9IjBweCIgdmlld0JveD0iMCAwIDUwIDUwIiBzdHlsZT0iZW5hYmxlLWJhY2tncm91bmQ6bmV3IDAgMCA1MCA1MDsiIHhtbDpzcGFjZT0icHJlc2VydmUiPjxjaXJjbGUgc3R5bGU9ImZpbGw6I0Q3NUE0QTsiIGN4PSIyNSIgY3k9IjI1IiByPSIyNSIvPjxwb2x5bGluZSBzdHlsZT0iZmlsbDpub25lO3N0cm9rZTojRkZGRkZGO3N0cm9rZS13aWR0aDoyO3N0cm9rZS1saW5lY2FwOnJvdW5kO3N0cm9rZS1taXRlcmxpbWl0OjEwOyIgcG9pbnRzPSIxNiwzNCAyNSwyNSAzNCwxNiAiLz48cG9seWxpbmUgc3R5bGU9ImZpbGw6bm9uZTtzdHJva2U6I0ZGRkZGRjtzdHJva2Utd2lkdGg6MjtzdHJva2UtbGluZWNhcDpyb3VuZDtzdHJva2UtbWl0ZXJsaW1pdDoxMDsiIHBvaW50cz0iMTYsMTYgMjUsMjUgMzQsMzQgIi8+PC9zdmc+)}.g-btn-close:active{-webkit-transform:rotate(180deg) scale(.9);transform:rotate(180deg) scale(.9)}\n "], | ||
styles: ["\n *{box-sizing:border-box}.g-modal{position:fixed;left:0;right:0;top:0;bottom:0;background-color:rgba(0,0,0,.6);z-index:2;overflow:hidden;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center}@media (max-width:480px){.g-modal{padding:0}}.g-overlay{position:absolute;left:0;right:0;top:0;bottom:0}.g-btn-close-container{width:100%;display:-webkit-box;display:-ms-flexbox;display:flex}@media (max-width:480px){.g-btn-close-container{-webkit-box-pack:end;-ms-flex-pack:end;justify-content:flex-end}.g-btn-close-container .g-btn-close{margin:.5em;position:relative;right:0;top:0}}.g-btn-close{z-index:1;position:absolute;right:1em;top:1em;z-index:3;cursor:pointer;width:30px;height:30px;-webkit-transition:all .2s linear;transition:all .2s linear;background-image:url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iaXNvLTg4NTktMSI/PjxzdmcgdmVyc2lvbj0iMS4xIiBpZD0iQ2FwYV8xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4PSIwcHgiIHk9IjBweCIgdmlld0JveD0iMCAwIDUwIDUwIiBzdHlsZT0iZW5hYmxlLWJhY2tncm91bmQ6bmV3IDAgMCA1MCA1MDsiIHhtbDpzcGFjZT0icHJlc2VydmUiPjxjaXJjbGUgc3R5bGU9ImZpbGw6I0Q3NUE0QTsiIGN4PSIyNSIgY3k9IjI1IiByPSIyNSIvPjxwb2x5bGluZSBzdHlsZT0iZmlsbDpub25lO3N0cm9rZTojRkZGRkZGO3N0cm9rZS13aWR0aDoyO3N0cm9rZS1saW5lY2FwOnJvdW5kO3N0cm9rZS1taXRlcmxpbWl0OjEwOyIgcG9pbnRzPSIxNiwzNCAyNSwyNSAzNCwxNiAiLz48cG9seWxpbmUgc3R5bGU9ImZpbGw6bm9uZTtzdHJva2U6I0ZGRkZGRjtzdHJva2Utd2lkdGg6MjtzdHJva2UtbGluZWNhcDpyb3VuZDtzdHJva2UtbWl0ZXJsaW1pdDoxMDsiIHBvaW50cz0iMTYsMTYgMjUsMjUgMzQsMzQgIi8+PC9zdmc+)}.g-btn-close:active{-webkit-transform:rotate(180deg) scale(.9);transform:rotate(180deg) scale(.9)}\n "], | ||
changeDetection: ChangeDetectionStrategy.OnPush, | ||
@@ -41,0 +41,0 @@ animations: [ |
@@ -1,1 +0,1 @@ | ||
[{"__symbolic":"module","version":3,"metadata":{"GalleryModalComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component"},"arguments":[{"selector":"gallery-modal","template":"\n <div *ngIf=\"gallery.state | async as state\">\n\n <div *ngIf=\"state.active\" class=\"g-modal\">\n\n <div class=\"g-btn-close-container\">\n <div *ngIf=\"closeButton\" class=\"g-btn-close\" (click)=\"gallery.close()\"></div>\n </div>\n\n <gallery-main [@popup] [state]=\"state\" [config]=\"gallery.config\"></gallery-main>\n\n <div class=\"g-overlay\" (click)=\"gallery.close()\"></div>\n\n </div>\n\n </div>\n ","styles":["\n *{box-sizing:border-box}.g-modal{position:fixed;left:0;right:0;top:0;bottom:0;background-color:rgba(0,0,0,.6);z-index:2;overflow:hidden;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center}@media (max-width:480px){.g-modal{padding:0}}.g-overlay{position:absolute;left:0;right:0;top:0;bottom:0}.g-btn-close-container{width:100%;display:-webkit-box;display:-ms-flexbox;display:flex}@media (max-width:480px){.g-btn-close-container{-webkit-box-pack:end;-ms-flex-pack:end;justify-content:flex-end}.g-btn-close-container .g-btn-close{margin:.5em;position:relative;right:0;top:0}}.g-btn-close{position:absolute;right:1em;top:1em;z-index:1;cursor:pointer;width:30px;height:30px;-webkit-transition:all .2s linear;transition:all .2s linear;background-image:url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iaXNvLTg4NTktMSI/PjxzdmcgdmVyc2lvbj0iMS4xIiBpZD0iQ2FwYV8xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4PSIwcHgiIHk9IjBweCIgdmlld0JveD0iMCAwIDUwIDUwIiBzdHlsZT0iZW5hYmxlLWJhY2tncm91bmQ6bmV3IDAgMCA1MCA1MDsiIHhtbDpzcGFjZT0icHJlc2VydmUiPjxjaXJjbGUgc3R5bGU9ImZpbGw6I0Q3NUE0QTsiIGN4PSIyNSIgY3k9IjI1IiByPSIyNSIvPjxwb2x5bGluZSBzdHlsZT0iZmlsbDpub25lO3N0cm9rZTojRkZGRkZGO3N0cm9rZS13aWR0aDoyO3N0cm9rZS1saW5lY2FwOnJvdW5kO3N0cm9rZS1taXRlcmxpbWl0OjEwOyIgcG9pbnRzPSIxNiwzNCAyNSwyNSAzNCwxNiAiLz48cG9seWxpbmUgc3R5bGU9ImZpbGw6bm9uZTtzdHJva2U6I0ZGRkZGRjtzdHJva2Utd2lkdGg6MjtzdHJva2UtbGluZWNhcDpyb3VuZDtzdHJva2UtbWl0ZXJsaW1pdDoxMDsiIHBvaW50cz0iMTYsMTYgMjUsMjUgMzQsMzQgIi8+PC9zdmc+)}.g-btn-close:active{-webkit-transform:rotate(180deg) scale(.9);transform:rotate(180deg) scale(.9)}\n "],"changeDetection":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectionStrategy"},"member":"OnPush"},"animations":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"trigger"},"arguments":["popup",[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"state"},"arguments":["in",{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"style"},"arguments":[{"opacity":0.8,"transform":"scale(0.2) translate3d(0, 100px, 0)"}]}]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"transition"},"arguments":["void => *",[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"style"},"arguments":[{"opacity":0.8,"transform":"scale(0.2) translate3d(0, 100px, 0)"}]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"animate"},"arguments":[300]}]]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"transition"},"arguments":["* => void",[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"animate"},"arguments":[300,{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"style"},"arguments":[{"opacity":1,"transform":"scale(1) translate3d(0, 0, 0)"}]}]}]]}]]}]}]}],"members":{"closeButton":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"keyboardInput":[{"__symbolic":"method","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostListener"},"arguments":["window:keydown",["$event"]]}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"../../service/gallery.service","name":"GalleryService"}]}],"ngOnDestroy":[{"__symbolic":"method"}]}}}},{"__symbolic":"module","version":1,"metadata":{"GalleryModalComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component"},"arguments":[{"selector":"gallery-modal","template":"\n <div *ngIf=\"gallery.state | async as state\">\n\n <div *ngIf=\"state.active\" class=\"g-modal\">\n\n <div class=\"g-btn-close-container\">\n <div *ngIf=\"closeButton\" class=\"g-btn-close\" (click)=\"gallery.close()\"></div>\n </div>\n\n <gallery-main [@popup] [state]=\"state\" [config]=\"gallery.config\"></gallery-main>\n\n <div class=\"g-overlay\" (click)=\"gallery.close()\"></div>\n\n </div>\n\n </div>\n ","styles":["\n *{box-sizing:border-box}.g-modal{position:fixed;left:0;right:0;top:0;bottom:0;background-color:rgba(0,0,0,.6);z-index:2;overflow:hidden;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center}@media (max-width:480px){.g-modal{padding:0}}.g-overlay{position:absolute;left:0;right:0;top:0;bottom:0}.g-btn-close-container{width:100%;display:-webkit-box;display:-ms-flexbox;display:flex}@media (max-width:480px){.g-btn-close-container{-webkit-box-pack:end;-ms-flex-pack:end;justify-content:flex-end}.g-btn-close-container .g-btn-close{margin:.5em;position:relative;right:0;top:0}}.g-btn-close{position:absolute;right:1em;top:1em;z-index:1;cursor:pointer;width:30px;height:30px;-webkit-transition:all .2s linear;transition:all .2s linear;background-image:url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iaXNvLTg4NTktMSI/PjxzdmcgdmVyc2lvbj0iMS4xIiBpZD0iQ2FwYV8xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4PSIwcHgiIHk9IjBweCIgdmlld0JveD0iMCAwIDUwIDUwIiBzdHlsZT0iZW5hYmxlLWJhY2tncm91bmQ6bmV3IDAgMCA1MCA1MDsiIHhtbDpzcGFjZT0icHJlc2VydmUiPjxjaXJjbGUgc3R5bGU9ImZpbGw6I0Q3NUE0QTsiIGN4PSIyNSIgY3k9IjI1IiByPSIyNSIvPjxwb2x5bGluZSBzdHlsZT0iZmlsbDpub25lO3N0cm9rZTojRkZGRkZGO3N0cm9rZS13aWR0aDoyO3N0cm9rZS1saW5lY2FwOnJvdW5kO3N0cm9rZS1taXRlcmxpbWl0OjEwOyIgcG9pbnRzPSIxNiwzNCAyNSwyNSAzNCwxNiAiLz48cG9seWxpbmUgc3R5bGU9ImZpbGw6bm9uZTtzdHJva2U6I0ZGRkZGRjtzdHJva2Utd2lkdGg6MjtzdHJva2UtbGluZWNhcDpyb3VuZDtzdHJva2UtbWl0ZXJsaW1pdDoxMDsiIHBvaW50cz0iMTYsMTYgMjUsMjUgMzQsMzQgIi8+PC9zdmc+)}.g-btn-close:active{-webkit-transform:rotate(180deg) scale(.9);transform:rotate(180deg) scale(.9)}\n "],"changeDetection":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectionStrategy"},"member":"OnPush"},"animations":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"trigger"},"arguments":["popup",[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"state"},"arguments":["in",{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"style"},"arguments":[{"opacity":0.8,"transform":"scale(0.2) translate3d(0, 100px, 0)"}]}]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"transition"},"arguments":["void => *",[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"style"},"arguments":[{"opacity":0.8,"transform":"scale(0.2) translate3d(0, 100px, 0)"}]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"animate"},"arguments":[300]}]]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"transition"},"arguments":["* => void",[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"animate"},"arguments":[300,{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"style"},"arguments":[{"opacity":1,"transform":"scale(1) translate3d(0, 0, 0)"}]}]}]]}]]}]}]}],"members":{"closeButton":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"keyboardInput":[{"__symbolic":"method","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostListener"},"arguments":["window:keydown",["$event"]]}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"../../service/gallery.service","name":"GalleryService"}]}],"ngOnDestroy":[{"__symbolic":"method"}]}}}}] | ||
[{"__symbolic":"module","version":3,"metadata":{"GalleryModalComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component"},"arguments":[{"selector":"gallery-modal","template":"\n <div *ngIf=\"gallery.state | async as state\">\n\n <div *ngIf=\"state.active\" class=\"g-modal\">\n\n <div class=\"g-btn-close-container\">\n <div *ngIf=\"closeButton\" class=\"g-btn-close\" (click)=\"gallery.close()\"></div>\n </div>\n\n <gallery-main [@popup] [state]=\"state\" [config]=\"gallery.config\"></gallery-main>\n\n <div class=\"g-overlay\" (click)=\"gallery.close()\"></div>\n\n </div>\n\n </div>\n ","styles":["\n *{box-sizing:border-box}.g-modal{position:fixed;left:0;right:0;top:0;bottom:0;background-color:rgba(0,0,0,.6);z-index:2;overflow:hidden;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center}@media (max-width:480px){.g-modal{padding:0}}.g-overlay{position:absolute;left:0;right:0;top:0;bottom:0}.g-btn-close-container{width:100%;display:-webkit-box;display:-ms-flexbox;display:flex}@media (max-width:480px){.g-btn-close-container{-webkit-box-pack:end;-ms-flex-pack:end;justify-content:flex-end}.g-btn-close-container .g-btn-close{margin:.5em;position:relative;right:0;top:0}}.g-btn-close{z-index:1;position:absolute;right:1em;top:1em;z-index:3;cursor:pointer;width:30px;height:30px;-webkit-transition:all .2s linear;transition:all .2s linear;background-image:url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iaXNvLTg4NTktMSI/PjxzdmcgdmVyc2lvbj0iMS4xIiBpZD0iQ2FwYV8xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4PSIwcHgiIHk9IjBweCIgdmlld0JveD0iMCAwIDUwIDUwIiBzdHlsZT0iZW5hYmxlLWJhY2tncm91bmQ6bmV3IDAgMCA1MCA1MDsiIHhtbDpzcGFjZT0icHJlc2VydmUiPjxjaXJjbGUgc3R5bGU9ImZpbGw6I0Q3NUE0QTsiIGN4PSIyNSIgY3k9IjI1IiByPSIyNSIvPjxwb2x5bGluZSBzdHlsZT0iZmlsbDpub25lO3N0cm9rZTojRkZGRkZGO3N0cm9rZS13aWR0aDoyO3N0cm9rZS1saW5lY2FwOnJvdW5kO3N0cm9rZS1taXRlcmxpbWl0OjEwOyIgcG9pbnRzPSIxNiwzNCAyNSwyNSAzNCwxNiAiLz48cG9seWxpbmUgc3R5bGU9ImZpbGw6bm9uZTtzdHJva2U6I0ZGRkZGRjtzdHJva2Utd2lkdGg6MjtzdHJva2UtbGluZWNhcDpyb3VuZDtzdHJva2UtbWl0ZXJsaW1pdDoxMDsiIHBvaW50cz0iMTYsMTYgMjUsMjUgMzQsMzQgIi8+PC9zdmc+)}.g-btn-close:active{-webkit-transform:rotate(180deg) scale(.9);transform:rotate(180deg) scale(.9)}\n "],"changeDetection":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectionStrategy"},"member":"OnPush"},"animations":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"trigger"},"arguments":["popup",[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"state"},"arguments":["in",{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"style"},"arguments":[{"opacity":0.8,"transform":"scale(0.2) translate3d(0, 100px, 0)"}]}]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"transition"},"arguments":["void => *",[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"style"},"arguments":[{"opacity":0.8,"transform":"scale(0.2) translate3d(0, 100px, 0)"}]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"animate"},"arguments":[300]}]]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"transition"},"arguments":["* => void",[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"animate"},"arguments":[300,{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"style"},"arguments":[{"opacity":1,"transform":"scale(1) translate3d(0, 0, 0)"}]}]}]]}]]}]}]}],"members":{"closeButton":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"keyboardInput":[{"__symbolic":"method","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostListener"},"arguments":["window:keydown",["$event"]]}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"../../service/gallery.service","name":"GalleryService"}]}],"ngOnDestroy":[{"__symbolic":"method"}]}}}},{"__symbolic":"module","version":1,"metadata":{"GalleryModalComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component"},"arguments":[{"selector":"gallery-modal","template":"\n <div *ngIf=\"gallery.state | async as state\">\n\n <div *ngIf=\"state.active\" class=\"g-modal\">\n\n <div class=\"g-btn-close-container\">\n <div *ngIf=\"closeButton\" class=\"g-btn-close\" (click)=\"gallery.close()\"></div>\n </div>\n\n <gallery-main [@popup] [state]=\"state\" [config]=\"gallery.config\"></gallery-main>\n\n <div class=\"g-overlay\" (click)=\"gallery.close()\"></div>\n\n </div>\n\n </div>\n ","styles":["\n *{box-sizing:border-box}.g-modal{position:fixed;left:0;right:0;top:0;bottom:0;background-color:rgba(0,0,0,.6);z-index:2;overflow:hidden;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center}@media (max-width:480px){.g-modal{padding:0}}.g-overlay{position:absolute;left:0;right:0;top:0;bottom:0}.g-btn-close-container{width:100%;display:-webkit-box;display:-ms-flexbox;display:flex}@media (max-width:480px){.g-btn-close-container{-webkit-box-pack:end;-ms-flex-pack:end;justify-content:flex-end}.g-btn-close-container .g-btn-close{margin:.5em;position:relative;right:0;top:0}}.g-btn-close{z-index:1;position:absolute;right:1em;top:1em;z-index:3;cursor:pointer;width:30px;height:30px;-webkit-transition:all .2s linear;transition:all .2s linear;background-image:url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iaXNvLTg4NTktMSI/PjxzdmcgdmVyc2lvbj0iMS4xIiBpZD0iQ2FwYV8xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4PSIwcHgiIHk9IjBweCIgdmlld0JveD0iMCAwIDUwIDUwIiBzdHlsZT0iZW5hYmxlLWJhY2tncm91bmQ6bmV3IDAgMCA1MCA1MDsiIHhtbDpzcGFjZT0icHJlc2VydmUiPjxjaXJjbGUgc3R5bGU9ImZpbGw6I0Q3NUE0QTsiIGN4PSIyNSIgY3k9IjI1IiByPSIyNSIvPjxwb2x5bGluZSBzdHlsZT0iZmlsbDpub25lO3N0cm9rZTojRkZGRkZGO3N0cm9rZS13aWR0aDoyO3N0cm9rZS1saW5lY2FwOnJvdW5kO3N0cm9rZS1taXRlcmxpbWl0OjEwOyIgcG9pbnRzPSIxNiwzNCAyNSwyNSAzNCwxNiAiLz48cG9seWxpbmUgc3R5bGU9ImZpbGw6bm9uZTtzdHJva2U6I0ZGRkZGRjtzdHJva2Utd2lkdGg6MjtzdHJva2UtbGluZWNhcDpyb3VuZDtzdHJva2UtbWl0ZXJsaW1pdDoxMDsiIHBvaW50cz0iMTYsMTYgMjUsMjUgMzQsMzQgIi8+PC9zdmc+)}.g-btn-close:active{-webkit-transform:rotate(180deg) scale(.9);transform:rotate(180deg) scale(.9)}\n "],"changeDetection":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectionStrategy"},"member":"OnPush"},"animations":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"trigger"},"arguments":["popup",[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"state"},"arguments":["in",{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"style"},"arguments":[{"opacity":0.8,"transform":"scale(0.2) translate3d(0, 100px, 0)"}]}]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"transition"},"arguments":["void => *",[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"style"},"arguments":[{"opacity":0.8,"transform":"scale(0.2) translate3d(0, 100px, 0)"}]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"animate"},"arguments":[300]}]]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"transition"},"arguments":["* => void",[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"animate"},"arguments":[300,{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"style"},"arguments":[{"opacity":1,"transform":"scale(1) translate3d(0, 0, 0)"}]}]}]]}]]}]}]}],"members":{"closeButton":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"keyboardInput":[{"__symbolic":"method","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostListener"},"arguments":["window:keydown",["$event"]]}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"../../service/gallery.service","name":"GalleryService"}]}],"ngOnDestroy":[{"__symbolic":"method"}]}}}}] |
import { ElementRef, Renderer2, OnInit } from '@angular/core'; | ||
import { GalleryService } from '../service/gallery.service'; | ||
import 'rxjs/add/observable/fromEvent'; | ||
import 'rxjs/add/observable/from'; | ||
import 'rxjs/add/operator/map'; | ||
export declare class GalleryDirective implements OnInit { | ||
@@ -7,0 +4,0 @@ el: ElementRef; |
import { Directive, ElementRef, Renderer2, Input } from '@angular/core'; | ||
import { GalleryService } from '../service/gallery.service'; | ||
import { Observable } from 'rxjs/Observable'; | ||
import 'rxjs/add/observable/fromEvent'; | ||
import 'rxjs/add/observable/from'; | ||
import 'rxjs/add/operator/map'; | ||
var GalleryDirective = (function () { | ||
@@ -8,0 +5,0 @@ function GalleryDirective(el, renderer, gallery) { |
import { ModuleWithProviders, InjectionToken } from '@angular/core'; | ||
import { GalleryService } from './service/gallery.service'; | ||
import { GalleryConfig } from './config/gallery.config'; | ||
import 'rxjs/add/observable/of'; | ||
import 'rxjs/add/observable/from'; | ||
import 'rxjs/add/observable/fromEvent'; | ||
import 'rxjs/add/observable/interval'; | ||
import 'rxjs/add/operator/take'; | ||
import 'rxjs/add/operator/takeWhile'; | ||
import 'rxjs/add/operator/map'; | ||
import 'rxjs/add/operator/switchMap'; | ||
import 'rxjs/add/operator/do'; | ||
import 'rxjs/add/operator/finally'; | ||
/** Initialize ConfigService with URL */ | ||
@@ -5,0 +15,0 @@ export declare function galleryFactory(config: GalleryConfig): GalleryService; |
@@ -17,2 +17,12 @@ import { NgModule, InjectionToken } from '@angular/core'; | ||
import { TapDirective } from './directive/tap.directive'; | ||
import 'rxjs/add/observable/of'; | ||
import 'rxjs/add/observable/from'; | ||
import 'rxjs/add/observable/fromEvent'; | ||
import 'rxjs/add/observable/interval'; | ||
import 'rxjs/add/operator/take'; | ||
import 'rxjs/add/operator/takeWhile'; | ||
import 'rxjs/add/operator/map'; | ||
import 'rxjs/add/operator/switchMap'; | ||
import 'rxjs/add/operator/do'; | ||
import 'rxjs/add/operator/finally'; | ||
/** Initialize ConfigService with URL */ | ||
@@ -19,0 +29,0 @@ export function galleryFactory(config) { |
{ | ||
"name": "ng-gallery", | ||
"version": "0.6.2", | ||
"version": "0.6.3", | ||
"description": "Angular Image Gallery", | ||
@@ -5,0 +5,0 @@ "keywords": [ |
@@ -1,7 +0,18 @@ | ||
[![npm](https://img.shields.io/npm/v/ng-gallery.svg?maxAge=2592000?style=plastic)](https://www.npmjs.com/package/ng-gallery) [![Travis branch](https://travis-ci.org/MurhafSousli/ng-gallery.svg?branch=master)](https://travis-ci.org/MurhafSousli/ng-gallery) [![npm](https://img.shields.io/npm/dt/ng-gallery.svg?maxAge=2592000?style=plastic)](https://www.npmjs.com/package/ng-gallery) | ||
<p align="center"> | ||
<img height="200px" width="200px" src="assets/logo.svg" style="max-width:100%;"> | ||
</p> | ||
<h1 align="center">Angular Image Gallery</h1> | ||
Angular Image Gallery | [live demo](https://murhafsousli.github.io/ng-gallery/) | ||
Angular image gallery simplifies the process of creating beautiful image gallery for the web and mobile devices. | ||
[![npm](https://img.shields.io/badge/demo-online-ed1c46.svg)](https://murhafsousli.github.io/ng-gallery/) | ||
[![npm](https://img.shields.io/npm/v/ng-gallery.svg?maxAge=2592000?style=plastic)](https://www.npmjs.com/package/ng-gallery) | ||
[![Travis branch](https://travis-ci.org/MurhafSousli/ng-gallery.svg?branch=master)](https://travis-ci.org/MurhafSousli/ng-gallery) | ||
[![npm](https://img.shields.io/npm/dt/ng-gallery.svg?maxAge=2592000?style=plastic)](https://www.npmjs.com/package/ng-gallery) | ||
[![npm](https://img.shields.io/npm/l/express.svg?maxAge=2592000)](/LICENSE) | ||
<p align="center"> | ||
<img src="assets/screenshot.png" style="max-width:100%;"> | ||
</p> | ||
## Installation | ||
@@ -24,2 +35,3 @@ | ||
``` | ||
Here is a [live plunkr](https://plnkr.co/edit/ab3EKfuvfKBppl7T8kFL?p=preview) | ||
@@ -99,6 +111,2 @@ ## Usage | ||
If you identify any errors in this module, or have an idea for an improvement, please open an [issue](https://github.com/MurhafSousli/ng-gallery/issues). I am excited to see what the community thinks of this project, and I would love your input! | ||
## License | ||
[![npm](https://img.shields.io/npm/l/express.svg?maxAge=2592000)](/LICENSE) | ||
If you identify any errors in this module, or have an idea for an improvement, please open an [issue](https://github.com/MurhafSousli/ng-gallery/issues). I am excited to see what the community thinks of this project, and I would love your input! |
import { GalleryState, GalleryImage } from './gallery.state'; | ||
import { GalleryConfig } from '../config/gallery.config'; | ||
import { Subject } from 'rxjs/Subject'; | ||
import { BehaviorSubject } from 'rxjs/BehaviorSubject'; | ||
import { Observable } from 'rxjs/Observable'; | ||
import { Subject } from 'rxjs/Subject'; | ||
import 'rxjs/add/observable/of'; | ||
import 'rxjs/add/observable/interval'; | ||
import 'rxjs/add/operator/switchMap'; | ||
import 'rxjs/add/operator/finally'; | ||
import 'rxjs/add/operator/take'; | ||
import 'rxjs/add/operator/takeWhile'; | ||
import 'rxjs/add/operator/do'; | ||
export declare class GalleryService { | ||
@@ -14,0 +7,0 @@ /** Gallery state */ |
import { Injectable, Optional } from '@angular/core'; | ||
import { defaultState, defaultConfig } from '../config/gallery.default'; | ||
import { Subject } from 'rxjs/Subject'; | ||
import { BehaviorSubject } from 'rxjs/BehaviorSubject'; | ||
import { Observable } from 'rxjs/Observable'; | ||
import { Subject } from 'rxjs/Subject'; | ||
import 'rxjs/add/observable/of'; | ||
import 'rxjs/add/observable/interval'; | ||
import 'rxjs/add/operator/switchMap'; | ||
import 'rxjs/add/operator/finally'; | ||
import 'rxjs/add/operator/take'; | ||
import 'rxjs/add/operator/takeWhile'; | ||
import 'rxjs/add/operator/do'; | ||
var GalleryService = (function () { | ||
@@ -14,0 +7,0 @@ function GalleryService(config) { |
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Long strings
Supply chain riskContains long string literals, which may be a sign of obfuscated or packed code.
Found 1 instance in 1 package
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Long strings
Supply chain riskContains long string literals, which may be a sign of obfuscated or packed code.
Found 1 instance in 1 package
242602
110
1397