Merge pull request #14 from cnlpete/11-suggestion-improve-gps-management

feat: add a gps button that keeps track of the current position
cnlpete · Dec 4, 2024 · 30a5b1b · 30a5b1b
2 parents cc9ae84 + cc07b34
commit 30a5b1b
Show file tree

Hide file tree

Showing 7 changed files with 140 additions and 93 deletions.
diff --git a/harbour-rainviewer.pro b/harbour-rainviewer.pro
@@ -17,6 +17,7 @@ CONFIG += sailfishapp_qml
 DISTFILES += \
     #qml/harbour-rainviewer.qml \
     qml/components/Constants.qml \
+    qml/components/GPSButton.qml \
     qml/components/RainModel.qml \
     qml/components/NetworkCall.js \
     qml/cover/CoverPage.qml \

diff --git a/qml/components/GPSButton.qml b/qml/components/GPSButton.qml
@@ -0,0 +1,70 @@
+/*
+ * This file is part of harbour-rainviewer.
+ * Copyright (C) 2024 <cnlpete.de> Hauke Schade
+ *
+ * harbour-rainviewer is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU General Public License as published by
+ * the Free Software Foundation, either version 3 of the License, or
+ * (at your option) any later version.
+ *
+ * harbour-rainviewer is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU General Public License for more details.
+ *
+ * You should have received a copy of the GNU General Public License
+ * along with harbour-rainviewer.  If not, see <http://www.gnu.org/licenses/>.
+ *
+ */
+
+import QtQuick 2.0
+import Sailfish.Silica 1.0
+
+import QtPositioning 5.4
+
+Item {
+    id: button
+
+    height: Theme.iconSizeMedium
+    width: height
+
+    property bool enabled: settings.useGps && positionSource.valid
+    readonly property bool followGps: icon.followGps
+    readonly property alias position: positionSource.position
+    signal clicked
+
+    IconButton {
+        id: icon
+        anchors.fill: parent
+        enabled: button.enabled && button.position.latitudeValid && button.position.longitudeValid
+        onEnabledChanged: if (!enabled) { followGps = false; }
+
+        property bool followGps: false
+
+        onClicked: {
+            if (followGps) {
+                followGps = false
+            }
+            else {
+                button.clicked()
+            }
+        }
+        onDoubleClicked: {
+            followGps = !followGps
+        }
+
+        readonly property string color: pressed
+                                        ? Theme.highlightColor
+                                        : Theme.primaryColor
+        readonly property string iconstring: followGps
+                                               ? "call-recording-off"
+                                               : "call-recording-on-dark"
+        icon.source: "image://theme/icon-m-" + iconstring + "?" + color
+    }
+
+    PositionSource {
+         id: positionSource
+         active: button.visible && button.enabled
+    }
+}
+
diff --git a/qml/harbour-rainviewer.qml b/qml/harbour-rainviewer.qml
@@ -39,7 +39,6 @@ ApplicationWindow {
         property bool snow: true
         property int rainColorScheme: 2
         property bool useGps: true
-        property bool followGps: true
         property real lastLat: 60.170448 // Helsinki
         property real lastLng: 24.942046 // Helsinki
     }

diff --git a/qml/pages/Settings.qml b/qml/pages/Settings.qml
@@ -96,14 +96,6 @@ Dialog {
                 checked: settings.useGps
             }
 
-            TextSwitch {
-                id: gpsFollowSetting
-                text: qsTr('Follow GPS')
-                visible: gpsSetting.checked
-                description: qsTr('Will make the view follow your gps position')
-                checked: settings.followGps
-            }
-
             SectionHeader {
                 text: qsTr("Rain settings")
             }
@@ -187,8 +179,5 @@ Dialog {
         settings.snow = snowSetting.checked
 
         settings.useGps = gpsSetting.checked
-        if (gpsFollowSetting.visible) {
-            settings.followGps = gpsFollowSetting.checked
-        }
     }
 }
