[gnome-weather] Begin implementing the new application design

[Giovanni Campagna <gcampagna src gnome org>]

commit 5ed9cd42be5fd2272ee1f4d615c339734d4be10d
Author: Giovanni Campagna <gcampagna src gnome org>
Date:   Sat Feb 23 02:42:24 2013 +0100

    Begin implementing the new application design
    
    Use symbolic icons everywhere. Kill the conditions sidebar and use
    two labels at the center, next to the icon with the current conditions.

 data/application.css |   19 +++++++++++++-
 src/Makefile.am      |    1 -
 src/conditions.js    |   66 --------------------------------------------------
 src/forecast.js      |    4 ++-
 src/view.js          |   62 +++++++++++++++++++++++++++++++++++-----------
 5 files changed, 68 insertions(+), 84 deletions(-)
---
diff --git a/data/application.css b/data/application.css
index da30782..96eb94b 100644
--- a/data/application.css
+++ b/data/application.css
@@ -1,9 +1,26 @@
 #weather-page {
     padding: 12px;
-    background: white;
+    /*background: white;*/
 }
 
 #loading-label {
     padding-top: 24px;
     font-size: 1.5em;
+}
+
+#temperature-label {
+    font-size: 4em;
+}
+#condition-label {
+    font-size: 2.5em;
+}
+#attribution-label {
+    font-size: small;
+}
+
+#conditions-image:dir(ltr) {
+    padding-right: 12px;
+}
+#conditions-image:dir(rtl) {
+    padding-left: 12px;
 }
\ No newline at end of file
diff --git a/src/Makefile.am b/src/Makefile.am
index 624cb27..f9b0641 100644
--- a/src/Makefile.am
+++ b/src/Makefile.am
@@ -4,7 +4,6 @@ nodist_bin_SCRIPTS = gnome-weather
 
 jsdir = $(pkgdatadir)
 dist_js_DATA = \
-       conditions.js   \
        forecast.js     \
        main.js         \
        strings.js      \
diff --git a/src/forecast.js b/src/forecast.js
index c23d851..50cfba7 100644
--- a/src/forecast.js
+++ b/src/forecast.js
@@ -30,6 +30,7 @@ const ForecastBox = new Lang.Class({
     _init: function(params) {
         params = Params.fill({ orientation: Gtk.Orientation.HORIZONTAL,
                                column_spacing: 24,
+                               row_spacing: 6,
                                column_homogeneous: true });
         this.parent(params);
     },
@@ -61,8 +62,9 @@ const ForecastBox = new Lang.Class({
                                         visible: true });
             this.attach(label, n, 0, 1, 1);
 
-            let image = new Gtk.Image({ icon_name: info.get_icon_name(),
+            let image = new Gtk.Image({ icon_name: info.get_symbolic_icon_name(),
                                         icon_size: Gtk.IconSize.DIALOG,
+                                        use_fallback: true,
                                         visible: true });
             this.attach(image, n, 1, 1, 1);
 
diff --git a/src/view.js b/src/view.js
index dc64c1c..6c16efb 100644
--- a/src/view.js
+++ b/src/view.js
@@ -16,7 +16,6 @@
 // with Gnome Weather; if not, write to the Free Software Foundation,
 // Inc., 51 Franklin St, Fifth Floor, Boston, MA  02110-1301  USA
 
-const Conditions = imports.conditions;
 const Forecast = imports.forecast;
 const Util = imports.util;
 
@@ -31,21 +30,42 @@ const WeatherWidget = new Lang.Class({
                                        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);
+        let outerGrid = new Gtk.Grid({ orientation: Gtk.Orientation.VERTICAL });
 
-        this._conditions = new Conditions.ConditionsSidebar();
-        grid.attach(this._conditions, 1, 0, 1, 1);
+        let alignment = new Gtk.Grid({ hexpand: true, vexpand: true,
+                                       halign: Gtk.Align.CENTER,
+                                       valign: Gtk.Align.CENTER });
 
-        this._forecasts = new Forecast.ForecastBox();
-        grid.attach(this._forecasts, 0, 1, 2, 1);
+        let innerGrid = new Gtk.Grid({ hexpand: false, vexpand: false });
+        this._icon = new Gtk.Image({ pixel_size: 172,
+                                     use_fallback: true,
+                                     name: 'conditions-image' });
+        innerGrid.attach(this._icon, 0, 0, 1, 2);
 
-        this.add(grid);
+        this._temperature = new Gtk.Label({ xalign: 0.0,
+                                            name: 'temperature-label',
+                                            vexpand: true,
+                                            valign: Gtk.Align.END });
+        innerGrid.attach(this._temperature, 1, 0, 1, 1);
+
+        this._conditions = new Gtk.Label({ xalign: 0.0,
+                                           name: 'condition-label',
+                                           valign: Gtk.Align.END });
+        innerGrid.attach(this._conditions, 1, 1, 1, 1);
+
+        this._attribution = new Gtk.Label({ xalign: 0.0, wrap: true,
+                                            name: 'attribution-label',
+                                            max_width_chars: 30,
+                                            use_markup: true });
+        innerGrid.attach(this._attribution, 1, 2, 1, 1);
+
+        alignment.add(innerGrid);
+        outerGrid.add(alignment);
+
+        this._forecasts = new Forecast.ForecastBox({ hexpand: true });
+        outerGrid.add(this._forecasts);
+
+        this.add(outerGrid);
     },
 
     clear: function() {
@@ -53,9 +73,21 @@ const WeatherWidget = new Lang.Class({
     },
 
     update: function(info) {
-        this._conditions.update(info);
+        let conditions = info.get_conditions();
+        if (conditions == '-') // Not significant
+            conditions = info.get_sky();
+        this._conditions.label = conditions;
+        this._temperature.label = info.get_temp_summary();
+
+        let attr = info.get_attribution();
+        if (attr) {
+            this._attribution.label = attr;
+            this._attribution.show();
+        } else {
+            this._attribution.hide();
+        }
 
-        this._icon.icon_name = info.get_icon_name();
+        this._icon.icon_name = info.get_symbolic_icon_name();
 
         let forecasts = info.get_forecast_list();
         if (forecasts.length > 0) {