[gnome-maps/wip/jonasdn/storedRoute: 11/13] Add favorite button to sidebar

[Jonas Danielsson <jonasdn src gnome org>]

commit c9c2c97f1f2ea86b1e80330bbb6b3886500f26b4
Author: Jonas Danielsson <jonas threetimestwo org>
Date:   Thu Feb 12 20:41:47 2015 +0100

    Add favorite button to sidebar
    
    https://bugzilla.gnome.org/show_bug.cgi?id=744425

 data/ui/sidebar.ui |  123 +++++++++++++++++++++++++++++++---------------------
 src/sidebar.js     |   84 +++++++++++++++++++++++++++++++----
 2 files changed, 149 insertions(+), 58 deletions(-)
---
diff --git a/data/ui/sidebar.ui b/data/ui/sidebar.ui
index 15fc36b..9401900 100644
--- a/data/ui/sidebar.ui
+++ b/data/ui/sidebar.ui
@@ -13,80 +13,106 @@
     <property name="width_request">320</property>
     <property name="row_spacing">2</property>
     <child>
-      <object class="GtkBox" id="mode-chooser">
+      <object class="GtkBox" id="top-box">
         <property name="visible">True</property>
         <property name="can_focus">False</property>
         <property name="halign">center</property>
         <property name="margin-top">10</property>
         <child>
-          <object class="GtkRadioButton" id="mode-pedestrian-toggle">
-            <property name="name">mode-pedestrian-toggle</property>
-            <property name="visible">True</property>
+          <object class="GtkToggleButton" id="route-favorite-button">
+            <property name="name">bubble-favorite-button</property>
+            <property name="visible">False</property>
+            <property name="sensitive">False</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="receives_default">False</property>
+            <property name="margin-end">5</property>
+            <property name="tooltip-text" translatable="yes">Mark as favorite</property>
             <child>
-              <object class="GtkImage" id="mode-pedestrian-image">
+              <object class="GtkImage" id="route-favorite-button-image">
+                <property name="name">bubble-favorite-button-image</property>
                 <property name="visible">True</property>
                 <property name="can_focus">False</property>
-                <property name="icon-name">route-pedestrian-symbolic</property>
+                <property name="icon-name">emblem-favorite-symbolic</property>
+                <property name="pixel_size">16</property>
               </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>
+          <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="group">mode-pedestrian-toggle</property>
-            <property name="height-request">32</property>
-            <property name="width-request">42</property>
+            <property name="can_focus">False</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="mode-pedestrian-toggle">
+                <property name="name">mode-pedestrian-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="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-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="mode-bike-toggle">
+                <property name="name">mode-bike-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="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>
+                </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">
+                    <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>
@@ -169,7 +195,6 @@
       </object>
     </child>
   </object>
-
   <object class="GtkBox" id="instruction-box">
     <property name="name">instruction-box</property>
     <property name="height_request">48</property>
