[gnome-maps/wip/mlundblad/osm-add-location: 2/17] Add a way to toggle visibility of a shape layer



commit b5b58f9bc351ca5d80608da4866e5c68cb61a887
Author: Jonas Danielsson <jonas threetimestwo org>
Date:   Fri Jan 29 17:55:50 2016 +0100

    Add a way to toggle visibility of a shape layer
    
    Add an eye shaped button that toggles the visiblity of a
    shape layer in the layers popover.
    
    https://bugzilla.gnome.org/show_bug.cgi?id=760889

 data/icons/Makefile.am                             |    2 +
 ...color_apps_16x16_layer-not-visible-symbolic.svg |   90 ++++++++++++++++++++
 .../hicolor_apps_16x16_layer-visible-symbolic.svg  |   87 +++++++++++++++++++
 data/ui/shape-layer-row.ui                         |   20 +++++
 src/layersPopover.js                               |   16 +++-
 src/shapeLayer.js                                  |   16 ++++
 6 files changed, 228 insertions(+), 3 deletions(-)
---
diff --git a/data/icons/Makefile.am b/data/icons/Makefile.am
index f4fd634..f341717 100644
--- a/data/icons/Makefile.am
+++ b/data/icons/Makefile.am
@@ -35,6 +35,8 @@ private_icons =                                                               \
        hicolor_apps_32x32_maps-direction-roundabout-270-symbolic.svg   \
        hicolor_apps_32x32_maps-direction-roundabout-315-symbolic.svg   \
        hicolor_apps_32x32_maps-direction-sharpright-symbolic.svg       \
+       hicolor_apps_16x16_layer-visible-symbolic.svg                   \
+       hicolor_apps_16x16_layer-not-visible-symbolic.svg               \
        hicolor_apps_16x16_layers-button-symbolic.svg                   \
        hicolor_apps_16x16_route-button-symbolic.svg                    \
        hicolor_apps_16x16_route-pedestrian-symbolic.svg                \
diff --git a/data/icons/hicolor_apps_16x16_layer-not-visible-symbolic.svg 
b/data/icons/hicolor_apps_16x16_layer-not-visible-symbolic.svg
new file mode 100644
index 0000000..9779f9a
--- /dev/null
+++ b/data/icons/hicolor_apps_16x16_layer-not-visible-symbolic.svg
@@ -0,0 +1,90 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/";
+   xmlns:cc="http://creativecommons.org/ns#";
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#";
+   xmlns:svg="http://www.w3.org/2000/svg";
+   xmlns="http://www.w3.org/2000/svg";
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd";
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape";
+   width="16"
+   height="16"
+   viewBox="0 0 16 16"
+   id="svg6640"
+   version="1.1"
+   inkscape:version="0.91 r13725"
+   sodipodi:docname="hicolor_apps_16x16_layer-not-visible-symbolic.svg">
+  <defs
+     id="defs6642" />
+  <sodipodi:namedview
+     id="base"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:pageopacity="0.0"
+     inkscape:pageshadow="2"
+     inkscape:zoom="32"
+     inkscape:cx="14.413375"
+     inkscape:cy="7.3539153"
+     inkscape:document-units="px"
+     inkscape:current-layer="layer1"
+     showgrid="true"
+     inkscape:snap-bbox="true"
+     inkscape:bbox-paths="true"
+     inkscape:bbox-nodes="true"
+     units="px"
+     inkscape:window-width="1920"
+     inkscape:window-height="1016"
+     inkscape:window-x="0"
+     inkscape:window-y="27"
+     inkscape:window-maximized="1">
+    <inkscape:grid
+       type="xygrid"
+       id="grid7188" />
+  </sodipodi:namedview>
+  <metadata
+     id="metadata6645">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage"; />
+        <dc:title />
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <g
+     inkscape:label="Layer 1"
+     inkscape:groupmode="layer"
+     id="layer1"
+     transform="translate(0,-1036.3622)">
+    <path
+       
style="color:#000000;font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:medium;line-height:normal;font-family:sans-serif;text-indent:0;text-align:start;text-decoration:none;text-decoration-line:none;text-decoration-style:solid;text-decoration-color:#000000;letter-spacing:normal;word-spacing:normal;text-transform:none;direction:ltr;block-progression:tb;writing-mode:lr-tb;baseline-shift:baseline;text-anchor:start;white-space:normal;clip-rule:nonzero;display:inline;overflow:visible;visibility:visible;opacity:1;isolation:auto;mix-blend-mode:normal;color-interpolation:sRGB;color-interpolation-filters:linearRGB;solid-color:#000000;solid-opacity:1;fill:#000000;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:1.99999988;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;color-rendering:auto;image-rendering:auto;shape-rendering:auto;text-rendering:auto;enable-back
 ground:accumulate"
