summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
-rw-r--r--configure.ac6
-rw-r--r--data/css/eos-wikipedia-domain.css4
-rw-r--r--endless/eosflexygrid.c17
-rw-r--r--endless/eosflexygridcell.c17
-rw-r--r--endless/eospagemanager-private.h3
-rw-r--r--endless/eospagemanager.c32
-rw-r--r--endless/eoswindow.c59
-rw-r--r--test/smoke-tests/frame-rate-tests/gtk.js11
-rw-r--r--wikipedia/EndlessWikipedia.js1
-rw-r--r--wikipedia/widgets/category_button.js90
-rw-r--r--wikipedia/widgets/category_layout_manager.js22
-rw-r--r--wikipedia/widgets/category_selector_view.js1
12 files changed, 98 insertions, 165 deletions
diff --git a/configure.ac b/configure.ac
index b6551aa..0458a57 100644
--- a/configure.ac
+++ b/configure.ac
@@ -76,14 +76,14 @@ AC_SUBST(EOS_SDK_LT_VERSION_INFO)
# Required versions of libraries
# Update these whenever you use a function that requires a certain API version
-GLIB_REQUIREMENT="glib-2.0 >= 2.36"
+GLIB_REQUIREMENT="glib-2.0 >= 2.38"
GOBJECT_REQUIREMENT="gobject-2.0"
GIO_REQUIREMENT="gio-2.0"
-GTK_REQUIREMENT="gtk+-3.0 >= 3.4"
+GTK_REQUIREMENT="gtk+-3.0 >= 3.10"
# These go into the pkg-config file as Requires: and Requires.private:
# (Generally, use Requires.private: instead of Requires:)
EOS_REQUIRED_MODULES=
-EOS_REQUIRED_MODULES_PRIVATE="$GLIB_REQUIREMENT $GOBJECT_REQUIREMENT $GIO_REQUIREMENT $GTK_REQUIREMENT pstack"
+EOS_REQUIRED_MODULES_PRIVATE="$GLIB_REQUIREMENT $GOBJECT_REQUIREMENT $GIO_REQUIREMENT $GTK_REQUIREMENT"
AC_SUBST(EOS_REQUIRED_MODULES)
AC_SUBST(EOS_REQUIRED_MODULES_PRIVATE)
diff --git a/data/css/eos-wikipedia-domain.css b/data/css/eos-wikipedia-domain.css
index 932fb8b..0ad1954 100644
--- a/data/css/eos-wikipedia-domain.css
+++ b/data/css/eos-wikipedia-domain.css
@@ -71,11 +71,11 @@ Gjs_ArticleList .scrollbar.slider {
color: rgba(255, 255, 255, 0.9);
}
-Gjs_CategoryButton GtkEventBox {
+Gjs_CategoryButton.clickable {
transition: background-color 1000ms ease-in-out;
}
-Gjs_CategoryButton GtkEventBox:hover {
+Gjs_CategoryButton.clickable:hover {
background-color: alpha(#212121, 0.5);
transition: background-color 100ms ease-in-out;
}
diff --git a/endless/eosflexygrid.c b/endless/eosflexygrid.c
index d831163..81cf3ba 100644
--- a/endless/eosflexygrid.c
+++ b/endless/eosflexygrid.c
@@ -63,22 +63,11 @@ enum
LAST_SIGNAL
};
-#if GLIB_CHECK_VERSION (2, 37, 5)
-
-# define EOS_FLEXY_GRID_GET_PRIV(obj) \
+#define EOS_FLEXY_GRID_GET_PRIV(obj) \
((EosFlexyGridPrivate *) eos_flexy_grid_get_instance_private ((EosFlexyGrid *) (obj)))
G_DEFINE_TYPE_WITH_PRIVATE (EosFlexyGrid, eos_flexy_grid, GTK_TYPE_CONTAINER)
-#else
-
-# define EOS_FLEXY_GRID_GET_PRIV(obj) \
- (G_TYPE_INSTANCE_GET_PRIVATE ((obj), EOS_TYPE_FLEXY_GRID, EosFlexyGridPrivate))
-
-G_DEFINE_TYPE (EosFlexyGrid, eos_flexy_grid, GTK_TYPE_CONTAINER)
-
-#endif /* GLIB_CHECK_VERSION (2, 37, 5) */
-
static guint grid_signals[LAST_SIGNAL] = { 0, };
static GParamSpec *grid_props[LAST_PROP] = { NULL, };
@@ -852,10 +841,6 @@ eos_flexy_grid_finalize (GObject *gobject)
static void
eos_flexy_grid_class_init (EosFlexyGridClass *klass)
{
-#if !GLIB_CHECK_VERSION (2, 37, 5)
- g_type_class_add_private (klass, sizeof (EosFlexyGridPrivate));
-#endif
-
GObjectClass *gobject_class = G_OBJECT_CLASS (klass);
gobject_class->finalize = eos_flexy_grid_finalize;
gobject_class->set_property = eos_flexy_grid_set_property;
diff --git a/endless/eosflexygridcell.c b/endless/eosflexygridcell.c
index 4091f06..726c7f1 100644
--- a/endless/eosflexygridcell.c
+++ b/endless/eosflexygridcell.c
@@ -21,22 +21,11 @@ typedef struct {
guint selected : 1;
} EosFlexyGridCellPrivate;
-#if GLIB_CHECK_VERSION (2, 37, 5)
-
-# define EOS_FLEXY_GRID_CELL_GET_PRIV(obj) \
+#define EOS_FLEXY_GRID_CELL_GET_PRIV(obj) \
((EosFlexyGridCellPrivate *) eos_flexy_grid_cell_get_instance_private ((EosFlexyGridCell *) (obj)))
G_DEFINE_TYPE_WITH_PRIVATE (EosFlexyGridCell, eos_flexy_grid_cell, GTK_TYPE_BIN)
-#else
-
-# define EOS_FLEXY_GRID_CELL_GET_PRIV(obj) \
- (G_TYPE_INSTANCE_GET_PRIVATE ((obj), EOS_TYPE_FLEXY_GRID_CELL, EosFlexyGridCellPrivate))
-
-G_DEFINE_TYPE (EosFlexyGridCell, eos_flexy_grid_cell, GTK_TYPE_BIN)
-
-#endif /* GLIB_CHECK_VERSION (2, 37, 5) */
-
enum
{
PROP_0,
@@ -90,10 +79,6 @@ eos_flexy_grid_cell_get_property (GObject *gobject,
static void
eos_flexy_grid_cell_class_init (EosFlexyGridCellClass *klass)
{
-#if !GLIB_CHECK_VERSION (2, 37, 6)
- g_type_class_add_private (klass, sizeof (EosFlexyGridCellPrivate));
-#endif
-
GObjectClass *gobject_class = G_OBJECT_CLASS (klass);
gobject_class->set_property = eos_flexy_grid_cell_set_property;
gobject_class->get_property = eos_flexy_grid_cell_get_property;
diff --git a/endless/eospagemanager-private.h b/endless/eospagemanager-private.h
index 5a01637..c39a118 100644
--- a/endless/eospagemanager-private.h
+++ b/endless/eospagemanager-private.h
@@ -8,11 +8,10 @@
#include "eospagemanager.h"
#include <gtk/gtk.h>
-#include <pstack.h>
G_BEGIN_DECLS
-PStackTransitionType eos_page_manager_get_pstack_transition_type (EosPageManager *self);
+GtkStackTransitionType eos_page_manager_get_gtk_stack_transition_type (EosPageManager *self);
G_END_DECLS
diff --git a/endless/eospagemanager.c b/endless/eospagemanager.c
index 9a6d0b1..d8b7ea5 100644
--- a/endless/eospagemanager.c
+++ b/endless/eospagemanager.c
@@ -5,7 +5,6 @@
#include "eospagemanager-private.h"
#include <gtk/gtk.h>
-#include <pstack.h>
#include <string.h>
@@ -262,9 +261,8 @@ static void
set_visible_page_from_info (EosPageManager *self,
EosPageManagerPageInfo *info)
{
- /* FIXME when porting to GtkStack */
- PStack *stack = P_STACK (self->priv->stack);
- p_stack_set_visible_child (stack, info->page);
+ GtkStack *stack = GTK_STACK (self->priv->stack);
+ gtk_stack_set_visible_child (stack, info->page);
self->priv->visible_page_info = info;
@@ -906,7 +904,7 @@ eos_page_manager_init (EosPageManager *self)
gtk_widget_set_has_window (self_widget, FALSE);
/* TODO replace with GtkStack */
- self->priv->stack = p_stack_new ();
+ self->priv->stack = gtk_stack_new ();
gtk_widget_set_parent (self->priv->stack, self_widget);
}
@@ -1603,7 +1601,7 @@ eos_page_manager_get_transition_duration (EosPageManager *self)
{
g_return_val_if_fail (EOS_IS_PAGE_MANAGER (self), 0);
- return p_stack_get_transition_duration (P_STACK (self->priv->stack));
+ return gtk_stack_get_transition_duration (GTK_STACK (self->priv->stack));
}
/**
@@ -1620,7 +1618,7 @@ eos_page_manager_set_transition_duration (EosPageManager *self,
{
g_return_if_fail (EOS_IS_PAGE_MANAGER (self));
- p_stack_set_transition_duration (P_STACK (self->priv->stack), duration);
+ gtk_stack_set_transition_duration (GTK_STACK (self->priv->stack), duration);
g_object_notify (G_OBJECT (self), "transition-duration");
}
@@ -1657,7 +1655,7 @@ eos_page_manager_set_transition_type (EosPageManager *self,
g_return_if_fail (EOS_IS_PAGE_MANAGER (self));
self->priv->transition_type = transition_type;
- PStackTransitionType pstack_transition;
+ GtkStackTransitionType gtk_stack_transition;
switch (transition_type)
{
case EOS_PAGE_MANAGER_TRANSITION_TYPE_NONE:
@@ -1666,25 +1664,25 @@ eos_page_manager_set_transition_type (EosPageManager *self,
case EOS_PAGE_MANAGER_TRANSITION_TYPE_SLIDE_LEFT:
case EOS_PAGE_MANAGER_TRANSITION_TYPE_SLIDE_UP:
case EOS_PAGE_MANAGER_TRANSITION_TYPE_SLIDE_DOWN:
- pstack_transition = (PStackTransitionType)self->priv->transition_type;
+ gtk_stack_transition = (GtkStackTransitionType)self->priv->transition_type;
break;
default:
- pstack_transition = P_STACK_TRANSITION_TYPE_NONE;
+ gtk_stack_transition = GTK_STACK_TRANSITION_TYPE_NONE;
break;
}
- p_stack_set_transition_type (P_STACK (self->priv->stack),
- pstack_transition);
+ gtk_stack_set_transition_type (GTK_STACK (self->priv->stack),
+ gtk_stack_transition);
g_object_notify (G_OBJECT (self), "transition-type");
}
/*
- * eos_page_manager_get_pstack_transition_type:
+ * eos_page_manager_get_gtk_stack_transition_type:
* @self: the page manager
*
- * Gets the internal pstack transition type used to animate the page manager.
+ * Gets the internal gtk_stack transition type used to animate the page manager.
*/
-PStackTransitionType
-eos_page_manager_get_pstack_transition_type (EosPageManager *self)
+GtkStackTransitionType
+eos_page_manager_get_gtk_stack_transition_type (EosPageManager *self)
{
- return p_stack_get_transition_type (P_STACK (self->priv->stack));
+ return gtk_stack_get_transition_type (GTK_STACK (self->priv->stack));
}
diff --git a/endless/eoswindow.c b/endless/eoswindow.c
index 35547bb..d026e6b 100644
--- a/endless/eoswindow.c
+++ b/endless/eoswindow.c
@@ -11,7 +11,6 @@
#include "eosmainarea-private.h"
#include <gtk/gtk.h>
-#include <pstack.h>
/**
* SECTION:window
@@ -67,6 +66,7 @@ struct _EosWindowPrivate
GtkWidget *top_bar;
GtkWidget *main_area;
GtkWidget *overlay;
+ GtkSizeGroup *overlay_size_group;
GtkWidget *edge_finishing;
GtkWidget *current_background;
GtkWidget *next_background;
@@ -213,10 +213,10 @@ static void
sync_stack_animation (EosWindow *self)
{
EosPageManager *pm = EOS_PAGE_MANAGER (self->priv->page_manager);
- p_stack_set_transition_type (P_STACK (self->priv->background_stack),
- eos_page_manager_get_pstack_transition_type (pm));
- p_stack_set_transition_duration (P_STACK (self->priv->background_stack),
- eos_page_manager_get_transition_duration (pm));
+ gtk_stack_set_transition_type (GTK_STACK (self->priv->background_stack),
+ eos_page_manager_get_gtk_stack_transition_type (pm));
+ gtk_stack_set_transition_duration (GTK_STACK (self->priv->background_stack),
+ eos_page_manager_get_transition_duration (pm));
}
// Helper to generate frame css override
@@ -269,8 +269,8 @@ update_page_background (EosWindow *self)
gtk_widget_get_name (self->priv->next_background),
next_background_css_props);
override_background_css (self, background_css);
- p_stack_set_visible_child (P_STACK (self->priv->background_stack),
- self->priv->next_background);
+ gtk_stack_set_visible_child (GTK_STACK (self->priv->background_stack),
+ self->priv->next_background);
// Swap our background frames for next animation
GtkWidget *temp = self->priv->next_background;
self->priv->next_background = self->priv->current_background;
@@ -334,8 +334,8 @@ update_page (EosWindow *self)
update_page_left_topbar (self);
update_page_center_topbar (self);
update_page_background (self);
- p_stack_set_transition_type (P_STACK (self->priv->background_stack),
- P_STACK_TRANSITION_TYPE_NONE);
+ gtk_stack_set_transition_type (GTK_STACK (self->priv->background_stack),
+ GTK_STACK_TRANSITION_TYPE_NONE);
if (self->priv->current_page)
{
@@ -571,36 +571,6 @@ eos_window_class_init (EosWindowClass *klass)
g_object_class_install_properties (object_class, NPROPS, eos_window_props);
}
-#if GTK_CHECK_VERSION (3, 10, 0)
-#define our_window_close(w) gtk_window_close (w)
-#else
-static gboolean
-queue_close (gpointer user_data)
-{
- GtkWidget *window = user_data;
-
- GdkEvent *event = gdk_event_new (GDK_DELETE);
-
- event->any.window = gtk_widget_get_window (window);
- event->any.send_event = TRUE;
-
- gtk_main_do_event (event);
-
- gdk_event_free (event);
-
- return G_SOURCE_REMOVE;
-}
-
-static void
-our_window_close (GtkWindow *window)
-{
- if (!gtk_widget_get_realized (GTK_WIDGET (window)))
- return;
-
- gdk_threads_add_idle (queue_close, window);
-}
-#endif /* GTK_CHECK_VERSION (3, 10, 0) */
-
static void
on_minimize_clicked_cb (GtkWidget* top_bar)
{
@@ -614,7 +584,7 @@ on_close_clicked_cb (GtkWidget* top_bar)
{
GtkWidget *window = gtk_widget_get_toplevel (top_bar);
- our_window_close (GTK_WINDOW (window));
+ gtk_window_close (GTK_WINDOW (window));
}
/* Make sure that the edge finishing does not catch input events */
@@ -661,7 +631,7 @@ eos_window_init (EosWindow *self)
self->priv->overlay = gtk_overlay_new ();
gtk_container_add (GTK_CONTAINER (self), self->priv->overlay);
- self->priv->background_stack = p_stack_new ();
+ self->priv->background_stack = gtk_stack_new ();
gtk_container_add (GTK_CONTAINER (self->priv->overlay), self->priv->background_stack);
gchar *background_name1 = g_strdup_printf (BACKGROUND_FRAME_NAME_TEMPLATE, 1);
@@ -687,6 +657,13 @@ eos_window_init (EosWindow *self)
self->priv->main_area = eos_main_area_new ();
gtk_overlay_add_overlay (GTK_OVERLAY (self->priv->overlay), self->priv->main_area);
+ // We want the overlay to size to the main area, the widget on top. The
+ // overlay gets its size request from the widget on the bottom, the
+ // background frame with no minimum size. So we use a size group.
+ self->priv->overlay_size_group = gtk_size_group_new (GTK_SIZE_GROUP_BOTH);
+ gtk_size_group_add_widget (self->priv->overlay_size_group, self->priv->background_stack);
+ gtk_size_group_add_widget (self->priv->overlay_size_group, self->priv->main_area);
+
self->priv->edge_finishing = gtk_drawing_area_new ();
gtk_widget_set_vexpand (self->priv->edge_finishing, FALSE);
gtk_widget_set_valign (self->priv->edge_finishing, GTK_ALIGN_START);
diff --git a/test/smoke-tests/frame-rate-tests/gtk.js b/test/smoke-tests/frame-rate-tests/gtk.js
index 8af1376..9ebc14c 100644
--- a/test/smoke-tests/frame-rate-tests/gtk.js
+++ b/test/smoke-tests/frame-rate-tests/gtk.js
@@ -2,17 +2,16 @@
const Lang = imports.lang;
const Gtk = imports.gi.Gtk;
-const PLib = imports.gi.PLib;
const GObject = imports.gi.GObject;
const Endless = imports.gi.Endless;
const TEST_APPLICATION_ID = "com.frametest";
-let TRANSITION1 = PLib.StackTransitionType.SLIDE_LEFT;
-let TRANSITION2 = PLib.StackTransitionType.SLIDE_RIGHT;
+let TRANSITION1 = Gtk.StackTransitionType.SLIDE_LEFT;
+let TRANSITION2 = Gtk.StackTransitionType.SLIDE_RIGHT;
if (ARGV[0] === "crossfade") {
- TRANSITION1 = PLib.StackTransitionType.CROSSFADE;
- TRANSITION2 = PLib.StackTransitionType.CROSSFADE;
+ TRANSITION1 = Gtk.StackTransitionType.CROSSFADE;
+ TRANSITION2 = Gtk.StackTransitionType.CROSSFADE;
}
let BACKGROUND1_NAME = "page1_1080";
@@ -49,7 +48,7 @@ const TestApplication = new Lang.Class ({
this._stack.set_visible_child(this._page1);
}));
- this._stack = new PLib.Stack();
+ this._stack = new Gtk.Stack();
this._stack.add(this._page1);
this._stack.add(this._page2);
diff --git a/wikipedia/EndlessWikipedia.js b/wikipedia/EndlessWikipedia.js
index 2767e61..cba5c3e 100644
--- a/wikipedia/EndlessWikipedia.js
+++ b/wikipedia/EndlessWikipedia.js
@@ -13,6 +13,7 @@ const STYLE_CLASS_TITLE = 'title';
const STYLE_CLASS_MAIN = 'main-element';
const STYLE_CLASS_PREBUILT = 'prebuilt';
const STYLE_CLASS_CATEGORY = 'category';
+const STYLE_CLASS_CATEGORY_CLICKABLE = 'clickable';
const STYLE_CLASS_ARTICLE = 'article';
const STYLE_CLASS_FRONT_PAGE = 'front-page';
const STYLE_CLASS_CATEGORY_PAGE = 'category-page';
diff --git a/wikipedia/widgets/category_button.js b/wikipedia/widgets/category_button.js
index 667a816..e6cfdde 100644
--- a/wikipedia/widgets/category_button.js
+++ b/wikipedia/widgets/category_button.js
@@ -15,13 +15,13 @@ const CATEGORY_BUTTON_BOTTOM_MARGIN = 20; // pixels
const CATEGORY_LABEL_BASELINE_CORRECTION = 0; // pixels
const CATEGORY_BUTTON_BASELINE_CORRECTION = 10; // pixels
const _HOVER_ARROW_URI = '/com/endlessm/wikipedia-domain/assets/category_hover_arrow.png';
-const MAIN_CATEGORY_SCREEN_WIDTH_PERCENTAGE = 0.37;
+const CATEGORY_MIN_WIDTH = 120; // pixels
GObject.ParamFlags.READWRITE = GObject.ParamFlags.READABLE | GObject.ParamFlags.WRITABLE;
const CategoryButton = new Lang.Class({
Name: 'CategoryButton',
- Extends: Gtk.EventBox,
+ Extends: Gtk.Button,
Properties: {
// resource URI for the category's accompanying image
'image-uri': GObject.ParamSpec.string('image-uri',
@@ -51,9 +51,6 @@ const CategoryButton = new Lang.Class({
GObject.ParamFlags.READWRITE | GObject.ParamFlags.CONSTRUCT_ONLY,
false)
},
- Signals: {
- 'clicked': {}
- },
_init: function(props) {
// Get ready for property construction
@@ -63,19 +60,14 @@ const CategoryButton = new Lang.Class({
this._is_main_category = null;
this._pixbuf = null;
- this._eventbox = new Gtk.EventBox({
+ this._overlay = new Gtk.Overlay({
expand: true
});
- this._eventbox_grid = new Gtk.Grid({
- orientation: Gtk.Orientation.HORIZONTAL,
- hexpand: true,
- valign: Gtk.Align.END
- });
this._label = new Gtk.Label({
margin_left: CATEGORY_LABEL_LEFT_MARGIN,
margin_bottom: CATEGORY_LABEL_BOTTOM_MARGIN - CATEGORY_LABEL_BASELINE_CORRECTION,
- hexpand: true,
halign: Gtk.Align.START,
+ valign: Gtk.Align.END,
xalign: 0.0, // deprecated Gtk.Misc properties; necessary because
wrap: true, // "wrap" doesn't respect "halign"
width_chars: 18,
@@ -86,8 +78,12 @@ const CategoryButton = new Lang.Class({
margin_right: CATEGORY_BUTTON_RIGHT_MARGIN,
margin_bottom: CATEGORY_BUTTON_BOTTOM_MARGIN + CATEGORY_BUTTON_BASELINE_CORRECTION,
halign: Gtk.Align.END,
- valign: Gtk.Align.END,
- opacity: 0
+ valign: Gtk.Align.END
+ });
+ // Make the arrow image transparent to mouse events
+ this._arrow.connect_after('realize', function (frame) {
+ let gdk_window = frame.get_window();
+ gdk_window.set_child_input_shapes();
});
let context = this._label.get_style_context();
@@ -99,15 +95,21 @@ const CategoryButton = new Lang.Class({
this.parent(props);
// Put widgets together
- this._eventbox_grid.add(this._label);
- this._eventbox_grid.add(this._arrow);
- this._eventbox.add(this._eventbox_grid);
- this.add(this._eventbox);
+ let alignment = new Gtk.Alignment({ expand: true });
+ alignment.add(this._label);
+ this._overlay.add(alignment);
+ this._overlay.add_overlay(this._arrow);
+ this.add(this._overlay);
this.show_all();
-
- // Connect signals
- this.connect('button-press-event',
- Lang.bind(this, this._onButtonPress));
+ this._arrow.hide();
+
+ this.connect("enter", Lang.bind(this, function (w) {
+ if(this._clickable_category)
+ this._arrow.show();
+ }));
+ this.connect("leave", Lang.bind(this, function (w) {
+ this._arrow.hide();
+ }));
},
get image_uri() {
@@ -135,19 +137,9 @@ const CategoryButton = new Lang.Class({
set clickable_category(value) {
this._clickable_category = value;
if(this._clickable_category) {
- //Hover events/effects only trigger if the button is clickable.
- this._eventbox.add_events(Gdk.EventMask.ENTER_NOTIFY_MASK |
- Gdk.EventMask.LEAVE_NOTIFY_MASK);
- this._eventbox.connect('enter-notify-event',
- Lang.bind(this, function(widget, event) {
- this._eventbox.set_state_flags(Gtk.StateFlags.PRELIGHT, false);
- this._arrow.opacity = 1.0;
- }));
- this._eventbox.connect('leave-notify-event',
- Lang.bind(this, function(widget, event) {
- this._eventbox.unset_state_flags(Gtk.StateFlags.PRELIGHT);
- this._arrow.opacity = 0.0;
- }));
+ this.get_style_context().add_class(EndlessWikipedia.STYLE_CLASS_CATEGORY_CLICKABLE);
+ } else {
+ this.get_style_context().remove_class(EndlessWikipedia.STYLE_CLASS_CATEGORY_CLICKABLE);
}
},
@@ -168,16 +160,18 @@ const CategoryButton = new Lang.Class({
// OVERRIDES
- vfunc_get_preferred_width: function() {
- if(this._is_main_category) {
- let toplevel = this.get_toplevel();
- if(toplevel == null)
- return this.parent();
- let width = toplevel.get_allocated_width() * MAIN_CATEGORY_SCREEN_WIDTH_PERCENTAGE;
- return [width, width];
- } else {
- return this.parent();
- }
+ // 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
@@ -203,11 +197,5 @@ const CategoryButton = new Lang.Class({
// a better fix in the future, i.e. fix this through gjs.
cr.$dispose();
return ret;
- },
-
- // HANDLERS
-
- _onButtonPress: function(widget, event) {
- this.emit('clicked')
}
});
diff --git a/wikipedia/widgets/category_layout_manager.js b/wikipedia/widgets/category_layout_manager.js
index d49661c..cb2f94a 100644
--- a/wikipedia/widgets/category_layout_manager.js
+++ b/wikipedia/widgets/category_layout_manager.js
@@ -1,6 +1,9 @@
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,
@@ -8,8 +11,7 @@ const CategoryLayoutManager = new Lang.Class({
_init: function(props) {
props = props || {};
props.row_homogeneous = true;
- //we don't make the columns homogenous because the 0th column
- //needs to be 37% of the screen, according to designs.
+ props.column_homogeneous = true;
this.parent(props);
this._childWidgets = [];
@@ -17,15 +19,16 @@ const CategoryLayoutManager = new Lang.Class({
},
// Distribute children in two columns, except for the last one if an odd
- // number; that should span two columns
+ // 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) + 1; //plus 1 because the mainWidget is the 0 column.
+ let column = (index % 2) * SUB_CATEGORY_SCREEN_WIDTH_PERCENTAGE + MAIN_CATEGORY_SCREEN_WIDTH_PERCENTAGE;
let row = Math.floor(index / 2);
if(numRows < row + 1)
@@ -33,20 +36,19 @@ const CategoryLayoutManager = new Lang.Class({
//need when we add the main widget.
if(child.get_parent() === this)
- Gtk.Container.prototype.remove.call(this,
- this._childWidgets[index]);
+ Gtk.Container.prototype.remove.call(this, this._childWidgets[index]);
if(oddNumber && index == numChildren - 1)
- this.attach(child, 1, row, 2, 1);
+ this.attach(child, column, row, SUB_CATEGORY_SCREEN_WIDTH_PERCENTAGE * 2, 1);
else
- this.attach(child, column, row, 1, 1);
+ 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, 1, numRows);
+ this.attach(this._mainWidget, 0, 0, MAIN_CATEGORY_SCREEN_WIDTH_PERCENTAGE, numRows);
}
},
diff --git a/wikipedia/widgets/category_selector_view.js b/wikipedia/widgets/category_selector_view.js
index 674e563..72eff07 100644
--- a/wikipedia/widgets/category_selector_view.js
+++ b/wikipedia/widgets/category_selector_view.js
@@ -39,7 +39,6 @@ const CategorySelectorView = new Lang.Class({
image_uri: category.image_thumbnail_uri,
clickable_category: category.has_articles,
is_main_category: category.is_main_category,
- hexpand: !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.