From 9b07ce1d0d543d6b8a791f38387e85fbf94ce2d0 Mon Sep 17 00:00:00 2001
From: Cosimo Cecchi <cosimoc@gnome.org>
Date: Sat, 21 Nov 2015 13:06:08 -0800
Subject: [PATCH] osdWindow: don't use custom cairo drawing

We can just set the width on a regular actor inside the StBin.

https://bugzilla.gnome.org/show_bug.cgi?id=758471
---
 data/theme/gnome-shell-high-contrast.css |  3 ++
 data/theme/gnome-shell-sass              |  2 +-
 data/theme/gnome-shell.css               |  3 ++
 js/ui/osdWindow.js                       | 37 ++++--------------------
 4 files changed, 13 insertions(+), 32 deletions(-)

diff --git a/data/theme/gnome-shell-high-contrast.css b/data/theme/gnome-shell-high-contrast.css
index 8b61bc15e..bb1255a17 100644
--- a/data/theme/gnome-shell-high-contrast.css
+++ b/data/theme/gnome-shell-high-contrast.css
@@ -535,6 +535,9 @@ StScrollBar {
     border-radius: 0.3em;
     background-color: rgba(11, 12, 13, 0.5);
     color: #eeeeec; }
+  .osd-window .level-bar {
+    background-color: #eeeeec;
+    border-radius: 0.3em; }
 
 /* App Switcher */
 .switcher-popup {
diff --git a/data/theme/gnome-shell-sass b/data/theme/gnome-shell-sass
index 6ccc18081..31aac7f7b 160000
--- a/data/theme/gnome-shell-sass
+++ b/data/theme/gnome-shell-sass
@@ -1 +1 @@
-Subproject commit 6ccc1808114d803f6699877143c614f14aaf14ea
+Subproject commit 31aac7f7b524786965e4c9a1890009ea362b9c87
diff --git a/data/theme/gnome-shell.css b/data/theme/gnome-shell.css
index ebdd7fdc8..d3155edf1 100644
--- a/data/theme/gnome-shell.css
+++ b/data/theme/gnome-shell.css
@@ -535,6 +535,9 @@ StScrollBar {
     border-radius: 0.3em;
     background-color: rgba(11, 12, 13, 0.5);
     color: #eeeeec; }
+  .osd-window .level-bar {
+    background-color: #eeeeec;
+    border-radius: 0.3em; }
 
 /* App Switcher */
 .switcher-popup {
diff --git a/js/ui/osdWindow.js b/js/ui/osdWindow.js
index bcdc39180..53ccc976c 100644
--- a/js/ui/osdWindow.js
+++ b/js/ui/osdWindow.js
@@ -22,9 +22,9 @@ const LevelBar = new Lang.Class({
         this._level = 0;
 
         this.actor = new St.Bin({ style_class: 'level',
-                                  x_fill: true, y_fill: true });
-        this._bar = new St.DrawingArea();
-        this._bar.connect('repaint', Lang.bind(this, this._repaint));
+                                  x_align: St.Align.START,
+                                  y_fill: true });
+        this._bar = new St.Widget({ style_class: 'level-bar' });
 
         this.actor.set_child(this._bar);
     },
@@ -38,35 +38,10 @@ const LevelBar = new Lang.Class({
         if (newValue == this._level)
             return;
         this._level = newValue;
-        this._bar.queue_repaint();
-    },
 
-    _repaint: function() {
-        let cr = this._bar.get_context();
-
-        let node = this.actor.get_theme_node();
-        let radius = node.get_border_radius(0); // assume same radius for all corners
-        Clutter.cairo_set_source_color(cr, node.get_foreground_color());
-
-        let [w, h] = this._bar.get_surface_size();
-        w *= (this._level / 100.);
-
-        if (w == 0)
-            return;
-
-        cr.moveTo(radius, 0);
-        if (w >= radius)
-            cr.arc(w - radius, radius, radius, 1.5 * Math.PI, 2. * Math.PI);
-        else
-            cr.lineTo(w, 0);
-        if (w >= radius)
-            cr.arc(w - radius, h - radius, radius, 0, 0.5 * Math.PI);
-        else
-            cr.lineTo(w, h);
-        cr.arc(radius, h - radius, radius, 0.5 * Math.PI, Math.PI);
-        cr.arc(radius, radius, radius, Math.PI, 1.5 * Math.PI);
-        cr.fill();
-        cr.$dispose();
+        let width = this.actor.width;
+        width *= (this._level / 100.);
+        this._bar.width = width;
     }
 });