ngx-payvent-shared 0.0.3 → 0.0.5
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -4,14 +4,13 @@ import { EdgeToEdge } from '@capawesome/capacitor-android-edge-to-edge-support';
|
|
|
4
4
|
import { Capacitor } from '@capacitor/core';
|
|
5
5
|
import { HttpClient, HttpHeaders, HttpErrorResponse } from '@angular/common/http';
|
|
6
6
|
import { timer, shareReplay, ReplaySubject, of, tap, firstValueFrom, from, share } from 'rxjs';
|
|
7
|
-
import * as i2$
|
|
7
|
+
import * as i2$3 from '@angular/router';
|
|
8
8
|
import { ActivatedRoute, Router, NavigationStart, NavigationEnd, NavigationCancel } from '@angular/router';
|
|
9
9
|
import { catchError, pairwise, map, shareReplay as shareReplay$1 } from 'rxjs/operators';
|
|
10
10
|
import * as uuid from 'uuid';
|
|
11
11
|
import * as signalR from '@microsoft/signalr';
|
|
12
|
-
import * as i2$3 from 'primeng/api';
|
|
13
12
|
import { MessageService, ConfirmationService } from 'primeng/api';
|
|
14
|
-
import * as i1$
|
|
13
|
+
import * as i1$2 from '@angular/common';
|
|
15
14
|
import { Location, CommonModule, NgComponentOutlet, NgTemplateOutlet } from '@angular/common';
|
|
16
15
|
import bowser from 'bowser';
|
|
17
16
|
import { toObservable } from '@angular/core/rxjs-interop';
|
|
@@ -41,7 +40,6 @@ import { CardModule } from 'primeng/card';
|
|
|
41
40
|
import { StyleClassModule } from 'primeng/styleclass';
|
|
42
41
|
import * as i1$1 from 'primeng/toast';
|
|
43
42
|
import { ToastModule } from 'primeng/toast';
|
|
44
|
-
import * as i1$2 from 'primeng/drawer';
|
|
45
43
|
import { DrawerModule } from 'primeng/drawer';
|
|
46
44
|
import { RippleModule } from 'primeng/ripple';
|
|
47
45
|
|
|
@@ -691,7 +689,7 @@ class SidebarService {
|
|
|
691
689
|
});
|
|
692
690
|
}
|
|
693
691
|
openSidebar(component, data = null, options = {}) {
|
|
694
|
-
let defaultPosition = '
|
|
692
|
+
let defaultPosition = 'bottom';
|
|
695
693
|
if (window.innerWidth < 576) {
|
|
696
694
|
document.getElementsByTagName("html")[0].style['overscroll-behavior'] = 'none';
|
|
697
695
|
document.getElementsByTagName("body")[0].style['overscroll-behavior'] = 'none';
|
|
@@ -712,14 +710,6 @@ class SidebarService {
|
|
|
712
710
|
options.contentScrollable = signal(false, ...(ngDevMode ? [{ debugName: "contentScrollable" }] : []));
|
|
713
711
|
if (options.ngStyle.height == '95%' || options.ngStyle.height == '100%')
|
|
714
712
|
options.contentScrollable.set(true);
|
|
715
|
-
if (options.position == 'bottom') {
|
|
716
|
-
options.ngStyle['border-top-left-radius'] = 'var(--p-border-radius)';
|
|
717
|
-
options.ngStyle['border-top-right-radius'] = 'var(--p-border-radius)';
|
|
718
|
-
}
|
|
719
|
-
if (options.position == 'top') {
|
|
720
|
-
options.ngStyle['border-bottom-left-radius'] = 'var(--p-border-radius)';
|
|
721
|
-
options.ngStyle['border-bottom-right-radius'] = 'var(--p-border-radius)';
|
|
722
|
-
}
|
|
723
713
|
}
|
|
724
714
|
let obj = {
|
|
725
715
|
id: uuid.v4(),
|
|
@@ -774,10 +764,14 @@ class SidebarService {
|
|
|
774
764
|
document.getElementsByTagName("html")[0].style['overscroll-behavior'] = 'initial';
|
|
775
765
|
document.getElementsByTagName("body")[0].style['overscroll-behavior'] = 'initial';
|
|
776
766
|
}
|
|
777
|
-
if (s.findIndex(a => !a.visible) >= 0)
|
|
778
|
-
s.splice(s.findIndex(a => !a.visible), 1);
|
|
779
767
|
return s;
|
|
780
768
|
});
|
|
769
|
+
timer(300).subscribe(er => {
|
|
770
|
+
this.sidebars.update(s => {
|
|
771
|
+
return s.filter(a => a.visible);
|
|
772
|
+
;
|
|
773
|
+
});
|
|
774
|
+
});
|
|
781
775
|
}
|
|
782
776
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.2", ngImport: i0, type: SidebarService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
|
|
783
777
|
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.2", ngImport: i0, type: SidebarService, providedIn: 'root' });
|
|
@@ -2421,7 +2415,7 @@ class SidebarComponent {
|
|
|
2421
2415
|
switch (evt.type) {
|
|
2422
2416
|
case 'touchstart':
|
|
2423
2417
|
let targetId = evt.target.id;
|
|
2424
|
-
this.panElement = document.querySelector(`#sidebar-${id}
|
|
2418
|
+
this.panElement = document.querySelector(`#sidebar-${id}`);
|
|
2425
2419
|
this.panElement.style.transition = 'none';
|
|
2426
2420
|
this.initialHeight = this.panElement.offsetHeight;
|
|
2427
2421
|
this.#initialY = evt.touches[0].clientY;
|
|
@@ -2462,11 +2456,11 @@ class SidebarComponent {
|
|
|
2462
2456
|
}
|
|
2463
2457
|
}
|
|
2464
2458
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.2", ngImport: i0, type: SidebarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2465
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.2", type: SidebarComponent, isStandalone: true, selector: "sidebar", viewQueries: [{ propertyName: "contentComponent", first: true, predicate: ["content"], descendants: true, read: ElementRef }], ngImport: i0, template: "@if(sidebarService.sidebars().length > 0) {\r\n<div class=\"sidebar-overlay\">\r\n @for(sidebar of sidebarService.sidebars(); track sidebar.id) {\r\n <div [id]=\"'sidebar-' + sidebar.id\"
|
|
2459
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.2", type: SidebarComponent, isStandalone: true, selector: "sidebar", viewQueries: [{ propertyName: "contentComponent", first: true, predicate: ["content"], descendants: true, read: ElementRef }], ngImport: i0, template: "@if(sidebarService.sidebars().length > 0) {\r\n\r\n<div class=\"sidebar-overlay\">\r\n @for(sidebar of sidebarService.sidebars(); track sidebar.id) {\r\n @if(sidebar.visible) {\r\n <div [id]=\"'sidebar-' + sidebar.id\" class=\"sidebar-container container left-1/2 -translate-x-1/2 w-full\"\r\n [ngStyle]=\"sidebar.options.ngStyle\" animate.enter=\"fade-in\" animate.leave=\"fade-out\">\r\n <div class=\"flex flex-col h-full sidebar-pan-control\" [id]=\"'sidebar-body-' + sidebar.id\"\r\n style=\"touch-action: none;\" (touchmove)=\"onPan($event, sidebar.id)\" (touchstart)=\"onPan($event, sidebar.id)\"\r\n (touchend)=\"onPan($event, sidebar.id)\">\r\n <div class=\"sm:text-right text-center px-3 py-2 inline-block leading-none\" [id]=\"'sidebar-header-' + sidebar.id\">\r\n <div class=\"self-center bg-sky-400 rounded-full inline-block sm:hidden\"\r\n [id]=\"'sidebar-header-hook-' + sidebar.id\" style=\"height: .3rem; width:70px\"></div>\r\n <div class=\"hidden sm:inline-block\">\r\n <a (click)=\"closeCallback(sidebar.id)\" class=\"text-2xl p-2 opacity-40 font-bold\">\r\n <i class=\"fi fi-rr-cross\"></i>\r\n </a>\r\n </div>\r\n </div>\r\n <div #content\r\n [class]=\"{ 'overflow-y-auto': sidebar.options.contentScrollable(), 'p-8': !sidebar.options.noPadding, 'h-full': true }\">\r\n <ng-container *ngComponentOutlet=\"sidebar.component;inputs: sidebar.inputs;\" />\r\n </div>\r\n </div>\r\n </div>\r\n }\r\n }\r\n</div>\r\n}", styles: [".sidebar-container{bottom:0;position:fixed;background-color:var(--p-surface-0);border-top-left-radius:var(--p-border-radius-xl);border-top-right-radius:var(--p-border-radius-xl)}.sidebar-overlay{position:fixed;inset:0;z-index:999;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}.sidebar-pan-control{border-top-left-radius:var(--p-border-radius);border-top-right-radius:var(--p-border-radius)}.fade-in{animation:fadeIn .2s}@keyframes fadeIn{0%{transform:translateY(100%)}to{transform:translateY(0)}}.fade-out{animation:fadeOut .2s}@keyframes fadeOut{0%{transform:translateY(0)}to{transform:translateY(100%)}}\n"], dependencies: [{ kind: "ngmodule", type: DrawerModule }, { kind: "directive", type: NgComponentOutlet, selector: "[ngComponentOutlet]", inputs: ["ngComponentOutlet", "ngComponentOutletInputs", "ngComponentOutletInjector", "ngComponentOutletEnvironmentInjector", "ngComponentOutletContent", "ngComponentOutletNgModule", "ngComponentOutletNgModuleFactory"], exportAs: ["ngComponentOutlet"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "ngmodule", type: HammerModule }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] });
|
|
2466
2460
|
}
|
|
2467
2461
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.2", ngImport: i0, type: SidebarComponent, decorators: [{
|
|
2468
2462
|
type: Component,
|
|
2469
|
-
args: [{ selector: 'sidebar', standalone: true, imports: [DrawerModule, NgComponentOutlet, ButtonModule, HammerModule], template: "@if(sidebarService.sidebars().length > 0) {\r\n<div class=\"sidebar-overlay\">\r\n @for(sidebar of sidebarService.sidebars(); track sidebar.id) {\r\n <div [id]=\"'sidebar-' + sidebar.id\"
|
|
2463
|
+
args: [{ selector: 'sidebar', standalone: true, imports: [DrawerModule, NgComponentOutlet, ButtonModule, HammerModule, CommonModule], template: "@if(sidebarService.sidebars().length > 0) {\r\n\r\n<div class=\"sidebar-overlay\">\r\n @for(sidebar of sidebarService.sidebars(); track sidebar.id) {\r\n @if(sidebar.visible) {\r\n <div [id]=\"'sidebar-' + sidebar.id\" class=\"sidebar-container container left-1/2 -translate-x-1/2 w-full\"\r\n [ngStyle]=\"sidebar.options.ngStyle\" animate.enter=\"fade-in\" animate.leave=\"fade-out\">\r\n <div class=\"flex flex-col h-full sidebar-pan-control\" [id]=\"'sidebar-body-' + sidebar.id\"\r\n style=\"touch-action: none;\" (touchmove)=\"onPan($event, sidebar.id)\" (touchstart)=\"onPan($event, sidebar.id)\"\r\n (touchend)=\"onPan($event, sidebar.id)\">\r\n <div class=\"sm:text-right text-center px-3 py-2 inline-block leading-none\" [id]=\"'sidebar-header-' + sidebar.id\">\r\n <div class=\"self-center bg-sky-400 rounded-full inline-block sm:hidden\"\r\n [id]=\"'sidebar-header-hook-' + sidebar.id\" style=\"height: .3rem; width:70px\"></div>\r\n <div class=\"hidden sm:inline-block\">\r\n <a (click)=\"closeCallback(sidebar.id)\" class=\"text-2xl p-2 opacity-40 font-bold\">\r\n <i class=\"fi fi-rr-cross\"></i>\r\n </a>\r\n </div>\r\n </div>\r\n <div #content\r\n [class]=\"{ 'overflow-y-auto': sidebar.options.contentScrollable(), 'p-8': !sidebar.options.noPadding, 'h-full': true }\">\r\n <ng-container *ngComponentOutlet=\"sidebar.component;inputs: sidebar.inputs;\" />\r\n </div>\r\n </div>\r\n </div>\r\n }\r\n }\r\n</div>\r\n}", styles: [".sidebar-container{bottom:0;position:fixed;background-color:var(--p-surface-0);border-top-left-radius:var(--p-border-radius-xl);border-top-right-radius:var(--p-border-radius-xl)}.sidebar-overlay{position:fixed;inset:0;z-index:999;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}.sidebar-pan-control{border-top-left-radius:var(--p-border-radius);border-top-right-radius:var(--p-border-radius)}.fade-in{animation:fadeIn .2s}@keyframes fadeIn{0%{transform:translateY(100%)}to{transform:translateY(0)}}.fade-out{animation:fadeOut .2s}@keyframes fadeOut{0%{transform:translateY(0)}to{transform:translateY(100%)}}\n"] }]
|
|
2470
2464
|
}], propDecorators: { contentComponent: [{
|
|
2471
2465
|
type: ViewChild,
|
|
2472
2466
|
args: ['content', { read: ElementRef }]
|
|
@@ -2602,7 +2596,7 @@ class StoriesComponent {
|
|
|
2602
2596
|
this.storyContainer().nativeElement.style.left = '0';
|
|
2603
2597
|
}
|
|
2604
2598
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.2", ngImport: i0, type: StoriesComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2605
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.2", type: StoriesComponent, isStandalone: true, selector: "stories", inputs: { stories: { classPropertyName: "stories", publicName: "stories", isSignal: true, isRequired: false, transformFunction: null }, footerTemplate: { classPropertyName: "footerTemplate", publicName: "footerTemplate", isSignal: true, isRequired: false, transformFunction: null }, subFooterTemplate: { classPropertyName: "subFooterTemplate", publicName: "subFooterTemplate", isSignal: true, isRequired: false, transformFunction: null }, sideTemplate: { classPropertyName: "sideTemplate", publicName: "sideTemplate", isSignal: true, isRequired: false, transformFunction: null }, showSubFooter: { classPropertyName: "showSubFooter", publicName: "showSubFooter", isSignal: true, isRequired: false, transformFunction: null }, descriptionOpen: { classPropertyName: "descriptionOpen", publicName: "descriptionOpen", isSignal: true, isRequired: false, transformFunction: null }, fullScreen: { classPropertyName: "fullScreen", publicName: "fullScreen", isSignal: true, isRequired: false, transformFunction: null }, defaultDuration: { classPropertyName: "defaultDuration", publicName: "defaultDuration", isSignal: true, isRequired: false, transformFunction: null }, paused: { classPropertyName: "paused", publicName: "paused", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { fullScreen: "fullScreenChange", storyChanged: "storyChanged", paused: "pausedChange", close: "close" }, viewQueries: [{ propertyName: "videoPlayer", first: true, predicate: ["videoPlayer"], descendants: true, isSignal: true }, { propertyName: "storyContainer", first: true, predicate: ["viewContainer"], descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"w-full h-full story-container z-52\" #viewContainer>\r\n\r\n @if(stories().length > 1) {\r\n <div class=\"story-lines-container\">\r\n <div class=\"flex gap-1 story-lines p-3 justify-center\">\r\n @for (story of stories(); track story.id; let i = $index) {\r\n\r\n <div class=\"story-line transition-all\" [ngClass]=\"{ 'story-line-selected' : currentStoryIndex() == i }\">\r\n @if (currentStoryIndex() >= i) {\r\n <div class=\"story-line-inner bg-surface-100\"\r\n [style.width]=\"currentStoryIndex() > i ? '100%' : (currentStoryIndex() == i ? this.currentProgress() + '%' : '0')\">\r\n </div>\r\n }\r\n </div>\r\n }\r\n </div>\r\n </div>\r\n }\r\n\r\n <div class=\"story-backdrop z-1\" (click)=\"next()\">\r\n @if (currentStory()?.type=='image') {\r\n <img [src]=\"currentStory().src\" />\r\n } @else if (currentStory()?.type=='video') {\r\n <video class=\"w-full\">\r\n <source [src]=\"currentStory().src\" type=\"video/mp4\">\r\n </video>\r\n }\r\n </div>\r\n\r\n\r\n <div class=\"story-content sm:border-round\">\r\n\r\n\r\n @if (currentStory()?.type == 'image') {\r\n <img [src]=\"currentStory().src\" (click)=\"next()\" />\r\n }\r\n @if (currentStory()?.type=='video') {\r\n <video class=\"w-full h-full\" (canplay)=\"videoPlayer.play()\" (loadedmetadata)=\"videoPlayer.muted = mute()\"\r\n #videoPlayer autoplay [muted]=\"mute()\" [playsInline]=\"true\" loop (click)=\"next()\">\r\n <source [src]=\"currentStory().src\" type=\"video/mp4\">\r\n\r\n </video>\r\n }\r\n\r\n </div>\r\n <div class=\"top-7 right-5 z-3 absolute flex gap-2\">\r\n @if (currentStory()?.type=='video') {\r\n <div class=\"w-12 h-12 rounded-full text-center content-center bg-surface-500/30 text-white\">\r\n <a (click)=\"mute.set(!mute())\" style=\"color: inherit;\">\r\n @if(mute()) {\r\n <i class=\"fi text-2xl fi-rr-volume-mute\"></i>\r\n }\r\n @else {\r\n <i class=\"fi text-2xl fi-rr-volume\"></i>\r\n }\r\n </a>\r\n </div>\r\n }\r\n\r\n @if(stories().length > 1) {\r\n <div class=\"w-12 h-12 rounded-full text-center content-center bg-surface-500/30 text-white\">\r\n <a (click)=\"paused.set(!paused())\" style=\"color:inherit\">\r\n @if (paused()) {\r\n <i class=\"fi fi-rr-play text-2xl\"></i>\r\n }\r\n @else {\r\n <i class=\"fi fi-rr-pause text-2xl\"></i>\r\n }\r\n\r\n </a>\r\n </div>\r\n @if(fullScreen()) {\r\n <div class=\"w-12 h-12 rounded-full text-center content-center bg-surface-500/30 text-white\">\r\n <a (click)=\"emitClose()\" style=\"color: inherit;\">\r\n <i class=\"fi text-2xl fi-rr-compress\"></i>\r\n </a>\r\n </div>\r\n }\r\n @if(!fullScreen()) {\r\n <div class=\"w-12 h-12 rounded-full text-center content-center bg-surface-500/30 text-white\">\r\n <a (click)=\"setFullScreen()\" style=\"color: inherit;\">\r\n <i class=\"fi text-2xl fi-rr-expand\"></i>\r\n </a>\r\n </div>\r\n }\r\n }\r\n </div>\r\n\r\n <div [class]=\"'story-overlay absolute bottom-0 p-2 left-0 z-2 gap-2 ' + (descriptionOpen() ? 'scrollable' : '')\">\r\n @if(footerTemplate()){\r\n <div class=\"story-footer\">\r\n <ng-container [ngTemplateOutlet]=\"footerTemplate()\"\r\n [ngTemplateOutletContext]=\"{ $implicit: currentStory() }\"></ng-container>\r\n </div>\r\n }\r\n\r\n\r\n\r\n </div>\r\n\r\n\r\n\r\n</div>", styles: [".story-content{z-index:1;background-repeat:no-repeat;position:absolute;overflow:hidden;object-fit:contain;text-align:center;align-content:center;width:100%;height:100%}.story-container{min-height:300px;overflow:hidden}.story-backdrop{background-color:#000;position:absolute;left:0;top:0;width:100%;height:100%;filter:blur(20px) brightness(60%);text-align:center;align-content:center;overflow:hidden}.story-backdrop video,.story-backdrop img{object-fit:cover;display:inline-block;width:100%;height:100%}.story-content video,.story-content img{object-fit:contain;display:inline-block;width:100%;height:100%}.story-content img{width:100%}.story-lines-container{position:absolute;top:0;z-index:10;width:100%;margin-inline:auto;text-align:center}.story-line{background:#fff6;border-radius:6px;height:8px;width:8px}.story-line-selected{width:50px}.story-footer{color:#fff;flex:1;min-width:0}p-skeleton .p-skeleton{background-color:#373737cc}.story-overlay{color:#fff;text-shadow:0 0px 3px rgba(0,0,0)}.story-side{text-align:center}.story-side .side-icon{font-size:24px}.story-line-inner{background:#fff;border-radius:6px;height:8px;min-width:8px;transition:width .1s}.story-container{background-color:#000}.story-overlay.scrollable{height:90%;padding-top:0}.story-overlay.scrollable .story-footer{height:100%;overflow-y:auto}.story-overlay.scrollable .story-description{height:initial}.story-footer::-webkit-scrollbar{display:none}@media (max-width: 567px){.story-content{width:100%;height:100%;border-radius:0;background-color:transparent;margin:0}}.story-controls{top:10px;right:10px;position:absolute;z-index:3}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$
|
|
2599
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.2", type: StoriesComponent, isStandalone: true, selector: "stories", inputs: { stories: { classPropertyName: "stories", publicName: "stories", isSignal: true, isRequired: false, transformFunction: null }, footerTemplate: { classPropertyName: "footerTemplate", publicName: "footerTemplate", isSignal: true, isRequired: false, transformFunction: null }, subFooterTemplate: { classPropertyName: "subFooterTemplate", publicName: "subFooterTemplate", isSignal: true, isRequired: false, transformFunction: null }, sideTemplate: { classPropertyName: "sideTemplate", publicName: "sideTemplate", isSignal: true, isRequired: false, transformFunction: null }, showSubFooter: { classPropertyName: "showSubFooter", publicName: "showSubFooter", isSignal: true, isRequired: false, transformFunction: null }, descriptionOpen: { classPropertyName: "descriptionOpen", publicName: "descriptionOpen", isSignal: true, isRequired: false, transformFunction: null }, fullScreen: { classPropertyName: "fullScreen", publicName: "fullScreen", isSignal: true, isRequired: false, transformFunction: null }, defaultDuration: { classPropertyName: "defaultDuration", publicName: "defaultDuration", isSignal: true, isRequired: false, transformFunction: null }, paused: { classPropertyName: "paused", publicName: "paused", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { fullScreen: "fullScreenChange", storyChanged: "storyChanged", paused: "pausedChange", close: "close" }, viewQueries: [{ propertyName: "videoPlayer", first: true, predicate: ["videoPlayer"], descendants: true, isSignal: true }, { propertyName: "storyContainer", first: true, predicate: ["viewContainer"], descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"w-full h-full story-container z-52\" #viewContainer>\r\n\r\n @if(stories().length > 1) {\r\n <div class=\"story-lines-container\">\r\n <div class=\"flex gap-1 story-lines p-3 justify-center\">\r\n @for (story of stories(); track story.id; let i = $index) {\r\n\r\n <div class=\"story-line transition-all\" [ngClass]=\"{ 'story-line-selected' : currentStoryIndex() == i }\">\r\n @if (currentStoryIndex() >= i) {\r\n <div class=\"story-line-inner bg-surface-100\"\r\n [style.width]=\"currentStoryIndex() > i ? '100%' : (currentStoryIndex() == i ? this.currentProgress() + '%' : '0')\">\r\n </div>\r\n }\r\n </div>\r\n }\r\n </div>\r\n </div>\r\n }\r\n\r\n <div class=\"story-backdrop z-1\" (click)=\"next()\">\r\n @if (currentStory()?.type=='image') {\r\n <img [src]=\"currentStory().src\" />\r\n } @else if (currentStory()?.type=='video') {\r\n <video class=\"w-full\">\r\n <source [src]=\"currentStory().src\" type=\"video/mp4\">\r\n </video>\r\n }\r\n </div>\r\n\r\n\r\n <div class=\"story-content sm:border-round\">\r\n\r\n\r\n @if (currentStory()?.type == 'image') {\r\n <img [src]=\"currentStory().src\" (click)=\"next()\" />\r\n }\r\n @if (currentStory()?.type=='video') {\r\n <video class=\"w-full h-full\" (canplay)=\"videoPlayer.play()\" (loadedmetadata)=\"videoPlayer.muted = mute()\"\r\n #videoPlayer autoplay [muted]=\"mute()\" [playsInline]=\"true\" loop (click)=\"next()\">\r\n <source [src]=\"currentStory().src\" type=\"video/mp4\">\r\n\r\n </video>\r\n }\r\n\r\n </div>\r\n <div class=\"top-7 right-5 z-3 absolute flex gap-2\">\r\n @if (currentStory()?.type=='video') {\r\n <div class=\"w-12 h-12 rounded-full text-center content-center bg-surface-500/30 text-white\">\r\n <a (click)=\"mute.set(!mute())\" style=\"color: inherit;\">\r\n @if(mute()) {\r\n <i class=\"fi text-2xl fi-rr-volume-mute\"></i>\r\n }\r\n @else {\r\n <i class=\"fi text-2xl fi-rr-volume\"></i>\r\n }\r\n </a>\r\n </div>\r\n }\r\n\r\n @if(stories().length > 1) {\r\n <div class=\"w-12 h-12 rounded-full text-center content-center bg-surface-500/30 text-white\">\r\n <a (click)=\"paused.set(!paused())\" style=\"color:inherit\">\r\n @if (paused()) {\r\n <i class=\"fi fi-rr-play text-2xl\"></i>\r\n }\r\n @else {\r\n <i class=\"fi fi-rr-pause text-2xl\"></i>\r\n }\r\n\r\n </a>\r\n </div>\r\n @if(fullScreen()) {\r\n <div class=\"w-12 h-12 rounded-full text-center content-center bg-surface-500/30 text-white\">\r\n <a (click)=\"emitClose()\" style=\"color: inherit;\">\r\n <i class=\"fi text-2xl fi-rr-compress\"></i>\r\n </a>\r\n </div>\r\n }\r\n @if(!fullScreen()) {\r\n <div class=\"w-12 h-12 rounded-full text-center content-center bg-surface-500/30 text-white\">\r\n <a (click)=\"setFullScreen()\" style=\"color: inherit;\">\r\n <i class=\"fi text-2xl fi-rr-expand\"></i>\r\n </a>\r\n </div>\r\n }\r\n }\r\n </div>\r\n\r\n <div [class]=\"'story-overlay absolute bottom-0 p-2 left-0 z-2 gap-2 ' + (descriptionOpen() ? 'scrollable' : '')\">\r\n @if(footerTemplate()){\r\n <div class=\"story-footer\">\r\n <ng-container [ngTemplateOutlet]=\"footerTemplate()\"\r\n [ngTemplateOutletContext]=\"{ $implicit: currentStory() }\"></ng-container>\r\n </div>\r\n }\r\n\r\n\r\n\r\n </div>\r\n\r\n\r\n\r\n</div>", styles: [".story-content{z-index:1;background-repeat:no-repeat;position:absolute;overflow:hidden;object-fit:contain;text-align:center;align-content:center;width:100%;height:100%}.story-container{min-height:300px;overflow:hidden}.story-backdrop{background-color:#000;position:absolute;left:0;top:0;width:100%;height:100%;filter:blur(20px) brightness(60%);text-align:center;align-content:center;overflow:hidden}.story-backdrop video,.story-backdrop img{object-fit:cover;display:inline-block;width:100%;height:100%}.story-content video,.story-content img{object-fit:contain;display:inline-block;width:100%;height:100%}.story-content img{width:100%}.story-lines-container{position:absolute;top:0;z-index:10;width:100%;margin-inline:auto;text-align:center}.story-line{background:#fff6;border-radius:6px;height:8px;width:8px}.story-line-selected{width:50px}.story-footer{color:#fff;flex:1;min-width:0}p-skeleton .p-skeleton{background-color:#373737cc}.story-overlay{color:#fff;text-shadow:0 0px 3px rgba(0,0,0)}.story-side{text-align:center}.story-side .side-icon{font-size:24px}.story-line-inner{background:#fff;border-radius:6px;height:8px;min-width:8px;transition:width .1s}.story-container{background-color:#000}.story-overlay.scrollable{height:90%;padding-top:0}.story-overlay.scrollable .story-footer{height:100%;overflow-y:auto}.story-overlay.scrollable .story-description{height:initial}.story-footer::-webkit-scrollbar{display:none}@media (max-width: 567px){.story-content{width:100%;height:100%;border-radius:0;background-color:transparent;margin:0}}.story-controls{top:10px;right:10px;position:absolute;z-index:3}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: ButtonModule }], encapsulation: i0.ViewEncapsulation.None });
|
|
2606
2600
|
}
|
|
2607
2601
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.2", ngImport: i0, type: StoriesComponent, decorators: [{
|
|
2608
2602
|
type: Component,
|
|
@@ -2733,13 +2727,13 @@ class LoginComponent {
|
|
|
2733
2727
|
// window.login.userLoggedIn(this.userService.currentUser);
|
|
2734
2728
|
// });
|
|
2735
2729
|
}
|
|
2736
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.2", ngImport: i0, type: LoginComponent, deps: [{ token: UserAccountService }, { token: GlobalService }, { token: i2$
|
|
2730
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.2", ngImport: i0, type: LoginComponent, deps: [{ token: UserAccountService }, { token: GlobalService }, { token: i2$3.Router }], target: i0.ɵɵFactoryTarget.Component });
|
|
2737
2731
|
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.2", type: LoginComponent, isStandalone: true, selector: "app-login", ngImport: i0, template: "<!-- <app-loader></app-loader> -->\r\n<div style=\"max-width:400px; width:90%; margin: 0px auto\">\r\n <payvent-login-form></payvent-login-form>\r\n</div>", styles: [""], dependencies: [{ kind: "component", type: LoginFormComponent, selector: "payvent-login-form", inputs: ["tokenType", "clientId", "type"] }] });
|
|
2738
2732
|
}
|
|
2739
2733
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.2", ngImport: i0, type: LoginComponent, decorators: [{
|
|
2740
2734
|
type: Component,
|
|
2741
2735
|
args: [{ selector: 'app-login', standalone: true, imports: [LoginFormComponent], template: "<!-- <app-loader></app-loader> -->\r\n<div style=\"max-width:400px; width:90%; margin: 0px auto\">\r\n <payvent-login-form></payvent-login-form>\r\n</div>" }]
|
|
2742
|
-
}], ctorParameters: () => [{ type: UserAccountService }, { type: GlobalService }, { type: i2$
|
|
2736
|
+
}], ctorParameters: () => [{ type: UserAccountService }, { type: GlobalService }, { type: i2$3.Router }] });
|
|
2743
2737
|
|
|
2744
2738
|
// export * from './loading-button/loading-button.component';
|
|
2745
2739
|
// export * from './location-select/location-select.component';
|