Move the DialogController into a separate file and reuse it everywhere

Accidentally resolves #521

src/controllers/dialog.ts

@@ -0,0 +1,55 @@
+/**
+ * This file is part of Threema Web.
+ *
+ * Threema Web is free software: you can redistribute it and/or modify it
+ * under the terms of the GNU Affero General Public License as published by
+ * the Free Software Foundation, either version 3 of the License, or (at
+ * your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful, but
+ * WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU Affero
+ * General Public License for more details.
+ *
+ * You should have received a copy of the GNU Affero General Public License
+ * along with Threema Web. If not, see <http://www.gnu.org/licenses/>.
+ */
+
+/**
+ * A general purpose dialog controller.
+ */
+export class DialogController {
+    public readonly $mdDialog: ng.material.IDialogService;
+    public readonly activeElement: HTMLElement | null;
+
+    public static readonly $inject = ['$mdDialog'];
+    constructor($mdDialog: ng.material.IDialogService, activeElement?: HTMLElement) {
+        this.$mdDialog = $mdDialog;
+        this.activeElement = activeElement !== undefined ? activeElement : document.activeElement as HTMLElement;
+    }
+
+    /**
+     * Cancel the dialog.
+     */
+    public cancel(): void {
+        this.$mdDialog.cancel();
+        this.restoreFocus();
+    }
+
+    /**
+     * Hide the dialog.
+     */
+    protected hide(data?: any): void {
+        this.$mdDialog.hide(data);
+        this.restoreFocus();
+    }
+
+    /**
+     * Restore focus to the previously active element.
+     */
+    private restoreFocus(): void {
+        if (this.activeElement !== null) {
+            this.activeElement.focus();
+        }
+    }
+}

src/partials/messenger.ts

