Added back button to categories page

Designers wanted a back button the categories page
to make it easier for users to navigate back to
the home page. This button is an asset button
from our SDK.

[endlessm/eos-sdk#270]

3 files changed, 25 insertions, 7 deletions

diff --git a/wikipedia/PrebuiltCategoryPage.js b/wikipedia/PrebuiltCategoryPage.js
index 3cb298d..fad4fcd 100644
--- a/wikipedia/PrebuiltCategoryPage.js
+++ b/wikipedia/PrebuiltCategoryPage.js
@@ -1,21 +1,25 @@
-const EndlessWikipedia = imports.wikipedia.EndlessWikipedia;
+const Endless = imports.gi.Endless;
+const Gettext = imports.gettext;
+const GLib = imports.gi.GLib;
 const GObject = imports.gi.GObject;
-const GdkPixbuf = imports.gi.GdkPixbuf;
 const Gtk = imports.gi.Gtk;
 const Lang = imports.lang;
 
 const BoxWithBg = imports.wikipedia.widgets.BoxWithBg;
+const Config = imports.wikipedia.config;
 const FixedSizeTextView = imports.wikipedia.widgets.FixedSizeTextView;
 const ScaledImage = imports.wikipedia.widgets.scaled_image;
 
 const SUBMENU_SEPARATOR_A_URI = "/com/endlessm/wikipedia-domain/assets/submenu_separator_shadow_a.png";
 const SPLASH_SEPARATOR_URI = "/com/endlessm/wikipedia-domain/assets/category_splash_separator_shadow.png";
 const INTRO_TITLE_SEPARATOR_URI = "/com/endlessm/wikipedia-domain/assets/introduction_title_separator.png";
-
 const LEFT_MARGIN_FOR_TEXT = 45;
 
 GObject.ParamFlags.READWRITE = GObject.ParamFlags.READABLE | GObject.ParamFlags.WRITABLE;
 
+const _ = function(string) { return GLib.dgettext('eos-sdk', string); };
+Gettext.bindtextdomain('eos-sdk', Config.DATADIR + '/locale');
+
 function _resourceUriToPath(uri) {
     if(uri.startsWith('resource://'))
         return uri.slice('resource://'.length);
@@ -44,6 +48,10 @@ const PrebuiltCategoryPage = new Lang.Class({
             '')
     },
 
+    Signals: {
+        'go-back-home':{}
+    },
+
     _init: function(props) {
         this._shaded_box = new BoxWithBg.BoxWithBg({
             name: "category_info",
@@ -108,12 +116,19 @@ const PrebuiltCategoryPage = new Lang.Class({
         this._description_scrolled_window.set_policy(Gtk.PolicyType.NEVER,
             Gtk.PolicyType.AUTOMATIC);
 
-        this._back_button = new Gtk.Button({
+        this._back_button = new Endless.AssetButton({
             valign: Gtk.Align.CENTER,
             hexpand: true,
-            child: new Gtk.Image({ resource: '/com/endlessm/wikipedia-domain/assets/play.png'})
+            normal_image_uri: "resource://com/endlessm/wikipedia-domain/assets/introduction_back_button_normal.png",
+            active_image_uri: "resource://com/endlessm/wikipedia-domain/assets/introduction_back_button_pressed.png",
+            prelight_image_uri: "resource://com/endlessm/wikipedia-domain/assets/introduction_back_button_hover.png",
+            label: _("OTHER CATEGORIES")
         });
 
+        this._back_button.connect('clicked', Lang.bind(this, function() {
+            this.emit('go-back-home');
+        }));
+
         this.parent(props);
 
         this._shaded_box.add(this._title_label);
@@ -124,7 +139,7 @@ const PrebuiltCategoryPage = new Lang.Class({
         this._layout_grid.add(this._shaded_box);
         
         this._overlay = new Gtk.Overlay({
-            halign:Gtk.Align.END
+            halign: Gtk.Align.END
         });
         this._overlay.add(this._layout_grid);
         this._overlay.add_overlay(this._submenu_separator);
diff --git a/wikipedia/views/domain_wiki_view.js b/wikipedia/views/domain_wiki_view.js
index bddaa7b..90a29ff 100644
--- a/wikipedia/views/domain_wiki_view.js
+++ b/wikipedia/views/domain_wiki_view.js
@@ -153,6 +153,9 @@ const DomainWikiView = new Lang.Class({
 
         this._category_back_button.connect('clicked',
             Lang.bind(this, this._onCategoryBackClicked));
+
+        this._category_view.connect('go-back-home',
+            Lang.bind(this, this._onCategoryBackClicked));
     },
 
     _set_article_sidebar_uri: function(uri){
diff --git a/wikipedia/widgets/FixedSizeTextView.js b/wikipedia/widgets/FixedSizeTextView.js
index 14b82dc..f655d88 100644
--- a/wikipedia/widgets/FixedSizeTextView.js
+++ b/wikipedia/widgets/FixedSizeTextView.js
@@ -8,7 +8,7 @@ const FixedSizeTextView = new Lang.Class({
     Name: "FixedSizeTextView",
     Extends: Gtk.TextView,
 
-    vfunc_get_preferred_width:function(){
+    vfunc_get_preferred_width: function(){
         return [CATEGORY_DESCRIPTION_WIDTH, CATEGORY_DESCRIPTION_WIDTH];
     }
 });