From dad1c69c2937b3a54d0b9f6486d2d85689debd2e Mon Sep 17 00:00:00 2001 From: portree_kid Date: Mon, 24 Feb 2020 20:20:34 +0100 Subject: [PATCH] Linking --- .gitignore | 1 + src/renderer/components/EditLayer.vue | 39 +++++------ src/renderer/components/Search.vue | 2 +- src/renderer/components/SettingsPanel.vue | 2 +- src/renderer/loaders/HoldNode.js | 2 +- src/renderer/loaders/ParkingSpot.js | 2 +- src/renderer/loaders/RunwayNode.js | 2 +- src/renderer/loaders/TaxiwaySegment.js | 6 +- .../loaders/TaxiwaySegmentExtender.js | 65 +++++++++++++++++-- src/renderer/loaders/groundnet_writer.js | 2 +- src/renderer/store/modules/Airports.js | 5 +- src/renderer/store/modules/Editable.js | 31 +++++---- 12 files changed, 104 insertions(+), 55 deletions(-) diff --git a/.gitignore b/.gitignore index 5795702..9fd0427 100644 --- a/.gitignore +++ b/.gitignore @@ -9,3 +9,4 @@ npm-debug.log npm-debug.log.* thumbs.db !.gitkeep +scan*.log diff --git a/src/renderer/components/EditLayer.vue b/src/renderer/components/EditLayer.vue index a1c3a33..c73db4e 100644 --- a/src/renderer/components/EditLayer.vue +++ b/src/renderer/components/EditLayer.vue @@ -127,7 +127,7 @@ l.featureLookup = this.featureLookup; if (typeof l.extensions === 'function') { - l.extensions() + l.extensions(this) } if (typeof l.bringToFront === 'function') { l.bringToFront() @@ -199,34 +199,23 @@ polyLine.addTo(this.groundnetLayerGroup) polyLine.groundnetLayerGroup = this.groundnetLayerGroup; polyLine.attributes = []; + polyLine.featureLookup = this.featureLookup; + extendTaxiSegment(polyLine); + polyLine.setEditlayer(this); + //polyLine.extensions(this); + polyLine.addListeners() - polyLine.on('editable:vertex:new', event => { - console.log(event) - let closest = this.closestLayerSnap(event.latlng, 10) - if (closest) { - event.latlng.__vertex.glueindex = closest.glueindex; - event.latlng.__vertex.setLatLng(closest.latlng); - this.featureLookup[event.latlng.__vertex.glueindex].push(event.latlng.__vertex); - console.log(closest) - } else { - event.latlng.__vertex.glueindex = ++this.groundnetLayerGroup.maxId; - this.featureLookup[event.latlng.__vertex.glueindex] = []; - } - event.latlng.attributes = []; - }) polyLine.on('editable:drawing:end', event => { - event.target.featureLookup = this.featureLookup; - extendTaxiSegment(event.target); - event.target.addListeners() console.log(event) event.target.addTo(this.groundnetLayerGroup) }) }, editedArc() { - + console.log('Edited Arc'); }, editedNode() { - if (this.$store.state.Editable.data.node===undefined || + if (this.$store.state.Editable.index === undefined || + this.$store.state.Editable.data.node === undefined || this.featureLookup===undefined) { return; } @@ -270,8 +259,11 @@ } else if (element instanceof L.ParkingSpot) { } + else if (element instanceof L.Editable.VertexMarker) { + latlng = element.latlng; + } else if (element instanceof L.TaxiwaySegment) { - if (Number(element.begin) === nIndex) { + if (Number(element.begin) === Number(nIndex)) { latlng = element._latlngs[0]; } if (Number(element.end) === nIndex) { @@ -279,14 +271,14 @@ } } else if (element instanceof L.Polyline) { element._latlngs.forEach(element => { - if(Number(element.__vertex.glueindex) === nIndex){ + if(Number(element.__vertex.glueindex) === Number(nIndex)){ latlng = element.__vertex.latlng; } }); } }) - if (!hasRunwayNode && isOnRunway) { + if (!hasRunwayNode && isOnRunway && latlng !== undefined) { this.$store.state.Editable.data.node.holdPointType const icon = new L.DivIcon({ className: 'custom-div-icon', @@ -389,6 +381,7 @@ xml.push(l) }) writeGroundnetXML(this.$store.state.Settings.settings.airportsDirectory, this.icao, xml) + this.load(this.icao, false) }, setVisible(visible) { if (this.layerGroup) { diff --git a/src/renderer/components/Search.vue b/src/renderer/components/Search.vue index 728a10c..6c0b527 100644 --- a/src/renderer/components/Search.vue +++ b/src/renderer/components/Search.vue @@ -128,7 +128,7 @@ searched: function () { console.log(this.searchterm) let searchRegex = new RegExp(this.searchterm, 'i') - return this.$store.state.Airports.airports + return this.$store.state.Airports.unfilteredairports .filter(a => searchRegex.test(a.properties.icao) || searchRegex.test(a.properties.name)) // .map(a => console.log(a.properties)) .map(a => ({ icao: a.properties.icao, name: a.properties.name })) diff --git a/src/renderer/components/SettingsPanel.vue b/src/renderer/components/SettingsPanel.vue index 410b546..4ddb055 100644 --- a/src/renderer/components/SettingsPanel.vue +++ b/src/renderer/components/SettingsPanel.vue @@ -6,7 +6,7 @@ -
+
Airports Directory {{ airports_directory }} diff --git a/src/renderer/loaders/HoldNode.js b/src/renderer/loaders/HoldNode.js index 7d893e8..d292bc2 100644 --- a/src/renderer/loaders/HoldNode.js +++ b/src/renderer/loaders/HoldNode.js @@ -14,7 +14,7 @@ L.HoldNode = L.Marker.extend({ this.follow(event.target.glueindex, event); }); }, - extensions: function () { + extensions: function (editLayer) { if (typeof this.featureLookup[this.glueindex] === 'undefined') { this.featureLookup[this.glueindex] = new Array(); } diff --git a/src/renderer/loaders/ParkingSpot.js b/src/renderer/loaders/ParkingSpot.js index 471267a..648ec2f 100644 --- a/src/renderer/loaders/ParkingSpot.js +++ b/src/renderer/loaders/ParkingSpot.js @@ -157,7 +157,7 @@ L.ParkingSpot = L.Circle.extend({ turfToLatLng: function (turfPoint) { return {lat: turfPoint.geometry.coordinates[1], lng: turfPoint.geometry.coordinates[0]}; }, - extensions: function () { + extensions: function (editLayer) { this.createDirection(); if (typeof this.featureLookup[this.id] === 'undefined') { this.featureLookup[this.id] = []; diff --git a/src/renderer/loaders/RunwayNode.js b/src/renderer/loaders/RunwayNode.js index f69b570..3cd5405 100644 --- a/src/renderer/loaders/RunwayNode.js +++ b/src/renderer/loaders/RunwayNode.js @@ -14,7 +14,7 @@ L.RunwayNode = L.Marker.extend({ this.follow(event.target.glueindex, event); }); }, - extensions: function () { + extensions: function (editLayer) { if (typeof this.featureLookup[this.glueindex] === 'undefined') { this.featureLookup[this.glueindex] = new Array(); } diff --git a/src/renderer/loaders/TaxiwaySegment.js b/src/renderer/loaders/TaxiwaySegment.js index ce64e03..687ea09 100644 --- a/src/renderer/loaders/TaxiwaySegment.js +++ b/src/renderer/loaders/TaxiwaySegment.js @@ -26,7 +26,7 @@ L.TaxiwaySegment = L.Polyline.extend({ } }); }, - extensions: function () { + extensions: function (editLayer) { this._latlngs[0].__vertex.glueindex = this.begin; this._latlngs.slice(-1)[0].__vertex.glueindex = this.end; if (typeof this.featureLookup[this.begin] === 'undefined') { @@ -45,7 +45,9 @@ L.TaxiwaySegment = L.Polyline.extend({ store.default.watch( function (state) { return state.Editable.data.arc; }, - () => { console.log(this) } + () => { + console.log(this) + } , { deep: true //add this if u need to watch object properties change etc. diff --git a/src/renderer/loaders/TaxiwaySegmentExtender.js b/src/renderer/loaders/TaxiwaySegmentExtender.js index 53d2032..432a26e 100644 --- a/src/renderer/loaders/TaxiwaySegmentExtender.js +++ b/src/renderer/loaders/TaxiwaySegmentExtender.js @@ -24,7 +24,11 @@ exports.extendTaxiSegment = function (taxiwaySegment) { } }); }; - taxiwaySegment.__proto__.extensions = function () { + taxiwaySegment.__proto__.setEditlayer = function (editLayer) { + this.editLayer = editLayer; + }; + taxiwaySegment.__proto__.extensions = function (editLayer) { + this.editLayer = editLayer; this._latlngs[0].__vertex.glueindex = this.begin; this._latlngs.slice(-1)[0].__vertex.glueindex = this.end; if (typeof this.featureLookup[this.begin] === 'undefined') { @@ -40,18 +44,22 @@ exports.extendTaxiSegment = function (taxiwaySegment) { this.on('click', function (event) { event.target.setStyle({color : 'red'}); console.log("Click : " + event.target); - store.default.dispatch('setArc', event.target.options.attributes); + if (store.default.state.Editable.data.arc !== event.target.options.attributes) { + store.default.dispatch('setArc', event.target.options.attributes); + } this.unwatch = store.default.watch( function (state) { return state.Editable.data.arc; }, () => { - event.target.setStyle({color : '#3388ff'}); + // Reset colour + event.target.setStyle({color : '#3388ff'}); this.unwatch(); } , { deep: true //add this if u need to watch object properties change etc. + } ); }); @@ -61,17 +69,60 @@ exports.extendTaxiSegment = function (taxiwaySegment) { this.follow(dragIndex, event); } }); + this.on('editable:vertex:new', event => { + console.log(event) + let closest = this.editLayer.closestLayerSnap(event.latlng, 10) + if (closest) { + event.latlng.__vertex['glueindex'] = Number(closest.glueindex); + event.latlng.__vertex.setLatLng(closest.latlng); + this.editLayer.featureLookup[event.latlng.__vertex.glueindex].push(event.latlng.__vertex); + console.log(closest) + } else { + event.latlng.__vertex['glueindex'] = ++this.editLayer.groundnetLayerGroup.maxId; + this.editLayer.featureLookup[event.latlng.__vertex.glueindex] = []; + this.editLayer.featureLookup[event.latlng.__vertex.glueindex].push(event.latlng.__vertex); + } + event.latlng.attributes = {index: event.latlng.__vertex.glueindex, isOnRunway: 0}; + }) this.on('editable:vertex:clicked', function (event) { console.log(this.featureLookup[event.vertex.glueindex]); store.default.dispatch('setNode', event.vertex.latlng.attributes) - event.vertex._icon.style['background-color'] = 'red'; + if(event.vertex._icon!=null) { + event.vertex._icon.style['background-color'] = 'red'; + } else if(event.vertex.icon!=null ) { + if(event.vertex.icon.style!=null) { + event.vertex.icon.style['background-color'] = 'red'; + } else { + event.vertex.setStyle({color : 'red'}) + } + } else if(event.vertex.options.icon!=null ) { + if(event.vertex.options.icon.style!=null) { + event.vertex.options.icon.style['background-color'] = 'red'; + } else { + event.vertex.options.icon._setIconStyles({color : 'red'}) + } + } this.unwatch = store.default.watch( function (state) { return state.Editable.data.node; }, () => { - event.vertex._icon.style['background-color'] = 'white'; + if(event.vertex._icon!=null) { + event.vertex._icon.style['background-color'] = 'white'; + } else if(event.vertex.icon!=null ) { + if(event.vertex.icon.style!=null) { + event.vertex.icon.style['background-color'] = 'white'; + } else { + event.vertex.setStyle({color : 'white'}) + } + } else if(event.vertex.options.icon!=null ) { + if(event.vertex.options.icon.style!=null) { + event.vertex.options.icon.style['background-color'] = 'white'; + } else { + event.vertex.options.icon._setIconStyles({color : 'white'}) + } + } this.unwatch(); } , @@ -124,13 +175,13 @@ exports.extendTaxiSegment = function (taxiwaySegment) { element.updateVertexFromDirection(); } else if (element instanceof L.Polyline) { - if (element.begin === dragIndex) { + if (Number(element.begin) === Number(dragIndex)) { element.getLatLngs()[0].update(event.latlng); element.setLatLngs(element.getLatLngs()); element.updateBeginVertex(event.latlng); element.updateMiddle(); } - if (element.end === dragIndex) { + if (Number(element.end) === Number(dragIndex)) { element.getLatLngs()[element.getLatLngs().length - 1].update(event.latlng); element.setLatLngs(element.getLatLngs()); element.updateEndVertex(event.latlng); diff --git a/src/renderer/loaders/groundnet_writer.js b/src/renderer/loaders/groundnet_writer.js index 2260321..cd6d08b 100644 --- a/src/renderer/loaders/groundnet_writer.js +++ b/src/renderer/loaders/groundnet_writer.js @@ -152,7 +152,7 @@ var convertLat = function (latlng) { var convertLon = function (latlng) { console.log(latlng.lng); - var NS = latlng.lat < 0 ? 'E' : 'W'; + var NS = latlng.lat > 0 ? 'E' : 'W'; var deg = mathjs.floor(mathjs.abs(latlng.lng)); var min = (mathjs.abs(latlng.lng) - deg) * 60; // console.log(NS + deg + " " + min); diff --git a/src/renderer/store/modules/Airports.js b/src/renderer/store/modules/Airports.js index 5385ac7..531e836 100644 --- a/src/renderer/store/modules/Airports.js +++ b/src/renderer/store/modules/Airports.js @@ -37,13 +37,12 @@ const actions = { context.commit(SET_AIRPORTS, airports .filter(point => typeof point.geometry.coordinates !== "undefined" ) .filter(point => point.properties.flights > 0 )); - }, + }, async getAirportsUnfiltered(context) { context.commit(RESET_AIRPORTS); let airports = await idb.getAirports(); context.commit(SET_UNFILTERED_AIRPORTS, airports - .filter(point => typeof point.geometry.coordinates !== "undefined" ) - .filter(point => point.properties.flights > 0 )); + .filter(point => typeof point.geometry.coordinates !== "undefined" )); }, async saveAirport(context, airport) { await idb.saveAirport(airport); diff --git a/src/renderer/store/modules/Editable.js b/src/renderer/store/modules/Editable.js index 1ea3ad8..b2fcee6 100644 --- a/src/renderer/store/modules/Editable.js +++ b/src/renderer/store/modules/Editable.js @@ -17,25 +17,28 @@ const mutations = { state.type = 'airport' }, SET_EDIT_PARKING (state, parking) { - state.data = {} + Vue.set(state, 'data', {}) Vue.set(state.data, 'parking', parking) - state.index = parking.index - state.type = 'parking' + Vue.set(state, 'index', parking.index) + Vue.set(state, 'type', 'parking') }, 'SET_EDIT_NODE' (state, node) { - state.data = {} + if (node === undefined) { + return + } + Vue.set(state, 'data', {}) Vue.set(state.data, 'node', node) - state.index = node.index - state.type = 'node' + Vue.set(state, 'index', node.index) + Vue.set(state, 'type', 'node') }, SET_EDIT_ARC (state, arc) { - state.data = {} - state.data.arc = arc + Vue.set(state, 'data', {}) + Vue.set(state.data, 'arc', arc) if (state.data.arc.name === undefined) { - state.data.arc.name = '' + Vue.set(state.data.arc, 'name', '') } - state.index = arc.index - state.type = 'arc' + Vue.set(state, 'index', arc.index) + Vue.set(state, 'type', 'arc') }, 'SET_EDIT_PARKING_NAME' (state, parkingName) { Vue.set(state.data.parking, 'name', parkingName) @@ -44,13 +47,13 @@ const mutations = { Vue.set(state.data.arc, 'name', arcName) }, 'SET_EDIT_PUSHBACK' (state, isPushBackRoute) { - state.data.arc.isPushBackRoute = isPushBackRoute + Vue.set(state.data.arc, 'isPushBackRoute', isPushBackRoute) }, 'SET_EDIT_HOLDPOINTTYPE' (state, holdPointType) { - state.data.node.holdPointType = holdPointType + Vue.set(state.data.node, 'holdPointType', holdPointType) }, 'SET_EDIT_ISONRUNWAY' (state, isOnRunway) { - state.data.node.isOnRunway = isOnRunway + Vue.set(state.data.node, 'isOnRunway', isOnRunway) } }