[gnome-maps/wip/mattiasb/templates: 4/10] Sidebar: Use Templates
- From: Mattias Bengtsson <mattiasb src gnome org>
- To: commits-list gnome org
- Cc:
- Subject: [gnome-maps/wip/mattiasb/templates: 4/10] Sidebar: Use Templates
- Date: Tue, 24 Mar 2015 19:50:42 +0000 (UTC)
commit c5d71c908e8a64140e2605a7c69d18bda182880d
Author: Mattias Bengtsson <mattias jc bengtsson gmail com>
Date: Thu Mar 12 23:12:18 2015 +0100
Sidebar: Use Templates
https://bugzilla.gnome.org/show_bug.cgi?id=740647
data/ui/sidebar.ui | 274 +++++++++++++++++++++++++++-------------------------
src/sidebar.js | 46 +++------
2 files changed, 158 insertions(+), 162 deletions(-)
---
diff --git a/data/ui/sidebar.ui b/data/ui/sidebar.ui
index 3103a50..490f3df 100644
--- a/data/ui/sidebar.ui
+++ b/data/ui/sidebar.ui
@@ -2,185 +2,197 @@
<!-- Generated with glade 3.18.3 -->
<interface>
<requires lib="gtk+" version="3.10"/>
- <object class="GtkGrid" id="sidebar">
- <property name="name">sidebar</property>
+ <template class="Gjs_Sidebar" parent="GtkRevealer">
<property name="visible">True</property>
- <property name="can_focus">False</property>
- <property name="vexpand">True</property>
+ <property name="transition_type">slide-left</property>
+ <property name="transition_duration">400</property>
+ <property name="halign">end</property>
<property name="valign">fill</property>
- <property name="column_homogeneous">True</property>
- <property name="orientation">vertical</property>
- <property name="width_request">320</property>
- <property name="row_spacing">2</property>
+ <style>
+ <class name="maps-sidebar"/>
+ </style>
<child>
- <object class="GtkBox" id="mode-chooser">
+ <object class="GtkGrid" id="sidebar">
+ <property name="name">sidebar</property>
<property name="visible">True</property>
<property name="can_focus">False</property>
- <property name="halign">center</property>
- <property name="margin-top">10</property>
+ <property name="vexpand">True</property>
+ <property name="valign">fill</property>
+ <property name="column_homogeneous">True</property>
+ <property name="orientation">vertical</property>
+ <property name="width_request">320</property>
+ <property name="row_spacing">2</property>
<child>
- <object class="GtkRadioButton" id="mode-pedestrian-toggle">
- <property name="name">mode-pedestrian-toggle</property>
+ <object class="GtkBox" id="mode-chooser">
<property name="visible">True</property>
- <property name="can_focus">True</property>
- <property name="receives_default">True</property>
- <property name="draw_indicator">False</property>
- <property name="height-request">32</property>
- <property name="width-request">42</property>
+ <property name="can_focus">False</property>
+ <property name="halign">center</property>
+ <property name="margin-top">10</property>
<child>
- <object class="GtkImage" id="mode-pedestrian-image">
+ <object class="GtkRadioButton" id="modePedestrianToggle">
+ <property name="name">mode-pedestrian-toggle</property>
<property name="visible">True</property>
- <property name="can_focus">False</property>
- <property name="icon-name">route-pedestrian-symbolic</property>
+ <property name="can_focus">True</property>
+ <property name="receives_default">True</property>
+ <property name="draw_indicator">False</property>
+ <property name="height-request">32</property>
+ <property name="width-request">42</property>
+ <child>
+ <object class="GtkImage" id="mode-pedestrian-image">
+ <property name="visible">True</property>
+ <property name="can_focus">False</property>
+ <property name="icon-name">route-pedestrian-symbolic</property>
+ </object>
+ </child>
+ <style>
+ <class name="transportation-mode-button"/>
+ </style>
</object>
</child>
- <style>
- <class name="transportation-mode-button"/>
- </style>
- </object>
- </child>
- <child>
- <object class="GtkRadioButton" id="mode-bike-toggle">
- <property name="name">mode-bike-toggle</property>
- <property name="visible">True</property>
- <property name="can_focus">True</property>
- <property name="receives_default">True</property>
- <property name="draw_indicator">False</property>
- <property name="group">mode-pedestrian-toggle</property>
- <property name="height-request">32</property>
- <property name="width-request">42</property>
<child>
- <object class="GtkImage" id="mode-bike-image">
- <property name="visible">True</property>
- <property name="can_focus">False</property>
- <property name="icon-name">route-bike-symbolic</property>
+ <object class="GtkRadioButton" id="modeBikeToggle">
+ <property name="name">mode-bike-toggle</property>
+ <property name="visible">True</property>
+ <property name="can_focus">True</property>
+ <property name="receives_default">True</property>
+ <property name="draw_indicator">False</property>
+ <property name="group">modePedestrianToggle</property>
+ <property name="height-request">32</property>
+ <property name="width-request">42</property>
+ <child>
+ <object class="GtkImage" id="mode-bike-image">
+ <property name="visible">True</property>
+ <property name="can_focus">False</property>
+ <property name="icon-name">route-bike-symbolic</property>
+ </object>
+ </child>
+ <style>
+ <class name="transportation-mode-button"/>
+ </style>
</object>
</child>
- <style>
- <class name="transportation-mode-button"/>
- </style>
- </object>
- </child>
- <child>
- <object class="GtkRadioButton" id="mode-car-toggle">
- <property name="name">mode-car-toggle</property>
- <property name="visible">True</property>
- <property name="can_focus">True</property>
- <property name="receives_default">True</property>
- <property name="active">True</property>
- <property name="draw_indicator">False</property>
- <property name="group">mode-bike-toggle</property>
- <property name="height-request">32</property>
- <property name="width-request">42</property>
<child>
- <object class="GtkImage" id="mode-car-image">
+ <object class="GtkRadioButton" id="modeCarToggle">
+ <property name="name">mode-car-toggle</property>
<property name="visible">True</property>
- <property name="can_focus">False</property>
- <property name="icon-name">route-car-symbolic</property>
+ <property name="can_focus">True</property>
+ <property name="receives_default">True</property>
+ <property name="active">True</property>
+ <property name="draw_indicator">False</property>
+ <property name="group">modeBikeToggle</property>
+ <property name="height-request">32</property>
+ <property name="width-request">42</property>
+ <child>
+ <object class="GtkImage" id="mode-car-image">
+ <property name="visible">True</property>
+ <property name="can_focus">False</property>
+ <property name="icon-name">route-car-symbolic</property>
+ </object>
+ </child>
+ <style>
+ <class name="transportation-mode-button"/>
+ </style>
</object>
</child>
<style>
- <class name="transportation-mode-button"/>
+ <class name="linked"/>
</style>
</object>
</child>
- <style>
- <class name="linked"/>
- </style>
- </object>
- </child>
- <child>
- <object class="GtkListBox" id="entry-list">
- <property name="name">sidebar-entry-list</property>
- <property name="visible">True</property>
- <property name="can_focus">False</property>
- <property name="selection-mode">GTK_SELECTION_NONE</property>
- </object>
- </child>
- <child>
- <object class="GtkGrid" id="sidebar-route-info-wrapper">
- <property name="visible">True</property>
- <property name="hexpand">False</property>
<child>
- <object class="GtkGrid" id="sidebar-route-info">
- <property name="name">sidebar-route-info</property>
+ <object class="GtkListBox" id="entryList">
+ <property name="name">sidebar-entry-list</property>
<property name="visible">True</property>
<property name="can_focus">False</property>
- <property name="margin_start">17</property>
- <property name="margin_end">17</property>
- <property name="margin_top">12</property>
- <property name="hexpand">true</property>
+ <property name="selection-mode">GTK_SELECTION_NONE</property>
+ </object>
+ </child>
+ <child>
+ <object class="GtkGrid" id="sidebar-route-info-wrapper">
+ <property name="visible">True</property>
+ <property name="hexpand">False</property>
<child>
- <object class="GtkLabel" id="time-info">
+ <object class="GtkGrid" id="sidebar-route-info">
+ <property name="name">sidebar-route-info</property>
<property name="visible">True</property>
<property name="can_focus">False</property>
- <property name="halign">start</property>
+ <property name="margin_start">17</property>
+ <property name="margin_end">17</property>
+ <property name="margin_top">12</property>
<property name="hexpand">true</property>
- </object>
- </child>
- <child>
- <object class="GtkLabel" id="distance-info">
- <property name="visible">True</property>
- <property name="can_focus">False</property>
- <property name="margin_start">10</property>
+ <child>
+ <object class="GtkLabel" id="timeInfo">
+ <property name="visible">True</property>
+ <property name="can_focus">False</property>
+ <property name="halign">start</property>
+ <property name="hexpand">true</property>
+ </object>
+ </child>
+ <child>
+ <object class="GtkLabel" id="distanceInfo">
+ <property name="visible">True</property>
+ <property name="can_focus">False</property>
+ <property name="margin_start">10</property>
+ </object>
+ </child>
</object>
</child>
</object>
</child>
- </object>
- </child>
- <child>
- <object class="GtkFrame" id="instruction-frame">
- <property name="can_focus">False</property>
- <property name="margin_top">10</property>
- <property name="shadow_type">in</property>
<child>
- <object class="GtkStack" id="instruction-stack">
- <property name="visible">True</property>
+ <object class="GtkFrame" id="instruction-frame">
<property name="can_focus">False</property>
+ <property name="margin_top">10</property>
+ <property name="shadow_type">in</property>
<child>
- <object class="GtkScrolledWindow" id="instruction-list-scrolled">
- <property name="name">instruction-list-scrolled</property>
+ <object class="GtkStack" id="instructionStack">
<property name="visible">True</property>
<property name="can_focus">False</property>
- <property name="valign">fill</property>
- <property name="vexpand">True</property>
- <property name="margin">1</property>
- <property name="hscrollbar_policy">never</property>
<child>
- <object class="GtkListBox" id="instruction-list">
- <property name="name">instruction-list</property>
+ <object class="GtkScrolledWindow" id="instructionWindow">
+ <property name="name">instruction-window</property>
<property name="visible">True</property>
<property name="can_focus">False</property>
<property name="valign">fill</property>
+ <property name="vexpand">True</property>
+ <property name="margin">1</property>
+ <property name="hscrollbar_policy">never</property>
+ <child>
+ <object class="GtkListBox" id="instructionList">
+ <property name="name">instruction-list</property>
+ <property name="visible">True</property>
+ <property name="can_focus">False</property>
+ <property name="valign">fill</property>
+ </object>
+ </child>
+ </object>
+ </child>
+ <child>
+ <object class="GtkSpinner" id="instructionSpinner">
+ <property name="visible">True</property>
+ <property name="can_focus">False</property>
+ <property name="active">True</property>
</object>
</child>
- </object>
- </child>
- <child>
- <object class="GtkSpinner" id="instruction-spinner">
- <property name="visible">True</property>
- <property name="can_focus">False</property>
- <property name="active">True</property>
</object>
</child>
</object>
</child>
+ <child>
+ <object class="GtkLinkButton" id="linkbutton1">
+ <property name="label" translatable="yes">Route search by GraphHopper</property>
+ <property name="visible">True</property>
+ <property name="can_focus">True</property>
+ <property name="receives_default">True</property>
+ <property name="use_action_appearance">False</property>
+ <property name="relief">none</property>
+ <property name="uri">https://graphhopper.com</property>
+ <style>
+ <class name="small-label"/>
+ </style>
+ </object>
+ </child>
</object>
</child>
- <child>
- <object class="GtkLinkButton" id="linkbutton1">
- <property name="label" translatable="yes">Route search by GraphHopper</property>
- <property name="visible">True</property>
- <property name="can_focus">True</property>
- <property name="receives_default">True</property>
- <property name="use_action_appearance">False</property>
- <property name="relief">none</property>
- <property name="uri">https://graphhopper.com</property>
- <style>
- <class name="small-label"/>
- </style>
- </object>
- </child>
- </object>
+ </template>
</interface>
diff --git a/src/sidebar.js b/src/sidebar.js
index 3f8a285..81d9127 100644
--- a/src/sidebar.js
+++ b/src/sidebar.js
@@ -57,50 +57,34 @@ const InstructionRow = new Lang.Class({
const Sidebar = new Lang.Class({
Name: 'Sidebar',
Extends: Gtk.Revealer,
+ Template: 'resource:///org/gnome/Maps/ui/sidebar.ui',
+ InternalChildren: [ 'distanceInfo',
+ 'entryList',
+ 'instructionList',
+ 'instructionWindow',
+ 'instructionSpinner',
+ 'instructionStack',
+ 'modeBikeToggle',
+ 'modeCarToggle',
+ 'modePedestrianToggle',
+ 'timeInfo' ],
_init: function(mapView) {
- this.parent({ visible: true,
- transition_type: Gtk.RevealerTransitionType.SLIDE_LEFT,
- transition_duration: 400, // ms
- halign: Gtk.Align.END,
- valign: Gtk.Align.FILL
- });
- this.get_style_context().add_class('maps-sidebar');
-
- let ui = Utils.getUIObject('sidebar', [ 'sidebar',
- 'entry-list',
- 'instruction-list-scrolled',
- 'instruction-stack',
- 'instruction-spinner',
- 'instruction-list',
- 'mode-pedestrian-toggle',
- 'mode-bike-toggle',
- 'mode-car-toggle',
- 'time-info',
- 'distance-info' ]);
+ this.parent({ transition_type: Gtk.RevealerTransitionType.SLIDE_LEFT });
this._mapView = mapView;
- this._entryList = ui.entryList;
- this._instructionList = ui.instructionList;
- this._instructionStack = ui.instructionStack;
- this._instructionWindow = ui.instructionListScrolled;
- this._instructionSpinner = ui.instructionSpinner;
- this._timeInfo = ui.timeInfo;
- this._distanceInfo = ui.distanceInfo;
this._initInstructionList();
- this._initTransportationToggles(ui.modePedestrianToggle,
- ui.modeBikeToggle,
- ui.modeCarToggle);
+ this._initTransportationToggles(this._modePedestrianToggle,
+ this._modeBikeToggle,
+ this._modeCarToggle);
this._initQuerySignals();
let query = Application.routeService.query;
query.addPoint(0);
query.addPoint(1);
-
- this.add(ui.sidebar);
},
_initTransportationToggles: function(pedestrian, bike, car) {
[
Date Prev][
Date Next] [
Thread Prev][
Thread Next]
[
Thread Index]
[
Date Index]
[
Author Index]