mapviewer: update map's and marker's popup menu

Change-Id: I586a4ad783a139aa84013213b58914007ee07b04
Reviewed-by: Alex Wilson <alex.wilson@nokia.com>

9 files changed, 131 insertions, 111 deletions

diff --git a/examples/declarative/mapviewer/content/map/3dItem.qml b/examples/declarative/mapviewer/content/map/3dItem.qml
index 1ee5d55e..363aeec0 100644
--- a/examples/declarative/mapviewer/content/map/3dItem.qml
+++ b/examples/declarative/mapviewer/content/map/3dItem.qml
@@ -52,10 +52,9 @@ MapQuickItem {  //to be used inside MapComponent only
     coordinate: Coordinate { latitude : 0; longitude : 0 }
     //    zoomLevel: 8 // set this if you want the item to follow zoom level changes
 
-    function setGeometry(markers) {
-        var count = markers.length
-        coordinate.latitude = markers[count-1].coordinate.latitude
-        coordinate.longitude = markers[count-1].coordinate.longitude
+    function setGeometry(markers, index) {
+        coordinate.latitude = markers[index].coordinate.latitude
+        coordinate.longitude = markers[index].coordinate.longitude
     }
 
     anchorPoint.x: testItem.width/2
diff --git a/examples/declarative/mapviewer/content/map/CircleItem.qml b/examples/declarative/mapviewer/content/map/CircleItem.qml
index 10bedf6f..084451c2 100644
--- a/examples/declarative/mapviewer/content/map/CircleItem.qml
+++ b/examples/declarative/mapviewer/content/map/CircleItem.qml
@@ -50,9 +50,8 @@ MapCircle {
     smooth: true
     opacity: 0.5
 
-    function setGeometry(markers){
-        var count = markers.length
-        center = markers[count-2].coordinate
-        radius= center.distanceTo(markers[count-1].coordinate)
+    function setGeometry(markers, index){
+        center = markers[index].coordinate
+        radius= center.distanceTo(markers[index + 1].coordinate)
     }
 }
diff --git a/examples/declarative/mapviewer/content/map/ImageItem.qml b/examples/declarative/mapviewer/content/map/ImageItem.qml
index e787843e..90d6bf78 100644
--- a/examples/declarative/mapviewer/content/map/ImageItem.qml
+++ b/examples/declarative/mapviewer/content/map/ImageItem.qml
@@ -50,10 +50,9 @@ MapQuickItem {  //to be used inside MapComponent only
         drag.target: parent
     }
 
-    function setGeometry(markers) {
-        var count = markers.length
-        coordinate.latitude = markers[count-1].coordinate.latitude
-        coordinate.longitude = markers[count-1].coordinate.longitude
+    function setGeometry(markers, index) {
+        coordinate.latitude = markers[index].coordinate.latitude
+        coordinate.longitude = markers[index].coordinate.longitude
     }
 
     sourceItem: Image {
diff --git a/examples/declarative/mapviewer/content/map/MapComponent.qml b/examples/declarative/mapviewer/content/map/MapComponent.qml
index c4526a09..a203157f 100644
--- a/examples/declarative/mapviewer/content/map/MapComponent.qml
+++ b/examples/declarative/mapviewer/content/map/MapComponent.qml
@@ -56,8 +56,7 @@ Map {
     property variant markers
     property variant mapItems
     property int markerCounter: 0 // counter for total amount of markers. Resets to 0 when number of markers = 0
-    property int mapGeoItemsCounter: 0 // counter for total amount of mapItems. Resets to 0 when number of markers = 0
-    property Marker currentMarker
+    property int currentMarker
     signal mapPressed() // replace with
     // signal mousePressed(MouseEvent mouse) when QTBUG-14550 is fixed
 
@@ -555,7 +554,7 @@ Map {
             map.state = ""
             switch (button) {
                 case "Delete": {//remove marker
-                    map.removeMarker(currentMarker)
+                    map.deleteMarker(currentMarker)
                     break;
                 }
                 case "Move to": {//move marker
@@ -563,20 +562,20 @@ Map {
                     break;
                 }
                 case "Coordinates": {//show marker's coordinates
-                    map.coordinatesCaptured(currentMarker.coordinate.latitude, currentMarker.coordinate.longitude)
+                    map.coordinatesCaptured(markers[currentMarker].coordinate.latitude, markers[currentMarker].coordinate.longitude)
+                    break;
+                }
+                case "Distance to next point": {
+                    showDistance(formatDistance(map.markers[currentMarker].coordinate.distanceTo(map.markers[currentMarker+1].coordinate)));
                     break;
                 }
                 case "Route to next points"://calculate route
                 case "Route to next point": {
-//                    map.calculateRoute(currentMarker)
+                    map.calculateRoute()
                     break;
                 }
-                case "Distance to next point": {
-                    var count = map.markers.length
-                    for (var i = 0; i<count; i++) {
-                        if (currentMarker == map.markers[i])
-                            showDistance(formatDistance(currentMarker.coordinate.distanceTo(map.markers[i+1].coordinate)));
-                    }
+                case "Draw...": {
+                    map.drawItemPopup()
                     break;
                 }
             }
@@ -584,7 +583,7 @@ Map {
     }
 
     Menu {
-        id: popupMenu
+        id: drawMenu
         horizontalOrientation: false
         autoWidth: true
         z: map.z + 4
@@ -593,68 +592,78 @@ Map {
         width: 150
         x: 0
         y: 0
-
         onClicked: {
+            map.state = ""
             switch (button) {
-            case "Add Marker": {
-                addMarker()
-                break;
-            }
-            case "Get coordinate": {
-                map.coordinatesCaptured(mouseArea.lastCoordinate.latitude, mouseArea.lastCoordinate.longitude)
-                break;
-            }
-
-            case "Delete all markers": {
-                deleteMarkers()
-                break;
-            }
-
-            case "Delete all items": {
-                deleteMapItems()
-                break;
-            }
-
-            case "Draw Polyline": {
+            case "Polyline": {
                 addGeoItem("PolylineItem")
                 break;
             }
 
-            case "Draw Rectangle": {
+            case "Rectangle": {
                 addGeoItem("RectangleItem")
                 break;
             }
 
-            case "Draw Circle": {
+            case "Circle": {
                 addGeoItem("CircleItem")
                 break;
             }
 
-            case "Draw Polygon": {
+            case "Polygon": {
                 addGeoItem("PolygonItem")
                 break;
             }
 
-            case "Draw Image": {
+            case "Image": {
                 addGeoItem("ImageItem")
                 break;
             }
 
-            case "Draw Video": {
+            case "Video": {
                 addGeoItem("VideoItem")
                 break;
             }
 
-            case "Draw 3D Item": {
+            case "3D QML Item": {
                 addGeoItem("3dItem")
                 break;
             }
+            }
+        }
+    }
 
-            case "Calculate Route": {
-                calculateRoute()
+    Menu {
+        id: popupMenu
+        horizontalOrientation: false
+        autoWidth: true
+        z: map.z + 4
+        opacity: 0
+
+        width: 150
+        x: 0
+        y: 0
+
+        onClicked: {
+            switch (button) {
+            case "Add Marker": {
+                addMarker()
+                break;
+            }
+            case "Get coordinate": {
+                map.coordinatesCaptured(mouseArea.lastCoordinate.latitude, mouseArea.lastCoordinate.longitude)
+                break;
+            }
+
+            case "Delete all markers": {
+                deleteMarkers()
                 break;
             }
 
+            case "Delete all items": {
+                deleteMapItems()
+                break;
+            }
             }
             map.state = ""
         }
@@ -800,30 +809,6 @@ Map {
                 if (map.mapItems.length>0) {
                     popupMenu.addItem("Delete all items")
                 }
-
-                if (map.markers.length>=2) {
-                    popupMenu.addItem("Calculate Route")
-                }
-
-                if (map.markers.length>1) {
-                    popupMenu.addItem("Draw Polyline")
-
-                }
-
-                if (map.markers.length==2) {
-                    popupMenu.addItem("Draw Rectangle")
-                    popupMenu.addItem("Draw Circle")
-                }
-
-                if (map.markers.length>2) {
-                    popupMenu.addItem("Draw Polygon")
-                }
-
-                if (map.markers.length>0) {
-                    popupMenu.addItem("Draw Image")
-                    popupMenu.addItem("Draw Video")
-                    popupMenu.addItem("Draw 3D Item")
-                }
                 map.state = "PopupMenu"
             }
           }
@@ -884,7 +869,6 @@ Map {
             map.mapItems[i].destroy()
         }
         map.mapItems = []
-        mapGeoItemsCounter = 0
     }
 
     function addMarker(){
@@ -908,8 +892,7 @@ Map {
         var co = Qt.createComponent(item+'.qml')
         if (co.status == Component.Ready) {
             var o = co.createObject(map)
-            o.setGeometry(map.markers)
-            mapGeoItemsCounter++
+            o.setGeometry(map.markers, currentMarker)
             map.addMapItem(o)
             //update list of items
             var myArray = new Array()
@@ -924,42 +907,68 @@ Map {
         }
     }
 
-    function removeMarker(marker){
+    function deleteMarker(index){
         //update list of markers
         var myArray = new Array()
         var count = map.markers.length
         for (var i = 0; i<count; i++){
-            if (marker != map.markers[i]) myArray.push(map.markers[i])
+            if (index != i) myArray.push(map.markers[i])
         }
 
-        map.removeMapItem(marker)
-        marker.destroy()
+        map.removeMapItem(map.markers[index])
+        map.markers[index].destroy()
         map.markers = myArray
         if (markers.length == 0) markerCounter = 0
     }
 
     function markerPopup(){
         var array
-        var count = map.markers.length
+        var length = map.markers.length
 
         markerMenu.clear()
+        markerMenu.addItem("Delete")
         markerMenu.addItem("Coordinates")
         markerMenu.addItem("Move to")
-//        if ((currentMarker != markers[count-1]) && (count > 2)) {
-//            if (currentMarker == markers[count-2]) markerMenu.addItem("Route to next point")
-//            else  markerMenu.addItem("Route to next points")
-//        }
-//        else  markerMenu.addItem("Route to next point")
-        if (currentMarker != markers[count-1])
+        markerMenu.addItem("Draw...")
+
+
+        if (currentMarker == length-2){
+            markerMenu.addItem("Route to next point")
             markerMenu.addItem("Distance to next point")
-        markerMenu.addItem("Delete")
+
+        }
+        if (currentMarker < length-2){
+            markerMenu.addItem("Route to next points")
+            markerMenu.addItem("Distance to next point")
+        }
         map.state = "MarkerPopupMenu"
     }
 
+
+    function drawItemPopup(){
+        var array
+        var length = map.markers.length
+
+        drawMenu.clear()
+
+        drawMenu.addItem("Image")
+        drawMenu.addItem("Video")
+        drawMenu.addItem("3D QML Item")
+
+        if (currentMarker <= length-2){
+            drawMenu.addItem("Rectangle")
+            drawMenu.addItem("Circle")
+            drawMenu.addItem("Polyline")
+        }
+        if (currentMarker < length-2){
+            drawMenu.addItem("Polygon")
+        }
+        map.state = "DrawItemMenu"
+    }
+
     function calculateRoute(){
         routeQuery.clearWaypoints();
-        var count = map.markers.length
-        for (var i = 0; i< count; i++){
+        for (var i = currentMarker; i< map.markers.length; i++){
             routeQuery.addWaypoint(markers[i].coordinate)
         }
         routeQuery.travelModes = RouteQuery.CarTravel
@@ -1024,8 +1033,14 @@ Map {
         State {
             name: "MarkerPopupMenu"
             PropertyChanges { target: markerMenu; opacity: 1}
-            PropertyChanges { target: markerMenu; x: ((currentMarker.lastMouseX + markerMenu.width > map.width) ? map.width - markerMenu.width : currentMarker.lastMouseX )}
-            PropertyChanges { target: markerMenu; y: ((currentMarker.lastMouseY + markerMenu.height > map.height - 40) ? map.height - markerMenu.height - 40 : currentMarker.lastMouseY)}
+            PropertyChanges { target: markerMenu; x: ((markers[currentMarker].lastMouseX + markerMenu.width > map.width) ? map.width - markerMenu.width : markers[currentMarker].lastMouseX )}
+            PropertyChanges { target: markerMenu; y: ((markers[currentMarker].lastMouseY + markerMenu.height > map.height - 40) ? map.height - markerMenu.height - 40 : markers[currentMarker].lastMouseY)}
+        },
+        State {
+            name: "DrawItemMenu"
+            PropertyChanges { target: drawMenu; opacity: 1}
+            PropertyChanges { target: drawMenu; x: ((markers[currentMarker].lastMouseX + drawMenu.width > map.width) ? map.width - drawMenu.width : markers[currentMarker].lastMouseX )}
+            PropertyChanges { target: drawMenu; y: ((markers[currentMarker].lastMouseY + drawMenu.height > map.height - 40) ? map.height - drawMenu.height - 40 : markers[currentMarker].lastMouseY)}
         },
         State {
             name: "RoutePopupMenu"
diff --git a/examples/declarative/mapviewer/content/map/Marker.qml b/examples/declarative/mapviewer/content/map/Marker.qml
index a747edd8..f968f236 100644
--- a/examples/declarative/mapviewer/content/map/Marker.qml
+++ b/examples/declarative/mapviewer/content/map/Marker.qml
@@ -73,7 +73,13 @@ MapQuickItem {
             onPressed : {
                 map.pressX = mouse.x
                 map.pressY = mouse.y
-                map.currentMarker = marker
+                map.currentMarker = -1
+                for (var i = 0; i< map.markers.length; i++){
+                    if (marker == map.markers[i]){
+                        map.currentMarker = i
+                        break
+                    }
+                }
                 map.state = ""
             }
 
diff --git a/examples/declarative/mapviewer/content/map/PolygonItem.qml b/examples/declarative/mapviewer/content/map/PolygonItem.qml
index a19b46f9..9cd0f11f 100644
--- a/examples/declarative/mapviewer/content/map/PolygonItem.qml
+++ b/examples/declarative/mapviewer/content/map/PolygonItem.qml
@@ -50,9 +50,8 @@ MapPolygon {
     smooth: true
     opacity: 0.5
 
-    function setGeometry(markers){
-        var count = markers.length
-        for (var i = 0; i<count; i++){
+    function setGeometry(markers, index){
+        for (var i = index; i<markers.length; i++){
             addCoordinate(markers[i].coordinate)
         }
     }
diff --git a/examples/declarative/mapviewer/content/map/PolylineItem.qml b/examples/declarative/mapviewer/content/map/PolylineItem.qml
index d4220da8..bbb84841 100644
--- a/examples/declarative/mapviewer/content/map/PolylineItem.qml
+++ b/examples/declarative/mapviewer/content/map/PolylineItem.qml
@@ -48,9 +48,8 @@ MapPolyline {
     opacity: 0.7
     smooth: true
 
-    function setGeometry(markers){
-        var count = markers.length
-        for (var i = 0; i<count; i++){
+    function setGeometry(markers, index){
+        for (var i = index; i<markers.length; i++){
             addCoordinate(markers[i].coordinate)
         }
     }
diff --git a/examples/declarative/mapviewer/content/map/RectangleItem.qml b/examples/declarative/mapviewer/content/map/RectangleItem.qml
index b44dd857..18fee920 100644
--- a/examples/declarative/mapviewer/content/map/RectangleItem.qml
+++ b/examples/declarative/mapviewer/content/map/RectangleItem.qml
@@ -44,14 +44,19 @@ import QtLocation 5.0
 
 MapRectangle {
 
+    id: mapRectangle
     color: "red"
     opacity: 0.5
 
     border.width: 2.0
 
-    function setGeometry(markers){
-        var count = markers.length
-        topLeft = markers[count-2].coordinate
-        bottomRight = markers[count-1].coordinate
+    function setGeometry(markers, index){
+        topLeft = Qt.createQmlObject ('import QtQuick 2.0; import QtLocation 5.0; Coordinate {}', mapRectangle)
+        bottomRight = Qt.createQmlObject ('import QtQuick 2.0; import QtLocation 5.0; Coordinate {}', mapRectangle)
+
+        topLeft.latitude = Math.max(markers[index].coordinate.latitude, markers[index + 1].coordinate.latitude)
+        topLeft.longitude = Math.min(markers[index].coordinate.longitude, markers[index + 1].coordinate.longitude)
+        bottomRight.latitude = Math.min(markers[index].coordinate.latitude, markers[index + 1].coordinate.latitude)
+        bottomRight.longitude = Math.max(markers[index].coordinate.longitude, markers[index + 1].coordinate.longitude)
     }
 }
diff --git a/examples/declarative/mapviewer/content/map/VideoItem.qml b/examples/declarative/mapviewer/content/map/VideoItem.qml
index 53258090..30648324 100644
--- a/examples/declarative/mapviewer/content/map/VideoItem.qml
+++ b/examples/declarative/mapviewer/content/map/VideoItem.qml
@@ -50,10 +50,9 @@ MapQuickItem {  //to be used inside MapComponent only
     coordinate: Coordinate { latitude : 0; longitude : 0 }
     //    zoomLevel: 8 // set this if you want the video to follow zoom level changes
 
-    function setGeometry(markers) {
-        var count = markers.length
-        coordinate.latitude = markers[count-1].coordinate.latitude
-        coordinate.longitude = markers[count-1].coordinate.longitude
+    function setGeometry(markers, index) {
+        coordinate.latitude = markers[index].coordinate.latitude
+        coordinate.longitude = markers[index].coordinate.longitude
     }
 
     sourceItem: Rectangle {