diff --git a/Phi/images/dragAircraft.svg b/Phi/images/dragAircraft.svg
new file mode 100644
index 000000000..a6778053e
--- /dev/null
+++ b/Phi/images/dragAircraft.svg
@@ -0,0 +1,39 @@
+
+
diff --git a/Phi/topics/Map.html b/Phi/topics/Map.html
index c92c0a621..cf18e0af1 100644
--- a/Phi/topics/Map.html
+++ b/Phi/topics/Map.html
@@ -18,5 +18,6 @@
overlays: overlays,
selectedOverlays: selectedOverlays,
hasFollowAircraft: true,
+ hasToggleOwnAircraftDrag: true,
scale: { metric: false }
}}">
diff --git a/Phi/widgets/map.html b/Phi/widgets/map.html
index 9fc397b9a..6a5e29c54 100644
--- a/Phi/widgets/map.html
+++ b/Phi/widgets/map.html
@@ -62,7 +62,7 @@
padding-left: 0.5em;
}
-.followAircraft {
+.mapOption {
background: rgba(255, 255, 255, 0.8);
box-shadow: 0 0 15px rgba(0, 0, 0, 0.2);
border-radius: 5px;
diff --git a/Phi/widgets/map.js b/Phi/widgets/map.js
index 9839f238e..2637c1e95 100644
--- a/Phi/widgets/map.js
+++ b/Phi/widgets/map.js
@@ -149,13 +149,24 @@ define(
var followAircraftControl = L.control();
followAircraftControl.onAdd = function(map) {
- this._div = L.DomUtil.create('div', 'followAircraft');
+ this._div = L.DomUtil.create('div', 'mapOption');
this._div.innerHTML = '
';
return this._div;
}
followAircraftControl.addTo(self.map);
}
+ if (params && params.hasToggleOwnAircraftDrag) {
+ var ownAircraftDragControl = L.control();
+
+ ownAircraftDragControl.onAdd = function(map) {
+ this._div = L.DomUtil.create('div', 'mapOption');
+ this._div.innerHTML = '
';
+ return this._div;
+ }
+ ownAircraftDragControl.addTo(self.map);
+ }
+
if (params && params.overlays) {
L.control.layers(baseLayers, params.overlays).addTo(self.map);
}
@@ -173,11 +184,11 @@ define(
L.control.scale(params.scale).addTo(self.map);
}
- var aircraftMarker = L.aircraftMarker(self.map.getCenter(), {
+ self.aircraftMarker = L.aircraftMarker(self.map.getCenter(), {
className : 'you-aircraft-marker-icon'
});
- aircraftMarker.addTo(self.map);
+ self.aircraftMarker.addTo(self.map);
var aircraftTrack = L.polyline([], {
color : 'red'
@@ -202,8 +213,8 @@ define(
});
self.position.subscribe(function(newValue) {
- if (!aircraftMarker.isDragging)
- aircraftMarker.setLatLng(newValue);
+ if (!self.aircraftMarker.isDragging)
+ self.aircraftMarker.setLatLng(newValue);
});
self.labelLines = [
@@ -237,7 +248,16 @@ define(
var center = leaflet.latLng(self.latitude(), self.longitude());
self.map.setView(center);
- aircraftMarker.setLatLng(center);
+ self.aircraftMarker.setLatLng(center);
+
+ // Enable/disable own aircraft dragging
+ self.dragOwnAircraft = ko.observable(true);
+
+ self.toggleDragOwnAircraft = function(a) {
+ self.dragOwnAircraft(!self.dragOwnAircraft());
+ self.dragOwnAircraft() ? self.aircraftMarker.dragging.enable() : self.aircraftMarker.dragging.disable();
+ }
+
}
ViewModel.prototype.dispose = function() {