@rtsee/ngx 0.0.121 → 0.0.122
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.
|
@@ -1603,6 +1603,80 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImpor
|
|
|
1603
1603
|
type: Output
|
|
1604
1604
|
}] } });
|
|
1605
1605
|
|
|
1606
|
+
class InviteLinkComponent {
|
|
1607
|
+
constructor() {
|
|
1608
|
+
this.inviteUrl = '';
|
|
1609
|
+
this.disclaimer = '';
|
|
1610
|
+
this.copied = false;
|
|
1611
|
+
this.loading = false;
|
|
1612
|
+
this.RTSeeTextLabelKeys = RTSeeTextLabelKeys;
|
|
1613
|
+
}
|
|
1614
|
+
async ngOnInit() {
|
|
1615
|
+
if (!this.inviteUrl && this.messenger) {
|
|
1616
|
+
await this.loadInviteLink();
|
|
1617
|
+
}
|
|
1618
|
+
}
|
|
1619
|
+
async loadInviteLink() {
|
|
1620
|
+
if (!this.messenger)
|
|
1621
|
+
return;
|
|
1622
|
+
this.loading = true;
|
|
1623
|
+
try {
|
|
1624
|
+
const result = await this.messenger.remoteActions.getChatInvitationLink.send({
|
|
1625
|
+
chatId: this.chatId,
|
|
1626
|
+
});
|
|
1627
|
+
if (result?.invitationLink) {
|
|
1628
|
+
this.inviteUrl = result.invitationLink;
|
|
1629
|
+
}
|
|
1630
|
+
}
|
|
1631
|
+
catch (e) {
|
|
1632
|
+
console.log('Failed to fetch chat invitation link', e);
|
|
1633
|
+
}
|
|
1634
|
+
finally {
|
|
1635
|
+
this.loading = false;
|
|
1636
|
+
}
|
|
1637
|
+
}
|
|
1638
|
+
async copyToClipboard() {
|
|
1639
|
+
const targetChat = this.chatId
|
|
1640
|
+
? this.messenger?.getChatById?.(this.chatId) || this.messenger?.openedChat
|
|
1641
|
+
: this.messenger?.openedChat;
|
|
1642
|
+
this.messenger?.trackChatMemberInviteClicked?.(targetChat, this.inviteUrl);
|
|
1643
|
+
try {
|
|
1644
|
+
await navigator.clipboard.writeText(this.inviteUrl);
|
|
1645
|
+
this.copied = true;
|
|
1646
|
+
setTimeout(() => {
|
|
1647
|
+
this.copied = false;
|
|
1648
|
+
}, 2000);
|
|
1649
|
+
}
|
|
1650
|
+
catch {
|
|
1651
|
+
// Fallback for older browsers
|
|
1652
|
+
const textArea = document.createElement('textarea');
|
|
1653
|
+
textArea.value = this.inviteUrl;
|
|
1654
|
+
document.body.appendChild(textArea);
|
|
1655
|
+
textArea.select();
|
|
1656
|
+
document.execCommand('copy');
|
|
1657
|
+
document.body.removeChild(textArea);
|
|
1658
|
+
this.copied = true;
|
|
1659
|
+
setTimeout(() => {
|
|
1660
|
+
this.copied = false;
|
|
1661
|
+
}, 2000);
|
|
1662
|
+
}
|
|
1663
|
+
}
|
|
1664
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: InviteLinkComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1665
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", type: InviteLinkComponent, isStandalone: true, selector: "rtsee-invite-link", inputs: { inviteUrl: "inviteUrl", chatId: "chatId", messenger: "messenger", disclaimer: "disclaimer" }, ngImport: i0, template: "<div class=\"rts-invite-link\">\n <div class=\"rts-invite-link-info\">\n <span class=\"rts-invite-link-icon material-icons-outlined\">link</span>\n <div class=\"rts-invite-link-info-text\">\n <h4>{{ messenger?.labels?.[RTSeeTextLabelKeys.MESSENGER_INVITE_LINK_TITLE] || 'Invite Link' }}</h4>\n <p>{{ disclaimer || (chatId ? messenger?.labels?.[RTSeeTextLabelKeys.MESSENGER_INVITE_LINK_DISCLAIMER] : messenger?.labels?.[RTSeeTextLabelKeys.MESSENGER_INVITE_USER_DISCLAIMER]) || 'Anyone who opens this link can join the chat.' }}</p>\n </div>\n </div>\n\n @if (loading) {\n <div class=\"rts-invite-link-loading\">\n <span class=\"material-icons-outlined rts-spin-icon\">autorenew</span>\n <span>{{ messenger?.labels?.[RTSeeTextLabelKeys.MESSENGER_INVITE_LINK_GENERATING] || 'Generating invite link...' }}</span>\n </div>\n } @else {\n <div class=\"rts-invite-link-url-container\">\n <p-inputgroup>\n <input pInputText\n [value]=\"inviteUrl\"\n readonly\n class=\"rts-invite-link-url-input\"\n />\n <p-button [icon]=\"copied ? 'pi pi-check' : 'pi pi-copy'\"\n [severity]=\"copied ? 'success' : 'primary'\"\n (click)=\"copyToClipboard()\"\n [label]=\"copied ? (messenger?.labels?.[RTSeeTextLabelKeys.MESSENGER_COPIED_BUTTON] || 'Copied!') : (messenger?.labels?.[RTSeeTextLabelKeys.MESSENGER_COPY_BUTTON] || 'Copy')\"\n />\n </p-inputgroup>\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: "directive", type: InputText, selector: "[pInputText]", inputs: ["pSize", "variant", "fluid", "invalid"] }, { kind: "component", type: InputGroup, selector: "p-inputgroup, p-inputGroup, p-input-group", inputs: ["styleClass"] }] }); }
|
|
1666
|
+
}
|
|
1667
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: InviteLinkComponent, decorators: [{
|
|
1668
|
+
type: Component,
|
|
1669
|
+
args: [{ selector: 'rtsee-invite-link', standalone: true, imports: [Button, InputText, InputGroup], template: "<div class=\"rts-invite-link\">\n <div class=\"rts-invite-link-info\">\n <span class=\"rts-invite-link-icon material-icons-outlined\">link</span>\n <div class=\"rts-invite-link-info-text\">\n <h4>{{ messenger?.labels?.[RTSeeTextLabelKeys.MESSENGER_INVITE_LINK_TITLE] || 'Invite Link' }}</h4>\n <p>{{ disclaimer || (chatId ? messenger?.labels?.[RTSeeTextLabelKeys.MESSENGER_INVITE_LINK_DISCLAIMER] : messenger?.labels?.[RTSeeTextLabelKeys.MESSENGER_INVITE_USER_DISCLAIMER]) || 'Anyone who opens this link can join the chat.' }}</p>\n </div>\n </div>\n\n @if (loading) {\n <div class=\"rts-invite-link-loading\">\n <span class=\"material-icons-outlined rts-spin-icon\">autorenew</span>\n <span>{{ messenger?.labels?.[RTSeeTextLabelKeys.MESSENGER_INVITE_LINK_GENERATING] || 'Generating invite link...' }}</span>\n </div>\n } @else {\n <div class=\"rts-invite-link-url-container\">\n <p-inputgroup>\n <input pInputText\n [value]=\"inviteUrl\"\n readonly\n class=\"rts-invite-link-url-input\"\n />\n <p-button [icon]=\"copied ? 'pi pi-check' : 'pi pi-copy'\"\n [severity]=\"copied ? 'success' : 'primary'\"\n (click)=\"copyToClipboard()\"\n [label]=\"copied ? (messenger?.labels?.[RTSeeTextLabelKeys.MESSENGER_COPIED_BUTTON] || 'Copied!') : (messenger?.labels?.[RTSeeTextLabelKeys.MESSENGER_COPY_BUTTON] || 'Copy')\"\n />\n </p-inputgroup>\n </div>\n }\n</div>\n" }]
|
|
1670
|
+
}], propDecorators: { inviteUrl: [{
|
|
1671
|
+
type: Input
|
|
1672
|
+
}], chatId: [{
|
|
1673
|
+
type: Input
|
|
1674
|
+
}], messenger: [{
|
|
1675
|
+
type: Input
|
|
1676
|
+
}], disclaimer: [{
|
|
1677
|
+
type: Input
|
|
1678
|
+
}] } });
|
|
1679
|
+
|
|
1606
1680
|
class DefaultImagesService {
|
|
1607
1681
|
constructor() {
|
|
1608
1682
|
this.PROFILE = 'https://werf-assets.s3.amazonaws.com/default-profile-logo.png';
|
|
@@ -1646,6 +1720,13 @@ class MessengerHeaderComponent {
|
|
|
1646
1720
|
this.isDropdownOpen = false;
|
|
1647
1721
|
this.messenger.openManageChatInfo();
|
|
1648
1722
|
}
|
|
1723
|
+
openInviteUserDialog() {
|
|
1724
|
+
this.isDropdownOpen = false;
|
|
1725
|
+
this.messenger.openInviteUser();
|
|
1726
|
+
}
|
|
1727
|
+
closeInviteUserDialog() {
|
|
1728
|
+
this.messenger.closeInviteUser();
|
|
1729
|
+
}
|
|
1649
1730
|
closeManageChatDialog() {
|
|
1650
1731
|
this.messenger.closeManageChatInfo();
|
|
1651
1732
|
}
|
|
@@ -1726,11 +1807,11 @@ class MessengerHeaderComponent {
|
|
|
1726
1807
|
this.defaultImagesService.PROFILE;
|
|
1727
1808
|
}
|
|
1728
1809
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: MessengerHeaderComponent, deps: [{ token: DefaultImagesService }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1729
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", type: MessengerHeaderComponent, isStandalone: true, selector: "rtsee-messenger-header", inputs: { messenger: "messenger" }, ngImport: i0, template: "<div class=\"rts-messenger-header\"\n [ngClass]=\"{\n 'rts-messenger-header-chat-opened': messenger.openedChat && !messenger.manageChatInfo,\n 'rts-chat-header-unread': messenger.openedChat && !messenger.unreadMessagesCount,\n 'rts-messenger-header-expanded': messenger.openedProfile || messenger.openedChatDetails || messenger.manageChatInfo,\n 'rts-messenger-header-create-chat-mode': messenger.manageChatInfo,\n 'rts-messenger-header-my-profile-mode': messenger.ownProfileOpened,\n 'rts-messenger-header-chat-info-mode': (messenger.openedProfile || messenger.openedChatDetails) && !messenger.ownProfileOpened && !messenger.manageChatInfo,\n 'rts-messenger-header-chat-image-expanded': imageExpandedToSquare,\n 'rts-messenger-header-image-square': imageExpandedToSquare\n }\"\n>\n <span class=\"rts-messenger-header-collapse-button\"\n (click)=\"messenger.manageChatInfo ? closeManageChatDialog() : collapseInfo()\"\n >\n <span class=\"pi pi-arrow-left\"></span>\n </span>\n <div class=\"rts-messenger-header-left\">\n @if (!messenger.openedChat && messenger.myPeer) {\n <div class=\"rts-messenger-header-avatar\"\n (click)=\"onMyAvatarClick()\"\n (dblclick)=\"onMyAvatarDblClick()\"\n >\n <div [style.background-image]=\"'url(' + myProfileImageUrl + ')'\"\n class=\"rts-messenger-header-avatar-image\">\n </div>\n </div>\n } @else if (messenger.openedChat) {\n <button class=\"rts-messenger-close-chat\"\n (click)=\"messenger.closeChat()\"\n >\n <span class=\"material-icons-outlined\">arrow_back</span>\n @if (messenger.unreadMessagesCount) {\n <span class=\"unread-count\">{{messenger.unreadMessagesCount}}</span>\n }\n </button>\n }\n </div>\n <div class=\"rts-messenger-header-right\">\n @if (messenger.openedChat) {\n <div class=\"rts-messenger-chat-image-container rts-messenger-header-avatar\"\n (click)=\"onChatImageClick()\"\n (dblclick)=\"onChatImageDblClick()\"\n >\n <div class=\"rts-messenger-chat-image rts-messenger-header-avatar-image\"\n [style.background-image]=\"'url(' + chatImageUrl + ')'\"\n ></div>\n </div>\n } @else {\n <div class=\"rts-messenger-header-actions\">\n <button class=\"rts-messenger-header-add-button\"\n (click)=\"toggleDropdown()\"\n >\n <span class=\"material-icons-outlined\">add</span>\n </button>\n\n @if (isDropdownOpen) {\n <div class=\"rts-messenger-header-dropdown-backdrop\"\n (click)=\"closeDropdown()\"\n ></div>\n <div class=\"rts-messenger-header-dropdown\">\n <button class=\"rts-messenger-header-dropdown-item\"\n (click)=\"openNewChatDialog()\"\n >\n <span class=\"material-icons-outlined rts-messenger-header-dropdown-icon\">chat_bubble_outline</span>\n <span>
|
|
1810
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", type: MessengerHeaderComponent, isStandalone: true, selector: "rtsee-messenger-header", inputs: { messenger: "messenger" }, ngImport: i0, template: "<div class=\"rts-messenger-header\"\n [ngClass]=\"{\n 'rts-messenger-header-chat-opened': messenger.openedChat && !messenger.manageChatInfo && !messenger.inviteUserOpened,\n 'rts-chat-header-unread': messenger.openedChat && !messenger.unreadMessagesCount,\n 'rts-messenger-header-expanded': messenger.openedProfile || messenger.openedChatDetails || messenger.manageChatInfo || messenger.inviteUserOpened,\n 'rts-messenger-header-create-chat-mode': messenger.manageChatInfo || messenger.inviteUserOpened,\n 'rts-messenger-header-my-profile-mode': messenger.ownProfileOpened,\n 'rts-messenger-header-chat-info-mode': (messenger.openedProfile || messenger.openedChatDetails) && !messenger.ownProfileOpened && !messenger.manageChatInfo && !messenger.inviteUserOpened,\n 'rts-messenger-header-chat-image-expanded': imageExpandedToSquare,\n 'rts-messenger-header-image-square': imageExpandedToSquare\n }\"\n>\n <span class=\"rts-messenger-header-collapse-button\"\n (click)=\"messenger.manageChatInfo ? closeManageChatDialog() : (messenger.inviteUserOpened ? closeInviteUserDialog() : collapseInfo())\"\n >\n <span class=\"pi pi-arrow-left\"></span>\n </span>\n <div class=\"rts-messenger-header-left\">\n @if (!messenger.openedChat && messenger.myPeer) {\n <div class=\"rts-messenger-header-avatar\"\n (click)=\"onMyAvatarClick()\"\n (dblclick)=\"onMyAvatarDblClick()\"\n >\n <div [style.background-image]=\"'url(' + myProfileImageUrl + ')'\"\n class=\"rts-messenger-header-avatar-image\">\n </div>\n </div>\n } @else if (messenger.openedChat) {\n <button class=\"rts-messenger-close-chat\"\n (click)=\"messenger.closeChat()\"\n >\n <span class=\"material-icons-outlined\">arrow_back</span>\n @if (messenger.unreadMessagesCount) {\n <span class=\"unread-count\">{{messenger.unreadMessagesCount}}</span>\n }\n </button>\n }\n </div>\n <div class=\"rts-messenger-header-right\">\n @if (messenger.openedChat) {\n <div class=\"rts-messenger-chat-image-container rts-messenger-header-avatar\"\n (click)=\"onChatImageClick()\"\n (dblclick)=\"onChatImageDblClick()\"\n >\n <div class=\"rts-messenger-chat-image rts-messenger-header-avatar-image\"\n [style.background-image]=\"'url(' + chatImageUrl + ')'\"\n ></div>\n </div>\n } @else {\n <div class=\"rts-messenger-header-actions\">\n <button class=\"rts-messenger-header-add-button\"\n (click)=\"toggleDropdown()\"\n >\n <span class=\"material-icons-outlined\">add</span>\n </button>\n\n @if (isDropdownOpen) {\n <div class=\"rts-messenger-header-dropdown-backdrop\"\n (click)=\"closeDropdown()\"\n ></div>\n <div class=\"rts-messenger-header-dropdown\">\n <button class=\"rts-messenger-header-dropdown-item\"\n (click)=\"openInviteUserDialog()\"\n >\n <span class=\"material-icons-outlined rts-messenger-header-dropdown-icon\">person_add</span>\n <span>{{ messenger.labels[RTSeeTextLabelKeys.MESSENGER_INVITE_USER_BUTTON] }}</span>\n </button>\n <button class=\"rts-messenger-header-dropdown-item\"\n (click)=\"openNewChatDialog()\"\n >\n <span class=\"material-icons-outlined rts-messenger-header-dropdown-icon\">chat_bubble_outline</span>\n <span>{{ messenger.labels[RTSeeTextLabelKeys.MESSENGER_NEW_CHAT_BUTTON] }}</span>\n </button>\n </div>\n }\n </div>\n }\n </div>\n <div class=\"rts-messenger-header-center\">\n @if (messenger.manageChatInfo) {\n <div class=\"rts-messenger-header-create-chat-container\">\n <rtsee-manage-chat-info [messenger]=\"messenger\"\n [chat]=\"messenger.manageChatInfo.chat || undefined\"\n (chatSaved)=\"onChatSaved($event)\"\n (cancelled)=\"closeManageChatDialog()\"\n ></rtsee-manage-chat-info>\n </div>\n } @else if (messenger.inviteUserOpened) {\n <div class=\"rts-messenger-header-create-chat-container rts-messenger-header-invite-user-container\">\n <div class=\"rts-create-chat\">\n <h3 class=\"rts-create-chat-title\">{{ messenger.labels[RTSeeTextLabelKeys.MESSENGER_INVITE_USER_BUTTON] }}</h3>\n <rtsee-invite-link [messenger]=\"messenger\"\n [disclaimer]=\"messenger.labels[RTSeeTextLabelKeys.MESSENGER_INVITE_USER_DISCLAIMER]\"\n ></rtsee-invite-link>\n </div>\n </div>\n } @else if (messenger.openedChat) {\n <div [ngClass]=\"{'rts-messenger-header-opened-chat-info-expanded': messenger.openedProfile || messenger.openedChatDetails}\"\n class=\"rts-messenger-header-opened-chat-info\">\n <div class=\"rts-messenger-profile-header-placeholder\">\n <p class=\"rts-messenger-header-chat-title\"\n >{{ headerTitle }}</p>\n </div>\n\n <div class=\"rts-messenger-profile-data-container\">\n @if (messenger.openedChatDetails && isGroupOrChannelChat && messenger.chatInfo) {\n <rtsee-chat-info [messenger]=\"messenger\"\n [chatInfo]=\"messenger.chatInfo\"\n (editChatInfo)=\"messenger.openManageChatInfo(messenger.openedChat)\"\n (chatDeleted)=\"messenger.closeChatInfo()\"\n ></rtsee-chat-info>\n } @else if (messenger.openedChatDetails || messenger.openedProfile) {\n <rtsee-profile [messenger]=\"messenger\"\n ></rtsee-profile>\n }\n </div>\n </div>\n } @else {\n @if (messenger.ownProfileOpened) {\n <div class=\"rts-messenger-header-opened-chat-info rts-messenger-header-opened-chat-info-expanded\">\n <div class=\"rts-messenger-profile-header-placeholder\">\n <p class=\"rts-messenger-header-chat-title\">{{ headerTitle }}</p>\n </div>\n <div class=\"rts-messenger-profile-data-container\">\n <rtsee-profile [messenger]=\"messenger\"\n [peer]=\"messenger.myPeer\"\n ></rtsee-profile>\n </div>\n </div>\n } @else {\n <p class=\"rts-messenger-header-title\"\n >{{messenger.labels[RTSeeTextLabelKeys.MESSANGER_TITLE]}}</p>\n <rtsee-profile [messenger]=\"messenger\"\n [peer]=\"messenger.myPeer\"\n ></rtsee-profile>\n }\n }\n </div>\n</div>\n", dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: ProfileComponent, selector: "rtsee-profile", inputs: ["messenger", "peer"] }, { kind: "component", type: ChatInfoComponent, selector: "rtsee-chat-info", inputs: ["messenger", "chatInfo"], outputs: ["editChatInfo", "chatDeleted"] }, { kind: "component", type: ManageChatInfoComponent, selector: "rtsee-manage-chat-info", inputs: ["messenger", "chat"], outputs: ["chatSaved", "cancelled"] }, { kind: "component", type: InviteLinkComponent, selector: "rtsee-invite-link", inputs: ["inviteUrl", "chatId", "messenger", "disclaimer"] }] }); }
|
|
1730
1811
|
}
|
|
1731
1812
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: MessengerHeaderComponent, decorators: [{
|
|
1732
1813
|
type: Component,
|
|
1733
|
-
args: [{ selector: 'rtsee-messenger-header', imports: [NgClass, ProfileComponent, ChatInfoComponent, ManageChatInfoComponent], standalone: true, template: "<div class=\"rts-messenger-header\"\n [ngClass]=\"{\n 'rts-messenger-header-chat-opened': messenger.openedChat && !messenger.manageChatInfo,\n 'rts-chat-header-unread': messenger.openedChat && !messenger.unreadMessagesCount,\n 'rts-messenger-header-expanded': messenger.openedProfile || messenger.openedChatDetails || messenger.manageChatInfo,\n 'rts-messenger-header-create-chat-mode': messenger.manageChatInfo,\n 'rts-messenger-header-my-profile-mode': messenger.ownProfileOpened,\n 'rts-messenger-header-chat-info-mode': (messenger.openedProfile || messenger.openedChatDetails) && !messenger.ownProfileOpened && !messenger.manageChatInfo,\n 'rts-messenger-header-chat-image-expanded': imageExpandedToSquare,\n 'rts-messenger-header-image-square': imageExpandedToSquare\n }\"\n>\n <span class=\"rts-messenger-header-collapse-button\"\n (click)=\"messenger.manageChatInfo ? closeManageChatDialog() : collapseInfo()\"\n >\n <span class=\"pi pi-arrow-left\"></span>\n </span>\n <div class=\"rts-messenger-header-left\">\n @if (!messenger.openedChat && messenger.myPeer) {\n <div class=\"rts-messenger-header-avatar\"\n (click)=\"onMyAvatarClick()\"\n (dblclick)=\"onMyAvatarDblClick()\"\n >\n <div [style.background-image]=\"'url(' + myProfileImageUrl + ')'\"\n class=\"rts-messenger-header-avatar-image\">\n </div>\n </div>\n } @else if (messenger.openedChat) {\n <button class=\"rts-messenger-close-chat\"\n (click)=\"messenger.closeChat()\"\n >\n <span class=\"material-icons-outlined\">arrow_back</span>\n @if (messenger.unreadMessagesCount) {\n <span class=\"unread-count\">{{messenger.unreadMessagesCount}}</span>\n }\n </button>\n }\n </div>\n <div class=\"rts-messenger-header-right\">\n @if (messenger.openedChat) {\n <div class=\"rts-messenger-chat-image-container rts-messenger-header-avatar\"\n (click)=\"onChatImageClick()\"\n (dblclick)=\"onChatImageDblClick()\"\n >\n <div class=\"rts-messenger-chat-image rts-messenger-header-avatar-image\"\n [style.background-image]=\"'url(' + chatImageUrl + ')'\"\n ></div>\n </div>\n } @else {\n <div class=\"rts-messenger-header-actions\">\n <button class=\"rts-messenger-header-add-button\"\n (click)=\"toggleDropdown()\"\n >\n <span class=\"material-icons-outlined\">add</span>\n </button>\n\n @if (isDropdownOpen) {\n <div class=\"rts-messenger-header-dropdown-backdrop\"\n (click)=\"closeDropdown()\"\n ></div>\n <div class=\"rts-messenger-header-dropdown\">\n <button class=\"rts-messenger-header-dropdown-item\"\n (click)=\"openNewChatDialog()\"\n >\n <span class=\"material-icons-outlined rts-messenger-header-dropdown-icon\">chat_bubble_outline</span>\n <span>
|
|
1814
|
+
args: [{ selector: 'rtsee-messenger-header', imports: [NgClass, ProfileComponent, ChatInfoComponent, ManageChatInfoComponent, InviteLinkComponent], standalone: true, template: "<div class=\"rts-messenger-header\"\n [ngClass]=\"{\n 'rts-messenger-header-chat-opened': messenger.openedChat && !messenger.manageChatInfo && !messenger.inviteUserOpened,\n 'rts-chat-header-unread': messenger.openedChat && !messenger.unreadMessagesCount,\n 'rts-messenger-header-expanded': messenger.openedProfile || messenger.openedChatDetails || messenger.manageChatInfo || messenger.inviteUserOpened,\n 'rts-messenger-header-create-chat-mode': messenger.manageChatInfo || messenger.inviteUserOpened,\n 'rts-messenger-header-my-profile-mode': messenger.ownProfileOpened,\n 'rts-messenger-header-chat-info-mode': (messenger.openedProfile || messenger.openedChatDetails) && !messenger.ownProfileOpened && !messenger.manageChatInfo && !messenger.inviteUserOpened,\n 'rts-messenger-header-chat-image-expanded': imageExpandedToSquare,\n 'rts-messenger-header-image-square': imageExpandedToSquare\n }\"\n>\n <span class=\"rts-messenger-header-collapse-button\"\n (click)=\"messenger.manageChatInfo ? closeManageChatDialog() : (messenger.inviteUserOpened ? closeInviteUserDialog() : collapseInfo())\"\n >\n <span class=\"pi pi-arrow-left\"></span>\n </span>\n <div class=\"rts-messenger-header-left\">\n @if (!messenger.openedChat && messenger.myPeer) {\n <div class=\"rts-messenger-header-avatar\"\n (click)=\"onMyAvatarClick()\"\n (dblclick)=\"onMyAvatarDblClick()\"\n >\n <div [style.background-image]=\"'url(' + myProfileImageUrl + ')'\"\n class=\"rts-messenger-header-avatar-image\">\n </div>\n </div>\n } @else if (messenger.openedChat) {\n <button class=\"rts-messenger-close-chat\"\n (click)=\"messenger.closeChat()\"\n >\n <span class=\"material-icons-outlined\">arrow_back</span>\n @if (messenger.unreadMessagesCount) {\n <span class=\"unread-count\">{{messenger.unreadMessagesCount}}</span>\n }\n </button>\n }\n </div>\n <div class=\"rts-messenger-header-right\">\n @if (messenger.openedChat) {\n <div class=\"rts-messenger-chat-image-container rts-messenger-header-avatar\"\n (click)=\"onChatImageClick()\"\n (dblclick)=\"onChatImageDblClick()\"\n >\n <div class=\"rts-messenger-chat-image rts-messenger-header-avatar-image\"\n [style.background-image]=\"'url(' + chatImageUrl + ')'\"\n ></div>\n </div>\n } @else {\n <div class=\"rts-messenger-header-actions\">\n <button class=\"rts-messenger-header-add-button\"\n (click)=\"toggleDropdown()\"\n >\n <span class=\"material-icons-outlined\">add</span>\n </button>\n\n @if (isDropdownOpen) {\n <div class=\"rts-messenger-header-dropdown-backdrop\"\n (click)=\"closeDropdown()\"\n ></div>\n <div class=\"rts-messenger-header-dropdown\">\n <button class=\"rts-messenger-header-dropdown-item\"\n (click)=\"openInviteUserDialog()\"\n >\n <span class=\"material-icons-outlined rts-messenger-header-dropdown-icon\">person_add</span>\n <span>{{ messenger.labels[RTSeeTextLabelKeys.MESSENGER_INVITE_USER_BUTTON] }}</span>\n </button>\n <button class=\"rts-messenger-header-dropdown-item\"\n (click)=\"openNewChatDialog()\"\n >\n <span class=\"material-icons-outlined rts-messenger-header-dropdown-icon\">chat_bubble_outline</span>\n <span>{{ messenger.labels[RTSeeTextLabelKeys.MESSENGER_NEW_CHAT_BUTTON] }}</span>\n </button>\n </div>\n }\n </div>\n }\n </div>\n <div class=\"rts-messenger-header-center\">\n @if (messenger.manageChatInfo) {\n <div class=\"rts-messenger-header-create-chat-container\">\n <rtsee-manage-chat-info [messenger]=\"messenger\"\n [chat]=\"messenger.manageChatInfo.chat || undefined\"\n (chatSaved)=\"onChatSaved($event)\"\n (cancelled)=\"closeManageChatDialog()\"\n ></rtsee-manage-chat-info>\n </div>\n } @else if (messenger.inviteUserOpened) {\n <div class=\"rts-messenger-header-create-chat-container rts-messenger-header-invite-user-container\">\n <div class=\"rts-create-chat\">\n <h3 class=\"rts-create-chat-title\">{{ messenger.labels[RTSeeTextLabelKeys.MESSENGER_INVITE_USER_BUTTON] }}</h3>\n <rtsee-invite-link [messenger]=\"messenger\"\n [disclaimer]=\"messenger.labels[RTSeeTextLabelKeys.MESSENGER_INVITE_USER_DISCLAIMER]\"\n ></rtsee-invite-link>\n </div>\n </div>\n } @else if (messenger.openedChat) {\n <div [ngClass]=\"{'rts-messenger-header-opened-chat-info-expanded': messenger.openedProfile || messenger.openedChatDetails}\"\n class=\"rts-messenger-header-opened-chat-info\">\n <div class=\"rts-messenger-profile-header-placeholder\">\n <p class=\"rts-messenger-header-chat-title\"\n >{{ headerTitle }}</p>\n </div>\n\n <div class=\"rts-messenger-profile-data-container\">\n @if (messenger.openedChatDetails && isGroupOrChannelChat && messenger.chatInfo) {\n <rtsee-chat-info [messenger]=\"messenger\"\n [chatInfo]=\"messenger.chatInfo\"\n (editChatInfo)=\"messenger.openManageChatInfo(messenger.openedChat)\"\n (chatDeleted)=\"messenger.closeChatInfo()\"\n ></rtsee-chat-info>\n } @else if (messenger.openedChatDetails || messenger.openedProfile) {\n <rtsee-profile [messenger]=\"messenger\"\n ></rtsee-profile>\n }\n </div>\n </div>\n } @else {\n @if (messenger.ownProfileOpened) {\n <div class=\"rts-messenger-header-opened-chat-info rts-messenger-header-opened-chat-info-expanded\">\n <div class=\"rts-messenger-profile-header-placeholder\">\n <p class=\"rts-messenger-header-chat-title\">{{ headerTitle }}</p>\n </div>\n <div class=\"rts-messenger-profile-data-container\">\n <rtsee-profile [messenger]=\"messenger\"\n [peer]=\"messenger.myPeer\"\n ></rtsee-profile>\n </div>\n </div>\n } @else {\n <p class=\"rts-messenger-header-title\"\n >{{messenger.labels[RTSeeTextLabelKeys.MESSANGER_TITLE]}}</p>\n <rtsee-profile [messenger]=\"messenger\"\n [peer]=\"messenger.myPeer\"\n ></rtsee-profile>\n }\n }\n </div>\n</div>\n" }]
|
|
1734
1815
|
}], ctorParameters: () => [{ type: DefaultImagesService }], propDecorators: { messenger: [{
|
|
1735
1816
|
type: Input
|
|
1736
1817
|
}] } });
|
|
@@ -1890,15 +1971,24 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImpor
|
|
|
1890
1971
|
}] } });
|
|
1891
1972
|
|
|
1892
1973
|
class ChatsListComponent {
|
|
1974
|
+
constructor() {
|
|
1975
|
+
this.RTSeeTextLabelKeys = RTSeeTextLabelKeys;
|
|
1976
|
+
}
|
|
1893
1977
|
ngOnInit() {
|
|
1894
1978
|
// console.log(this.chats);
|
|
1895
1979
|
}
|
|
1980
|
+
onInviteUserClick() {
|
|
1981
|
+
this.messenger.openInviteUser();
|
|
1982
|
+
}
|
|
1983
|
+
onCreateGroupClick() {
|
|
1984
|
+
this.messenger.openManageChatInfo();
|
|
1985
|
+
}
|
|
1896
1986
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: ChatsListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1897
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "
|
|
1987
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", type: ChatsListComponent, isStandalone: true, selector: "rtsee-chats-list", inputs: { messenger: "messenger", chats: "chats" }, ngImport: i0, template: "<div class=\"rts-chats-list\">\n @if (chats && chats.length) {\n <div class=\"rts-chat-thumbnail-container\" *ngFor=\"let chat of chats; let last = last;\">\n <rtsee-chat-thumbnail [chat]=\"chat.thumbnail\" [messenger]=\"messenger\"></rtsee-chat-thumbnail>\n </div>\n } @else if (!messenger.loadingChatsInProgress) {\n <div class=\"rts-chats-list-empty\">\n <span class=\"material-icons-outlined rts-chats-list-empty-icon\">forum</span>\n <p class=\"rts-chats-list-empty-disclaimer\">\n {{ messenger.labels[RTSeeTextLabelKeys.MESSENGER_NO_CHATS_DISCLAIMER] }}\n </p>\n <div class=\"rts-chats-list-empty-actions\">\n <button type=\"button\"\n class=\"rts-btn rts-btn-primary rts-chats-list-empty-btn\"\n (click)=\"onInviteUserClick()\"\n >\n <span class=\"material-icons-outlined\">person_add</span>\n <span>{{ messenger.labels[RTSeeTextLabelKeys.MESSENGER_INVITE_USER_BUTTON] }}</span>\n </button>\n <button type=\"button\"\n class=\"rts-btn rts-btn-secondary rts-chats-list-empty-btn\"\n (click)=\"onCreateGroupClick()\"\n >\n <span class=\"material-icons-outlined\">group_add</span>\n <span>{{ messenger.labels[RTSeeTextLabelKeys.MESSENGER_CREATE_GROUP_BUTTON] }}</span>\n </button>\n </div>\n </div>\n }\n</div>\n", dependencies: [{ kind: "directive", type: NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: ChatThumbnailComponent, selector: "rtsee-chat-thumbnail", inputs: ["chat", "messenger"] }] }); }
|
|
1898
1988
|
}
|
|
1899
1989
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: ChatsListComponent, decorators: [{
|
|
1900
1990
|
type: Component,
|
|
1901
|
-
args: [{ selector: 'rtsee-chats-list', imports: [NgForOf, ChatThumbnailComponent], standalone: true, template: "<div class=\"rts-chats-list\">\n <div class=\"rts-chat-thumbnail-container\" *ngFor=\"let chat of chats; let last = last;\">\n
|
|
1991
|
+
args: [{ selector: 'rtsee-chats-list', imports: [NgForOf, ChatThumbnailComponent], standalone: true, template: "<div class=\"rts-chats-list\">\n @if (chats && chats.length) {\n <div class=\"rts-chat-thumbnail-container\" *ngFor=\"let chat of chats; let last = last;\">\n <rtsee-chat-thumbnail [chat]=\"chat.thumbnail\" [messenger]=\"messenger\"></rtsee-chat-thumbnail>\n </div>\n } @else if (!messenger.loadingChatsInProgress) {\n <div class=\"rts-chats-list-empty\">\n <span class=\"material-icons-outlined rts-chats-list-empty-icon\">forum</span>\n <p class=\"rts-chats-list-empty-disclaimer\">\n {{ messenger.labels[RTSeeTextLabelKeys.MESSENGER_NO_CHATS_DISCLAIMER] }}\n </p>\n <div class=\"rts-chats-list-empty-actions\">\n <button type=\"button\"\n class=\"rts-btn rts-btn-primary rts-chats-list-empty-btn\"\n (click)=\"onInviteUserClick()\"\n >\n <span class=\"material-icons-outlined\">person_add</span>\n <span>{{ messenger.labels[RTSeeTextLabelKeys.MESSENGER_INVITE_USER_BUTTON] }}</span>\n </button>\n <button type=\"button\"\n class=\"rts-btn rts-btn-secondary rts-chats-list-empty-btn\"\n (click)=\"onCreateGroupClick()\"\n >\n <span class=\"material-icons-outlined\">group_add</span>\n <span>{{ messenger.labels[RTSeeTextLabelKeys.MESSENGER_CREATE_GROUP_BUTTON] }}</span>\n </button>\n </div>\n </div>\n }\n</div>\n" }]
|
|
1902
1992
|
}], propDecorators: { messenger: [{
|
|
1903
1993
|
type: Input
|
|
1904
1994
|
}], chats: [{
|
|
@@ -1966,11 +2056,11 @@ class RatingComponent {
|
|
|
1966
2056
|
this.init();
|
|
1967
2057
|
}
|
|
1968
2058
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: RatingComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1969
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", type: RatingComponent, isStandalone: true, selector: "rtsee-rating", inputs: { config: "config", rate: "rate" }, ngImport: i0, template: "<div\n class=\"rtsee-rating\"\n data-ugc=\"true\"\n rel=\"ugc\"\n itemprop=\"reviewRating\"\n itemscope\n itemtype=\"https://schema.org/Rating\"\n>\n <meta itemprop=\"bestRating\" content=\"5\" />\n
|
|
2059
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", type: RatingComponent, isStandalone: true, selector: "rtsee-rating", inputs: { config: "config", rate: "rate" }, ngImport: i0, template: "<div\n class=\"rtsee-rating\"\n data-ugc=\"true\"\n rel=\"ugc\"\n [attr.itemprop]=\"!mutable ? 'reviewRating' : null\"\n [attr.itemscope]=\"!mutable ? '' : null\"\n [attr.itemtype]=\"!mutable ? 'https://schema.org/Rating' : null\"\n>\n @if (!mutable) {\n <meta itemprop=\"bestRating\" content=\"5\" />\n <meta itemprop=\"worstRating\" content=\"1\" />\n }\n @for (star of stars; track $index) {\n <span class=\"rtsee-rating-star\"\n [ngClass]=\"{\n 'rtsee-rating-star-full': star === 'full',\n 'rtsee-rating-star-half': star === 'half',\n 'rtsee-rating-star-empty': star === 'empty',\n 'rtsee-rating-star-clickable': mutable\n }\"\n (click)=\"onStarClicked($index)\"\n >\u2605</span>\n }\n @if (rateValue) {\n <span class=\"rtsee-rating-number\" [attr.itemprop]=\"!mutable ? 'ratingValue' : null\">{{ rateValue | number:'1.1-1' }}</span>\n }\n</div>\n", dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "pipe", type: DecimalPipe, name: "number" }] }); }
|
|
1970
2060
|
}
|
|
1971
2061
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: RatingComponent, decorators: [{
|
|
1972
2062
|
type: Component,
|
|
1973
|
-
args: [{ selector: 'rtsee-rating', imports: [NgClass, DecimalPipe], template: "<div\n class=\"rtsee-rating\"\n data-ugc=\"true\"\n rel=\"ugc\"\n itemprop=\"reviewRating\"\n itemscope\n itemtype=\"https://schema.org/Rating\"\n>\n <meta itemprop=\"bestRating\" content=\"5\" />\n
|
|
2063
|
+
args: [{ selector: 'rtsee-rating', imports: [NgClass, DecimalPipe], template: "<div\n class=\"rtsee-rating\"\n data-ugc=\"true\"\n rel=\"ugc\"\n [attr.itemprop]=\"!mutable ? 'reviewRating' : null\"\n [attr.itemscope]=\"!mutable ? '' : null\"\n [attr.itemtype]=\"!mutable ? 'https://schema.org/Rating' : null\"\n>\n @if (!mutable) {\n <meta itemprop=\"bestRating\" content=\"5\" />\n <meta itemprop=\"worstRating\" content=\"1\" />\n }\n @for (star of stars; track $index) {\n <span class=\"rtsee-rating-star\"\n [ngClass]=\"{\n 'rtsee-rating-star-full': star === 'full',\n 'rtsee-rating-star-half': star === 'half',\n 'rtsee-rating-star-empty': star === 'empty',\n 'rtsee-rating-star-clickable': mutable\n }\"\n (click)=\"onStarClicked($index)\"\n >\u2605</span>\n }\n @if (rateValue) {\n <span class=\"rtsee-rating-number\" [attr.itemprop]=\"!mutable ? 'ratingValue' : null\">{{ rateValue | number:'1.1-1' }}</span>\n }\n</div>\n" }]
|
|
1974
2064
|
}], propDecorators: { config: [{
|
|
1975
2065
|
type: Input
|
|
1976
2066
|
}], rate: [{
|
|
@@ -5208,79 +5298,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImpor
|
|
|
5208
5298
|
args: ['messageTextarea']
|
|
5209
5299
|
}] } });
|
|
5210
5300
|
|
|
5211
|
-
class InviteLinkComponent {
|
|
5212
|
-
constructor() {
|
|
5213
|
-
this.inviteUrl = '';
|
|
5214
|
-
this.disclaimer = 'Anyone who opens this link can join the chat.';
|
|
5215
|
-
this.copied = false;
|
|
5216
|
-
this.loading = false;
|
|
5217
|
-
}
|
|
5218
|
-
async ngOnInit() {
|
|
5219
|
-
if (!this.inviteUrl && this.chatId && this.messenger) {
|
|
5220
|
-
await this.loadInviteLink();
|
|
5221
|
-
}
|
|
5222
|
-
}
|
|
5223
|
-
async loadInviteLink() {
|
|
5224
|
-
if (!this.chatId || !this.messenger)
|
|
5225
|
-
return;
|
|
5226
|
-
this.loading = true;
|
|
5227
|
-
try {
|
|
5228
|
-
const result = await this.messenger.remoteActions.getChatInvitationLink.send({
|
|
5229
|
-
chatId: this.chatId,
|
|
5230
|
-
});
|
|
5231
|
-
if (result?.invitationLink) {
|
|
5232
|
-
this.inviteUrl = result.invitationLink;
|
|
5233
|
-
}
|
|
5234
|
-
}
|
|
5235
|
-
catch (e) {
|
|
5236
|
-
console.log('Failed to fetch chat invitation link', e);
|
|
5237
|
-
}
|
|
5238
|
-
finally {
|
|
5239
|
-
this.loading = false;
|
|
5240
|
-
}
|
|
5241
|
-
}
|
|
5242
|
-
async copyToClipboard() {
|
|
5243
|
-
const targetChat = this.chatId
|
|
5244
|
-
? this.messenger?.getChatById?.(this.chatId) || this.messenger?.openedChat
|
|
5245
|
-
: this.messenger?.openedChat;
|
|
5246
|
-
this.messenger?.trackChatMemberInviteClicked?.(targetChat, this.inviteUrl);
|
|
5247
|
-
try {
|
|
5248
|
-
await navigator.clipboard.writeText(this.inviteUrl);
|
|
5249
|
-
this.copied = true;
|
|
5250
|
-
setTimeout(() => {
|
|
5251
|
-
this.copied = false;
|
|
5252
|
-
}, 2000);
|
|
5253
|
-
}
|
|
5254
|
-
catch {
|
|
5255
|
-
// Fallback for older browsers
|
|
5256
|
-
const textArea = document.createElement('textarea');
|
|
5257
|
-
textArea.value = this.inviteUrl;
|
|
5258
|
-
document.body.appendChild(textArea);
|
|
5259
|
-
textArea.select();
|
|
5260
|
-
document.execCommand('copy');
|
|
5261
|
-
document.body.removeChild(textArea);
|
|
5262
|
-
this.copied = true;
|
|
5263
|
-
setTimeout(() => {
|
|
5264
|
-
this.copied = false;
|
|
5265
|
-
}, 2000);
|
|
5266
|
-
}
|
|
5267
|
-
}
|
|
5268
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: InviteLinkComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
5269
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", type: InviteLinkComponent, isStandalone: true, selector: "rtsee-invite-link", inputs: { inviteUrl: "inviteUrl", chatId: "chatId", messenger: "messenger", disclaimer: "disclaimer" }, ngImport: i0, template: "<div class=\"rts-invite-link\">\n <div class=\"rts-invite-link-info\">\n <span class=\"rts-invite-link-icon material-icons-outlined\">link</span>\n <div class=\"rts-invite-link-info-text\">\n <h4>Invite Link</h4>\n <p>{{ disclaimer }}</p>\n </div>\n </div>\n\n @if (loading) {\n <div class=\"rts-invite-link-loading\">\n <span class=\"material-icons-outlined rts-spin-icon\">autorenew</span>\n <span>Generating invite link...</span>\n </div>\n } @else {\n <div class=\"rts-invite-link-url-container\">\n <p-inputgroup>\n <input pInputText\n [value]=\"inviteUrl\"\n readonly\n class=\"rts-invite-link-url-input\"\n />\n <p-button [icon]=\"copied ? 'pi pi-check' : 'pi pi-copy'\"\n [severity]=\"copied ? 'success' : 'primary'\"\n (click)=\"copyToClipboard()\"\n [label]=\"copied ? 'Copied!' : 'Copy'\"\n />\n </p-inputgroup>\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: "directive", type: InputText, selector: "[pInputText]", inputs: ["pSize", "variant", "fluid", "invalid"] }, { kind: "component", type: InputGroup, selector: "p-inputgroup, p-inputGroup, p-input-group", inputs: ["styleClass"] }] }); }
|
|
5270
|
-
}
|
|
5271
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: InviteLinkComponent, decorators: [{
|
|
5272
|
-
type: Component,
|
|
5273
|
-
args: [{ selector: 'rtsee-invite-link', standalone: true, imports: [Button, InputText, InputGroup], template: "<div class=\"rts-invite-link\">\n <div class=\"rts-invite-link-info\">\n <span class=\"rts-invite-link-icon material-icons-outlined\">link</span>\n <div class=\"rts-invite-link-info-text\">\n <h4>Invite Link</h4>\n <p>{{ disclaimer }}</p>\n </div>\n </div>\n\n @if (loading) {\n <div class=\"rts-invite-link-loading\">\n <span class=\"material-icons-outlined rts-spin-icon\">autorenew</span>\n <span>Generating invite link...</span>\n </div>\n } @else {\n <div class=\"rts-invite-link-url-container\">\n <p-inputgroup>\n <input pInputText\n [value]=\"inviteUrl\"\n readonly\n class=\"rts-invite-link-url-input\"\n />\n <p-button [icon]=\"copied ? 'pi pi-check' : 'pi pi-copy'\"\n [severity]=\"copied ? 'success' : 'primary'\"\n (click)=\"copyToClipboard()\"\n [label]=\"copied ? 'Copied!' : 'Copy'\"\n />\n </p-inputgroup>\n </div>\n }\n</div>\n" }]
|
|
5274
|
-
}], propDecorators: { inviteUrl: [{
|
|
5275
|
-
type: Input
|
|
5276
|
-
}], chatId: [{
|
|
5277
|
-
type: Input
|
|
5278
|
-
}], messenger: [{
|
|
5279
|
-
type: Input
|
|
5280
|
-
}], disclaimer: [{
|
|
5281
|
-
type: Input
|
|
5282
|
-
}] } });
|
|
5283
|
-
|
|
5284
5301
|
class ViewportObserverDirective {
|
|
5285
5302
|
constructor(element) {
|
|
5286
5303
|
this.element = element;
|
|
@@ -5762,12 +5779,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImpor
|
|
|
5762
5779
|
class MessengerComponent {
|
|
5763
5780
|
constructor() {
|
|
5764
5781
|
this.isFramed = false;
|
|
5782
|
+
this.RTSeeTextLabelKeys = RTSeeTextLabelKeys;
|
|
5765
5783
|
}
|
|
5766
5784
|
onScroll() {
|
|
5767
5785
|
void this.messenger.loadChats();
|
|
5768
5786
|
}
|
|
5769
5787
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: MessengerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
5770
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", type: MessengerComponent, isStandalone: true, selector: "rtsee-messenger", inputs: { messenger: "messenger", isFramed: "isFramed" }, ngImport: i0, template: "<div class=\"rts-messenger rts-theme-dark\" [ngClass]=\"{\n 'rts-messenger-header-expanded': messenger.openedProfile || messenger.openedChatDetails || messenger.manageChatInfo,\n 'rts-messenger-folded': messenger.folded,\n 'rts-messenger-overlay-window': messenger.isOverlayPageOpened,\n 'rts-messenger-framed': isFramed\n}\">\n @if (messenger.manageProfile) {\n <div class=\"rts-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=\"rts-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=\"rts-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=\"rts-payment-page-container\">\n <rtsee-manage-plan [messenger]=\"messenger\"></rtsee-manage-plan>\n </div>\n }\n <div class=\"rts-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\" [isFramed]=\"isFramed\"></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 class=\"rts-messenger-header-container\">\n <rtsee-messenger-header [messenger]=\"messenger\"\n ></rtsee-messenger-header>\n </div>\n</div>\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", "isFramed"] }, { 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"] }] }); }
|
|
5788
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", type: MessengerComponent, isStandalone: true, selector: "rtsee-messenger", inputs: { messenger: "messenger", isFramed: "isFramed" }, ngImport: i0, template: "<div class=\"rts-messenger rts-theme-dark\" [ngClass]=\"{\n 'rts-messenger-header-expanded': messenger.openedProfile || messenger.openedChatDetails || messenger.manageChatInfo || messenger.inviteUserOpened,\n 'rts-messenger-folded': messenger.folded,\n 'rts-messenger-overlay-window': messenger.isOverlayPageOpened,\n 'rts-messenger-framed': isFramed\n}\">\n @if (messenger.pendingInviteToken) {\n <div class=\"rts-invite-popup-modal\">\n <div class=\"rts-invite-popup-content\">\n <span class=\"material-icons-outlined rts-invite-popup-icon\">mail_outline</span>\n <div class=\"rts-invite-popup-text\">\n @if (messenger.pendingInviteInfo?.inviter?.name) {\n <strong>{{ messenger.pendingInviteInfo?.inviter?.name }}</strong>\n <span> {{ messenger.labels[RTSeeTextLabelKeys.MESSENGER_INVITE_POPUP_TEXT] }}</span>\n @if (messenger.pendingInviteInfo?.chat?.name) {\n <span class=\"rts-invite-popup-chat-name\"> ({{ messenger.pendingInviteInfo?.chat?.name }})</span>\n }\n } @else {\n <span>{{ messenger.labels[RTSeeTextLabelKeys.MESSENGER_INVITE_POPUP_GENERIC_TEXT] }}</span>\n }\n </div>\n </div>\n <div class=\"rts-invite-popup-actions\">\n <button type=\"button\"\n class=\"rts-btn rts-btn-secondary rts-invite-popup-btn\"\n [disabled]=\"messenger.inviteJoinInProgress\"\n (click)=\"messenger.ignoreChatInvitation()\"\n >\n {{ messenger.labels[RTSeeTextLabelKeys.MESSENGER_INVITE_IGNORE_BUTTON] }}\n </button>\n <button type=\"button\"\n class=\"rts-btn rts-btn-primary rts-invite-popup-btn\"\n [disabled]=\"messenger.inviteJoinInProgress\"\n (click)=\"messenger.acceptChatInvitation()\"\n >\n {{ messenger.labels[RTSeeTextLabelKeys.MESSENGER_INVITE_JOIN_BUTTON] }}\n </button>\n </div>\n </div>\n }\n @if (messenger.manageProfile) {\n <div class=\"rts-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=\"rts-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=\"rts-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=\"rts-payment-page-container\">\n <rtsee-manage-plan [messenger]=\"messenger\"></rtsee-manage-plan>\n </div>\n }\n <div class=\"rts-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\" [isFramed]=\"isFramed\"></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 class=\"rts-messenger-header-container\">\n <rtsee-messenger-header [messenger]=\"messenger\"\n ></rtsee-messenger-header>\n </div>\n</div>\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", "isFramed"] }, { 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"] }] }); }
|
|
5771
5789
|
}
|
|
5772
5790
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: MessengerComponent, decorators: [{
|
|
5773
5791
|
type: Component,
|
|
@@ -5785,7 +5803,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImpor
|
|
|
5785
5803
|
PaymentPageComponent,
|
|
5786
5804
|
PaymentValidationPageComponent,
|
|
5787
5805
|
ManagePlanComponent,
|
|
5788
|
-
], standalone: true, template: "<div class=\"rts-messenger rts-theme-dark\" [ngClass]=\"{\n 'rts-messenger-header-expanded': messenger.openedProfile || messenger.openedChatDetails || messenger.manageChatInfo,\n 'rts-messenger-folded': messenger.folded,\n 'rts-messenger-overlay-window': messenger.isOverlayPageOpened,\n 'rts-messenger-framed': isFramed\n}\">\n @if (messenger.manageProfile) {\n <div class=\"rts-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=\"rts-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=\"rts-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=\"rts-payment-page-container\">\n <rtsee-manage-plan [messenger]=\"messenger\"></rtsee-manage-plan>\n </div>\n }\n <div class=\"rts-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\" [isFramed]=\"isFramed\"></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 class=\"rts-messenger-header-container\">\n <rtsee-messenger-header [messenger]=\"messenger\"\n ></rtsee-messenger-header>\n </div>\n</div>\n" }]
|
|
5806
|
+
], standalone: true, template: "<div class=\"rts-messenger rts-theme-dark\" [ngClass]=\"{\n 'rts-messenger-header-expanded': messenger.openedProfile || messenger.openedChatDetails || messenger.manageChatInfo || messenger.inviteUserOpened,\n 'rts-messenger-folded': messenger.folded,\n 'rts-messenger-overlay-window': messenger.isOverlayPageOpened,\n 'rts-messenger-framed': isFramed\n}\">\n @if (messenger.pendingInviteToken) {\n <div class=\"rts-invite-popup-modal\">\n <div class=\"rts-invite-popup-content\">\n <span class=\"material-icons-outlined rts-invite-popup-icon\">mail_outline</span>\n <div class=\"rts-invite-popup-text\">\n @if (messenger.pendingInviteInfo?.inviter?.name) {\n <strong>{{ messenger.pendingInviteInfo?.inviter?.name }}</strong>\n <span> {{ messenger.labels[RTSeeTextLabelKeys.MESSENGER_INVITE_POPUP_TEXT] }}</span>\n @if (messenger.pendingInviteInfo?.chat?.name) {\n <span class=\"rts-invite-popup-chat-name\"> ({{ messenger.pendingInviteInfo?.chat?.name }})</span>\n }\n } @else {\n <span>{{ messenger.labels[RTSeeTextLabelKeys.MESSENGER_INVITE_POPUP_GENERIC_TEXT] }}</span>\n }\n </div>\n </div>\n <div class=\"rts-invite-popup-actions\">\n <button type=\"button\"\n class=\"rts-btn rts-btn-secondary rts-invite-popup-btn\"\n [disabled]=\"messenger.inviteJoinInProgress\"\n (click)=\"messenger.ignoreChatInvitation()\"\n >\n {{ messenger.labels[RTSeeTextLabelKeys.MESSENGER_INVITE_IGNORE_BUTTON] }}\n </button>\n <button type=\"button\"\n class=\"rts-btn rts-btn-primary rts-invite-popup-btn\"\n [disabled]=\"messenger.inviteJoinInProgress\"\n (click)=\"messenger.acceptChatInvitation()\"\n >\n {{ messenger.labels[RTSeeTextLabelKeys.MESSENGER_INVITE_JOIN_BUTTON] }}\n </button>\n </div>\n </div>\n }\n @if (messenger.manageProfile) {\n <div class=\"rts-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=\"rts-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=\"rts-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=\"rts-payment-page-container\">\n <rtsee-manage-plan [messenger]=\"messenger\"></rtsee-manage-plan>\n </div>\n }\n <div class=\"rts-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\" [isFramed]=\"isFramed\"></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 class=\"rts-messenger-header-container\">\n <rtsee-messenger-header [messenger]=\"messenger\"\n ></rtsee-messenger-header>\n </div>\n</div>\n" }]
|
|
5789
5807
|
}], propDecorators: { messenger: [{
|
|
5790
5808
|
type: Input
|
|
5791
5809
|
}], isFramed: [{
|
|
@@ -7849,12 +7867,14 @@ class RateInputComponent {
|
|
|
7849
7867
|
}
|
|
7850
7868
|
}
|
|
7851
7869
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: RateInputComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
7852
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", type: RateInputComponent, isStandalone: true, selector: "rtsee-rate-input", inputs: { config: "config" }, ngImport: i0, template: "<div class=\"rtsee-rate-input\">\n <div class=\"rtsee-rate-input-header\">\n <h3 class=\"rtsee-rate-input-name\">{{ config.name }}</h3>\n @if (config.description) {\n <p class=\"rtsee-rate-input-description\">{{ config.description }}</p>\n }\n </div>\n <div class=\"rtsee-rate-form-container\">\n <form [formGroup]=\"sendRateForm\" class=\"rtsee-rate-form\">\n <textarea\n [invalid]=\"false\"\n [autoResize]=\"true\"\n formControlName=\"comment\"\n pTextarea\n placeholder=\"Your comment here...\"\n class=\"rtsee-rate-comment-field\"\n rows=\"1\"\n cols=\"30\"\n ></textarea>\n </form>\n </div>\n <div class=\"rtsee-rate-select-container\">\n <rtsee-rating [config]=\"config\"></rtsee-rating>\n @if (!config.rate?.value && showMissingRateError) {\n <p-message severity=\"error\">Please add your rate!</p-message>\n }\n </div>\n</div>\n", dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: Textarea, selector: "[pTextarea], [pInputTextarea]", inputs: ["autoResize", "pSize", "variant", "fluid", "invalid"], outputs: ["onResize"] }, { kind: "component", type: RatingComponent, selector: "rtsee-rating", inputs: ["config", "rate"] }, { kind: "component", type: Message, selector: "p-message", inputs: ["severity", "text", "escape", "style", "styleClass", "closable", "icon", "closeIcon", "life", "showTransitionOptions", "hideTransitionOptions", "size", "variant"], outputs: ["onClose"] }] }); }
|
|
7870
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", type: RateInputComponent, isStandalone: true, selector: "rtsee-rate-input", inputs: { showMissingRateError: "showMissingRateError", config: "config" }, ngImport: i0, template: "<div class=\"rtsee-rate-input\">\n <div class=\"rtsee-rate-input-header\">\n <h3 class=\"rtsee-rate-input-name\">{{ config.name }}</h3>\n @if (config.description) {\n <p class=\"rtsee-rate-input-description\">{{ config.description }}</p>\n }\n </div>\n <div class=\"rtsee-rate-form-container\">\n <form [formGroup]=\"sendRateForm\" class=\"rtsee-rate-form\">\n <textarea\n [invalid]=\"false\"\n [autoResize]=\"true\"\n formControlName=\"comment\"\n pTextarea\n placeholder=\"Your comment here...\"\n class=\"rtsee-rate-comment-field\"\n rows=\"1\"\n cols=\"30\"\n ></textarea>\n </form>\n </div>\n <div class=\"rtsee-rate-select-container\">\n <rtsee-rating [config]=\"config\"></rtsee-rating>\n @if (!config.rate?.value && showMissingRateError) {\n <p-message severity=\"error\">Please add your rate!</p-message>\n }\n </div>\n</div>\n", dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: Textarea, selector: "[pTextarea], [pInputTextarea]", inputs: ["autoResize", "pSize", "variant", "fluid", "invalid"], outputs: ["onResize"] }, { kind: "component", type: RatingComponent, selector: "rtsee-rating", inputs: ["config", "rate"] }, { kind: "component", type: Message, selector: "p-message", inputs: ["severity", "text", "escape", "style", "styleClass", "closable", "icon", "closeIcon", "life", "showTransitionOptions", "hideTransitionOptions", "size", "variant"], outputs: ["onClose"] }] }); }
|
|
7853
7871
|
}
|
|
7854
7872
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: RateInputComponent, decorators: [{
|
|
7855
7873
|
type: Component,
|
|
7856
7874
|
args: [{ selector: 'rtsee-rate-input', imports: [ReactiveFormsModule, Textarea, RatingComponent, Message], standalone: true, template: "<div class=\"rtsee-rate-input\">\n <div class=\"rtsee-rate-input-header\">\n <h3 class=\"rtsee-rate-input-name\">{{ config.name }}</h3>\n @if (config.description) {\n <p class=\"rtsee-rate-input-description\">{{ config.description }}</p>\n }\n </div>\n <div class=\"rtsee-rate-form-container\">\n <form [formGroup]=\"sendRateForm\" class=\"rtsee-rate-form\">\n <textarea\n [invalid]=\"false\"\n [autoResize]=\"true\"\n formControlName=\"comment\"\n pTextarea\n placeholder=\"Your comment here...\"\n class=\"rtsee-rate-comment-field\"\n rows=\"1\"\n cols=\"30\"\n ></textarea>\n </form>\n </div>\n <div class=\"rtsee-rate-select-container\">\n <rtsee-rating [config]=\"config\"></rtsee-rating>\n @if (!config.rate?.value && showMissingRateError) {\n <p-message severity=\"error\">Please add your rate!</p-message>\n }\n </div>\n</div>\n" }]
|
|
7857
|
-
}], propDecorators: {
|
|
7875
|
+
}], propDecorators: { showMissingRateError: [{
|
|
7876
|
+
type: Input
|
|
7877
|
+
}], config: [{
|
|
7858
7878
|
type: Input
|
|
7859
7879
|
}] } });
|
|
7860
7880
|
|
|
@@ -7900,6 +7920,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImpor
|
|
|
7900
7920
|
class RaterComponent {
|
|
7901
7921
|
constructor() {
|
|
7902
7922
|
this.isEditing = false;
|
|
7923
|
+
this.showMissingRateError = false;
|
|
7903
7924
|
this.RTSeeTextLabelKeys = RTSeeTextLabelKeys;
|
|
7904
7925
|
}
|
|
7905
7926
|
ngOnInit() {
|
|
@@ -7915,6 +7936,13 @@ class RaterComponent {
|
|
|
7915
7936
|
const rates = this.rater.configsWithRates
|
|
7916
7937
|
.map((config) => config.rate)
|
|
7917
7938
|
.filter((r) => !!r);
|
|
7939
|
+
const hasInvalidRate = rates.length === 0 ||
|
|
7940
|
+
rates.some((r) => typeof r.value !== 'number' || !Number.isFinite(r.value) || r.value <= 0);
|
|
7941
|
+
if (hasInvalidRate) {
|
|
7942
|
+
this.showMissingRateError = true;
|
|
7943
|
+
return;
|
|
7944
|
+
}
|
|
7945
|
+
this.showMissingRateError = false;
|
|
7918
7946
|
if (this.rater.userRateGroup) {
|
|
7919
7947
|
await this.rater.editRateGroup({
|
|
7920
7948
|
...this.rater.userRateGroup,
|
|
@@ -7939,6 +7967,7 @@ class RaterComponent {
|
|
|
7939
7967
|
}
|
|
7940
7968
|
}
|
|
7941
7969
|
startEdit() {
|
|
7970
|
+
this.showMissingRateError = false;
|
|
7942
7971
|
this.isEditing = true;
|
|
7943
7972
|
}
|
|
7944
7973
|
async getRatingConfigurations() {
|
|
@@ -7951,11 +7980,11 @@ class RaterComponent {
|
|
|
7951
7980
|
return rates;
|
|
7952
7981
|
}
|
|
7953
7982
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: RaterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
7954
|
-
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
|
|
7983
|
+
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\n [config]=\"config\"\n [showMissingRateError]=\"showMissingRateError\"\n ></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: ["showMissingRateError", "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"] }] }); }
|
|
7955
7984
|
}
|
|
7956
7985
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: RaterComponent, decorators: [{
|
|
7957
7986
|
type: Component,
|
|
7958
|
-
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
|
|
7987
|
+
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\n [config]=\"config\"\n [showMissingRateError]=\"showMissingRateError\"\n ></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" }]
|
|
7959
7988
|
}], propDecorators: { entity: [{
|
|
7960
7989
|
type: Input
|
|
7961
7990
|
}], rater: [{
|
|
@@ -8244,11 +8273,11 @@ class StoryDetailsComponent {
|
|
|
8244
8273
|
return stars;
|
|
8245
8274
|
}
|
|
8246
8275
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: StoryDetailsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
8247
|
-
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\n class=\"rtsee-story-details\"\n itemscope\n itemtype=\"https://schema.org/ShortStory\"\n>\n @if (story.imageUrl) {\n <meta itemprop=\"image\" [attr.content]=\"story.imageUrl\" />\n }\n @if (story.languageKey) {\n <meta itemprop=\"inLanguage\" [attr.content]=\"story.languageKey === 'ua' ? 'uk' : 'en'\" />\n }\n @if (story.totalSlides) {\n <meta itemprop=\"numberOfPages\" [attr.content]=\"story.totalSlides\" />\n }\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 && false) {\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\" itemprop=\"name\">{{ story.name }}</h1>\n\n <div class=\"rtsee-story-details-cover-meta\">\n @if (story.rating !== null) {\n <div\n class=\"rtsee-story-details-cover-rating\"\n itemprop=\"aggregateRating\"\n itemscope\n itemtype=\"https://schema.org/AggregateRating\"\n >\n <meta itemprop=\"bestRating\" content=\"5\" />\n <meta itemprop=\"worstRating\" content=\"1\" />\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\" itemprop=\"ratingValue\">{{\n story.rating\n }}</span>\n @if (story.ratesCount !== null) {\n <meta itemprop=\"ratingCount\" [attr.content]=\"story.ratesCount\" />\n <span class=\"rtsee-story-details-rating-count\">\n <span>(</span>\n <span>{{ presentation.labels[RTSeeTextLabelKeys.FEEDBACKS_LABEL] }}:</span>\n <span> </span>\n <span itemprop=\"reviewCount\">{{ story.ratesCount }}</span>\n <span>)</span>\n </span\n >\n }\n </div>\n }\n </div>\n </div>\n </section>\n\n <!-- CONTENT AREA -->\n <div class=\"rtsee-story-details-content-wrapper\">\n <!-- Reading panel: what the user is about to read + the main CTA -->\n <section class=\"rtsee-story-details-reading-panel\" aria-label=\"{{ story.name }}\">\n @if (story.totalSlides) {\n <rtsee-story-slides-preview\n [story]=\"story\"\n [slidesLabel]=\"presentation.labels[RTSeeTextLabelKeys.STORY_PAGES_LABEL]\"\n [minuteLabel]=\"presentation.labels[RTSeeTextLabelKeys.MINUTE_LABEL]\"\n ></rtsee-story-slides-preview>\n }\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 icon=\"pi pi-book\"\n iconPos=\"left\"\n class=\"rtsee-story-details-start-reading rts-action-button\"\n >\n </p-button>\n </section>\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\" itemprop=\"description\">\n {{ story.description }}\n </p>\n </article>\n\n @if (story.history) {\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 <circle cx=\"12\" cy=\"12\" r=\"10\" />\n <polyline points=\"12 6 12 12 14 14\" />\n </svg>\n <h2>{{presentation.labels[RTSeeTextLabelKeys.STORY_HISTORY_LABEL]}}</h2>\n </div>\n <p class=\"rtsee-story-details-glass-card-text\" itemprop=\"backstory\">\n {{ story.history }}\n </p>\n </article>\n }\n\n @if (story.moralMeaning) {\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=\"M12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z\" />\n </svg>\n <h2>{{presentation.labels[RTSeeTextLabelKeys.STORY_MORAL_LABEL]}}</h2>\n </div>\n <p class=\"rtsee-story-details-glass-card-text\" itemprop=\"teaches\">\n {{ story.moralMeaning }}\n </p>\n </article>\n }\n </div>\n\n <!-- Author -->\n @if (story.author) {\n <section\n class=\"rtsee-story-details-elements\"\n aria-labelledby=\"rtsee-story-details-author-heading\"\n >\n <header 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 aria-hidden=\"true\"\n >\n <path d=\"M12 20h9\" />\n <path d=\"M16.5 3.5a2.121 2.121 0 0 1 3 3L7 19l-4 1 1-4L16.5 3.5z\" />\n </svg>\n <h2 id=\"rtsee-story-details-author-heading\">\n {{ presentation.labels[RTSeeTextLabelKeys.STORY_AUTHOR_LABEL] }}\n </h2>\n </header>\n <div class=\"rtsee-story-details-elements-featured\">\n <rtsee-story-element-thumbnail\n [name]=\"story.author.name\"\n [description]=\"story.author.description\"\n [imageUrl]=\"story.author.imageUrl\"\n itemProp=\"author\"\n schemaType=\"Person\"\n [horizontal]=\"true\"\n [showMoreLabel]=\"presentation.labels[RTSeeTextLabelKeys.SHOW_MORE_LABEL]\"\n [showLessLabel]=\"presentation.labels[RTSeeTextLabelKeys.SHOW_LESS_LABEL]\"\n ></rtsee-story-element-thumbnail>\n </div>\n </section>\n }\n\n <!-- Characters -->\n @if (story.characters.length) {\n <section\n class=\"rtsee-story-details-elements\"\n aria-labelledby=\"rtsee-story-details-characters-heading\"\n >\n <header 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 aria-hidden=\"true\"\n >\n <path d=\"M17 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2\" />\n <circle cx=\"9\" cy=\"7\" r=\"4\" />\n <path d=\"M23 21v-2a4 4 0 0 0-3-3.87\" />\n <path d=\"M16 3.13a4 4 0 0 1 0 7.75\" />\n </svg>\n <h2 id=\"rtsee-story-details-characters-heading\">\n {{ presentation.labels[RTSeeTextLabelKeys.CHARACTERS_LABEL] }}\n </h2>\n </header>\n <ul class=\"rtsee-story-details-elements-grid\" role=\"list\">\n @for (character of story.characters; track character.id) {\n <li class=\"rtsee-story-details-elements-item\">\n <rtsee-story-element-thumbnail\n [name]=\"character.name\"\n [description]=\"character.description\"\n [imageUrl]=\"character.imageUrl\"\n itemProp=\"character\"\n schemaType=\"Person\"\n [showMoreLabel]=\"presentation.labels[RTSeeTextLabelKeys.SHOW_MORE_LABEL]\"\n [showLessLabel]=\"presentation.labels[RTSeeTextLabelKeys.SHOW_LESS_LABEL]\"\n ></rtsee-story-element-thumbnail>\n </li>\n }\n </ul>\n </section>\n }\n\n <!-- Artifacts -->\n @if (story.artifacts.length) {\n <section\n class=\"rtsee-story-details-elements\"\n aria-labelledby=\"rtsee-story-details-artifacts-heading\"\n >\n <header 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 aria-hidden=\"true\"\n >\n <path d=\"M6 3h12l4 6-10 13L2 9z\" />\n <path d=\"M11 3 8 9l4 13 4-13-3-6\" />\n <path d=\"M2 9h20\" />\n </svg>\n <h2 id=\"rtsee-story-details-artifacts-heading\">\n {{ presentation.labels[RTSeeTextLabelKeys.ARTIFACTS_LABEL] }}\n </h2>\n </header>\n <ul class=\"rtsee-story-details-elements-grid\" role=\"list\">\n @for (artifact of story.artifacts; track artifact.id) {\n <li class=\"rtsee-story-details-elements-item\">\n <rtsee-story-element-thumbnail\n [name]=\"artifact.name\"\n [description]=\"artifact.description\"\n [imageUrl]=\"artifact.imageUrl\"\n itemProp=\"mentions\"\n schemaType=\"Thing\"\n [showMoreLabel]=\"presentation.labels[RTSeeTextLabelKeys.SHOW_MORE_LABEL]\"\n [showLessLabel]=\"presentation.labels[RTSeeTextLabelKeys.SHOW_LESS_LABEL]\"\n ></rtsee-story-element-thumbnail>\n </li>\n }\n </ul>\n </section>\n }\n\n <!-- Places -->\n @if (story.locations.length) {\n <section\n class=\"rtsee-story-details-elements\"\n aria-labelledby=\"rtsee-story-details-places-heading\"\n >\n <header 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 aria-hidden=\"true\"\n >\n <path d=\"M21 10c0 7-9 13-9 13s-9-6-9-13a9 9 0 0 1 18 0z\" />\n <circle cx=\"12\" cy=\"10\" r=\"3\" />\n </svg>\n <h2 id=\"rtsee-story-details-places-heading\">\n {{ presentation.labels[RTSeeTextLabelKeys.LOCATIONS_LABEL] }}\n </h2>\n </header>\n <ul class=\"rtsee-story-details-elements-grid\" role=\"list\">\n @for (place of story.locations; track place.id) {\n <li class=\"rtsee-story-details-elements-item\">\n <rtsee-story-element-thumbnail\n [name]=\"place.name\"\n [description]=\"place.description\"\n [imageUrl]=\"place.imageUrl\"\n itemProp=\"contentLocation\"\n schemaType=\"Place\"\n [showMoreLabel]=\"presentation.labels[RTSeeTextLabelKeys.SHOW_MORE_LABEL]\"\n [showLessLabel]=\"presentation.labels[RTSeeTextLabelKeys.SHOW_LESS_LABEL]\"\n ></rtsee-story-element-thumbnail>\n </li>\n }\n </ul>\n </section>\n }\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", "isFramed"] }, { 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"] }, { kind: "component", type: StoryElementThumbnailComponent, selector: "rtsee-story-element-thumbnail", inputs: ["name", "description", "imageUrl", "itemProp", "schemaType", "horizontal", "showMoreLabel", "showLessLabel"] }, { kind: "component", type: StorySlidesPreviewComponent, selector: "rtsee-story-slides-preview", inputs: ["story", "slidesLabel", "minuteLabel", "count"] }] }); }
|
|
8276
|
+
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\n class=\"rtsee-story-details\"\n itemscope\n itemtype=\"https://schema.org/Book\"\n>\n @if (story.imageUrl) {\n <meta itemprop=\"image\" [attr.content]=\"story.imageUrl\" />\n }\n @if (story.languageKey) {\n <meta itemprop=\"inLanguage\" [attr.content]=\"story.languageKey === 'ua' ? 'uk' : 'en'\" />\n }\n @if (story.totalSlides) {\n <meta itemprop=\"numberOfPages\" [attr.content]=\"story.totalSlides\" />\n }\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 && false) {\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\" itemprop=\"name\">{{ story.name }}</h1>\n\n <div class=\"rtsee-story-details-cover-meta\">\n @if (story.rating && story.rating > 0) {\n <div\n class=\"rtsee-story-details-cover-rating\"\n itemprop=\"aggregateRating\"\n itemscope\n itemtype=\"https://schema.org/AggregateRating\"\n >\n <meta itemprop=\"bestRating\" content=\"5\" />\n <meta itemprop=\"worstRating\" content=\"1\" />\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\" itemprop=\"ratingValue\">{{\n story.rating\n }}</span>\n <meta itemprop=\"ratingCount\" [attr.content]=\"story.ratesCount || 1\" />\n <span class=\"rtsee-story-details-rating-count\">\n <span>(</span>\n <span>{{ presentation.labels[RTSeeTextLabelKeys.FEEDBACKS_LABEL] }}:</span>\n <span> </span>\n <span itemprop=\"reviewCount\">{{ story.ratesCount || 1 }}</span>\n <span>)</span>\n </span\n >\n </div>\n }\n </div>\n </div>\n </section>\n\n <!-- CONTENT AREA -->\n <div class=\"rtsee-story-details-content-wrapper\">\n <!-- Reading panel: what the user is about to read + the main CTA -->\n <section class=\"rtsee-story-details-reading-panel\" aria-label=\"{{ story.name }}\">\n @if (story.totalSlides) {\n <rtsee-story-slides-preview\n [story]=\"story\"\n [slidesLabel]=\"presentation.labels[RTSeeTextLabelKeys.STORY_PAGES_LABEL]\"\n [minuteLabel]=\"presentation.labels[RTSeeTextLabelKeys.MINUTE_LABEL]\"\n ></rtsee-story-slides-preview>\n }\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 icon=\"pi pi-book\"\n iconPos=\"left\"\n class=\"rtsee-story-details-start-reading rts-action-button\"\n >\n </p-button>\n </section>\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\" itemprop=\"description\">\n {{ story.description }}\n </p>\n </article>\n\n @if (story.history) {\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 <circle cx=\"12\" cy=\"12\" r=\"10\" />\n <polyline points=\"12 6 12 12 14 14\" />\n </svg>\n <h2>{{presentation.labels[RTSeeTextLabelKeys.STORY_HISTORY_LABEL]}}</h2>\n </div>\n <p class=\"rtsee-story-details-glass-card-text\" itemprop=\"backstory\">\n {{ story.history }}\n </p>\n </article>\n }\n\n @if (story.moralMeaning) {\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=\"M12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z\" />\n </svg>\n <h2>{{presentation.labels[RTSeeTextLabelKeys.STORY_MORAL_LABEL]}}</h2>\n </div>\n <p class=\"rtsee-story-details-glass-card-text\" itemprop=\"teaches\">\n {{ story.moralMeaning }}\n </p>\n </article>\n }\n </div>\n\n <!-- Author -->\n @if (story.author) {\n <section\n class=\"rtsee-story-details-elements\"\n aria-labelledby=\"rtsee-story-details-author-heading\"\n >\n <header 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 aria-hidden=\"true\"\n >\n <path d=\"M12 20h9\" />\n <path d=\"M16.5 3.5a2.121 2.121 0 0 1 3 3L7 19l-4 1 1-4L16.5 3.5z\" />\n </svg>\n <h2 id=\"rtsee-story-details-author-heading\">\n {{ presentation.labels[RTSeeTextLabelKeys.STORY_AUTHOR_LABEL] }}\n </h2>\n </header>\n <div class=\"rtsee-story-details-elements-featured\">\n <rtsee-story-element-thumbnail\n [name]=\"story.author.name\"\n [description]=\"story.author.description\"\n [imageUrl]=\"story.author.imageUrl\"\n itemProp=\"author\"\n schemaType=\"Person\"\n [horizontal]=\"true\"\n [showMoreLabel]=\"presentation.labels[RTSeeTextLabelKeys.SHOW_MORE_LABEL]\"\n [showLessLabel]=\"presentation.labels[RTSeeTextLabelKeys.SHOW_LESS_LABEL]\"\n ></rtsee-story-element-thumbnail>\n </div>\n </section>\n }\n\n <!-- Characters -->\n @if (story.characters.length) {\n <section\n class=\"rtsee-story-details-elements\"\n aria-labelledby=\"rtsee-story-details-characters-heading\"\n >\n <header 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 aria-hidden=\"true\"\n >\n <path d=\"M17 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2\" />\n <circle cx=\"9\" cy=\"7\" r=\"4\" />\n <path d=\"M23 21v-2a4 4 0 0 0-3-3.87\" />\n <path d=\"M16 3.13a4 4 0 0 1 0 7.75\" />\n </svg>\n <h2 id=\"rtsee-story-details-characters-heading\">\n {{ presentation.labels[RTSeeTextLabelKeys.CHARACTERS_LABEL] }}\n </h2>\n </header>\n <ul class=\"rtsee-story-details-elements-grid\" role=\"list\">\n @for (character of story.characters; track character.id) {\n <li class=\"rtsee-story-details-elements-item\">\n <rtsee-story-element-thumbnail\n [name]=\"character.name\"\n [description]=\"character.description\"\n [imageUrl]=\"character.imageUrl\"\n itemProp=\"character\"\n schemaType=\"Person\"\n [showMoreLabel]=\"presentation.labels[RTSeeTextLabelKeys.SHOW_MORE_LABEL]\"\n [showLessLabel]=\"presentation.labels[RTSeeTextLabelKeys.SHOW_LESS_LABEL]\"\n ></rtsee-story-element-thumbnail>\n </li>\n }\n </ul>\n </section>\n }\n\n <!-- Artifacts -->\n @if (story.artifacts.length) {\n <section\n class=\"rtsee-story-details-elements\"\n aria-labelledby=\"rtsee-story-details-artifacts-heading\"\n >\n <header 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 aria-hidden=\"true\"\n >\n <path d=\"M6 3h12l4 6-10 13L2 9z\" />\n <path d=\"M11 3 8 9l4 13 4-13-3-6\" />\n <path d=\"M2 9h20\" />\n </svg>\n <h2 id=\"rtsee-story-details-artifacts-heading\">\n {{ presentation.labels[RTSeeTextLabelKeys.ARTIFACTS_LABEL] }}\n </h2>\n </header>\n <ul class=\"rtsee-story-details-elements-grid\" role=\"list\">\n @for (artifact of story.artifacts; track artifact.id) {\n <li class=\"rtsee-story-details-elements-item\">\n <rtsee-story-element-thumbnail\n [name]=\"artifact.name\"\n [description]=\"artifact.description\"\n [imageUrl]=\"artifact.imageUrl\"\n itemProp=\"mentions\"\n schemaType=\"Thing\"\n [showMoreLabel]=\"presentation.labels[RTSeeTextLabelKeys.SHOW_MORE_LABEL]\"\n [showLessLabel]=\"presentation.labels[RTSeeTextLabelKeys.SHOW_LESS_LABEL]\"\n ></rtsee-story-element-thumbnail>\n </li>\n }\n </ul>\n </section>\n }\n\n <!-- Places -->\n @if (story.locations.length) {\n <section\n class=\"rtsee-story-details-elements\"\n aria-labelledby=\"rtsee-story-details-places-heading\"\n >\n <header 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 aria-hidden=\"true\"\n >\n <path d=\"M21 10c0 7-9 13-9 13s-9-6-9-13a9 9 0 0 1 18 0z\" />\n <circle cx=\"12\" cy=\"10\" r=\"3\" />\n </svg>\n <h2 id=\"rtsee-story-details-places-heading\">\n {{ presentation.labels[RTSeeTextLabelKeys.LOCATIONS_LABEL] }}\n </h2>\n </header>\n <ul class=\"rtsee-story-details-elements-grid\" role=\"list\">\n @for (place of story.locations; track place.id) {\n <li class=\"rtsee-story-details-elements-item\">\n <rtsee-story-element-thumbnail\n [name]=\"place.name\"\n [description]=\"place.description\"\n [imageUrl]=\"place.imageUrl\"\n itemProp=\"contentLocation\"\n schemaType=\"Place\"\n [showMoreLabel]=\"presentation.labels[RTSeeTextLabelKeys.SHOW_MORE_LABEL]\"\n [showLessLabel]=\"presentation.labels[RTSeeTextLabelKeys.SHOW_LESS_LABEL]\"\n ></rtsee-story-element-thumbnail>\n </li>\n }\n </ul>\n </section>\n }\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", "isFramed"] }, { 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"] }, { kind: "component", type: StoryElementThumbnailComponent, selector: "rtsee-story-element-thumbnail", inputs: ["name", "description", "imageUrl", "itemProp", "schemaType", "horizontal", "showMoreLabel", "showLessLabel"] }, { kind: "component", type: StorySlidesPreviewComponent, selector: "rtsee-story-slides-preview", inputs: ["story", "slidesLabel", "minuteLabel", "count"] }] }); }
|
|
8248
8277
|
}
|
|
8249
8278
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: StoryDetailsComponent, decorators: [{
|
|
8250
8279
|
type: Component,
|
|
8251
|
-
args: [{ selector: 'rtsee-story-details', imports: [Chip, Tag, Button, ChatComponent, RtseeEntityPreviewComponent, RouterLink, StoryElementThumbnailComponent, StorySlidesPreviewComponent], template: "<div\n class=\"rtsee-story-details\"\n itemscope\n itemtype=\"https://schema.org/ShortStory\"\n>\n @if (story.imageUrl) {\n <meta itemprop=\"image\" [attr.content]=\"story.imageUrl\" />\n }\n @if (story.languageKey) {\n <meta itemprop=\"inLanguage\" [attr.content]=\"story.languageKey === 'ua' ? 'uk' : 'en'\" />\n }\n @if (story.totalSlides) {\n <meta itemprop=\"numberOfPages\" [attr.content]=\"story.totalSlides\" />\n }\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 && false) {\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\" itemprop=\"name\">{{ story.name }}</h1>\n\n <div class=\"rtsee-story-details-cover-meta\">\n @if (story.rating !== null) {\n <div\n class=\"rtsee-story-details-cover-rating\"\n itemprop=\"aggregateRating\"\n itemscope\n itemtype=\"https://schema.org/AggregateRating\"\n >\n <meta itemprop=\"bestRating\" content=\"5\" />\n <meta itemprop=\"worstRating\" content=\"1\" />\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\" itemprop=\"ratingValue\">{{\n story.rating\n }}</span>\n @if (story.ratesCount !== null) {\n <meta itemprop=\"ratingCount\" [attr.content]=\"story.ratesCount\" />\n <span class=\"rtsee-story-details-rating-count\">\n <span>(</span>\n <span>{{ presentation.labels[RTSeeTextLabelKeys.FEEDBACKS_LABEL] }}:</span>\n <span> </span>\n <span itemprop=\"reviewCount\">{{ story.ratesCount }}</span>\n <span>)</span>\n </span\n >\n }\n </div>\n }\n </div>\n </div>\n </section>\n\n <!-- CONTENT AREA -->\n <div class=\"rtsee-story-details-content-wrapper\">\n <!-- Reading panel: what the user is about to read + the main CTA -->\n <section class=\"rtsee-story-details-reading-panel\" aria-label=\"{{ story.name }}\">\n @if (story.totalSlides) {\n <rtsee-story-slides-preview\n [story]=\"story\"\n [slidesLabel]=\"presentation.labels[RTSeeTextLabelKeys.STORY_PAGES_LABEL]\"\n [minuteLabel]=\"presentation.labels[RTSeeTextLabelKeys.MINUTE_LABEL]\"\n ></rtsee-story-slides-preview>\n }\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 icon=\"pi pi-book\"\n iconPos=\"left\"\n class=\"rtsee-story-details-start-reading rts-action-button\"\n >\n </p-button>\n </section>\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\" itemprop=\"description\">\n {{ story.description }}\n </p>\n </article>\n\n @if (story.history) {\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 <circle cx=\"12\" cy=\"12\" r=\"10\" />\n <polyline points=\"12 6 12 12 14 14\" />\n </svg>\n <h2>{{presentation.labels[RTSeeTextLabelKeys.STORY_HISTORY_LABEL]}}</h2>\n </div>\n <p class=\"rtsee-story-details-glass-card-text\" itemprop=\"backstory\">\n {{ story.history }}\n </p>\n </article>\n }\n\n @if (story.moralMeaning) {\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=\"M12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z\" />\n </svg>\n <h2>{{presentation.labels[RTSeeTextLabelKeys.STORY_MORAL_LABEL]}}</h2>\n </div>\n <p class=\"rtsee-story-details-glass-card-text\" itemprop=\"teaches\">\n {{ story.moralMeaning }}\n </p>\n </article>\n }\n </div>\n\n <!-- Author -->\n @if (story.author) {\n <section\n class=\"rtsee-story-details-elements\"\n aria-labelledby=\"rtsee-story-details-author-heading\"\n >\n <header 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 aria-hidden=\"true\"\n >\n <path d=\"M12 20h9\" />\n <path d=\"M16.5 3.5a2.121 2.121 0 0 1 3 3L7 19l-4 1 1-4L16.5 3.5z\" />\n </svg>\n <h2 id=\"rtsee-story-details-author-heading\">\n {{ presentation.labels[RTSeeTextLabelKeys.STORY_AUTHOR_LABEL] }}\n </h2>\n </header>\n <div class=\"rtsee-story-details-elements-featured\">\n <rtsee-story-element-thumbnail\n [name]=\"story.author.name\"\n [description]=\"story.author.description\"\n [imageUrl]=\"story.author.imageUrl\"\n itemProp=\"author\"\n schemaType=\"Person\"\n [horizontal]=\"true\"\n [showMoreLabel]=\"presentation.labels[RTSeeTextLabelKeys.SHOW_MORE_LABEL]\"\n [showLessLabel]=\"presentation.labels[RTSeeTextLabelKeys.SHOW_LESS_LABEL]\"\n ></rtsee-story-element-thumbnail>\n </div>\n </section>\n }\n\n <!-- Characters -->\n @if (story.characters.length) {\n <section\n class=\"rtsee-story-details-elements\"\n aria-labelledby=\"rtsee-story-details-characters-heading\"\n >\n <header 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 aria-hidden=\"true\"\n >\n <path d=\"M17 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2\" />\n <circle cx=\"9\" cy=\"7\" r=\"4\" />\n <path d=\"M23 21v-2a4 4 0 0 0-3-3.87\" />\n <path d=\"M16 3.13a4 4 0 0 1 0 7.75\" />\n </svg>\n <h2 id=\"rtsee-story-details-characters-heading\">\n {{ presentation.labels[RTSeeTextLabelKeys.CHARACTERS_LABEL] }}\n </h2>\n </header>\n <ul class=\"rtsee-story-details-elements-grid\" role=\"list\">\n @for (character of story.characters; track character.id) {\n <li class=\"rtsee-story-details-elements-item\">\n <rtsee-story-element-thumbnail\n [name]=\"character.name\"\n [description]=\"character.description\"\n [imageUrl]=\"character.imageUrl\"\n itemProp=\"character\"\n schemaType=\"Person\"\n [showMoreLabel]=\"presentation.labels[RTSeeTextLabelKeys.SHOW_MORE_LABEL]\"\n [showLessLabel]=\"presentation.labels[RTSeeTextLabelKeys.SHOW_LESS_LABEL]\"\n ></rtsee-story-element-thumbnail>\n </li>\n }\n </ul>\n </section>\n }\n\n <!-- Artifacts -->\n @if (story.artifacts.length) {\n <section\n class=\"rtsee-story-details-elements\"\n aria-labelledby=\"rtsee-story-details-artifacts-heading\"\n >\n <header 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 aria-hidden=\"true\"\n >\n <path d=\"M6 3h12l4 6-10 13L2 9z\" />\n <path d=\"M11 3 8 9l4 13 4-13-3-6\" />\n <path d=\"M2 9h20\" />\n </svg>\n <h2 id=\"rtsee-story-details-artifacts-heading\">\n {{ presentation.labels[RTSeeTextLabelKeys.ARTIFACTS_LABEL] }}\n </h2>\n </header>\n <ul class=\"rtsee-story-details-elements-grid\" role=\"list\">\n @for (artifact of story.artifacts; track artifact.id) {\n <li class=\"rtsee-story-details-elements-item\">\n <rtsee-story-element-thumbnail\n [name]=\"artifact.name\"\n [description]=\"artifact.description\"\n [imageUrl]=\"artifact.imageUrl\"\n itemProp=\"mentions\"\n schemaType=\"Thing\"\n [showMoreLabel]=\"presentation.labels[RTSeeTextLabelKeys.SHOW_MORE_LABEL]\"\n [showLessLabel]=\"presentation.labels[RTSeeTextLabelKeys.SHOW_LESS_LABEL]\"\n ></rtsee-story-element-thumbnail>\n </li>\n }\n </ul>\n </section>\n }\n\n <!-- Places -->\n @if (story.locations.length) {\n <section\n class=\"rtsee-story-details-elements\"\n aria-labelledby=\"rtsee-story-details-places-heading\"\n >\n <header 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 aria-hidden=\"true\"\n >\n <path d=\"M21 10c0 7-9 13-9 13s-9-6-9-13a9 9 0 0 1 18 0z\" />\n <circle cx=\"12\" cy=\"10\" r=\"3\" />\n </svg>\n <h2 id=\"rtsee-story-details-places-heading\">\n {{ presentation.labels[RTSeeTextLabelKeys.LOCATIONS_LABEL] }}\n </h2>\n </header>\n <ul class=\"rtsee-story-details-elements-grid\" role=\"list\">\n @for (place of story.locations; track place.id) {\n <li class=\"rtsee-story-details-elements-item\">\n <rtsee-story-element-thumbnail\n [name]=\"place.name\"\n [description]=\"place.description\"\n [imageUrl]=\"place.imageUrl\"\n itemProp=\"contentLocation\"\n schemaType=\"Place\"\n [showMoreLabel]=\"presentation.labels[RTSeeTextLabelKeys.SHOW_MORE_LABEL]\"\n [showLessLabel]=\"presentation.labels[RTSeeTextLabelKeys.SHOW_LESS_LABEL]\"\n ></rtsee-story-element-thumbnail>\n </li>\n }\n </ul>\n </section>\n }\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" }]
|
|
8280
|
+
args: [{ selector: 'rtsee-story-details', imports: [Chip, Tag, Button, ChatComponent, RtseeEntityPreviewComponent, RouterLink, StoryElementThumbnailComponent, StorySlidesPreviewComponent], template: "<div\n class=\"rtsee-story-details\"\n itemscope\n itemtype=\"https://schema.org/Book\"\n>\n @if (story.imageUrl) {\n <meta itemprop=\"image\" [attr.content]=\"story.imageUrl\" />\n }\n @if (story.languageKey) {\n <meta itemprop=\"inLanguage\" [attr.content]=\"story.languageKey === 'ua' ? 'uk' : 'en'\" />\n }\n @if (story.totalSlides) {\n <meta itemprop=\"numberOfPages\" [attr.content]=\"story.totalSlides\" />\n }\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 && false) {\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\" itemprop=\"name\">{{ story.name }}</h1>\n\n <div class=\"rtsee-story-details-cover-meta\">\n @if (story.rating && story.rating > 0) {\n <div\n class=\"rtsee-story-details-cover-rating\"\n itemprop=\"aggregateRating\"\n itemscope\n itemtype=\"https://schema.org/AggregateRating\"\n >\n <meta itemprop=\"bestRating\" content=\"5\" />\n <meta itemprop=\"worstRating\" content=\"1\" />\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\" itemprop=\"ratingValue\">{{\n story.rating\n }}</span>\n <meta itemprop=\"ratingCount\" [attr.content]=\"story.ratesCount || 1\" />\n <span class=\"rtsee-story-details-rating-count\">\n <span>(</span>\n <span>{{ presentation.labels[RTSeeTextLabelKeys.FEEDBACKS_LABEL] }}:</span>\n <span> </span>\n <span itemprop=\"reviewCount\">{{ story.ratesCount || 1 }}</span>\n <span>)</span>\n </span\n >\n </div>\n }\n </div>\n </div>\n </section>\n\n <!-- CONTENT AREA -->\n <div class=\"rtsee-story-details-content-wrapper\">\n <!-- Reading panel: what the user is about to read + the main CTA -->\n <section class=\"rtsee-story-details-reading-panel\" aria-label=\"{{ story.name }}\">\n @if (story.totalSlides) {\n <rtsee-story-slides-preview\n [story]=\"story\"\n [slidesLabel]=\"presentation.labels[RTSeeTextLabelKeys.STORY_PAGES_LABEL]\"\n [minuteLabel]=\"presentation.labels[RTSeeTextLabelKeys.MINUTE_LABEL]\"\n ></rtsee-story-slides-preview>\n }\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 icon=\"pi pi-book\"\n iconPos=\"left\"\n class=\"rtsee-story-details-start-reading rts-action-button\"\n >\n </p-button>\n </section>\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\" itemprop=\"description\">\n {{ story.description }}\n </p>\n </article>\n\n @if (story.history) {\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 <circle cx=\"12\" cy=\"12\" r=\"10\" />\n <polyline points=\"12 6 12 12 14 14\" />\n </svg>\n <h2>{{presentation.labels[RTSeeTextLabelKeys.STORY_HISTORY_LABEL]}}</h2>\n </div>\n <p class=\"rtsee-story-details-glass-card-text\" itemprop=\"backstory\">\n {{ story.history }}\n </p>\n </article>\n }\n\n @if (story.moralMeaning) {\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=\"M12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z\" />\n </svg>\n <h2>{{presentation.labels[RTSeeTextLabelKeys.STORY_MORAL_LABEL]}}</h2>\n </div>\n <p class=\"rtsee-story-details-glass-card-text\" itemprop=\"teaches\">\n {{ story.moralMeaning }}\n </p>\n </article>\n }\n </div>\n\n <!-- Author -->\n @if (story.author) {\n <section\n class=\"rtsee-story-details-elements\"\n aria-labelledby=\"rtsee-story-details-author-heading\"\n >\n <header 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 aria-hidden=\"true\"\n >\n <path d=\"M12 20h9\" />\n <path d=\"M16.5 3.5a2.121 2.121 0 0 1 3 3L7 19l-4 1 1-4L16.5 3.5z\" />\n </svg>\n <h2 id=\"rtsee-story-details-author-heading\">\n {{ presentation.labels[RTSeeTextLabelKeys.STORY_AUTHOR_LABEL] }}\n </h2>\n </header>\n <div class=\"rtsee-story-details-elements-featured\">\n <rtsee-story-element-thumbnail\n [name]=\"story.author.name\"\n [description]=\"story.author.description\"\n [imageUrl]=\"story.author.imageUrl\"\n itemProp=\"author\"\n schemaType=\"Person\"\n [horizontal]=\"true\"\n [showMoreLabel]=\"presentation.labels[RTSeeTextLabelKeys.SHOW_MORE_LABEL]\"\n [showLessLabel]=\"presentation.labels[RTSeeTextLabelKeys.SHOW_LESS_LABEL]\"\n ></rtsee-story-element-thumbnail>\n </div>\n </section>\n }\n\n <!-- Characters -->\n @if (story.characters.length) {\n <section\n class=\"rtsee-story-details-elements\"\n aria-labelledby=\"rtsee-story-details-characters-heading\"\n >\n <header 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 aria-hidden=\"true\"\n >\n <path d=\"M17 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2\" />\n <circle cx=\"9\" cy=\"7\" r=\"4\" />\n <path d=\"M23 21v-2a4 4 0 0 0-3-3.87\" />\n <path d=\"M16 3.13a4 4 0 0 1 0 7.75\" />\n </svg>\n <h2 id=\"rtsee-story-details-characters-heading\">\n {{ presentation.labels[RTSeeTextLabelKeys.CHARACTERS_LABEL] }}\n </h2>\n </header>\n <ul class=\"rtsee-story-details-elements-grid\" role=\"list\">\n @for (character of story.characters; track character.id) {\n <li class=\"rtsee-story-details-elements-item\">\n <rtsee-story-element-thumbnail\n [name]=\"character.name\"\n [description]=\"character.description\"\n [imageUrl]=\"character.imageUrl\"\n itemProp=\"character\"\n schemaType=\"Person\"\n [showMoreLabel]=\"presentation.labels[RTSeeTextLabelKeys.SHOW_MORE_LABEL]\"\n [showLessLabel]=\"presentation.labels[RTSeeTextLabelKeys.SHOW_LESS_LABEL]\"\n ></rtsee-story-element-thumbnail>\n </li>\n }\n </ul>\n </section>\n }\n\n <!-- Artifacts -->\n @if (story.artifacts.length) {\n <section\n class=\"rtsee-story-details-elements\"\n aria-labelledby=\"rtsee-story-details-artifacts-heading\"\n >\n <header 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 aria-hidden=\"true\"\n >\n <path d=\"M6 3h12l4 6-10 13L2 9z\" />\n <path d=\"M11 3 8 9l4 13 4-13-3-6\" />\n <path d=\"M2 9h20\" />\n </svg>\n <h2 id=\"rtsee-story-details-artifacts-heading\">\n {{ presentation.labels[RTSeeTextLabelKeys.ARTIFACTS_LABEL] }}\n </h2>\n </header>\n <ul class=\"rtsee-story-details-elements-grid\" role=\"list\">\n @for (artifact of story.artifacts; track artifact.id) {\n <li class=\"rtsee-story-details-elements-item\">\n <rtsee-story-element-thumbnail\n [name]=\"artifact.name\"\n [description]=\"artifact.description\"\n [imageUrl]=\"artifact.imageUrl\"\n itemProp=\"mentions\"\n schemaType=\"Thing\"\n [showMoreLabel]=\"presentation.labels[RTSeeTextLabelKeys.SHOW_MORE_LABEL]\"\n [showLessLabel]=\"presentation.labels[RTSeeTextLabelKeys.SHOW_LESS_LABEL]\"\n ></rtsee-story-element-thumbnail>\n </li>\n }\n </ul>\n </section>\n }\n\n <!-- Places -->\n @if (story.locations.length) {\n <section\n class=\"rtsee-story-details-elements\"\n aria-labelledby=\"rtsee-story-details-places-heading\"\n >\n <header 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 aria-hidden=\"true\"\n >\n <path d=\"M21 10c0 7-9 13-9 13s-9-6-9-13a9 9 0 0 1 18 0z\" />\n <circle cx=\"12\" cy=\"10\" r=\"3\" />\n </svg>\n <h2 id=\"rtsee-story-details-places-heading\">\n {{ presentation.labels[RTSeeTextLabelKeys.LOCATIONS_LABEL] }}\n </h2>\n </header>\n <ul class=\"rtsee-story-details-elements-grid\" role=\"list\">\n @for (place of story.locations; track place.id) {\n <li class=\"rtsee-story-details-elements-item\">\n <rtsee-story-element-thumbnail\n [name]=\"place.name\"\n [description]=\"place.description\"\n [imageUrl]=\"place.imageUrl\"\n itemProp=\"contentLocation\"\n schemaType=\"Place\"\n [showMoreLabel]=\"presentation.labels[RTSeeTextLabelKeys.SHOW_MORE_LABEL]\"\n [showLessLabel]=\"presentation.labels[RTSeeTextLabelKeys.SHOW_LESS_LABEL]\"\n ></rtsee-story-element-thumbnail>\n </li>\n }\n </ul>\n </section>\n }\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" }]
|
|
8252
8281
|
}], propDecorators: { story: [{
|
|
8253
8282
|
type: Input
|
|
8254
8283
|
}], presentation: [{
|
|
@@ -8354,6 +8383,7 @@ class RTSeeContainerComponent {
|
|
|
8354
8383
|
this.isSidenavExpanded = true;
|
|
8355
8384
|
this.isSidenavContent = false;
|
|
8356
8385
|
this.isSidenavFullScreen = false;
|
|
8386
|
+
this.RTSeeTextLabelKeys = RTSeeTextLabelKeys;
|
|
8357
8387
|
}
|
|
8358
8388
|
ngOnInit() {
|
|
8359
8389
|
this.authService.init(this.auth);
|
|
@@ -8390,7 +8420,7 @@ class RTSeeContainerComponent {
|
|
|
8390
8420
|
this.isSidenavFullScreen = rtseeRoute.fullScreen || false;
|
|
8391
8421
|
}
|
|
8392
8422
|
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 }); }
|
|
8393
|
-
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", "isFramed"] }, { 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"] }] }); }
|
|
8423
|
+
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 && rtsee.messenger.pendingInviteToken && rtsee.activeTab !== 'messenger') {\n <div class=\"rtsee-mobile-invite-popup-wrapper rts-theme-dark\">\n <div class=\"rts-invite-popup-modal\">\n <div class=\"rts-invite-popup-content\">\n <span class=\"material-icons-outlined rts-invite-popup-icon\">mail_outline</span>\n <div class=\"rts-invite-popup-text\">\n @if (rtsee.messenger.pendingInviteInfo?.inviter?.name) {\n <strong>{{ rtsee.messenger.pendingInviteInfo?.inviter?.name }}</strong>\n <span> {{ rtsee.messenger.labels[RTSeeTextLabelKeys.MESSENGER_INVITE_POPUP_TEXT] }}</span>\n @if (rtsee.messenger.pendingInviteInfo?.chat?.name) {\n <span class=\"rts-invite-popup-chat-name\"> ({{ rtsee.messenger.pendingInviteInfo?.chat?.name }})</span>\n }\n } @else {\n <span>{{ rtsee.messenger.labels[RTSeeTextLabelKeys.MESSENGER_INVITE_POPUP_GENERIC_TEXT] }}</span>\n }\n </div>\n </div>\n <div class=\"rts-invite-popup-actions\">\n <button type=\"button\"\n class=\"rts-btn rts-btn-secondary rts-invite-popup-btn\"\n [disabled]=\"rtsee.messenger.inviteJoinInProgress\"\n (click)=\"rtsee.messenger.ignoreChatInvitation()\"\n >\n {{ rtsee.messenger.labels[RTSeeTextLabelKeys.MESSENGER_INVITE_IGNORE_BUTTON] }}\n </button>\n <button type=\"button\"\n class=\"rts-btn rts-btn-primary rts-invite-popup-btn\"\n [disabled]=\"rtsee.messenger.inviteJoinInProgress\"\n (click)=\"rtsee.messenger.acceptChatInvitation()\"\n >\n {{ rtsee.messenger.labels[RTSeeTextLabelKeys.MESSENGER_INVITE_JOIN_BUTTON] }}\n </button>\n </div>\n </div>\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", "isFramed"] }, { 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"] }] }); }
|
|
8394
8424
|
}
|
|
8395
8425
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: RTSeeContainerComponent, decorators: [{
|
|
8396
8426
|
type: Component,
|
|
@@ -8401,7 +8431,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImpor
|
|
|
8401
8431
|
RtseeEventsDashboardComponent,
|
|
8402
8432
|
PresentationComponent,
|
|
8403
8433
|
RtseeNavComponent,
|
|
8404
|
-
], 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" }]
|
|
8434
|
+
], 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 && rtsee.messenger.pendingInviteToken && rtsee.activeTab !== 'messenger') {\n <div class=\"rtsee-mobile-invite-popup-wrapper rts-theme-dark\">\n <div class=\"rts-invite-popup-modal\">\n <div class=\"rts-invite-popup-content\">\n <span class=\"material-icons-outlined rts-invite-popup-icon\">mail_outline</span>\n <div class=\"rts-invite-popup-text\">\n @if (rtsee.messenger.pendingInviteInfo?.inviter?.name) {\n <strong>{{ rtsee.messenger.pendingInviteInfo?.inviter?.name }}</strong>\n <span> {{ rtsee.messenger.labels[RTSeeTextLabelKeys.MESSENGER_INVITE_POPUP_TEXT] }}</span>\n @if (rtsee.messenger.pendingInviteInfo?.chat?.name) {\n <span class=\"rts-invite-popup-chat-name\"> ({{ rtsee.messenger.pendingInviteInfo?.chat?.name }})</span>\n }\n } @else {\n <span>{{ rtsee.messenger.labels[RTSeeTextLabelKeys.MESSENGER_INVITE_POPUP_GENERIC_TEXT] }}</span>\n }\n </div>\n </div>\n <div class=\"rts-invite-popup-actions\">\n <button type=\"button\"\n class=\"rts-btn rts-btn-secondary rts-invite-popup-btn\"\n [disabled]=\"rtsee.messenger.inviteJoinInProgress\"\n (click)=\"rtsee.messenger.ignoreChatInvitation()\"\n >\n {{ rtsee.messenger.labels[RTSeeTextLabelKeys.MESSENGER_INVITE_IGNORE_BUTTON] }}\n </button>\n <button type=\"button\"\n class=\"rts-btn rts-btn-primary rts-invite-popup-btn\"\n [disabled]=\"rtsee.messenger.inviteJoinInProgress\"\n (click)=\"rtsee.messenger.acceptChatInvitation()\"\n >\n {{ rtsee.messenger.labels[RTSeeTextLabelKeys.MESSENGER_INVITE_JOIN_BUTTON] }}\n </button>\n </div>\n </div>\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" }]
|
|
8405
8435
|
}], ctorParameters: () => [{ type: RTSeeAuthService }, { type: i2.Router }], propDecorators: { rtsee: [{
|
|
8406
8436
|
type: Input
|
|
8407
8437
|
}], navigationConfig: [{
|