Reorganize stage in terms of a UI Group actor and everything else

In preparation for adding magnification, "uiGroup.patch", organizes the stage
along the following lines:

Stage
  *Magnifier
  UI group
    Window group
    Chrome group
    Overlay group
    Alt tab
    App display
    Chrome
    ...

This allows a magnifier actor to clone and magnify the UI group.  The magnifier
is a sibling of the UI Group in this stage oraganization -- see the next patch,
"Magnifier.patch".

js/ui/altTab.js

@@ -54,7 +54,7 @@ AltTabPopup.prototype = {
         // the switcher appears underneath the current pointer location
         this._disableHover();
 
-        global.stage.add_actor(this.actor);
+        Main.uiGroup.add_actor(this.actor);
     },
 
     _getPreferredWidth: function (actor, forHeight, alloc) {

js/ui/appDisplay.js

@@ -616,7 +616,7 @@ AppIconMenu.prototype = {
         }));
         source.actor.connect('destroy', Lang.bind(this, function () { this.actor.destroy(); }));
 
-        global.stage.add_actor(this.actor);
+        Main.uiGroup.add_actor(this.actor);
     },
 
     _getPreferredWidth: function(actor, forHeight, alloc) {

js/ui/chrome.js

@@ -35,7 +35,7 @@ Chrome.prototype = {
     _init: function() {
         // The group itself has zero size so it doesn't interfere with DND
         this.actor = new Shell.GenericContainer({ width: 0, height: 0 });
-        global.stage.add_actor(this.actor);
+        Main.uiGroup.add_actor(this.actor);
         this.actor.connect('allocate', Lang.bind(this, this._allocated));
 
         this._inFullscreen = false;

js/ui/dnd.js

@@ -6,6 +6,7 @@ const St = imports.gi.St;
 const Lang = imports.lang;
 const Signals = imports.signals;
 const Tweener = imports.ui.tweener;
+const Main = imports.ui.main;
 
 const Params = imports.misc.params;
 
@@ -22,7 +23,7 @@ function _getEventHandlerActor() {
         eventHandlerActor = new Clutter.Rectangle();
         eventHandlerActor.width = 0;
         eventHandlerActor.height = 0;
-        global.stage.add_actor(eventHandlerActor);
+        Main.uiGroup.add_actor(eventHandlerActor);
         // We connect to 'event' rather than 'captured-event' because the capturing phase doesn't happen
         // when you've grabbed the pointer.
         eventHandlerActor.connect('event',

js/ui/lookingGlass.js

@@ -257,7 +257,7 @@ Inspector.prototype = {
         eventHandler.connect('notify::allocation', Lang.bind(this, function () {
             eventHandler.x = primary.x + Math.floor((primary.width - eventHandler.width) / 2);
         }));
-        global.stage.add_actor(eventHandler);
+        Main.uiGroup.add_actor(eventHandler);
         let displayText = new St.Label();
         eventHandler.add(displayText, { expand: true });
 
@@ -471,7 +471,7 @@ LookingGlass.prototype = {
                       Lang.bind(this, this._updateFont));
         this._updateFont();
 
-        global.stage.add_actor(this.actor);
+        Main.uiGroup.add_actor(this.actor);
 
         let toolbar = new St.BoxLayout({ name: "Toolbar" });
         this.actor.add_actor(toolbar);

js/ui/main.js

@@ -45,6 +45,7 @@ let recorder = null;
 let shellDBusService = null;
 let modalCount = 0;
 let modalActorFocusStack = [];
+let uiGroup = null;
 let _errorLogStack = [];
 let _startDate;
 
@@ -105,6 +106,12 @@ function start() {
        getRunDialog().open();
     });
 
+    // Set up stage hierarchy to group all UI actors under one container.
+    uiGroup = new Clutter.Group();
+    global.window_group.reparent(uiGroup);
+    global.overlay_group.reparent(uiGroup);
+    global.stage.add_actor(uiGroup);
+
     placesManager = new PlaceDisplay.PlacesManager();
     overview = new Overview.Overview();
     chrome = new Chrome.Chrome();

js/ui/panel.js

@@ -605,7 +605,7 @@ Panel.prototype = {
                                    transition: 'linear',
                                    onUpdate: function() { ripple.opacity = 255 * Math.sqrt(ripple._opacity); },
                                    onComplete: function() { ripple.destroy(); } });
-        global.stage.add_actor(ripple);
+        Main.uiGroup.add_actor(ripple);
     },
 
     _onHotCornerEntered : function() {

js/ui/runDialog.js

@@ -213,7 +213,7 @@ RunDialog.prototype = {
         // hidden then show it in show()
         this._group = new Clutter.Group({ visible: false,
                                           x: 0, y: 0 });
-        global.stage.add_actor(this._group);
+        Main.uiGroup.add_actor(this._group);
 
         let lightbox = new Lightbox.Lightbox(this._group, true);
 

js/ui/workspaceSwitcherPopup.js

@@ -5,6 +5,7 @@ const Lang = imports.lang;
 const Mainloop = imports.mainloop;
 const Shell = imports.gi.Shell;
 const St = imports.gi.St;
+const Main = imports.ui.main;
 
 const Tweener = imports.ui.tweener;
 
@@ -25,7 +26,7 @@ WorkspaceSwitcherPopup.prototype = {
                                          y: 0,
                                          width: global.screen_width,
                                          height: global.screen_height });
-        global.stage.add_actor(this.actor);
+        Main.uiGroup.add_actor(this.actor);
 
         this._scaleWidth = global.screen_width / global.screen_height;