lookingGlass: fix red border drawing in the inspector, port to JS

Some recent painting-efficiency fix broke the inspector, which
accidentally depended on things getting repainted too often, and so
was failing to highlight things properly now. A simple queue_redraw()
fixes this, but while I was there, I decided to port the drawing hook
to JS as well, since all the necessary parts of cogl work fine from
JS.

https://bugzilla.gnome.org/show_bug.cgi?id=642058

js/ui/lookingGlass.js

@@ -1,6 +1,7 @@
 /* -*- mode: js2; js2-basic-offset: 4; indent-tabs-mode: nil -*- */
 
 const Clutter = imports.gi.Clutter;
+const Cogl = imports.gi.Cogl;
 const GConf = imports.gi.GConf;
 const GLib = imports.gi.GLib;
 const Gio = imports.gi.Gio;
@@ -359,6 +360,30 @@ ObjInspector.prototype = {
     }
 };
 
+function addBorderPaintHook(actor) {
+    let signalId = actor.connect_after('paint',
+        function () {
+            let color = new Cogl.Color();
+            color.init_from_4ub(0xff, 0, 0, 0xc4);
+            Cogl.set_source_color(color);
+
+            let geom = actor.get_allocation_geometry();
+            let width = 2;
+
+            // clockwise order
+            Cogl.rectangle(0, 0, geom.width, width);
+            Cogl.rectangle(geom.width - width, width,
+                           geom.width, geom.height);
+            Cogl.rectangle(0, geom.height,
+                           geom.width - width, geom.height - width);
+            Cogl.rectangle(0, geom.height - width,
+                           width, width);
+        });
+
+    actor.queue_redraw();
+    return signalId;
+}
+
 function Inspector() {
     this._init();
 }
@@ -494,10 +519,13 @@ Inspector.prototype = {
         let position = '[inspect x: ' + stageX + ' y: ' + stageY + ']';
         this._displayText.text = '';
         this._displayText.text = position + ' ' + this._target;
-        if (this._borderPaintTarget != null)
+
-            this._borderPaintTarget.disconnect(this._borderPaintId);
+        if (this._borderPaintTarget != this._target) {
-        this._borderPaintTarget = this._target;
+            if (this._borderPaintTarget != null)
-        this._borderPaintId = Shell.add_hook_paint_red_border(this._target);
+                this._borderPaintTarget.disconnect(this._borderPaintId);
+            this._borderPaintTarget = this._target;
+            this._borderPaintId = addBorderPaintHook(this._target);
+        }
     }
 };
 
@@ -827,7 +855,7 @@ LookingGlass.prototype = {
         }
         if (obj instanceof Clutter.Actor) {
             this._borderPaintTarget = obj;
-            this._borderPaintId = Shell.add_hook_paint_red_border(obj);
+            this._borderPaintId = addBorderPaintHook(obj);
             this._borderDestroyId = obj.connect('destroy', Lang.bind(this, function () {
                 this._borderDestroyId = 0;
                 this._borderPaintTarget = null;

src/shell-drawing.c

@@ -106,33 +106,3 @@ shell_draw_box_pointer (StDrawingArea         *area,
 
   cairo_fill (cr);
 }
-
-static void
-hook_paint_red_border (ClutterActor  *actor,
-                       gpointer       user_data)
-{
-  CoglColor color;
-  ClutterGeometry geom;
-  float width = 2;
-
-  cogl_color_set_from_4ub (&color, 0xff, 0, 0, 0xc4);
-  cogl_set_source_color (&color);
-
-  clutter_actor_get_allocation_geometry (actor, &geom);
-
-  /** clockwise order **/
-  cogl_rectangle (0, 0, geom.width, width);
-  cogl_rectangle (geom.width - width, width,
-                  geom.width, geom.height);
-  cogl_rectangle (0, geom.height,
-                  geom.width - width, geom.height - width);
-  cogl_rectangle (0, geom.height - width,
-                  width, width);
-}
-
-guint
-shell_add_hook_paint_red_border (ClutterActor *actor)
-{
-  return g_signal_connect_after (G_OBJECT (actor), "paint",
-                                 G_CALLBACK (hook_paint_red_border), NULL);
-}

src/shell-drawing.h

@@ -23,8 +23,6 @@ void shell_draw_clock (StDrawingArea       *area,
 	               int                  hour,
 	               int                  minute);
 
-guint shell_add_hook_paint_red_border (ClutterActor *actor);
-
 G_END_DECLS
 
 #endif /* __SHELL_GLOBAL_H__ */