@@ -25,6 +25,7 @@ import {
 import {Logger} from 'ts-log';
 
 import {ContactControllerModel} from '../controller_model/contact';
+import {DialogController} from '../controllers/dialog';
 import {bufferToUrl, hasValue, supportsPassive, throttle, u8aToHex} from '../helpers';
 import {emojify} from '../helpers/emoji';
 import {ContactService} from '../services/contact';
@@ -46,49 +47,11 @@ import {controllerModelHasMembers, isContactReceiver} from '../typeguards';
 // Type aliases
 import ControllerModelMode = threema.ControllerModelMode;
 
-class DialogController {
-    public $mdDialog: ng.material.IDialogService;
-    public activeElement: HTMLElement | null;
-    public config: threema.Config;
-
-    public static $inject = ['$mdDialog', 'CONFIG'];
-    constructor($mdDialog: ng.material.IDialogService, CONFIG: threema.Config) {
-        this.$mdDialog = $mdDialog;
-        this.activeElement = document.activeElement as HTMLElement;
-        this.config = CONFIG;
-    }
-
-    public cancel(): void {
-        this.$mdDialog.cancel();
-        this.done();
-    }
-
-    protected hide(data?: any): void {
-        this.$mdDialog.hide(data);
-        this.done();
-    }
-
-    private done(): void {
-        if (this.resumeFocusOnClose() === true && this.activeElement !== null) {
-            // reset focus
-            this.activeElement.focus();
-        }
-    }
-
-    /**
-     * If true, the focus on the active element (before opening the dialog)
-     * will be restored. Default `true`, override if desired.
-     */
-    protected resumeFocusOnClose(): boolean {
-        return true;
-    }
-}
-
 /**
  * Handle sending of files.
  */
 class SendFileController extends DialogController {
-    public static $inject = ['$mdDialog', 'CONFIG', 'LogService', 'preview'];
+    public static $inject = ['$mdDialog', 'LogService', 'preview'];
 
     public caption: string;
     public sendAsFile: boolean = false;
@@ -96,10 +59,9 @@ class SendFileController extends DialogController {
     public previewDataUrl: string | null = null;
 
     constructor($mdDialog: ng.material.IDialogService,
-                CONFIG: threema.Config,
                 logService: LogService,
                 preview: threema.FileMessageData) {
-        super($mdDialog, CONFIG);
+        super($mdDialog);
         const log = logService.getLogger('SendFile-C');
         this.preview = preview;
         if (preview !== null) {
@@ -132,7 +94,7 @@ class SendFileController extends DialogController {
 export class DeviceUnreachableController extends DialogController {
     public static readonly $inject = [
         '$rootScope', '$window', '$mdDialog',
-        'CONFIG', 'StateService', 'WebClientService',
+        'StateService', 'WebClientService',
     ];
     private readonly $rootScope: any;
     private readonly $window: ng.IWindowService;
@@ -143,9 +105,9 @@ export class DeviceUnreachableController extends DialogController {
 
     constructor(
         $rootScope: any, $window: ng.IWindowService, $mdDialog: ng.material.IDialogService,
-        CONFIG: threema.Config, stateService: StateService, webClientService: WebClientService,
+        stateService: StateService, webClientService: WebClientService,
     ) {
-        super($mdDialog, CONFIG);
+        super($mdDialog);
         this.$rootScope = $rootScope;
         this.$window = $window;
         this.stateService = stateService;
@@ -204,14 +166,12 @@ export class DeviceUnreachableController extends DialogController {
 /**
  * Handle settings
  */
-class SettingsController {
+class SettingsController extends DialogController {
     public static $inject = ['$mdDialog', '$window', 'SettingsService', 'NotificationService'];
 
-    public $mdDialog: ng.material.IDialogService;
     public $window: ng.IWindowService;
     public settingsService: SettingsService;
     private notificationService: NotificationService;
-    public activeElement: HTMLElement | null;
 
     private desktopNotifications: boolean;
     private notificationApiAvailable: boolean;
@@ -223,11 +183,10 @@ class SettingsController {
                 $window: ng.IWindowService,
                 settingsService: SettingsService,
                 notificationService: NotificationService) {
-        this.$mdDialog = $mdDialog;
+        super($mdDialog);
         this.$window = $window;
         this.settingsService = settingsService;
         this.notificationService = notificationService;
-        this.activeElement = document.activeElement as HTMLElement;
         this.desktopNotifications = notificationService.getWantsNotifications();
         this.notificationApiAvailable = notificationService.isNotificationApiAvailable();
         this.notificationPermission = notificationService.getNotificationPermission();
@@ -235,23 +194,6 @@ class SettingsController {
         this.notificationSound = notificationService.getWantsSound();
     }
 
-    public cancel(): void {
-        this.$mdDialog.cancel();
-        this.done();
-    }
-
-    protected hide(data: any): void {
-        this.$mdDialog.hide(data);
-        this.done();
-    }
-
-    private done(): void {
-        if (this.activeElement !== null) {
-            // Reset focus
-            this.activeElement.focus();
-        }
-    }
-
     public setWantsNotifications(desktopNotifications: boolean) {
         this.notificationService.setWantsNotifications(desktopNotifications);
     }

src/partials/welcome.ts

@@ -26,6 +26,7 @@ import {
     StateService as UiStateService,
 } from '@uirouter/angularjs';
 
+import {DialogController} from '../controllers/dialog';
 import {BrowserInfo} from '../helpers/browser_info';
 import {BrowserService} from '../services/browser';
 import {ControllerService} from '../services/controller';
@@ -41,22 +42,6 @@ import {WebClientService} from '../services/webclient';
 import GlobalConnectionState = threema.GlobalConnectionState;
 import DisconnectReason = threema.DisconnectReason;
 
-class DialogController {
-    // TODO: This is also used in partials/messenger.ts. We could somehow
-    // extract it into a separate file.
-    public static $inject = ['$mdDialog'];
-
-    public $mdDialog;
-
-    constructor($mdDialog) {
-        this.$mdDialog = $mdDialog;
-    }
-
-    public cancel() {
-        this.$mdDialog.cancel();
-    }
-}
-
 class WelcomeController {
     private static REDIRECT_DELAY = 500;