+       d="m 7.9980469,1038.3622 c -3.4257107,0 -6.60241,3.3985 -7.9980469,5.9335 1.1046243,2.9575 
3.869169,6.0725 7.9980469,6.1036 4.1288781,0.031 7.0465711,-3.4255 7.9980471,-6.0704 -1.366004,-2.5991 
-4.572336,-5.9667 -7.9980471,-5.9667 z m 0,2 c 2.2248341,0 4.1713221,1.8465 5.6835941,4.1171 -0.314325,0.7024 
-1.860658,3.92 -5.6835941,3.92 -3.8211776,0 -5.3681919,-3.2448 -5.6816406,-3.9493 1.5164293,-2.2387 
3.4568066,-4.0878 5.6816406,-4.0878 z"
+       id="path7198-8"
+       inkscape:connector-curvature="0"
+       sodipodi:nodetypes="zczczzcscz" />
+    <ellipse
+       
style="opacity:1;fill:#000000;fill-opacity:1;stroke:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+       id="path7200"
+       cx="8"
+       cy="1044.3622"
+       rx="2.9999945"
+       ry="3.0000174" />
+    <ellipse
+       
style="opacity:1;fill:#ffffff;fill-opacity:1;stroke:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+       id="path7200-0"
+       cx="7.0000277"
+       cy="1043.3622"
+       rx="0.99997252"
+       ry="0.99999756" />
+    <path
+       
style="color:#000000;font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:medium;line-height:normal;font-family:sans-serif;text-indent:0;text-align:start;text-decoration:none;text-decoration-line:none;text-decoration-style:solid;text-decoration-color:#000000;letter-spacing:normal;word-spacing:normal;text-transform:none;direction:ltr;block-progression:tb;writing-mode:lr-tb;baseline-shift:baseline;text-anchor:start;white-space:normal;clip-rule:nonzero;display:inline;overflow:visible;visibility:visible;opacity:1;isolation:auto;mix-blend-mode:normal;color-interpolation:sRGB;color-interpolation-filters:linearRGB;solid-color:#000000;solid-opacity:1;fill:#000000;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:3;stroke-linecap:round;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;color-rendering:auto;image-rendering:auto;shape-rendering:auto;text-rendering:auto;enable-background:a
 ccumulate"
