From 00aac46a274fea95faa5d6ed69475b0f311a59c0 Mon Sep 17 00:00:00 2001
From: portree_kid <keith.paterson@gmx.de>
Date: Thu, 6 Feb 2020 20:06:38 +0100
Subject: [PATCH] Holdpoint nodes

---
 src/renderer/components/EditBar.vue           |  2 +-
 src/renderer/components/EditLayer.vue         | 25 +++++-
 src/renderer/components/LeafletSidebar.vue    |  2 +-
 src/renderer/components/NodeEdit.vue          |  2 +-
 src/renderer/components/PavementLayer.vue     |  3 -
 src/renderer/loaders/HoldNode.js              | 88 +++++++++++++++++++
 src/renderer/loaders/ParkingSpot.js           |  2 +-
 src/renderer/loaders/RunwayNode.js            |  5 +-
 src/renderer/loaders/TaxiwaySegment.js        |  3 +
 .../loaders/TaxiwaySegmentExtender.js         |  3 +
 src/renderer/loaders/groundnet_loader.js      |  8 ++
 src/renderer/loaders/groundnet_writer.js      |  7 +-
 12 files changed, 136 insertions(+), 14 deletions(-)
 create mode 100644 src/renderer/loaders/HoldNode.js

diff --git a/src/renderer/components/EditBar.vue b/src/renderer/components/EditBar.vue
index 64a5536..1e4a76e 100644
--- a/src/renderer/components/EditBar.vue
+++ b/src/renderer/components/EditBar.vue
@@ -1,5 +1,5 @@
 <template>
-  <div id="BLABLA">
+  <div id="EditBar">
     <EditButton icon="fas fa-edit" v-on:click="edit" :show="!editing" tooltip="Edit"></EditButton>
     <EditButton icon="fas fa-undo" v-on:click="centerDialogVisible = true" :show="editing" tooltip="Undo"></EditButton>
     <el-dialog title="Reload" :visible.sync="centerDialogVisible" width="30%" center>
