Thresholds

src/renderer/components/FlightgearMap.vue

@@ -17,6 +17,7 @@
     <LeafletSidebar></LeafletSidebar>
     <EditBar></EditBar>
     <PavementLayer ref="pavementLayer"></PavementLayer>
+    <ThresholdLayer ref="thresholdLayer"></ThresholdLayer>
     <l-layer-group layerType="overlay" name="airports" ref="airportLayer">
       <l-circle
         v-for="(item, index) in this.$store.state.Airports.airports"
@@ -39,6 +40,7 @@
   import EditBar from './EditBar'
   import EditLayer from './EditLayer'
   import PavementLayer from './PavementLayer'
+  import ThresholdLayer from './ThresholdLayer'
   import L from 'leaflet'
 
   // https://github.com/KoRiGaN/Vue2Leaflet/issues/103
@@ -51,7 +53,7 @@
   })
   export default {
     name: 'flightgear-map',
-    components: { LMap, LTileLayer, LMarker, LCircle, LeafletSidebar, EditBar, EditLayer, PavementLayer, LLayerGroup, LControl },
+    components: { LMap, LTileLayer, LMarker, LCircle, LeafletSidebar, EditBar, EditLayer, PavementLayer, LLayerGroup, LControl, ThresholdLayer },
     props: [],
     mounted () {
       this.$store.dispatch('getAirports')
@@ -65,6 +67,7 @@
           if (airportsToLoad.length > 0 && airportsToLoad[0] !== this.editingAirport && this.zoom > 12) {
             this.$refs.editLayer.load(airportsToLoad[0])
             this.$refs.pavementLayer.load(airportsToLoad[0])
+            this.$refs.thresholdLayer.load(airportsToLoad[0])
             this.editingAirport = airportsToLoad[0]
           }
           this.$refs.editLayer.setVisible(this.zoom >= 12)

src/renderer/components/ThresholdLayer.vue

@@ -0,0 +1,72 @@
+<template>
+  <section class="edit-layer">
+    <h1>edit-layer Component</h1>
+  </section>
+</template>
+
+<script lang="js">
+  import { LMap, LMarker } from 'vue2-leaflet'
+  import L from 'leaflet'
+  import LEdit from 'leaflet-editable/src/Leaflet.Editable.js'
+  import {readThresholdXML} from '../loaders/threshold_loader'
+
+  export default {
+    name: 'edit-layer',
+    props: [],
+    created () {
+    },
+    mounted () {
+      console.log(LMap)
+      console.log(LMarker)
+      console.log(L)
+      console.log(LEdit)
+    },
+    beforeDestroy () {
+      this.remove()
+    },
+    data () {
+      return {
+      }
+    },
+    methods: {
+      load (icao) {
+        // Callback for add
+        this.layerGroup = readThresholdXML(this.$store.state.Settings.settings.airportsDirectory, icao, this.read)
+        this.layerGroup.addTo(this.$parent.mapObject)
+        this.icao = icao
+      },
+      deferredMountedTo (parent) {
+      },
+      remove () {
+        if (this.layerGroup) {
+          this.$parent.removeLayer(this.layerGroup)
+        }
+      },
+      add () {
+        if (this.$parent._isMounted) {
+          this.deferredMountedTo(this.$parent.mapObject)
+        }
+      },
+      setVisible (visible) {
+        if (this.layerGroup !== undefined) {
+          if (visible) {
+            this.layerGroup.addTo(this.$parent.mapObject)
+          } else {
+            this.layerGroup.removeFrom(this.$parent.mapObject)
+          }
+        }
+      }
+    },
+    computed: {
+      edit: function () {
+        console.log('Zoom : ' + this.$store.state.Settings.zoom)
+        if (this.$store.state.Settings.zoom > 12) {
+          console.log()
+        }
+      }
+    }
+}
+</script>
+
+<style scoped lang="scss">
+</style>