From cd501175f5a096622b5397e302b228a0d37bdb97 Mon Sep 17 00:00:00 2001 From: portree_kid Date: Sun, 5 Jan 2020 20:22:45 +0100 Subject: [PATCH] Selection Editable Objects --- src/renderer/components/AirportEdit.vue | 13 +++----- src/renderer/components/EditLayer.vue | 3 ++ src/renderer/components/FlightgearMap.vue | 4 +-- src/renderer/components/GroundnetEdit.vue | 3 +- src/renderer/loaders/ParkingSpot.js | 38 ++++++++++------------- src/renderer/store/modules/Editable.js | 11 ++++--- 6 files changed, 36 insertions(+), 36 deletions(-) diff --git a/src/renderer/components/AirportEdit.vue b/src/renderer/components/AirportEdit.vue index ed8d4ad..6ef813a 100644 --- a/src/renderer/components/AirportEdit.vue +++ b/src/renderer/components/AirportEdit.vue @@ -11,19 +11,19 @@
ICAO : - {{ this.$store.state.Editable.data.properties.icao }} + {{ this.$store.state.Editable.data.airports[this.$store.state.Editable.index].icao }} Name : - {{ this.$store.state.Editable.data.properties.name }} + {{ this.$store.state.Editable.data.airports[this.$store.state.Editable.index].name }} Flights : - {{ this.$store.state.Editable.data.properties.flights }} + {{ this.$store.state.Editable.data.airports[this.$store.state.Editable.index].flights }} Airlines : - {{ this.$store.state.Editable.data.properties.airlines }} + {{ this.$store.state.Editable.data.airports[this.$store.state.Editable.index].airlines }} Groundnet : @@ -41,10 +41,7 @@ return this.$store.state.Editable.type === 'airport' }, groundnet: function () { - return this.$store.state.Editable.data.properties.groundnet - }, - airports_directory: function () { - return this.$store.state.Settings.settings.airportsDirectory + return this.$store.state.Editable.data.airports[this.$store.state.Editable.index].groundnet } } } diff --git a/src/renderer/components/EditLayer.vue b/src/renderer/components/EditLayer.vue index 93e5784..22065b2 100644 --- a/src/renderer/components/EditLayer.vue +++ b/src/renderer/components/EditLayer.vue @@ -30,6 +30,9 @@ }, methods: { load (icao) { + if (this.groundnet !== undefined) { + this.groundnet.removeFrom(this.$parent.mapObject) + } this.groundnet = readGroundnetXML(this.$store.state.Settings.settings.airportsDirectory, icao) this.groundnet.addTo(this.$parent.mapObject) this.groundnet.eachLayer(l => { diff --git a/src/renderer/components/FlightgearMap.vue b/src/renderer/components/FlightgearMap.vue index 7ed3e37..2649f6a 100644 --- a/src/renderer/components/FlightgearMap.vue +++ b/src/renderer/components/FlightgearMap.vue @@ -84,7 +84,7 @@ return ret && ret2 }, addEvent (event, item) { - console.log(event, item) + // console.log(event, item) if (item.properties.groundnet === 0) { event.target.setStyle({color: 'red', fillcolor: 'red'}) } else if ((item.properties.flights / item.properties.parking) > 10) { @@ -93,7 +93,7 @@ }, onClick (item) { console.log(item) - this.$store.commit('SET_EDIT_AIRPORT', item) + this.$store.commit('SET_EDIT_AIRPORT', item.properties) }, zoomUpdated (zoom) { this.$store.dispatch('setZoom', zoom) diff --git a/src/renderer/components/GroundnetEdit.vue b/src/renderer/components/GroundnetEdit.vue index fbdaf61..85b54ec 100644 --- a/src/renderer/components/GroundnetEdit.vue +++ b/src/renderer/components/GroundnetEdit.vue @@ -18,6 +18,7 @@ radius: 18 type: "gate" --> + {{this.$store.state.Editable.index}} Name : @@ -35,7 +36,7 @@ name: { // getter get: function () { - return this.$store.state.Editable.data.name + return this.$store.state.Editable.data.parking[this.$store.state.Editable.index].name }, // setter set: function (newValue) { diff --git a/src/renderer/loaders/ParkingSpot.js b/src/renderer/loaders/ParkingSpot.js index f349ad9..9c58ca6 100644 --- a/src/renderer/loaders/ParkingSpot.js +++ b/src/renderer/loaders/ParkingSpot.js @@ -6,24 +6,21 @@ const util = require('util'); var $ = require('jquery'); L.ParkingSpot = L.Circle.extend({ - options: { - id: 'Custom data!', - attributes: {} - }, - createDirection: function () { if (this.direction === undefined ) { var start = this._latlng; var options = { units: 'kilometers' }; - var end = turf.destination([start.lat, start.lng], this.options.attributes.radius / 1000, this.options.attributes.heading - 180, options); - // Resize, since leaflet is wrong - var rad2 = start.distanceTo(end.geometry.coordinates); + + var end = turf.destination([start.lng, start.lat], this.options.attributes.radius / 1000, this.options.attributes.heading - 180, options); + // Resize, since leaflet is wrong + var rad2 = start.distanceTo(this.turfToLatLng(end), options); + console.debug('Dist ', start, [start.lng, start.lat], end.geometry.coordinates, this.options.attributes.radius, rad2); this.setRadius(rad2); // console.log(util.inspect(this.editor)); if(this.editor._resizeLatLng.__vertex !== undefined){ - this.editor._resizeLatLng.__vertex.setLatLng(end.geometry.coordinates); + this.editor._resizeLatLng.__vertex.setLatLng(this.turfToLatLng(end)); } - this.direction = L.polyline([start, end.geometry.coordinates]); + this.direction = L.polyline([start, this.turfToLatLng(end)]); this.direction.addTo(this.editor.editLayer); @@ -37,26 +34,28 @@ L.ParkingSpot = L.Circle.extend({ if (this.editEnabled()) { var start = this._latlng; var options = { units: 'kilometers' }; - var end = turf.destination([start.lat, start.lng], this.options.attributes.radius / 1000, this.options.attributes.heading - 180, options); + var end = turf.destination([start.lng, start.lat], this.options.attributes.radius / 1000, this.options.attributes.heading - 180, options); // Resize, since leaflet is wrong - var rad2 = start.distanceTo(end.geometry.coordinates); + var rad2 = start.distanceTo(this.turfToLatLng(end), options); this.setRadius(rad2); if(this.editor._resizeLatLng.__vertex!== undefined){ - this.editor._resizeLatLng.__vertex.setLatLng(end.geometry.coordinates); + this.editor._resizeLatLng.__vertex.setLatLng(this.turfToLatLng(end)); } - this.direction.setLatLngs([start, end.geometry.coordinates]); + this.direction.setLatLngs([start, this.turfToLatLng(end)]); } }, updateDirectionFromVertex: function () { if (this.editEnabled()) { var start = this._latlng; var end = this.editor._resizeLatLng.__vertex.getLatLng(); - var heading = turf.bearing([start.lat, start.lng], [end.lat, end.lng]); + var heading = turf.bearing([start.lng, start.lat], [end.lng, end.lat]); this.options.attributes.heading = heading + 180; this.direction.setLatLngs([start, end]); } }, - + turfToLatLng: function (turfPoint) { + return {lat: turfPoint.geometry.coordinates[1], lng: turfPoint.geometry.coordinates[0]}; + }, extensions: function () { this.createDirection(); }, @@ -77,10 +76,7 @@ var parkingSpot = function (n, layerGroup) { var latlon = convert(n.attr('lat') + " " + n.attr('lon')); //console.log(latlon.decimalLatitude); //console.log(convert(n.attr('lat') + " " + n.attr('lon')).decimalLongitude); - const circle = new L.ParkingSpot([latlon.decimalLatitude, latlon.decimalLongitude], { radius: n.attr('radius') }); - circle.on('add', function (event) { - console.log(event); - }); + const circle = new L.ParkingSpot([latlon.decimalLatitude, latlon.decimalLongitude], { radius_m: n.attr('radius'), attributes: {} }); circle.on('editable:enable', function (event) { // event.target.createDirection(); }); @@ -100,7 +96,7 @@ airlineCodes="VIR,KAL,DAL,KLM" /> //circle.attributes = { type: n.attr('type'), name: n.attr('name'), radius: Number(n.attr('radius')), airlineCodes: n.attr('airlineCodes'), heading: Number(n.attr('heading')) }; $.each( n.attrs, function( key, value ) { - console.log( key + "\t" + value); + console.log( '$', circle.id, key , value); if(isNaN(value)) circle.options.attributes[ key ] = value; diff --git a/src/renderer/store/modules/Editable.js b/src/renderer/store/modules/Editable.js index f6b66b7..850092a 100644 --- a/src/renderer/store/modules/Editable.js +++ b/src/renderer/store/modules/Editable.js @@ -1,6 +1,7 @@ const state = { type: 'none', - data: Object + index: 'none', + data: {airports: {}, parking: {}, arc: {}} } const SET_EDIT_AIRPORT = 'SET_EDIT_AIRPORT' @@ -9,15 +10,17 @@ const SET_EDIT_ARC = 'SET_EDIT_ARC' const mutations = { SET_EDIT_AIRPORT (state, airport) { - state.data = airport + state.data.airports[airport.icao] = airport + state.index = airport.icao state.type = 'airport' }, SET_EDIT_PARKING (state, parking) { - state.data = parking + state.data.parking[parking.index] = parking + state.index = parking.index state.type = 'parking' }, SET_EDIT_ARC (state, arc) { - state.data = arc + state.data.arc = arc state.type = 'arc' }, 'SET_EDIT_PARKING_NAME' (state, parkingName) {