[gnome-shell/wip/rstrode/login-screen-extensions: 18/134] shellEntry: Add CapsLockWarning class

[Ray Strode <halfline src gnome org>]

commit 0b35451dffca4e1a648d2963d76a0f7ca9b20b76
Author: Umang Jain <mailumangjain gmail com>
Date:   Fri Dec 13 13:36:14 2019 +0530

    shellEntry: Add CapsLockWarning class
    
    https://gitlab.gnome.org/GNOME/gnome-shell/merge_requests/619

 data/theme/gnome-shell-sass/_common.scss |  5 ++++
 js/ui/shellEntry.js                      | 39 +++++++++++++++++++++++++++++++-
 2 files changed, 43 insertions(+), 1 deletion(-)
---
diff --git a/data/theme/gnome-shell-sass/_common.scss b/data/theme/gnome-shell-sass/_common.scss
index a382ce5618..d59933a6ae 100644
--- a/data/theme/gnome-shell-sass/_common.scss
+++ b/data/theme/gnome-shell-sass/_common.scss
@@ -391,6 +391,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;
diff --git a/js/ui/shellEntry.js b/js/ui/shellEntry.js
index 79f1aad3e7..c1738c4064 100644
--- a/js/ui/shellEntry.js
+++ b/js/ui/shellEntry.js
@@ -1,6 +1,6 @@
 // -*- mode: js; js-indent-level: 4; indent-tabs-mode: nil -*-
 
-const { Clutter, Shell, St } = imports.gi;
+const { Clutter, GObject, Pango, Shell, St } = imports.gi;
 
 const BoxPointer = imports.ui.boxpointer;
 const Main = imports.ui.main;
@@ -170,3 +170,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;
+    }
+});