diff --git a/qml/pages/StartPage.qml b/qml/pages/StartPage.qml
@@ -123,10 +123,7 @@ Page {
             id: mapComp
 
             Item {
-                anchors.right: parent.right
-                anchors.left: parent.left
-                anchors.top: header.bottom
-                anchors.bottom: parent.bottom
+                anchors.fill: parent
 
                 Item {
                     id: mapItem
@@ -137,49 +134,6 @@ Page {
 
                     height: parent.height - bottom.height
 
-                    PositionSource {
-                         id: positionSource
-                         active: page.visible && settings.useGps
-
-                         function update_map() {
-                             map.updateSourcePoint("gps", positionSource.position.coordinate.latitude, positionSource.position.coordinate.longitude)
-
-                             if (positionSource.position.longitudeValid && positionSource.position.latitudeValid) {
-                                 map.setPaintProperty("gps-case", "circle-color", "white")
-                                 if (settings.followGps) {
-                                     map.fitView([positionSource.position.coordinate])
-                                 }
-                             }
-                             else {
-                                 map.setPaintProperty("gps-case", "circle-color", "grey")
-                             }
-
-                             if (positionSource.position.horizontalAccuracyValid) {
-                                 map.setPaintProperty("gps-uncertainty", "circle-radius", positionSource.position.horizontalAccuracy / map.metersPerPixel)
-                                 map.setPaintProperty("gps-uncertainty", "circle-color", "#87cefa")
-                                 map.setPaintProperty("gps-uncertainty", "circle-opacity", 0.25)
-                             }
-                         }
-
-
-                         onPositionChanged: {
-                             update_map()
-                         }
-
-                         Component.onCompleted: {
-                             map.updateSourcePoint("gps", positionSource.position.coordinate.latitude, positionSource.position.coordinate.longitude)
-
-                             map.addLayer("gps-uncertainty", {"type": "circle", "source": "gps"}, "gps-case")
-                             map.setPaintProperty("gps-uncertainty", "circle-radius", 0)
-
-                             map.addLayer("gps-case", {"type": "circle", "source": "gps"})
-                             map.setPaintProperty("gps-case", "circle-radius", 10)
-                             map.setPaintProperty("gps-case", "circle-color", "grey")
-
-                             map.fitView([positionSource.position.coordinate])
-                         }
-                    }
-
                     MapboxMap {
                         id: map
                         anchors.fill: parent
@@ -244,7 +198,7 @@ Page {
 
                     Connections {
                         target: map
-                        onMetersPerPixelChanged: positionSource.update_map()
+                        onMetersPerPixelChanged: gpsButton.update_map()
                     }
 
                     Label {
@@ -337,7 +291,61 @@ Page {
                         }
 
                         height: parent.height
-                        width: parent.width - icon.width
+                        width: parent.width - icon.width - gpsButton.width
+                    }
+
+                    GPSButton {
+                        id: gpsButton
+                        height: Theme.iconSizeMedium
+                        width: height
+                        anchors.verticalCenter: parent.verticalCenter
+                        anchors.leftMargin: Theme.horizontalPageMargin
+
+                        onClicked: {
+                            map.center = position.coordinate
+                        }
+
+                        onFollowGpsChanged: {
+                            if (followGps) {
+                                map.fitView([position.coordinate])
+                            }
+                        }
+
+                        onPositionChanged: {
+                            if (followGps) {
+                                map.fitView([position.coordinate])
+                            }
+
+                            update_map()
+                        }
+
+                        function update_map() {
+                            map.updateSourcePoint("gps", position.coordinate.latitude, position.coordinate.longitude)
+
+                            if (position.horizontalAccuracyValid) {
+                                map.setPaintProperty("gps-case", "circle-color", "white")
+                            }
+                            else {
+                                map.setPaintProperty("gps-case", "circle-color", "grey")
+                            }
+
+                            if (position.horizontalAccuracyValid) {
+                                map.setPaintProperty("gps-uncertainty", "circle-radius", position.horizontalAccuracy / map.metersPerPixel)
+                                map.setPaintProperty("gps-uncertainty", "circle-color", "#87cefa")
+                                map.setPaintProperty("gps-uncertainty", "circle-opacity", 0.25)
+                            }
+                        }
+
+                        Component.onCompleted: {
+                            map.updateSourcePoint("gps", position.coordinate.latitude, position.coordinate.longitude)
+
+                            map.addLayer("gps-uncertainty", {"type": "circle", "source": "gps"}, "gps-case")
+                            map.setPaintProperty("gps-uncertainty", "circle-radius", 0)
+
+                            map.addLayer("gps-case", {"type": "circle", "source": "gps"})
+                            map.setPaintProperty("gps-case", "circle-radius", 10)
+                            map.setPaintProperty("gps-case", "circle-color", "grey")
+                        }
                     }
 
                     Repeater {

diff --git a/translations/harbour-rainviewer-de_DE.ts b/translations/harbour-rainviewer-de_DE.ts
@@ -82,37 +82,27 @@
         <translation>Während die App angezeigt wird, wird aktiv die aktuelle Position gesucht.</translation>
     </message>
     <message>
-        <location filename="../qml/pages/Settings.qml" line="101"/>
-        <source>Follow GPS</source>
-        <translation>Folge GPS</translation>
-    </message>
-    <message>
-        <location filename="../qml/pages/Settings.qml" line="103"/>
-        <source>Will make the view follow your gps position</source>
-        <translation>Bringe die aktuelle GPS Position ins Sichtfeld, wenn sich die Position ändert.</translation>
-    </message>
-    <message>
-        <location filename="../qml/pages/Settings.qml" line="108"/>
+        <location filename="../qml/pages/Settings.qml" line="100"/>
         <source>Rain settings</source>
         <translation>Regen Einstellungen</translation>
     </message>
     <message>
-        <location filename="../qml/pages/Settings.qml" line="113"/>
+        <location filename="../qml/pages/Settings.qml" line="105"/>
         <source>Smooth Rain Rendering</source>
         <translation>Sanfte Regen Darstellung</translation>
     </message>
     <message>
-        <location filename="../qml/pages/Settings.qml" line="119"/>
+        <location filename="../qml/pages/Settings.qml" line="111"/>
         <source>Enable snow</source>
         <translation>Schnee</translation>
     </message>
     <message>
-        <location filename="../qml/pages/Settings.qml" line="125"/>
+        <location filename="../qml/pages/Settings.qml" line="117"/>
         <source>Rain resolution</source>
         <translation>Auflösung</translation>
     </message>
     <message>
-        <location filename="../qml/pages/Settings.qml" line="142"/>
+        <location filename="../qml/pages/Settings.qml" line="134"/>
         <source>Rain color scheme</source>
         <translation>Farbschema</translation>
     </message>
@@ -145,7 +135,7 @@
         <translation>Regenradar</translation>
     </message>
     <message>
-        <location filename="../qml/pages/StartPage.qml" line="255"/>
+        <location filename="../qml/pages/StartPage.qml" line="209"/>
         <source>Scale: %0 m/pixel ; zoom: %1</source>
         <translation>Skalierung: %0 m/Pixel; Zoom: %1</translation>
     </message>

diff --git a/translations/harbour-rainviewer.ts b/translations/harbour-rainviewer.ts
@@ -82,37 +82,27 @@
         <translation type="unfinished"></translation>
     </message>
     <message>
-        <location filename="../qml/pages/Settings.qml" line="101"/>
-        <source>Follow GPS</source>
-        <translation type="unfinished"></translation>
-    </message>
-    <message>
-        <location filename="../qml/pages/Settings.qml" line="103"/>
-        <source>Will make the view follow your gps position</source>
-        <translation type="unfinished"></translation>
-    </message>
-    <message>
-        <location filename="../qml/pages/Settings.qml" line="108"/>
+        <location filename="../qml/pages/Settings.qml" line="100"/>
         <source>Rain settings</source>
         <translation type="unfinished"></translation>
     </message>
     <message>
-        <location filename="../qml/pages/Settings.qml" line="113"/>
+        <location filename="../qml/pages/Settings.qml" line="105"/>
         <source>Smooth Rain Rendering</source>
         <translation type="unfinished"></translation>
     </message>
     <message>
-        <location filename="../qml/pages/Settings.qml" line="119"/>
+        <location filename="../qml/pages/Settings.qml" line="111"/>
         <source>Enable snow</source>
         <translation type="unfinished"></translation>
     </message>
     <message>
-        <location filename="../qml/pages/Settings.qml" line="125"/>
+        <location filename="../qml/pages/Settings.qml" line="117"/>
         <source>Rain resolution</source>
         <translation type="unfinished"></translation>
     </message>
     <message>
-        <location filename="../qml/pages/Settings.qml" line="142"/>
+        <location filename="../qml/pages/Settings.qml" line="134"/>
         <source>Rain color scheme</source>
         <translation type="unfinished"></translation>
     </message>
@@ -145,7 +135,7 @@
         <translation type="unfinished"></translation>
     </message>
     <message>
-        <location filename="../qml/pages/StartPage.qml" line="255"/>
+        <location filename="../qml/pages/StartPage.qml" line="209"/>
         <source>Scale: %0 m/pixel ; zoom: %1</source>
         <translation type="unfinished"></translation>
     </message>