shellEntry: Add CapsLockWarning class

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/ui/shellEntry.js

@@ -1,7 +1,7 @@
 // -*- mode: js; js-indent-level: 4; indent-tabs-mode: nil -*-
-/* exported addContextMenu */
+/* exported addContextMenu CapsLockWarning */
 
-const { Clutter, Shell, St } = imports.gi;
+const { Clutter, GObject, Pango, Shell, St } = imports.gi;
 
 const BoxPointer = imports.ui.boxpointer;
 const Main = imports.ui.main;
@@ -151,3 +151,40 @@ function addContextMenu(entry, params) {
         entry._menuManager = null;
     });
 }
+
+var CapsLockWarning = GObject.registerClass(
+class CapsLockWarning extends St.Label {
+    _init(params) {
+        let defaultParams = { style_class: 'prompt-dialog-error-label' };
+        super._init(Object.assign(defaultParams, params));
+
+        this.text = _('Caps lock is on.');
+
+        this._keymap = Clutter.get_default_backend().get_keymap();
+
+        this.connect('notify::mapped', () => {
+            if (this.is_mapped()) {
+                this.stateChangedId = this._keymap.connect('state-changed',
+                    this._updateCapsLockWarningOpacity.bind(this));
+            } else {
+                this._keymap.disconnect(this.stateChangedId);
+                this.stateChangedId = 0;
+            }
+
+            this._updateCapsLockWarningOpacity();
+        });
+
+        this.connect('destroy', () => {
+            if (this.stateChangedId > 0)
+                this._keymap.disconnect(this.stateChangedId);
+        });
+
+        this.clutter_text.ellipsize = Pango.EllipsizeMode.NONE;
+        this.clutter_text.line_wrap = true;
+    }
+
+    _updateCapsLockWarningOpacity() {
+        let capsLockOn = this._keymap.get_caps_lock_state();
+        this.opacity = capsLockOn ? 255 : 0;
+    }
+});