js: Add caps-lock Warning to the dialogs

https://gitlab.gnome.org/GNOME/gnome-shell/merge_requests/619

data/theme/gnome-shell-sass/_common.scss

@@ -404,6 +404,11 @@ StScrollBar {
     padding-bottom: 8px;
   }
 
+  .prompt-dialog-caps-lock-warning {
+    @extend .prompt-dialog-error-label;
+    padding-left: 6.2em;
+  }
+
   .prompt-dialog-info-label {
     font-size: 10pt;
     padding-bottom: 8px;

js/gdm/authPrompt.js

@@ -120,6 +120,9 @@ var AuthPrompt = GObject.registerClass({
 
         this._entry.grab_key_focus();
 
+        this._capsLockWarningLabel = new ShellEntry.CapsLockWarning(this._entry);
+        this.add_child(this._capsLockWarningLabel);
+
         this._message = new St.Label({
             opacity: 0,
             styleClass: 'login-dialog-message',
@@ -209,9 +212,11 @@ var AuthPrompt = GObject.registerClass({
         if (secret && (this._entry != this._passwordEntry)) {
             this.replace_child(this._entry, this._passwordEntry);
             this._entry = this._passwordEntry;
+            this.insert_child_below(this._capsLockWarningLabel, this._entry);
         } else if (!secret && (this._entry != this._textEntry)) {
             this.replace_child(this._entry, this._textEntry);
             this._entry = this._textEntry;
+            this.remove_child(this._capsLockWarningLabel);
         }
     }
 

js/ui/components/keyring.js

@@ -126,6 +126,13 @@ class KeyringDialog extends ModalDialog.ModalDialog {
         this.prompt.set_password_actor(this._passwordEntry ? this._passwordEntry.clutter_text : null);
         this.prompt.set_confirm_actor(this._confirmEntry ? this._confirmEntry.clutter_text : null);
 
+        if (this._passwordEntry || this._confirmEntry) {
+            let entry = this._passwordEntry ? this._passwordEntry : this._confirmEntry;
+            this._capsLockWarningLabel = new ShellEntry.CapsLockWarning(entry);
+            layout.attach(this._capsLockWarningLabel, 1, row, 1, 1);
+            row++;
+        }
+
         if (this.prompt.choice_visible) {
             let choice = new CheckBox.CheckBox();
             this.prompt.bind_property('choice-label', choice.getLabelActor(), 'text', GObject.BindingFlags.SYNC_CREATE);

js/ui/components/networkAgent.js

@@ -44,6 +44,7 @@ class NetworkSecretDialog extends ModalDialog.ModalDialog {
         let rtl = secretTable.get_text_direction() == Clutter.TextDirection.RTL;
         let initialFocusSet = false;
         let pos = 0;
+        let lastPasswordEntry = 0;
         for (let i = 0; i < this._content.secrets.length; i++) {
             let secret = this._content.secrets[i];
             let label = new St.Label({ style_class: 'prompt-dialog-password-label',
@@ -61,10 +62,12 @@ class NetworkSecretDialog extends ModalDialog.ModalDialog {
                 reactive,
                 x_expand: true,
             };
-            if (secret.password)
+            if (secret.password) {
                 secret.entry = new St.PasswordEntry(entryParams);
-            else
+                lastPasswordEntry = i;
+            } else {
                 secret.entry = new St.Entry(entryParams);
+            }
             ShellEntry.addContextMenu(secret.entry);
 
             if (secret.validate)
@@ -100,6 +103,14 @@ class NetworkSecretDialog extends ModalDialog.ModalDialog {
             }
             pos++;
         }
+        // Bind the caps-lock warning to the last password-entry and pack below it.
+        if (this._content.secrets[lastPasswordEntry].password) {
+            this._capsLockWarningLabel = new ShellEntry.CapsLockWarning(this._content.secrets[lastPasswordEntry].entry);
+            if (rtl)
+                layout.attach(this._capsLockWarningLabel, 0, ++pos, 1, 1);
+            else
+                layout.attach(this._capsLockWarningLabel, 1, ++pos, 1, 1);
+        }
 
         contentBox.messageBox.add(secretTable);
 

js/ui/components/polkitAgent.js

@@ -109,6 +109,10 @@ var AuthenticationDialog = GObject.registerClass({
         this._passwordBox.add(this._workSpinner);
 
         this._passwordBox.hide();
+        this._capsLockWarningLabel = new ShellEntry.CapsLockWarning(this._passwordEntry, {
+            style_class: 'prompt-dialog-caps-lock-warning',
+        });
+        content.messageBox.add(this._capsLockWarningLabel);
 
         this._errorMessageLabel = new St.Label({ style_class: 'prompt-dialog-error-label' });
         this._errorMessageLabel.clutter_text.ellipsize = Pango.EllipsizeMode.NONE;

js/ui/shellMountOperation.js

@@ -368,13 +368,16 @@ var ShellMountPasswordDialog = GObject.registerClass({
             animate: true,
         });
         this._passwordEntry.secondary_icon = this._workSpinner;
+        this._capsLockWarningLabel = new ShellEntry.CapsLockWarning(this._passwordEntry);
 
         if (rtl) {
             layout.attach(this._passwordEntry, 0, 1, 1, 1);
             layout.attach(this._passwordLabel, 1, 1, 1, 1);
+            layout.attach(this._capsLockWarningLabel, 0, 2, 1, 1);
         } else {
             layout.attach(this._passwordLabel, 0, 1, 1, 1);
             layout.attach(this._passwordEntry, 1, 1, 1, 1);
+            layout.attach(this._capsLockWarningLabel, 1, 2, 1, 1);
         }
 
         content.messageBox.add(grid);