angular-gallery
Version:
Responsive gallery for Angular with touch screen support.
1 lines • 19.1 kB
JSON
{"__symbolic":"module","version":4,"metadata":{"Images":{"__symbolic":"interface"},"Image":{"__symbolic":"interface"},"GalleryProperties":{"__symbolic":"interface"},"IvyGalleryModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":6,"character":1},"arguments":[{"declarations":[{"__symbolic":"reference","name":"ɵa"}],"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule","line":11,"character":8},{"__symbolic":"reference","name":"ɵc"}],"exports":[{"__symbolic":"reference","name":"ɵa"}],"providers":[{"__symbolic":"reference","name":"Gallery"}],"bootstrap":[],"entryComponents":[{"__symbolic":"reference","name":"ɵa"}]}]}],"members":{}},"Gallery":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Injectable","line":9,"character":1}}],"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","name":"ɵf"},{"__symbolic":"reference","name":"ɵb"}]}],"load":[{"__symbolic":"method"}],"close":[{"__symbolic":"method"}],"applyPropertieDefaults":[{"__symbolic":"method"}]}},"ɵa":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":9,"character":1},"arguments":[{"selector":"carousel, [carousel]","exportAs":"carousel","template":"<div class=\"carousel-backdrop\"></div>\n\n<div class=\"carousel-close\" (click)=\"close()\"></div>\n\n<div class=\"carousel-counter\" *ngIf=\"isCounter\">{{counter}}</div>\n\n<div class=\"carousel-container\" [class.carousel-moving]=\"isMoving\">\n\t<div class=\"carousel-cells\" (transitionend)=\"handleTransitionendCellContainer($event)\">\n\t\t<ng-template ngFor let-image [ngForOf]=\"images\" let-i=\"index\">\n\t\t\t<div class=\"carousel-cell\" \n\t\t\t\t*ngIf=\"i < cellLimit\" \n\t\t\t\t[style.width]=\"getCellWidth()+'px'\"\n\t\t\t\t[style.border-radius]=\"borderRadius+'px'\">\n\t\t\t\t<!-- Image -->\n\t\t\t\t<img \n\t\t\t\t\t*ngIf=\"getFile(i) && getFile(i)['image']\" \n\t\t\t\t\t[src]=\"getFile(i)['image']['path']\"\n\t\t\t\t\t[style.object-fit]=\"objectFit\"\n\t\t\t\t\tdraggable=\"false\" />\n\n\t\t\t\t<!-- Video -->\n\t\t\t\t<ng-template [ngIf]=\"getFile(i) && getFile(i)['type'] === 'video'\">\n\t\t\t\t\t<div class=\"carousel-play\" (click)=\"toggleVideo(video)\"></div>\n\n\t\t\t\t\t<video #video\n\t\t\t\t\t\t[loop]=\"videoProperties.loop\"\n\t\t\t\t\t\t[muted]=\"videoProperties.muted\"\n\t\t\t\t\t\t[controls]=\"isSafari\"\n\t\t\t\t\t\t[style.object-fit]=\"objectFit\"\n\t\t\t\t\t\t[style.border-radius]=\"borderRadius+'px'\">\n\t\t\t\t\t\t\n\t\t\t\t\t\t<source [src]=\"getFile(i)['path']\" type=\"video/mp4\">\n\t\t\t\t\t</video>\n\t\t\t\t</ng-template>\n\t\t\t</div>\n\t\t</ng-template>\n\t</div>\n</div>\n\n<div class=\"carousel-arrows\" \n\t[class.carousel-arrows-outside]=\"arrowsOutside\" \n\t[class.carousel-dark-arrows]=\"arrowsTheme === 'dark'\"\n\t*ngIf=\"arrows\">\n\t\n\t<div class=\"carousel-arrow carousel-arrow-prev\" [class.carousel-arrow-disabled]=\"isPrevArrowDisabled()\" (click)=\"prev()\"></div>\n\t<div class=\"carousel-arrow carousel-arrow-next\" [class.carousel-arrow-disabled]=\"isNextArrowDisabled()\" (click)=\"next()\"></div>\n</div>","styles":[":host{position:relative;display:block;top:0;left:0;width:100%;height:100%;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;z-index:10000;transform-origin:top left;box-sizing:border-box}:host .carousel-container{overflow:hidden;width:100%;height:100%;cursor:-webkit-grab;cursor:grab}:host .carousel-container.carousel-moving{cursor:-webkit-grabbing;cursor:grabbing}:host .carousel-counter{text-align:right;position:absolute;z-index:30;transition:opacity .2s;top:15px;left:10px;border-radius:13px;background-color:rgba(23,37,68,.3);font-size:13px;color:#fff;padding:5px 7px;line-height:initial}:host .carousel-cells{transition:transform .2s;width:100%;height:100%;display:block}:host .carousel-cells ::ng-deep .carousel-cell.swiper-prev-image{transform:translate3d(-100%,0,0)}:host .carousel-cells ::ng-deep .carousel-cell.swiper-next-image{transform:translate3d(100%,0,0)}:host .carousel-cells ::ng-deep .carousel-cell{width:100%;height:100%;text-align:center;position:absolute;display:flex;align-items:center;justify-content:center;overflow:hidden}:host .carousel-cells ::ng-deep .carousel-cell img,:host .carousel-cells ::ng-deep .carousel-cell video{width:100%;height:100%;position:relative;-o-object-fit:contain;object-fit:contain}:host .carousel-cells ::ng-deep .carousel-cell img.swiper-hide{display:none}:host .carousel-cells ::ng-deep .carousel-cell .carousel-play{position:absolute;top:0;left:0;bottom:0;right:0;z-index:1}:host .carousel-arrow{width:40px;height:40px;background-color:#fff;background-repeat:no-repeat;background-size:31px;background-position:center;border-radius:100px;position:absolute;top:50%;margin-top:-20px;z-index:10;cursor:pointer;box-shadow:0 0 5px rgba(0,0,0,.15)}:host .carousel-arrow-prev{left:10px;background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgd2lkdGg9IjI0Ij48cGF0aCBkPSJNMTUuNDEgMTYuNTlMMTAuODMgMTJsNC41OC00LjU5TDE0IDZsLTYgNiA2IDYgMS40MS0xLjQxeiIvPjxwYXRoIGQ9Ik0wIDBoMjR2MjRIMFYweiIgZmlsbD0ibm9uZSIvPjwvc3ZnPg==)}:host .carousel-arrow-next{right:10px;background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgd2lkdGg9IjI0Ij48cGF0aCBkPSJNOC41OSAxNi41OUwxMy4xNyAxMiA4LjU5IDcuNDEgMTAgNmw2IDYtNiA2LTEuNDEtMS40MXoiLz48cGF0aCBkPSJNMCAwaDI0djI0SDBWMHoiIGZpbGw9Im5vbmUiLz48L3N2Zz4=)}:host .carousel-arrows-outside .carousel-arrow-prev{left:-60px}:host .carousel-arrows-outside .carousel-arrow-next{right:-60px}:host .carousel-dark-arrows .carousel-arrow{-webkit-filter:invert(1);filter:invert(1)}:host .carousel-arrow-disabled{cursor:default;opacity:.5}:host .carousel-close{position:fixed;top:10px;right:10px;width:40px;height:40px;z-index:100;cursor:pointer;background-repeat:no-repeat;background-size:31px;background-position:center;background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgd2lkdGg9IjI0Ij48cGF0aCBkPSJNMTkgNi40MUwxNy41OSA1IDEyIDEwLjU5IDYuNDEgNSA1IDYuNDEgMTAuNTkgMTIgNSAxNy41OSA2LjQxIDE5IDEyIDEzLjQxIDE3LjU5IDE5IDE5IDE3LjU5IDEzLjQxIDEyeiIvPjxwYXRoIGQ9Ik0wIDBoMjR2MjRIMHoiIGZpbGw9Im5vbmUiLz48L3N2Zz4=);-webkit-filter:invert(1);filter:invert(1)}:host .carousel-backdrop{position:fixed;top:0;left:0;right:0;bottom:0;background-color:#000;opacity:.5}"]}]}],"members":{"images":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":46,"character":5}}]}],"events":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":58,"character":5}}]}],"height":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":60,"character":5}}]}],"width":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":61,"character":5}}]}],"borderRadius":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":62,"character":5}}]}],"margin":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":63,"character":5}}]}],"objectFit":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":64,"character":5}}]}],"minSwipeDistance":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":65,"character":5}}]}],"transitionDuration":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":67,"character":5}}]}],"transitionTimingFunction":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":79,"character":5}}]}],"videoProperties":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":80,"character":5}}]}],"counterSeparator":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":81,"character":5}}]}],"overflowCellsLimit":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":82,"character":5}}]}],"listeners":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":83,"character":5}}]}],"cellWidth":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":85,"character":5},"arguments":["cellWidth"]}]}],"isCounter":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":91,"character":5},"arguments":["counter"]}]}],"arrows":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":100,"character":5}}]}],"arrowsOutside":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":101,"character":5}}]}],"arrowsTheme":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":102,"character":5}}]}],"overlayProperties":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":104,"character":5}}]}],"hostClassCarousel":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostBinding","line":130,"character":5},"arguments":["class.carousel"]}]}],"hostStyleHeight":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostBinding","line":131,"character":5},"arguments":["style.height"]}]}],"hostStyleWidth":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostBinding","line":132,"character":5},"arguments":["style.width"]}]}],"onWindowResize":[{"__symbolic":"method","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostListener","line":134,"character":5},"arguments":["window:resize",["$event"]]}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"ElementRef","line":144,"character":28},{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectorRef","line":145,"character":21},{"__symbolic":"reference","name":"ɵb"}]}],"ngOnInit":[{"__symbolic":"method"}],"ngAfterViewInit":[{"__symbolic":"method"}],"ngOnChanges":[{"__symbolic":"method"}],"ngOnDestroy":[{"__symbolic":"method"}],"initCarousel":[{"__symbolic":"method"}],"setDimensions":[{"__symbolic":"method"}],"getFile":[{"__symbolic":"method"}],"handleTransitionendCellContainer":[{"__symbolic":"method"}],"toggleVideo":[{"__symbolic":"method"}],"getCurrentIndex":[{"__symbolic":"method"}],"getCellWidth":[{"__symbolic":"method"}],"next":[{"__symbolic":"method"}],"prev":[{"__symbolic":"method"}],"select":[{"__symbolic":"method"}],"isNextArrowDisabled":[{"__symbolic":"method"}],"isPrevArrowDisabled":[{"__symbolic":"method"}],"close":[{"__symbolic":"method"}],"setInitialIndex":[{"__symbolic":"method"}]}},"ɵb":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Injectable","line":3,"character":1}}],"members":{"emitChangeEvent":[{"__symbolic":"method"}]}},"ɵc":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":7,"character":1},"arguments":[{"declarations":[{"__symbolic":"reference","name":"ɵd"},{"__symbolic":"reference","name":"ɵe"}],"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule","line":13,"character":8}],"exports":[],"providers":[{"__symbolic":"reference","name":"ɵf"},{"__symbolic":"reference","name":"ɵb"}],"bootstrap":[],"entryComponents":[{"__symbolic":"reference","name":"ɵd"}]}]}],"members":{}},"ɵd":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":6,"character":1},"arguments":[{"selector":"overlay","template":"<!--\n<div class=\"overlay-backdrop\" \n\t*ngIf=\"properties.overlayBackdrop\" \n\t(click)=\"onBackdropClick()\" \n\t[ngClass]=\"properties.backdropClass\"></div>\n-->\n<!--\n<div class=\"overlay-container\"\n\t[ngStyle]=\"containerStyles\" \n\t[ngClass]=\"properties.overlayClass\">\n\n\t<ng-template ad-host></ng-template>\n</div>\n-->\n\n<ng-template ad-host></ng-template>","styles":[":host{position:absolute;top:0;left:0}:host .overlay-backdrop{position:fixed;top:0;left:0;right:0;bottom:0;background-color:#000;opacity:0;z-index:1000;pointer-events:auto}"]}]}],"members":{"adHost":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":19,"character":5},"arguments":[{"__symbolic":"reference","name":"ɵe"},{"static":true}]}]}],"properties":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":21,"character":5}}]}],"hostOpacity":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostBinding","line":23,"character":5},"arguments":["style.opacity"]}]}],"hostTransition":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostBinding","line":31,"character":5},"arguments":["style.transition"]}]}],"hostTransform":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostBinding","line":38,"character":5},"arguments":["style.transform"]}]}],"hostZIndex":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostBinding","line":39,"character":5},"arguments":["style.z-index"]}]}],"hostWidth":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostBinding","line":44,"character":5},"arguments":["style.width"]}]}],"hostHeight":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostBinding","line":48,"character":5},"arguments":["style.height"]}]}],"hostPosition":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostBinding","line":53,"character":5},"arguments":["style.position"]}]}],"hostShown":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostBinding","line":58,"character":5},"arguments":["class.overlay-shown"]}]}],"onClick":[{"__symbolic":"method","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostListener","line":60,"character":5},"arguments":["document:click",["$event"]]}]}],"transitionEnd":[{"__symbolic":"method","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostListener","line":69,"character":5},"arguments":["transitionend",["$event"]]}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"ComponentFactoryResolver","line":95,"character":42},{"__symbolic":"reference","module":"@angular/core","name":"ElementRef","line":96,"character":27},{"__symbolic":"reference","name":"ɵb"}]}],"ngOnInit":[{"__symbolic":"method"}],"ngAfterViewInit":[{"__symbolic":"method"}],"ngOnDestroy":[{"__symbolic":"method"}],"initialOverlay":[{"__symbolic":"method"}],"showOverlayAnimation":[{"__symbolic":"method"}],"loadComponent":[{"__symbolic":"method"}],"closeOverlay":[{"__symbolic":"method"}],"closeOverlayEnd":[{"__symbolic":"method"}],"handleGlobalEvents":[{"__symbolic":"method"}]}},"ɵe":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Directive","line":2,"character":1},"arguments":[{"selector":"[ad-host]"}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"ViewContainerRef","line":6,"character":39}]}]}},"ɵf":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Injectable","line":7,"character":1}}],"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"ComponentFactoryResolver","line":15,"character":42},{"__symbolic":"reference","module":"@angular/core","name":"ApplicationRef","line":16,"character":24},{"__symbolic":"reference","module":"@angular/core","name":"Injector","line":17,"character":26},{"__symbolic":"reference","name":"ɵb"}]}],"appendComponentToBody":[{"__symbolic":"method"}],"load":[{"__symbolic":"method"}],"close":[{"__symbolic":"method"}],"applyPropertieDefaults":[{"__symbolic":"method"}],"objectLength":[{"__symbolic":"method"}],"handleGlobalEvents":[{"__symbolic":"method"}],"handleCloseEvent":[{"__symbolic":"method"}]}}},"origins":{"Images":"./lib/interfaces","Image":"./lib/interfaces","GalleryProperties":"./lib/interfaces","IvyGalleryModule":"./lib/gallery.module","Gallery":"./lib/gallery.service","ɵa":"./lib/carousel.component","ɵb":"./lib/overlay/event.service","ɵc":"./lib/overlay/overlay.module","ɵd":"./lib/overlay/overlay-container.component","ɵe":"./lib/overlay/ad.directive","ɵf":"./lib/overlay/overlay.service"},"importAs":"angular-gallery"}