diff --git a/src/sidebar.js b/src/sidebar.js
index cd02dcd..437ef2d 100644
--- a/src/sidebar.js
+++ b/src/sidebar.js
@@ -1,4 +1,4 @@
-/* -*- Mode: JS2; indent-tabs-mode: nil; js2-basic-offset: 4 -*- */
+ /* -*- Mode: JS2; indent-tabs-mode: nil; js2-basic-offset: 4 -*- */
 /* vim: set et ts=4 sw=4: */
 /*
  * Copyright (c) 2011, 2012, 2013 Red Hat, Inc.
@@ -30,6 +30,8 @@ const Lang = imports.lang;
 const Application = imports.application;
 const RouteEntry = imports.routeEntry;
 const RouteQuery = imports.routeQuery;
+const PlaceStore = imports.placeStore;
+const StoredRoute = imports.storedRoute;
 const Utils = imports.utils;
 
 const InstructionRow = new Lang.Class({
@@ -80,7 +82,8 @@ const Sidebar = new Lang.Class({
                                                 'mode-bike-toggle',
                                                 'mode-car-toggle',
                                                 'time-info',
-                                                'distance-info' ]);
+                                                'distance-info',
+                                                'route-favorite-button']);
 
         this._mapView = mapView;
         this._entryList = ui.entryList;
@@ -90,9 +93,9 @@ const Sidebar = new Lang.Class({
         this._instructionSpinner = ui.instructionSpinner;
         this._timeInfo = ui.timeInfo;
         this._distanceInfo = ui.distanceInfo;
-
+        this._favoriteButton = ui.routeFavoriteButton;
         this._initInstructionList();
-
+        this._initFavoriteButton();
         this._initTransportationToggles(ui.modePedestrianToggle,
                                         ui.modeBikeToggle,
                                         ui.modeCarToggle);
@@ -106,6 +109,19 @@ const Sidebar = new Lang.Class({
         this.add(ui.sidebar);
     },
 
+    _initFavoriteButton: function() {
+        let placeStore = Application.placeStore;
+        this._favoriteButton.connect('toggled', (function() {
+            let stored = this._createStoredRoute();
+            if (this._favoriteButton.active)
+                placeStore.addPlace(stored,
+                                    PlaceStore.PlaceType.FAVORITE_ROUTE);
+            else
+                placeStore.removePlace(stored,
+                                       PlaceStore.PlaceType.FAVORITE_ROUTE);
+        }).bind(this));
+    },
+
     _initTransportationToggles: function(pedestrian, bike, car) {
         let query = Application.routeService.query;
         let transport = RouteQuery.Transportation;
@@ -136,9 +152,64 @@ const Sidebar = new Lang.Class({
         query.connect('notify::transportation', setToggles);
     },
 
+    _createStoredRoute: function() {
+        let route = Application.routeService.route;
+        let query = Application.routeService.query;
+        let places = query.filledPoints.map(function(point) {
+            return point.place;
+        });
+
+        return new StoredRoute.StoredRoute({ route: route,
+                                             places: places });
+    },
+
     _initRouteSignals: function() {
         let route = Application.routeService.route;
         let query = Application.routeService.query;
+        let placeStore = Application.placeStore;
+
+        route.connect('reset', (function() {
+            this._clearInstructions();
+            this._instructionStack.visible_child = this._instructionWindow;
+            this._favoriteButton.sensitive = false;
+
+            let length = this._entryList.get_children().length;
+            for (let index = 1; index < (length - 1); index++) {
+                query.removePoint(index);
+            }
+        }).bind(this));
+
+        route.connect('update', (function() {
+            this._clearInstructions();
+            this._instructionStack.visible_child = this._instructionWindow;
+
+            route.turnPoints.forEach((function(turnPoint) {
+                let row = new InstructionRow({ visible: true,
+                                               turnPoint: turnPoint });
+                this._instructionList.add(row);
+            }).bind(this));
+
+            /* Translators: %s is a time expression with the format "%f h" or "%f min" */
+            this._timeInfo.label = _("Estimated time: %s").format(Utils.prettyTime(route.time));
+            this._distanceInfo.label = Utils.prettyDistance(route.distance);
+
+            let stored = this._createStoredRoute();
+            if (stored.containsCurrentLocation) {
+                this._favoriteButton.sensitive = false;
+            } else {
+                this._favoriteButton.sensitive = true;
+                let isFavorite = placeStore.exists(stored,
+                                                   PlaceStore.PlaceType.FAVORITE_ROUTE);
+                this._favoriteButton.active = isFavorite;
+            }
+        }).bind(this));
+
+        query.connect('notify', (function() {
+            if (query.isValid())
+                this._instructionStack.visible_child = this._instructionSpinner;
+            else
+                this._clearInstructions();
+        }).bind(this));
 
         route.connect('reset', (function() {
             this._clearInstructions();
@@ -212,11 +283,6 @@ const Sidebar = new Lang.Class({
     },
 
     _initInstructionList: function() {
-            /* Translators: %s is a time expression with the format "%f h" or "%f min" */
-            this._timeInfo.label = _("Estimated time: %s").format(Utils.prettyTime(route.time));
-            this._distanceInfo.label = Utils.prettyDistance(route.distance);
-        }).bind(this));
-
         this._instructionList.connect('row-selected',(function(listbox, row) {
             if (row)
                 this._mapView.showTurnPoint(row.turnPoint);