Linking

.gitignore

@@ -9,3 +9,4 @@ npm-debug.log
 npm-debug.log.*
 thumbs.db
 !.gitkeep
+scan*.log

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) {

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 }))

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();
         }

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] = [];

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();
         }

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.

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;
                 },
                     () => { 
+                        // 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);

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);

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 => typeof point.geometry.coordinates !== "undefined" ));
-      .filter(point => point.properties.flights > 0 ));
   },
   async saveAirport(context, airport) {
     await idb.saveAirport(airport);

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
+    Vue.set(state, 'index', parking.index)
-    state.type = 'parking'
+    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
+    Vue.set(state, 'index', node.index)
-    state.type = 'node'
+    Vue.set(state, 'type', 'node')
   },
   SET_EDIT_ARC (state, arc) {
-    state.data = {}
+    Vue.set(state, 'data', {})
-    state.data.arc = arc
+    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
+    Vue.set(state, 'index', arc.index)
-    state.type = 'arc'
+    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)
   }
 }