diff --git a/src/addons/notifications/services/handlers/push-click.ts b/src/addons/notifications/services/handlers/push-click.ts index 3d3f0c72b..7e731e421 100644 --- a/src/addons/notifications/services/handlers/push-click.ts +++ b/src/addons/notifications/services/handlers/push-click.ts @@ -86,7 +86,7 @@ export class AddonNotificationsPushClickHandlerService implements CorePushNotifi // Display the text in a modal. return CoreTextUtils.instance.viewText(notification.title || '', notification.customdata.extendedtext, { displayCopyButton: true, - // @todo modalOptions: { cssClass: 'core-modal-fullscreen' }, + modalOptions: { cssClass: 'core-modal-fullscreen' }, }); } diff --git a/src/core/features/features.module.ts b/src/core/features/features.module.ts index 57ed4343e..010657163 100644 --- a/src/core/features/features.module.ts +++ b/src/core/features/features.module.ts @@ -27,6 +27,7 @@ import { CoreTagModule } from './tag/tag.module'; import { CoreUserModule } from './user/user.module'; import { CorePushNotificationsModule } from './pushnotifications/pushnotifications.module'; import { CoreXAPIModule } from './xapi/xapi.module'; +import { CoreViewerModule } from './viewer/viewer.module'; @NgModule({ imports: [ @@ -43,6 +44,7 @@ import { CoreXAPIModule } from './xapi/xapi.module'; CorePushNotificationsModule, CoreXAPIModule, CoreH5PModule, + CoreViewerModule, ], }) export class CoreFeaturesModule {} diff --git a/src/core/features/viewer/components/components.module.ts b/src/core/features/viewer/components/components.module.ts new file mode 100644 index 000000000..6403e090c --- /dev/null +++ b/src/core/features/viewer/components/components.module.ts @@ -0,0 +1,37 @@ +// (C) Copyright 2015 Moodle Pty Ltd. +// +// Licensed under the Apache License, Version 2.0 (the "License"); +// you may not use this file except in compliance with the License. +// You may obtain a copy of the License at +// +// http://www.apache.org/licenses/LICENSE-2.0 +// +// Unless required by applicable law or agreed to in writing, software +// distributed under the License is distributed on an "AS IS" BASIS, +// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +// See the License for the specific language governing permissions and +// limitations under the License. + +import { NgModule } from '@angular/core'; +import { CommonModule } from '@angular/common'; +import { IonicModule } from '@ionic/angular'; +import { TranslateModule } from '@ngx-translate/core'; + +import { CoreSharedModule } from '@/core/shared.module'; +import { CoreViewerTextComponent } from './text/text'; + +@NgModule({ + declarations: [ + CoreViewerTextComponent, + ], + imports: [ + CommonModule, + IonicModule.forRoot(), + TranslateModule.forChild(), + CoreSharedModule, + ], + exports: [ + CoreViewerTextComponent, + ], +}) +export class CoreViewerComponentsModule {} diff --git a/src/core/features/viewer/components/text/text.html b/src/core/features/viewer/components/text/text.html new file mode 100644 index 000000000..824ff42a7 --- /dev/null +++ b/src/core/features/viewer/components/text/text.html @@ -0,0 +1,29 @@ + + + + + + {{ title }} + + + + + + + + + + + + + + + + + + + + {{ 'core.copytoclipboard' | translate }} + + diff --git a/src/core/features/viewer/components/text/text.scss b/src/core/features/viewer/components/text/text.scss new file mode 100644 index 000000000..4377e35e3 --- /dev/null +++ b/src/core/features/viewer/components/text/text.scss @@ -0,0 +1,5 @@ +ion-app.app-root page-core-viewer-text { + ion-footer { + padding: 6px; + } +} diff --git a/src/core/features/viewer/components/text/text.ts b/src/core/features/viewer/components/text/text.ts new file mode 100644 index 000000000..8baeaf033 --- /dev/null +++ b/src/core/features/viewer/components/text/text.ts @@ -0,0 +1,56 @@ +// (C) Copyright 2015 Moodle Pty Ltd. +// +// Licensed under the Apache License, Version 2.0 (the "License"); +// you may not use this file except in compliance with the License. +// You may obtain a copy of the License at +// +// http://www.apache.org/licenses/LICENSE-2.0 +// +// Unless required by applicable law or agreed to in writing, software +// distributed under the License is distributed on an "AS IS" BASIS, +// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +// See the License for the specific language governing permissions and +// limitations under the License. + +import { Component, Input } from '@angular/core'; +import { FileEntry } from '@ionic-native/file/ngx'; + +import { CoreUtils } from '@services/utils/utils'; +import { CoreWSExternalFile } from '@services/ws'; +import { ModalController } from '@singletons'; + +/** + * Modal component to render a certain text. + */ +@Component({ + selector: 'page-core-viewer-text', + templateUrl: 'text.html', +}) +export class CoreViewerTextComponent { + + @Input() title?: string; // Modal title. + @Input() content?: string; // Modal content. + @Input() component?: string; // Component to use in format-text. + @Input() componentId?: string | number; // Component ID to use in format-text. + @Input() files?: (CoreWSExternalFile | FileEntry)[]; // List of files. + @Input() filter?: boolean; // Whether to filter the text. + @Input() contextLevel?: string; // The context level. + @Input() instanceId?: number; // The instance ID related to the context. + @Input() courseId?: number; // Course ID the text belongs to. It can be used to improve performance with filters. + @Input() displayCopyButton?: boolean; // Whether to display a button to copy the contents. + + /** + * Close modal. + */ + closeModal(): void { + ModalController.instance.dismiss(); + } + + /** + * Copy the text to clipboard. + */ + copyText(): void { + CoreUtils.instance.copyToClipboard(this.content || ''); + } + +} diff --git a/src/core/features/viewer/viewer.module.ts b/src/core/features/viewer/viewer.module.ts new file mode 100644 index 000000000..ae9dc3816 --- /dev/null +++ b/src/core/features/viewer/viewer.module.ts @@ -0,0 +1,24 @@ +// (C) Copyright 2015 Moodle Pty Ltd. +// +// Licensed under the Apache License, Version 2.0 (the "License"); +// you may not use this file except in compliance with the License. +// You may obtain a copy of the License at +// +// http://www.apache.org/licenses/LICENSE-2.0 +// +// Unless required by applicable law or agreed to in writing, software +// distributed under the License is distributed on an "AS IS" BASIS, +// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +// See the License for the specific language governing permissions and +// limitations under the License. + +import { NgModule } from '@angular/core'; + +import { CoreViewerComponentsModule } from './components/components.module'; + +@NgModule({ + imports: [ + CoreViewerComponentsModule, + ], +}) +export class CoreViewerModule {} diff --git a/src/core/services/utils/text.ts b/src/core/services/utils/text.ts index facc5b870..919a313bb 100644 --- a/src/core/services/utils/text.ts +++ b/src/core/services/utils/text.ts @@ -14,13 +14,15 @@ import { Injectable } from '@angular/core'; import { DomSanitizer, SafeUrl } from '@angular/platform-browser'; +import { ModalOptions } from '@ionic/core'; import { CoreApp } from '@services/app'; import { CoreLang } from '@services/lang'; import { CoreError } from '@classes/errors/error'; -import { makeSingleton, Translate } from '@singletons'; +import { makeSingleton, ModalController, Translate } from '@singletons'; import { CoreWSExternalFile } from '@services/ws'; import { Locutus } from '@singletons/locutus'; +import { CoreViewerTextComponent } from '@features/viewer/components/text/text'; /** * Different type of errors the app can treat. @@ -461,7 +463,7 @@ export class CoreTextUtilsProvider { contextLevel?: string, instanceId?: number, courseId?: number, - ): void { + ): Promise { return this.viewText(title, text, { component, componentId, @@ -947,13 +949,31 @@ export class CoreTextUtilsProvider { * Shows a text on a new page. * * @param title Title of the new state. - * @param text Content of the text to be expanded. + * @param content Content of the text to be expanded. * @param component Component to link the embedded files to. * @param options Options. + * @return Promise resolved when the modal is displayed. */ - // eslint-disable-next-line @typescript-eslint/no-unused-vars - viewText(title: string, text: string, options?: CoreTextUtilsViewTextOptions): void { - // @todo + async viewText(title: string, content: string, options?: CoreTextUtilsViewTextOptions): Promise { + if (!content.length) { + return; + } + + options = options || {}; + + const modalOptions: ModalOptions = Object.assign(options.modalOptions || {}, { + component: CoreViewerTextComponent, + }); + delete options.modalOptions; + modalOptions.componentProps = { + title, + content, + ...options, + }; + + const modal = await ModalController.instance.create(modalOptions); + + await modal.present(); } } @@ -970,7 +990,7 @@ export type CoreTextUtilsViewTextOptions = { instanceId?: number; // The instance ID related to the context. courseId?: number; // Course ID the text belongs to. It can be used to improve performance with filters. displayCopyButton?: boolean; // Whether to display a button to copy the text. - // modalOptions?: ModalOptions; // Modal options. @todo + modalOptions?: Partial; // Modal options. }; export class CoreTextUtils extends makeSingleton(CoreTextUtilsProvider) {}