Merge pull request #7219 from timvandermeij/password-prompt-class

Convert the password prompt to a class

web/app.js

@@ -285,14 +285,13 @@ var PDFViewerApplication = {
       });
     }
 
-    PasswordPrompt.initialize({
+    this.passwordPrompt = new PasswordPrompt({
       overlayName: 'passwordOverlay',
-      passwordField: document.getElementById('password'),
+      label: document.getElementById('passwordText'),
-      passwordText: document.getElementById('passwordText'),
+      input: document.getElementById('password'),
-      passwordSubmit: document.getElementById('passwordSubmit'),
+      submitButton: document.getElementById('passwordSubmit'),
-      passwordCancel: document.getElementById('passwordCancel')
+      cancelButton: document.getElementById('passwordCancel')
     });
-    this.passwordPrompt = PasswordPrompt;
 
     this.pdfOutlineViewer = new PDFOutlineViewer({
       container: document.getElementById('outlineView'),
@@ -687,10 +686,9 @@ var PDFViewerApplication = {
     var loadingTask = pdfjsLib.getDocument(parameters);
     this.pdfLoadingTask = loadingTask;
 
-    loadingTask.onPassword = function passwordNeeded(updatePassword, reason) {
+    loadingTask.onPassword = function passwordNeeded(updateCallback, reason) {
-      PasswordPrompt.updatePassword = updatePassword;
+      self.passwordPrompt.setUpdateCallback(updateCallback, reason);
-      PasswordPrompt.reason = reason;
+      self.passwordPrompt.open();
-      PasswordPrompt.open();
     };
 
     loadingTask.onProgress = function getDocumentProgress(progressData) {

web/password_prompt.js

@@ -32,69 +32,90 @@
 var mozL10n = uiUtils.mozL10n;
 var OverlayManager = overlayManager.OverlayManager;
 
-var PasswordPrompt = {
+/**
-  overlayName: null,
+ * @typedef {Object} PasswordPromptOptions
-  updatePassword: null,
+ * @property {string} overlayName - Name of the overlay for the overlay manager.
-  reason: null,
+ * @property {HTMLParagraphElement} label - Label containing instructions for
-  passwordField: null,
+ *                                          entering the password.
-  passwordText: null,
+ * @property {HTMLInputElement} input - Input field for entering the password.
-  passwordSubmit: null,
+ * @property {HTMLButtonElement} submitButton - Button for submitting the
-  passwordCancel: null,
+ *                                              password.
-
+ * @property {HTMLButtonElement} cancelButton - Button for cancelling password
-  initialize: function secondaryToolbarInitialize(options) {
+ *                                              entry.
-    this.overlayName = options.overlayName;
+ */
-    this.passwordField = options.passwordField;
-    this.passwordText = options.passwordText;
-    this.passwordSubmit = options.passwordSubmit;
-    this.passwordCancel = options.passwordCancel;
 
-    // Attach the event listeners.
+/**
-    this.passwordSubmit.addEventListener('click',
+ * @class
-      this.verifyPassword.bind(this));
+ */
+var PasswordPrompt = (function PasswordPromptClosure() {
+  /**
+   * @constructs PasswordPrompt
+   * @param {PasswordPromptOptions} options
+   */
+  function PasswordPrompt(options) {
+    this.overlayName = options.overlayName;
+    this.label = options.label;
+    this.input = options.input;
+    this.submitButton = options.submitButton;
+    this.cancelButton = options.cancelButton;
 
-    this.passwordCancel.addEventListener('click', this.close.bind(this));
+    this.updateCallback = null;
+    this.reason = null;
 
-    this.passwordField.addEventListener('keydown', function (e) {
+    // Attach the event listeners.
+    this.submitButton.addEventListener('click', this.verify.bind(this));
+    this.cancelButton.addEventListener('click', this.close.bind(this));
+    this.input.addEventListener('keydown', function (e) {
       if (e.keyCode === 13) { // Enter key
-        this.verifyPassword();
+        this.verify();
       }
     }.bind(this));
 
     OverlayManager.register(this.overlayName, this.close.bind(this), true);
-  },
+  }
-
-  open: function passwordPromptOpen() {
-    OverlayManager.open(this.overlayName).then(function () {
-      this.passwordField.type = 'password';
-      this.passwordField.focus();
-
-      var promptString = mozL10n.get('password_label', null,
-        'Enter the password to open this PDF file.');
 
-      if (this.reason === pdfjsLib.PasswordResponses.INCORRECT_PASSWORD) {
+  PasswordPrompt.prototype = {
-        promptString = mozL10n.get('password_invalid', null,
+    open: function PasswordPrompt_open() {
-          'Invalid password. Please try again.');
+      OverlayManager.open(this.overlayName).then(function () {
+        this.input.type = 'password';
+        this.input.focus();
+
+        var promptString = mozL10n.get('password_label', null,
+          'Enter the password to open this PDF file.');
+
+        if (this.reason === pdfjsLib.PasswordResponses.INCORRECT_PASSWORD) {
+          promptString = mozL10n.get('password_invalid', null,
+            'Invalid password. Please try again.');
+        }
+
+        this.label.textContent = promptString;
+      }.bind(this));
+    },
+
+    close: function PasswordPrompt_close() {
+      OverlayManager.close(this.overlayName).then(function () {
+        this.input.value = '';
+        this.input.type = '';
+      }.bind(this));
+    },
+
+    verify: function PasswordPrompt_verify() {
+      var password = this.input.value;
+      if (password && password.length > 0) {
+        this.close();
+        return this.updateCallback(password);
       }
+    },
 
-      this.passwordText.textContent = promptString;
+    setUpdateCallback:
-    }.bind(this));
+        function PasswordPrompt_setUpdateCallback(updateCallback, reason) {
-  },
+      this.updateCallback = updateCallback;
-
+      this.reason = reason;
-  close: function passwordPromptClose() {
-    OverlayManager.close(this.overlayName).then(function () {
-      this.passwordField.value = '';
-      this.passwordField.type = '';
-    }.bind(this));
-  },
-
-  verifyPassword: function passwordPromptVerifyPassword() {
-    var password = this.passwordField.value;
-    if (password && password.length > 0) {
-      this.close();
-      return this.updatePassword(password);
     }
-  }
+  };
-};
+
+  return PasswordPrompt;
+})();
 
 exports.PasswordPrompt = PasswordPrompt;
 }));