diff --git a/src/renderer/components/EditLayer.vue b/src/renderer/components/EditLayer.vue
index fcbc344..c606fb5 100644
--- a/src/renderer/components/EditLayer.vue
+++ b/src/renderer/components/EditLayer.vue
@@ -188,9 +188,12 @@
         })
       },
       editedNode() {
-        var isOnRunway = this.$store.state.Editable.data.node.isOnRunway;
+        var isOnRunway = Number(this.$store.state.Editable.data.node.isOnRunway);
+        var isHoldPoint = this.$store.state.Editable.data.node.holdPointType !== 'none' &&
+                          this.$store.state.Editable.data.node.holdPointType !== undefined;
         var nIndex = this.$store.state.Editable.index; 
         var hasRunwayNode = false;
+        var hasHoldPointNode = false;
         var latlng;
         this.featureLookup[nIndex].forEach((element,index) => {
           if (element instanceof L.RunwayNode) {
@@ -200,6 +203,13 @@
               this.featureLookup[nIndex].splice(index,1);              
             }
             hasRunwayNode = true;
+          } else if (element instanceof L.HoldNode) {
+            if (!isHoldPoint) {
+              // We shouldn't have a RunwayNode
+              element.removeFrom(layerGroup);
+              this.featureLookup[nIndex].splice(index,1);              
+            }
+            hasHoldPointNode = true;
           }
           else if (element instanceof L.ParkingSpot) {
           }
@@ -225,6 +235,19 @@
           this.featureLookup[nIndex].push(node);
           node.addListeners();
         }
+        if (!hasHoldPointNode && isHoldPoint) {
+          const icon = new L.DivIcon({
+              className: 'custom-div-icon',
+              html: "<div style='background-color:#4838cc;' class='marker-pin'></div><i class='fas fa-hand-paper'></i>",
+              iconSize: [30, 42],
+              iconAnchor: [15, 42]
+          });
+          const node = new L.HoldNode(latlng, { icon: icon });
+          node.glueindex = nIndex;
+          node.addTo(layerGroup);
+          this.featureLookup[nIndex].push(node);
+          node.addListeners();
+        }
       },
       closestLayerSnap (eventLatlng, snap) {
         var layers = []
diff --git a/src/renderer/components/LeafletSidebar.vue b/src/renderer/components/LeafletSidebar.vue
index e70e080..ad73b28 100644
--- a/src/renderer/components/LeafletSidebar.vue
+++ b/src/renderer/components/LeafletSidebar.vue
@@ -17,7 +17,7 @@
     <div class="leaflet-sidebar-content">
         <div class="leaflet-sidebar-pane" id="home">
             <h1 class="leaflet-sidebar-header">
-                sidebar-v2
+                Help
                 <div class="leaflet-sidebar-close"><i class="fa fa-caret-left"></i></div>
             </h1>
             <p>A responsive sidebar for mapping libraries</p>
diff --git a/src/renderer/components/NodeEdit.vue b/src/renderer/components/NodeEdit.vue
index 4bc7a82..faf8c13 100644
--- a/src/renderer/components/NodeEdit.vue
+++ b/src/renderer/components/NodeEdit.vue
@@ -47,7 +47,7 @@
     */
     computed: {
       options: function () {
-        return [{value: 'node', label: 'node'}, {value: 'PushBack', label: 'PushBack'}, {value: 'normal', label: 'normal'}, {value: 'CAT II/III', label: 'CAT II/III'}]
+        return [{value: 'none', label: 'none'}, {value: 'PushBack', label: 'PushBack'}, {value: 'normal', label: 'normal'}, {value: 'CAT II/III', label: 'CAT II/III'}]
       },
       node: function () {
         return this.$store.state.Editable.type === 'node'
diff --git a/src/renderer/components/PavementLayer.vue b/src/renderer/components/PavementLayer.vue
index cc3f681..be300da 100644
--- a/src/renderer/components/PavementLayer.vue
+++ b/src/renderer/components/PavementLayer.vue
@@ -77,7 +77,4 @@
 </script>
 
 <style scoped lang="scss">
-  .edit-layer {
-
-  }
 </style>
diff --git a/src/renderer/loaders/HoldNode.js b/src/renderer/loaders/HoldNode.js
new file mode 100644
index 0000000..15b145b
--- /dev/null
+++ b/src/renderer/loaders/HoldNode.js
@@ -0,0 +1,88 @@
+/* eslint-disable */
+const convert = require('geo-coordinates-parser');
+const leaflet = require('leaflet');
+const turf = require('@turf/turf');
+const util = require('util');
+const store = require('../store');
+
+var $ = require('jquery');
+L.HoldNode = L.Marker.extend({
+    addListeners: function () {
+        this.on('editable:drawing:move', function (event) {
+            console.log("Move : ", event);
+            // Is it the edit vertex (Middle) moving?
+            this.follow(event.target.glueindex, event);
+        });
+    },
+    extensions: function () {
+        if (typeof this.featureLookup[this.glueindex] === 'undefined') {
+            this.featureLookup[this.glueindex] = new Array();
+        }
+        this.featureLookup[this.glueindex].push(this);
+    },
+    /**
+     * 
+     */
+
+    follow(dragIndex, event) {
+        this.featureLookup[dragIndex].forEach(element => {
+            if (element !== event.target) {
+                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();
+                }    
+            }
+        })
+    }
+});
+
+var holdNode = function (n, layerGroup) {
+    //console.log(n.attr('lat') + " " + n.attr('lon'));
+    var latlon = convert(n.attr('lat') + " " + n.attr('lon'));    
+    const icon = new L.DivIcon({
+        className: 'custom-div-icon',
+        html: "<div style='background-color:#4838cc;' class='marker-pin'></div><i class='fas fa-hand-paper'></i>",
+        iconSize: [30, 42],
+        iconAnchor: [15, 42]
+    });
+    const node = new L.HoldNode([latlon.decimalLatitude, latlon.decimalLongitude], { icon: icon });
+    node.glueindex = n.attr('index');
+    node.holdPointType = n.attr('holdPointType');
+    node.addTo(layerGroup);
+    node.addListeners();
+    return node;
+}
+
+module.exports = holdNode;
\ No newline at end of file
diff --git a/src/renderer/loaders/ParkingSpot.js b/src/renderer/loaders/ParkingSpot.js
index f817ba6..cec7d09 100644
--- a/src/renderer/loaders/ParkingSpot.js
+++ b/src/renderer/loaders/ParkingSpot.js
@@ -134,7 +134,7 @@ L.ParkingSpot = L.Circle.extend({
       follow (dragIndex, event) {
         this.featureLookup[dragIndex].forEach(element => {
             if(element !== event.target){
-                if (element instanceof L.RunwayNode) {
+                if (element instanceof L.HoldNode) {
                     element.setLatLng(event.latlng);
                 }
                 else if (element instanceof L.ParkingSpot) {
diff --git a/src/renderer/loaders/RunwayNode.js b/src/renderer/loaders/RunwayNode.js
index aea7ca4..f69b570 100644
--- a/src/renderer/loaders/RunwayNode.js
+++ b/src/renderer/loaders/RunwayNode.js
@@ -27,7 +27,7 @@ L.RunwayNode = L.Marker.extend({
     follow(dragIndex, event) {
         this.featureLookup[dragIndex].forEach(element => {
             if (element !== event.target) {
-                if (element instanceof L.RunwayNode) {
+                if (element instanceof L.HoldNode) {
                     element.setLatLng(event.latlng);
                 }
                 else if (element instanceof L.ParkingSpot) {
@@ -69,10 +69,7 @@ L.RunwayNode = L.Marker.extend({
 });
 
 var runwayNode = function (n, layerGroup) {
-    //console.log(n.attr('lat') + " " + n.attr('lon'));
     var latlon = convert(n.attr('lat') + " " + n.attr('lon'));
-    //console.log(latlon.decimalLatitude);
-    //console.log(convert(n.attr('lat') + " " + n.attr('lon')).decimalLongitude);
     const icon = new L.DivIcon({
         className: 'custom-div-icon',
         html: "<div style='background-color:#4838cc;' class='marker-pin'></div><i class='fas fa-plane-departure'></i>",
diff --git a/src/renderer/loaders/TaxiwaySegment.js b/src/renderer/loaders/TaxiwaySegment.js
index ccd5cce..a0ad7a0 100644
--- a/src/renderer/loaders/TaxiwaySegment.js
+++ b/src/renderer/loaders/TaxiwaySegment.js
@@ -88,6 +88,9 @@ L.TaxiwaySegment = L.Polyline.extend({
                 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);
diff --git a/src/renderer/loaders/TaxiwaySegmentExtender.js b/src/renderer/loaders/TaxiwaySegmentExtender.js
index 696e4f7..2f2045d 100644
--- a/src/renderer/loaders/TaxiwaySegmentExtender.js
+++ b/src/renderer/loaders/TaxiwaySegmentExtender.js
@@ -85,6 +85,9 @@ exports.extendTaxiSegment = function (taxiwaySegment) {
                 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);
diff --git a/src/renderer/loaders/groundnet_loader.js b/src/renderer/loaders/groundnet_loader.js
index 5e37b5d..605fe05 100644
--- a/src/renderer/loaders/groundnet_loader.js
+++ b/src/renderer/loaders/groundnet_loader.js
@@ -9,6 +9,7 @@ const TaxiwaySegment = require('./TaxiwaySegment');
 
 const parkingSpot = require('./ParkingSpot.js');
 const runwayNode = require('./RunwayNode.js');
+const holdNode = require('./HoldNode.js');
 
 const store = require('../store');
 
@@ -81,6 +82,13 @@ exports.readGroundnetXML = function (fDir, icao, force) {
                     }
                     featureLookup[rNode.glueindex].push(rNode);
                 }
+                if (n.attr('holdPointType') !== 'none' && n.attr('holdPointType') !== null) {
+                    var hNode = holdNode(n, layerGroup);
+                    if (featureLookup[hNode.glueindex] === undefined) {
+                        featureLookup[hNode.glueindex] = [];
+                    }
+                    featureLookup[hNode.glueindex].push(hNode);
+                }
 
                 //store.default.dispatch('setNode', n)
             }).sort();
diff --git a/src/renderer/loaders/groundnet_writer.js b/src/renderer/loaders/groundnet_writer.js
index 54c92ba..2260321 100644
--- a/src/renderer/loaders/groundnet_writer.js
+++ b/src/renderer/loaders/groundnet_writer.js
@@ -103,14 +103,17 @@ var mapParkings = function (o) {
         var lat = convertLat(o.getLatLng());
         var lon = convertLon(o.getLatLng());
         // <Parking index="0" type="gate" name="GA_Parking" lat="S9 25.739923" lon="E160 2.927602" heading="67"  radius="44" airlineCodes="" />
-        return { '@index': String(o['id']), '@type': o.options.attributes.type, '@name': o.options.attributes.name, '@lat': lat, '@lon': lon, '@heading': Number(o.options.attributes.heading), '@radius': String(o.options.radius) };
+        return { '@index': String(o['id']), '@type': o.options.attributes.type, '@name': o.options.attributes.name, '@lat': lat, '@lon': lon, '@heading': Number(o.options.attributes.heading), '@radius': String(o.options.attributes.radius) };
     }
 }
 
 var mapRunwayNodes = function (o) {
     console.log(o);
     if (o instanceof L.RunwayNode) {
-        return { '@index': String(o['glueindex']), '@lat': convertLat(o._latlng), '@lon': convertLon(o._latlng), '@isOnRunway': '1' };
+        return { '@index': String(o['glueindex']), '@lat': convertLat(o._latlng), '@lon': convertLon(o._latlng), '@isOnRunway': '1', '@holdPointType': 'none' };
+    }
+    if (o instanceof L.HoldNode) {
+        return { '@index': String(o['glueindex']), '@lat': convertLat(o._latlng), '@lon': convertLon(o._latlng), '@isOnRunway': '0', '@holdPointType': o['holdPointType'] };
     }
 }