add borders to waypoints and make them clickable

2 files changed, 15 insertions, 4 deletions

diff --git a/src/MainMapView.qml b/src/MainMapView.qml
index 00f0ef2..3254611 100644
--- a/src/MainMapView.qml
+++ b/src/MainMapView.qml
@@ -30,7 +30,10 @@ Item {
         id: waypointSource
         key: "/map/waypointList"
         defaultValue: ""
-        onValueChanged: mapView.updateWaypoints()
+        onValueChanged: {
+            mapView.updateWaypoints()
+            console.log("value changed")
+        }
         Component.onCompleted: mapView.updateWaypoints()
     }
 
@@ -66,6 +69,7 @@ Item {
         }
         property MapQuickItem mapItem
         function updateWaypoints() {
+            console.log("waypoints updated")
             var waypointsList = waypointSource.value.split(">")
             for(var i = 0, size = waypointsList.length-1; i < size ; i++){
                 var currWaypointData = waypointsList[i].split(";")
diff --git a/src/MapWaypoint.qml b/src/MapWaypoint.qml
index 1300cb0..3a56dcc 100644
--- a/src/MapWaypoint.qml
+++ b/src/MapWaypoint.qml
@@ -11,10 +11,17 @@ MapQuickItem {
     autoFadeIn: false
     property string iconName
     property color iconColor
-    sourceItem: Asteroid.Icon {
+    sourceItem: Asteroid.IconButton {
         width: Asteroid.Dims.w(12)
+        iconName: "waypoint"
         height: width
-        name: root.iconName
-        color: root.iconColor
+        iconColor: root.iconColor.hsvValue < 0.5 ? "white" : "black"
+        Asteroid.Icon {
+            anchors.centerIn: parent
+            width: parent.width*0.9
+            height: width
+            name: root.iconName
+            color: root.iconColor
+        }
     }
 }