[gnome-weather] Stop using ClutterGtk

[Giovanni Campagna <gcampagna src gnome org>]

commit ff6317a35eaabf733fad40618ab31e512d4e6a7b
Author: Giovanni Campagna <gcampagna src gnome org>
Date:   Sat Feb 23 02:03:54 2013 +0100

    Stop using ClutterGtk
    
    It interacted badly with the Gtk layout system, causing the window
    be have a weird behavior when resizing.
    And we can achieve the designs without it.

 configure.ac         |    2 +-
 data/application.css |    8 +++-
 src/main.js          |    5 +--
 src/view.js          |  126 ++++++++++++++++++++++++++------------------------
 src/window.js        |    2 +
 5 files changed, 76 insertions(+), 67 deletions(-)
---
diff --git a/configure.ac b/configure.ac
index 8df685e..5d871e4 100644
--- a/configure.ac
+++ b/configure.ac
@@ -18,7 +18,7 @@ AC_PROG_CC
 AM_PROG_CC_C_O
 LT_INIT([disable-static])
 
-LIBGD_INIT([header-bar revealer gir])
+LIBGD_INIT([header-bar stack revealer gir])
 
 PKG_PROG_PKG_CONFIG([0.22])
 
diff --git a/data/application.css b/data/application.css
index 3842a9c..da30782 100644
--- a/data/application.css
+++ b/data/application.css
@@ -1,3 +1,9 @@
-.white-background {
+#weather-page {
+    padding: 12px;
     background: white;
 }
+
+#loading-label {
+    padding-top: 24px;
+    font-size: 1.5em;
+}
\ No newline at end of file
diff --git a/src/main.js b/src/main.js
index f09b17e..1d73509 100644
--- a/src/main.js
+++ b/src/main.js
@@ -19,13 +19,11 @@
 pkg.initSubmodule('libgd');
 pkg.initGettext();
 pkg.initFormat();
