@rtsee/ngx 0.0.99 → 0.0.101
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.
- package/dist/ngx/fesm2022/rtsee-ngx.mjs +90 -51
- package/dist/ngx/fesm2022/rtsee-ngx.mjs.map +1 -1
- package/dist/ngx/index.d.ts +8 -3
- package/dist/ngx/src/lib/theme/common-variables.scss +3 -0
- package/dist/ngx/src/lib/theme/containers/shell.scss +1 -1
- package/dist/ngx/src/lib/theme/messenger/messenger-header.scss +11 -1
- package/dist/ngx/src/lib/theme/messenger/messenger.scss +3 -0
- package/dist/ngx/src/lib/theme/messenger/payment-product-snippet.scss +140 -19
- package/dist/ngx/src/lib/theme/messenger/payments.scss +137 -17
- package/dist/ngx/src/lib/theme/messenger/profile.scss +267 -10
- package/dist/ngx/src/lib/theme/presentation/presentation.scss +9 -3
- package/dist/ngx/src/lib/theme/presentation/slide.scss +4 -0
- package/dist/ngx/src/lib/theme/presentation/story-thumbnail.scss +1 -0
- package/package.json +11 -11
|
@@ -12,7 +12,7 @@ import { interval, tap, map, filter } from 'rxjs';
|
|
|
12
12
|
import { RTSeeTextLabelKeys, hasPermission, RTSeePeerPermissions } from '@rtsee/core';
|
|
13
13
|
import * as i2$2 from 'primeng/message';
|
|
14
14
|
import { Message, MessageModule } from 'primeng/message';
|
|
15
|
-
import { AuthEndpointsKeys, DEFAULT_ROUTE_NAMES } from '@rtsee/auth';
|
|
15
|
+
import { AuthEndpointsKeys, LS_TOKEN_LABEL, LS_USER_LABEL, DEFAULT_ROUTE_NAMES } from '@rtsee/auth';
|
|
16
16
|
import * as i2 from '@angular/router';
|
|
17
17
|
import { RouterLink, RouterLinkActive, NavigationEnd } from '@angular/router';
|
|
18
18
|
import { Divider } from 'primeng/divider';
|
|
@@ -28,7 +28,6 @@ import { ImageCropperComponent } from 'ngx-image-cropper';
|
|
|
28
28
|
import { RadioButton } from 'primeng/radiobutton';
|
|
29
29
|
import { InputText } from 'primeng/inputtext';
|
|
30
30
|
import { loadStripe } from '@stripe/stripe-js';
|
|
31
|
-
import { ProgressSpinner } from 'primeng/progressspinner';
|
|
32
31
|
import { Card } from 'primeng/card';
|
|
33
32
|
import { Chip } from 'primeng/chip';
|
|
34
33
|
import { CdkCopyToClipboard } from '@angular/cdk/clipboard';
|
|
@@ -57,6 +56,7 @@ import { Tooltip } from 'primeng/tooltip';
|
|
|
57
56
|
import { PanelMenu } from 'primeng/panelmenu';
|
|
58
57
|
import { Menu } from 'primeng/menu';
|
|
59
58
|
import { Password } from 'primeng/password';
|
|
59
|
+
import { ProgressSpinner } from 'primeng/progressspinner';
|
|
60
60
|
import { AutosizeModule } from 'ngx-autosize';
|
|
61
61
|
import { debounceTime } from 'rxjs/operators';
|
|
62
62
|
import shave from 'shave';
|
|
@@ -307,11 +307,11 @@ class ProfileComponent {
|
|
|
307
307
|
}, 200);
|
|
308
308
|
}
|
|
309
309
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: ProfileComponent, deps: [{ token: RTSeeAuthService }, { token: i2.Router }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
310
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", type: ProfileComponent, isStandalone: true, selector: "rtsee-profile", inputs: { messenger: "messenger", peer: "peer" }, ngImport: i0, template: "<div class=\"rtsee-messenger-profile\">\n @if (!messenger.ownProfileOpened) {\n <ul class=\"rtsee-messenger-profile-actions\">\n <li class=\"rtsee-messenger-profile-actions-item\">\n <p-button\n (click)=\"call()\"\n size=\"large\"\n severity=\"secondary\"\n icon=\"pi pi-phone\"\n />\n </li>\n <li class=\"rtsee-messenger-profile-actions-item\">\n <p-button\n (click)=\"videoCall()\"\n size=\"large\"\n severity=\"secondary\"\n icon=\"pi pi-video\"\n />\n </li>\n </ul>\n }\n\n @if (messenger.ownProfileOpened && messenger.myPeer && !messenger.myPeer.isAnonymous) {\n <div class=\"rtsee-messenger-profile-info\">\n <p class=\"rtsee-messenger-profile-info-name\">{{messenger.myPeer.name}}</p>\n
|
|
310
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", type: ProfileComponent, isStandalone: true, selector: "rtsee-profile", inputs: { messenger: "messenger", peer: "peer" }, ngImport: i0, template: "<div class=\"rtsee-messenger-profile\">\n @if (!messenger.ownProfileOpened) {\n <ul class=\"rtsee-messenger-profile-actions\">\n <li class=\"rtsee-messenger-profile-actions-item\">\n <p-button\n (click)=\"call()\"\n size=\"large\"\n severity=\"secondary\"\n icon=\"pi pi-phone\"\n />\n </li>\n <li class=\"rtsee-messenger-profile-actions-item\">\n <p-button\n (click)=\"videoCall()\"\n size=\"large\"\n severity=\"secondary\"\n icon=\"pi pi-video\"\n />\n </li>\n </ul>\n }\n\n @if (messenger.ownProfileOpened && messenger.myPeer && !messenger.myPeer.isAnonymous) {\n <div class=\"rtsee-messenger-profile-info\">\n <div class=\"rtsee-messenger-profile-glass-card\">\n <p class=\"rtsee-messenger-profile-info-name\">{{messenger.myPeer.name}}</p>\n <div class=\"rtsee-messenger-profile-info-language\">\n <p class=\"rtsee-messenger-profile-info-language-label\">Language:</p>\n <p-select [options]=\"messenger.languageOptions\"\n [(ngModel)]=\"messenger.currentLanguage\"\n (ngModelChange)=\"setLanguage()\"\n optionLabel=\"key\"\n optionValue=\"key\"\n [placeholder]=\"messenger.labels[RTSeeTextLabelKeys.MESSANGER_LANGUAGE_PLACEHOLDER]\"\n class=\"rtsee-messenger-profile-info-language-select\"\n />\n </div>\n <div class=\"rtsee-messenger-profile-edit-btn\">\n <p-button [label]=\"messenger.labels[RTSeeTextLabelKeys.MESSENGER_EDIT_PROFILE_BTN_LABEL]\"\n (click)=\"messenger.openManageProfile()\"\n ></p-button>\n </div>\n </div>\n\n @if (messenger.myPeer.plan) {\n <p-divider></p-divider>\n <div class=\"rtsee-messenger-profile-glass-card\">\n <div class=\"rtsee-messenger-profile-plan-status\">\n <p-message severity=\"success\">\n <span>{{messenger.myPeer.plan.productName}}</span>\n </p-message>\n </div>\n <div class=\"rtsee-messenger-profile-manage-plan-btn\">\n <p-button [label]=\"messenger.labels[RTSeeTextLabelKeys.MANAGE_PLAN]\"\n (click)=\"messenger.openManagePlanPage()\"\n ></p-button>\n </div>\n </div>\n } @else {\n <p-divider></p-divider>\n <div class=\"rtsee-messenger-profile-subscribe-btn\">\n <p-button [label]=\"messenger.labels[RTSeeTextLabelKeys.SUBSCRIBE_LABEL]\"\n (click)=\"messenger.openPaymentPage()\"\n ></p-button>\n </div>\n }\n </div>\n }\n\n @if (messenger.ownProfileOpened && messenger.myPeer?.isAnonymous) {\n <div class=\"rtsee-messenger-profile-auth\">\n <div class=\"rtsee-messenger-profile-anon-message\">\n @if (!messenger.currentLanguage || messenger.currentLanguage === 'eng') {\n <p-message severity=\"warn\">\n <span>This is an anonymous identity we've generated for you.</span>\n <span> </span>\n <span>You can use it to play around.</span>\n <span> </span>\n <span>But we are guilty of erasing these time after time.</span>\n <span> </span>\n <span>So please Sign Up if you're looking for something more stable :)</span>\n </p-message>\n } @else if (messenger.currentLanguage === 'ua') {\n <p-message severity=\"warn\">\n <span>\u041C\u0438 \u0437\u0433\u0435\u043D\u0435\u0440\u0443\u0432\u0430\u043B\u0438 \u0434\u043B\u044F \u0432\u0430\u0441 \u0430\u043D\u043E\u043D\u0456\u043C\u043D\u0443 \u043E\u0441\u043E\u0431\u0438\u0441\u0442\u0456\u0441\u0442\u044C.</span>\n <span> </span>\n <span>\u0421\u043A\u043E\u0440\u0438\u0441\u0442\u0430\u0439\u0442\u0435\u0441\u044F \u043D\u0435\u044E \u0434\u043B\u044F \u043E\u0437\u043D\u0430\u0439\u043E\u043C\u043B\u0435\u043D\u043D\u044F \u0437 \u0441\u0430\u0439\u0442\u043E\u043C.</span>\n <span> </span>\n <span>\u0422\u0430, \u0447\u0430\u0441-\u0432\u0456\u0434-\u0447\u0430\u0441\u0443, \u043C\u0438 \u0457\u0445 \u0432\u0438\u0434\u0430\u043B\u044F\u0454\u043C\u043E.</span>\n <span> </span>\n <span>\u0422\u043E\u0436 \u043A\u0440\u0430\u0449\u0435 \u0437\u0430\u0440\u0435\u0454\u0441\u0442\u0440\u0443\u0442\u0435\u0441\u044F, \u0430\u0431\u0438 \u043D\u0435 \u0432\u0442\u0440\u0430\u0442\u0438\u0442\u0438 \u0434\u0430\u043D\u0456 :)</span>\n </p-message>\n }\n </div>\n\n <div class=\"rtsee-messenger-profile-auth-buttons\">\n <p-button [label]=\"messenger.labels[RTSeeTextLabelKeys.SIGN_UP_BUTTON]\"\n severity=\"primary\"\n [routerLink]=\"authConfiguration.getRoutePathSplit(AuthEndpointsKeys.SIGN_UP)\"\n class=\"rtsee-messenger-profile-auth-button\"\n ></p-button>\n <p-button [label]=\"messenger.labels[RTSeeTextLabelKeys.SIGN_IN_BUTTON]\"\n severity=\"secondary\"\n [routerLink]=\"authConfiguration.getRoutePathSplit(AuthEndpointsKeys.SIGN_IN)\"\n class=\"rtsee-messenger-profile-auth-button\"\n ></p-button>\n </div>\n </div>\n } @else if (messenger.ownProfileOpened && !messenger.myPeer?.isAnonymous) {\n <p-divider></p-divider>\n <div class=\"rtsee-messenger-profile-logout-btn\">\n <p-button [label]=\"messenger.labels[RTSeeTextLabelKeys.LOGOUT_BUTTON]\"\n severity=\"danger\"\n (click)=\"logOut()\"\n ></p-button>\n </div>\n }\n</div>\n", dependencies: [{ kind: "component", type: Button, selector: "p-button", inputs: ["type", "iconPos", "icon", "badge", "label", "disabled", "loading", "loadingIcon", "raised", "rounded", "text", "plain", "severity", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "buttonProps", "autofocus", "fluid"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "component", type: Message, selector: "p-message", inputs: ["severity", "text", "escape", "style", "styleClass", "closable", "icon", "closeIcon", "life", "showTransitionOptions", "hideTransitionOptions", "size", "variant"], outputs: ["onClose"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: Select, selector: "p-select", inputs: ["id", "scrollHeight", "filter", "panelStyle", "styleClass", "panelStyleClass", "readonly", "editable", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "filterValue", "options", "appendTo"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: Divider, selector: "p-divider", inputs: ["styleClass", "layout", "type", "align"] }] }); }
|
|
311
311
|
}
|
|
312
312
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: ProfileComponent, decorators: [{
|
|
313
313
|
type: Component,
|
|
314
|
-
args: [{ selector: 'rtsee-profile', imports: [Button, Message, RouterLink, Select, FormsModule, Divider], standalone: true, template: "<div class=\"rtsee-messenger-profile\">\n @if (!messenger.ownProfileOpened) {\n <ul class=\"rtsee-messenger-profile-actions\">\n <li class=\"rtsee-messenger-profile-actions-item\">\n <p-button\n (click)=\"call()\"\n size=\"large\"\n severity=\"secondary\"\n icon=\"pi pi-phone\"\n />\n </li>\n <li class=\"rtsee-messenger-profile-actions-item\">\n <p-button\n (click)=\"videoCall()\"\n size=\"large\"\n severity=\"secondary\"\n icon=\"pi pi-video\"\n />\n </li>\n </ul>\n }\n\n @if (messenger.ownProfileOpened && messenger.myPeer && !messenger.myPeer.isAnonymous) {\n <div class=\"rtsee-messenger-profile-info\">\n <p class=\"rtsee-messenger-profile-info-name\">{{messenger.myPeer.name}}</p>\n
|
|
314
|
+
args: [{ selector: 'rtsee-profile', imports: [Button, Message, RouterLink, Select, FormsModule, Divider], standalone: true, template: "<div class=\"rtsee-messenger-profile\">\n @if (!messenger.ownProfileOpened) {\n <ul class=\"rtsee-messenger-profile-actions\">\n <li class=\"rtsee-messenger-profile-actions-item\">\n <p-button\n (click)=\"call()\"\n size=\"large\"\n severity=\"secondary\"\n icon=\"pi pi-phone\"\n />\n </li>\n <li class=\"rtsee-messenger-profile-actions-item\">\n <p-button\n (click)=\"videoCall()\"\n size=\"large\"\n severity=\"secondary\"\n icon=\"pi pi-video\"\n />\n </li>\n </ul>\n }\n\n @if (messenger.ownProfileOpened && messenger.myPeer && !messenger.myPeer.isAnonymous) {\n <div class=\"rtsee-messenger-profile-info\">\n <div class=\"rtsee-messenger-profile-glass-card\">\n <p class=\"rtsee-messenger-profile-info-name\">{{messenger.myPeer.name}}</p>\n <div class=\"rtsee-messenger-profile-info-language\">\n <p class=\"rtsee-messenger-profile-info-language-label\">Language:</p>\n <p-select [options]=\"messenger.languageOptions\"\n [(ngModel)]=\"messenger.currentLanguage\"\n (ngModelChange)=\"setLanguage()\"\n optionLabel=\"key\"\n optionValue=\"key\"\n [placeholder]=\"messenger.labels[RTSeeTextLabelKeys.MESSANGER_LANGUAGE_PLACEHOLDER]\"\n class=\"rtsee-messenger-profile-info-language-select\"\n />\n </div>\n <div class=\"rtsee-messenger-profile-edit-btn\">\n <p-button [label]=\"messenger.labels[RTSeeTextLabelKeys.MESSENGER_EDIT_PROFILE_BTN_LABEL]\"\n (click)=\"messenger.openManageProfile()\"\n ></p-button>\n </div>\n </div>\n\n @if (messenger.myPeer.plan) {\n <p-divider></p-divider>\n <div class=\"rtsee-messenger-profile-glass-card\">\n <div class=\"rtsee-messenger-profile-plan-status\">\n <p-message severity=\"success\">\n <span>{{messenger.myPeer.plan.productName}}</span>\n </p-message>\n </div>\n <div class=\"rtsee-messenger-profile-manage-plan-btn\">\n <p-button [label]=\"messenger.labels[RTSeeTextLabelKeys.MANAGE_PLAN]\"\n (click)=\"messenger.openManagePlanPage()\"\n ></p-button>\n </div>\n </div>\n } @else {\n <p-divider></p-divider>\n <div class=\"rtsee-messenger-profile-subscribe-btn\">\n <p-button [label]=\"messenger.labels[RTSeeTextLabelKeys.SUBSCRIBE_LABEL]\"\n (click)=\"messenger.openPaymentPage()\"\n ></p-button>\n </div>\n }\n </div>\n }\n\n @if (messenger.ownProfileOpened && messenger.myPeer?.isAnonymous) {\n <div class=\"rtsee-messenger-profile-auth\">\n <div class=\"rtsee-messenger-profile-anon-message\">\n @if (!messenger.currentLanguage || messenger.currentLanguage === 'eng') {\n <p-message severity=\"warn\">\n <span>This is an anonymous identity we've generated for you.</span>\n <span> </span>\n <span>You can use it to play around.</span>\n <span> </span>\n <span>But we are guilty of erasing these time after time.</span>\n <span> </span>\n <span>So please Sign Up if you're looking for something more stable :)</span>\n </p-message>\n } @else if (messenger.currentLanguage === 'ua') {\n <p-message severity=\"warn\">\n <span>\u041C\u0438 \u0437\u0433\u0435\u043D\u0435\u0440\u0443\u0432\u0430\u043B\u0438 \u0434\u043B\u044F \u0432\u0430\u0441 \u0430\u043D\u043E\u043D\u0456\u043C\u043D\u0443 \u043E\u0441\u043E\u0431\u0438\u0441\u0442\u0456\u0441\u0442\u044C.</span>\n <span> </span>\n <span>\u0421\u043A\u043E\u0440\u0438\u0441\u0442\u0430\u0439\u0442\u0435\u0441\u044F \u043D\u0435\u044E \u0434\u043B\u044F \u043E\u0437\u043D\u0430\u0439\u043E\u043C\u043B\u0435\u043D\u043D\u044F \u0437 \u0441\u0430\u0439\u0442\u043E\u043C.</span>\n <span> </span>\n <span>\u0422\u0430, \u0447\u0430\u0441-\u0432\u0456\u0434-\u0447\u0430\u0441\u0443, \u043C\u0438 \u0457\u0445 \u0432\u0438\u0434\u0430\u043B\u044F\u0454\u043C\u043E.</span>\n <span> </span>\n <span>\u0422\u043E\u0436 \u043A\u0440\u0430\u0449\u0435 \u0437\u0430\u0440\u0435\u0454\u0441\u0442\u0440\u0443\u0442\u0435\u0441\u044F, \u0430\u0431\u0438 \u043D\u0435 \u0432\u0442\u0440\u0430\u0442\u0438\u0442\u0438 \u0434\u0430\u043D\u0456 :)</span>\n </p-message>\n }\n </div>\n\n <div class=\"rtsee-messenger-profile-auth-buttons\">\n <p-button [label]=\"messenger.labels[RTSeeTextLabelKeys.SIGN_UP_BUTTON]\"\n severity=\"primary\"\n [routerLink]=\"authConfiguration.getRoutePathSplit(AuthEndpointsKeys.SIGN_UP)\"\n class=\"rtsee-messenger-profile-auth-button\"\n ></p-button>\n <p-button [label]=\"messenger.labels[RTSeeTextLabelKeys.SIGN_IN_BUTTON]\"\n severity=\"secondary\"\n [routerLink]=\"authConfiguration.getRoutePathSplit(AuthEndpointsKeys.SIGN_IN)\"\n class=\"rtsee-messenger-profile-auth-button\"\n ></p-button>\n </div>\n </div>\n } @else if (messenger.ownProfileOpened && !messenger.myPeer?.isAnonymous) {\n <p-divider></p-divider>\n <div class=\"rtsee-messenger-profile-logout-btn\">\n <p-button [label]=\"messenger.labels[RTSeeTextLabelKeys.LOGOUT_BUTTON]\"\n severity=\"danger\"\n (click)=\"logOut()\"\n ></p-button>\n </div>\n }\n</div>\n" }]
|
|
315
315
|
}], ctorParameters: () => [{ type: RTSeeAuthService }, { type: i2.Router }], propDecorators: { messenger: [{
|
|
316
316
|
type: Input
|
|
317
317
|
}], peer: [{
|
|
@@ -495,7 +495,7 @@ const COMMON_CONSTANTS = {
|
|
|
495
495
|
customDateFormat: 'dd/MM/YYYY',
|
|
496
496
|
customDateFormatDaysJs: 'DD/MM/YYYY',
|
|
497
497
|
customDateTimeFormat: 'dd/MM/YYYY HH:mm',
|
|
498
|
-
defaultProfileImgUrl: 'https://
|
|
498
|
+
defaultProfileImgUrl: 'https://rtsee-local-files-vault.s3.us-east-1.amazonaws.com/0e58dbea-568c-4007-9a55-3d6f0c859ffb_default-profile-image.png',
|
|
499
499
|
mobileBreakpoint: 800,
|
|
500
500
|
};
|
|
501
501
|
|
|
@@ -1203,19 +1203,22 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImpor
|
|
|
1203
1203
|
|
|
1204
1204
|
class PaymentProductSnippetComponent {
|
|
1205
1205
|
constructor() {
|
|
1206
|
+
this.theme = 'dark';
|
|
1206
1207
|
this.priceSelected = new EventEmitter();
|
|
1207
1208
|
}
|
|
1208
1209
|
selectPrice(price) {
|
|
1209
1210
|
this.priceSelected.emit(price);
|
|
1210
1211
|
}
|
|
1211
1212
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PaymentProductSnippetComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1212
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", type: PaymentProductSnippetComponent, isStandalone: true, selector: "rtsee-payment-product-snippet", inputs: { product: "product" }, outputs: { priceSelected: "priceSelected" }, ngImport: i0, template: "<div class=\"rtsee-payment-product-snippet\">\n <
|
|
1213
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", type: PaymentProductSnippetComponent, isStandalone: true, selector: "rtsee-payment-product-snippet", inputs: { product: "product", theme: "theme" }, outputs: { priceSelected: "priceSelected" }, ngImport: i0, template: "<div class=\"rtsee-payment-product-snippet\">\n <div class=\"rtsee-payment-product-card\">\n <h3 class=\"rtsee-payment-product-header\">{{product.name}}</h3>\n <p class=\"rtsee-payment-product-description\">{{product.description}}</p>\n <div class=\"rtsee-payment-product-prices\">\n @for (price of product.prices; track price.id) {\n <div class=\"rtsee-payment-price-card\">\n <p class=\"rtsee-payment-price-label\">{{price.label}}</p>\n <p class=\"rtsee-payment-price-description\">{{price.description}}</p>\n <button class=\"rtsee-payment-select-plan-btn\"\n (click)=\"selectPrice(price)\"\n >Select Plan</button>\n </div>\n }\n </div>\n </div>\n</div>\n" }); }
|
|
1213
1214
|
}
|
|
1214
1215
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PaymentProductSnippetComponent, decorators: [{
|
|
1215
1216
|
type: Component,
|
|
1216
|
-
args: [{ selector: 'rtsee-payment-product-snippet', imports: [
|
|
1217
|
+
args: [{ selector: 'rtsee-payment-product-snippet', imports: [], template: "<div class=\"rtsee-payment-product-snippet\">\n <div class=\"rtsee-payment-product-card\">\n <h3 class=\"rtsee-payment-product-header\">{{product.name}}</h3>\n <p class=\"rtsee-payment-product-description\">{{product.description}}</p>\n <div class=\"rtsee-payment-product-prices\">\n @for (price of product.prices; track price.id) {\n <div class=\"rtsee-payment-price-card\">\n <p class=\"rtsee-payment-price-label\">{{price.label}}</p>\n <p class=\"rtsee-payment-price-description\">{{price.description}}</p>\n <button class=\"rtsee-payment-select-plan-btn\"\n (click)=\"selectPrice(price)\"\n >Select Plan</button>\n </div>\n }\n </div>\n </div>\n</div>\n" }]
|
|
1217
1218
|
}], propDecorators: { product: [{
|
|
1218
1219
|
type: Input
|
|
1220
|
+
}], theme: [{
|
|
1221
|
+
type: Input
|
|
1219
1222
|
}], priceSelected: [{
|
|
1220
1223
|
type: Output
|
|
1221
1224
|
}] } });
|
|
@@ -1225,10 +1228,12 @@ class PaymentsService {
|
|
|
1225
1228
|
this.http = http;
|
|
1226
1229
|
this.paymentsConfig = null;
|
|
1227
1230
|
this.isInitialized = false;
|
|
1231
|
+
this.userId = null;
|
|
1228
1232
|
}
|
|
1229
|
-
init(configuration) {
|
|
1233
|
+
init(configuration, userId) {
|
|
1230
1234
|
this.paymentsConfig = configuration;
|
|
1231
1235
|
this.isInitialized = true;
|
|
1236
|
+
this.userId = userId;
|
|
1232
1237
|
}
|
|
1233
1238
|
createSession(options) {
|
|
1234
1239
|
if (!this.paymentsConfig) {
|
|
@@ -1244,7 +1249,12 @@ class PaymentsService {
|
|
|
1244
1249
|
throw new Error('No SessionId provided');
|
|
1245
1250
|
}
|
|
1246
1251
|
return this.http
|
|
1247
|
-
.get(`${this.paymentsConfig.getSessionEndpoint}
|
|
1252
|
+
.get(`${this.paymentsConfig.getSessionEndpoint}`, {
|
|
1253
|
+
params: {
|
|
1254
|
+
sessionId: this.paymentsConfig.sessionId,
|
|
1255
|
+
userId: this.userId || ''
|
|
1256
|
+
}
|
|
1257
|
+
})
|
|
1248
1258
|
.pipe(tap((res) => {
|
|
1249
1259
|
console.log('tap here', res);
|
|
1250
1260
|
this.paymentsConfig?.setValidationInProgress(false);
|
|
@@ -1284,6 +1294,7 @@ class PaymentPageComponent {
|
|
|
1284
1294
|
this.paymentsService = paymentsService;
|
|
1285
1295
|
this.planSelected = false;
|
|
1286
1296
|
this.loadInProgress = false;
|
|
1297
|
+
this.theme = 'dark';
|
|
1287
1298
|
this.RTSeeTextLabelKeys = RTSeeTextLabelKeys;
|
|
1288
1299
|
}
|
|
1289
1300
|
async init() {
|
|
@@ -1327,43 +1338,51 @@ class PaymentPageComponent {
|
|
|
1327
1338
|
console.log('Stripe not yet initialized!');
|
|
1328
1339
|
return;
|
|
1329
1340
|
}
|
|
1330
|
-
|
|
1331
|
-
clientSecret: secret
|
|
1341
|
+
this.checkout = await this.stripe.initEmbeddedCheckout({
|
|
1342
|
+
clientSecret: secret
|
|
1332
1343
|
});
|
|
1333
|
-
if (!checkout) {
|
|
1344
|
+
if (!this.checkout) {
|
|
1334
1345
|
return;
|
|
1335
1346
|
}
|
|
1336
1347
|
this.loadInProgress = false;
|
|
1337
|
-
checkout.mount(this.checkoutContainer.nativeElement);
|
|
1348
|
+
this.checkout.mount(this.checkoutContainer.nativeElement);
|
|
1338
1349
|
}
|
|
1339
1350
|
ngOnInit() {
|
|
1340
|
-
if (!this.paymentsService.isInitialized && this.messenger.payments) {
|
|
1341
|
-
this.paymentsService.init(this.messenger.payments);
|
|
1351
|
+
if (!this.paymentsService.isInitialized && this.messenger.payments && this.messenger.myPeer?.clientId) {
|
|
1352
|
+
this.paymentsService.init(this.messenger.payments, this.messenger.myPeer.clientId);
|
|
1342
1353
|
}
|
|
1343
1354
|
void this.init();
|
|
1344
1355
|
}
|
|
1356
|
+
ngOnDestroy() {
|
|
1357
|
+
if (this.checkout) {
|
|
1358
|
+
this.checkout.destroy();
|
|
1359
|
+
}
|
|
1360
|
+
}
|
|
1345
1361
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PaymentPageComponent, deps: [{ token: PaymentsService }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1346
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", type: PaymentPageComponent, isStandalone: true, selector: "rtsee-payment-page", inputs: { messenger: "messenger" }, viewQueries: [{ propertyName: "checkoutContainer", first: true, predicate: ["checkoutContainer"], descendants: true }], ngImport: i0, template: "<div class=\"rtsee-payment-page rtsee-
|
|
1362
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", type: PaymentPageComponent, isStandalone: true, selector: "rtsee-payment-page", inputs: { messenger: "messenger", theme: "theme" }, viewQueries: [{ propertyName: "checkoutContainer", first: true, predicate: ["checkoutContainer"], descendants: true }], ngImport: i0, template: "<div class=\"rtsee-payment-page\" [ngClass]=\"'rtsee-payment-theme-' + theme\">\n @if (messenger.payments && !planSelected) {\n @if (messenger.payments.products) {\n <div class=\"rtsee-payment-page-products\">\n @for (product of messenger.payments.products ; track product.id) {\n <rtsee-payment-product-snippet [product]=\"product\"\n [theme]=\"theme\"\n (priceSelected)=\"selectPlan($event)\"\n ></rtsee-payment-product-snippet>\n }\n </div>\n } @else {\n <div class=\"rtsee-payment-spinner\">\n <div class=\"rtsee-payment-spinner-ring\"></div>\n </div>\n }\n }\n @if (loadInProgress) {\n <div class=\"rtsee-payment-spinner\">\n <div class=\"rtsee-payment-spinner-ring\"></div>\n </div>\n }\n <div #checkoutContainer class=\"stripe-checkout-container\"></div>\n <div class=\"rtsee-payment-page-footer\">\n <button class=\"rtsee-payment-cancel-btn\"\n (click)=\"messenger.closePaymentPage()\"\n >{{messenger.labels[RTSeeTextLabelKeys.CANCEL_LABEL]}}</button>\n </div>\n</div>\n", dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "component", type: PaymentProductSnippetComponent, selector: "rtsee-payment-product-snippet", inputs: ["product", "theme"], outputs: ["priceSelected"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] }); }
|
|
1347
1363
|
}
|
|
1348
1364
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PaymentPageComponent, decorators: [{
|
|
1349
1365
|
type: Component,
|
|
1350
1366
|
args: [{ selector: 'rtsee-payment-page', imports: [
|
|
1351
1367
|
ReactiveFormsModule,
|
|
1352
|
-
ProgressSpinner,
|
|
1353
1368
|
PaymentProductSnippetComponent,
|
|
1354
|
-
|
|
1355
|
-
], template: "<div class=\"rtsee-payment-page rtsee-
|
|
1369
|
+
NgClass,
|
|
1370
|
+
], template: "<div class=\"rtsee-payment-page\" [ngClass]=\"'rtsee-payment-theme-' + theme\">\n @if (messenger.payments && !planSelected) {\n @if (messenger.payments.products) {\n <div class=\"rtsee-payment-page-products\">\n @for (product of messenger.payments.products ; track product.id) {\n <rtsee-payment-product-snippet [product]=\"product\"\n [theme]=\"theme\"\n (priceSelected)=\"selectPlan($event)\"\n ></rtsee-payment-product-snippet>\n }\n </div>\n } @else {\n <div class=\"rtsee-payment-spinner\">\n <div class=\"rtsee-payment-spinner-ring\"></div>\n </div>\n }\n }\n @if (loadInProgress) {\n <div class=\"rtsee-payment-spinner\">\n <div class=\"rtsee-payment-spinner-ring\"></div>\n </div>\n }\n <div #checkoutContainer class=\"stripe-checkout-container\"></div>\n <div class=\"rtsee-payment-page-footer\">\n <button class=\"rtsee-payment-cancel-btn\"\n (click)=\"messenger.closePaymentPage()\"\n >{{messenger.labels[RTSeeTextLabelKeys.CANCEL_LABEL]}}</button>\n </div>\n</div>\n" }]
|
|
1356
1371
|
}], ctorParameters: () => [{ type: PaymentsService }], propDecorators: { messenger: [{
|
|
1357
1372
|
type: Input
|
|
1373
|
+
}], theme: [{
|
|
1374
|
+
type: Input
|
|
1358
1375
|
}], checkoutContainer: [{
|
|
1359
1376
|
type: ViewChild,
|
|
1360
1377
|
args: ['checkoutContainer']
|
|
1361
1378
|
}] } });
|
|
1362
1379
|
|
|
1363
1380
|
class PaymentValidationPageComponent {
|
|
1364
|
-
constructor(paymentsService) {
|
|
1381
|
+
constructor(paymentsService, router) {
|
|
1365
1382
|
this.paymentsService = paymentsService;
|
|
1383
|
+
this.router = router;
|
|
1366
1384
|
this.loadInProgress = false;
|
|
1385
|
+
this.theme = 'dark';
|
|
1367
1386
|
this.RTSeeTextLabelKeys = RTSeeTextLabelKeys;
|
|
1368
1387
|
}
|
|
1369
1388
|
async init() {
|
|
@@ -1377,22 +1396,31 @@ class PaymentValidationPageComponent {
|
|
|
1377
1396
|
}
|
|
1378
1397
|
validatePayment() {
|
|
1379
1398
|
this.paymentsService.getSession().subscribe((res) => {
|
|
1380
|
-
this.messenger.closePaymentValidationPage();
|
|
1399
|
+
// this.messenger.closePaymentValidationPage();
|
|
1400
|
+
if (res.user && res.token) {
|
|
1401
|
+
localStorage.setItem(LS_TOKEN_LABEL, res.token);
|
|
1402
|
+
localStorage.setItem(LS_USER_LABEL, JSON.stringify(JSON.stringify(res.user)));
|
|
1403
|
+
setTimeout(() => {
|
|
1404
|
+
window.location.href = document.baseURI;
|
|
1405
|
+
}, 1000);
|
|
1406
|
+
}
|
|
1381
1407
|
});
|
|
1382
1408
|
}
|
|
1383
1409
|
ngOnInit() {
|
|
1384
|
-
if (!this.paymentsService.isInitialized && this.messenger.payments) {
|
|
1385
|
-
this.paymentsService.init(this.messenger.payments);
|
|
1410
|
+
if (!this.paymentsService.isInitialized && this.messenger.payments && this.messenger.myPeer?.clientId) {
|
|
1411
|
+
this.paymentsService.init(this.messenger.payments, this.messenger.myPeer.clientId);
|
|
1386
1412
|
}
|
|
1387
1413
|
void this.init();
|
|
1388
1414
|
}
|
|
1389
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PaymentValidationPageComponent, deps: [{ token: PaymentsService }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1390
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", type: PaymentValidationPageComponent, isStandalone: true, selector: "rtsee-payment-validation-page", inputs: { messenger: "messenger" }, viewQueries: [{ propertyName: "checkoutContainer", first: true, predicate: ["checkoutContainer"], descendants: true }], ngImport: i0, template: "<div class=\"rtsee-payment-page rtsee-
|
|
1415
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PaymentValidationPageComponent, deps: [{ token: PaymentsService }, { token: i2.Router }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1416
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", type: PaymentValidationPageComponent, isStandalone: true, selector: "rtsee-payment-validation-page", inputs: { messenger: "messenger", theme: "theme" }, viewQueries: [{ propertyName: "checkoutContainer", first: true, predicate: ["checkoutContainer"], descendants: true }], ngImport: i0, template: "<div class=\"rtsee-payment-page\" [ngClass]=\"'rtsee-payment-theme-' + theme\">\n @if (messenger.payments?.validationInProgress) {\n <div class=\"rtsee-payment-spinner\">\n <div class=\"rtsee-payment-spinner-ring\"></div>\n </div>\n }\n <div class=\"rtsee-payment-page-footer\">\n <button class=\"rtsee-payment-cancel-btn\"\n (click)=\"messenger.closePaymentPage()\"\n >{{messenger.labels[RTSeeTextLabelKeys.CANCEL_LABEL]}}</button>\n </div>\n</div>\n", dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] }); }
|
|
1391
1417
|
}
|
|
1392
1418
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PaymentValidationPageComponent, decorators: [{
|
|
1393
1419
|
type: Component,
|
|
1394
|
-
args: [{ selector: 'rtsee-payment-validation-page', imports: [ReactiveFormsModule,
|
|
1395
|
-
}], ctorParameters: () => [{ type: PaymentsService }], propDecorators: { messenger: [{
|
|
1420
|
+
args: [{ selector: 'rtsee-payment-validation-page', imports: [ReactiveFormsModule, NgClass], template: "<div class=\"rtsee-payment-page\" [ngClass]=\"'rtsee-payment-theme-' + theme\">\n @if (messenger.payments?.validationInProgress) {\n <div class=\"rtsee-payment-spinner\">\n <div class=\"rtsee-payment-spinner-ring\"></div>\n </div>\n }\n <div class=\"rtsee-payment-page-footer\">\n <button class=\"rtsee-payment-cancel-btn\"\n (click)=\"messenger.closePaymentPage()\"\n >{{messenger.labels[RTSeeTextLabelKeys.CANCEL_LABEL]}}</button>\n </div>\n</div>\n" }]
|
|
1421
|
+
}], ctorParameters: () => [{ type: PaymentsService }, { type: i2.Router }], propDecorators: { messenger: [{
|
|
1422
|
+
type: Input
|
|
1423
|
+
}], theme: [{
|
|
1396
1424
|
type: Input
|
|
1397
1425
|
}], checkoutContainer: [{
|
|
1398
1426
|
type: ViewChild,
|
|
@@ -1414,8 +1442,8 @@ class ManagePlanComponent {
|
|
|
1414
1442
|
if (!this.messenger.myPeer || !this.messenger.myPeer.plan) {
|
|
1415
1443
|
throw new Error('No Plans found.');
|
|
1416
1444
|
}
|
|
1417
|
-
if (!this.paymentsService.isInitialized && this.messenger.payments) {
|
|
1418
|
-
this.paymentsService.init(this.messenger.payments);
|
|
1445
|
+
if (!this.paymentsService.isInitialized && this.messenger.payments && this.messenger.myPeer?.clientId) {
|
|
1446
|
+
this.paymentsService.init(this.messenger.payments, this.messenger.myPeer?.clientId);
|
|
1419
1447
|
}
|
|
1420
1448
|
this.plan = this.messenger.myPeer.plan;
|
|
1421
1449
|
this.activeFromFormated = dayjs(this.messenger.myPeer.plan.activeFrom).format('DD-MM-YYYY');
|
|
@@ -1436,7 +1464,7 @@ class MessengerComponent {
|
|
|
1436
1464
|
this.messenger.loadChats();
|
|
1437
1465
|
}
|
|
1438
1466
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: MessengerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1439
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", type: MessengerComponent, isStandalone: true, selector: "rtsee-messenger", inputs: { messenger: "messenger" }, ngImport: i0, template: "<div class=\"rtsee-messenger\" [ngClass]=\"{\n 'rtsee-messenger-header-expanded': messenger.openedProfile || messenger.openedChatDetails,\n 'rtsee-messenger-folded': messenger.folded,\n 'rtsee-messenger-overlay-window': messenger.isOverlayPageOpened\n}\">\n @if (messenger.manageProfile) {\n <div class=\"rtsee-manage-profile\">\n <rtsee-manage-profile [manageProfile]=\"messenger.manageProfile\"\n [messenger]=\"messenger\"\n ></rtsee-manage-profile>\n </div>\n }\n\n @if (messenger.isPaymentPageOpened) {\n <div class=\"rtsee-payment-page-container\">\n <rtsee-payment-page [messenger]=\"messenger\"></rtsee-payment-page>\n </div>\n }\n\n @if (messenger.isPaymentValidationPageOpened) {\n <div class=\"rtsee-payment-page-container\">\n <rtsee-payment-validation-page [messenger]=\"messenger\"></rtsee-payment-validation-page>\n </div>\n }\n\n @if (messenger.isManagePlanPageOpened) {\n <div class=\"rtsee-payment-page-container\">\n <rtsee-manage-plan [messenger]=\"messenger\"></rtsee-manage-plan>\n </div>\n }\n\n <div class=\"rtsee-messenger-header-container\">\n <rtsee-messenger-header [messenger]=\"messenger\"\n ></rtsee-messenger-header>\n </div>\n <div class=\"rtsee-messenger-body-container\"\n infiniteScroll\n [infiniteScrollDistance]=\"2\"\n [infiniteScrollThrottle]=\"50\"\n [scrollWindow]=\"false\"\n (scrolled)=\"onScroll()\"\n >\n @if (messenger.openedChat) {\n <rtsee-chat [messenger]=\"messenger\" [chat]=\"messenger.openedChat\"></rtsee-chat>\n } @else if (!messenger.openedChat) {\n <rtsee-chats-list [chats]=\"messenger.chats\" [messenger]=\"messenger\"></rtsee-chats-list>\n } @else if (messenger.openedProfile) {\n <rtsee-profile></rtsee-profile>\n }\n @if (messenger.loadingChatsInProgress) {\n <rtsee-preloader [diameter]=\"50\" ></rtsee-preloader>\n }\n </div>\n</div>\n\n\n", dependencies: [{ kind: "component", type: MessengerHeaderComponent, selector: "rtsee-messenger-header", inputs: ["messenger"] }, { kind: "directive", type: InfiniteScrollDirective, selector: "[infiniteScroll], [infinite-scroll], [data-infinite-scroll]", inputs: ["infiniteScrollDistance", "infiniteScrollUpDistance", "infiniteScrollThrottle", "infiniteScrollDisabled", "infiniteScrollContainer", "scrollWindow", "immediateCheck", "horizontal", "alwaysCallback", "fromRoot"], outputs: ["scrolled", "scrolledUp"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: ChatsListComponent, selector: "rtsee-chats-list", inputs: ["messenger", "chats"] }, { kind: "component", type: ChatComponent, selector: "rtsee-chat", inputs: ["chat", "chatData", "entity", "messenger"] }, { kind: "component", type: PreloaderComponent, selector: "rtsee-preloader", inputs: ["diameter", "color"] }, { kind: "component", type: ProfileComponent, selector: "rtsee-profile", inputs: ["messenger", "peer"] }, { kind: "component", type: ManageProfileComponent, selector: "rtsee-manage-profile", inputs: ["messenger", "manageProfile"] }, { kind: "component", type: PaymentPageComponent, selector: "rtsee-payment-page", inputs: ["messenger"] }, { kind: "component", type: PaymentValidationPageComponent, selector: "rtsee-payment-validation-page", inputs: ["messenger"] }, { kind: "component", type: ManagePlanComponent, selector: "rtsee-manage-plan", inputs: ["messenger"] }] }); }
|
|
1467
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", type: MessengerComponent, isStandalone: true, selector: "rtsee-messenger", inputs: { messenger: "messenger" }, ngImport: i0, template: "<div class=\"rtsee-messenger\" [ngClass]=\"{\n 'rtsee-messenger-header-expanded': messenger.openedProfile || messenger.openedChatDetails,\n 'rtsee-messenger-folded': messenger.folded,\n 'rtsee-messenger-overlay-window': messenger.isOverlayPageOpened\n}\">\n @if (messenger.manageProfile) {\n <div class=\"rtsee-manage-profile\">\n <rtsee-manage-profile [manageProfile]=\"messenger.manageProfile\"\n [messenger]=\"messenger\"\n ></rtsee-manage-profile>\n </div>\n }\n\n @if (messenger.isPaymentPageOpened) {\n <div class=\"rtsee-payment-page-container\">\n <rtsee-payment-page [messenger]=\"messenger\" theme=\"dark\"></rtsee-payment-page>\n </div>\n }\n\n @if (messenger.isPaymentValidationPageOpened) {\n <div class=\"rtsee-payment-page-container\">\n <rtsee-payment-validation-page [messenger]=\"messenger\" theme=\"dark\"></rtsee-payment-validation-page>\n </div>\n }\n\n @if (messenger.isManagePlanPageOpened) {\n <div class=\"rtsee-payment-page-container\">\n <rtsee-manage-plan [messenger]=\"messenger\"></rtsee-manage-plan>\n </div>\n }\n\n <div class=\"rtsee-messenger-header-container\">\n <rtsee-messenger-header [messenger]=\"messenger\"\n ></rtsee-messenger-header>\n </div>\n <div class=\"rtsee-messenger-body-container\"\n infiniteScroll\n [infiniteScrollDistance]=\"2\"\n [infiniteScrollThrottle]=\"50\"\n [scrollWindow]=\"false\"\n (scrolled)=\"onScroll()\"\n >\n @if (messenger.openedChat) {\n <rtsee-chat [messenger]=\"messenger\" [chat]=\"messenger.openedChat\"></rtsee-chat>\n } @else if (!messenger.openedChat) {\n <rtsee-chats-list [chats]=\"messenger.chats\" [messenger]=\"messenger\"></rtsee-chats-list>\n } @else if (messenger.openedProfile) {\n <rtsee-profile></rtsee-profile>\n }\n @if (messenger.loadingChatsInProgress) {\n <rtsee-preloader [diameter]=\"50\" ></rtsee-preloader>\n }\n </div>\n</div>\n\n\n", dependencies: [{ kind: "component", type: MessengerHeaderComponent, selector: "rtsee-messenger-header", inputs: ["messenger"] }, { kind: "directive", type: InfiniteScrollDirective, selector: "[infiniteScroll], [infinite-scroll], [data-infinite-scroll]", inputs: ["infiniteScrollDistance", "infiniteScrollUpDistance", "infiniteScrollThrottle", "infiniteScrollDisabled", "infiniteScrollContainer", "scrollWindow", "immediateCheck", "horizontal", "alwaysCallback", "fromRoot"], outputs: ["scrolled", "scrolledUp"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: ChatsListComponent, selector: "rtsee-chats-list", inputs: ["messenger", "chats"] }, { kind: "component", type: ChatComponent, selector: "rtsee-chat", inputs: ["chat", "chatData", "entity", "messenger"] }, { kind: "component", type: PreloaderComponent, selector: "rtsee-preloader", inputs: ["diameter", "color"] }, { kind: "component", type: ProfileComponent, selector: "rtsee-profile", inputs: ["messenger", "peer"] }, { kind: "component", type: ManageProfileComponent, selector: "rtsee-manage-profile", inputs: ["messenger", "manageProfile"] }, { kind: "component", type: PaymentPageComponent, selector: "rtsee-payment-page", inputs: ["messenger", "theme"] }, { kind: "component", type: PaymentValidationPageComponent, selector: "rtsee-payment-validation-page", inputs: ["messenger", "theme"] }, { kind: "component", type: ManagePlanComponent, selector: "rtsee-manage-plan", inputs: ["messenger"] }] }); }
|
|
1440
1468
|
}
|
|
1441
1469
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: MessengerComponent, decorators: [{
|
|
1442
1470
|
type: Component,
|
|
@@ -1452,7 +1480,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImpor
|
|
|
1452
1480
|
PaymentPageComponent,
|
|
1453
1481
|
PaymentValidationPageComponent,
|
|
1454
1482
|
ManagePlanComponent,
|
|
1455
|
-
], standalone: true, template: "<div class=\"rtsee-messenger\" [ngClass]=\"{\n 'rtsee-messenger-header-expanded': messenger.openedProfile || messenger.openedChatDetails,\n 'rtsee-messenger-folded': messenger.folded,\n 'rtsee-messenger-overlay-window': messenger.isOverlayPageOpened\n}\">\n @if (messenger.manageProfile) {\n <div class=\"rtsee-manage-profile\">\n <rtsee-manage-profile [manageProfile]=\"messenger.manageProfile\"\n [messenger]=\"messenger\"\n ></rtsee-manage-profile>\n </div>\n }\n\n @if (messenger.isPaymentPageOpened) {\n <div class=\"rtsee-payment-page-container\">\n <rtsee-payment-page [messenger]=\"messenger\"></rtsee-payment-page>\n </div>\n }\n\n @if (messenger.isPaymentValidationPageOpened) {\n <div class=\"rtsee-payment-page-container\">\n <rtsee-payment-validation-page [messenger]=\"messenger\"></rtsee-payment-validation-page>\n </div>\n }\n\n @if (messenger.isManagePlanPageOpened) {\n <div class=\"rtsee-payment-page-container\">\n <rtsee-manage-plan [messenger]=\"messenger\"></rtsee-manage-plan>\n </div>\n }\n\n <div class=\"rtsee-messenger-header-container\">\n <rtsee-messenger-header [messenger]=\"messenger\"\n ></rtsee-messenger-header>\n </div>\n <div class=\"rtsee-messenger-body-container\"\n infiniteScroll\n [infiniteScrollDistance]=\"2\"\n [infiniteScrollThrottle]=\"50\"\n [scrollWindow]=\"false\"\n (scrolled)=\"onScroll()\"\n >\n @if (messenger.openedChat) {\n <rtsee-chat [messenger]=\"messenger\" [chat]=\"messenger.openedChat\"></rtsee-chat>\n } @else if (!messenger.openedChat) {\n <rtsee-chats-list [chats]=\"messenger.chats\" [messenger]=\"messenger\"></rtsee-chats-list>\n } @else if (messenger.openedProfile) {\n <rtsee-profile></rtsee-profile>\n }\n @if (messenger.loadingChatsInProgress) {\n <rtsee-preloader [diameter]=\"50\" ></rtsee-preloader>\n }\n </div>\n</div>\n\n\n" }]
|
|
1483
|
+
], standalone: true, template: "<div class=\"rtsee-messenger\" [ngClass]=\"{\n 'rtsee-messenger-header-expanded': messenger.openedProfile || messenger.openedChatDetails,\n 'rtsee-messenger-folded': messenger.folded,\n 'rtsee-messenger-overlay-window': messenger.isOverlayPageOpened\n}\">\n @if (messenger.manageProfile) {\n <div class=\"rtsee-manage-profile\">\n <rtsee-manage-profile [manageProfile]=\"messenger.manageProfile\"\n [messenger]=\"messenger\"\n ></rtsee-manage-profile>\n </div>\n }\n\n @if (messenger.isPaymentPageOpened) {\n <div class=\"rtsee-payment-page-container\">\n <rtsee-payment-page [messenger]=\"messenger\" theme=\"dark\"></rtsee-payment-page>\n </div>\n }\n\n @if (messenger.isPaymentValidationPageOpened) {\n <div class=\"rtsee-payment-page-container\">\n <rtsee-payment-validation-page [messenger]=\"messenger\" theme=\"dark\"></rtsee-payment-validation-page>\n </div>\n }\n\n @if (messenger.isManagePlanPageOpened) {\n <div class=\"rtsee-payment-page-container\">\n <rtsee-manage-plan [messenger]=\"messenger\"></rtsee-manage-plan>\n </div>\n }\n\n <div class=\"rtsee-messenger-header-container\">\n <rtsee-messenger-header [messenger]=\"messenger\"\n ></rtsee-messenger-header>\n </div>\n <div class=\"rtsee-messenger-body-container\"\n infiniteScroll\n [infiniteScrollDistance]=\"2\"\n [infiniteScrollThrottle]=\"50\"\n [scrollWindow]=\"false\"\n (scrolled)=\"onScroll()\"\n >\n @if (messenger.openedChat) {\n <rtsee-chat [messenger]=\"messenger\" [chat]=\"messenger.openedChat\"></rtsee-chat>\n } @else if (!messenger.openedChat) {\n <rtsee-chats-list [chats]=\"messenger.chats\" [messenger]=\"messenger\"></rtsee-chats-list>\n } @else if (messenger.openedProfile) {\n <rtsee-profile></rtsee-profile>\n }\n @if (messenger.loadingChatsInProgress) {\n <rtsee-preloader [diameter]=\"50\" ></rtsee-preloader>\n }\n </div>\n</div>\n\n\n" }]
|
|
1456
1484
|
}], propDecorators: { messenger: [{
|
|
1457
1485
|
type: Input
|
|
1458
1486
|
}] } });
|
|
@@ -1631,11 +1659,11 @@ class PresentationHeaderComponent {
|
|
|
1631
1659
|
this.RTSeeTextLabelKeys = RTSeeTextLabelKeys;
|
|
1632
1660
|
}
|
|
1633
1661
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PresentationHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1634
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", type: PresentationHeaderComponent, isStandalone: true, selector: "rtsee-presentation-header", inputs: { presentation: "presentation" }, ngImport: i0, template: "<header class=\"rtsee-presentation-header\"\n [ngClass]=\"{\n 'rtsee-presentation-header-convertable': presentation.activeStory,\n 'rtsee-presentation-header-visible': presentation.activeStory?.headerVisible\n }\"\n>\n @if (!presentation.activeStory && !presentation.openedStoryDetails) {\n <div class=\"rtsee-presentations-header-title\">\n <div class=\"rtsee-presentations-header-title-overlay\"></div>\n <div class=\"rtsee-presentations-header-title-content\">\n <h1>{{presentation.labels[RTSeeTextLabelKeys.PRESENTATION_TITLE_LABEL]}}</h1>\n <p class=\"rtsee-presentations-header-title-subtitle\">\n <span>{{presentation.labels[RTSeeTextLabelKeys.PRESENTATION_SUBTITLE_LABEL]}}</span>\n </p>\n </div>\n </div>\n }\n\n @if (presentation.activeRoom && !presentation.activeStory && !presentation.openedStoryDetails) {\n <div class=\"rtsee-presentation-room-block\">\n <rtsee-join-call [room]=\"presentation.activeRoom\"\n [presentation]=\"presentation\"\n ></rtsee-join-call>\n </div>\n }\n\n @if (presentation.activeStory) {\n <div class=\"rtsee-presentation-header-active-story-info\">\n <div class=\"rtsee-presentation-header-active-story-info-close\"\n [routerLink]=\"[presentation.homePage]\"\n (click)=\"presentation.disableActiveStory()\"\n >\n <i class=\"pi pi-
|
|
1662
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", type: PresentationHeaderComponent, isStandalone: true, selector: "rtsee-presentation-header", inputs: { presentation: "presentation" }, ngImport: i0, template: "<header class=\"rtsee-presentation-header\"\n [ngClass]=\"{\n 'rtsee-presentation-header-convertable': presentation.activeStory,\n 'rtsee-presentation-header-visible': presentation.activeStory?.headerVisible\n }\"\n>\n @if (!presentation.activeStory && !presentation.openedStoryDetails) {\n <div class=\"rtsee-presentations-header-title\">\n <div class=\"rtsee-presentations-header-title-overlay\"></div>\n <div class=\"rtsee-presentations-header-title-content\">\n <h1>{{presentation.labels[RTSeeTextLabelKeys.PRESENTATION_TITLE_LABEL]}}</h1>\n <p class=\"rtsee-presentations-header-title-subtitle\">\n <span>{{presentation.labels[RTSeeTextLabelKeys.PRESENTATION_SUBTITLE_LABEL]}}</span>\n </p>\n </div>\n </div>\n }\n\n @if (presentation.activeRoom && !presentation.activeStory && !presentation.openedStoryDetails) {\n <div class=\"rtsee-presentation-room-block\">\n <rtsee-join-call [room]=\"presentation.activeRoom\"\n [presentation]=\"presentation\"\n ></rtsee-join-call>\n </div>\n }\n\n @if (presentation.activeStory) {\n <div class=\"rtsee-presentation-header-active-story-info\">\n <div class=\"rtsee-presentation-header-active-story-info-close\"\n [routerLink]=\"[presentation.homePage]\"\n (click)=\"presentation.disableActiveStory()\"\n >\n <i class=\"pi pi-times rtsee-presentation-header-active-story-info-close-icon\"></i>\n </div>\n <div class=\"rtsee-presentation-header-active-story-info-details\">\n <p-chip [label]=\"presentation.activeStory.name\"\n [image]=\"presentation.activeStory.imageUrl || undefined\"\n class=\"rtsee-presentation-header-active-story-name\"\n alt=\"Story image\" />\n </div>\n <div class=\"rtsee-presentation-header-active-story-info-settings\"\n (click)=\"presentation.settings.expand()\"\n >\n <i class=\"pi pi-cog-h rtsee-presentation-header-active-story-info-settings-icon\"></i>\n </div>\n </div>\n }\n @if (presentation.dashboard && !presentation.activeStory && !presentation.isDashboardOpen && !presentation.openedStoryDetails) {\n <p-button [label]=\"presentation.labels[RTSeeTextLabelKeys.DASHBOARD_BUTTON]\"\n (click)=\"presentation.toggleDashboardState()\"\n ></p-button>\n }\n</header>\n", dependencies: [{ kind: "component", type: Button, selector: "p-button", inputs: ["type", "iconPos", "icon", "badge", "label", "disabled", "loading", "loadingIcon", "raised", "rounded", "text", "plain", "severity", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "buttonProps", "autofocus", "fluid"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: Chip, selector: "p-chip", inputs: ["label", "icon", "image", "alt", "styleClass", "disabled", "removable", "removeIcon", "chipProps"], outputs: ["onRemove", "onImageError"] }, { kind: "component", type: JoinCallComponent, selector: "rtsee-join-call", inputs: ["presentation", "room"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }] }); }
|
|
1635
1663
|
}
|
|
1636
1664
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PresentationHeaderComponent, decorators: [{
|
|
1637
1665
|
type: Component,
|
|
1638
|
-
args: [{ selector: 'rtsee-presentation-header', imports: [Button, NgClass, Chip, JoinCallComponent, RouterLink], standalone: true, template: "<header class=\"rtsee-presentation-header\"\n [ngClass]=\"{\n 'rtsee-presentation-header-convertable': presentation.activeStory,\n 'rtsee-presentation-header-visible': presentation.activeStory?.headerVisible\n }\"\n>\n @if (!presentation.activeStory && !presentation.openedStoryDetails) {\n <div class=\"rtsee-presentations-header-title\">\n <div class=\"rtsee-presentations-header-title-overlay\"></div>\n <div class=\"rtsee-presentations-header-title-content\">\n <h1>{{presentation.labels[RTSeeTextLabelKeys.PRESENTATION_TITLE_LABEL]}}</h1>\n <p class=\"rtsee-presentations-header-title-subtitle\">\n <span>{{presentation.labels[RTSeeTextLabelKeys.PRESENTATION_SUBTITLE_LABEL]}}</span>\n </p>\n </div>\n </div>\n }\n\n @if (presentation.activeRoom && !presentation.activeStory && !presentation.openedStoryDetails) {\n <div class=\"rtsee-presentation-room-block\">\n <rtsee-join-call [room]=\"presentation.activeRoom\"\n [presentation]=\"presentation\"\n ></rtsee-join-call>\n </div>\n }\n\n @if (presentation.activeStory) {\n <div class=\"rtsee-presentation-header-active-story-info\">\n <div class=\"rtsee-presentation-header-active-story-info-close\"\n [routerLink]=\"[presentation.homePage]\"\n (click)=\"presentation.disableActiveStory()\"\n >\n <i class=\"pi pi-
|
|
1666
|
+
args: [{ selector: 'rtsee-presentation-header', imports: [Button, NgClass, Chip, JoinCallComponent, RouterLink], standalone: true, template: "<header class=\"rtsee-presentation-header\"\n [ngClass]=\"{\n 'rtsee-presentation-header-convertable': presentation.activeStory,\n 'rtsee-presentation-header-visible': presentation.activeStory?.headerVisible\n }\"\n>\n @if (!presentation.activeStory && !presentation.openedStoryDetails) {\n <div class=\"rtsee-presentations-header-title\">\n <div class=\"rtsee-presentations-header-title-overlay\"></div>\n <div class=\"rtsee-presentations-header-title-content\">\n <h1>{{presentation.labels[RTSeeTextLabelKeys.PRESENTATION_TITLE_LABEL]}}</h1>\n <p class=\"rtsee-presentations-header-title-subtitle\">\n <span>{{presentation.labels[RTSeeTextLabelKeys.PRESENTATION_SUBTITLE_LABEL]}}</span>\n </p>\n </div>\n </div>\n }\n\n @if (presentation.activeRoom && !presentation.activeStory && !presentation.openedStoryDetails) {\n <div class=\"rtsee-presentation-room-block\">\n <rtsee-join-call [room]=\"presentation.activeRoom\"\n [presentation]=\"presentation\"\n ></rtsee-join-call>\n </div>\n }\n\n @if (presentation.activeStory) {\n <div class=\"rtsee-presentation-header-active-story-info\">\n <div class=\"rtsee-presentation-header-active-story-info-close\"\n [routerLink]=\"[presentation.homePage]\"\n (click)=\"presentation.disableActiveStory()\"\n >\n <i class=\"pi pi-times rtsee-presentation-header-active-story-info-close-icon\"></i>\n </div>\n <div class=\"rtsee-presentation-header-active-story-info-details\">\n <p-chip [label]=\"presentation.activeStory.name\"\n [image]=\"presentation.activeStory.imageUrl || undefined\"\n class=\"rtsee-presentation-header-active-story-name\"\n alt=\"Story image\" />\n </div>\n <div class=\"rtsee-presentation-header-active-story-info-settings\"\n (click)=\"presentation.settings.expand()\"\n >\n <i class=\"pi pi-cog-h rtsee-presentation-header-active-story-info-settings-icon\"></i>\n </div>\n </div>\n }\n @if (presentation.dashboard && !presentation.activeStory && !presentation.isDashboardOpen && !presentation.openedStoryDetails) {\n <p-button [label]=\"presentation.labels[RTSeeTextLabelKeys.DASHBOARD_BUTTON]\"\n (click)=\"presentation.toggleDashboardState()\"\n ></p-button>\n }\n</header>\n" }]
|
|
1639
1667
|
}], propDecorators: { presentation: [{
|
|
1640
1668
|
type: Input
|
|
1641
1669
|
}] } });
|
|
@@ -1644,6 +1672,7 @@ class StoryThumbnailComponent {
|
|
|
1644
1672
|
constructor() {
|
|
1645
1673
|
this.progressPercent = 0;
|
|
1646
1674
|
this.Math = Math;
|
|
1675
|
+
this.RTSeeTextLabelKeys = RTSeeTextLabelKeys;
|
|
1647
1676
|
}
|
|
1648
1677
|
ngOnInit() {
|
|
1649
1678
|
if (this.story.preselectedSlideNumber) {
|
|
@@ -1651,11 +1680,11 @@ class StoryThumbnailComponent {
|
|
|
1651
1680
|
}
|
|
1652
1681
|
}
|
|
1653
1682
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: StoryThumbnailComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1654
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", type: StoryThumbnailComponent, isStandalone: true, selector: "rtsee-story-thumbnail", inputs: { story: "story", presentation: "presentation" }, ngImport: i0, template: "<a [routerLink]=\"[presentation.routePrefix, story.friendlyUrl]\" class=\"rtsee-story-thumbnail\">\n <div class=\"rtsee-story-thumbnail-image-container\">\n <div class=\"rtsee-story-thumbnail-image\">\n <img [src]=\"story.imageUrl\"\n [alt]=\"story.name\"\n class=\"rtsee-story-thumbnail-image\"\n />\n </div>\n @if (story.preselectedSlideNumber) {\n <div class=\"rtsee-story-thumbnail-progress-bar-container\">\n <div class=\"rtsee-story-thumbnail-progress-bar\">\n <div class=\"rtsee-story-thumbnail-progress-bar-inner\"\n [style.width]=\"progressPercent + '%'\"\n ></div>\n </div>\n </div>\n }\n </div>\n <div class=\"rtsee-story-thumbnail-body-container\">\n <h4 class=\"rtsee-story-thumbnail-title\">{{story.name}}</h4>\n <div class=\"rtsee-story-thumbnail-body-meta\">\n @if (story.rating) {\n <rtsee-rating [rate]=\"{maxValue: 5, value: story.rating}\"></rtsee-rating>\n }\n @if (story.averageReadTime) {\n <span class=\"rtsee-story-thumbnail-time-container\">\n <span class=\"rtsee-story-thumbnail-info-time-icon material-icons-outlined\">schedule</span>\n <span class=\"rtsee-story-thumbnail-info-read-time\">{{ Math.ceil(story.averageReadTime / 60) }}
|
|
1683
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", type: StoryThumbnailComponent, isStandalone: true, selector: "rtsee-story-thumbnail", inputs: { story: "story", presentation: "presentation" }, ngImport: i0, template: "<a [routerLink]=\"[presentation.routePrefix, story.friendlyUrl]\" class=\"rtsee-story-thumbnail\">\n <div class=\"rtsee-story-thumbnail-image-container\">\n <div class=\"rtsee-story-thumbnail-image\">\n <img [src]=\"story.imageUrl\"\n [alt]=\"story.name\"\n class=\"rtsee-story-thumbnail-image\"\n />\n </div>\n @if (story.preselectedSlideNumber) {\n <div class=\"rtsee-story-thumbnail-progress-bar-container\">\n <div class=\"rtsee-story-thumbnail-progress-bar\">\n <div class=\"rtsee-story-thumbnail-progress-bar-inner\"\n [style.width]=\"progressPercent + '%'\"\n ></div>\n </div>\n </div>\n }\n </div>\n <div class=\"rtsee-story-thumbnail-body-container\">\n <h4 class=\"rtsee-story-thumbnail-title\">{{story.name}}</h4>\n <div class=\"rtsee-story-thumbnail-body-meta\">\n @if (story.rating) {\n <rtsee-rating [rate]=\"{maxValue: 5, value: story.rating}\"></rtsee-rating>\n }\n @if (story.averageReadTime) {\n <span class=\"rtsee-story-thumbnail-time-container\">\n <span class=\"rtsee-story-thumbnail-info-time-icon material-icons-outlined\">schedule</span>\n <span class=\"rtsee-story-thumbnail-info-read-time\">\n <span>{{ Math.ceil(story.averageReadTime / 60) }}</span>\n <span> </span>\n <span>{{ presentation.labels[RTSeeTextLabelKeys.MINUTE_LABEL] }}</span>\n </span>\n </span>\n }\n @if (story.recommendedAge) {\n <span class=\"rtsee-story-thumbnail-label-container\">{{story.recommendedAge}}</span>\n }\n </div>\n </div>\n</a>\n", dependencies: [{ kind: "component", type: RatingComponent, selector: "rtsee-rating", inputs: ["config", "rate"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }] }); }
|
|
1655
1684
|
}
|
|
1656
1685
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: StoryThumbnailComponent, decorators: [{
|
|
1657
1686
|
type: Component,
|
|
1658
|
-
args: [{ selector: 'rtsee-story-thumbnail', imports: [RatingComponent, RouterLink], standalone: true, template: "<a [routerLink]=\"[presentation.routePrefix, story.friendlyUrl]\" class=\"rtsee-story-thumbnail\">\n <div class=\"rtsee-story-thumbnail-image-container\">\n <div class=\"rtsee-story-thumbnail-image\">\n <img [src]=\"story.imageUrl\"\n [alt]=\"story.name\"\n class=\"rtsee-story-thumbnail-image\"\n />\n </div>\n @if (story.preselectedSlideNumber) {\n <div class=\"rtsee-story-thumbnail-progress-bar-container\">\n <div class=\"rtsee-story-thumbnail-progress-bar\">\n <div class=\"rtsee-story-thumbnail-progress-bar-inner\"\n [style.width]=\"progressPercent + '%'\"\n ></div>\n </div>\n </div>\n }\n </div>\n <div class=\"rtsee-story-thumbnail-body-container\">\n <h4 class=\"rtsee-story-thumbnail-title\">{{story.name}}</h4>\n <div class=\"rtsee-story-thumbnail-body-meta\">\n @if (story.rating) {\n <rtsee-rating [rate]=\"{maxValue: 5, value: story.rating}\"></rtsee-rating>\n }\n @if (story.averageReadTime) {\n <span class=\"rtsee-story-thumbnail-time-container\">\n <span class=\"rtsee-story-thumbnail-info-time-icon material-icons-outlined\">schedule</span>\n <span class=\"rtsee-story-thumbnail-info-read-time\">{{ Math.ceil(story.averageReadTime / 60) }}
|
|
1687
|
+
args: [{ selector: 'rtsee-story-thumbnail', imports: [RatingComponent, RouterLink], standalone: true, template: "<a [routerLink]=\"[presentation.routePrefix, story.friendlyUrl]\" class=\"rtsee-story-thumbnail\">\n <div class=\"rtsee-story-thumbnail-image-container\">\n <div class=\"rtsee-story-thumbnail-image\">\n <img [src]=\"story.imageUrl\"\n [alt]=\"story.name\"\n class=\"rtsee-story-thumbnail-image\"\n />\n </div>\n @if (story.preselectedSlideNumber) {\n <div class=\"rtsee-story-thumbnail-progress-bar-container\">\n <div class=\"rtsee-story-thumbnail-progress-bar\">\n <div class=\"rtsee-story-thumbnail-progress-bar-inner\"\n [style.width]=\"progressPercent + '%'\"\n ></div>\n </div>\n </div>\n }\n </div>\n <div class=\"rtsee-story-thumbnail-body-container\">\n <h4 class=\"rtsee-story-thumbnail-title\">{{story.name}}</h4>\n <div class=\"rtsee-story-thumbnail-body-meta\">\n @if (story.rating) {\n <rtsee-rating [rate]=\"{maxValue: 5, value: story.rating}\"></rtsee-rating>\n }\n @if (story.averageReadTime) {\n <span class=\"rtsee-story-thumbnail-time-container\">\n <span class=\"rtsee-story-thumbnail-info-time-icon material-icons-outlined\">schedule</span>\n <span class=\"rtsee-story-thumbnail-info-read-time\">\n <span>{{ Math.ceil(story.averageReadTime / 60) }}</span>\n <span> </span>\n <span>{{ presentation.labels[RTSeeTextLabelKeys.MINUTE_LABEL] }}</span>\n </span>\n </span>\n }\n @if (story.recommendedAge) {\n <span class=\"rtsee-story-thumbnail-label-container\">{{story.recommendedAge}}</span>\n }\n </div>\n </div>\n</a>\n" }]
|
|
1659
1688
|
}], propDecorators: { story: [{
|
|
1660
1689
|
type: Input
|
|
1661
1690
|
}], presentation: [{
|
|
@@ -1668,6 +1697,7 @@ class SlideComponent {
|
|
|
1668
1697
|
this.hideRewindControls = true;
|
|
1669
1698
|
this.lastScrollPosition = 0;
|
|
1670
1699
|
this.scrollingDown = false;
|
|
1700
|
+
this.RTSeeTextLabelKeys = RTSeeTextLabelKeys;
|
|
1671
1701
|
}
|
|
1672
1702
|
slideRewindClicked(forward) {
|
|
1673
1703
|
if (forward) {
|
|
@@ -1718,12 +1748,14 @@ class SlideComponent {
|
|
|
1718
1748
|
}
|
|
1719
1749
|
}
|
|
1720
1750
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: SlideComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1721
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", type: SlideComponent, isStandalone: true, selector: "rtsee-slide", inputs: { story: "story", slide: "slide", settings: "settings" }, ngImport: i0, template: "<div class=\"rtsee-presentation-slide\" (scroll)=\"onScroll($event.target)\">\n @if (slide.widget) {\n <ng-template widgetHost></ng-template>\n }\n <div class=\"rtsee-presentation-slide-default\">\n @if (slide.imageUrl) {\n <div class=\"rtsee-presentation-slide-image-container\"\n [ngStyle]=\"{'background-image': 'url(' + slide.imageUrl + ')'}\"\n >\n </div>\n }\n <div class=\"rtsee-presentation-slide-text\">\n <p [style.font-size]=\"settings.fontSize + 'rem'\">{{slide.text}}</p>\n </div>\n <div class=\"rtsee-presentation-slide-controls\"\n [ngClass]=\"{'rtsee-presentation-slide-controls-hidden': hideRewindControls}\"\n >\n @if (story.activeSlideNumber !== 1) {\n <p-button class=\"slide-navigation-btn navigation-prev\"\n label=\"
|
|
1751
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", type: SlideComponent, isStandalone: true, selector: "rtsee-slide", inputs: { presentation: "presentation", story: "story", slide: "slide", settings: "settings" }, ngImport: i0, template: "<div class=\"rtsee-presentation-slide\" (scroll)=\"onScroll($event.target)\">\n @if (slide.widget) {\n <ng-template widgetHost></ng-template>\n }\n <div class=\"rtsee-presentation-slide-default\">\n @if (slide.imageUrl) {\n <div class=\"rtsee-presentation-slide-image-container\"\n [ngStyle]=\"{'background-image': 'url(' + slide.imageUrl + ')'}\"\n >\n </div>\n }\n <div class=\"rtsee-presentation-slide-text\">\n <p [style.font-size]=\"settings.fontSize + 'rem'\">{{slide.text}}</p>\n </div>\n <div class=\"rtsee-presentation-slide-controls\"\n [ngClass]=\"{'rtsee-presentation-slide-controls-hidden': hideRewindControls}\"\n >\n @if (story.activeSlideNumber !== 1) {\n <p-button class=\"slide-navigation-btn navigation-prev\"\n [label]=\"presentation.labels[RTSeeTextLabelKeys.PREVIOUS_SLIDE_LABEL]\"\n icon=\"pi pi-arrow-left\"\n [severity]=\"'secondary'\"\n [iconPos]=\"'left'\"\n (click)=\"slideRewindClicked(false)\"\n >\n </p-button>\n }\n @if (story.activeSlideNumber !== this.story.totalSlides) {\n <p-button class=\"slide-navigation-btn navigation-next\"\n [label]=\"presentation.labels[RTSeeTextLabelKeys.NEXT_SLIDE_LABEL]\"\n icon=\"pi pi-arrow-right\"\n [iconPos]=\"'right'\"\n (click)=\"slideRewindClicked(true)\"\n >\n </p-button>\n }\n </div>\n @if (\n presentation.messenger\n && story.activeSlideNumber === this.story.totalSlides\n && !presentation.myPeer.plan\n ) {\n <div class=\"rtsee-presentation-slide-payment\">\n <rtsee-payment-page [messenger]=\"presentation.messenger\" theme=\"light\"></rtsee-payment-page>\n </div>\n }\n </div>\n</div>\n", dependencies: [{ kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: WidgetDirective, selector: "[widgetHost]" }, { kind: "component", type: Button, selector: "p-button", inputs: ["type", "iconPos", "icon", "badge", "label", "disabled", "loading", "loadingIcon", "raised", "rounded", "text", "plain", "severity", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "buttonProps", "autofocus", "fluid"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: PaymentPageComponent, selector: "rtsee-payment-page", inputs: ["messenger", "theme"] }] }); }
|
|
1722
1752
|
}
|
|
1723
1753
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: SlideComponent, decorators: [{
|
|
1724
1754
|
type: Component,
|
|
1725
|
-
args: [{ selector: 'rtsee-slide', imports: [NgStyle, WidgetDirective, Button, NgClass], standalone: true, template: "<div class=\"rtsee-presentation-slide\" (scroll)=\"onScroll($event.target)\">\n @if (slide.widget) {\n <ng-template widgetHost></ng-template>\n }\n <div class=\"rtsee-presentation-slide-default\">\n @if (slide.imageUrl) {\n <div class=\"rtsee-presentation-slide-image-container\"\n [ngStyle]=\"{'background-image': 'url(' + slide.imageUrl + ')'}\"\n >\n </div>\n }\n <div class=\"rtsee-presentation-slide-text\">\n <p [style.font-size]=\"settings.fontSize + 'rem'\">{{slide.text}}</p>\n </div>\n <div class=\"rtsee-presentation-slide-controls\"\n [ngClass]=\"{'rtsee-presentation-slide-controls-hidden': hideRewindControls}\"\n >\n @if (story.activeSlideNumber !== 1) {\n <p-button class=\"slide-navigation-btn navigation-prev\"\n label=\"
|
|
1726
|
-
}], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: {
|
|
1755
|
+
args: [{ selector: 'rtsee-slide', imports: [NgStyle, WidgetDirective, Button, NgClass, PaymentPageComponent], standalone: true, template: "<div class=\"rtsee-presentation-slide\" (scroll)=\"onScroll($event.target)\">\n @if (slide.widget) {\n <ng-template widgetHost></ng-template>\n }\n <div class=\"rtsee-presentation-slide-default\">\n @if (slide.imageUrl) {\n <div class=\"rtsee-presentation-slide-image-container\"\n [ngStyle]=\"{'background-image': 'url(' + slide.imageUrl + ')'}\"\n >\n </div>\n }\n <div class=\"rtsee-presentation-slide-text\">\n <p [style.font-size]=\"settings.fontSize + 'rem'\">{{slide.text}}</p>\n </div>\n <div class=\"rtsee-presentation-slide-controls\"\n [ngClass]=\"{'rtsee-presentation-slide-controls-hidden': hideRewindControls}\"\n >\n @if (story.activeSlideNumber !== 1) {\n <p-button class=\"slide-navigation-btn navigation-prev\"\n [label]=\"presentation.labels[RTSeeTextLabelKeys.PREVIOUS_SLIDE_LABEL]\"\n icon=\"pi pi-arrow-left\"\n [severity]=\"'secondary'\"\n [iconPos]=\"'left'\"\n (click)=\"slideRewindClicked(false)\"\n >\n </p-button>\n }\n @if (story.activeSlideNumber !== this.story.totalSlides) {\n <p-button class=\"slide-navigation-btn navigation-next\"\n [label]=\"presentation.labels[RTSeeTextLabelKeys.NEXT_SLIDE_LABEL]\"\n icon=\"pi pi-arrow-right\"\n [iconPos]=\"'right'\"\n (click)=\"slideRewindClicked(true)\"\n >\n </p-button>\n }\n </div>\n @if (\n presentation.messenger\n && story.activeSlideNumber === this.story.totalSlides\n && !presentation.myPeer.plan\n ) {\n <div class=\"rtsee-presentation-slide-payment\">\n <rtsee-payment-page [messenger]=\"presentation.messenger\" theme=\"light\"></rtsee-payment-page>\n </div>\n }\n </div>\n</div>\n" }]
|
|
1756
|
+
}], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { presentation: [{
|
|
1757
|
+
type: Input
|
|
1758
|
+
}], story: [{
|
|
1727
1759
|
type: Input
|
|
1728
1760
|
}], slide: [{
|
|
1729
1761
|
type: Input
|
|
@@ -1746,15 +1778,17 @@ class StoryPlayerComponent {
|
|
|
1746
1778
|
this.story.initSwiper(swiper);
|
|
1747
1779
|
}
|
|
1748
1780
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: StoryPlayerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1749
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", type: StoryPlayerComponent, isStandalone: true, selector: "rtsee-story-player", inputs: { story: "story", settings: "settings" }, viewQueries: [{ propertyName: "swiperEl", first: true, predicate: ["swiperContainer"], descendants: true }], ngImport: i0, template: "<div class=\"rtsee-story-player\">\n <div class=\"rtsee-story-player-slider swiper\" #swiperContainer>\n <div class=\"rtsee-story-player-slider-inner swiper-wrapper\">\n @for (slide of story.slides; track slide.id) {\n <div class=\"story-player-slide-container swiper-slide\"\n [ngClass]=\"{'story-player-slide-active': slide.isActive}\"\n >\n <rtsee-slide [slide]=\"slide\"\n [story]=\"story\"\n [settings]=\"settings\"\n ></rtsee-slide>\n </div>\n }\n </div>\n </div>\n</div>\n", dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: SlideComponent, selector: "rtsee-slide", inputs: ["story", "slide", "settings"] }] }); }
|
|
1781
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", type: StoryPlayerComponent, isStandalone: true, selector: "rtsee-story-player", inputs: { story: "story", settings: "settings", presentation: "presentation" }, viewQueries: [{ propertyName: "swiperEl", first: true, predicate: ["swiperContainer"], descendants: true }], ngImport: i0, template: "<div class=\"rtsee-story-player\">\n <div class=\"rtsee-story-player-slider swiper\" #swiperContainer>\n <div class=\"rtsee-story-player-slider-inner swiper-wrapper\">\n @for (slide of story.slides; track slide.id) {\n <div class=\"story-player-slide-container swiper-slide\"\n [ngClass]=\"{'story-player-slide-active': slide.isActive}\"\n >\n <rtsee-slide [slide]=\"slide\"\n [story]=\"story\"\n [presentation]=\"presentation\"\n [settings]=\"settings\"\n ></rtsee-slide>\n </div>\n }\n </div>\n </div>\n</div>\n", dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: SlideComponent, selector: "rtsee-slide", inputs: ["presentation", "story", "slide", "settings"] }] }); }
|
|
1750
1782
|
}
|
|
1751
1783
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: StoryPlayerComponent, decorators: [{
|
|
1752
1784
|
type: Component,
|
|
1753
|
-
args: [{ selector: 'rtsee-story-player', imports: [NgClass, SlideComponent], standalone: true, template: "<div class=\"rtsee-story-player\">\n <div class=\"rtsee-story-player-slider swiper\" #swiperContainer>\n <div class=\"rtsee-story-player-slider-inner swiper-wrapper\">\n @for (slide of story.slides; track slide.id) {\n <div class=\"story-player-slide-container swiper-slide\"\n [ngClass]=\"{'story-player-slide-active': slide.isActive}\"\n >\n <rtsee-slide [slide]=\"slide\"\n [story]=\"story\"\n [settings]=\"settings\"\n ></rtsee-slide>\n </div>\n }\n </div>\n </div>\n</div>\n" }]
|
|
1785
|
+
args: [{ selector: 'rtsee-story-player', imports: [NgClass, SlideComponent], standalone: true, template: "<div class=\"rtsee-story-player\">\n <div class=\"rtsee-story-player-slider swiper\" #swiperContainer>\n <div class=\"rtsee-story-player-slider-inner swiper-wrapper\">\n @for (slide of story.slides; track slide.id) {\n <div class=\"story-player-slide-container swiper-slide\"\n [ngClass]=\"{'story-player-slide-active': slide.isActive}\"\n >\n <rtsee-slide [slide]=\"slide\"\n [story]=\"story\"\n [presentation]=\"presentation\"\n [settings]=\"settings\"\n ></rtsee-slide>\n </div>\n }\n </div>\n </div>\n</div>\n" }]
|
|
1754
1786
|
}], ctorParameters: () => [], propDecorators: { story: [{
|
|
1755
1787
|
type: Input
|
|
1756
1788
|
}], settings: [{
|
|
1757
1789
|
type: Input
|
|
1790
|
+
}], presentation: [{
|
|
1791
|
+
type: Input
|
|
1758
1792
|
}], swiperEl: [{
|
|
1759
1793
|
type: ViewChild,
|
|
1760
1794
|
args: ['swiperContainer']
|
|
@@ -2380,11 +2414,11 @@ class ManageStoriesComponent {
|
|
|
2380
2414
|
this.manageStories.init();
|
|
2381
2415
|
}
|
|
2382
2416
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: ManageStoriesComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
2383
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", type: ManageStoriesComponent, isStandalone: true, selector: "rtsee-manage-stories", inputs: { manageStories: "manageStories" }, ngImport: i0, template: "<div class=\"rtsee-manage-stories\">\n <div class=\"rtsee-manage-stories-header\">\n @if (!manageStories.selectedStory) {\n <p-button (click)=\"manageStories.selectNewStory()\"\n label=\"Create A New Story\"\n ></p-button>\n }\n </div>\n @if (manageStories.selectedStory) {\n <div class=\"rtsee-manage-story-container\">\n <rtsee-manage-story [manageStory]=\"manageStories.selectedStory\"\n ></rtsee-manage-story>\n </div>\n }\n @if (!manageStories.selectedStory) {\n <div class=\"rtsee-manage-stories-list rtsee-ordered-list\">\n <p-orderList [value]=\"manageStories.stories\"\n dataKey=\"id\"\n [dragdrop]=\"true\"\n [responsive]=\"true\"\n [scrollHeight]=\"'40rem'\"\n class=\"rtsee-ordered-list-inner\"\n (onReorder)=\"manageStories.onReorder()\"\n >\n <ng-template let-option let-selected=\"selected\" #item>\n <div class=\"rtsee-presentation-manage-stories-list-item rtsee-ordered-list-item\">\n <img\n [src]=\"option.imageUrl\"\n [alt]=\"'slide_image'\"\n [style.width]=\"'60px'\"\n class=\"rtsee-presentation-manage-stories-list-item-image rtsee-ordered-list-item-image\"\n />\n <div class=\"rtsee-presentation-manage-stories-list-item-info rtsee-ordered-list-item-info\">\n <span [ngClass]=\"{\n 'text-sm': true,\n 'text-surface-500': !selected,\n 'dark:text-surface-400': !selected,\n 'text-inherit': selected,\n }\"\n >{{ option.name }}</span>\n <div class=\"rtsee-ordered-list-item-info-buttons\">\n <p-button label=\"Edit\"\n class=\"rtsee-ordered-list-item-info-button\"\n (click)=\"manageStories.selectStory(option.id)\"\n ></p-button>\n <p-button label=\"Delete\"\n [severity]=\"'warn'\"\n class=\"rtsee-ordered-list-item-info-button\"\n (click)=\"manageStories.selectStory(option.id)\"\n ></p-button>\n </div>\n </div>\n </div>\n </ng-template>\n </p-orderList>\n </div>\n }\n</div>\n", dependencies: [{ kind: "component", type: ManageStoryComponent, selector: "rtsee-manage-story", inputs: ["manageStory"] }, { kind: "component", type: Button, selector: "p-button", inputs: ["type", "iconPos", "icon", "badge", "label", "disabled", "loading", "loadingIcon", "raised", "rounded", "text", "plain", "severity", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "buttonProps", "autofocus", "fluid"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "component", type: OrderList, selector: "p-orderList, p-orderlist, p-order-list", inputs: ["header", "styleClass", "tabindex", "ariaLabel", "ariaLabelledBy", "listStyle", "responsive", "filterBy", "filterPlaceholder", "filterLocale", "metaKeySelection", "dragdrop", "controlsPosition", "ariaFilterLabel", "filterMatchMode", "breakpoint", "stripedRows", "disabled", "trackBy", "scrollHeight", "autoOptionFocus", "dataKey", "selection", "value", "buttonProps", "moveUpButtonProps", "moveTopButtonProps", "moveDownButtonProps", "moveBottomButtonProps"], outputs: ["selectionChange", "onReorder", "onSelectionChange", "onFilterEvent", "onFocus", "onBlur"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] }); }
|
|
2417
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", type: ManageStoriesComponent, isStandalone: true, selector: "rtsee-manage-stories", inputs: { manageStories: "manageStories" }, ngImport: i0, template: "<div class=\"rtsee-manage-stories\">\n <div class=\"rtsee-manage-stories-header\">\n @if (!manageStories.selectedStory) {\n <p-button (click)=\"manageStories.selectNewStory()\"\n label=\"Create A New Story\"\n ></p-button>\n }\n </div>\n @if (manageStories.selectedStory) {\n <div class=\"rtsee-manage-story-container\">\n <rtsee-manage-story [manageStory]=\"manageStories.selectedStory\"\n ></rtsee-manage-story>\n </div>\n }\n @if (!manageStories.selectedStory) {\n <div class=\"rtsee-manage-stories-list rtsee-ordered-list\">\n <p-orderList [value]=\"manageStories.stories\"\n dataKey=\"id\"\n [dragdrop]=\"true\"\n [responsive]=\"true\"\n [scrollHeight]=\"'40rem'\"\n class=\"rtsee-ordered-list-inner\"\n (onReorder)=\"manageStories.onReorder()\"\n >\n <ng-template let-option let-selected=\"selected\" #item>\n <div class=\"rtsee-presentation-manage-stories-list-item rtsee-ordered-list-item\">\n <img\n [src]=\"option.imageUrl\"\n [alt]=\"'slide_image'\"\n [style.width]=\"'60px'\"\n class=\"rtsee-presentation-manage-stories-list-item-image rtsee-ordered-list-item-image\"\n />\n <div class=\"rtsee-presentation-manage-stories-list-item-info rtsee-ordered-list-item-info\">\n <span [ngClass]=\"{\n 'text-sm': true,\n 'text-surface-500': !selected,\n 'dark:text-surface-400': !selected,\n 'text-inherit': selected,\n }\"\n >{{ option.name }}</span>\n <div class=\"rtsee-ordered-list-item-info-buttons\">\n <p-button label=\"Edit\"\n class=\"rtsee-ordered-list-item-info-button\"\n (click)=\"manageStories.selectStory(option.id)\"\n ></p-button>\n <p-button label=\"Delete\"\n [severity]=\"'warn'\"\n class=\"rtsee-ordered-list-item-info-button\"\n (click)=\"manageStories.selectStory(option.id)\"\n ></p-button>\n <p-button label=\"Clone\"\n [severity]=\"'secondary'\"\n class=\"rtsee-ordered-list-item-info-button\"\n (click)=\"manageStories.cloneStory(option.id)\"\n ></p-button>\n </div>\n </div>\n </div>\n </ng-template>\n </p-orderList>\n </div>\n }\n</div>\n", dependencies: [{ kind: "component", type: ManageStoryComponent, selector: "rtsee-manage-story", inputs: ["manageStory"] }, { kind: "component", type: Button, selector: "p-button", inputs: ["type", "iconPos", "icon", "badge", "label", "disabled", "loading", "loadingIcon", "raised", "rounded", "text", "plain", "severity", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "buttonProps", "autofocus", "fluid"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "component", type: OrderList, selector: "p-orderList, p-orderlist, p-order-list", inputs: ["header", "styleClass", "tabindex", "ariaLabel", "ariaLabelledBy", "listStyle", "responsive", "filterBy", "filterPlaceholder", "filterLocale", "metaKeySelection", "dragdrop", "controlsPosition", "ariaFilterLabel", "filterMatchMode", "breakpoint", "stripedRows", "disabled", "trackBy", "scrollHeight", "autoOptionFocus", "dataKey", "selection", "value", "buttonProps", "moveUpButtonProps", "moveTopButtonProps", "moveDownButtonProps", "moveBottomButtonProps"], outputs: ["selectionChange", "onReorder", "onSelectionChange", "onFilterEvent", "onFocus", "onBlur"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] }); }
|
|
2384
2418
|
}
|
|
2385
2419
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: ManageStoriesComponent, decorators: [{
|
|
2386
2420
|
type: Component,
|
|
2387
|
-
args: [{ selector: 'rtsee-manage-stories', imports: [ManageStoryComponent, Button, OrderList, NgClass], template: "<div class=\"rtsee-manage-stories\">\n <div class=\"rtsee-manage-stories-header\">\n @if (!manageStories.selectedStory) {\n <p-button (click)=\"manageStories.selectNewStory()\"\n label=\"Create A New Story\"\n ></p-button>\n }\n </div>\n @if (manageStories.selectedStory) {\n <div class=\"rtsee-manage-story-container\">\n <rtsee-manage-story [manageStory]=\"manageStories.selectedStory\"\n ></rtsee-manage-story>\n </div>\n }\n @if (!manageStories.selectedStory) {\n <div class=\"rtsee-manage-stories-list rtsee-ordered-list\">\n <p-orderList [value]=\"manageStories.stories\"\n dataKey=\"id\"\n [dragdrop]=\"true\"\n [responsive]=\"true\"\n [scrollHeight]=\"'40rem'\"\n class=\"rtsee-ordered-list-inner\"\n (onReorder)=\"manageStories.onReorder()\"\n >\n <ng-template let-option let-selected=\"selected\" #item>\n <div class=\"rtsee-presentation-manage-stories-list-item rtsee-ordered-list-item\">\n <img\n [src]=\"option.imageUrl\"\n [alt]=\"'slide_image'\"\n [style.width]=\"'60px'\"\n class=\"rtsee-presentation-manage-stories-list-item-image rtsee-ordered-list-item-image\"\n />\n <div class=\"rtsee-presentation-manage-stories-list-item-info rtsee-ordered-list-item-info\">\n <span [ngClass]=\"{\n 'text-sm': true,\n 'text-surface-500': !selected,\n 'dark:text-surface-400': !selected,\n 'text-inherit': selected,\n }\"\n >{{ option.name }}</span>\n <div class=\"rtsee-ordered-list-item-info-buttons\">\n <p-button label=\"Edit\"\n class=\"rtsee-ordered-list-item-info-button\"\n (click)=\"manageStories.selectStory(option.id)\"\n ></p-button>\n <p-button label=\"Delete\"\n [severity]=\"'warn'\"\n class=\"rtsee-ordered-list-item-info-button\"\n (click)=\"manageStories.selectStory(option.id)\"\n ></p-button>\n </div>\n </div>\n </div>\n </ng-template>\n </p-orderList>\n </div>\n }\n</div>\n" }]
|
|
2421
|
+
args: [{ selector: 'rtsee-manage-stories', imports: [ManageStoryComponent, Button, OrderList, NgClass], template: "<div class=\"rtsee-manage-stories\">\n <div class=\"rtsee-manage-stories-header\">\n @if (!manageStories.selectedStory) {\n <p-button (click)=\"manageStories.selectNewStory()\"\n label=\"Create A New Story\"\n ></p-button>\n }\n </div>\n @if (manageStories.selectedStory) {\n <div class=\"rtsee-manage-story-container\">\n <rtsee-manage-story [manageStory]=\"manageStories.selectedStory\"\n ></rtsee-manage-story>\n </div>\n }\n @if (!manageStories.selectedStory) {\n <div class=\"rtsee-manage-stories-list rtsee-ordered-list\">\n <p-orderList [value]=\"manageStories.stories\"\n dataKey=\"id\"\n [dragdrop]=\"true\"\n [responsive]=\"true\"\n [scrollHeight]=\"'40rem'\"\n class=\"rtsee-ordered-list-inner\"\n (onReorder)=\"manageStories.onReorder()\"\n >\n <ng-template let-option let-selected=\"selected\" #item>\n <div class=\"rtsee-presentation-manage-stories-list-item rtsee-ordered-list-item\">\n <img\n [src]=\"option.imageUrl\"\n [alt]=\"'slide_image'\"\n [style.width]=\"'60px'\"\n class=\"rtsee-presentation-manage-stories-list-item-image rtsee-ordered-list-item-image\"\n />\n <div class=\"rtsee-presentation-manage-stories-list-item-info rtsee-ordered-list-item-info\">\n <span [ngClass]=\"{\n 'text-sm': true,\n 'text-surface-500': !selected,\n 'dark:text-surface-400': !selected,\n 'text-inherit': selected,\n }\"\n >{{ option.name }}</span>\n <div class=\"rtsee-ordered-list-item-info-buttons\">\n <p-button label=\"Edit\"\n class=\"rtsee-ordered-list-item-info-button\"\n (click)=\"manageStories.selectStory(option.id)\"\n ></p-button>\n <p-button label=\"Delete\"\n [severity]=\"'warn'\"\n class=\"rtsee-ordered-list-item-info-button\"\n (click)=\"manageStories.selectStory(option.id)\"\n ></p-button>\n <p-button label=\"Clone\"\n [severity]=\"'secondary'\"\n class=\"rtsee-ordered-list-item-info-button\"\n (click)=\"manageStories.cloneStory(option.id)\"\n ></p-button>\n </div>\n </div>\n </div>\n </ng-template>\n </p-orderList>\n </div>\n }\n</div>\n" }]
|
|
2388
2422
|
}], propDecorators: { manageStories: [{
|
|
2389
2423
|
type: Input
|
|
2390
2424
|
}] } });
|
|
@@ -2800,6 +2834,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImpor
|
|
|
2800
2834
|
class RaterComponent {
|
|
2801
2835
|
constructor() {
|
|
2802
2836
|
this.isEditing = false;
|
|
2837
|
+
this.RTSeeTextLabelKeys = RTSeeTextLabelKeys;
|
|
2803
2838
|
}
|
|
2804
2839
|
ngOnInit() {
|
|
2805
2840
|
this.getRatingConfigurations()
|
|
@@ -2850,11 +2885,11 @@ class RaterComponent {
|
|
|
2850
2885
|
return rates;
|
|
2851
2886
|
}
|
|
2852
2887
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: RaterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
2853
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", type: RaterComponent, isStandalone: true, selector: "rtsee-rater", inputs: { entity: "entity", rater: "rater" }, ngImport: i0, template: "<div class=\"rtsee-rater\" [ngClass]=\"{'rtsee-rater-view-mode': rater.userRateGroup && !isEditing}\">\n @if (rater.userRateGroup && !isEditing) {\n <rtsee-rate-item\n [group]=\"rater.userRateGroup\"\n [rater]=\"rater\"\n [showActions]=\"true\"\n (edit)=\"startEdit()\"\n (delete)=\"deleteRate()\"\n ></rtsee-rate-item>\n } @else {\n <div class=\"rtsee-rater-user-header\">\n @if (rater.peer?.imageUrl) {\n <img\n class=\"rtsee-rater-avatar\"\n [src]=\"rater.peer?.imageUrl\"\n alt=\"User avatar\"\n />\n } @else {\n <div class=\"rtsee-rater-avatar-fallback\">\n {{ (rater.peer?.name || \"?\").substring(0, 1) }}\n </div>\n }\n <div class=\"rtsee-rater-user-info\">\n <span class=\"rtsee-rater-user-name\">{{\n rater.peer?.name || \"Anonymous\"\n }}</span>\n <span class=\"rtsee-rater-user-status\">Rating publicly</span>\n </div>\n </div>\n <hr class=\"rtsee-rater-divider\" />\n @for (config of rater.configsWithRates; track config.id) {\n <rtsee-rate-input [config]=\"config\"></rtsee-rate-input>\n }\n <div class=\"rtsee-rater-actions\">\n @if (rater.userRateGroup) {\n <p-button\n (click)=\"sendRate()\"\n [severity]=\"'success'\"\n [label]=\"
|
|
2888
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", type: RaterComponent, isStandalone: true, selector: "rtsee-rater", inputs: { entity: "entity", rater: "rater" }, ngImport: i0, template: "<div class=\"rtsee-rater\" [ngClass]=\"{'rtsee-rater-view-mode': rater.userRateGroup && !isEditing}\">\n @if (rater.userRateGroup && !isEditing) {\n <rtsee-rate-item\n [group]=\"rater.userRateGroup\"\n [rater]=\"rater\"\n [showActions]=\"true\"\n (edit)=\"startEdit()\"\n (delete)=\"deleteRate()\"\n ></rtsee-rate-item>\n } @else {\n <div class=\"rtsee-rater-user-header\">\n @if (rater.peer?.imageUrl) {\n <img\n class=\"rtsee-rater-avatar\"\n [src]=\"rater.peer?.imageUrl\"\n alt=\"User avatar\"\n />\n } @else {\n <div class=\"rtsee-rater-avatar-fallback\">\n {{ (rater.peer?.name || \"?\").substring(0, 1) }}\n </div>\n }\n <div class=\"rtsee-rater-user-info\">\n <span class=\"rtsee-rater-user-name\">{{\n rater.peer?.name || \"Anonymous\"\n }}</span>\n <span class=\"rtsee-rater-user-status\">Rating publicly</span>\n </div>\n </div>\n <hr class=\"rtsee-rater-divider\" />\n @for (config of rater.configsWithRates; track config.id) {\n <rtsee-rate-input [config]=\"config\"></rtsee-rate-input>\n }\n <div class=\"rtsee-rater-actions\">\n @if (rater.userRateGroup) {\n <p-button\n (click)=\"sendRate()\"\n [severity]=\"'success'\"\n [label]=\"rater.messenger.labels[RTSeeTextLabelKeys.RATER_UPDATE]\"\n type=\"submit\"\n class=\"rtsee-rater-btn-update rts-action-button\"\n >\n <span class=\"pi pi-check\"></span>\n </p-button>\n <p-button\n (click)=\"deleteRate()\"\n [severity]=\"'danger'\"\n [label]=\"rater.messenger.labels[RTSeeTextLabelKeys.RATER_DELETE]\"\n class=\"rtsee-rater-btn-delete rts-action-button\"\n >\n <span class=\"pi pi-trash\"></span>\n </p-button>\n } @else {\n <p-button\n (click)=\"sendRate()\"\n [severity]=\"'primary'\"\n [label]=\"rater.messenger.labels[RTSeeTextLabelKeys.RATER_SEND]\"\n type=\"submit\"\n class=\"rtsee-rater-btn-send rts-action-button\"\n >\n <span class=\"pi pi-send\"></span>\n </p-button>\n }\n </div>\n }\n</div>\n", dependencies: [{ kind: "component", type: Button, selector: "p-button", inputs: ["type", "iconPos", "icon", "badge", "label", "disabled", "loading", "loadingIcon", "raised", "rounded", "text", "plain", "severity", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "buttonProps", "autofocus", "fluid"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "component", type: RateInputComponent, selector: "rtsee-rate-input", inputs: ["config"] }, { kind: "component", type: RateItemComponent, selector: "rtsee-rate-item", inputs: ["group", "rater", "showActions"], outputs: ["edit", "delete"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] }); }
|
|
2854
2889
|
}
|
|
2855
2890
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: RaterComponent, decorators: [{
|
|
2856
2891
|
type: Component,
|
|
2857
|
-
args: [{ selector: 'rtsee-rater', imports: [Button, RateInputComponent, RateItemComponent, NgClass], template: "<div class=\"rtsee-rater\" [ngClass]=\"{'rtsee-rater-view-mode': rater.userRateGroup && !isEditing}\">\n @if (rater.userRateGroup && !isEditing) {\n <rtsee-rate-item\n [group]=\"rater.userRateGroup\"\n [rater]=\"rater\"\n [showActions]=\"true\"\n (edit)=\"startEdit()\"\n (delete)=\"deleteRate()\"\n ></rtsee-rate-item>\n } @else {\n <div class=\"rtsee-rater-user-header\">\n @if (rater.peer?.imageUrl) {\n <img\n class=\"rtsee-rater-avatar\"\n [src]=\"rater.peer?.imageUrl\"\n alt=\"User avatar\"\n />\n } @else {\n <div class=\"rtsee-rater-avatar-fallback\">\n {{ (rater.peer?.name || \"?\").substring(0, 1) }}\n </div>\n }\n <div class=\"rtsee-rater-user-info\">\n <span class=\"rtsee-rater-user-name\">{{\n rater.peer?.name || \"Anonymous\"\n }}</span>\n <span class=\"rtsee-rater-user-status\">Rating publicly</span>\n </div>\n </div>\n <hr class=\"rtsee-rater-divider\" />\n @for (config of rater.configsWithRates; track config.id) {\n <rtsee-rate-input [config]=\"config\"></rtsee-rate-input>\n }\n <div class=\"rtsee-rater-actions\">\n @if (rater.userRateGroup) {\n <p-button\n (click)=\"sendRate()\"\n [severity]=\"'success'\"\n [label]=\"
|
|
2892
|
+
args: [{ selector: 'rtsee-rater', imports: [Button, RateInputComponent, RateItemComponent, NgClass], template: "<div class=\"rtsee-rater\" [ngClass]=\"{'rtsee-rater-view-mode': rater.userRateGroup && !isEditing}\">\n @if (rater.userRateGroup && !isEditing) {\n <rtsee-rate-item\n [group]=\"rater.userRateGroup\"\n [rater]=\"rater\"\n [showActions]=\"true\"\n (edit)=\"startEdit()\"\n (delete)=\"deleteRate()\"\n ></rtsee-rate-item>\n } @else {\n <div class=\"rtsee-rater-user-header\">\n @if (rater.peer?.imageUrl) {\n <img\n class=\"rtsee-rater-avatar\"\n [src]=\"rater.peer?.imageUrl\"\n alt=\"User avatar\"\n />\n } @else {\n <div class=\"rtsee-rater-avatar-fallback\">\n {{ (rater.peer?.name || \"?\").substring(0, 1) }}\n </div>\n }\n <div class=\"rtsee-rater-user-info\">\n <span class=\"rtsee-rater-user-name\">{{\n rater.peer?.name || \"Anonymous\"\n }}</span>\n <span class=\"rtsee-rater-user-status\">Rating publicly</span>\n </div>\n </div>\n <hr class=\"rtsee-rater-divider\" />\n @for (config of rater.configsWithRates; track config.id) {\n <rtsee-rate-input [config]=\"config\"></rtsee-rate-input>\n }\n <div class=\"rtsee-rater-actions\">\n @if (rater.userRateGroup) {\n <p-button\n (click)=\"sendRate()\"\n [severity]=\"'success'\"\n [label]=\"rater.messenger.labels[RTSeeTextLabelKeys.RATER_UPDATE]\"\n type=\"submit\"\n class=\"rtsee-rater-btn-update rts-action-button\"\n >\n <span class=\"pi pi-check\"></span>\n </p-button>\n <p-button\n (click)=\"deleteRate()\"\n [severity]=\"'danger'\"\n [label]=\"rater.messenger.labels[RTSeeTextLabelKeys.RATER_DELETE]\"\n class=\"rtsee-rater-btn-delete rts-action-button\"\n >\n <span class=\"pi pi-trash\"></span>\n </p-button>\n } @else {\n <p-button\n (click)=\"sendRate()\"\n [severity]=\"'primary'\"\n [label]=\"rater.messenger.labels[RTSeeTextLabelKeys.RATER_SEND]\"\n type=\"submit\"\n class=\"rtsee-rater-btn-send rts-action-button\"\n >\n <span class=\"pi pi-send\"></span>\n </p-button>\n }\n </div>\n }\n</div>\n" }]
|
|
2858
2893
|
}], propDecorators: { entity: [{
|
|
2859
2894
|
type: Input
|
|
2860
2895
|
}], rater: [{
|
|
@@ -2920,6 +2955,7 @@ class RtseeEntityPreviewComponent {
|
|
|
2920
2955
|
void this.entity.reload();
|
|
2921
2956
|
this.rater = new RTSeeRater({
|
|
2922
2957
|
entityId: this.entity.id,
|
|
2958
|
+
messenger: this.messenger,
|
|
2923
2959
|
entityConfigurationId: this.entity.configurationId,
|
|
2924
2960
|
...this.entity.getHandlerCommonOptions(),
|
|
2925
2961
|
});
|
|
@@ -2941,6 +2977,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImpor
|
|
|
2941
2977
|
}] } });
|
|
2942
2978
|
|
|
2943
2979
|
class StoryDetailsComponent {
|
|
2980
|
+
constructor() {
|
|
2981
|
+
this.RTSeeTextLabelKeys = RTSeeTextLabelKeys;
|
|
2982
|
+
this.Math = Math;
|
|
2983
|
+
}
|
|
2944
2984
|
getStarArray(rating) {
|
|
2945
2985
|
const stars = [];
|
|
2946
2986
|
const val = rating || 0;
|
|
@@ -2958,11 +2998,11 @@ class StoryDetailsComponent {
|
|
|
2958
2998
|
return stars;
|
|
2959
2999
|
}
|
|
2960
3000
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: StoryDetailsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
2961
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", type: StoryDetailsComponent, isStandalone: true, selector: "rtsee-story-details", inputs: { story: "story", presentation: "presentation", messenger: "messenger" }, ngImport: i0, template: "<div class=\"rtsee-story-details\">\n <section\n class=\"rtsee-story-details-cover\"\n [style.background-image]=\"'url(' + story.imageUrl + ')'\"\n >\n <button\n class=\"rtsee-story-details-btn-close\"\n [routerLink]=\"[presentation.homePage]\"\n (click)=\"presentation.closeStoryDetails()\"\n aria-label=\"Close\"\n >\n <span class=\"pi pi-times\"></span>\n </button>\n <div class=\"rtsee-story-details-cover-overlay\"></div>\n <div class=\"rtsee-story-details-cover-content\">\n <div class=\"rtsee-story-details-cover-badges\">\n @if (story.categories?.length) {\n @for (category of story.categories; track category.id) {\n <span class=\"rtsee-story-details-tag-pill\">\n {{ category.name }}\n </span>\n }\n }\n @if (story.tags?.length) {\n @for (tag of story.tags; track tag.id) {\n <span\n class=\"rtsee-story-details-tag-pill rtsee-story-details-tag-pill-label\"\n >\n @if (tag.symbol) {\n <span class=\"symbol\">{{ tag.symbol }}</span>\n }\n {{ tag.name }}\n </span>\n }\n }\n </div>\n\n <h1 class=\"rtsee-story-details-cover-title\">{{ story.name }}</h1>\n\n <div class=\"rtsee-story-details-cover-meta\">\n @if (story.rating !== null) {\n <div class=\"rtsee-story-details-cover-rating\">\n <span class=\"rtsee-story-details-stars\">\n @for (star of getStarArray(story.rating); track $index) {\n <span\n class=\"rtsee-story-details-star\"\n [class.rtsee-story-details-star-full]=\"star === 'full'\"\n [class.rtsee-story-details-star-half]=\"star === 'half'\"\n [class.rtsee-story-details-star-empty]=\"star === 'empty'\"\n >\n @if (star === \"full\") {\n \u2605\n } @else if (star === \"half\") {\n \u2605\n } @else {\n \u2606\n }\n </span>\n }\n </span>\n <span class=\"rtsee-story-details-rating-number\">{{\n story.rating\n }}</span>\n @if (story.ratesCount !== null) {\n <span class=\"rtsee-story-details-rating-count\"
|
|
3001
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", type: StoryDetailsComponent, isStandalone: true, selector: "rtsee-story-details", inputs: { story: "story", presentation: "presentation", messenger: "messenger" }, ngImport: i0, template: "<div class=\"rtsee-story-details\">\n <section\n class=\"rtsee-story-details-cover\"\n [style.background-image]=\"'url(' + story.imageUrl + ')'\"\n >\n <button\n class=\"rtsee-story-details-btn-close\"\n [routerLink]=\"[presentation.homePage]\"\n (click)=\"presentation.closeStoryDetails()\"\n aria-label=\"Close\"\n >\n <span class=\"pi pi-times\"></span>\n </button>\n <div class=\"rtsee-story-details-cover-overlay\"></div>\n <div class=\"rtsee-story-details-cover-content\">\n <div class=\"rtsee-story-details-cover-badges\">\n @if (story.categories?.length) {\n @for (category of story.categories; track category.id) {\n <span class=\"rtsee-story-details-tag-pill\">\n {{ category.name }}\n </span>\n }\n }\n @if (story.tags?.length) {\n @for (tag of story.tags; track tag.id) {\n <span\n class=\"rtsee-story-details-tag-pill rtsee-story-details-tag-pill-label\"\n >\n @if (tag.symbol) {\n <span class=\"symbol\">{{ tag.symbol }}</span>\n }\n {{ tag.name }}\n </span>\n }\n }\n </div>\n\n <h1 class=\"rtsee-story-details-cover-title\">{{ story.name }}</h1>\n\n <div class=\"rtsee-story-details-cover-meta\">\n @if (story.rating !== null) {\n <div class=\"rtsee-story-details-cover-rating\">\n <span class=\"rtsee-story-details-stars\">\n @for (star of getStarArray(story.rating); track $index) {\n <span\n class=\"rtsee-story-details-star\"\n [class.rtsee-story-details-star-full]=\"star === 'full'\"\n [class.rtsee-story-details-star-half]=\"star === 'half'\"\n [class.rtsee-story-details-star-empty]=\"star === 'empty'\"\n >\n @if (star === \"full\") {\n \u2605\n } @else if (star === \"half\") {\n \u2605\n } @else {\n \u2606\n }\n </span>\n }\n </span>\n <span class=\"rtsee-story-details-rating-number\">{{\n story.rating\n }}</span>\n @if (story.ratesCount !== null) {\n <span class=\"rtsee-story-details-rating-count\">\n <span>(</span>\n <span>{{ presentation.labels[RTSeeTextLabelKeys.FEEDBACKS_LABEL] }}:</span>\n <span> </span>\n <span>{{ story.ratesCount }}</span>\n <span>)</span>\n </span\n >\n }\n </div>\n }\n\n <div class=\"rtsee-story-details-cover-info-chips\">\n @if (story.averageReadTime) {\n <span class=\"rtsee-story-details-info-chip\">\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n width=\"14\"\n height=\"14\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n stroke=\"currentColor\"\n stroke-width=\"2\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n >\n <circle cx=\"12\" cy=\"12\" r=\"10\" />\n <polyline points=\"12 6 12 12 16 14\" />\n </svg>\n <span>\n <span>{{ Math.ceil(story.averageReadTime / 60) }}</span>\n <span> </span>\n <span>{{ presentation.labels[RTSeeTextLabelKeys.MINUTE_LABEL] }}</span>\n </span>\n </span>\n }\n @if (story.totalSlides) {\n <span class=\"rtsee-story-details-info-chip\">\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n width=\"14\"\n height=\"14\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n stroke=\"currentColor\"\n stroke-width=\"2\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n >\n <path d=\"M2 3h6a4 4 0 0 1 4 4v14a3 3 0 0 0-3-3H2z\" />\n <path d=\"M22 3h-6a4 4 0 0 0-4 4v14a3 3 0 0 1 3-3h7z\" />\n </svg>\n <span>\n <span>{{ presentation.labels[RTSeeTextLabelKeys.STORY_PAGES_LABEL] }}:</span>\n <span> </span>\n <span>{{ story.totalSlides }}</span>\n </span>\n </span>\n }\n </div>\n </div>\n </div>\n </section>\n\n <!-- CONTENT AREA -->\n <div class=\"rtsee-story-details-content-wrapper\">\n <div class=\"rtsee-story-details-cover-actions\">\n <p-button\n (click)=\"presentation.setActiveStory(story)\"\n [severity]=\"'primary'\"\n [label]=\"story.preselectedSlideNumber ? presentation.labels[RTSeeTextLabelKeys.CONTINUE_READING_BUTTON] : presentation.labels[RTSeeTextLabelKeys.START_READING_BUTTON]\"\n class=\"rtsee-story-details-start-reading rts-action-button\"\n >\n </p-button>\n </div>\n <div class=\"rtsee-story-details-content-grid\">\n <!-- Description Card -->\n <article class=\"rtsee-story-details-glass-card\">\n <div class=\"rtsee-story-details-glass-card-header\">\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n width=\"20\"\n height=\"20\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n stroke=\"currentColor\"\n stroke-width=\"2\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n >\n <path d=\"M2 3h6a4 4 0 0 1 4 4v14a3 3 0 0 0-3-3H2z\" />\n <path d=\"M22 3h-6a4 4 0 0 0-4 4v14a3 3 0 0 1 3-3h7z\" />\n </svg>\n <h2>{{presentation.labels[RTSeeTextLabelKeys.STORY_ABOUT_LABEL]}}</h2>\n </div>\n <p class=\"rtsee-story-details-glass-card-text\">\n {{ story.description }}\n </p>\n </article>\n </div>\n\n @if (messenger) {\n <rtsee-entity-preview\n [entity]=\"story\"\n [messenger]=\"messenger\"\n ></rtsee-entity-preview>\n }\n\n @if (story.categories?.length && false) {\n <div class=\"rtsee-story-details-categories\">\n @for (category of story.categories; track category.id) {\n <p-tag [value]=\"category.name\"></p-tag>\n }\n </div>\n }\n\n @if (story.tags?.length && false) {\n <div class=\"rtsee-story-details-labels\">\n @for (tag of story.tags; track tag.id) {\n <p-chip class=\"rtsee-story-details-label\">\n @if (tag.symbol) {\n <span class=\"rtsee-story-details-label-left\">{{\n tag.symbol\n }}</span>\n }\n <span class=\"rtsee-story-details-label-right\">{{\n tag.name\n }}</span>\n </p-chip>\n }\n </div>\n }\n\n <div class=\"rtsee-story-details-description-history\"></div>\n @if (story.isPublished && false) {\n <div class=\"rtsee-story-details-feedback\">\n <p>feedback here</p>\n </div>\n } @else if (messenger && story.discussion && false) {\n <div class=\"rtsee-story-details-votes\">\n <p class=\"rtsee-story-details-comments-label\">Comments</p>\n <rtsee-chat\n [messenger]=\"messenger\"\n [chatData]=\"story.discussion\"\n ></rtsee-chat>\n </div>\n }\n </div>\n</div>\n", dependencies: [{ kind: "component", type: Chip, selector: "p-chip", inputs: ["label", "icon", "image", "alt", "styleClass", "disabled", "removable", "removeIcon", "chipProps"], outputs: ["onRemove", "onImageError"] }, { kind: "component", type: Tag, selector: "p-tag", inputs: ["styleClass", "severity", "value", "icon", "rounded"] }, { kind: "component", type: Button, selector: "p-button", inputs: ["type", "iconPos", "icon", "badge", "label", "disabled", "loading", "loadingIcon", "raised", "rounded", "text", "plain", "severity", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "buttonProps", "autofocus", "fluid"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "component", type: ChatComponent, selector: "rtsee-chat", inputs: ["chat", "chatData", "entity", "messenger"] }, { kind: "component", type: RtseeEntityPreviewComponent, selector: "rtsee-entity-preview", inputs: ["entity", "messenger"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }] }); }
|
|
2962
3002
|
}
|
|
2963
3003
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: StoryDetailsComponent, decorators: [{
|
|
2964
3004
|
type: Component,
|
|
2965
|
-
args: [{ selector: 'rtsee-story-details', imports: [Chip, Tag, Button, ChatComponent, RtseeEntityPreviewComponent, RouterLink], template: "<div class=\"rtsee-story-details\">\n <section\n class=\"rtsee-story-details-cover\"\n [style.background-image]=\"'url(' + story.imageUrl + ')'\"\n >\n <button\n class=\"rtsee-story-details-btn-close\"\n [routerLink]=\"[presentation.homePage]\"\n (click)=\"presentation.closeStoryDetails()\"\n aria-label=\"Close\"\n >\n <span class=\"pi pi-times\"></span>\n </button>\n <div class=\"rtsee-story-details-cover-overlay\"></div>\n <div class=\"rtsee-story-details-cover-content\">\n <div class=\"rtsee-story-details-cover-badges\">\n @if (story.categories?.length) {\n @for (category of story.categories; track category.id) {\n <span class=\"rtsee-story-details-tag-pill\">\n {{ category.name }}\n </span>\n }\n }\n @if (story.tags?.length) {\n @for (tag of story.tags; track tag.id) {\n <span\n class=\"rtsee-story-details-tag-pill rtsee-story-details-tag-pill-label\"\n >\n @if (tag.symbol) {\n <span class=\"symbol\">{{ tag.symbol }}</span>\n }\n {{ tag.name }}\n </span>\n }\n }\n </div>\n\n <h1 class=\"rtsee-story-details-cover-title\">{{ story.name }}</h1>\n\n <div class=\"rtsee-story-details-cover-meta\">\n @if (story.rating !== null) {\n <div class=\"rtsee-story-details-cover-rating\">\n <span class=\"rtsee-story-details-stars\">\n @for (star of getStarArray(story.rating); track $index) {\n <span\n class=\"rtsee-story-details-star\"\n [class.rtsee-story-details-star-full]=\"star === 'full'\"\n [class.rtsee-story-details-star-half]=\"star === 'half'\"\n [class.rtsee-story-details-star-empty]=\"star === 'empty'\"\n >\n @if (star === \"full\") {\n \u2605\n } @else if (star === \"half\") {\n \u2605\n } @else {\n \u2606\n }\n </span>\n }\n </span>\n <span class=\"rtsee-story-details-rating-number\">{{\n story.rating\n }}</span>\n @if (story.ratesCount !== null) {\n <span class=\"rtsee-story-details-rating-count\"
|
|
3005
|
+
args: [{ selector: 'rtsee-story-details', imports: [Chip, Tag, Button, ChatComponent, RtseeEntityPreviewComponent, RouterLink], template: "<div class=\"rtsee-story-details\">\n <section\n class=\"rtsee-story-details-cover\"\n [style.background-image]=\"'url(' + story.imageUrl + ')'\"\n >\n <button\n class=\"rtsee-story-details-btn-close\"\n [routerLink]=\"[presentation.homePage]\"\n (click)=\"presentation.closeStoryDetails()\"\n aria-label=\"Close\"\n >\n <span class=\"pi pi-times\"></span>\n </button>\n <div class=\"rtsee-story-details-cover-overlay\"></div>\n <div class=\"rtsee-story-details-cover-content\">\n <div class=\"rtsee-story-details-cover-badges\">\n @if (story.categories?.length) {\n @for (category of story.categories; track category.id) {\n <span class=\"rtsee-story-details-tag-pill\">\n {{ category.name }}\n </span>\n }\n }\n @if (story.tags?.length) {\n @for (tag of story.tags; track tag.id) {\n <span\n class=\"rtsee-story-details-tag-pill rtsee-story-details-tag-pill-label\"\n >\n @if (tag.symbol) {\n <span class=\"symbol\">{{ tag.symbol }}</span>\n }\n {{ tag.name }}\n </span>\n }\n }\n </div>\n\n <h1 class=\"rtsee-story-details-cover-title\">{{ story.name }}</h1>\n\n <div class=\"rtsee-story-details-cover-meta\">\n @if (story.rating !== null) {\n <div class=\"rtsee-story-details-cover-rating\">\n <span class=\"rtsee-story-details-stars\">\n @for (star of getStarArray(story.rating); track $index) {\n <span\n class=\"rtsee-story-details-star\"\n [class.rtsee-story-details-star-full]=\"star === 'full'\"\n [class.rtsee-story-details-star-half]=\"star === 'half'\"\n [class.rtsee-story-details-star-empty]=\"star === 'empty'\"\n >\n @if (star === \"full\") {\n \u2605\n } @else if (star === \"half\") {\n \u2605\n } @else {\n \u2606\n }\n </span>\n }\n </span>\n <span class=\"rtsee-story-details-rating-number\">{{\n story.rating\n }}</span>\n @if (story.ratesCount !== null) {\n <span class=\"rtsee-story-details-rating-count\">\n <span>(</span>\n <span>{{ presentation.labels[RTSeeTextLabelKeys.FEEDBACKS_LABEL] }}:</span>\n <span> </span>\n <span>{{ story.ratesCount }}</span>\n <span>)</span>\n </span\n >\n }\n </div>\n }\n\n <div class=\"rtsee-story-details-cover-info-chips\">\n @if (story.averageReadTime) {\n <span class=\"rtsee-story-details-info-chip\">\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n width=\"14\"\n height=\"14\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n stroke=\"currentColor\"\n stroke-width=\"2\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n >\n <circle cx=\"12\" cy=\"12\" r=\"10\" />\n <polyline points=\"12 6 12 12 16 14\" />\n </svg>\n <span>\n <span>{{ Math.ceil(story.averageReadTime / 60) }}</span>\n <span> </span>\n <span>{{ presentation.labels[RTSeeTextLabelKeys.MINUTE_LABEL] }}</span>\n </span>\n </span>\n }\n @if (story.totalSlides) {\n <span class=\"rtsee-story-details-info-chip\">\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n width=\"14\"\n height=\"14\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n stroke=\"currentColor\"\n stroke-width=\"2\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n >\n <path d=\"M2 3h6a4 4 0 0 1 4 4v14a3 3 0 0 0-3-3H2z\" />\n <path d=\"M22 3h-6a4 4 0 0 0-4 4v14a3 3 0 0 1 3-3h7z\" />\n </svg>\n <span>\n <span>{{ presentation.labels[RTSeeTextLabelKeys.STORY_PAGES_LABEL] }}:</span>\n <span> </span>\n <span>{{ story.totalSlides }}</span>\n </span>\n </span>\n }\n </div>\n </div>\n </div>\n </section>\n\n <!-- CONTENT AREA -->\n <div class=\"rtsee-story-details-content-wrapper\">\n <div class=\"rtsee-story-details-cover-actions\">\n <p-button\n (click)=\"presentation.setActiveStory(story)\"\n [severity]=\"'primary'\"\n [label]=\"story.preselectedSlideNumber ? presentation.labels[RTSeeTextLabelKeys.CONTINUE_READING_BUTTON] : presentation.labels[RTSeeTextLabelKeys.START_READING_BUTTON]\"\n class=\"rtsee-story-details-start-reading rts-action-button\"\n >\n </p-button>\n </div>\n <div class=\"rtsee-story-details-content-grid\">\n <!-- Description Card -->\n <article class=\"rtsee-story-details-glass-card\">\n <div class=\"rtsee-story-details-glass-card-header\">\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n width=\"20\"\n height=\"20\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n stroke=\"currentColor\"\n stroke-width=\"2\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n >\n <path d=\"M2 3h6a4 4 0 0 1 4 4v14a3 3 0 0 0-3-3H2z\" />\n <path d=\"M22 3h-6a4 4 0 0 0-4 4v14a3 3 0 0 1 3-3h7z\" />\n </svg>\n <h2>{{presentation.labels[RTSeeTextLabelKeys.STORY_ABOUT_LABEL]}}</h2>\n </div>\n <p class=\"rtsee-story-details-glass-card-text\">\n {{ story.description }}\n </p>\n </article>\n </div>\n\n @if (messenger) {\n <rtsee-entity-preview\n [entity]=\"story\"\n [messenger]=\"messenger\"\n ></rtsee-entity-preview>\n }\n\n @if (story.categories?.length && false) {\n <div class=\"rtsee-story-details-categories\">\n @for (category of story.categories; track category.id) {\n <p-tag [value]=\"category.name\"></p-tag>\n }\n </div>\n }\n\n @if (story.tags?.length && false) {\n <div class=\"rtsee-story-details-labels\">\n @for (tag of story.tags; track tag.id) {\n <p-chip class=\"rtsee-story-details-label\">\n @if (tag.symbol) {\n <span class=\"rtsee-story-details-label-left\">{{\n tag.symbol\n }}</span>\n }\n <span class=\"rtsee-story-details-label-right\">{{\n tag.name\n }}</span>\n </p-chip>\n }\n </div>\n }\n\n <div class=\"rtsee-story-details-description-history\"></div>\n @if (story.isPublished && false) {\n <div class=\"rtsee-story-details-feedback\">\n <p>feedback here</p>\n </div>\n } @else if (messenger && story.discussion && false) {\n <div class=\"rtsee-story-details-votes\">\n <p class=\"rtsee-story-details-comments-label\">Comments</p>\n <rtsee-chat\n [messenger]=\"messenger\"\n [chatData]=\"story.discussion\"\n ></rtsee-chat>\n </div>\n }\n </div>\n</div>\n" }]
|
|
2966
3006
|
}], propDecorators: { story: [{
|
|
2967
3007
|
type: Input
|
|
2968
3008
|
}], presentation: [{
|
|
@@ -2981,7 +3021,7 @@ class PresentationComponent {
|
|
|
2981
3021
|
}
|
|
2982
3022
|
}
|
|
2983
3023
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PresentationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
2984
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", type: PresentationComponent, isStandalone: true, selector: "rtsee-presentation", inputs: { presentation: "presentation", messenger: "messenger" }, ngImport: i0, template: "<div class=\"rtsee-presentation\">\n <div class=\"rtsee-presentation-header-block\">\n <rtsee-presentation-header [presentation]=\"presentation\"\n ></rtsee-presentation-header>\n </div>\n\n @if (presentation.storyLoadInProgress) {\n <rtsee-preloader [diameter]=\"15\"></rtsee-preloader>\n }\n\n @if(presentation.isDashboardOpen && presentation.dashboard) {\n <rtsee-presentations-dashboard [dashboard]=\"presentation.dashboard\"\n ></rtsee-presentations-dashboard>\n }\n\n @if (presentation.settings.isExpanded) {\n <rtsee-presentation-settings [settings]=\"presentation.settings\"\n [presentation]=\"presentation\"\n ></rtsee-presentation-settings>\n }\n\n @if (presentation.isCategoriesListVisible && !presentation.storyLoadInProgress) {\n <div class=\"rtsee-presentation-categories-list\">\n @if (presentation.categoriesLoadInProgress) {\n <rtsee-preloader [diameter]=\"15\"></rtsee-preloader>\n }\n\n @if (presentation.activeSessionsStories.length) {\n <div class=\"rtsee-presentation-category-header\">\n <h2 class=\"rtsee-presentation-category-name\">{{presentation.labels[RTSeeTextLabelKeys.CONTINUE_SESSIONS_LABEL]}}</h2>\n </div>\n <div class=\"rtsee-presentation-stories-list\">\n @for (story of presentation.activeSessionsStories; track story.id) {\n <div class=\"rtsee-presentation-story-thumbnail-container\"\n (click)=\"onStoryThumbnailClicked(story)\"\n >\n <rtsee-story-thumbnail\n [story]=\"story\"\n [presentation]=\"presentation\"\n ></rtsee-story-thumbnail>\n </div>\n }\n </div>\n }\n\n @for (category of presentation.categories; track category.id) {\n <div class=\"rtsee-presentation-category-header\">\n <h2 class=\"rtsee-presentation-category-name\">{{ category.name }}</h2>\n <span class=\"rtsee-presentation-category-description\">{{ category.description }}</span>\n </div>\n <div class=\"rtsee-presentation-stories-list\">\n @for (story of category.stories; track story.id) {\n <div class=\"rtsee-presentation-story-thumbnail-container\"\n (click)=\"onStoryThumbnailClicked(story)\"\n >\n <rtsee-story-thumbnail\n [story]=\"story\"\n [presentation]=\"presentation\"\n ></rtsee-story-thumbnail>\n </div>\n }\n </div>\n }\n </div>\n }\n\n @if (presentation.activeStory && !presentation.isDashboardOpen) {\n <div class=\"rtsee-presentation-story-viewer-container\">\n <rtsee-story-player [story]=\"presentation.activeStory\"\n [settings]=\"presentation.settings\"\n ></rtsee-story-player>\n </div>\n } @else if (presentation.openedStoryDetails && !presentation.isDashboardOpen) {\n <rtsee-story-details [story]=\"presentation.openedStoryDetails\"\n [presentation]=\"presentation\"\n [messenger]=\"messenger\"\n ></rtsee-story-details>\n }\n</div>\n", dependencies: [{ kind: "component", type: PresentationHeaderComponent, selector: "rtsee-presentation-header", inputs: ["presentation"] }, { kind: "component", type: StoryThumbnailComponent, selector: "rtsee-story-thumbnail", inputs: ["story", "presentation"] }, { kind: "component", type: StoryPlayerComponent, selector: "rtsee-story-player", inputs: ["story", "settings"] }, { kind: "component", type: PreloaderComponent, selector: "rtsee-preloader", inputs: ["diameter", "color"] }, { kind: "component", type: PresentationsDashboardComponent, selector: "rtsee-presentations-dashboard", inputs: ["dashboard"] }, { kind: "component", type: PresentationSettingsComponent, selector: "rtsee-presentation-settings", inputs: ["settings", "presentation"] }, { kind: "component", type: StoryDetailsComponent, selector: "rtsee-story-details", inputs: ["story", "presentation", "messenger"] }] }); }
|
|
3024
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", type: PresentationComponent, isStandalone: true, selector: "rtsee-presentation", inputs: { presentation: "presentation", messenger: "messenger" }, ngImport: i0, template: "<div class=\"rtsee-presentation\">\n <div class=\"rtsee-presentation-header-block\">\n <rtsee-presentation-header [presentation]=\"presentation\"\n ></rtsee-presentation-header>\n </div>\n\n @if (presentation.storyLoadInProgress) {\n <rtsee-preloader [diameter]=\"15\"></rtsee-preloader>\n }\n\n @if(presentation.isDashboardOpen && presentation.dashboard) {\n <rtsee-presentations-dashboard [dashboard]=\"presentation.dashboard\"\n ></rtsee-presentations-dashboard>\n }\n\n @if (presentation.settings.isExpanded) {\n <rtsee-presentation-settings [settings]=\"presentation.settings\"\n [presentation]=\"presentation\"\n ></rtsee-presentation-settings>\n }\n\n @if (presentation.isCategoriesListVisible && !presentation.storyLoadInProgress) {\n <div class=\"rtsee-presentation-categories-list\">\n @if (presentation.categoriesLoadInProgress) {\n <rtsee-preloader [diameter]=\"15\"></rtsee-preloader>\n }\n\n @if (presentation.activeSessionsStories.length) {\n <div class=\"rtsee-presentation-category-header\">\n <h2 class=\"rtsee-presentation-category-name\">{{presentation.labels[RTSeeTextLabelKeys.CONTINUE_SESSIONS_LABEL]}}</h2>\n </div>\n <div class=\"rtsee-presentation-stories-list\">\n @for (story of presentation.activeSessionsStories; track story.id) {\n <div class=\"rtsee-presentation-story-thumbnail-container\"\n (click)=\"onStoryThumbnailClicked(story)\"\n >\n <rtsee-story-thumbnail\n [story]=\"story\"\n [presentation]=\"presentation\"\n ></rtsee-story-thumbnail>\n </div>\n }\n </div>\n }\n\n @for (category of presentation.categories; track category.id) {\n <div class=\"rtsee-presentation-category-header\">\n <h2 class=\"rtsee-presentation-category-name\">{{ category.name }}</h2>\n <span class=\"rtsee-presentation-category-description\">{{ category.description }}</span>\n </div>\n <div class=\"rtsee-presentation-stories-list\">\n @for (story of category.stories; track story.id) {\n <div class=\"rtsee-presentation-story-thumbnail-container\"\n (click)=\"onStoryThumbnailClicked(story)\"\n >\n <rtsee-story-thumbnail\n [story]=\"story\"\n [presentation]=\"presentation\"\n ></rtsee-story-thumbnail>\n </div>\n }\n </div>\n }\n </div>\n }\n\n @if (presentation.activeStory && !presentation.isDashboardOpen) {\n <div class=\"rtsee-presentation-story-viewer-container\">\n <rtsee-story-player [story]=\"presentation.activeStory\"\n [settings]=\"presentation.settings\"\n [presentation]=\"presentation\"\n ></rtsee-story-player>\n </div>\n } @else if (presentation.openedStoryDetails && !presentation.isDashboardOpen) {\n <rtsee-story-details [story]=\"presentation.openedStoryDetails\"\n [presentation]=\"presentation\"\n [messenger]=\"messenger\"\n ></rtsee-story-details>\n }\n</div>\n", dependencies: [{ kind: "component", type: PresentationHeaderComponent, selector: "rtsee-presentation-header", inputs: ["presentation"] }, { kind: "component", type: StoryThumbnailComponent, selector: "rtsee-story-thumbnail", inputs: ["story", "presentation"] }, { kind: "component", type: StoryPlayerComponent, selector: "rtsee-story-player", inputs: ["story", "settings", "presentation"] }, { kind: "component", type: PreloaderComponent, selector: "rtsee-preloader", inputs: ["diameter", "color"] }, { kind: "component", type: PresentationsDashboardComponent, selector: "rtsee-presentations-dashboard", inputs: ["dashboard"] }, { kind: "component", type: PresentationSettingsComponent, selector: "rtsee-presentation-settings", inputs: ["settings", "presentation"] }, { kind: "component", type: StoryDetailsComponent, selector: "rtsee-story-details", inputs: ["story", "presentation", "messenger"] }] }); }
|
|
2985
3025
|
}
|
|
2986
3026
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PresentationComponent, decorators: [{
|
|
2987
3027
|
type: Component,
|
|
@@ -2994,7 +3034,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImpor
|
|
|
2994
3034
|
PresentationsDashboardComponent,
|
|
2995
3035
|
PresentationSettingsComponent,
|
|
2996
3036
|
StoryDetailsComponent,
|
|
2997
|
-
], standalone: true, template: "<div class=\"rtsee-presentation\">\n <div class=\"rtsee-presentation-header-block\">\n <rtsee-presentation-header [presentation]=\"presentation\"\n ></rtsee-presentation-header>\n </div>\n\n @if (presentation.storyLoadInProgress) {\n <rtsee-preloader [diameter]=\"15\"></rtsee-preloader>\n }\n\n @if(presentation.isDashboardOpen && presentation.dashboard) {\n <rtsee-presentations-dashboard [dashboard]=\"presentation.dashboard\"\n ></rtsee-presentations-dashboard>\n }\n\n @if (presentation.settings.isExpanded) {\n <rtsee-presentation-settings [settings]=\"presentation.settings\"\n [presentation]=\"presentation\"\n ></rtsee-presentation-settings>\n }\n\n @if (presentation.isCategoriesListVisible && !presentation.storyLoadInProgress) {\n <div class=\"rtsee-presentation-categories-list\">\n @if (presentation.categoriesLoadInProgress) {\n <rtsee-preloader [diameter]=\"15\"></rtsee-preloader>\n }\n\n @if (presentation.activeSessionsStories.length) {\n <div class=\"rtsee-presentation-category-header\">\n <h2 class=\"rtsee-presentation-category-name\">{{presentation.labels[RTSeeTextLabelKeys.CONTINUE_SESSIONS_LABEL]}}</h2>\n </div>\n <div class=\"rtsee-presentation-stories-list\">\n @for (story of presentation.activeSessionsStories; track story.id) {\n <div class=\"rtsee-presentation-story-thumbnail-container\"\n (click)=\"onStoryThumbnailClicked(story)\"\n >\n <rtsee-story-thumbnail\n [story]=\"story\"\n [presentation]=\"presentation\"\n ></rtsee-story-thumbnail>\n </div>\n }\n </div>\n }\n\n @for (category of presentation.categories; track category.id) {\n <div class=\"rtsee-presentation-category-header\">\n <h2 class=\"rtsee-presentation-category-name\">{{ category.name }}</h2>\n <span class=\"rtsee-presentation-category-description\">{{ category.description }}</span>\n </div>\n <div class=\"rtsee-presentation-stories-list\">\n @for (story of category.stories; track story.id) {\n <div class=\"rtsee-presentation-story-thumbnail-container\"\n (click)=\"onStoryThumbnailClicked(story)\"\n >\n <rtsee-story-thumbnail\n [story]=\"story\"\n [presentation]=\"presentation\"\n ></rtsee-story-thumbnail>\n </div>\n }\n </div>\n }\n </div>\n }\n\n @if (presentation.activeStory && !presentation.isDashboardOpen) {\n <div class=\"rtsee-presentation-story-viewer-container\">\n <rtsee-story-player [story]=\"presentation.activeStory\"\n [settings]=\"presentation.settings\"\n ></rtsee-story-player>\n </div>\n } @else if (presentation.openedStoryDetails && !presentation.isDashboardOpen) {\n <rtsee-story-details [story]=\"presentation.openedStoryDetails\"\n [presentation]=\"presentation\"\n [messenger]=\"messenger\"\n ></rtsee-story-details>\n }\n</div>\n" }]
|
|
3037
|
+
], standalone: true, template: "<div class=\"rtsee-presentation\">\n <div class=\"rtsee-presentation-header-block\">\n <rtsee-presentation-header [presentation]=\"presentation\"\n ></rtsee-presentation-header>\n </div>\n\n @if (presentation.storyLoadInProgress) {\n <rtsee-preloader [diameter]=\"15\"></rtsee-preloader>\n }\n\n @if(presentation.isDashboardOpen && presentation.dashboard) {\n <rtsee-presentations-dashboard [dashboard]=\"presentation.dashboard\"\n ></rtsee-presentations-dashboard>\n }\n\n @if (presentation.settings.isExpanded) {\n <rtsee-presentation-settings [settings]=\"presentation.settings\"\n [presentation]=\"presentation\"\n ></rtsee-presentation-settings>\n }\n\n @if (presentation.isCategoriesListVisible && !presentation.storyLoadInProgress) {\n <div class=\"rtsee-presentation-categories-list\">\n @if (presentation.categoriesLoadInProgress) {\n <rtsee-preloader [diameter]=\"15\"></rtsee-preloader>\n }\n\n @if (presentation.activeSessionsStories.length) {\n <div class=\"rtsee-presentation-category-header\">\n <h2 class=\"rtsee-presentation-category-name\">{{presentation.labels[RTSeeTextLabelKeys.CONTINUE_SESSIONS_LABEL]}}</h2>\n </div>\n <div class=\"rtsee-presentation-stories-list\">\n @for (story of presentation.activeSessionsStories; track story.id) {\n <div class=\"rtsee-presentation-story-thumbnail-container\"\n (click)=\"onStoryThumbnailClicked(story)\"\n >\n <rtsee-story-thumbnail\n [story]=\"story\"\n [presentation]=\"presentation\"\n ></rtsee-story-thumbnail>\n </div>\n }\n </div>\n }\n\n @for (category of presentation.categories; track category.id) {\n <div class=\"rtsee-presentation-category-header\">\n <h2 class=\"rtsee-presentation-category-name\">{{ category.name }}</h2>\n <span class=\"rtsee-presentation-category-description\">{{ category.description }}</span>\n </div>\n <div class=\"rtsee-presentation-stories-list\">\n @for (story of category.stories; track story.id) {\n <div class=\"rtsee-presentation-story-thumbnail-container\"\n (click)=\"onStoryThumbnailClicked(story)\"\n >\n <rtsee-story-thumbnail\n [story]=\"story\"\n [presentation]=\"presentation\"\n ></rtsee-story-thumbnail>\n </div>\n }\n </div>\n }\n </div>\n }\n\n @if (presentation.activeStory && !presentation.isDashboardOpen) {\n <div class=\"rtsee-presentation-story-viewer-container\">\n <rtsee-story-player [story]=\"presentation.activeStory\"\n [settings]=\"presentation.settings\"\n [presentation]=\"presentation\"\n ></rtsee-story-player>\n </div>\n } @else if (presentation.openedStoryDetails && !presentation.isDashboardOpen) {\n <rtsee-story-details [story]=\"presentation.openedStoryDetails\"\n [presentation]=\"presentation\"\n [messenger]=\"messenger\"\n ></rtsee-story-details>\n }\n</div>\n" }]
|
|
2998
3038
|
}], ctorParameters: () => [], propDecorators: { presentation: [{
|
|
2999
3039
|
type: Input
|
|
3000
3040
|
}], messenger: [{
|
|
@@ -3098,7 +3138,7 @@ class RTSeeContainerComponent {
|
|
|
3098
3138
|
this.isSidenavFullScreen = rtseeRoute.fullScreen || false;
|
|
3099
3139
|
}
|
|
3100
3140
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: RTSeeContainerComponent, deps: [{ token: RTSeeAuthService }, { token: i2.Router }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
3101
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", type: RTSeeContainerComponent, isStandalone: true, selector: "rtsee-container", inputs: { rtsee: "rtsee", navigationConfig: "navigationConfig", auth: "auth" }, ngImport: i0, template: "<div class=\"rtsee-shell\"\n [ngClass]=\"{\n 'rtsee-shell-conference-mode': rtsee.conference && rtsee.conference.isInActiveCall,\n 'rtsee-shell-messenger-active': rtsee.messenger && rtsee.activeTab === 'messenger',\n 'rtsee-shell-dashboard-active': rtsee.eventsDashboard && rtsee.activeTab === 'events-dashboard',\n 'rtsee-shell-presentation-active': rtsee.presentation && rtsee.activeTab === 'presentation',\n 'rtsee-shell-side-nav-expanded': isSidenavExpanded,\n 'rtsee-shell-side-nav-is-content': isSidenavContent,\n 'rtsee-shell-side-nav-full-screen': isSidenavFullScreen\n }\"\n>\n <div class=\"rtsee-nav-block\">\n <rtsee-nav [config]=\"navigationConfig\" [rtsee]=\"rtsee\"></rtsee-nav>\n </div>\n\n <div class=\"rtsee-shell-panel\">\n <div class=\"rtsee-shell-panel-inner\">\n @if (rtsee.conference && rtsee.conference.isInActiveCall) {\n <div class=\"rtsee-conference-container\">\n <rtsee-conference [rtSee]=\"rtsee.conference\"\n ></rtsee-conference>\n </div>\n }\n\n @if (rtsee.messenger) {\n <div class=\"rtsee-messenger-container\">\n <rtsee-messenger [messenger]=\"rtsee.messenger\"\n ></rtsee-messenger>\n </div>\n }\n\n @if (rtsee.eventsDashboard && rtsee.eventsDashboard.isReady) {\n <div class=\"rtsee-events-dashboard-container\">\n <rtsee-events-dashboard [eventsDashboard]=\"rtsee.eventsDashboard\"\n ></rtsee-events-dashboard>\n </div>\n }\n\n @if (rtsee.presentation && rtsee.presentation.isActive) {\n <div class=\"rtsee-presentation-container\">\n <rtsee-presentation [presentation]=\"rtsee.presentation\"\n [messenger]=\"rtsee.messenger\"\n ></rtsee-presentation>\n </div>\n }\n </div>\n </div>\n\n <div class=\"rtsee-content\">\n <ng-content></ng-content>\n </div>\n</div>\n", dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: RTSeeConferenceComponent, selector: "rtsee-conference", inputs: ["rtSee"] }, { kind: "component", type: MessengerComponent, selector: "rtsee-messenger", inputs: ["messenger"] }, { kind: "component", type: RtseeEventsDashboardComponent, selector: "rtsee-events-dashboard", inputs: ["eventsDashboard"] }, { kind: "component", type: PresentationComponent, selector: "rtsee-presentation", inputs: ["presentation", "messenger"] }, { kind: "component", type: RtseeNavComponent, selector: "rtsee-nav", inputs: ["config", "rtsee"] }] }); }
|
|
3141
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", type: RTSeeContainerComponent, isStandalone: true, selector: "rtsee-container", inputs: { rtsee: "rtsee", navigationConfig: "navigationConfig", auth: "auth" }, ngImport: i0, template: "<div class=\"rtsee-shell\"\n [ngClass]=\"{\n 'rtsee-shell-conference-mode': rtsee.conference && rtsee.conference.isInActiveCall,\n 'rtsee-shell-messenger-active': rtsee.messenger && rtsee.activeTab === 'messenger',\n 'rtsee-shell-dashboard-active': rtsee.eventsDashboard && rtsee.activeTab === 'events-dashboard',\n 'rtsee-shell-presentation-active': rtsee.presentation && rtsee.activeTab === 'presentation',\n 'rtsee-shell-side-nav-expanded': isSidenavExpanded,\n 'rtsee-shell-side-nav-is-content': isSidenavContent,\n 'rtsee-shell-side-nav-full-screen': isSidenavFullScreen,\n 'rtsee-lang-eng': rtsee.messenger && rtsee.messenger.currentLanguage === 'eng',\n 'rtsee-lang-ua': rtsee.messenger && rtsee.messenger.currentLanguage === 'ua'\n }\"\n>\n <div class=\"rtsee-nav-block\">\n <rtsee-nav [config]=\"navigationConfig\" [rtsee]=\"rtsee\"></rtsee-nav>\n </div>\n\n <div class=\"rtsee-shell-panel\">\n <div class=\"rtsee-shell-panel-inner\">\n @if (rtsee.conference && rtsee.conference.isInActiveCall) {\n <div class=\"rtsee-conference-container\">\n <rtsee-conference [rtSee]=\"rtsee.conference\"\n ></rtsee-conference>\n </div>\n }\n\n @if (rtsee.messenger) {\n <div class=\"rtsee-messenger-container\">\n <rtsee-messenger [messenger]=\"rtsee.messenger\"\n ></rtsee-messenger>\n </div>\n }\n\n @if (rtsee.eventsDashboard && rtsee.eventsDashboard.isReady) {\n <div class=\"rtsee-events-dashboard-container\">\n <rtsee-events-dashboard [eventsDashboard]=\"rtsee.eventsDashboard\"\n ></rtsee-events-dashboard>\n </div>\n }\n\n @if (rtsee.presentation && rtsee.presentation.isActive) {\n <div class=\"rtsee-presentation-container\">\n <rtsee-presentation [presentation]=\"rtsee.presentation\"\n [messenger]=\"rtsee.messenger\"\n ></rtsee-presentation>\n </div>\n }\n </div>\n </div>\n\n <div class=\"rtsee-content\">\n <ng-content></ng-content>\n </div>\n</div>\n", dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: RTSeeConferenceComponent, selector: "rtsee-conference", inputs: ["rtSee"] }, { kind: "component", type: MessengerComponent, selector: "rtsee-messenger", inputs: ["messenger"] }, { kind: "component", type: RtseeEventsDashboardComponent, selector: "rtsee-events-dashboard", inputs: ["eventsDashboard"] }, { kind: "component", type: PresentationComponent, selector: "rtsee-presentation", inputs: ["presentation", "messenger"] }, { kind: "component", type: RtseeNavComponent, selector: "rtsee-nav", inputs: ["config", "rtsee"] }] }); }
|
|
3102
3142
|
}
|
|
3103
3143
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: RTSeeContainerComponent, decorators: [{
|
|
3104
3144
|
type: Component,
|
|
@@ -3109,7 +3149,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImpor
|
|
|
3109
3149
|
RtseeEventsDashboardComponent,
|
|
3110
3150
|
PresentationComponent,
|
|
3111
3151
|
RtseeNavComponent,
|
|
3112
|
-
], standalone: true, template: "<div class=\"rtsee-shell\"\n [ngClass]=\"{\n 'rtsee-shell-conference-mode': rtsee.conference && rtsee.conference.isInActiveCall,\n 'rtsee-shell-messenger-active': rtsee.messenger && rtsee.activeTab === 'messenger',\n 'rtsee-shell-dashboard-active': rtsee.eventsDashboard && rtsee.activeTab === 'events-dashboard',\n 'rtsee-shell-presentation-active': rtsee.presentation && rtsee.activeTab === 'presentation',\n 'rtsee-shell-side-nav-expanded': isSidenavExpanded,\n 'rtsee-shell-side-nav-is-content': isSidenavContent,\n 'rtsee-shell-side-nav-full-screen': isSidenavFullScreen\n }\"\n>\n <div class=\"rtsee-nav-block\">\n <rtsee-nav [config]=\"navigationConfig\" [rtsee]=\"rtsee\"></rtsee-nav>\n </div>\n\n <div class=\"rtsee-shell-panel\">\n <div class=\"rtsee-shell-panel-inner\">\n @if (rtsee.conference && rtsee.conference.isInActiveCall) {\n <div class=\"rtsee-conference-container\">\n <rtsee-conference [rtSee]=\"rtsee.conference\"\n ></rtsee-conference>\n </div>\n }\n\n @if (rtsee.messenger) {\n <div class=\"rtsee-messenger-container\">\n <rtsee-messenger [messenger]=\"rtsee.messenger\"\n ></rtsee-messenger>\n </div>\n }\n\n @if (rtsee.eventsDashboard && rtsee.eventsDashboard.isReady) {\n <div class=\"rtsee-events-dashboard-container\">\n <rtsee-events-dashboard [eventsDashboard]=\"rtsee.eventsDashboard\"\n ></rtsee-events-dashboard>\n </div>\n }\n\n @if (rtsee.presentation && rtsee.presentation.isActive) {\n <div class=\"rtsee-presentation-container\">\n <rtsee-presentation [presentation]=\"rtsee.presentation\"\n [messenger]=\"rtsee.messenger\"\n ></rtsee-presentation>\n </div>\n }\n </div>\n </div>\n\n <div class=\"rtsee-content\">\n <ng-content></ng-content>\n </div>\n</div>\n" }]
|
|
3152
|
+
], standalone: true, template: "<div class=\"rtsee-shell\"\n [ngClass]=\"{\n 'rtsee-shell-conference-mode': rtsee.conference && rtsee.conference.isInActiveCall,\n 'rtsee-shell-messenger-active': rtsee.messenger && rtsee.activeTab === 'messenger',\n 'rtsee-shell-dashboard-active': rtsee.eventsDashboard && rtsee.activeTab === 'events-dashboard',\n 'rtsee-shell-presentation-active': rtsee.presentation && rtsee.activeTab === 'presentation',\n 'rtsee-shell-side-nav-expanded': isSidenavExpanded,\n 'rtsee-shell-side-nav-is-content': isSidenavContent,\n 'rtsee-shell-side-nav-full-screen': isSidenavFullScreen,\n 'rtsee-lang-eng': rtsee.messenger && rtsee.messenger.currentLanguage === 'eng',\n 'rtsee-lang-ua': rtsee.messenger && rtsee.messenger.currentLanguage === 'ua'\n }\"\n>\n <div class=\"rtsee-nav-block\">\n <rtsee-nav [config]=\"navigationConfig\" [rtsee]=\"rtsee\"></rtsee-nav>\n </div>\n\n <div class=\"rtsee-shell-panel\">\n <div class=\"rtsee-shell-panel-inner\">\n @if (rtsee.conference && rtsee.conference.isInActiveCall) {\n <div class=\"rtsee-conference-container\">\n <rtsee-conference [rtSee]=\"rtsee.conference\"\n ></rtsee-conference>\n </div>\n }\n\n @if (rtsee.messenger) {\n <div class=\"rtsee-messenger-container\">\n <rtsee-messenger [messenger]=\"rtsee.messenger\"\n ></rtsee-messenger>\n </div>\n }\n\n @if (rtsee.eventsDashboard && rtsee.eventsDashboard.isReady) {\n <div class=\"rtsee-events-dashboard-container\">\n <rtsee-events-dashboard [eventsDashboard]=\"rtsee.eventsDashboard\"\n ></rtsee-events-dashboard>\n </div>\n }\n\n @if (rtsee.presentation && rtsee.presentation.isActive) {\n <div class=\"rtsee-presentation-container\">\n <rtsee-presentation [presentation]=\"rtsee.presentation\"\n [messenger]=\"rtsee.messenger\"\n ></rtsee-presentation>\n </div>\n }\n </div>\n </div>\n\n <div class=\"rtsee-content\">\n <ng-content></ng-content>\n </div>\n</div>\n" }]
|
|
3113
3153
|
}], ctorParameters: () => [{ type: RTSeeAuthService }, { type: i2.Router }], propDecorators: { rtsee: [{
|
|
3114
3154
|
type: Input
|
|
3115
3155
|
}], navigationConfig: [{
|
|
@@ -4296,7 +4336,6 @@ class RTSeeModule {
|
|
|
4296
4336
|
StoryPlayerComponent,
|
|
4297
4337
|
SlideComponent,
|
|
4298
4338
|
PresentationHeaderComponent,
|
|
4299
|
-
PaymentProductSnippetComponent,
|
|
4300
4339
|
CommonModule,
|
|
4301
4340
|
ReactiveFormsModule,
|
|
4302
4341
|
AutosizeModule,
|