@w11k/ngx-present
Version:
Angular based Presentation Tool
158 lines • 12.8 kB
JavaScript
/**
* @fileoverview added by tsickle
* Generated from: lib/overview/overview-route.component.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
import { Component } from '@angular/core';
import { Router } from '@angular/router';
import { OnDestroyMixin, untilComponentDestroyed } from '@w11k/ngx-componentdestroyed';
import { switchMap } from 'rxjs/operators';
import { PresentationService } from '../core/presentation.service';
import { flattenDelayedWithAnimationFrame } from '../core/utils';
import { OverviewService } from './overview.service';
export class OverviewRouteComponent extends OnDestroyMixin {
/**
* @param {?} service
* @param {?} router
* @param {?} presentation
*/
constructor(service, router, presentation) {
super();
this.service = service;
this.router = router;
this.presentation = presentation;
this.zoomFactor = service.state.defaultZoom;
}
/**
* @return {?}
*/
ngOnInit() {
this.presentation
.select((/**
* @param {?} state
* @return {?}
*/
state => state.slides))
.pipe(switchMap((/**
* @param {?} slides
* @return {?}
*/
slides => flattenDelayedWithAnimationFrame(slides))), untilComponentDestroyed(this))
.subscribe((/**
* @param {?} slides
* @return {?}
*/
slides => this.slides = slides));
this.service
.select((/**
* @param {?} x
* @return {?}
*/
x => x))
.pipe(untilComponentDestroyed(this))
.subscribe((/**
* @param {?} view
* @return {?}
*/
view => {
this.view = view;
this.zoomFactor = (100 - (view.zoom + 1)) / view.zoom;
}));
}
/**
* @return {?}
*/
zoomIn() {
this.service.zoomIn();
}
/**
* @return {?}
*/
resetZoom() {
this.service.resetZoom();
}
/**
* @return {?}
*/
zoomOut() {
this.service.zoomOut();
}
/**
* @param {?} slide
* @return {?}
*/
getRouterLink(slide) {
return ['/slide', ...slide.coordinates];
}
/**
* @param {?} event
* @param {?} slide
* @return {?}
*/
navigate(event, slide) {
if (event.altKey) {
event.preventDefault();
this.router.navigate(['presenter', ...slide.coordinates]);
}
}
/**
* @return {?}
*/
toggleBreak() {
this.service.toggleLineBreakOnFirstLevel();
}
/**
* @param {?} slide
* @return {?}
*/
shouldBreak(slide) {
if (!this.service.state.lineBreakOnFirstLevel) {
return false;
}
/** @type {?} */
const subCoordinates = slide.coordinates.slice(1);
for (const coordinate of subCoordinates) {
if (coordinate !== 1) {
return false;
}
}
return true;
}
}
OverviewRouteComponent.decorators = [
{ type: Component, args: [{
selector: 'ngx-present-overview-route',
template: "<div ngxPresentPageTitle>Overview</div>\n\n<mat-toolbar color=\"accent\">\n <ngx-present-menu-toggle-icon></ngx-present-menu-toggle-icon>\n <h1>Overview</h1>\n <span class=\"fill-remaining-space\"></span>\n <span>\n <button mat-icon-button (click)=\"toggleBreak()\" *ngIf=\"!view?.lineBreakOnFirstLevel\">\n <mat-icon>format_align_left</mat-icon>\n </button>\n <button mat-icon-button (click)=\"toggleBreak()\" *ngIf=\"view?.lineBreakOnFirstLevel\">\n <mat-icon>format_align_justify</mat-icon>\n </button>\n <button mat-icon-button (click)=\"zoomIn()\" [disabled]=\"view?.zoom <= view?.minZoom\">\n <mat-icon>zoom_in</mat-icon>\n </button>\n <button mat-icon-button (click)=\"resetZoom()\" [disabled]=\"view?.zoom === view?.defaultZoom\">\n <mat-icon>search</mat-icon>\n </button>\n <button mat-icon-button (click)=\"zoomOut()\" [disabled]=\"view?.zoom >= view?.maxZoom\">\n <mat-icon>zoom_out</mat-icon>\n </button>\n </span>\n</mat-toolbar>\n\n<div class=\"slides\">\n\n <ng-container *ngFor=\"let slide of slides\">\n <div class=\"break\" *ngIf=\"shouldBreak(slide)\"></div>\n <div class=\"slide\"\n [style.width]=\"zoomFactor + 'vw'\"\n [style.height]=\"zoomFactor + 'vh'\"\n >\n <mat-card>\n <mat-card-content>\n <div class=\"scale\" [style.transform]=\"'scale(' + zoomFactor / 100 + ')'\">\n <ngx-present-slide [slide]=\"slide\"></ngx-present-slide>\n </div>\n <a class=\"overlay\"\n [routerLink]=\"getRouterLink(slide)\"\n (click)=\"navigate($event, slide)\"></a>\n </mat-card-content>\n </mat-card>\n </div>\n </ng-container>\n</div>\n",
styles: [".slides{width:100vw;display:flex;flex-direction:row;flex-wrap:wrap;justify-content:flex-start;align-content:flex-start;box-sizing:border-box;padding:.5vw}.break{width:100%}.slide{box-sizing:border-box;margin:.5vw;width:32vw;height:32vh}.slide:hover{cursor:pointer}.slide mat-card{height:100%;box-sizing:border-box;padding:0}.slide mat-card mat-card-content{height:100%;position:relative;overflow:hidden}.slide mat-card mat-card-content>.scale{transform:scale(.32);transform-origin:0 0}.slide mat-card mat-card-content>.overlay{position:absolute;top:0;left:0;width:100%;height:100%;z-index:1000}.fill-remaining-space{flex:1 1 auto}"]
}] }
];
/** @nocollapse */
OverviewRouteComponent.ctorParameters = () => [
{ type: OverviewService },
{ type: Router },
{ type: PresentationService }
];
if (false) {
/** @type {?} */
OverviewRouteComponent.prototype.slides;
/** @type {?} */
OverviewRouteComponent.prototype.zoomFactor;
/** @type {?} */
OverviewRouteComponent.prototype.view;
/**
* @type {?}
* @private
*/
OverviewRouteComponent.prototype.service;
/**
* @type {?}
* @private
*/
OverviewRouteComponent.prototype.router;
/**
* @type {?}
* @private
*/
OverviewRouteComponent.prototype.presentation;
}
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoib3ZlcnZpZXctcm91dGUuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6Im5nOi8vQHcxMWsvbmd4LXByZXNlbnQvIiwic291cmNlcyI6WyJsaWIvb3ZlcnZpZXcvb3ZlcnZpZXctcm91dGUuY29tcG9uZW50LnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7Ozs7O0FBQUEsT0FBTyxFQUFFLFNBQVMsRUFBVSxNQUFNLGVBQWUsQ0FBQztBQUNsRCxPQUFPLEVBQUUsTUFBTSxFQUFFLE1BQU0saUJBQWlCLENBQUM7QUFFekMsT0FBTyxFQUFFLGNBQWMsRUFBRSx1QkFBdUIsRUFBRSxNQUFNLDhCQUE4QixDQUFDO0FBQ3ZGLE9BQU8sRUFBRSxTQUFTLEVBQUUsTUFBTSxnQkFBZ0IsQ0FBQztBQUMzQyxPQUFPLEVBQUUsbUJBQW1CLEVBQUUsTUFBTSw4QkFBOEIsQ0FBQztBQUVuRSxPQUFPLEVBQUUsZ0NBQWdDLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFDakUsT0FBTyxFQUFFLGVBQWUsRUFBaUIsTUFBTSxvQkFBb0IsQ0FBQztBQU9wRSxNQUFNLE9BQU8sc0JBQXVCLFNBQVEsY0FBYzs7Ozs7O0lBS3hELFlBQTZCLE9BQXdCLEVBQ3hCLE1BQWMsRUFDZCxZQUFpQztRQUM1RCxLQUFLLEVBQUUsQ0FBQztRQUhtQixZQUFPLEdBQVAsT0FBTyxDQUFpQjtRQUN4QixXQUFNLEdBQU4sTUFBTSxDQUFRO1FBQ2QsaUJBQVksR0FBWixZQUFZLENBQXFCO1FBRTVELElBQUksQ0FBQyxVQUFVLEdBQUcsT0FBTyxDQUFDLEtBQUssQ0FBQyxXQUFXLENBQUM7SUFDOUMsQ0FBQzs7OztJQUVELFFBQVE7UUFDTixJQUFJLENBQUMsWUFBWTthQUNkLE1BQU07Ozs7UUFBQyxLQUFLLENBQUMsRUFBRSxDQUFDLEtBQUssQ0FBQyxNQUFNLEVBQUM7YUFDN0IsSUFBSSxDQUNILFNBQVM7Ozs7UUFBQyxNQUFNLENBQUMsRUFBRSxDQUFDLGdDQUFnQyxDQUFDLE1BQU0sQ0FBQyxFQUFDLEVBQzdELHVCQUF1QixDQUFDLElBQUksQ0FBQyxDQUM5QjthQUNBLFNBQVM7Ozs7UUFBQyxNQUFNLENBQUMsRUFBRSxDQUFDLElBQUksQ0FBQyxNQUFNLEdBQUcsTUFBTSxFQUFDLENBQUM7UUFFN0MsSUFBSSxDQUFDLE9BQU87YUFDVCxNQUFNOzs7O1FBQUMsQ0FBQyxDQUFDLEVBQUUsQ0FBQyxDQUFDLEVBQUM7YUFDZCxJQUFJLENBQ0gsdUJBQXVCLENBQUMsSUFBSSxDQUFDLENBQzlCO2FBQ0EsU0FBUzs7OztRQUFDLElBQUksQ0FBQyxFQUFFO1lBQ2hCLElBQUksQ0FBQyxJQUFJLEdBQUcsSUFBSSxDQUFDO1lBQ2pCLElBQUksQ0FBQyxVQUFVLEdBQUcsQ0FBQyxHQUFHLEdBQUcsQ0FBQyxJQUFJLENBQUMsSUFBSSxHQUFHLENBQUMsQ0FBQyxDQUFDLEdBQUcsSUFBSSxDQUFDLElBQUksQ0FBQztRQUN4RCxDQUFDLEVBQUMsQ0FBQztJQUNQLENBQUM7Ozs7SUFFRCxNQUFNO1FBQ0osSUFBSSxDQUFDLE9BQU8sQ0FBQyxNQUFNLEVBQUUsQ0FBQztJQUN4QixDQUFDOzs7O0lBRUQsU0FBUztRQUNQLElBQUksQ0FBQyxPQUFPLENBQUMsU0FBUyxFQUFFLENBQUM7SUFDM0IsQ0FBQzs7OztJQUVELE9BQU87UUFDTCxJQUFJLENBQUMsT0FBTyxDQUFDLE9BQU8sRUFBRSxDQUFDO0lBQ3pCLENBQUM7Ozs7O0lBRUQsYUFBYSxDQUFDLEtBQVk7UUFDeEIsT0FBTyxDQUFDLFFBQVEsRUFBRSxHQUFHLEtBQUssQ0FBQyxXQUFXLENBQUMsQ0FBQztJQUMxQyxDQUFDOzs7Ozs7SUFFRCxRQUFRLENBQUMsS0FBaUIsRUFBRSxLQUFZO1FBQ3RDLElBQUksS0FBSyxDQUFDLE1BQU0sRUFBRTtZQUNoQixLQUFLLENBQUMsY0FBYyxFQUFFLENBQUM7WUFDdkIsSUFBSSxDQUFDLE1BQU0sQ0FBQyxRQUFRLENBQUMsQ0FBQyxXQUFXLEVBQUUsR0FBRyxLQUFLLENBQUMsV0FBVyxDQUFDLENBQUMsQ0FBQztTQUMzRDtJQUNILENBQUM7Ozs7SUFFRCxXQUFXO1FBQ1QsSUFBSSxDQUFDLE9BQU8sQ0FBQywyQkFBMkIsRUFBRSxDQUFDO0lBQzdDLENBQUM7Ozs7O0lBRUQsV0FBVyxDQUFDLEtBQVk7UUFDdEIsSUFBSSxDQUFDLElBQUksQ0FBQyxPQUFPLENBQUMsS0FBSyxDQUFDLHFCQUFxQixFQUFFO1lBQzdDLE9BQU8sS0FBSyxDQUFDO1NBQ2Q7O2NBRUssY0FBYyxHQUFHLEtBQUssQ0FBQyxXQUFXLENBQUMsS0FBSyxDQUFDLENBQUMsQ0FBQztRQUVqRCxLQUFLLE1BQU0sVUFBVSxJQUFJLGNBQWMsRUFBRTtZQUN2QyxJQUFJLFVBQVUsS0FBSyxDQUFDLEVBQUU7Z0JBQ3BCLE9BQU8sS0FBSyxDQUFDO2FBQ2Q7U0FDRjtRQUVELE9BQU8sSUFBSSxDQUFDO0lBQ2QsQ0FBQzs7O1lBOUVGLFNBQVMsU0FBQztnQkFDVCxRQUFRLEVBQUUsNEJBQTRCO2dCQUN0Qyx3c0RBQThDOzthQUUvQzs7OztZQU5RLGVBQWU7WUFQZixNQUFNO1lBSU4sbUJBQW1COzs7O0lBVzFCLHdDQUFtQzs7SUFDbkMsNENBQTBCOztJQUMxQixzQ0FBdUM7Ozs7O0lBRTNCLHlDQUF5Qzs7Ozs7SUFDekMsd0NBQStCOzs7OztJQUMvQiw4Q0FBa0QiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDb21wb25lbnQsIE9uSW5pdCB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHsgUm91dGVyIH0gZnJvbSAnQGFuZ3VsYXIvcm91dGVyJztcblxuaW1wb3J0IHsgT25EZXN0cm95TWl4aW4sIHVudGlsQ29tcG9uZW50RGVzdHJveWVkIH0gZnJvbSAnQHcxMWsvbmd4LWNvbXBvbmVudGRlc3Ryb3llZCc7XG5pbXBvcnQgeyBzd2l0Y2hNYXAgfSBmcm9tICdyeGpzL29wZXJhdG9ycyc7XG5pbXBvcnQgeyBQcmVzZW50YXRpb25TZXJ2aWNlIH0gZnJvbSAnLi4vY29yZS9wcmVzZW50YXRpb24uc2VydmljZSc7XG5pbXBvcnQgeyBTbGlkZSB9IGZyb20gJy4uL2NvcmUvcHJlc2VudGF0aW9uLnR5cGVzJztcbmltcG9ydCB7IGZsYXR0ZW5EZWxheWVkV2l0aEFuaW1hdGlvbkZyYW1lIH0gZnJvbSAnLi4vY29yZS91dGlscyc7XG5pbXBvcnQgeyBPdmVydmlld1NlcnZpY2UsIE92ZXJ2aWV3U3RhdGUgfSBmcm9tICcuL292ZXJ2aWV3LnNlcnZpY2UnO1xuXG5AQ29tcG9uZW50KHtcbiAgc2VsZWN0b3I6ICduZ3gtcHJlc2VudC1vdmVydmlldy1yb3V0ZScsXG4gIHRlbXBsYXRlVXJsOiAnLi9vdmVydmlldy1yb3V0ZS5jb21wb25lbnQuaHRtbCcsXG4gIHN0eWxlVXJsczogWycuL292ZXJ2aWV3LXJvdXRlLmNvbXBvbmVudC5zY3NzJ11cbn0pXG5leHBvcnQgY2xhc3MgT3ZlcnZpZXdSb3V0ZUNvbXBvbmVudCBleHRlbmRzIE9uRGVzdHJveU1peGluIGltcGxlbWVudHMgT25Jbml0IHtcbiAgcHVibGljIHNsaWRlczogU2xpZGVbXSB8IHVuZGVmaW5lZDtcbiAgcHVibGljIHpvb21GYWN0b3I6IG51bWJlcjtcbiAgcHVibGljIHZpZXc6IE92ZXJ2aWV3U3RhdGUgfCB1bmRlZmluZWQ7XG5cbiAgY29uc3RydWN0b3IocHJpdmF0ZSByZWFkb25seSBzZXJ2aWNlOiBPdmVydmlld1NlcnZpY2UsXG4gICAgICAgICAgICAgIHByaXZhdGUgcmVhZG9ubHkgcm91dGVyOiBSb3V0ZXIsXG4gICAgICAgICAgICAgIHByaXZhdGUgcmVhZG9ubHkgcHJlc2VudGF0aW9uOiBQcmVzZW50YXRpb25TZXJ2aWNlKSB7XG4gICAgc3VwZXIoKTtcbiAgICB0aGlzLnpvb21GYWN0b3IgPSBzZXJ2aWNlLnN0YXRlLmRlZmF1bHRab29tO1xuICB9XG5cbiAgbmdPbkluaXQoKSB7XG4gICAgdGhpcy5wcmVzZW50YXRpb25cbiAgICAgIC5zZWxlY3Qoc3RhdGUgPT4gc3RhdGUuc2xpZGVzKVxuICAgICAgLnBpcGUoXG4gICAgICAgIHN3aXRjaE1hcChzbGlkZXMgPT4gZmxhdHRlbkRlbGF5ZWRXaXRoQW5pbWF0aW9uRnJhbWUoc2xpZGVzKSksXG4gICAgICAgIHVudGlsQ29tcG9uZW50RGVzdHJveWVkKHRoaXMpLFxuICAgICAgKVxuICAgICAgLnN1YnNjcmliZShzbGlkZXMgPT4gdGhpcy5zbGlkZXMgPSBzbGlkZXMpO1xuXG4gICAgdGhpcy5zZXJ2aWNlXG4gICAgICAuc2VsZWN0KHggPT4geClcbiAgICAgIC5waXBlKFxuICAgICAgICB1bnRpbENvbXBvbmVudERlc3Ryb3llZCh0aGlzKVxuICAgICAgKVxuICAgICAgLnN1YnNjcmliZSh2aWV3ID0+IHtcbiAgICAgICAgdGhpcy52aWV3ID0gdmlldztcbiAgICAgICAgdGhpcy56b29tRmFjdG9yID0gKDEwMCAtICh2aWV3Lnpvb20gKyAxKSkgLyB2aWV3Lnpvb207XG4gICAgICB9KTtcbiAgfVxuXG4gIHpvb21JbigpIHtcbiAgICB0aGlzLnNlcnZpY2Uuem9vbUluKCk7XG4gIH1cblxuICByZXNldFpvb20oKSB7XG4gICAgdGhpcy5zZXJ2aWNlLnJlc2V0Wm9vbSgpO1xuICB9XG5cbiAgem9vbU91dCgpIHtcbiAgICB0aGlzLnNlcnZpY2Uuem9vbU91dCgpO1xuICB9XG5cbiAgZ2V0Um91dGVyTGluayhzbGlkZTogU2xpZGUpIHtcbiAgICByZXR1cm4gWycvc2xpZGUnLCAuLi5zbGlkZS5jb29yZGluYXRlc107XG4gIH1cblxuICBuYXZpZ2F0ZShldmVudDogTW91c2VFdmVudCwgc2xpZGU6IFNsaWRlKSB7XG4gICAgaWYgKGV2ZW50LmFsdEtleSkge1xuICAgICAgZXZlbnQucHJldmVudERlZmF1bHQoKTtcbiAgICAgIHRoaXMucm91dGVyLm5hdmlnYXRlKFsncHJlc2VudGVyJywgLi4uc2xpZGUuY29vcmRpbmF0ZXNdKTtcbiAgICB9XG4gIH1cblxuICB0b2dnbGVCcmVhaygpIHtcbiAgICB0aGlzLnNlcnZpY2UudG9nZ2xlTGluZUJyZWFrT25GaXJzdExldmVsKCk7XG4gIH1cblxuICBzaG91bGRCcmVhayhzbGlkZTogU2xpZGUpOiBib29sZWFuIHtcbiAgICBpZiAoIXRoaXMuc2VydmljZS5zdGF0ZS5saW5lQnJlYWtPbkZpcnN0TGV2ZWwpIHtcbiAgICAgIHJldHVybiBmYWxzZTtcbiAgICB9XG5cbiAgICBjb25zdCBzdWJDb29yZGluYXRlcyA9IHNsaWRlLmNvb3JkaW5hdGVzLnNsaWNlKDEpO1xuXG4gICAgZm9yIChjb25zdCBjb29yZGluYXRlIG9mIHN1YkNvb3JkaW5hdGVzKSB7XG4gICAgICBpZiAoY29vcmRpbmF0ZSAhPT0gMSkge1xuICAgICAgICByZXR1cm4gZmFsc2U7XG4gICAgICB9XG4gICAgfVxuXG4gICAgcmV0dXJuIHRydWU7XG4gIH1cbn1cbiJdfQ==