-pkg.require({ 'Clutter': '1.0',
-              'Gd': '1.0',
+pkg.require({ 'Gd': '1.0',
               'Gdk': '3.0',
               'GLib': '2.0',
               'GObject': '2.0',
               'Gtk': '3.0',
-              'GtkClutter': '1.0',
               'GWeather': '3.0',
               'Lang': '1.0',
               'Mainloop': '1.0',
@@ -44,7 +42,6 @@ const Application = new Lang.Class({
     },
 
     vfunc_startup: function() {
-        GtkClutter.init(null);
         this.parent();
 
         Util.loadStyleSheet();
diff --git a/src/view.js b/src/view.js
index 6a10927..dc64c1c 100644
--- a/src/view.js
+++ b/src/view.js
@@ -20,58 +20,74 @@ const Conditions = imports.conditions;
 const Forecast = imports.forecast;
 const Util = imports.util;
 
+const SPINNER_SIZE = 128;
+
+const WeatherWidget = new Lang.Class({
+    Name: 'WeatherWidget',
+    Extends: Gtk.Frame,
+
+    _init: function(params) {
+        params = Params.fill(params, { shadow_type: Gtk.ShadowType.NONE,
+                                       name: 'weather-page' });
+        this.parent(params);
+
+        let grid = new Gtk.Grid();
+        this._icon = new Gtk.Image({ pixel_size: 256,
+                                     halign: Gtk.Align.CENTER,
+                                     valign: Gtk.Align.CENTER,
+                                     hexpand: true,
+                                     vexpand: true });
+        grid.attach(this._icon, 0, 0, 1, 1);
+
+        this._conditions = new Conditions.ConditionsSidebar();
+        grid.attach(this._conditions, 1, 0, 1, 1);
+
+        this._forecasts = new Forecast.ForecastBox();
+        grid.attach(this._forecasts, 0, 1, 2, 1);
+
+        this.add(grid);
+    },
+
+    clear: function() {
+        this._forecasts.clear();
+    },
+
+    update: function(info) {
+        this._conditions.update(info);
+
+        this._icon.icon_name = info.get_icon_name();
+
+        let forecasts = info.get_forecast_list();
+        if (forecasts.length > 0) {
+            this._forecasts.update(forecasts);
+            this._forecasts.show();
+        } else {
+            this._forecasts.hide();
+        }
+    }
+});
+
 const WeatherView = new Lang.Class({
     Name: 'WeatherView',
-    Extends: GtkClutter.Embed,
+    Extends: Gd.Stack,
 
     _init: function(params) {
         let filtered = Params.filter(params, { info: null });
-        params = Params.fill(params, { use_layout_size: true });
         this.parent(params);
 
-        let iconBin = new GtkClutter.Actor();
-        iconBin.add_constraint(new Clutter.AlignConstraint({ align_axis: Clutter.AlignAxis.BOTH,
-                                                             factor: 0.5,
-                                                             source: this.get_stage() }));
-        this.get_stage().add_actor(iconBin);
+        let loadingPage = new Gtk.Grid({ orientation: Gtk.Orientation.VERTICAL,
+                                         halign: Gtk.Align.CENTER,
+                                         valign: Gtk.Align.CENTER });
 
-        this._icon = new Gtk.Image({ pixel_size: 256,
-                                     visible: true });
-        iconBin.get_widget().get_style_context().add_class('white-background');
-        iconBin.get_widget().add(this._icon);
-
-        let currentBox = new GtkClutter.Actor({ margin_right:15,
-                                                margin_top:15 });
-        currentBox.add_constraint(new Clutter.AlignConstraint({ align_axis: Clutter.AlignAxis.X_AXIS,
-                                                                factor: 1.0,
-                                                                source: this.get_stage() }));
-        currentBox.add_constraint(new Clutter.AlignConstraint({ align_axis: Clutter.AlignAxis.Y_AXIS,
-                                                                factor: 0.0,
-                                                                source: this.get_stage() }));
-        this.get_stage().add_actor(currentBox);
-        this._conditions = new Conditions.ConditionsSidebar();
-        currentBox.get_widget().add(this._conditions);
-        currentBox.get_widget().get_style_context().add_class('white-background');
-
-        let forecastsBin = new GtkClutter.Actor({ margin_bottom: 10,
-                                                  margin_left: 5,
-                                                  margin_right: 5 });
-        forecastsBin.add_constraint(new Clutter.AlignConstraint({ align_axis: Clutter.AlignAxis.Y_AXIS,
-                                                                  factor: 1.0,
-                                                                  source: this.get_stage() }));
-        forecastsBin.add_constraint(new Clutter.BindConstraint({ coordinate: Clutter.BindCoordinate.WIDTH,
-                                                                 source: this.get_stage() }));
-        this.get_stage().add_actor(forecastsBin);
-        this._forecasts = new Forecast.ForecastBox();
-        forecastsBin.get_widget().add(this._forecasts)
-        forecastsBin.get_widget().get_style_context().add_class('white-background')
+        this._spinner = new Gtk.Spinner({ height_request: SPINNER_SIZE,
+                                          width_request: SPINNER_SIZE });
+        loadingPage.add(this._spinner);
+        loadingPage.add(new Gtk.Label({ label: _("Loading..."),
+                                        name: "loading-label" }));
+        this.add_named(loadingPage, 'loading');
 
-        let [ok, color] = Clutter.Color.from_string('#a0a0a0');
-        this._overlay = new Clutter.Actor({ background_color: color });
-        this._overlay.add_constraint(new Clutter.BindConstraint({ coordinate: Clutter.BindCoordinate.ALL,
-                                                                  source: this.get_stage() }));
-        this._overlay.show();
-        this.get_stage().add_actor(this._overlay);
+        this._infoPage = new WeatherWidget();
+        this.add_named(this._infoPage, 'info');
 
         this._info = filtered.info;
         this._updateId = this._info.connect('updated',
@@ -88,26 +104,14 @@ const WeatherView = new Lang.Class({
     },
 
     beginUpdate: function() {
-        this._forecasts.clear();
-        this._overlay.show();
-        this._overlay.opacity = 255;
+        this.visible_child_name = 'loading';
+        this._spinner.start();
+        this._infoPage.clear();
     },
 
     _onUpdate: function(info) {
-        this._overlay.save_easing_state();
-        this._overlay.opacity = 0;
-        this._overlay.restore_easing_state();
-
-        this._conditions.update(info);
-
-        this._icon.icon_name = info.get_icon_name();
-
-        let forecasts = info.get_forecast_list();
-        if (forecasts.length > 0) {
-            this._forecasts.update(forecasts);
-            this._forecasts.show();
-        } else {
-            this._forecasts.hide();
-        }
+        this._infoPage.update(info);
+        this._spinner.stop();
+        this.visible_child_name = 'info';
     }
 });
diff --git a/src/window.js b/src/window.js
index 9643dca..88ca011 100644
--- a/src/window.js
+++ b/src/window.js
@@ -91,6 +91,8 @@ const MainWindow = new Lang.Class({
 
         this.add(grid);
         grid.show_all();
+
+        this._view.beginUpdate();
     },
 
     get location() {