FGFS-4.1/flightgear-airports-old
3
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Edit Circles

Browse Source
This commit is contained in:
portree_kid
2020-01-04 19:33:53 +01:00
parent d6721faceb
commit 381c631775
12 changed files with 247 additions and 62 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/renderer/components/ArcEdit.vue
+52
View File
@@ -0,0 +1,52 @@
<template>
<div id="panel" width="100%">
<div id="panel" width="100%" v-if="parking">
<h1 class="leaflet-sidebar-header">
Arc Properties
<div class="leaflet-sidebar-close">
<i class="fa fa-caret-left"></i>
</div>
</h1>
<div>
<!--
airlineCodes: 0
heading: 341.34
index: 13
lat: "N59 52.610885"
lon: "W1 17.855144"
name: "Western_Apron_Hanger"
pushBackRoute: 27
radius: 18
type: "gate"
-->
<el-row>
<el-col :span="7"><span class="demo-input-label">Name :</span></el-col>
<el-col :span="15"><el-input placeholder="Please input" v-model="name"></el-input></el-col>
</el-row>
</div>
</div>
</div>
</template>
<script lang="js">
export default {
computed: {
parking: function () {
return this.$store.state.Editable.type === 'arc'
},
name: {
// getter
get: function () {
return this.$store.state.Editable.data.name
},
// setter
set: function (newValue) {
this.$store.commit('SET_EDIT_PARKING_NAME', newValue)
}
},
airports_directory: function () {
return this.$store.state.Settings.settings.airportsDirectory
}
}
}
</script>
src/renderer/components/EditLayer.vue
+13 -17
View File
@@ -14,28 +14,13 @@
name: 'edit-layer',
props: [],
created () {
this.$store.subscribe((mutation, state) => {
if (mutation.type === 'BOUNDS') {
// console.log(this.$parent)
// console.log(this.$store.state.Settings.bounds)
let airportsToLoad = this.$store.state.Airports.airports
.filter(feature => this.visible(feature))
.map(feature => feature.properties.icao)
if (airportsToLoad[0] !== this.editingAirport) {
this.groundnet = readGroundnetXML(this.$store.state.Settings.settings.airportsDirectory, airportsToLoad[0])
this.groundnet.addTo(this.$parent.mapObject)
this.editingAirport = airportsToLoad[0]
}
// console.log(this.groundnet)
}
})
},
mounted () {
console.log(LMap)
console.log(LMarker)
console.log(L)
console.log(LEdit)
},
mounted () {
},
beforeDestroy () {
this.remove()
},
@@ -44,6 +29,17 @@
}
},
methods: {
load (icao) {
this.groundnet = readGroundnetXML(this.$store.state.Settings.settings.airportsDirectory, icao)
this.groundnet.addTo(this.$parent.mapObject)
this.groundnet.eachLayer(l => {
l.enableEdit()
if (typeof l.extensions === 'function') {
l.extensions()
}
l.bringToFront()
})
},
visible (feature) {
let bounds = this.$store.state.Settings.bounds
let coordinates = feature.geometry.coordinates
src/renderer/components/FlightgearMap.vue
+29 -5
View File
@@ -10,8 +10,7 @@
<l-tile-layer :url="url" :attribution="attribution"></l-tile-layer>
<!--<l-marker :lat-lng="marker"></l-marker>-->
<LeafletSidebar></LeafletSidebar>
<EditLayer></EditLayer>
<PavementLayer></PavementLayer>
<PavementLayer ref="pavementLayer"></PavementLayer>
<l-layer-group layerType="overlay" name="airports" ref="airportLayer">
<l-circle
v-for="(item, index) in this.$store.state.Airports.airports"
@@ -22,6 +21,7 @@
@click="onClick(item)"
></l-circle>
</l-layer-group>
<EditLayer ref="editLayer"></EditLayer>
</l-map>
</template>
@@ -47,6 +47,21 @@
props: [],
mounted () {
this.$store.dispatch('getAirports')
this.$store.subscribe((mutation, state) => {
if (mutation.type === 'BOUNDS') {
// console.log(this.$parent)
// console.log(this.$store.state.Settings.bounds)
let airportsToLoad = this.$store.state.Airports.airports
.filter(feature => this.visible(feature))
.map(feature => feature.properties.icao)
if (airportsToLoad[0] !== this.editingAirport) {
this.$refs.editLayer.load(airportsToLoad[0])
this.$refs.pavementLayer.load(airportsToLoad[0])
this.editingAirport = airportsToLoad[0]
}
// console.log(this.groundnet)
}
})
},
data () {
return {
@@ -58,19 +73,28 @@
}
},
methods: {
visible (feature) {
let bounds = this.$store.state.Settings.bounds
let coordinates = feature.geometry.coordinates
let ret = bounds.getNorthEast().lat > Number(coordinates[1]) &&
bounds.getNorthEast().lng > Number(coordinates[0])
let ret2 = bounds.getSouthWest().lat < Number(coordinates[1]) &&
bounds.getSouthWest().lng < Number(coordinates[0])
return ret && ret2
},
onClick (item) {
console.log(item)
this.$store.commit('SET_EDIT_AIRPORT', item)
},
zoomUpdated (zoom) {
this.$store.commit('ZOOM', zoom)
this.$store.dispatch('setZoom', zoom)
console.log(this.$refs.airportLayer.setVisible(zoom < 12))
},
centerUpdated (center) {
this.$store.commit('CENTER', center)
this.$store.dispatch('setCenter', center)
},
boundsUpdated (bounds) {
this.$store.commit('BOUNDS', bounds)
this.$store.dispatch('setBounds', bounds)
}
},
computed: {
src/renderer/components/GroundnetEdit.vue
+53
View File
@@ -0,0 +1,53 @@
<template>
<div id="panel" width="100%">
<div id="panel" width="100%" v-if="parking">
<h1 class="leaflet-sidebar-header">
Parking
<div class="leaflet-sidebar-close">
<i class="fa fa-caret-left"></i>
</div>
</h1>
<div>
<!--
airlineCodes: 0
heading: 341.34
index: 13
lat: "N59 52.610885"
lon: "W1 17.855144"
name: "Western_Apron_Hanger"
pushBackRoute: 27
radius: 18
type: "gate"
-->
<el-row>
<el-col :span="7"><span class="demo-input-label">Name :</span></el-col>
<el-col :span="15"><el-input placeholder="Please input" v-model="name"></el-input></el-col>
</el-row>
</div>
</div>
</div>
</template>
<script lang="js">
export default {
computed: {
parking: function () {
return this.$store.state.Editable.type === 'parking'
},
name: {
// getter
get: function () {
return this.$store.state.Editable.data.name
},
// setter
set: function (newValue) {
this.$store.commit('SET_EDIT_PARKING_NAME', newValue)
}
},
airports_directory: function () {
return this.$store.state.Settings.settings.airportsDirectory
}
}
}
</script>
src/renderer/components/LeafletSidebar.vue
+5 -1
View File
@@ -24,6 +24,8 @@
</div>
<div class="leaflet-sidebar-pane" id="airports">
<AirportEdit></AirportEdit>
<GroundnetEdit></GroundnetEdit>
<ArcEdit></ArcEdit>
</div>
<div class="leaflet-sidebar-pane" id="scan">
<RunScan></RunScan>
@@ -41,13 +43,15 @@
import {} from 'leaflet-sidebar-v2'
import L from 'leaflet'
import AirportEdit from './AirportEdit'
import GroundnetEdit from './GroundnetEdit'
import ArcEdit from './ArcEdit'
import SettingsPanel from './SettingsPanel'
import RunScan from './RunScan'
import FileSelect from './FileSelect'
export default {
name: 'leaflet-sidebar',
components: { AirportEdit, SettingsPanel, RunScan, FileSelect },
components: { AirportEdit, ArcEdit, GroundnetEdit, SettingsPanel, RunScan, FileSelect },
props: [],
mounted () {
this.add()
src/renderer/components/PavementLayer.vue
+7 -14
View File
@@ -14,20 +14,6 @@
name: 'edit-layer',
props: [],
created () {
this.$store.subscribe((mutation, state) => {
if (mutation.type === 'BOUNDS') {
// console.log(this.$parent)
// console.log(this.$store.state.Settings.bounds)
let airportsToLoad = this.$store.state.Airports.airports
.filter(feature => this.visible(feature))
.map(feature => feature.properties.icao)
if (airportsToLoad[0] !== this.editingAirport) {
readPavement(this.$store.state.Settings.settings.flightgearDirectory_apt, airportsToLoad[0], this.read)
this.editingAirport = airportsToLoad[0]
}
// console.log(this.groundnet)
}
})
},
mounted () {
console.log(LMap)
@@ -43,11 +29,18 @@
}
},
methods: {
load (icao) {
// Callback for add
readPavement(this.$store.state.Settings.settings.flightgearDirectory_apt, icao, this.read)
},
read (layer) {
this.groundnet = layer
if (this.groundnet) {
this.groundnet.addTo(this.$parent.mapObject)
}
this.groundnet.eachLayer(l => {
l.bringToBack()
})
},
visible (feature) {
let bounds = this.$store.state.Settings.bounds
src/renderer/loaders/ParkingSpot.js
+23 -18
View File
@@ -5,22 +5,26 @@ const turf = require('@turf/turf');
const util = require('util');
var $ = require('jquery');
L.ParkingSpot = L.Circle.extend({
id: String,
attributes: Object,
options: {
id: 'Custom data!',
attributes: {}
},
createDirection: function () {
if (this.direction === undefined ) {
var start = this._latlng;
var options = { units: 'kilometers' };
var end = turf.destination([start.lat, start.lng], this.attributes.radius / 1000, this.attributes.heading - 180, options);
var end = turf.destination([start.lat, start.lng], this.options.attributes.radius / 1000, this.options.attributes.heading - 180, options);
// Resize, since leaflet is wrong
var rad2 = start.distanceTo(end.geometry.coordinates);
this.setRadius(rad2);
this.editor._resizeLatLng.__vertex.setLatLng(end.geometry.coordinates);
// console.log(util.inspect(this.editor));
if(this.editor._resizeLatLng.__vertex !== undefined){
this.editor._resizeLatLng.__vertex.setLatLng(end.geometry.coordinates);
}
this.direction = L.polyline([start, end.geometry.coordinates]);
this.direction.addTo(map);
this.direction.addTo(this.editor.editLayer);
this.on('editable:drawing:move', function (event) {
@@ -33,7 +37,7 @@ L.ParkingSpot = L.Circle.extend({
if (this.editEnabled()) {
var start = this._latlng;
var options = { units: 'kilometers' };
var end = turf.destination([start.lat, start.lng], this.attributes.radius / 1000, this.attributes.heading - 180, options);
var end = turf.destination([start.lat, start.lng], this.options.attributes.radius / 1000, this.options.attributes.heading - 180, options);
// Resize, since leaflet is wrong
var rad2 = start.distanceTo(end.geometry.coordinates);
this.setRadius(rad2);
@@ -48,10 +52,15 @@ L.ParkingSpot = L.Circle.extend({
var start = this._latlng;
var end = this.editor._resizeLatLng.__vertex.getLatLng();
var heading = turf.bearing([start.lat, start.lng], [end.lat, end.lng]);
this.attributes.heading = heading + 180;
this.options.attributes.heading = heading + 180;
this.direction.setLatLngs([start, end]);
}
},
extensions: function () {
this.createDirection();
},
_getLatRadius: function () {
return this._mRadius;
},
@@ -59,6 +68,7 @@ L.ParkingSpot = L.Circle.extend({
_getLngRadius: function () {
return this._mRadius;
},
});
var parkingSpot = function (n, layerGroup) {
@@ -71,6 +81,9 @@ var parkingSpot = function (n, layerGroup) {
circle.on('add', function (event) {
console.log(event);
});
circle.on('editable:enable', function (event) {
// event.target.createDirection();
});
circle.id = n.attr('index');
/*
<Parking index="2"
@@ -90,19 +103,11 @@ airlineCodes="VIR,KAL,DAL,KLM" />
console.log( key + "\t" + value);
if(isNaN(value))
circle.attributes[ key ] = value;
circle.options.attributes[ key ] = value;
else
circle.attributes[ key ] = Number( value);
circle.options.attributes[ key ] = Number( value);
});
circle.addTo(layerGroup);
// circle.enableEdit();
circle.on('dblclick', function (event) { L.DomEvent.stop(); circle.toggleEdit(); });
circle.on('click', function (event) {
console.log("Click : " + event.target);
});
// circle.createDirection();
return circle;
}
src/renderer/loaders/groundnet_loader.js
+22 -6
View File
@@ -8,9 +8,11 @@ const markers = require('./markers');
const parkingSpot = require('./ParkingSpot.js');
const store = require('../store');
const util = require('util');
console.log(convert.formats);
var $ = require('jquery');
var featureLookup = {};
@@ -58,8 +60,12 @@ exports.readGroundnetXML = function (fDir, icao) {
if(event.target.editor._resizeLatLng.__vertex._icon !== event.sourceTarget._element){
follow(event.target.id, event);
}
});
circle.on('click', function (event) {
console.log("Click : " + event.target);
store.default.dispatch('setParking', event.target.options.attributes);
});
nodesLookup[n.attr('index')] = n;
featureLookup[n.attr('index')] = new Array();
featureLookup[n.attr('index')].push(circle);
@@ -103,14 +109,25 @@ exports.readGroundnetXML = function (fDir, icao) {
if (!bidirectional) {
var beginlatlon = convert(begin.attr('lat') + " " + begin.attr('lon'));
var endlatlon = convert(end.attr('lat') + " " + end.attr('lon'));
const polyline = new L.TaxiwaySegment([[beginlatlon.decimalLatitude, beginlatlon.decimalLongitude], [endlatlon.decimalLatitude, endlatlon.decimalLongitude]], { radius: n.attr('radius') }).addTo(layerGroup);
const polyline = new L.TaxiwaySegment([[beginlatlon.decimalLatitude, beginlatlon.decimalLongitude], [endlatlon.decimalLatitude, endlatlon.decimalLongitude]], {}).addTo(layerGroup);
$.each( n.attrs, function( key, value ) {
console.log( key + "\t" + value);
if(isNaN(value))
polyline.options.attributes[ key ] = value;
else
polyline.options.attributes[ key ] = Number( value);
});
polyline.updateStyle();
polyline.begin = begin.attr('index');
polyline.end = end.attr('index');
// polyline.enableEdit();
polyline.on('dblclick', function (event) { L.DomEvent.stop; polyline.toggleEdit; });
// polyline.on('dblclick', function (event) { L.DomEvent.stop; polyline.toggleEdit; });
polyline.on('click', function (event) {
console.log(event);
console.log("Click : " + event.target);
store.default.dispatch('setArc', event.target.options.attributes);
});
polyline.on('editable:drawing:move', function (event) {
console.log(event.target);
@@ -170,7 +187,6 @@ exports.readGroundnetXML = function (fDir, icao) {
featureLookup[polyline.end].push(polyline);
}
}
}).sort();
src/renderer/loaders/markers.js
+13
View File
@@ -2,6 +2,11 @@
var L = require('leaflet');
L.TaxiwaySegment = L.Polyline.extend({
options: {
id: 'Custom data!',
attributes: {}
},
begin: String,
end: String,
bidirectional: Boolean,
@@ -19,6 +24,14 @@ L.TaxiwaySegment = L.Polyline.extend({
element.__vertex.middleMarker.updateLatLng();
}
});
},
updateStyle() {
var style = {};
if (this.options.attributes.isPushBackRoute) {
style.color = 'magenta';
}
this.setStyle(style);
}
});
src/renderer/loaders/pavement_loader.js
+2 -1
View File
@@ -40,8 +40,9 @@ module.exports.isScanning = false;
var scanMethods = {
1: (line, icao) => {
console.log('Airport:', line);
// console.log('Airport:', line);
if (line[4]===icao){
console.log('Airport:', line);
module.exports.isScanning = true;
} else {
module.exports.isScanning = false;
src/renderer/store/modules/Editable.js
+19
View File
@@ -4,17 +4,36 @@ const state = {
}
const SET_EDIT_AIRPORT = 'SET_EDIT_AIRPORT'
const SET_EDIT_PARKING = 'SET_EDIT_PARKING'
const SET_EDIT_ARC = 'SET_EDIT_ARC'
const mutations = {
SET_EDIT_AIRPORT (state, airport) {
state.data = airport
state.type = 'airport'
},
SET_EDIT_PARKING (state, parking) {
state.data = parking
state.type = 'parking'
},
SET_EDIT_ARC (state, arc) {
state.data = arc
state.type = 'arc'
},
'SET_EDIT_PARKING_NAME' (state, parkingName) {
state.data.name = parkingName
}
}
const actions = {
async setAirport (context, airport) {
context.commit(SET_EDIT_AIRPORT, airport)
},
async setParking (context, parking) {
context.commit(SET_EDIT_PARKING, parking)
},
async setArc (context, arc) {
context.commit(SET_EDIT_ARC, arc)
}
}
src/renderer/store/modules/Settings.js
+9
View File
@@ -29,6 +29,15 @@ const mutations = {
const plugins = []
const actions = {
async setZoom (context, zoom) {
context.commit('ZOOM', zoom)
},
async setCenter (context, center) {
context.commit('CENTER', center)
},
async setBounds (context, bounds) {
context.commit('BOUNDS', bounds)
}
}
export default {