@rtsee/ngx 0.0.75 → 0.0.76
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/ngx/fesm2022/rtsee-ngx.mjs +116 -14
- package/dist/ngx/fesm2022/rtsee-ngx.mjs.map +1 -1
- package/dist/ngx/index.d.ts +9 -4
- package/dist/ngx/src/lib/theme/messenger/chat.scss +9 -0
- package/dist/ngx/src/lib/theme/presentation/index.scss +1 -0
- package/dist/ngx/src/lib/theme/presentation/story-details.scss +25 -0
- package/package.json +8 -8
|
@@ -37,6 +37,7 @@ import * as i1$3 from 'primeng/autocomplete';
|
|
|
37
37
|
import { AutoCompleteModule } from 'primeng/autocomplete';
|
|
38
38
|
import { OrderList } from 'primeng/orderlist';
|
|
39
39
|
import { Divider } from 'primeng/divider';
|
|
40
|
+
import { ToggleSwitch } from 'primeng/toggleswitch';
|
|
40
41
|
import { Tabs, TabList, Tab, TabPanels, TabPanel } from 'primeng/tabs';
|
|
41
42
|
import { ColorPicker } from 'primeng/colorpicker';
|
|
42
43
|
import { Slider } from 'primeng/slider';
|
|
@@ -669,7 +670,9 @@ class MessagesListComponent {
|
|
|
669
670
|
this.chat.on(RTSeeChatEvents.MESSAGE_ADDED, this.bindScrollFunction);
|
|
670
671
|
}
|
|
671
672
|
ngAfterViewInit() {
|
|
672
|
-
|
|
673
|
+
if (this.chat.isStandalone) {
|
|
674
|
+
return;
|
|
675
|
+
}
|
|
673
676
|
this.scrollToBottom();
|
|
674
677
|
}
|
|
675
678
|
onMessageSent() {
|
|
@@ -696,6 +699,9 @@ class MessagesListComponent {
|
|
|
696
699
|
this.chat.loadRemoteMessages('front');
|
|
697
700
|
}
|
|
698
701
|
scrollToBottom() {
|
|
702
|
+
if (this.chat.isStandalone) {
|
|
703
|
+
return;
|
|
704
|
+
}
|
|
699
705
|
setTimeout(() => {
|
|
700
706
|
this.scroller.scrollToPosition([0, document.body.scrollHeight]);
|
|
701
707
|
if (!this.scrollContainer?.nativeElement?.scrollHeight) {
|
|
@@ -780,18 +786,79 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImpor
|
|
|
780
786
|
args: ['chatInput']
|
|
781
787
|
}] } });
|
|
782
788
|
|
|
789
|
+
class ViewportObserverDirective {
|
|
790
|
+
constructor(element) {
|
|
791
|
+
this.element = element;
|
|
792
|
+
this.inViewport = new EventEmitter();
|
|
793
|
+
}
|
|
794
|
+
ngAfterViewInit() {
|
|
795
|
+
// Options for the observer: 0.2 means 20% of the element must be visible
|
|
796
|
+
// to trigger the callback
|
|
797
|
+
const options = {
|
|
798
|
+
root: null, // observing relative to the document's viewport
|
|
799
|
+
rootMargin: '0px',
|
|
800
|
+
threshold: 0
|
|
801
|
+
};
|
|
802
|
+
this.observer = new IntersectionObserver((entries) => {
|
|
803
|
+
entries.forEach(entry => {
|
|
804
|
+
// entry.isIntersecting is true if the element is in the viewport
|
|
805
|
+
this.inViewport.emit(entry.isIntersecting);
|
|
806
|
+
});
|
|
807
|
+
}, options);
|
|
808
|
+
this.observer.observe(this.element.nativeElement);
|
|
809
|
+
}
|
|
810
|
+
ngOnDestroy() {
|
|
811
|
+
if (this.observer) {
|
|
812
|
+
this.observer.disconnect();
|
|
813
|
+
}
|
|
814
|
+
}
|
|
815
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: ViewportObserverDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
816
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.4", type: ViewportObserverDirective, isStandalone: true, selector: "[rtseeViewportObserver]", outputs: { inViewport: "inViewport" }, ngImport: i0 }); }
|
|
817
|
+
}
|
|
818
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: ViewportObserverDirective, decorators: [{
|
|
819
|
+
type: Directive,
|
|
820
|
+
args: [{
|
|
821
|
+
selector: '[rtseeViewportObserver]',
|
|
822
|
+
standalone: true // Use `standalone: true` in modern Angular
|
|
823
|
+
}]
|
|
824
|
+
}], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { inViewport: [{
|
|
825
|
+
type: Output
|
|
826
|
+
}] } });
|
|
827
|
+
|
|
783
828
|
class ChatComponent {
|
|
829
|
+
onInViewPortChange(value) {
|
|
830
|
+
console.log('Received inViewPortChange', value);
|
|
831
|
+
this.chat.isInViewPort = value;
|
|
832
|
+
}
|
|
833
|
+
ngOnInit() {
|
|
834
|
+
if (!this.chat && !this.chatData) {
|
|
835
|
+
console.log(`Either chat ot chatData is required!`);
|
|
836
|
+
}
|
|
837
|
+
if (!this.chat && this.chatData) {
|
|
838
|
+
this.chat = this.messenger.addStandaloneChat(this.chatData);
|
|
839
|
+
this.chat.loadRemoteMessages('back');
|
|
840
|
+
}
|
|
841
|
+
}
|
|
842
|
+
ngOnDestroy() {
|
|
843
|
+
if (this.chat.isStandalone) {
|
|
844
|
+
this.messenger.removeStandaloneChat(this.chat.id);
|
|
845
|
+
}
|
|
846
|
+
}
|
|
784
847
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: ChatComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
785
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.4", type: ChatComponent, isStandalone: true, selector: "rtsee-chat", inputs: { chat: "chat", messenger: "messenger" }, ngImport: i0, template: "<div class=\"rtsee-chat\">\n <div class=\"rtsee-chat-body-container\">\n <rtsee-messages-list [messenger]=\"messenger\" [chat]=\"chat\"></rtsee-messages-list>\n </div>\n <div class=\"rtsee-chat-footer-container\">\n <div class=\"rtsee-chat-footer-container-inner\">\n <rtsee-chat-input [messenger]=\"messenger\" [chat]=\"chat\"></rtsee-chat-input>\n </div>\n </div>\n</div>\n", dependencies: [{ kind: "component", type: MessagesListComponent, selector: "rtsee-messages-list", inputs: ["chat", "messenger"] }, { kind: "component", type: ChatInputComponent, selector: "rtsee-chat-input", inputs: ["messenger", "chat"] }] }); }
|
|
848
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.4", type: ChatComponent, isStandalone: true, selector: "rtsee-chat", inputs: { chat: "chat", chatData: "chatData", messenger: "messenger" }, ngImport: i0, template: "<div class=\"rtsee-chat\"\n [ngClass]=\"{\n 'rtsee-chat-standalone': chat.isStandalone,\n 'rtsee-chat-in-viewport': chat.isInViewPort\n }\"\n rtseeViewportObserver\n (inViewport)=\"onInViewPortChange($event)\"\n>\n <div class=\"rtsee-chat-body-container\">\n <rtsee-messages-list [messenger]=\"messenger\" [chat]=\"chat\"></rtsee-messages-list>\n </div>\n <div class=\"rtsee-chat-footer-container\">\n <div class=\"rtsee-chat-footer-container-inner\">\n <rtsee-chat-input [messenger]=\"messenger\" [chat]=\"chat\"></rtsee-chat-input>\n </div>\n </div>\n</div>\n", dependencies: [{ kind: "component", type: MessagesListComponent, selector: "rtsee-messages-list", inputs: ["chat", "messenger"] }, { kind: "component", type: ChatInputComponent, selector: "rtsee-chat-input", inputs: ["messenger", "chat"] }, { kind: "directive", type: ViewportObserverDirective, selector: "[rtseeViewportObserver]", outputs: ["inViewport"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] }); }
|
|
786
849
|
}
|
|
787
850
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: ChatComponent, decorators: [{
|
|
788
851
|
type: Component,
|
|
789
852
|
args: [{ selector: 'rtsee-chat', imports: [
|
|
790
853
|
MessagesListComponent,
|
|
791
|
-
ChatInputComponent
|
|
792
|
-
|
|
854
|
+
ChatInputComponent,
|
|
855
|
+
ViewportObserverDirective,
|
|
856
|
+
NgClass
|
|
857
|
+
], standalone: true, template: "<div class=\"rtsee-chat\"\n [ngClass]=\"{\n 'rtsee-chat-standalone': chat.isStandalone,\n 'rtsee-chat-in-viewport': chat.isInViewPort\n }\"\n rtseeViewportObserver\n (inViewport)=\"onInViewPortChange($event)\"\n>\n <div class=\"rtsee-chat-body-container\">\n <rtsee-messages-list [messenger]=\"messenger\" [chat]=\"chat\"></rtsee-messages-list>\n </div>\n <div class=\"rtsee-chat-footer-container\">\n <div class=\"rtsee-chat-footer-container-inner\">\n <rtsee-chat-input [messenger]=\"messenger\" [chat]=\"chat\"></rtsee-chat-input>\n </div>\n </div>\n</div>\n" }]
|
|
793
858
|
}], propDecorators: { chat: [{
|
|
794
859
|
type: Input
|
|
860
|
+
}], chatData: [{
|
|
861
|
+
type: Input
|
|
795
862
|
}], messenger: [{
|
|
796
863
|
type: Input
|
|
797
864
|
}] } });
|
|
@@ -802,7 +869,7 @@ class MessengerComponent {
|
|
|
802
869
|
this.messenger.loadChats();
|
|
803
870
|
}
|
|
804
871
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: MessengerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
805
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", type: MessengerComponent, isStandalone: true, selector: "rtsee-messenger", inputs: { messenger: "messenger" }, ngImport: i0, template: "<div class=\"rtsee-messenger\" [ngClass]=\"{\n 'rtsee-messenger-header-expanded': messenger.openedProfile || messenger.openedChatDetails,\n 'rtsee-messenger-folded': messenger.folded\n}\">\n <div class=\"rtsee-messenger-header-container\">\n <rtsee-messenger-header [messenger]=\"messenger\"\n ></rtsee-messenger-header>\n </div>\n <div class=\"rtsee-messenger-body-container\"\n infiniteScroll\n [infiniteScrollDistance]=\"2\"\n [infiniteScrollThrottle]=\"50\"\n [scrollWindow]=\"false\"\n (scrolled)=\"onScroll()\"\n >\n @if (messenger.openedChat) {\n <rtsee-chat [messenger]=\"messenger\" [chat]=\"messenger.openedChat\"></rtsee-chat>\n } @else if (!messenger.openedChat) {\n <rtsee-chats-list [chats]=\"messenger.chats\" [messenger]=\"messenger\"></rtsee-chats-list>\n } @else if (messenger.openedProfile) {\n <rtsee-profile></rtsee-profile>\n }\n @if (messenger.loadingChatsInProgress) {\n <rtsee-preloader [diameter]=\"50\" ></rtsee-preloader>\n }\n </div>\n</div>\n\n\n", dependencies: [{ kind: "component", type: MessengerHeaderComponent, selector: "rtsee-messenger-header", inputs: ["messenger"] }, { kind: "directive", type: InfiniteScrollDirective, selector: "[infiniteScroll], [infinite-scroll], [data-infinite-scroll]", inputs: ["infiniteScrollDistance", "infiniteScrollUpDistance", "infiniteScrollThrottle", "infiniteScrollDisabled", "infiniteScrollContainer", "scrollWindow", "immediateCheck", "horizontal", "alwaysCallback", "fromRoot"], outputs: ["scrolled", "scrolledUp"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: ChatsListComponent, selector: "rtsee-chats-list", inputs: ["messenger", "chats"] }, { kind: "component", type: ChatComponent, selector: "rtsee-chat", inputs: ["chat", "messenger"] }, { kind: "component", type: PreloaderComponent, selector: "rtsee-preloader", inputs: ["diameter", "color"] }, { kind: "component", type: ProfileComponent, selector: "rtsee-profile", inputs: ["messenger", "peer"] }] }); }
|
|
872
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", type: MessengerComponent, isStandalone: true, selector: "rtsee-messenger", inputs: { messenger: "messenger" }, ngImport: i0, template: "<div class=\"rtsee-messenger\" [ngClass]=\"{\n 'rtsee-messenger-header-expanded': messenger.openedProfile || messenger.openedChatDetails,\n 'rtsee-messenger-folded': messenger.folded\n}\">\n <div class=\"rtsee-messenger-header-container\">\n <rtsee-messenger-header [messenger]=\"messenger\"\n ></rtsee-messenger-header>\n </div>\n <div class=\"rtsee-messenger-body-container\"\n infiniteScroll\n [infiniteScrollDistance]=\"2\"\n [infiniteScrollThrottle]=\"50\"\n [scrollWindow]=\"false\"\n (scrolled)=\"onScroll()\"\n >\n @if (messenger.openedChat) {\n <rtsee-chat [messenger]=\"messenger\" [chat]=\"messenger.openedChat\"></rtsee-chat>\n } @else if (!messenger.openedChat) {\n <rtsee-chats-list [chats]=\"messenger.chats\" [messenger]=\"messenger\"></rtsee-chats-list>\n } @else if (messenger.openedProfile) {\n <rtsee-profile></rtsee-profile>\n }\n @if (messenger.loadingChatsInProgress) {\n <rtsee-preloader [diameter]=\"50\" ></rtsee-preloader>\n }\n </div>\n</div>\n\n\n", dependencies: [{ kind: "component", type: MessengerHeaderComponent, selector: "rtsee-messenger-header", inputs: ["messenger"] }, { kind: "directive", type: InfiniteScrollDirective, selector: "[infiniteScroll], [infinite-scroll], [data-infinite-scroll]", inputs: ["infiniteScrollDistance", "infiniteScrollUpDistance", "infiniteScrollThrottle", "infiniteScrollDisabled", "infiniteScrollContainer", "scrollWindow", "immediateCheck", "horizontal", "alwaysCallback", "fromRoot"], outputs: ["scrolled", "scrolledUp"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: ChatsListComponent, selector: "rtsee-chats-list", inputs: ["messenger", "chats"] }, { kind: "component", type: ChatComponent, selector: "rtsee-chat", inputs: ["chat", "chatData", "messenger"] }, { kind: "component", type: PreloaderComponent, selector: "rtsee-preloader", inputs: ["diameter", "color"] }, { kind: "component", type: ProfileComponent, selector: "rtsee-profile", inputs: ["messenger", "peer"] }] }); }
|
|
806
873
|
}
|
|
807
874
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: MessengerComponent, decorators: [{
|
|
808
875
|
type: Component,
|
|
@@ -1323,7 +1390,9 @@ class ManageStoryComponent {
|
|
|
1323
1390
|
Validators.maxLength(244)
|
|
1324
1391
|
]
|
|
1325
1392
|
}),
|
|
1326
|
-
averageReadTime: this.formBuilder.control(0)
|
|
1393
|
+
averageReadTime: this.formBuilder.control(0),
|
|
1394
|
+
isPublished: this.formBuilder.control(false),
|
|
1395
|
+
isDiscussable: this.formBuilder.control(false)
|
|
1327
1396
|
});
|
|
1328
1397
|
}
|
|
1329
1398
|
submit() {
|
|
@@ -1332,6 +1401,7 @@ class ManageStoryComponent {
|
|
|
1332
1401
|
name: this.nameField.value,
|
|
1333
1402
|
description: this.descriptionField.value,
|
|
1334
1403
|
averageReadTime: this.averageReadTimeField.value,
|
|
1404
|
+
commentsEnabled: this.isDiscussableField.value
|
|
1335
1405
|
});
|
|
1336
1406
|
}
|
|
1337
1407
|
else {
|
|
@@ -1342,6 +1412,8 @@ class ManageStoryComponent {
|
|
|
1342
1412
|
this.nameField.setValue(this.manageStory.story.name);
|
|
1343
1413
|
this.descriptionField.setValue(this.manageStory.story.description || '');
|
|
1344
1414
|
this.averageReadTimeField.setValue(this.manageStory.story.averageReadTime || 0);
|
|
1415
|
+
this.isPublishedField.setValue(this.manageStory.story.isPublished || false);
|
|
1416
|
+
this.isDiscussableField.setValue(this.manageStory.story.commentsEnabled || false);
|
|
1345
1417
|
}
|
|
1346
1418
|
get nameField() {
|
|
1347
1419
|
return this.storyForm.get('name');
|
|
@@ -1352,6 +1424,12 @@ class ManageStoryComponent {
|
|
|
1352
1424
|
get averageReadTimeField() {
|
|
1353
1425
|
return this.storyForm.get('averageReadTime');
|
|
1354
1426
|
}
|
|
1427
|
+
get isPublishedField() {
|
|
1428
|
+
return this.storyForm.get('isPublished');
|
|
1429
|
+
}
|
|
1430
|
+
get isDiscussableField() {
|
|
1431
|
+
return this.storyForm.get('isDiscussable');
|
|
1432
|
+
}
|
|
1355
1433
|
disableFormFields() {
|
|
1356
1434
|
this.nameField.disable();
|
|
1357
1435
|
this.descriptionField.disable();
|
|
@@ -1363,7 +1441,7 @@ class ManageStoryComponent {
|
|
|
1363
1441
|
this.averageReadTimeField.disable();
|
|
1364
1442
|
}
|
|
1365
1443
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: ManageStoryComponent, deps: [{ token: i1.FormBuilder }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1366
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", type: ManageStoryComponent, isStandalone: true, selector: "rtsee-manage-story", inputs: { manageStory: "manageStory" }, ngImport: i0, template: "<div class=\"rtsee-manage-story\">\n @if (!manageStory.manageSlides.selectedSlide) {\n <div class=\"rtsee-manage-story-info rtsee-form-container\">\n <div class=\"rtsee-manage-story-image\">\n <rtsee-image-uploader [imageUploader]=\"manageStory.imageUploader\"\n ></rtsee-image-uploader>\n </div>\n <form class=\"rtsee-story-form rtsee-form\"\n [formGroup]=\"storyForm\"\n (ngSubmit)=\"submit()\"\n >\n <div class=\"rtsee-form-field-container\">\n <p-inputgroup>\n <p-floatlabel variant=\"on\">\n <input id=\"rtsee-story-name-field\"\n class=\"rtsee-form-field\"\n pInputText\n [formControl]=\"nameField\"\n [class.p-invalid]=\"nameField.invalid && nameField.touched\"\n />\n <label for=\"sign-up-email\">Name</label>\n </p-floatlabel>\n </p-inputgroup>\n @if (nameField.hasError('required') && nameField.touched) {\n <p-message class=\"rtsee-form-field-error-message\"\n severity=\"error\"\n variant=\"simple\"\n size=\"small\"\n >Name is required</p-message>\n }\n </div>\n <rtsee-autocomplete [config]=\"manageStory.categoriesMultiselect\"></rtsee-autocomplete>\n <rtsee-autocomplete [config]=\"manageStory.labelsMultiselect\"></rtsee-autocomplete>\n <div class=\"rtsee-form-field-container\">\n <p-inputgroup>\n <p-floatlabel variant=\"on\">\n <textarea [formControl]=\"descriptionField\"\n id=\"rtsee-story-description-field\"\n class=\"rtsee-form-field\"\n rows=\"3\"\n cols=\"30\"\n pTextarea\n [class.p-invalid]=\"descriptionField.invalid && descriptionField.touched\"\n ></textarea>\n <label for=\"rtsee-story-description-field\">Description</label>\n </p-floatlabel>\n </p-inputgroup>\n @if (descriptionField.hasError('required') && descriptionField.touched) {\n <p-message class=\"rtsee-form-field-error-message\"\n severity=\"error\"\n variant=\"simple\"\n size=\"small\"\n >Description is required</p-message>\n }\n </div>\n <div class=\"rtsee-form-field-container\">\n <p-inputgroup>\n <p-floatlabel variant=\"on\">\n <p-input-number [formControl]=\"averageReadTimeField\"\n id=\"rtsee-story-average-read-time\"\n mode=\"decimal\"\n [min]=\"2\"\n [max]=\"10000\"\n />\n <label for=\"rtsee-story-average-read-time\">Average Read Time</label>\n </p-floatlabel>\n </p-inputgroup>\n </div>\n <p-divider />\n <div class=\"rtsee-story-slides-wrapper\">\n <rtsee-manage-slides [manageSlides]=\"manageStory.manageSlides\"></rtsee-manage-slides>\n </div>\n <p-divider />\n <p-button type=\"submit\"\n [label]=\"'Save'\"\n [disabled]=\"manageStory.saveInProgress\"\n />\n <p-button [label]=\"'Cancel'\"\n severity=\"secondary\"\n (click)=\"manageStory.cancel()\"\n [disabled]=\"manageStory.saveInProgress\"\n />\n </form>\n </div>\n }\n @if (manageStory.manageSlides.selectedSlide) {\n <div class=\"rtsee-manage-story-slide-wrapper\">\n <rtsee-manage-slide [manageSlide]=\"manageStory.manageSlides.selectedSlide\"\n ></rtsee-manage-slide>\n </div>\n }\n</div>\n", dependencies: [{ kind: "component", type: FloatLabel, selector: "p-floatlabel, p-floatLabel, p-float-label", inputs: ["variant"] }, { kind: "ngmodule", type: FormsModule }, { 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: "component", type: InputGroup, selector: "p-inputgroup, p-inputGroup, p-input-group", inputs: ["styleClass"] }, { kind: "directive", type: InputText, selector: "[pInputText]", inputs: ["pSize", "variant", "fluid", "invalid"] }, { kind: "component", type: Message, selector: "p-message", inputs: ["severity", "text", "escape", "style", "styleClass", "closable", "icon", "closeIcon", "life", "showTransitionOptions", "hideTransitionOptions", "size", "variant"], outputs: ["onClose"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: Textarea, selector: "[pTextarea], [pInputTextarea]", inputs: ["autoResize", "pSize", "variant", "fluid", "invalid"], outputs: ["onResize"] }, { kind: "component", type: InputNumber, selector: "p-inputNumber, p-inputnumber, p-input-number", inputs: ["showButtons", "format", "buttonLayout", "inputId", "styleClass", "placeholder", "tabindex", "title", "ariaLabelledBy", "ariaDescribedBy", "ariaLabel", "ariaRequired", "autocomplete", "incrementButtonClass", "decrementButtonClass", "incrementButtonIcon", "decrementButtonIcon", "readonly", "allowEmpty", "locale", "localeMatcher", "mode", "currency", "currencyDisplay", "useGrouping", "minFractionDigits", "maxFractionDigits", "prefix", "suffix", "inputStyle", "inputStyleClass", "showClear", "autofocus"], outputs: ["onInput", "onFocus", "onBlur", "onKeyDown", "onClear"] }, { kind: "component", type: RTSeeImageUploaderComponent, selector: "rtsee-image-uploader", inputs: ["imageUploader"] }, { 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: AutocompleteComponent, selector: "rtsee-autocomplete", inputs: ["config"] }, { kind: "component", type: ManageSlidesComponent, selector: "rtsee-manage-slides", inputs: ["manageSlides"] }, { kind: "component", type: ManageSlideComponent, selector: "rtsee-manage-slide", inputs: ["manageSlide"] }, { kind: "component", type: Divider, selector: "p-divider", inputs: ["styleClass", "layout", "type", "align"] }] }); }
|
|
1444
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", type: ManageStoryComponent, isStandalone: true, selector: "rtsee-manage-story", inputs: { manageStory: "manageStory" }, ngImport: i0, template: "<div class=\"rtsee-manage-story\">\n @if (!manageStory.manageSlides.selectedSlide) {\n <div class=\"rtsee-manage-story-info rtsee-form-container\">\n <div class=\"rtsee-manage-story-image\">\n <rtsee-image-uploader [imageUploader]=\"manageStory.imageUploader\"\n ></rtsee-image-uploader>\n </div>\n <form class=\"rtsee-story-form rtsee-form\"\n [formGroup]=\"storyForm\"\n (ngSubmit)=\"submit()\"\n >\n <div class=\"rtsee-form-field-container\">\n <p-inputgroup>\n <p-floatlabel variant=\"on\">\n <input id=\"rtsee-story-name-field\"\n class=\"rtsee-form-field\"\n pInputText\n [formControl]=\"nameField\"\n [class.p-invalid]=\"nameField.invalid && nameField.touched\"\n />\n <label for=\"sign-up-email\">Name</label>\n </p-floatlabel>\n </p-inputgroup>\n @if (nameField.hasError('required') && nameField.touched) {\n <p-message class=\"rtsee-form-field-error-message\"\n severity=\"error\"\n variant=\"simple\"\n size=\"small\"\n >Name is required</p-message>\n }\n </div>\n <rtsee-autocomplete [config]=\"manageStory.categoriesMultiselect\"></rtsee-autocomplete>\n <rtsee-autocomplete [config]=\"manageStory.labelsMultiselect\"></rtsee-autocomplete>\n <div class=\"rtsee-form-field-container\">\n <p-inputgroup>\n <p-floatlabel variant=\"on\">\n <textarea [formControl]=\"descriptionField\"\n id=\"rtsee-story-description-field\"\n class=\"rtsee-form-field\"\n rows=\"3\"\n cols=\"30\"\n pTextarea\n [class.p-invalid]=\"descriptionField.invalid && descriptionField.touched\"\n ></textarea>\n <label for=\"rtsee-story-description-field\">Description</label>\n </p-floatlabel>\n </p-inputgroup>\n @if (descriptionField.hasError('required') && descriptionField.touched) {\n <p-message class=\"rtsee-form-field-error-message\"\n severity=\"error\"\n variant=\"simple\"\n size=\"small\"\n >Description is required</p-message>\n }\n </div>\n <div class=\"rtsee-form-field-container\">\n <p-inputgroup>\n <p-floatlabel variant=\"on\">\n <p-input-number [formControl]=\"averageReadTimeField\"\n id=\"rtsee-story-average-read-time\"\n mode=\"decimal\"\n [min]=\"2\"\n [max]=\"10000\"\n />\n <label for=\"rtsee-story-average-read-time\">Average Read Time</label>\n </p-floatlabel>\n </p-inputgroup>\n <div class=\"rtsee-form-field-container\">\n <p>Published</p>\n <p-toggleswitch name=\"publishing\" formControlName=\"isPublished\"/>\n </div>\n <div class=\"rtsee-form-field-container\">\n <p>Enable Comments</p>\n <p-toggleswitch name=\"publishing\" formControlName=\"isDiscussable\"/>\n </div>\n </div>\n <p-divider />\n <div class=\"rtsee-story-slides-wrapper\">\n <rtsee-manage-slides [manageSlides]=\"manageStory.manageSlides\"></rtsee-manage-slides>\n </div>\n <p-divider />\n <p-button type=\"submit\"\n [label]=\"'Save'\"\n [disabled]=\"manageStory.saveInProgress\"\n />\n <p-button [label]=\"'Cancel'\"\n severity=\"secondary\"\n (click)=\"manageStory.cancel()\"\n [disabled]=\"manageStory.saveInProgress\"\n />\n </form>\n </div>\n }\n @if (manageStory.manageSlides.selectedSlide) {\n <div class=\"rtsee-manage-story-slide-wrapper\">\n <rtsee-manage-slide [manageSlide]=\"manageStory.manageSlides.selectedSlide\"\n ></rtsee-manage-slide>\n </div>\n }\n</div>\n", dependencies: [{ kind: "component", type: FloatLabel, selector: "p-floatlabel, p-floatLabel, p-float-label", inputs: ["variant"] }, { kind: "ngmodule", type: FormsModule }, { 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: "component", type: InputGroup, selector: "p-inputgroup, p-inputGroup, p-input-group", inputs: ["styleClass"] }, { kind: "directive", type: InputText, selector: "[pInputText]", inputs: ["pSize", "variant", "fluid", "invalid"] }, { kind: "component", type: Message, selector: "p-message", inputs: ["severity", "text", "escape", "style", "styleClass", "closable", "icon", "closeIcon", "life", "showTransitionOptions", "hideTransitionOptions", "size", "variant"], outputs: ["onClose"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["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: InputNumber, selector: "p-inputNumber, p-inputnumber, p-input-number", inputs: ["showButtons", "format", "buttonLayout", "inputId", "styleClass", "placeholder", "tabindex", "title", "ariaLabelledBy", "ariaDescribedBy", "ariaLabel", "ariaRequired", "autocomplete", "incrementButtonClass", "decrementButtonClass", "incrementButtonIcon", "decrementButtonIcon", "readonly", "allowEmpty", "locale", "localeMatcher", "mode", "currency", "currencyDisplay", "useGrouping", "minFractionDigits", "maxFractionDigits", "prefix", "suffix", "inputStyle", "inputStyleClass", "showClear", "autofocus"], outputs: ["onInput", "onFocus", "onBlur", "onKeyDown", "onClear"] }, { kind: "component", type: RTSeeImageUploaderComponent, selector: "rtsee-image-uploader", inputs: ["imageUploader"] }, { 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: AutocompleteComponent, selector: "rtsee-autocomplete", inputs: ["config"] }, { kind: "component", type: ManageSlidesComponent, selector: "rtsee-manage-slides", inputs: ["manageSlides"] }, { kind: "component", type: ManageSlideComponent, selector: "rtsee-manage-slide", inputs: ["manageSlide"] }, { kind: "component", type: Divider, selector: "p-divider", inputs: ["styleClass", "layout", "type", "align"] }, { kind: "component", type: ToggleSwitch, selector: "p-toggleswitch, p-toggleSwitch, p-toggle-switch", inputs: ["styleClass", "tabindex", "inputId", "readonly", "trueValue", "falseValue", "ariaLabel", "size", "ariaLabelledBy", "autofocus"], outputs: ["onChange"] }] }); }
|
|
1367
1445
|
}
|
|
1368
1446
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: ManageStoryComponent, decorators: [{
|
|
1369
1447
|
type: Component,
|
|
@@ -1381,8 +1459,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImpor
|
|
|
1381
1459
|
AutocompleteComponent,
|
|
1382
1460
|
ManageSlidesComponent,
|
|
1383
1461
|
ManageSlideComponent,
|
|
1384
|
-
Divider
|
|
1385
|
-
|
|
1462
|
+
Divider,
|
|
1463
|
+
ToggleSwitch
|
|
1464
|
+
], template: "<div class=\"rtsee-manage-story\">\n @if (!manageStory.manageSlides.selectedSlide) {\n <div class=\"rtsee-manage-story-info rtsee-form-container\">\n <div class=\"rtsee-manage-story-image\">\n <rtsee-image-uploader [imageUploader]=\"manageStory.imageUploader\"\n ></rtsee-image-uploader>\n </div>\n <form class=\"rtsee-story-form rtsee-form\"\n [formGroup]=\"storyForm\"\n (ngSubmit)=\"submit()\"\n >\n <div class=\"rtsee-form-field-container\">\n <p-inputgroup>\n <p-floatlabel variant=\"on\">\n <input id=\"rtsee-story-name-field\"\n class=\"rtsee-form-field\"\n pInputText\n [formControl]=\"nameField\"\n [class.p-invalid]=\"nameField.invalid && nameField.touched\"\n />\n <label for=\"sign-up-email\">Name</label>\n </p-floatlabel>\n </p-inputgroup>\n @if (nameField.hasError('required') && nameField.touched) {\n <p-message class=\"rtsee-form-field-error-message\"\n severity=\"error\"\n variant=\"simple\"\n size=\"small\"\n >Name is required</p-message>\n }\n </div>\n <rtsee-autocomplete [config]=\"manageStory.categoriesMultiselect\"></rtsee-autocomplete>\n <rtsee-autocomplete [config]=\"manageStory.labelsMultiselect\"></rtsee-autocomplete>\n <div class=\"rtsee-form-field-container\">\n <p-inputgroup>\n <p-floatlabel variant=\"on\">\n <textarea [formControl]=\"descriptionField\"\n id=\"rtsee-story-description-field\"\n class=\"rtsee-form-field\"\n rows=\"3\"\n cols=\"30\"\n pTextarea\n [class.p-invalid]=\"descriptionField.invalid && descriptionField.touched\"\n ></textarea>\n <label for=\"rtsee-story-description-field\">Description</label>\n </p-floatlabel>\n </p-inputgroup>\n @if (descriptionField.hasError('required') && descriptionField.touched) {\n <p-message class=\"rtsee-form-field-error-message\"\n severity=\"error\"\n variant=\"simple\"\n size=\"small\"\n >Description is required</p-message>\n }\n </div>\n <div class=\"rtsee-form-field-container\">\n <p-inputgroup>\n <p-floatlabel variant=\"on\">\n <p-input-number [formControl]=\"averageReadTimeField\"\n id=\"rtsee-story-average-read-time\"\n mode=\"decimal\"\n [min]=\"2\"\n [max]=\"10000\"\n />\n <label for=\"rtsee-story-average-read-time\">Average Read Time</label>\n </p-floatlabel>\n </p-inputgroup>\n <div class=\"rtsee-form-field-container\">\n <p>Published</p>\n <p-toggleswitch name=\"publishing\" formControlName=\"isPublished\"/>\n </div>\n <div class=\"rtsee-form-field-container\">\n <p>Enable Comments</p>\n <p-toggleswitch name=\"publishing\" formControlName=\"isDiscussable\"/>\n </div>\n </div>\n <p-divider />\n <div class=\"rtsee-story-slides-wrapper\">\n <rtsee-manage-slides [manageSlides]=\"manageStory.manageSlides\"></rtsee-manage-slides>\n </div>\n <p-divider />\n <p-button type=\"submit\"\n [label]=\"'Save'\"\n [disabled]=\"manageStory.saveInProgress\"\n />\n <p-button [label]=\"'Cancel'\"\n severity=\"secondary\"\n (click)=\"manageStory.cancel()\"\n [disabled]=\"manageStory.saveInProgress\"\n />\n </form>\n </div>\n }\n @if (manageStory.manageSlides.selectedSlide) {\n <div class=\"rtsee-manage-story-slide-wrapper\">\n <rtsee-manage-slide [manageSlide]=\"manageStory.manageSlides.selectedSlide\"\n ></rtsee-manage-slide>\n </div>\n }\n</div>\n" }]
|
|
1386
1465
|
}], ctorParameters: () => [{ type: i1.FormBuilder }], propDecorators: { manageStory: [{
|
|
1387
1466
|
type: Input
|
|
1388
1467
|
}] } });
|
|
@@ -1623,10 +1702,30 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImpor
|
|
|
1623
1702
|
type: Input
|
|
1624
1703
|
}] } });
|
|
1625
1704
|
|
|
1705
|
+
class StoryDetailsComponent {
|
|
1706
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: StoryDetailsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1707
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", type: StoryDetailsComponent, isStandalone: true, selector: "rtsee-story-details", inputs: { story: "story", presentation: "presentation", messenger: "messenger" }, ngImport: i0, template: "<div class=\"rtsee-story-details\">\n <div class=\"rtsee-story-details-image-container\">\n <img [src]=\"story.imageUrl\" alt=\"story_image\" class=\"rtsee-story-details-image\">\n <p-button label=\"Start Reading\"\n class=\"rtsee-story-details-start-reading\"\n (click)=\"presentation.setActiveStory(story)\"\n ></p-button>\n <p-button label=\"Close\"\n class=\"rtsee-story-details-close\"\n severity=\"secondary\"\n (click)=\"presentation.closeStoryDetails()\"\n ></p-button>\n </div>\n <div class=\"rtsee-story-details-title\">\n <h1>{{story.name}}</h1>\n </div>\n @if (story.categories?.length) {\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.labels?.length) {\n <div class=\"rtsee-story-details-labels\">\n @for (label of story.labels; track label .id) {\n <p-chip class=\"rtsee-story-details-label\">\n <span class=\"rtsee-story-details-label-left\"\n >{{label.symbol}}</span>\n <span class=\"rtsee-story-details-label-right\"\n >{{label.name}}</span>\n </p-chip>\n }\n </div>\n }\n\n <div class=\"rtsee-story-details-description\">\n <p>{{story.description}}</p>\n </div>\n <div class=\"rtsee-story-details-description-history\">\n </div>\n @if (story.isPublished) {\n <div class=\"rtsee-story-details-feedback\">\n <p>feedback here</p>\n </div>\n } @else if (messenger && story.discussion) {\n <div class=\"rtsee-story-details-votes\">\n <rtsee-chat [messenger]=\"messenger\"\n [chatData]=\"story.discussion\"\n ></rtsee-chat>\n </div>\n }\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", "messenger"] }] }); }
|
|
1708
|
+
}
|
|
1709
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: StoryDetailsComponent, decorators: [{
|
|
1710
|
+
type: Component,
|
|
1711
|
+
args: [{ selector: 'rtsee-story-details', imports: [
|
|
1712
|
+
Chip,
|
|
1713
|
+
Tag,
|
|
1714
|
+
Button,
|
|
1715
|
+
ChatComponent
|
|
1716
|
+
], template: "<div class=\"rtsee-story-details\">\n <div class=\"rtsee-story-details-image-container\">\n <img [src]=\"story.imageUrl\" alt=\"story_image\" class=\"rtsee-story-details-image\">\n <p-button label=\"Start Reading\"\n class=\"rtsee-story-details-start-reading\"\n (click)=\"presentation.setActiveStory(story)\"\n ></p-button>\n <p-button label=\"Close\"\n class=\"rtsee-story-details-close\"\n severity=\"secondary\"\n (click)=\"presentation.closeStoryDetails()\"\n ></p-button>\n </div>\n <div class=\"rtsee-story-details-title\">\n <h1>{{story.name}}</h1>\n </div>\n @if (story.categories?.length) {\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.labels?.length) {\n <div class=\"rtsee-story-details-labels\">\n @for (label of story.labels; track label .id) {\n <p-chip class=\"rtsee-story-details-label\">\n <span class=\"rtsee-story-details-label-left\"\n >{{label.symbol}}</span>\n <span class=\"rtsee-story-details-label-right\"\n >{{label.name}}</span>\n </p-chip>\n }\n </div>\n }\n\n <div class=\"rtsee-story-details-description\">\n <p>{{story.description}}</p>\n </div>\n <div class=\"rtsee-story-details-description-history\">\n </div>\n @if (story.isPublished) {\n <div class=\"rtsee-story-details-feedback\">\n <p>feedback here</p>\n </div>\n } @else if (messenger && story.discussion) {\n <div class=\"rtsee-story-details-votes\">\n <rtsee-chat [messenger]=\"messenger\"\n [chatData]=\"story.discussion\"\n ></rtsee-chat>\n </div>\n }\n</div>\n" }]
|
|
1717
|
+
}], propDecorators: { story: [{
|
|
1718
|
+
type: Input
|
|
1719
|
+
}], presentation: [{
|
|
1720
|
+
type: Input
|
|
1721
|
+
}], messenger: [{
|
|
1722
|
+
type: Input
|
|
1723
|
+
}] } });
|
|
1724
|
+
|
|
1626
1725
|
class PresentationComponent {
|
|
1627
1726
|
constructor() { }
|
|
1628
1727
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PresentationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1629
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", type: PresentationComponent, isStandalone: true, selector: "rtsee-presentation", inputs: { presentation: "presentation" }, ngImport: i0, template: "<div class=\"rtsee-presentation\">\n <div class=\"rtsee-presentation-header-block\">\n <rtsee-presentation-header [presentation]=\"presentation\"\n ></rtsee-presentation-header>\n </div>\n\n @if (presentation.storyLoadInProgress) {\n <rtsee-preloader [diameter]=\"15\"></rtsee-preloader>\n }\n\n @if(presentation.isDashboardOpen && presentation.dashboard) {\n <rtsee-presentations-dashboard [dashboard]=\"presentation.dashboard\"\n ></rtsee-presentations-dashboard>\n }\n\n @if (presentation.settings.isExpanded) {\n <rtsee-presentation-settings [settings]=\"presentation.settings\"\n [presentation]=\"presentation\"\n ></rtsee-presentation-settings>\n }\n\n @if (
|
|
1728
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", type: PresentationComponent, isStandalone: true, selector: "rtsee-presentation", inputs: { presentation: "presentation", messenger: "messenger" }, ngImport: i0, template: "<div class=\"rtsee-presentation\">\n <div class=\"rtsee-presentation-header-block\">\n <rtsee-presentation-header [presentation]=\"presentation\"\n ></rtsee-presentation-header>\n </div>\n\n @if (presentation.storyLoadInProgress) {\n <rtsee-preloader [diameter]=\"15\"></rtsee-preloader>\n }\n\n @if(presentation.isDashboardOpen && presentation.dashboard) {\n <rtsee-presentations-dashboard [dashboard]=\"presentation.dashboard\"\n ></rtsee-presentations-dashboard>\n }\n\n @if (presentation.settings.isExpanded) {\n <rtsee-presentation-settings [settings]=\"presentation.settings\"\n [presentation]=\"presentation\"\n ></rtsee-presentation-settings>\n }\n\n @if (presentation.isCategoriesListVisible && !presentation.storyLoadInProgress) {\n <div class=\"rtsee-presentation-categories-list\">\n @if (presentation.categoriesLoadInProgress) {\n <rtsee-preloader [diameter]=\"15\"></rtsee-preloader>\n }\n @for (category of presentation.categories; track category.id) {\n <p class=\"rtsee-presentation-category-name\">{{category.name}}</p>\n <div class=\"rtsee-presentation-stories-list\">\n @for (story of category.stories; track story.id) {\n <div class=\"rtsee-presentation-story-thumbnail-container\"\n (click)=\"presentation.openStoryDetails(story.id)\"\n >\n <rtsee-story-thumbnail\n [story]=\"story\"\n ></rtsee-story-thumbnail>\n </div>\n }\n </div>\n }\n </div>\n }\n\n @if (presentation.activeStory) {\n <div class=\"rtsee-presentation-story-viewer-container\">\n <rtsee-story-player [story]=\"presentation.activeStory\"\n [settings]=\"presentation.settings\"\n ></rtsee-story-player>\n </div>\n } @else if (presentation.openedStoryDetails) {\n <rtsee-story-details [story]=\"presentation.openedStoryDetails\"\n [presentation]=\"presentation\"\n [messenger]=\"messenger\"\n ></rtsee-story-details>\n }\n</div>\n", dependencies: [{ kind: "component", type: PresentationHeaderComponent, selector: "rtsee-presentation-header", inputs: ["presentation"] }, { kind: "component", type: StoryThumbnailComponent, selector: "rtsee-story-thumbnail", inputs: ["story"] }, { kind: "component", type: StoryPlayerComponent, selector: "rtsee-story-player", inputs: ["story", "settings"] }, { kind: "component", type: PreloaderComponent, selector: "rtsee-preloader", inputs: ["diameter", "color"] }, { kind: "component", type: PresentationsDashboardComponent, selector: "rtsee-presentations-dashboard", inputs: ["dashboard"] }, { kind: "component", type: PresentationSettingsComponent, selector: "rtsee-presentation-settings", inputs: ["settings", "presentation"] }, { kind: "component", type: StoryDetailsComponent, selector: "rtsee-story-details", inputs: ["story", "presentation", "messenger"] }] }); }
|
|
1630
1729
|
}
|
|
1631
1730
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PresentationComponent, decorators: [{
|
|
1632
1731
|
type: Component,
|
|
@@ -1637,10 +1736,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImpor
|
|
|
1637
1736
|
PreloaderComponent,
|
|
1638
1737
|
PreloaderComponent,
|
|
1639
1738
|
PresentationsDashboardComponent,
|
|
1640
|
-
PresentationSettingsComponent
|
|
1641
|
-
|
|
1739
|
+
PresentationSettingsComponent,
|
|
1740
|
+
StoryDetailsComponent
|
|
1741
|
+
], standalone: true, template: "<div class=\"rtsee-presentation\">\n <div class=\"rtsee-presentation-header-block\">\n <rtsee-presentation-header [presentation]=\"presentation\"\n ></rtsee-presentation-header>\n </div>\n\n @if (presentation.storyLoadInProgress) {\n <rtsee-preloader [diameter]=\"15\"></rtsee-preloader>\n }\n\n @if(presentation.isDashboardOpen && presentation.dashboard) {\n <rtsee-presentations-dashboard [dashboard]=\"presentation.dashboard\"\n ></rtsee-presentations-dashboard>\n }\n\n @if (presentation.settings.isExpanded) {\n <rtsee-presentation-settings [settings]=\"presentation.settings\"\n [presentation]=\"presentation\"\n ></rtsee-presentation-settings>\n }\n\n @if (presentation.isCategoriesListVisible && !presentation.storyLoadInProgress) {\n <div class=\"rtsee-presentation-categories-list\">\n @if (presentation.categoriesLoadInProgress) {\n <rtsee-preloader [diameter]=\"15\"></rtsee-preloader>\n }\n @for (category of presentation.categories; track category.id) {\n <p class=\"rtsee-presentation-category-name\">{{category.name}}</p>\n <div class=\"rtsee-presentation-stories-list\">\n @for (story of category.stories; track story.id) {\n <div class=\"rtsee-presentation-story-thumbnail-container\"\n (click)=\"presentation.openStoryDetails(story.id)\"\n >\n <rtsee-story-thumbnail\n [story]=\"story\"\n ></rtsee-story-thumbnail>\n </div>\n }\n </div>\n }\n </div>\n }\n\n @if (presentation.activeStory) {\n <div class=\"rtsee-presentation-story-viewer-container\">\n <rtsee-story-player [story]=\"presentation.activeStory\"\n [settings]=\"presentation.settings\"\n ></rtsee-story-player>\n </div>\n } @else if (presentation.openedStoryDetails) {\n <rtsee-story-details [story]=\"presentation.openedStoryDetails\"\n [presentation]=\"presentation\"\n [messenger]=\"messenger\"\n ></rtsee-story-details>\n }\n</div>\n" }]
|
|
1642
1742
|
}], ctorParameters: () => [], propDecorators: { presentation: [{
|
|
1643
1743
|
type: Input
|
|
1744
|
+
}], messenger: [{
|
|
1745
|
+
type: Input
|
|
1644
1746
|
}] } });
|
|
1645
1747
|
|
|
1646
1748
|
class RtseeNavComponent {
|
|
@@ -1720,7 +1822,7 @@ class RTSeeContainerComponent {
|
|
|
1720
1822
|
this.authService.init(this.auth);
|
|
1721
1823
|
}
|
|
1722
1824
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: RTSeeContainerComponent, deps: [{ token: RTSeeAuthService }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1723
|
-
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 }\"\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 ></rtsee-presentation>\n </div>\n }\n </div>\n </div>\n\n <div class=\"rtsee-content\">\n <ng-content></ng-content>\n </div>\n</div>\n", dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: RTSeeConferenceComponent, selector: "rtsee-conference", inputs: ["rtSee"] }, { kind: "component", type: MessengerComponent, selector: "rtsee-messenger", inputs: ["messenger"] }, { kind: "component", type: RtseeEventsDashboardComponent, selector: "rtsee-events-dashboard", inputs: ["eventsDashboard"] }, { kind: "component", type: PresentationComponent, selector: "rtsee-presentation", inputs: ["presentation"] }, { kind: "component", type: RtseeNavComponent, selector: "rtsee-nav", inputs: ["config", "rtsee"] }] }); }
|
|
1825
|
+
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 }\"\n>\n <div class=\"rtsee-nav-block\">\n <rtsee-nav [config]=\"navigationConfig\" [rtsee]=\"rtsee\"></rtsee-nav>\n </div>\n\n <div class=\"rtsee-shell-panel\">\n <div class=\"rtsee-shell-panel-inner\">\n @if (rtsee.conference && rtsee.conference.isInActiveCall) {\n <div class=\"rtsee-conference-container\">\n <rtsee-conference [rtSee]=\"rtsee.conference\"\n ></rtsee-conference>\n </div>\n }\n\n @if (rtsee.messenger) {\n <div class=\"rtsee-messenger-container\">\n <rtsee-messenger [messenger]=\"rtsee.messenger\"\n ></rtsee-messenger>\n </div>\n }\n\n @if (rtsee.eventsDashboard && rtsee.eventsDashboard.isReady) {\n <div class=\"rtsee-events-dashboard-container\">\n <rtsee-events-dashboard [eventsDashboard]=\"rtsee.eventsDashboard\"\n ></rtsee-events-dashboard>\n </div>\n }\n\n @if (rtsee.presentation && rtsee.presentation.isActive) {\n <div class=\"rtsee-presentation-container\">\n <rtsee-presentation [presentation]=\"rtsee.presentation\"\n [messenger]=\"rtsee.messenger\"\n ></rtsee-presentation>\n </div>\n }\n </div>\n </div>\n\n <div class=\"rtsee-content\">\n <ng-content></ng-content>\n </div>\n</div>\n", dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: RTSeeConferenceComponent, selector: "rtsee-conference", inputs: ["rtSee"] }, { kind: "component", type: MessengerComponent, selector: "rtsee-messenger", inputs: ["messenger"] }, { kind: "component", type: RtseeEventsDashboardComponent, selector: "rtsee-events-dashboard", inputs: ["eventsDashboard"] }, { kind: "component", type: PresentationComponent, selector: "rtsee-presentation", inputs: ["presentation", "messenger"] }, { kind: "component", type: RtseeNavComponent, selector: "rtsee-nav", inputs: ["config", "rtsee"] }] }); }
|
|
1724
1826
|
}
|
|
1725
1827
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: RTSeeContainerComponent, decorators: [{
|
|
1726
1828
|
type: Component,
|
|
@@ -1731,7 +1833,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImpor
|
|
|
1731
1833
|
RtseeEventsDashboardComponent,
|
|
1732
1834
|
PresentationComponent,
|
|
1733
1835
|
RtseeNavComponent
|
|
1734
|
-
], 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 }\"\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 ></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" }]
|
|
1836
|
+
], 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 }\"\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" }]
|
|
1735
1837
|
}], ctorParameters: () => [{ type: RTSeeAuthService }], propDecorators: { rtsee: [{
|
|
1736
1838
|
type: Input
|
|
1737
1839
|
}], navigationConfig: [{
|