[gnome-maps] userLocationBubble: Design improvements



commit b77378cdbde29c74f01d458ea2c74f6d3bc3b361
Author: James Westman <james flyingpimonster net>
Date:   Sun Sep 27 21:32:42 2020 -0500

    userLocationBubble: Design improvements
    
    - Remove the Directions button. It's counterintuitive, since usually you click
    Directions to route to a place, not from one. It doesn't really serve any
    purpose--you can do the same thing more easily by searching for the place you
    want to go and clicking the directions button there.
    - Use the same style as place bubbles to show information (using rows with icons
    and separators)
    - Use title caps for "Current Location"
    - Slightly change the layout to avoid awkward whitespace with the Directions
    button removed

 data/ui/map-bubble.ui           | 18 ++++++++-
 data/ui/user-location-bubble.ui | 81 ++++++++++++++++++++++++++++++++++++-----
 src/geoclue.js                  |  2 +-
 src/mapBubble.js                | 36 ++++++++++++------
 src/userLocationBubble.js       |  4 +-
 5 files changed, 115 insertions(+), 26 deletions(-)
---
diff --git a/data/ui/map-bubble.ui b/data/ui/map-bubble.ui
index 34024ec7..9ccf32a2 100644
--- a/data/ui/map-bubble.ui
+++ b/data/ui/map-bubble.ui
@@ -25,7 +25,7 @@
           </object>
         </child>
         <child>
-          <object class="GtkBox">
+          <object class="GtkBox" id="title-box">
             <property name="visible">True</property>
             <property name="can_focus">False</property>
             <property name="orientation">vertical</property>
@@ -59,6 +59,22 @@
                     </style>
                   </object>
                 </child>
+                <child>
+                  <object class="GtkButton" id="bubble-send-to-button-alt">
+                    <property name="visible">False</property>
+                    <property name="can_focus">True</property>
+                    <property name="receives_default">False</property>
+                    <property name="tooltip-text" translatable="yes" comments="Translators: This is a 
tooltip">Share location</property>
+                    <child>
+                      <object class="GtkImage">
+                        <property name="visible">True</property>
+                        <property name="can_focus">False</property>
+                        <property name="icon-name">send-to-symbolic</property>
+                        <property name="pixel_size">16</property>
+                      </object>
+                    </child>
+                  </object>
+                </child>
               </object>
             </child>
             <child>
diff --git a/data/ui/user-location-bubble.ui b/data/ui/user-location-bubble.ui
index 219f20ad..6d196c80 100644
--- a/data/ui/user-location-bubble.ui
+++ b/data/ui/user-location-bubble.ui
@@ -6,23 +6,86 @@
         <property name="visible">True</property>
         <property name="can_focus">False</property>
         <property name="orientation">vertical</property>
-        <property name="spacing">6</property>
-        <property name="margin">18</property>
-        <property name="margin-top">0</property>
         <child>
-          <object class="GtkLabel" id="label-coordinates">
+          <object class="GtkSeparator">
+            <property name="visible">True</property>
+            <style>
+              <class name="no-margin-separator"/>
+            </style>
+          </object>
+        </child>
+        <child>
+          <object class="GtkBox">
             <property name="visible">True</property>
             <property name="can_focus">False</property>
-            <property name="halign">start</property>
-            <property name="margin_top">3</property>
-            <property name="wrap">True</property>
+            <property name="orientation">horizontal</property>
+            <property name="spacing">12</property>
+            <property name="margin_start">18</property>
+            <property name="margin_end">18</property>
+            <property name="margin_top">6</property>
+            <property name="margin_bottom">6</property>
+            <child>
+              <object class="GtkImage">
+                <property name="visible">True</property>
+                <property name="can_focus">False</property>
+                <property name="xalign">1</property>
+                <property name="halign">end</property>
+                <property name="valign">start</property>
+                <property name="icon_name">map-marker-symbolic</property>
+              </object>
+            </child>
+            <child>
+              <object class="GtkLabel" id="label-coordinates">
+                <property name="visible">True</property>
+                <property name="can_focus">False</property>
+                <property name="max_width_chars">30</property>
+                <property name="wrap">True</property>
+                <property name="xalign">0</property>
+                <property name="hexpand">True</property>
+                <property name="halign">fill</property>
+              </object>
+            </child>
+          </object>
+        </child>
+        <child>
+          <object class="GtkSeparator">
+            <property name="visible">True</property>
+            <style>
+              <class name="no-margin-separator"/>
+            </style>
           </object>
         </child>
         <child>
-          <object class="GtkLabel" id="label-accuracy">
+          <object class="GtkBox">
             <property name="visible">True</property>
             <property name="can_focus">False</property>
-            <property name="halign">start</property>
+            <property name="orientation">horizontal</property>
+            <property name="spacing">12</property>
+            <property name="margin_start">18</property>
+            <property name="margin_end">18</property>
+            <property name="margin_top">6</property>
+            <property name="margin_bottom">6</property>
+            <child>
+              <object class="GtkImage">
+                <property name="visible">True</property>
+                <property name="can_focus">False</property>
+                <property name="xalign">1</property>
+                <property name="halign">end</property>
+                <property name="valign">start</property>
+                <property name="icon_name">find-location-symbolic</property>
+              </object>
+            </child>
+            <child>
+              <object class="GtkLabel" id="label-accuracy">
+                <property name="visible">True</property>
+                <property name="can_focus">False</property>
+                <property name="max_width_chars">30</property>
+                <property name="wrap">True</property>
+                <property name="xalign">0</property>
+                <property name="hexpand">True</property>
+                <property name="halign">fill</property>
+              </object>
+            </child>
           </object>
         </child>
       </object>
