MOBILE-3351 core: Display image viewer in fullscreen

src/core/emulator/providers/capture-helper.ts

@@ -99,7 +99,7 @@ export class CoreEmulatorCaptureHelperProvider {
                 params.maxTime = options.duration * 1000;
             }
 
-            modal = this.modalCtrl.create('CoreEmulatorCaptureMediaPage', params);
+            modal = this.modalCtrl.create('CoreEmulatorCaptureMediaPage', params, { cssClass: 'core-modal-fullscreen' });
             modal.present();
             modal.onDidDismiss((data: any, role: string) => {
                 if (role == 'success') {

src/directives/format-text.ts

@@ -221,7 +221,7 @@ export class CoreFormatTextDirective implements OnChanges {
             anchor.addEventListener('click', (e: Event) => {
                 e.preventDefault();
                 e.stopPropagation();
-                this.domUtils.viewImage(imgSrc, img.getAttribute('alt'), this.component, this.componentId);
+                this.domUtils.viewImage(imgSrc, img.getAttribute('alt'), this.component, this.componentId, true);
             });
 
             img.parentNode.appendChild(anchor);

src/providers/utils/dom.ts

@@ -1560,25 +1560,26 @@ export class CoreDomUtilsProvider {
     }
 
     /**
-     * View an image in a new page or modal.
+     * View an image in a modal.
      *
      * @param image URL of the image.
      * @param title Title of the page or modal.
      * @param component Component to link the image to if needed.
      * @param componentId An ID to use in conjunction with the component.
+     * @param fullScreen Whether the modal should be full screen.
      */
-    viewImage(image: string, title?: string, component?: string, componentId?: string | number): void {
+    viewImage(image: string, title?: string, component?: string, componentId?: string | number, fullScreen?: boolean): void {
         if (image) {
             const params: any = {
-                    title: title,
-                    image: image,
-                    component: component,
-                    componentId: componentId
-                },
-                modal = this.modalCtrl.create('CoreViewerImagePage', params);
+                title: title,
+                image: image,
+                component: component,
+                componentId: componentId,
+            };
+            const options = fullScreen ? { cssClass: 'core-modal-fullscreen' } : {};
+            const modal = this.modalCtrl.create('CoreViewerImagePage', params, options);
             modal.present();
         }
-
     }
 
     /**