+       d="m 13.654293,1037.3628 a 1.3080632,1.3080437 0 0 0 -0.899203,0.395 l -11.3524447,11.3523 a 
1.3080632,1.3080437 0 1 0 1.8494981,1.8494 l 11.3524446,-11.3522 a 1.3080632,1.3080437 0 0 0 
-0.950295,-2.2445 z"
+       id="path4137"
+       inkscape:connector-curvature="0" />
+  </g>
+</svg>
diff --git a/data/icons/hicolor_apps_16x16_layer-visible-symbolic.svg 
b/data/icons/hicolor_apps_16x16_layer-visible-symbolic.svg
new file mode 100644
index 0000000..135278f
--- /dev/null
+++ b/data/icons/hicolor_apps_16x16_layer-visible-symbolic.svg
@@ -0,0 +1,87 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/";
+   xmlns:cc="http://creativecommons.org/ns#";
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#";
+   xmlns:svg="http://www.w3.org/2000/svg";
+   xmlns="http://www.w3.org/2000/svg";
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd";
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape";
+   width="16"
+   height="16"
+   viewBox="0 0 16 16"
+   id="svg6640"
+   version="1.1"
+   inkscape:version="0.91 r13725"
+   sodipodi:docname="hicolor_apps_16x16_layer-visible-symbolic.svg">
+  <defs
+     id="defs6642" />
+  <sodipodi:namedview
+     id="base"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:pageopacity="0.0"
+     inkscape:pageshadow="2"
+     inkscape:zoom="16"
+     inkscape:cx="-5.5719273"
+     inkscape:cy="-2.4904948"
+     inkscape:document-units="px"
+     inkscape:current-layer="layer1"
+     showgrid="false"
+     inkscape:snap-bbox="true"
+     inkscape:bbox-paths="true"
+     inkscape:bbox-nodes="true"
+     units="px"
+     inkscape:window-width="1920"
+     inkscape:window-height="1016"
+     inkscape:window-x="0"
+     inkscape:window-y="27"
+     inkscape:window-maximized="1"
+     showguides="true"
+     inkscape:guide-bbox="true">
+    <inkscape:grid
+       type="xygrid"
+       id="grid7188" />
+  </sodipodi:namedview>
+  <metadata
+     id="metadata6645">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage"; />
+        <dc:title />
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <g
+     inkscape:label="Layer 1"
+     inkscape:groupmode="layer"
+     id="layer1"
+     transform="translate(0,-1036.3622)">
+    <path
+       
style="color:#000000;font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:medium;line-height:normal;font-family:sans-serif;text-indent:0;text-align:start;text-decoration:none;text-decoration-line:none;text-decoration-style:solid;text-decoration-color:#000000;letter-spacing:normal;word-spacing:normal;text-transform:none;direction:ltr;block-progression:tb;writing-mode:lr-tb;baseline-shift:baseline;text-anchor:start;white-space:normal;clip-rule:nonzero;display:inline;overflow:visible;visibility:visible;opacity:1;isolation:auto;mix-blend-mode:normal;color-interpolation:sRGB;color-interpolation-filters:linearRGB;solid-color:#000000;solid-opacity:1;fill:#000000;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:1.99999988;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;color-rendering:auto;image-rendering:auto;shape-rendering:auto;text-rendering:auto;enable-back
 ground:accumulate"
+       d="m 8,1038.3438 c -3.4257107,0 -6.60241,3.3985 -7.99804687,5.9335 1.10462427,2.9575 
3.86916897,6.0725 7.99804687,6.1036 4.128878,0.031 7.046571,-3.4255 7.998047,-6.0704 -1.366004,-2.5991 
-4.572336,-5.9667 -7.998047,-5.9667 z m 0,2 c 2.224834,0 4.171322,1.8465 5.683594,4.1171 -0.314325,0.7024 
-1.860658,3.92 -5.683594,3.92 -3.8211776,0 -5.3681919,-3.2448 -5.6816406,-3.9493 C 3.8347887,1042.1929 
5.775166,1040.3438 8,1040.3438 Z"
+       id="path7198"
+       inkscape:connector-curvature="0"
+       sodipodi:nodetypes="zczczzcscz" />
+    <ellipse
+       
style="opacity:1;fill:#000000;fill-opacity:1;stroke:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+       id="path7200"
+       cx="8"
+       cy="1044.3622"
+       rx="2.9999945"
+       ry="3.0000174" />
+    <ellipse
+       
style="opacity:1;fill:#ffffff;fill-opacity:1;stroke:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+       id="path7200-0"
+       cx="7.0000277"
+       cy="1043.3622"
+       rx="0.99997252"
+       ry="0.99999756" />
+  </g>
+</svg>
diff --git a/data/ui/shape-layer-row.ui b/data/ui/shape-layer-row.ui
index 55c380a..a57895d 100644
--- a/data/ui/shape-layer-row.ui
+++ b/data/ui/shape-layer-row.ui
@@ -13,6 +13,26 @@
           <class name="horizontal"/>
         </style>
         <child>
