diff options
Diffstat (limited to 'wikipedia/widgets')
| -rw-r--r-- | wikipedia/widgets/BackButton.js | 26 | ||||
| -rw-r--r-- | wikipedia/widgets/FixedSizeTextView.js | 14 | ||||
| -rw-r--r-- | wikipedia/widgets/ListTextButton.js | 58 | ||||
| -rw-r--r-- | wikipedia/widgets/category_back_button.js | 51 | ||||
| -rw-r--r-- | wikipedia/widgets/category_button.js | 203 | ||||
| -rw-r--r-- | wikipedia/widgets/category_layout_manager.js | 74 | ||||
| -rw-r--r-- | wikipedia/widgets/category_selector_view.js | 56 | ||||
| -rw-r--r-- | wikipedia/widgets/composite_button.js | 57 |
8 files changed, 0 insertions, 539 deletions
diff --git a/wikipedia/widgets/BackButton.js b/wikipedia/widgets/BackButton.js deleted file mode 100644 index 2d44e3f..0000000 --- a/wikipedia/widgets/BackButton.js +++ /dev/null @@ -1,26 +0,0 @@ -const Endless = imports.gi.Endless; -const Gettext = imports.gettext; -const GLib = imports.gi.GLib; -const GObject = imports.gi.GObject; -const Gtk = imports.gi.Gtk; -const Lang = imports.lang; - -const Config = imports.wikipedia.config; - -const _ = function(string) { return GLib.dgettext('eos-sdk', string); }; -Gettext.bindtextdomain('eos-sdk', Config.DATADIR + '/locale'); - -const BACK_BUTTON_URI = "resource://com/endlessm/wikipedia-domain/assets/topbar_back_icon_normal.png"; - -const BackButton = new Lang.Class({ - Name: 'BackButton', - Extends: Endless.AssetButton, - - _init: function(props) { - props = props || {}; - props.label = _("BACK"); - props.normal_image_uri = BACK_BUTTON_URI; - - this.parent(props); - } -}); diff --git a/wikipedia/widgets/FixedSizeTextView.js b/wikipedia/widgets/FixedSizeTextView.js deleted file mode 100644 index f655d88..0000000 --- a/wikipedia/widgets/FixedSizeTextView.js +++ /dev/null @@ -1,14 +0,0 @@ -const GObject = imports.gi.GObject; -const Gtk = imports.gi.Gtk; -const Lang = imports.lang; - -const CATEGORY_DESCRIPTION_WIDTH = 520; - -const FixedSizeTextView = new Lang.Class({ - Name: "FixedSizeTextView", - Extends: Gtk.TextView, - - vfunc_get_preferred_width: function(){ - return [CATEGORY_DESCRIPTION_WIDTH, CATEGORY_DESCRIPTION_WIDTH]; - } -}); diff --git a/wikipedia/widgets/ListTextButton.js b/wikipedia/widgets/ListTextButton.js deleted file mode 100644 index 41a7585..0000000 --- a/wikipedia/widgets/ListTextButton.js +++ /dev/null @@ -1,58 +0,0 @@ -const Lang = imports.lang; -const Gdk = imports.gi.Gdk; -const GdkPixbuf = imports.gi.GdkPixbuf; -const Gtk = imports.gi.Gtk; -const Pango = imports.gi.Pango; - -// This is an approximate number of characters that will keep the label from -// going over its specified width -const ARTICLE_LABEL_MAX_WIDTH_CHARS = 20; - -const ListTextButton = new Lang.Class({ - Name: 'EndlessListTextButton', - Extends: Gtk.Button, - - // This is a button for the article list widget. It has a label and an icon image. - // The icon image will only appear on hover or press of button - _init: function(hover_icon_path, label_text, params) { - params.hexpand = true; - this.parent(params); - - this._hover_icon_pixbuf = GdkPixbuf.Pixbuf.new_from_resource(hover_icon_path); - - this._image = new Gtk.Image({ - opacity: 0, - }); - this._image.set_from_pixbuf(this._hover_icon_pixbuf); - - this._box = new Gtk.Box({ - orientation: Gtk.Orientation.HORIZONTAL - }); - - this._label = new Gtk.Label({ - label: label_text, - max_width_chars: ARTICLE_LABEL_MAX_WIDTH_CHARS, - ellipsize: Pango.EllipsizeMode.END - }); - - this._box.pack_start(this._label, false, false, 0); - this._box.pack_end(this._image, false, false, 0); - - this.add(this._box); - this.connect('state-changed', Lang.bind(this, this._update_appearance)); - this.show_all(); - }, - - _update_appearance: function(widget, state) { - // If button is hovered over and/or pressed, then show the arrow icon - if (widget.get_state_flags() & Gtk.StateFlags.ACTIVE || - widget.get_state_flags() & Gtk.StateFlags.PRELIGHT) { - this._image.set_opacity(1); - return false; - } - // If no hover or press, then hide the arrow icon - this._image.set_opacity(0); - return false; - } -}); - diff --git a/wikipedia/widgets/category_back_button.js b/wikipedia/widgets/category_back_button.js deleted file mode 100644 index e959fa8..0000000 --- a/wikipedia/widgets/category_back_button.js +++ /dev/null @@ -1,51 +0,0 @@ -// Copyright 2014 Endless Mobile, Inc. - -const Gettext = imports.gettext; -const Gio = imports.gi.Gio; -const GLib = imports.gi.GLib; -const Gtk = imports.gi.Gtk; -const Lang = imports.lang; - -const CompositeButton = imports.wikipedia.widgets.composite_button; -const Config = imports.wikipedia.config; - -const _ = function (string) { return GLib.dgettext('eos-sdk', string); }; -Gettext.bindtextdomain('eos-sdk', Config.DATADIR + '/locale'); - -const CATEGORY_BACK_BUTTON_RESOURCE_URI = 'resource:///com/endlessm/wikipedia-domain/assets/wikipedia-category-back-symbolic.svg'; -const CATEGORY_BACK_BUTTON_SIZE_PIXELS = 68; -const STYLE_CONTEXT_LABEL = 'label'; -const STYLE_CONTEXT_BACK = 'back'; - -const CategoryBackButton = new Lang.Class({ - Name: 'CategoryBackButton', - GTypeName: 'CategoryBackButton', - Extends: CompositeButton.CompositeButton, - - _init: function(props) { - this.parent(props); - - let gicon = new Gio.FileIcon({ - file: Gio.File.new_for_uri(CATEGORY_BACK_BUTTON_RESOURCE_URI) - }); - let icon = Gtk.Image.new_from_gicon(gicon, Gtk.IconSize.DIALOG); - icon.pixel_size = CATEGORY_BACK_BUTTON_SIZE_PIXELS; - let label = new Gtk.Label({ - label: _("OTHER CATEGORIES") - }); - let innerGrid = new Gtk.Grid({ - expand: true, - valign: Gtk.Align.CENTER - }); - - innerGrid.add(icon); - innerGrid.add(label); - this.add(innerGrid); - this.setSensitiveChildren([icon, label]); - - // Define style classes for CSS - icon.get_style_context().add_class(Gtk.STYLE_CLASS_IMAGE); - label.get_style_context().add_class(STYLE_CONTEXT_LABEL); - this.get_style_context().add_class(STYLE_CONTEXT_BACK); - } -}); diff --git a/wikipedia/widgets/category_button.js b/wikipedia/widgets/category_button.js deleted file mode 100644 index c116018..0000000 --- a/wikipedia/widgets/category_button.js +++ /dev/null @@ -1,203 +0,0 @@ -const Gdk = imports.gi.Gdk; -const GdkPixbuf = imports.gi.GdkPixbuf; -const Gio = imports.gi.Gio; -const GObject = imports.gi.GObject; -const Gtk = imports.gi.Gtk; -const Lang = imports.lang; - -const CompositeButton = imports.wikipedia.widgets.composite_button; -const EndlessWikipedia = imports.wikipedia.EndlessWikipedia; -const Utils = imports.wikipedia.utils; - -const CATEGORY_LABEL_LEFT_MARGIN_PIXELS = 5; // in addition to the 20px below -const CATEGORY_LABEL_SPACING_PIXELS = 20; -const CATEGORY_BUTTON_SIZE_PIXELS = 42; -const CATEGORY_BUTTON_RESOURCE_URI = 'resource:///com/endlessm/wikipedia-domain/assets/wikipedia-category-forward-symbolic.svg'; -const CATEGORY_MIN_WIDTH = 120; // pixels - -GObject.ParamFlags.READWRITE = GObject.ParamFlags.READABLE | GObject.ParamFlags.WRITABLE; - -const CategoryButton = new Lang.Class({ - Name: 'CategoryButton', - Extends: CompositeButton.CompositeButton, - Properties: { - // resource URI for the category's accompanying image - 'image-uri': GObject.ParamSpec.string('image-uri', - 'Image URI', - 'Resource URI for the image file accompanying the category', - GObject.ParamFlags.READWRITE | GObject.ParamFlags.CONSTRUCT, - ''), - - // Title of the category to display - 'category-title': GObject.ParamSpec.string('category-title', - 'Category title', - 'Display name for the category', - GObject.ParamFlags.READWRITE | GObject.ParamFlags.CONSTRUCT, - ''), - - // Boolean whether this button is clickable - 'clickable-category': GObject.ParamSpec.boolean('clickable-category', - 'Clickable Category', - 'Flag whether this category button should be clickable', - GObject.ParamFlags.READWRITE | GObject.ParamFlags.CONSTRUCT_ONLY, - true), - - // Boolean whether this button is the main category - 'is-main-category': GObject.ParamSpec.boolean('is-main-category', - 'Is Main Category', - 'Flag whether this category button is the main category', - GObject.ParamFlags.READWRITE | GObject.ParamFlags.CONSTRUCT_ONLY, - false) - }, - - _init: function(props) { - // Get ready for property construction - this._image_uri = null; - this._category_title = null; - this._clickable_category = null; - this._is_main_category = null; - this._pixbuf = null; - - this._inner_grid = new Gtk.Grid({ - valign: Gtk.Align.END, - halign: Gtk.Align.FILL, - border_width: CATEGORY_LABEL_SPACING_PIXELS, - column_spacing: CATEGORY_LABEL_SPACING_PIXELS, - expand: true - }); - this._label = new Gtk.Label({ - margin_left: CATEGORY_LABEL_LEFT_MARGIN_PIXELS, - halign: Gtk.Align.START, - valign: Gtk.Align.BASELINE, - xalign: 0.0, // deprecated Gtk.Misc properties; necessary because - wrap: true, // "wrap" doesn't respect "halign" - max_width_chars: 20 - }); - this._arrow = new Gtk.Image({ - gicon: new Gio.FileIcon({ - file: Gio.File.new_for_uri(CATEGORY_BUTTON_RESOURCE_URI) - }), - pixel_size: CATEGORY_BUTTON_SIZE_PIXELS, - hexpand: true, - halign: Gtk.Align.END, - valign: Gtk.Align.END - }); - this._arrow.get_style_context().add_class(Gtk.STYLE_CLASS_IMAGE); - - let context = this._label.get_style_context(); - context.add_class(EndlessWikipedia.STYLE_CLASS_TITLE); - context.add_class(EndlessWikipedia.STYLE_CLASS_CATEGORY); - context.add_class(EndlessWikipedia.STYLE_CLASS_FRONT_PAGE); - - // Parent constructor sets all properties - this.parent(props); - - // Put widgets together - this.setSensitiveChildren([this._arrow]); - this._inner_grid.add(this._label); - this._inner_grid.add(this._arrow); - this.add(this._inner_grid); - this.show_all(); - - // For some reason, on the NUC, setting opacity in CSS for this button does not work. - // So we have to set it in Gtk code. Also, we have to set the opacity - // to zero upfront. I am putting that here instead of in the initialisation - // of the arrow since it is part of this NUC-specific hack - this._arrow.connect('state-flags-changed', Lang.bind(this, this._update_appearance)); - this._arrow.set_opacity(0) - }, - - _update_appearance: function(widget) { - // If button is hovered over and/or pressed, then show the arrow icon - if ((widget.get_state_flags() & Gtk.StateFlags.ACTIVE || - widget.get_state_flags() & Gtk.StateFlags.PRELIGHT) && - this._clickable_category) { - this._arrow.set_opacity(1); - return false; - } - // If no hover or press, then hide the arrow icon - this._arrow.set_opacity(0); - return false; - }, - - get image_uri() { - return this._image_uri; - }, - - set image_uri(value) { - this._image_uri = value; - }, - - get category_title() { - return this._category_title; - }, - - set category_title(value) { - this._category_title = value; - if(this._label) - this._label.set_text(value.toUpperCase()); - }, - - get clickable_category() { - return this._clickable_category; - }, - - set clickable_category(value) { - this._clickable_category = value; - this._update_appearance(this._arrow); - }, - - get is_main_category() { - return this._is_main_category; - }, - - set is_main_category(value) { - this._is_main_category = value; - if(this._is_main_category) { - let context = this._label.get_style_context(); - context.add_class(EndlessWikipedia.STYLE_CLASS_MAIN); - this._label.max_width_chars = 9; - } - }, - - // OVERRIDES - - // Sometimes our label content runs too long and the min window width can - // be greater than the screen width. So we provide our own min width for - // category buttons here, and allow the GtkLabels to be cut off if there's - // no space. We ask for width for height management so the height will be - // allocated first. - vfunc_get_request_mode: function() { - return Gtk.SizeRequestMode.WIDTH_FOR_HEIGHT; - }, - - vfunc_get_preferred_width_for_height: function(height) { - let natural_width = this.parent(height)[1]; - return [CATEGORY_MIN_WIDTH, natural_width]; - }, - - // Reloads the pixbuf from the gresource at the proper size if necessary - _update_pixbuf: function () { - if (this._image_uri === "" || this._image_uri === null) - return; - let allocation = this.get_allocation(); - if (this._pixbuf === null || this._pixbuf.get_width() !== allocation.width || - this._pixbuf.get_height() !== allocation.height) - this._pixbuf = Utils.load_pixbuf_cover(Utils.resourceUriToPath(this._image_uri), - allocation.width, allocation.height); - }, - - vfunc_draw: function (cr) { - this._update_pixbuf(); - if (this._pixbuf !== null) { - Gdk.cairo_set_source_pixbuf(cr, this._pixbuf, 0, 0); - cr.paint(); - } - let ret = this.parent(cr); - // We need to manually call dispose on cairo contexts. This is somewhat related to the bug listed here - // https://bugzilla.gnome.org/show_bug.cgi?id=685513 for the shell. We should see if they come up with - // a better fix in the future, i.e. fix this through gjs. - cr.$dispose(); - return ret; - } -}); diff --git a/wikipedia/widgets/category_layout_manager.js b/wikipedia/widgets/category_layout_manager.js deleted file mode 100644 index cb2f94a..0000000 --- a/wikipedia/widgets/category_layout_manager.js +++ /dev/null @@ -1,74 +0,0 @@ -const Gtk = imports.gi.Gtk; -const Lang = imports.lang; - -const MAIN_CATEGORY_SCREEN_WIDTH_PERCENTAGE = 37; -const SUB_CATEGORY_SCREEN_WIDTH_PERCENTAGE = 30; - -const CategoryLayoutManager = new Lang.Class({ - Name: 'CategoryLayoutManager', - Extends: Gtk.Grid, - - _init: function(props) { - props = props || {}; - props.row_homogeneous = true; - props.column_homogeneous = true; - this.parent(props); - - this._childWidgets = []; - this._mainWidget = null; - }, - - // Distribute children in two columns, except for the last one if an odd - // number; that should span two columns. The width must be divided by - // percentage according to the spec, so we consider each column in the grid - // one percent - _redistributeChildren: function() { - let numChildren = this._childWidgets.length; - let oddNumber = numChildren % 2 == 1; - - let numRows = 1; - this._childWidgets.forEach(function(child, index) { - let column = (index % 2) * SUB_CATEGORY_SCREEN_WIDTH_PERCENTAGE + MAIN_CATEGORY_SCREEN_WIDTH_PERCENTAGE; - let row = Math.floor(index / 2); - - if(numRows < row + 1) - numRows = row + 1; //our running count of how many rows we have, which we - //need when we add the main widget. - - if(child.get_parent() === this) - Gtk.Container.prototype.remove.call(this, this._childWidgets[index]); - - if(oddNumber && index == numChildren - 1) - this.attach(child, column, row, SUB_CATEGORY_SCREEN_WIDTH_PERCENTAGE * 2, 1); - else - this.attach(child, column, row, SUB_CATEGORY_SCREEN_WIDTH_PERCENTAGE, 1); - }, this); - - if(this._mainWidget) { - if(this._mainWidget.get_parent() === this) { - Gtk.Container.prototype.remove.call(this, this._mainWidget); - } - this.attach(this._mainWidget, 0, 0, MAIN_CATEGORY_SCREEN_WIDTH_PERCENTAGE, numRows); - } - }, - - add: function(child) { - if(child.is_main_category) { - this._mainWidget = child; - } else { - this._childWidgets.push(child); - } - this._redistributeChildren(); - }, - - remove: function(child) { - let index = this._childWidgets.indexOf(child); - if(index == -1) { - printerr('Widget', System.addressOf(child), - 'is not contained in CategoryLayoutManager'); - return; - } - this._childWidgets.splice(index, 1); // remove - this._redistributeChildren(); - } -}); diff --git a/wikipedia/widgets/category_selector_view.js b/wikipedia/widgets/category_selector_view.js deleted file mode 100644 index 72eff07..0000000 --- a/wikipedia/widgets/category_selector_view.js +++ /dev/null @@ -1,56 +0,0 @@ -const GObject = imports.gi.GObject; -const Gtk = imports.gi.Gtk; -const Lang = imports.lang; - -const CategoryButton = imports.wikipedia.widgets.category_button; -const CategoryLayoutManager = imports.wikipedia.widgets.category_layout_manager; - -const CATEGORY_COLUMN_SPACING = 10; // pixels -const CATEGORY_ROW_SPACING = 10; // pixels - -const CategorySelectorView = new Lang.Class({ - Name: 'CategorySelectorView', - Extends: CategoryLayoutManager.CategoryLayoutManager, - Signals: { - 'category-chosen': { - param_types: [GObject.TYPE_STRING] - } - }, - - _init: function(props) { - props = props || {}; - props.column_spacing = CATEGORY_COLUMN_SPACING; - props.row_spacing = CATEGORY_ROW_SPACING; - this.parent(props); - }, - - /** - * Method: setCategories - * Create buttons in this view for a list of categories to display - * - * Parameters: - * categories - An array of <CategoryModels> - * - */ - setCategories: function(categories) { - categories.forEach(function (category) { - let button = new CategoryButton.CategoryButton({ - category_title: category.title, - image_uri: category.image_thumbnail_uri, - clickable_category: category.has_articles, - is_main_category: category.is_main_category, - }); - button.id = category.id; // ID to return to when clicked - //if the category has no articles, you shouldn't be able to click on it. - if (category.has_articles) { - button.connect('clicked', Lang.bind(this, this._onButtonClicked)); - } - - this.add(button); - }, this); - }, - - _onButtonClicked: function(button) { - this.emit('category-chosen', button.id); - } -});
\ No newline at end of file diff --git a/wikipedia/widgets/composite_button.js b/wikipedia/widgets/composite_button.js deleted file mode 100644 index 2fb0666..0000000 --- a/wikipedia/widgets/composite_button.js +++ /dev/null @@ -1,57 +0,0 @@ -// Copyright 2014 Endless Mobile, Inc. - -const Gtk = imports.gi.Gtk; -const Lang = imports.lang; - -// Class for buttons whose :hover and :active CSS pseudoclass states should be -// inherited by some of their child widgets, since as of GTK 3.10 these flags no -// longer propagate from a widget to its children. Widgets in sensitiveChildren -// will listen to this widget's state-flags-changed event and inherit all flag -// values listed in _INHERITED_FLAGS. - -const CompositeButton = new Lang.Class({ - Name: 'CompositeButton', - GTypeName: 'CompositeButton', - Extends: Gtk.Button, - - _INHERITED_FLAGS: [Gtk.StateFlags.PRELIGHT, Gtk.StateFlags.ACTIVE], - - _init: function (props) { - this._handlerSet = false; - this._sensitiveChildren = []; - this.parent(props); - }, - - // Set the list of child widgets which will inherit the CompositeButton's - // hover/active state flags. - setSensitiveChildren: function (children) { - this._sensitiveChildren = children; - // If the handlers for mouse events aren't already set, connect them - if (!this._handlerSet) { - this._connectStateChangedHandler(); - } - }, - - _connectStateChangedHandler: function () { - this.connect('state-flags-changed', - Lang.bind(this, this._stateChangedHandler)); - this._handlerSet = true; - }, - - _stateChangedHandler: function (widget, flags) { - let myFlags = this.get_state_flags(); - this._sensitiveChildren.forEach(function (child) { - this._INHERITED_FLAGS.forEach(function (flag) { - // for each flag we want the children to inherit, grab this - // widget's flag value, and set the child's matching flag - // accordingly - let myFlag = myFlags & flag; - if (myFlag !== 0) - child.set_state_flags(flag, false); - else - child.unset_state_flags(flag); - - }); - }, this); - } -}); |