diff --git a/src/geoclue.js b/src/geoclue.js
index 65fd7ecf..14f60ecb 100644
--- a/src/geoclue.js
+++ b/src/geoclue.js
@@ -115,7 +115,7 @@ var Geoclue = GObject.registerClass({
 
     _updateLocation(location) {
         if (!this.place)
-            this.place = new Place.Place({ name: _("Current location"),
+            this.place = new Place.Place({ name: _("Current Location"),
                                            isCurrentLocation: true });
 
         this.place.location = location;
diff --git a/src/mapBubble.js b/src/mapBubble.js
index b1c018a7..9383022d 100644
--- a/src/mapBubble.js
+++ b/src/mapBubble.js
@@ -27,6 +27,7 @@ const Mainloop = imports.mainloop;
 
 const Application = imports.application;
 const ContactPlace = imports.contactPlace;
+const GeocodeFactory = imports.geocode;
 const OSMAccountDialog = imports.osmAccountDialog;
 const OSMEditDialog = imports.osmEditDialog;
 const OSMUtils = imports.osmUtils;
@@ -60,9 +61,6 @@ class MapBubble extends Gtk.Popover {
         let buttonFlags = params.buttons || Button.NONE;
         delete params.buttons;
 
-        let routeFrom = params.routeFrom;
-        delete params.routeFrom;
-
         let checkInMatchPlace = params.checkInMatchPlace;
         if (checkInMatchPlace !== false)
             checkInMatchPlace = true;
@@ -83,6 +81,8 @@ class MapBubble extends Gtk.Popover {
                                                    'bubble-button-area',
                                                    'bubble-route-button',
                                                    'bubble-send-to-button',
+                                                   'bubble-send-to-button-alt',
+                                                   'title-box',
                                                    'bubble-favorite-button',
                                                    'bubble-check-in-button',
                                                    'bubble-edit-button',
@@ -101,7 +101,7 @@ class MapBubble extends Gtk.Popover {
             ui.bubbleButtonArea.visible = false;
         else {
             if (buttonFlags & Button.ROUTE)
-                this._initRouteButton(ui.bubbleRouteButton, routeFrom);
+                this._initRouteButton(ui.bubbleRouteButton);
             if (buttonFlags & Button.SEND_TO)
                 this._initSendToButton(ui.bubbleSendToButton);
             if (buttonFlags & Button.FAVORITE)
@@ -112,6 +112,20 @@ class MapBubble extends Gtk.Popover {
                 this._initEditButton(ui.bubbleEditButton);
         }
 
+        if (this.place.isCurrentLocation) {
+            /* Current Location bubbles have a slightly different layout, to
+               avoid awkward whitespace */
+
+            /* hide the normal button area */
+            ui.bubbleButtonArea.visible = false;
+            /* show the top-end-corner share button instead */
+            this._initSendToButton(ui.bubbleSendToButtonAlt);
+            /* adjust some margins */
+            ui.titleBox.margin = 12;
+            ui.titleBox.marginStart = 18;
+            ui.titleBox.spacing = 18;
+        }
+
         this.add(this._mainStack);
 
         /* Set up contact avatar */
@@ -213,7 +227,7 @@ class MapBubble extends Gtk.Popover {
         });
     }
 
-    _initRouteButton(button, routeFrom) {
+    _initRouteButton(button) {
         let query = Application.routeQuery;
         let from = query.points[0];
         let to = query.points[query.points.length - 1];
@@ -224,13 +238,11 @@ class MapBubble extends Gtk.Popover {
             query.freeze_notify();
             query.reset();
             Application.routingDelegator.reset();
-            if (routeFrom) {
-                from.place = this._place;
-            } else {
-                if (Application.geoclue.place)
-                    from.place = Application.geoclue.place;
-                to.place = this._place;
-            }
+
+            if (Application.geoclue.place)
+                from.place = Application.geoclue.place;
+            to.place = this._place;
+
             this.destroy();
             query.thaw_notify();
         });
diff --git a/src/userLocationBubble.js b/src/userLocationBubble.js
index 1450438e..fc7a3524 100644
--- a/src/userLocationBubble.js
+++ b/src/userLocationBubble.js
@@ -33,10 +33,8 @@ class UserLocationBubble extends MapBubble.MapBubble {
         this._ui = Utils.getUIObject('user-location-bubble', [ 'content',
                                                                'label-accuracy',
                                                                'label-coordinates' ]);
-        params.buttons = MapBubble.Button.ROUTE |
-                         MapBubble.Button.SEND_TO |
+        params.buttons = MapBubble.Button.SEND_TO |
                          MapBubble.Button.CHECK_IN;
-        params.routeFrom = true;
         params.checkInMatchPlace = false;
 
         super._init(params);


[Date Prev][Date Next]   [Thread Prev][Thread Next]   [Thread Index] [Date Index] [Author Index]