+          <object class="GtkButton" id="visibleButton">
+            <property name="visible">True</property>
+            <property name="can_focus">True</property>
+            <property name="receives_default">False</property>
+            <property name="tooltip-text" translatable="yes">Toggle visible</property>
+            <child>
+              <object class="GtkImage" id="visibleImage">
+                <property name="visible">True</property>
+                <property name="can_focus">False</property>
+                <property name="icon-name">layer-visible-symbolic</property>
+                <property name="pixel_size">16</property>
+              </object>
+            </child>
+            <style>
+              <class name="image-button"/>
+              <class name="flat"/>
+            </style>
+          </object>
+        </child>
+        <child>
           <object class="GtkLabel" id="layerLabel">
             <property name="visible">True</property>
             <property name="hexpand">1</property>
diff --git a/src/layersPopover.js b/src/layersPopover.js
index 7612cb2..a4f2c74 100644
--- a/src/layersPopover.js
+++ b/src/layersPopover.js
@@ -27,7 +27,8 @@ const ShapeLayerRow = new Lang.Class({
     Name: 'ShapeLayerRow',
     Extends: Gtk.ListBoxRow,
     Template: 'resource:///org/gnome/Maps/ui/shape-layer-row.ui',
-    Children: ['layerLabel', 'closeButton'],
+    Children: ['closeButton'],
+    InternalChildren: ['layerLabel', 'visibleButton'],
 
     _init: function(params) {
         this.shapeLayer = params.shapeLayer;
@@ -35,8 +36,17 @@ const ShapeLayerRow = new Lang.Class({
 
         this.parent(params);
 
-        this.layerLabel.label = this.shapeLayer.getName();
-        this.layerLabel.tooltip_text = this.shapeLayer.file.get_parse_name();
+        this._layerLabel.label = this.shapeLayer.getName();
+        this._layerLabel.tooltip_text = this.shapeLayer.file.get_parse_name();
+        this._visibleButton.connect('clicked', (function() {
+            let image = this._visibleButton.get_child();
+
+            this.shapeLayer.visible = !this.shapeLayer.visible;
+            if (this.shapeLayer.visible)
+                image.icon_name = 'layer-visible-symbolic';
+            else
+                image.icon_name = 'layer-not-visible-symbolic';
+        }).bind(this));
     }
 });
 
diff --git a/src/shapeLayer.js b/src/shapeLayer.js
index 7bd511d..de416ef 100644
--- a/src/shapeLayer.js
+++ b/src/shapeLayer.js
@@ -43,6 +43,7 @@ const ShapeLayer = new Lang.Class({
     _init: function(params) {
         this.parent();
 
+        this._visible = true;
         this._mapView = params.mapView;
         this.file = params.file;
 
@@ -62,6 +63,21 @@ const ShapeLayer = new Lang.Class({
         return this._mapSource.bbox;
     },
 
+    get visible() {
+        return this._visible;
+    },
+
+    set visible(v) {
+        if (v && !this._visible) {
+            this._mapView.view.add_overlay_source(this._mapSource, 255);
+            this._markerLayer.show_all_markers();
+        } else if (!v && this._visible) {
+            this._mapView.view.remove_overlay_source(this._mapSource);
+            this._markerLayer.hide_all_markers();
+        }
+        this._visible = v;
+    },
+
     getName: function() {
         /*
          * Remove file extension and use that in lieu of a fileformat-specific


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