diff --git a/src/renderer/components/EditBar.vue b/src/renderer/components/EditBar.vue index 2fe4927..3d7112d 100644 --- a/src/renderer/components/EditBar.vue +++ b/src/renderer/components/EditBar.vue @@ -227,7 +227,7 @@ } else if (o instanceof L.Polyline) { console.log(o) //_latlngs[""0""].__vertex.glueindex - var latLngs = o.getLatLngs().map(l => ({lat: l.lat, lng: l.lng, index: l.__vertex.glueindex})); + var latLngs = o.getLatLngs().map(l => ({lat: l.lat, lng: l.lng, index: l.glueindex})); return { 'start': Number(o['begin']), 'end': Number(o['end']), '_leaflet_id': o._leaflet_id, 'type': 'poly', 'isPushBackRoute': o.options.attributes.isPushBackRoute, latLngs: latLngs }; } else { console.log('Unknown Type ') diff --git a/src/renderer/components/EditLayer.vue b/src/renderer/components/EditLayer.vue index 17bd31f..6ec1b54 100644 --- a/src/renderer/components/EditLayer.vue +++ b/src/renderer/components/EditLayer.vue @@ -399,34 +399,83 @@ }) return parkings }, + refreshLookup(index) { + //element.__vertex + this.featureLookup[index] = this.featureLookup[index].filter(item => { + return !(item instanceof L.Editable.VertexMarker && item.editor.__vertex === undefined) + } + ); + this.featureLookup[index].forEach((element, i) => { + if (element instanceof L.Polyline) { + element.editor.refresh(); + element.editor.reset(); + } + }); + }, removeNode (index) { if(this.featureLookup[index]===undefined) { console.error("Lookup " + index + " failed "); return; } - this.featureLookup[index].forEach((element, i) => { - if (element instanceof L.Polyline) { - // element.latlngs.forEach(); - element._latlngs.forEach((e1, index1) => { - console.log(e1); - e1.__vertex.removeFrom(element.editor.editLayer); - element._latlngs.splice(index1,1); - if (element._latlngs.length==1) { - this.featureLookup[index].splice(i,1); - this.featureLookup[element._latlngs[0].__vertex.glueindex].forEach((otherEnd, j) => { - console.log(j + ' ' + otherEnd); - if(element === otherEnd){ - this.featureLookup[element._latlngs[0].__vertex.glueindex].splice(j,1); - } - }); + try { + this.featureLookup[index].forEach((element, i) => { + if (element instanceof L.Polyline) { + console.log('Poly : ' + i + ' ' + element.attributes); + // Complete poly with be removed + if ( element._latlngs.length <= 3 ) { + if(Number(element.begin) !== index) { + this.featureLookup[Number(element.begin)] = this.featureLookup[Number(element.begin)].filter(item => item !== element); + this.refreshLookup(Number(element.begin)) + } + if(Number(element.end) !== index) { + this.featureLookup[Number(element.end)] = this.featureLookup[Number(element.end)].filter(item => item !== element); + this.refreshLookup(Number(element.end)) + } element.removeFrom(this.groundnetLayerGroup); } - }); - } else if (element instanceof L.RunwayNode) { - this.featureLookup[index] = this.featureLookup[index].filter(item => item !== element); - element.removeFrom(this.groundnetLayerGroup); - } - }); + else { + element.getLatLngs().forEach((e1, index1) => { + console.log(index1 + ' ' + e1); + if (e1.attributes.index===index) { + var splitOffNodes = element.getLatLngs().splice(index1); + element.editor.refresh(); + element.editor.reset(); + splitOffNodes.splice(0, 1); + if( splitOffNodes.length>1) { + var polyline = new L.Polyline(splitOffNodes, { attributes: {} }).addTo(layerGroup); + extendTaxiSegment(polyline); + polyline.addListeners(); + polyline.setEditlayer(this); + polyline.enableEdit(); + polyline.editor.refresh(); + polyline.editor.reset(); + polyline.addTo(this.groundnetLayerGroup); + polyline.end = element.end; + // Remove from end lookup + this.featureLookup[element.options.attributes.end] = this.featureLookup[element.options.attributes.end].filter(item => item !== element); + // push to the end lookup + this.featureLookup[element.options.attributes.end].push(polyline); + } + if(element.getLatLngs().length === 1) { + this.featureLookup[index] = this.featureLookup[index].filter(item => item !== element); + element.removeFrom(this.groundnetLayerGroup); + } + // element.editor.splitShape(element._latlngs, index1); + console.log('Removed'); + } + }); + } + } else if (element instanceof L.RunwayNode) { + console.log('Runway : ' + i + ' ' + element.attributes); + this.featureLookup[index] = this.featureLookup[index].filter(item => item !== element); + element.removeFrom(this.groundnetLayerGroup); + } else { + console.warn('WTF' + element); + } + }); + } catch (error) { + console.error(error); + } }, drawPolyline () { var polyLine = this.$parent.mapObject.editTools.startPolyline() @@ -616,8 +665,8 @@ } } else if (element instanceof L.Polyline) { element._latlngs.forEach(element => { - if(element.__vertex && Number(element.__vertex.glueindex) === Number(nIndex)){ - latlng = element.__vertex.latlng; + if(element.__vertex && Number(element.glueindex) === Number(nIndex)){ + latlng = element.latlng; } }); } @@ -669,9 +718,12 @@ // console.log(layer._latlngs) layer._latlngs.forEach(latlng => { if (latlng.__vertex) { + if (Number.isNaN(latlng.glueindex)) { + console.warn('No glueindex : ' + latlng.__vertex); + } let distance = latlng.distanceTo(eventLatlng) if (distance > 0 && distance < snap) { - layers.push({d: distance, l: layer, latlng: latlng.__vertex.latlng, glueindex: latlng.__vertex.glueindex}) + layers.push({d: distance, l: layer, latlng: latlng.__vertex.latlng, glueindex: latlng.glueindex}) } } }) diff --git a/src/renderer/loaders/TaxiwaySegment.js b/src/renderer/loaders/TaxiwaySegment.js deleted file mode 100644 index 687ea09..0000000 --- a/src/renderer/loaders/TaxiwaySegment.js +++ /dev/null @@ -1,152 +0,0 @@ -/* eslint-disable */ -var L = require('leaflet'); -const store = require('../store'); - - -L.TaxiwaySegment = L.Polyline.extend({ - begin: String, - end: String, - bidirectional: Boolean, - - updateBeginVertex: function (latlng) { - if (this._latlngs[0].__vertex) { - this._latlngs[0].__vertex.setLatLng(latlng); - } - }, - updateEndVertex: function (latlng) { - if (this._latlngs[1].__vertex) { - this._latlngs[1].__vertex.setLatLng(latlng); - } - }, - - updateMiddle: function () { - this._latlngs.forEach(element => { - if (element.__vertex.middleMarker) { - element.__vertex.middleMarker.updateLatLng(); - } - }); - }, - 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') { - this.featureLookup[this.begin] = new Array(); - } - if (typeof this.featureLookup[this.end] === 'undefined') { - this.featureLookup[this.end] = new Array(); - } - this.featureLookup[this.begin].push(this); - this.featureLookup[this.end].push(this); - }, - addListeners: function () { - this.on('click', function (event) { - console.log("Click : " + event.target); - store.default.dispatch('setArc', event.target.options.attributes); - store.default.watch( function (state) { - return state.Editable.data.arc; - }, - () => { - console.log(this) - } - , - { - deep: true //add this if u need to watch object properties change etc. - }); - }); - this.on('editable:drawing:move', function (event) { - console.log(event.target); - if (dragIndex >= 0) { - this.follow(dragIndex, event); - } - }); - 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'; - }); - var dragIndex = -1; - this.on('editable:vertex:dragstart', function (event) { - console.log("Event Target : ", event.target); - console.log("Middle Marker : ", event.vertex == event.vertex.middleMarker); - console.log("Middle Marker : ", event.vertex.glueindex == undefined); - if (event.vertex.glueindex == undefined) - return; - dragIndex = event.vertex.glueindex; - }); - this.on('editable:vertex:dragend', function (event) { - console.log("Dragend : ", event.vertex); - if (dragIndex > 0) { - this.featureLookup[dragIndex].forEach(element => { - if (element instanceof L.ParkingSpot) { - //element.setLatLng(event); - console.log(element); - } - }); - } - dragIndex = -1; - }); - }, - /** - * - */ - - follow(dragIndex, event) { - this.featureLookup[dragIndex].forEach(element => { - if (element !== event.target) { - if (element instanceof L.RunwayNode) { - element.setLatLng(event.latlng); - } - else if (element instanceof L.HoldNode) { - element.setLatLng(event.latlng); - } - else if (element instanceof L.ParkingSpot) { - // element.disableEdit(); - element.setLatLng(event.latlng); - // element.enableEdit(); - // element.extensions(); - element.updateMiddleMarker(); - element.updateVertexFromDirection(); - } - else if (element instanceof L.TaxiwaySegment) { - if (element.begin === dragIndex) { - element.getLatLngs()[0].update(event.latlng); - element.setLatLngs(element.getLatLngs()); - element.updateBeginVertex(event.latlng); - element.updateMiddle(); - } - if (element.end === dragIndex) { - element.getLatLngs()[element.getLatLngs().length - 1].update(event.latlng); - element.setLatLngs(element.getLatLngs()); - element.updateEndVertex(event.latlng); - element.updateMiddle(); - } - } else if (element instanceof L.Editable.VertexMarker) { - console.log(element); - element.setLatLng(event.latlng); - element.latlngs.forEach((latlng, index) => { - console.log(latlng); - if (latlng.__vertex === element) { - latlng.update(event.latlng); - } - }); - element.editor.feature.setLatLngs(element.latlngs); - element.editor.feature.updateMiddle(); - } - - } - }) - }, - - updateStyle() { - var style = {}; - if (this.options.attributes.isPushBackRoute) { - style.color = 'magenta'; - } - console.log("isPushBackRoute ", this.options.attributes.isPushBackRoute); - this.setStyle(style); - if (!this.bidirectional) { - this.setText(' ► ', { repeat: true, attributes: { fill: 'red', size: 20 } }) - } - } -}); \ No newline at end of file diff --git a/src/renderer/loaders/TaxiwaySegmentExtender.js b/src/renderer/loaders/TaxiwaySegmentExtender.js index 61d0ca3..28b1114 100644 --- a/src/renderer/loaders/TaxiwaySegmentExtender.js +++ b/src/renderer/loaders/TaxiwaySegmentExtender.js @@ -29,8 +29,8 @@ exports.extendTaxiSegment = function (taxiwaySegment) { }; taxiwaySegment.__proto__.extensions = function (editLayer) { this.editLayer = editLayer; - this._latlngs[0].__vertex.glueindex = this.begin; - this._latlngs.slice(-1)[0].__vertex.glueindex = this.end; + this._latlngs[0].glueindex = this.begin; + this._latlngs.slice(-1)[0].glueindex = this.end; if (typeof this.featureLookup[this.begin] === 'undefined') { this.featureLookup[this.begin] = new Array(); } @@ -71,7 +71,6 @@ exports.extendTaxiSegment = function (taxiwaySegment) { , { deep: true //add this if u need to watch object properties change etc. - } ); }); @@ -89,44 +88,50 @@ exports.extendTaxiSegment = function (taxiwaySegment) { if(taxiwaySegment.options.attributes === undefined) { taxiwaySegment.options.attributes = {direction: 'bi-directional'}; } + // Glue to another node if (closest) { - event.latlng.__vertex['glueindex'] = Number(closest.glueindex); + event.latlng['glueindex'] = Number(closest.glueindex); event.latlng.__vertex.setLatLng(closest.latlng); - event.latlng.attributes = {index: event.latlng.__vertex.glueindex, isOnRunway: 0}; - this.editLayer.featureLookup[event.latlng.__vertex.glueindex].push(event.latlng.__vertex); - if (taxiwaySegment.options.attributes.start === undefined) { - taxiwaySegment.options.attributes.start = event.latlng.__vertex['glueindex'] + event.latlng.attributes = {index: event.latlng.glueindex, isOnRunway: 0}; + // Push Vertex to lookup + this.editLayer.featureLookup[event.latlng.glueindex].push(event.latlng.__vertex); + if (taxiwaySegment.options.attributes.begin === undefined) { + taxiwaySegment.options.attributes.begin = event.latlng['glueindex'] } else { - taxiwaySegment.options.attributes.end = event.latlng.__vertex['glueindex'] + taxiwaySegment.options.attributes.end = event.latlng['glueindex'] } + if(taxiwaySegment.getLatLngs().length===1) { + taxiwaySegment.begin = closest.glueindex; + } + taxiwaySegment.end = closest.glueindex; console.log(`Closest : ${closest}`) } else { - event.vertex['glueindex'] = ++this.editLayer.groundnetLayerGroup.maxId; - event.vertex.latlng.attributes = {index: event.vertex.glueindex, isOnRunway: 0}; - this.editLayer.featureLookup[event.vertex.glueindex] = []; - this.editLayer.featureLookup[event.vertex.glueindex].push(event.vertex); - this.editLayer.featureLookup[event.vertex.glueindex].push(taxiwaySegment); - if (taxiwaySegment.options.attributes.start === undefined) { - taxiwaySegment.options.attributes.start = event.vertex['glueindex'] - } else { - taxiwaySegment.options.attributes.end = event.vertex['glueindex'] - } - event.vertex.editor.enable(); + event.vertex.latlng['glueindex'] = ++this.editLayer.groundnetLayerGroup.maxId; + event.vertex.latlng.attributes = {index: event.vertex.latlng.glueindex, isOnRunway: 0}; + this.editLayer.featureLookup[event.vertex.latlng.glueindex] = []; + this.editLayer.featureLookup[event.vertex.latlng.glueindex].push(event.vertex); + this.editLayer.featureLookup[event.vertex.latlng.glueindex].push(taxiwaySegment); + // taxiwaySegment.editor.refresh(); + //taxiwaySegment.editor.reset(); + if (taxiwaySegment.options.attributes.begin === undefined) { + taxiwaySegment.options.attributes.begin = event.vertex.latlng['glueindex'] + taxiwaySegment.begin = event.vertex.latlng.glueindex; + } /*else if (taxiwaySegment.options.attributes.end === undefined || + Number(taxiwaySegment.getLatLngs()[taxiwaySegment.getLatLngs().length-1].glueindex) !== taxiwaySegment.options.attributes.end ) { + taxiwaySegment.options.attributes.end = event.vertex.latlng['glueindex'] + taxiwaySegment.end = event.vertex.latlng.glueindex; + }*/ } + }); this.on('editable:vertex:deleted', event => { - console.log(event) + console.log('editable:vertex:deleted' + event) }); this.on('editable:vertex:rawclick', event => { event.cancel() console.log(event) }); this.on('editable:vertex:clicked', function (event) { - console.log(this.featureLookup[event.vertex.glueindex]); - if (this.edit) { - - } - store.default.dispatch('setNode', event.vertex.latlng.attributes) if(event.vertex._icon!=null) { event.vertex._icon.style['background-color'] = 'red'; @@ -175,15 +180,15 @@ exports.extendTaxiSegment = function (taxiwaySegment) { this.on('editable:vertex:dragstart', function (event) { console.log("Event Target : ", event.target); console.log("Middle Marker : ", event.vertex == event.vertex.middleMarker); - console.log("Middle Marker : ", event.vertex.glueindex == undefined); - if(event.vertex.glueindex == undefined) + console.log("Middle Marker : ", event.vertex.latlng.glueindex == undefined); + if(event.vertex.latlng.glueindex == undefined) return; - dragIndex = event.vertex.glueindex; + dragIndex = event.vertex.latlng.glueindex; }); this.on('editable:vertex:dragend', function (event) { console.log("Dragend : ", event.vertex); if (dragIndex > 0) { - this.featureLookup[dragIndex].forEach(element => { + event.target.featureLookup[dragIndex].forEach(element => { if (element instanceof L.ParkingSpot) { //element.setLatLng(event); console.log(element); @@ -214,7 +219,7 @@ exports.extendTaxiSegment = function (taxiwaySegment) { element.updateMiddleMarker(); element.updateVertexFromDirection(); } - else if (element instanceof L.Polyline) { + else if (element instanceof L.Polyline) { if (Number(element.begin) === Number(dragIndex)) { element.getLatLngs()[0].update(event.latlng); element.setLatLngs(element.getLatLngs()); @@ -227,7 +232,8 @@ exports.extendTaxiSegment = function (taxiwaySegment) { element.updateEndVertex(event.latlng); element.updateMiddle(); } - } else if (element instanceof L.Editable.VertexMarker) { + } else if (element instanceof L.Editable.VertexMarker && + element !== event.vertex) { console.log(element); element.setLatLng(event.latlng); element.latlngs.forEach((latlng, index) => { diff --git a/src/renderer/loaders/groundnet_writer.js b/src/renderer/loaders/groundnet_writer.js index 8177b43..3f4b0e1 100644 --- a/src/renderer/loaders/groundnet_writer.js +++ b/src/renderer/loaders/groundnet_writer.js @@ -3,7 +3,6 @@ const fs = require('fs'); const path = require('path'); const markers = require('./MagneticVertex'); -const TaxiwaySegment = require('./TaxiwaySegment'); const parkingSpot = require('./ParkingSpot.js'); @@ -92,34 +91,34 @@ exports.writeGroundnetXML = function (fDir, icao, featureList) { }); // New segments featureList.filter(o => o instanceof L.Polyline).filter(n => n).forEach(arcElement => { - // element._latlngs.forEach(latlng => { nodes[latlng.__vertex.glueindex] = mapVertexNode(latlng) }); + // element._latlngs.forEach(latlng => { nodes[latlng.glueindex] = mapVertexNode(latlng) }); var startIndex = -1; console.debug(arcElement.options.attributes); var currentArc = arcElement.options.attributes; arcElement._latlngs.forEach( latlng => { - if (latlng.__vertex !== undefined && latlng.__vertex.glueindex !== undefined) { - nodes[latlng.__vertex.glueindex] = mapVertexNode(latlng); + if (latlng !== undefined && latlng.glueindex !== undefined) { + nodes[latlng.glueindex] = mapVertexNode(latlng); if (startIndex >= 0) { if (featureLookup[startIndex] == undefined) { featureLookup[startIndex] = []; } - if (featureLookup[latlng.__vertex.glueindex] == undefined) { - featureLookup[latlng.__vertex.glueindex] = []; + if (featureLookup[latlng.glueindex] == undefined) { + featureLookup[latlng.glueindex] = []; } if( currentArc.direction === 'bi-directional' || currentArc.direction === 'forward' ){ - arc = { '@begin': startIndex, '@end': String(latlng.__vertex.glueindex) }; + arc = { '@begin': startIndex, '@end': String(latlng.glueindex) }; styleArc(currentArc, arc); arcList.push(arc); - featureLookup[startIndex][latlng.__vertex.glueindex] = arc; + featureLookup[startIndex][latlng.glueindex] = arc; } if( currentArc.direction === 'bi-directional' || currentArc.direction === 'backward' ){ - arc = { '@begin': String(latlng.__vertex.glueindex), '@end': startIndex }; + arc = { '@begin': String(latlng.glueindex), '@end': startIndex }; styleArc(currentArc, arc); arcList.push(arc); - featureLookup[latlng.__vertex.glueindex][startIndex] = arc; + featureLookup[latlng.glueindex][startIndex] = arc; } } - startIndex = latlng.__vertex.glueindex; + startIndex = latlng.glueindex; } }); }); @@ -237,7 +236,7 @@ var mapVertexNode = function (l) { if (l instanceof L.LatLng) { console.debug(l); // - return { '@index': String(l.__vertex.glueindex), '@lat': convertLat(l), '@lon': convertLon(l), '@isOnRunway': '0', '@holdPointType': l.attributes['holdPointType'] }; + return { '@index': String(l.glueindex), '@lat': convertLat(l), '@lon': convertLon(l), '@isOnRunway': '0', '@holdPointType': l.attributes['holdPointType'] }; } }