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

MultiLine Edit

Browse Source
This commit is contained in:
portree_kid
2020-11-18 20:26:40 +01:00
parent e8b0c3c923
commit 60903eb3e5
7 changed files with 441 additions and 160 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/renderer/components/ArcEditMulti.vue
+106
View File
@@ -0,0 +1,106 @@
<!--
Copyright 2020 Keith Paterson
This file is part of FG Airports.
FG Airports is free software: you can redistribute it and/or modify it under the terms of the GNU General Public License as published by the Free Software Foundation, either version 3 of the License, or (at your option) any later version.
FG Airports is distributed in the hope that it will be useful, but WITHOUT ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU General Public License for more details.
You should have received a copy of the GNU General Public License along with FG Airports. If not, see http://www.gnu.org/licenses/.
-->
<template>
<div width="100%" v-if="multiarc">
<!--
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>
<el-row>
<el-col :span="7">
<span class="demo-input-label">Pushback :</span>
</el-col>
<el-col :span="15">
<el-switch v-model="isPushback"></el-switch>
</el-col>
</el-row>
<el-row>
<el-col :span="7">
<span class="demo-input-label">Direction :</span>
</el-col>
<el-col :span="15">
<el-select v-model="direction" placeholder="Select">
<el-option
v-for="type in options"
:key="type.value"
:label="type.label"
:value="type.value"
></el-option>
</el-select>
</el-col>
</el-row>
</div>
</template>
<script lang="js">
export default {
computed: {
multiarc: function () {
return this.$store.state.Editable.type === 'multiarc'
},
// ga (general aviation), cargo (cargo), gate (commercial passenger traffic),
// mil-fighter (military fighter), mil-cargo (military transport)
options: function () {
return [{value: 'bi-directional', label: 'bi-directional'},
{value: 'forward', label: 'forward'},
{value: 'backward', label: 'backward'}
]
},
name: {
// getter
get: function () {
return this.$store.state.Editable.data.multiarc.name
},
// setter
set: function (newValue) {
this.$store.commit('SET_EDIT_ARC_NAME', newValue)
}
},
isPushback: {
// getter
get: function () {
return this.$store.state.Editable.data.multiarc.isPushBackRoute === '1' ||
this.$store.state.Editable.data.multiarc.isPushBackRoute === 1
},
// setter
set: function (newValue) {
this.$store.commit('SET_EDIT_PUSHBACK', newValue ? '1' : '0')
}
},
direction: {
// getter
get: function () {
return this.$store.state.Editable.data.multiarc.direction
},
// setter
set: function (newValue) {
this.$store.commit('SET_EDIT_DIRECTION', newValue)
}
}
}
}
</script>
src/renderer/components/EditLayer.vue
+34 -2
View File
@@ -68,6 +68,16 @@ You should have received a copy of the GNU General Public License along with FG
deep: true //add this if u need to watch object properties change etc.
}
);
this.$store.watch(
function (state) {
return state.Editable.data.multiarc;
},
() => { this.editedMultiArc() }
,
{
deep: true //add this if u need to watch object properties change etc.
}
);
this.$store.watch(
function (state) {
return state.Editable.data.parking;
@@ -658,6 +668,7 @@ You should have received a copy of the GNU General Public License along with FG
!this.editing) {
return;
}
console.debug("Edit Type : " + this.$store.state.type);
var arc = this.groundnetLayerGroup.getLayer(this.$store.state.Editable.index);
if (arc && arc instanceof L.Polyline) {
console.log('Edited Arc : ' + this.$store.state.Editable.index);
@@ -665,6 +676,27 @@ You should have received a copy of the GNU General Public License along with FG
arc.updateStyle();
}
},
editedMultiArc() {
if (!this.groundnetLayerGroup ||
this.$store.state.Editable.data.multiarc === undefined ||
this.$store.state.Editable.data.multiarc.ids === undefined ||
this.featureLookup===undefined ||
!this.editing) {
return;
}
console.debug("Edit Type : " + this.$store.state.Editable.data.multiarc.ids);
this.$store.state.Editable.data.multiarc.ids.forEach(id => {
console.debug(id);
var arc = this.groundnetLayerGroup.getLayer(id);
if (arc && arc instanceof L.Polyline) {
console.log('Edited Arc : ' + this.$store.state.Editable.index);
arc.options.attributes.direction = this.$store.state.Editable.data.multiarc.direction
arc.options.attributes.name = this.$store.state.Editable.data.multiarc.name
arc.options.attributes.isPushBackRoute = this.$store.state.Editable.data.multiarc.isPushBackRoute
arc.updateStyle();
}
});
},
//Update Node
editedNode() {
if (this.$store.state.Editable.index === undefined ||
@@ -824,11 +856,11 @@ You should have received a copy of the GNU General Public License along with FG
this.$parent.mapObject.on('click', this.addParking)
},
removeLayerClick (event) {
console.log(event)
console.debug(event)
this.groundnetLayerGroup.removeLayer(event.target)
},
addParking (event) {
console.log(event.latlng)
console.debug(event.latlng)
if (event.latlng === undefined) {
return
}
src/renderer/components/FlightgearMap.vue
+2 -2
View File
@@ -85,7 +85,7 @@ You should have received a copy of the GNU General Public License along with FG
},
(newValue, oldValue) => {
// debugger
console.log('setIcaoLoading ' + oldValue + ' => ' + newValue + ' ' + this.groundnetLoaded + ' ' + this.pavementLoaded + ' ' + this.loadingInstance)
console.log('setIcaoLoading ' + oldValue + ' => ' + newValue + ' groundnetLoaded ' + this.groundnetLoaded + ' pavementLoaded ' + this.pavementLoaded + ' ' + this.loadingInstance)
if (newValue !== oldValue && newValue !== '') {
this.groundnetLoaded = newValue
if ((this.loadingInstance === null || this.loadingInstance === undefined)) {
@@ -105,7 +105,7 @@ You should have received a copy of the GNU General Public License along with FG
},
(newValue, oldValue) => {
// debugger
console.log('groundnetLoaded ' + oldValue + ' => ' + newValue + ' ' + this.groundnetLoaded + ' ' + this.pavementLoaded + ' ' + this.loadingInstance)
console.log('groundnetLoaded ' + oldValue + ' => ' + newValue + ' groundnetLoaded ' + this.groundnetLoaded + ' pavementLoaded ' + this.pavementLoaded + ' ' + this.loadingInstance)
if (newValue !== oldValue) {
this.groundnetLoaded = newValue
if (this.groundnetLoaded &&
src/renderer/components/LeafletSidebar.vue
+3 -1
View File
@@ -38,6 +38,7 @@ You should have received a copy of the GNU General Public License along with FG
<div class="leaflet-sidebar-close"><i class="fa fa-caret-left"></i></div>
</h1>
<ParkingEdit></ParkingEdit>
<ArcEditMulti></ArcEditMulti>
<ArcEdit></ArcEdit>
<NodeEdit></NodeEdit>
<ParkingGroupEdit ref="parkingGroupEdit" @editParking="(msg) => $emit('editParking', msg)"></ParkingGroupEdit>
@@ -74,6 +75,7 @@ You should have received a copy of the GNU General Public License along with FG
import L from 'leaflet'
import AirportEdit from './AirportEdit'
import ArcEdit from './ArcEdit'
import ArcEditMulti from './ArcEditMulti'
import CheckPanel from './CheckPanel'
import FileSelect from './FileSelect'
import Help from './Help'
@@ -89,7 +91,7 @@ You should have received a copy of the GNU General Public License along with FG
export default {
name: 'leaflet-sidebar',
components: { Help, AirportEdit, ArcEdit, CheckPanel, NodeEdit, ParkingEdit, ParkingGroupEdit, RunScan, FileSelect, SettingsPanel, Search, Upload, WorkInProgress },
components: { Help, AirportEdit, ArcEdit, ArcEditMulti, CheckPanel, NodeEdit, ParkingEdit, ParkingGroupEdit, RunScan, FileSelect, SettingsPanel, Search, Upload, WorkInProgress },
props: [],
created () {
window.addEventListener('keydown', this.doCommand)
src/renderer/loaders/TaxiwaySegmentExtender.js
+244 -151
View File
@@ -4,6 +4,7 @@ const Vue = require('vue');
var L = require('leaflet');
const store = require('../store');
const util = require('util');
const assign = require('core-js/fn/object/assign');
const extendTaxiSegment = function (taxiwaySegment) {
taxiwaySegment.__proto__.begin;
@@ -36,7 +37,7 @@ const extendTaxiSegment = function (taxiwaySegment) {
this.editLayer = editLayer;
this._latlngs[0].glueindex = this.begin;
this._latlngs.slice(-1)[0].glueindex = this.end;
if(this.featureLookup) {
if (this.featureLookup) {
if (typeof this.featureLookup[this.begin] === 'undefined') {
this.featureLookup[this.begin] = new Array();
}
@@ -45,7 +46,7 @@ const extendTaxiSegment = function (taxiwaySegment) {
}
this.featureLookup[this.begin].push(this);
this.featureLookup[this.end].push(this);
this.bidirectional = true;
this.bidirectional = true;
}
};
taxiwaySegment.__proto__.select = function () {
@@ -53,50 +54,50 @@ const extendTaxiSegment = function (taxiwaySegment) {
this.updateStyle();
};
taxiwaySegment.__proto__.selectVertex = function (index) {
this.getLatLngs().forEach( element => {
if (Number(element.glueindex) === index) {
if (element.__vertex._icon != null) {
element.__vertex.__proto__.deselect = function () {
if (this._icon != null) {
this._icon.style.setProperty('background-color','white');
this._icon.style.setProperty('color','white');
} else if (this.icon != null) {
if (this.icon.style != null) {
this.icon.style['background-color'] = 'white';
} else {
this.setStyle({ color: 'white' })
this.getLatLngs().forEach(element => {
if (Number(element.glueindex) === index) {
if (element.__vertex._icon != null) {
element.__vertex.__proto__.deselect = function () {
if (this._icon != null) {
this._icon.style.setProperty('background-color', 'white');
this._icon.style.setProperty('color', 'white');
} else if (this.icon != null) {
if (this.icon.style != null) {
this.icon.style['background-color'] = 'white';
} else {
this.setStyle({ color: 'white' })
}
} else if (this.options.icon != null) {
if (this.options.icon.style != null) {
this.options.icon.style['background-color'] = 'white';
} else {
this.options.icon._setIconStyles({ color: 'white' })
}
}
}
} else if (this.options.icon != null) {
if (this.options.icon.style != null) {
this.options.icon.style['background-color'] = 'white';
element.__vertex._icon.style.setProperty('background-color', 'red');
element.__vertex._icon.style.setProperty('color', 'red');
} else if (element.__vertex !== undefined && element.__vertex.icon != null) {
if (element.__vertex.icon.style != null) {
element.__vertex.icon.style['background-color'] = 'red';
} else {
this.options.icon._setIconStyles({ color: 'white' })
element.__vertex.setStyle({ color: 'red' })
}
}
} else if (element.__vertex.options.icon != null) {
if (element.__vertex.options.icon.style != null) {
element.__vertex.options.icon.style['background-color'] = 'red';
} else {
element.__vertex.options.icon._setIconStyles({ color: 'red' })
}
}
}
element.__vertex._icon.style.setProperty('background-color','red');
element.__vertex._icon.style.setProperty('color','red');
} else if (element.__vertex !== undefined && element.__vertex.icon != null) {
if (element.__vertex.icon.style != null) {
element.__vertex.icon.style['background-color'] = 'red';
} else {
element.__vertex.setStyle({ color: 'red' })
}
} else if (element.__vertex.options.icon != null) {
if (element.__vertex.options.icon.style != null) {
element.__vertex.options.icon.style['background-color'] = 'red';
} else {
element.__vertex.options.icon._setIconStyles({ color: 'red' })
}
}
}
});
});
};
taxiwaySegment.__proto__.deselect = function () {
this.options.attributes.selected = false;
this.updateStyle();
this.getLatLngs().forEach( element => {
if (element.__vertex!==undefined) {
this.getLatLngs().forEach(element => {
if (element.__vertex !== undefined) {
if (element.__vertex._icon != null) {
element.__vertex._icon.style['background-color'] = 'white';
} else if (element.__vertex.icon != null) {
@@ -111,128 +112,170 @@ const extendTaxiSegment = function (taxiwaySegment) {
} else {
element.__vertex.options.icon._setIconStyles({ color: 'white' })
}
}
}
}
});
};
taxiwaySegment.__proto__.addListeners = function () {
this.on('click', function (event) {
if (Number(store.default.state.Editable.index) >= 0 &&
this.featureLookup[store.default.state.Editable.index] !== undefined) {
if (Number(store.default.state.Editable.index) >= 0 &&
this.featureLookup[store.default.state.Editable.index] !== undefined) {
this.featureLookup[store.default.state.Editable.index].forEach(element => {
element.deselect();
});
}
event.target.select();
console.log("Click : " + event.target);
if (store.default.state.Editable.data.arc === undefined ||
store.default.state.Editable.data.arc !== event.target.options.attributes) {
if (event.target.options.attributes === undefined) {
event.target.options.attributes = {};
}
event.target.options.attributes.index = event.target._leaflet_id;
console.debug("Click : " + util.inspect(event.originalEvent));
if (!event.originalEvent.ctrlKey) {
if (store.default.state.Editable.data.arc === undefined ||
store.default.state.Editable.data.arc !== event.target.options.attributes) {
if (event.target.options.attributes === undefined) {
event.target.options.attributes = {};
}
event.target.options.attributes.index = event.target._leaflet_id;
this.editLayer.featureLookup[event.target._leaflet_id] = [];
this.featureLookup[event.target._leaflet_id].push(this);
event.target.options.attributes.selected = true;
store.default.dispatch('setArc', event.target.options.attributes);
}
this.editLayer.featureLookup[event.target._leaflet_id] = [];
this.featureLookup[event.target._leaflet_id].push(this);
event.target.options.attributes.selected = true;
store.default.dispatch('setArc', event.target.options.attributes);
}
} else {
var arcs = event.target.expandArc(event.target.options.attributes);
var multiarc = {name: '', index: 900719925474099, ids: [] ,isPushBackRoute: null, direction: null};
if (store.default.state.Editable.data.multiarc === undefined ||
store.default.state.Editable.data.multiarc !== event.target.options.attributes) {
if (event.target.options.attributes === undefined) {
event.target.options.attributes = {};
}
event.target.options.attributes.index = event.target._leaflet_id;
this.editLayer.featureLookup[event.target._leaflet_id] = [];
this.featureLookup[event.target._leaflet_id].push(this);
event.target.options.attributes.selected = true;
//multiarc.name = JSON.parse(JSON.stringify(event.target.options.attributes.name));
//multiarc.isPushBackRoute = JSON.parse(JSON.stringify(event.target.options.attributes.isPushBackRoute));
//multiarc.direction = JSON.parse(JSON.stringify(event.target.options.attributes.direction));
if(event.target.options.attributes.name!==undefined) {
multiarc.name = assign(event.target.options.attributes.name);
}
multiarc.isPushBackRoute = assign(event.target.options.attributes.isPushBackRoute);
multiarc.direction = assign(event.target.options.attributes.direction);
this.editLayer.featureLookup[900719925474099] = [];
multiarc.ids = [];
//TODO
store.default.dispatch('setMultiArc', multiarc);
}
var editLayer = this.editLayer;
arcs.forEach(id => {
console.debug(id);
var arc = editLayer.groundnetLayerGroup.getLayer(id);
if (arc && arc instanceof L.Polyline) {
editLayer.featureLookup[900719925474099].push(arc);
arc.select();
}
});
store.default.dispatch('setMultiArcIds', arcs);
}
});
this.on('editable:drawing:move', function (event) {
if (dragIndex >= 0) {
this.selectVertex(dragIndex);
console.log('GlueDrag : '+ dragIndex + '\t' + event.target.dragIndex);
console.log('GlueDrag : ' + dragIndex + '\t' + event.target.dragIndex);
this.follow(dragIndex, event);
}
});
this.on('editable:middlemarker:mousedown', event => {
console.debug('editable:middlemarker:mousedown');
} ),
this.on('editable:vertex:new', event => {
console.debug('editable:vertex:new ' + event.vertex.getIndex() + '\t' + event.vertex.getLastIndex() + '\t');
// Find nearest node
let closest = this.editLayer.closestLayerSnap(event.latlng, 5)
let taxiwaySegment = event.latlng.__vertex.editor.feature;
if (taxiwaySegment.options.attributes === undefined) {
taxiwaySegment.options.attributes = { direction: 'bi-directional' };
}
taxiwaySegment.updateStyle();
if(event.vertex.getIndex() !== 0 && event.vertex.getIndex() !== event.vertex.getLastIndex()) {
var nextIndex = ++taxiwaySegment.editLayer.groundnetLayerGroup.maxId;
var splitOffNodes = taxiwaySegment.getLatLngs().splice(-1);
var remainingNodes = taxiwaySegment.getLatLngs();
splitOffNodes.unshift(L.latLng(remainingNodes[1].lat, remainingNodes[1].lng, remainingNodes[1].alt));
remainingNodes[1]['glueindex'] = nextIndex;
remainingNodes[1].attributes = { index: nextIndex, isOnRunway: 0 };
taxiwaySegment.options.attributes.end = nextIndex;
splitOffNodes[0]['glueindex'] = nextIndex;
splitOffNodes[0].attributes = { index: nextIndex, isOnRunway: 0 };
taxiwaySegment.setLatLngs(remainingNodes);
//taxiwaySegment.editor.refresh();
//taxiwaySegment.editor.reset();
if( splitOffNodes.length>1) {
var polyline = new L.Polyline(splitOffNodes, { attributes: {} });
polyline.addTo(taxiwaySegment.editLayer.$parent.$parent.$refs.map.mapObject);
polyline.addTo(taxiwaySegment.editLayer.groundnetLayerGroup);
extendTaxiSegment(polyline);
polyline.addListeners();
polyline.setEditlayer(taxiwaySegment.editLayer);
polyline.enableEdit(taxiwaySegment.editLayer.$parent.$parent.$refs.map.mapObject);
polyline.editor.refresh();
//polyline.editor.reset();
polyline.featureLookup = this.featureLookup;
polyline.options.attributes.name = taxiwaySegment.options.attributes.name;
polyline.options.attributes.direction = taxiwaySegment.options.attributes.direction;
polyline.options.attributes.isPushBackRoute = taxiwaySegment.options.attributes.isPushBackRoute;
polyline.options.attributes.begin = nextIndex;
polyline.options.attributes.end = taxiwaySegment.end;
polyline.updateStyle();
polyline.begin = nextIndex;
polyline.end = taxiwaySegment.end;
taxiwaySegment.end = nextIndex;
this.editLayer.featureLookup[nextIndex] = [];
this.featureLookup[nextIndex].push(taxiwaySegment);
this.featureLookup[nextIndex].push(polyline);
}),
this.on('editable:vertex:new', event => {
console.debug('editable:vertex:new ' + event.vertex.getIndex() + '\t' + event.vertex.getLastIndex() + '\t');
// Find nearest node
let closest = this.editLayer.closestLayerSnap(event.latlng, 5)
let taxiwaySegment = event.latlng.__vertex.editor.feature;
if (taxiwaySegment.options.attributes === undefined) {
taxiwaySegment.options.attributes = { direction: 'bi-directional' };
}
} else {
// Glue to another node
if (closest) {
event.latlng['glueindex'] = Number(closest.glueindex);
event.latlng.__vertex.setLatLng(closest.latlng);
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['glueindex']
}
if (taxiwaySegment.getLatLngs().length === 1) {
taxiwaySegment.begin = closest.glueindex;
}
taxiwaySegment.end = closest.glueindex;
console.log(`Closest : ${closest}`)
} else {
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.updateStyle();
if (event.vertex.getIndex() !== 0 && event.vertex.getIndex() !== event.vertex.getLastIndex()) {
var nextIndex = ++taxiwaySegment.editLayer.groundnetLayerGroup.maxId;
var splitOffNodes = taxiwaySegment.getLatLngs().splice(-1);
var remainingNodes = taxiwaySegment.getLatLngs();
splitOffNodes.unshift(L.latLng(remainingNodes[1].lat, remainingNodes[1].lng, remainingNodes[1].alt));
remainingNodes[1]['glueindex'] = nextIndex;
remainingNodes[1].attributes = { index: nextIndex, isOnRunway: 0 };
taxiwaySegment.options.attributes.end = nextIndex;
splitOffNodes[0]['glueindex'] = nextIndex;
splitOffNodes[0].attributes = { index: nextIndex, isOnRunway: 0 };
taxiwaySegment.setLatLngs(remainingNodes);
//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 ||
(taxiwaySegment.getLatLngs()[taxiwaySegment.getLatLngs().length - 1].glueindex &&
Number(taxiwaySegment.getLatLngs()[taxiwaySegment.getLatLngs().length - 1].glueindex) !== taxiwaySegment.options.attributes.end)) {
taxiwaySegment.options.attributes.end = event.vertex.latlng['glueindex']
taxiwaySegment.end = Number(event.vertex.latlng.glueindex);
if (splitOffNodes.length > 1) {
var polyline = new L.Polyline(splitOffNodes, { attributes: {} });
polyline.addTo(taxiwaySegment.editLayer.$parent.$parent.$refs.map.mapObject);
polyline.addTo(taxiwaySegment.editLayer.groundnetLayerGroup);
extendTaxiSegment(polyline);
polyline.addListeners();
polyline.setEditlayer(taxiwaySegment.editLayer);
polyline.enableEdit(taxiwaySegment.editLayer.$parent.$parent.$refs.map.mapObject);
polyline.editor.refresh();
//polyline.editor.reset();
polyline.featureLookup = this.featureLookup;
polyline.options.attributes.name = taxiwaySegment.options.attributes.name;
polyline.options.attributes.direction = taxiwaySegment.options.attributes.direction;
polyline.options.attributes.isPushBackRoute = taxiwaySegment.options.attributes.isPushBackRoute;
polyline.options.attributes.begin = nextIndex;
polyline.options.attributes.end = taxiwaySegment.end;
polyline.updateStyle();
polyline.begin = nextIndex;
polyline.end = taxiwaySegment.end;
taxiwaySegment.end = nextIndex;
this.editLayer.featureLookup[nextIndex] = [];
this.featureLookup[nextIndex].push(taxiwaySegment);
this.featureLookup[nextIndex].push(polyline);
}
} else {
// Glue to another node
if (closest) {
event.latlng['glueindex'] = Number(closest.glueindex);
event.latlng.__vertex.setLatLng(closest.latlng);
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['glueindex']
}
if (taxiwaySegment.getLatLngs().length === 1) {
taxiwaySegment.begin = closest.glueindex;
}
taxiwaySegment.end = closest.glueindex;
console.log(`Closest : ${closest}`)
} else {
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 ||
(taxiwaySegment.getLatLngs()[taxiwaySegment.getLatLngs().length - 1].glueindex &&
Number(taxiwaySegment.getLatLngs()[taxiwaySegment.getLatLngs().length - 1].glueindex) !== taxiwaySegment.options.attributes.end)) {
taxiwaySegment.options.attributes.end = event.vertex.latlng['glueindex']
taxiwaySegment.end = Number(event.vertex.latlng.glueindex);
}
}
}
}
//this.splitShape(taxiwaySegment.getLatLngs(), )
});
//this.splitShape(taxiwaySegment.getLatLngs(), )
});
this.on('editable:vertex:deleted', event => {
console.debug('editable:vertex:deleted')
});
@@ -251,7 +294,7 @@ const extendTaxiSegment = function (taxiwaySegment) {
if (Number(store.default.state.Editable.index) >= 0 &&
this.featureLookup[store.default.state.Editable.index] !== undefined) {
this.featureLookup[store.default.state.Editable.index].forEach(element => {
if(element.deselect !== undefined) {
if (element.deselect !== undefined) {
element.deselect();
}
});
@@ -268,7 +311,7 @@ const extendTaxiSegment = function (taxiwaySegment) {
this.editLayer.featureLookup[event.vertex.latlng.glueindex].forEach
store.default.dispatch('setNode', event.vertex.latlng)
this.selectVertex(store.default.state.Editable.index)
}
}
}
});
var dragIndex = -1;
@@ -282,7 +325,7 @@ const extendTaxiSegment = function (taxiwaySegment) {
if (Number(store.default.state.Editable.index) >= 0 &&
this.featureLookup[store.default.state.Editable.index] !== undefined) {
this.featureLookup[store.default.state.Editable.index].forEach(element => {
if(element.deselect !== undefined) {
if (element.deselect !== undefined) {
element.deselect();
}
});
@@ -297,7 +340,7 @@ const extendTaxiSegment = function (taxiwaySegment) {
parking[0].selectParking();
} else {
this.selectVertex(Number(dragIndex))
}
}
}
});
this.on('editable:vertex:dragend', function (event) {
@@ -316,29 +359,79 @@ const extendTaxiSegment = function (taxiwaySegment) {
if (parking.length > 0) {
parking[0].selectParking();
} else {
if( Number(event.vertex.latlng.glueindex) !== store.default.state.Editable.index) {
if (Number(event.vertex.latlng.glueindex) !== store.default.state.Editable.index) {
if (Number(store.default.state.Editable.index) >= 0 &&
this.featureLookup[store.default.state.Editable.index] !== undefined) {
this.featureLookup[store.default.state.Editable.index].forEach(element => {
if(element.deselect !== undefined) {
this.featureLookup[store.default.state.Editable.index] !== undefined) {
this.featureLookup[store.default.state.Editable.index].forEach(element => {
if (element.deselect !== undefined) {
element.deselect();
}
});
}
store.default.dispatch('setNode', event.vertex.latlng)
}
store.default.dispatch('setNode', event.vertex.latlng)
}
var lines = this.featureLookup[event.vertex.latlng.glueindex].filter(n => n instanceof L.Polyline);
Vue.default.nextTick(function () {
lines.forEach( line => {
lines.forEach(line => {
line.selectVertex(store.default.state.Editable.index)
});
})
}
}
} catch (error) {
console.error(error);
}
});
};
taxiwaySegment.__proto__.expandArc = function (attributes) {
var isPushBackRoute = attributes.isPushBackRoute;
var ids = [];
var walkedNodes = [];
var segmentIds = [];
console.debug('start Walk');
ids = ids.concat(this.walkPushbackRoute(attributes.begin, walkedNodes, isPushBackRoute));
ids = ids.concat(this.walkPushbackRoute(attributes.end, walkedNodes, isPushBackRoute));
return ids;
}
taxiwaySegment.__proto__.walkPushbackRoute = function (index, walkedNodes, isPushBackRoute) {
console.debug('Walk Level');
walkedNodes.push(index)
var segmentIds = [];
var polyLines = this.featureLookup[index].filter(n => n instanceof L.Polyline);
if (polyLines===undefined || polyLines.length>2) {
console.debug('Walk ' + index + '\t' + polyLines.length);
return;
}
polyLines.forEach(l => {
segmentIds.push(l._leaflet_id);
console.debug('Walk Next ' + index + '\t' +
(walkedNodes.indexOf(index)<0) + '\t'+
l.begin + '\t'+
(walkedNodes.indexOf(Number(l.begin))<0) + '\t'+
l.end + '\t'+
(walkedNodes.indexOf(Number(l.end))<0) + '\t'+
l.options.attributes.direction + '\t' +
l.options.attributes.begin + '\t' +
l.options.attributes.end);
console.debug('Walk isPushBackRoute ' + l.options.attributes.isPushBackRoute + '\t' + isPushBackRoute + '\t' + (l.options.attributes.isPushBackRoute === isPushBackRoute));
if(l.options.attributes.isPushBackRoute === isPushBackRoute ) {
console.debug(Number(l.begin) === index && walkedNodes.indexOf(Number(l.end)) < 0);
if (Number(l.begin) === index && walkedNodes.indexOf(Number(l.end)) < 0) {
console.debug( 'Walk forward ' + l.options.attributes.direction );
segmentIds = segmentIds.concat(this.walkPushbackRoute(Number(l.end), walkedNodes, isPushBackRoute))
}
console.debug(Number(l.end) === index && walkedNodes.indexOf(Number(l.begin)) < 0);
if (Number(l.end) === index && walkedNodes.indexOf(Number(l.begin)) < 0 ) {
console.debug( 'Walk backward ' + l.options.attributes.direction );
segmentIds = segmentIds.concat(this.walkPushbackRoute(Number(l.begin), walkedNodes, isPushBackRoute))
}
}
});
return segmentIds;
}
/**
*
*/
@@ -403,7 +496,7 @@ const extendTaxiSegment = function (taxiwaySegment) {
style.color = '#3388ff';
}
this.setStyle(style);
if(this._map !== null) {
if (this._map !== null) {
if (this.options.attributes.direction === 'forward') {
this.setText(null);
this.setText(' > ', { repeat: true, offset: 10, attributes: { fill: 'red', style: 'vertical-align: bottom; vertical-align: bottom; font-weight: bold; font: bold 30px serif;' } })
@@ -413,8 +506,8 @@ const extendTaxiSegment = function (taxiwaySegment) {
} else {
this.setText(null);
}
}
}
};
};
src/renderer/store/modules/Editable.js
+46 -4
View File
@@ -4,12 +4,13 @@ const state = {
type: 'none',
index: 'none',
editing: false,
data: {airports: {}, parking: {}, arc: {}, node: {}, runway: {}}
data: {airports: {}, parking: {}, arc: {}, multiarc: {}, node: {}, runway: {}}
}
const SET_EDIT_AIRPORT = 'SET_EDIT_AIRPORT'
const SET_EDIT_PARKING = 'SET_EDIT_PARKING'
const SET_EDIT_ARC = 'SET_EDIT_ARC'
const SET_EDIT_MULTI_ARC = 'SET_EDIT_MULTI_ARC'
const SET_EDIT_RUNWAY = 'SET_EDIT_RUNWAY'
const mutations = {
@@ -62,6 +63,29 @@ const mutations = {
Vue.set(state, 'index', arc.index)
Vue.set(state, 'type', 'arc')
},
SET_EDIT_MULTI_ARC (state, arc) {
if (arc === undefined) {
return
}
if (!state.data || state.type !== 'multiarc') {
Vue.set(state, 'data', {})
}
Vue.set(state.data, 'multiarc', arc)
if (state.data.multiarc.name === undefined) {
Vue.set(state.data.multiarc, 'name', '')
}
Vue.set(state, 'index', arc.index)
Vue.set(state, 'type', 'multiarc')
},
'SET_EDIT_MULTI_ARC_IDS' (state, arcs) {
if (arcs === undefined) {
return
}
if (!state.data || state.type !== 'multiarc') {
return
}
state.data.multiarc.ids = state.data.multiarc.ids.concat(arcs.filter(n => n).filter((v, i, a) => a.indexOf(v) === i))
},
'SET_EDIT_PARKING_NAME' (state, parkingName) {
Vue.set(state.data.parking, 'name', parkingName)
},
@@ -91,13 +115,25 @@ const mutations = {
Vue.set(state.data.parking, 'coords', coords)
},
'SET_EDIT_ARC_NAME' (state, arcName) {
Vue.set(state.data.arc, 'name', arcName)
if (state.type === 'arc') {
Vue.set(state.data.arc, 'name', arcName)
} else {
Vue.set(state.data.multiarc, 'name', arcName)
}
},
'SET_EDIT_PUSHBACK' (state, isPushBackRoute) {
Vue.set(state.data.arc, 'isPushBackRoute', Number(isPushBackRoute))
if (state.type === 'arc') {
Vue.set(state.data.arc, 'isPushBackRoute', Number(isPushBackRoute))
} else {
Vue.set(state.data.multiarc, 'isPushBackRoute', Number(isPushBackRoute))
}
},
'SET_EDIT_DIRECTION' (state, direction) {
Vue.set(state.data.arc, 'direction', direction)
if (state.type === 'arc') {
Vue.set(state.data.arc, 'direction', direction)
} else {
Vue.set(state.data.multiarc, 'direction', direction)
}
},
'SET_EDIT_HOLDPOINTTYPE' (state, holdPointType) {
Vue.set(state.data.node, 'holdPointType', holdPointType)
@@ -132,6 +168,12 @@ const actions = {
async setArc (context, arc) {
context.commit(SET_EDIT_ARC, arc)
},
async setMultiArc (context, arc) {
context.commit(SET_EDIT_MULTI_ARC, arc)
},
async setMultiArcIds (context, arc) {
context.commit('SET_EDIT_MULTI_ARC_IDS', arc)
},
async setNode (context, node) {
context.commit('SET_EDIT_NODE', node.attributes)
context.commit('SET_EDIT_NODE_COORDS', node.lat.toFixed(6) + ' ' + node.lng.toFixed(6))
src/renderer/store/modules/Loading.js
+6
View File
@@ -31,9 +31,15 @@ const actions = {
context.commit('SET_ICAO_LOADING', p)
},
async setGroundnetLoaded (context, p) {
if (typeof p !== 'boolean') {
console.error('Not Boolean')
}
context.commit('SET_GROUNDNET_LOADED', p)
},
async setPavementLoaded (context, p) {
if (typeof p !== 'boolean') {
console.error('Not Boolean')
}
context.commit('SET_PAVEMENT_LOADED', p)
}
}