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

Better point selection

Browse Source
This commit is contained in:
portree_kid 2020-06-07 20:46:22 +02:00
parent 46091aa7db
commit 32c0cbd33b
6 changed files with 154 additions and 124 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
.travis.yml
View File

@ -25,12 +25,12 @@ script:
deploy: deploy:
skip_cleanup: true skip_cleanup: true
overwrite: true overwrite: true
name: '0.0.12' name: '0.0.13'
provider: releases provider: releases
api_key: api_key:
secure: Xm3z86gQmpSajvlXSVgG7mxcaS5K7GfE4HrARIDR4pQ4UguQ3/fFOenRyKAQImmH0kLCSIbVE21NMAQ3YI2F9El9I6GU7Wirccsg14TZZiBQAzKOTXZ+JsBloeBxuTOsR84SkO6pV8OT/pRnQd9frqyc1W7wzoX+0sQykMztXCNfI+1MXXGOAgMzlKuDMO1PVENz0V63mWipL/Mae/SyrHa1Bws+4LJKvv42m0HMKdN7ekt41vxcSUvLmN+YLlqUEVr/eUhQXUNCaWlmM0KxmfuzTedca5/1yzLvN8smEt2I2b0DFRM3Mi/QdI22fVRHs6XGpm8yqZRKmhySDXFspXKWBiuCF6AezX6NiIe/ZUh10gIukjkyLtrNk/o29qhj2WE9HJz4xhsGMAx3632cLSMPku5ALN7jv5scWjwCGNHs4ZeZyyePMeGM6Y6pje1uJPbxWGjwoV6iI4Y4esP+z3KcXvZdnzkpYMy2mzdT4gf7A7zieax1YwB6U/MEanXYKFBH4yzYK9+hx3ck2eLT3LcV/ChHN2bKmERJdf18h+zI8e5YKTzd3/kHLiUUv19N2a4TUYloGOyzrLwn2VD1Xm4jJVVLTIQvWbH5YK7cNkHYa4+PnsB+JppSoby7HiBcothw4OLpJO8eCMqXcPRU1n+cRAZTB7VOS7pWh8e8LFE= secure: Xm3z86gQmpSajvlXSVgG7mxcaS5K7GfE4HrARIDR4pQ4UguQ3/fFOenRyKAQImmH0kLCSIbVE21NMAQ3YI2F9El9I6GU7Wirccsg14TZZiBQAzKOTXZ+JsBloeBxuTOsR84SkO6pV8OT/pRnQd9frqyc1W7wzoX+0sQykMztXCNfI+1MXXGOAgMzlKuDMO1PVENz0V63mWipL/Mae/SyrHa1Bws+4LJKvv42m0HMKdN7ekt41vxcSUvLmN+YLlqUEVr/eUhQXUNCaWlmM0KxmfuzTedca5/1yzLvN8smEt2I2b0DFRM3Mi/QdI22fVRHs6XGpm8yqZRKmhySDXFspXKWBiuCF6AezX6NiIe/ZUh10gIukjkyLtrNk/o29qhj2WE9HJz4xhsGMAx3632cLSMPku5ALN7jv5scWjwCGNHs4ZeZyyePMeGM6Y6pje1uJPbxWGjwoV6iI4Y4esP+z3KcXvZdnzkpYMy2mzdT4gf7A7zieax1YwB6U/MEanXYKFBH4yzYK9+hx3ck2eLT3LcV/ChHN2bKmERJdf18h+zI8e5YKTzd3/kHLiUUv19N2a4TUYloGOyzrLwn2VD1Xm4jJVVLTIQvWbH5YK7cNkHYa4+PnsB+JppSoby7HiBcothw4OLpJO8eCMqXcPRU1n+cRAZTB7VOS7pWh8e8LFE=
file_glob: true file_glob: true
file: build/* file: build/*
on: on:
branches: '0.0.12' branches: '0.0.13'
repo: Portree-Kid/flightgear-airports repo: Portree-Kid/flightgear-airports

2
package.json
View File

@ -1,6 +1,6 @@
{ {
"name": "flightgear-airports", "name": "flightgear-airports",
"version": "0.0.12", "version": "0.0.13",
"author": "portree_kid <keith.paterson@gmx.de>", "author": "portree_kid <keith.paterson@gmx.de>",
"description": "An software to design Flightgear groundnets", "description": "An software to design Flightgear groundnets",
"license": "GPL v3", "license": "GPL v3",

18
src/renderer/components/EditLayer.vue
View File

@ -343,6 +343,9 @@
} }
}).filter(n => n); }).filter(n => n);
}, },
/**
*
*/
setPointCoords (index, coordinates) { setPointCoords (index, coordinates) {
var position = new Coordinates(coordinates); var position = new Coordinates(coordinates);
@ -372,15 +375,20 @@
element.getLatLngs()[0].update(latlng); element.getLatLngs()[0].update(latlng);
element.setLatLngs(element.getLatLngs()); element.setLatLngs(element.getLatLngs());
element.updateBeginVertex(latlng); element.updateBeginVertex(latlng);
element.editor.refresh();
element.editor.reset();
element.updateMiddle(); element.updateMiddle();
} }
if (Number(element.end) === Number(index)) { if (Number(element.end) === Number(index)) {
element.getLatLngs()[element.getLatLngs().length - 1].update(latlng); element.getLatLngs()[element.getLatLngs().length - 1].update(latlng);
element.setLatLngs(element.getLatLngs()); element.setLatLngs(element.getLatLngs());
element.updateEndVertex(latlng); element.updateEndVertex(latlng);
element.editor.refresh();
element.editor.reset();
element.updateMiddle(); element.updateMiddle();
} }
} else if (element instanceof L.Editable.VertexMarker) { } else if (element instanceof L.Editable.VertexMarker) {
/*
console.log(element); console.log(element);
element.setLatLng(latlng); element.setLatLng(latlng);
element.latlngs.forEach((latlng1, index) => { element.latlngs.forEach((latlng1, index) => {
@ -391,6 +399,7 @@
}); });
element.editor.feature.setLatLngs(element.latlngs); element.editor.feature.setLatLngs(element.latlngs);
element.editor.feature.updateMiddle(); element.editor.feature.updateMiddle();
*/
} }
}); });
}, },
@ -608,8 +617,13 @@
*/ */
}, },
editedArc() { editedArc() {
if (!this.groundnetLayerGroup) if (!this.groundnetLayerGroup ||
this.$store.state.Editable.index === undefined ||
this.$store.state.Editable.data.arc === undefined ||
this.featureLookup===undefined ||
!this.editing) {
return; return;
}
var arc = this.groundnetLayerGroup.getLayer(this.$store.state.Editable.index); var arc = this.groundnetLayerGroup.getLayer(this.$store.state.Editable.index);
if (arc && arc instanceof L.Polyline) { if (arc && arc instanceof L.Polyline) {
console.log('Edited Arc : ' + this.$store.state.Editable.index); console.log('Edited Arc : ' + this.$store.state.Editable.index);
@ -679,6 +693,8 @@
element._latlngs.forEach(element => { element._latlngs.forEach(element => {
if(element.__vertex && Number(element.glueindex) === Number(nIndex)){ if(element.__vertex && Number(element.glueindex) === Number(nIndex)){
if (this.$store.state.Editable.data.node.coords) { if (this.$store.state.Editable.data.node.coords) {
console.log('Cords : ' + this.$store.state.Editable.data.node.coords);
this.setPointCoords(this.$store.state.Editable.index, this.$store.state.Editable.data.node.coords) this.setPointCoords(this.$store.state.Editable.index, this.$store.state.Editable.data.node.coords)
} }
} }

2
src/renderer/loaders/RunwayNode.js
View File

@ -23,7 +23,7 @@ L.RunwayNode = L.Marker.extend({
function (state) { function (state) {
return state.Editable.data.runway; return state.Editable.data.runway;
}, },
() => { (state) => {
// Reset colour // Reset colour
if(event.target instanceof L.RunwayNode && if(event.target instanceof L.RunwayNode &&
event.target.options.attributes && event.target.options.attributes &&

89
src/renderer/loaders/TaxiwaySegmentExtender.js
View File

@ -1,4 +1,6 @@
/* eslint-disable */ /* eslint-disable */
const Vue = require('vue');
var L = require('leaflet'); var L = require('leaflet');
const store = require('../store'); const store = require('../store');
@ -12,14 +14,14 @@ exports.extendTaxiSegment = function (taxiwaySegment) {
} }
}; };
taxiwaySegment.__proto__.updateEndVertex = function (latlng) { taxiwaySegment.__proto__.updateEndVertex = function (latlng) {
if(this._latlngs[1].__vertex){ if (this._latlngs[1].__vertex) {
this._latlngs[1].__vertex.setLatLng(latlng); this._latlngs[1].__vertex.setLatLng(latlng);
} }
}; };
taxiwaySegment.__proto__.updateMiddle = function () { taxiwaySegment.__proto__.updateMiddle = function () {
this._latlngs.forEach(element => { this._latlngs.forEach(element => {
if(element.__vertex.middleMarker){ if (element.__vertex.middleMarker) {
element.__vertex.middleMarker.updateLatLng(); element.__vertex.middleMarker.updateLatLng();
} }
}); });
@ -43,24 +45,24 @@ exports.extendTaxiSegment = function (taxiwaySegment) {
}; };
taxiwaySegment.__proto__.addListeners = function () { taxiwaySegment.__proto__.addListeners = function () {
this.on('click', function (event) { this.on('click', function (event) {
event.target.setStyle({color : 'red'}); event.target.setStyle({ color: 'red' });
console.log("Click : " + event.target); console.log("Click : " + event.target);
if (store.default.state.Editable.data.arc === undefined || if (store.default.state.Editable.data.arc === undefined ||
store.default.state.Editable.data.arc !== event.target.options.attributes) { store.default.state.Editable.data.arc !== event.target.options.attributes) {
if(event.target.options.attributes === undefined) { if (event.target.options.attributes === undefined) {
event.target.options.attributes = {}; event.target.options.attributes = {};
} }
event.target.options.attributes.index = event.target._leaflet_id; event.target.options.attributes.index = event.target._leaflet_id;
event.target.options.attributes.selected = true; event.target.options.attributes.selected = true;
store.default.dispatch('setArc', event.target.options.attributes); store.default.dispatch('setArc', event.target.options.attributes);
}
this.unwatch = store.default.watch( this.unwatch = store.default.watch(
function (state) { function (state) {
return state.Editable.data.arc; return state.Editable.data.arc;
}, },
() => { (arc) => {
console.debug(arc);
// Reset colour // Reset colour
if(event.target instanceof L.Polyline && if (event.target instanceof L.Polyline &&
event.target.options.attributes && event.target.options.attributes &&
event.target.options.attributes.selected) { event.target.options.attributes.selected) {
event.target.options.attributes.selected = false; event.target.options.attributes.selected = false;
@ -73,6 +75,7 @@ exports.extendTaxiSegment = function (taxiwaySegment) {
deep: true //add this if u need to watch object properties change etc. deep: true //add this if u need to watch object properties change etc.
} }
); );
}
}); });
this.on('editable:drawing:move', function (event) { this.on('editable:drawing:move', function (event) {
if (dragIndex >= 0) { if (dragIndex >= 0) {
@ -85,14 +88,15 @@ exports.extendTaxiSegment = function (taxiwaySegment) {
// Find nearest node // Find nearest node
let closest = this.editLayer.closestLayerSnap(event.latlng, 5) let closest = this.editLayer.closestLayerSnap(event.latlng, 5)
let taxiwaySegment = event.latlng.__vertex.editor.feature; let taxiwaySegment = event.latlng.__vertex.editor.feature;
if(taxiwaySegment.options.attributes === undefined) { if (taxiwaySegment.options.attributes === undefined) {
taxiwaySegment.options.attributes = {direction: 'bi-directional'}; taxiwaySegment.options.attributes = { direction: 'bi-directional' };
} }
taxiwaySegment.updateStyle();
// Glue to another node // Glue to another node
if (closest) { if (closest) {
event.latlng['glueindex'] = Number(closest.glueindex); event.latlng['glueindex'] = Number(closest.glueindex);
event.latlng.__vertex.setLatLng(closest.latlng); event.latlng.__vertex.setLatLng(closest.latlng);
event.latlng.attributes = {index: event.latlng.glueindex, isOnRunway: 0}; event.latlng.attributes = { index: event.latlng.glueindex, isOnRunway: 0 };
// Push Vertex to lookup // Push Vertex to lookup
this.editLayer.featureLookup[event.latlng.glueindex].push(event.latlng.__vertex); this.editLayer.featureLookup[event.latlng.glueindex].push(event.latlng.__vertex);
if (taxiwaySegment.options.attributes.begin === undefined) { if (taxiwaySegment.options.attributes.begin === undefined) {
@ -100,14 +104,14 @@ exports.extendTaxiSegment = function (taxiwaySegment) {
} else { } else {
taxiwaySegment.options.attributes.end = event.latlng['glueindex'] taxiwaySegment.options.attributes.end = event.latlng['glueindex']
} }
if(taxiwaySegment.getLatLngs().length===1) { if (taxiwaySegment.getLatLngs().length === 1) {
taxiwaySegment.begin = closest.glueindex; taxiwaySegment.begin = closest.glueindex;
} }
taxiwaySegment.end = closest.glueindex; taxiwaySegment.end = closest.glueindex;
console.log(`Closest : ${closest}`) console.log(`Closest : ${closest}`)
} else { } else {
event.vertex.latlng['glueindex'] = ++this.editLayer.groundnetLayerGroup.maxId; event.vertex.latlng['glueindex'] = ++this.editLayer.groundnetLayerGroup.maxId;
event.vertex.latlng.attributes = {index: event.vertex.latlng.glueindex, isOnRunway: 0}; 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] = [];
this.editLayer.featureLookup[event.vertex.latlng.glueindex].push(event.vertex); this.editLayer.featureLookup[event.vertex.latlng.glueindex].push(event.vertex);
this.editLayer.featureLookup[event.vertex.latlng.glueindex].push(taxiwaySegment); this.editLayer.featureLookup[event.vertex.latlng.glueindex].push(taxiwaySegment);
@ -116,13 +120,13 @@ exports.extendTaxiSegment = function (taxiwaySegment) {
if (taxiwaySegment.options.attributes.begin === undefined) { if (taxiwaySegment.options.attributes.begin === undefined) {
taxiwaySegment.options.attributes.begin = event.vertex.latlng['glueindex'] taxiwaySegment.options.attributes.begin = event.vertex.latlng['glueindex']
taxiwaySegment.begin = event.vertex.latlng.glueindex; taxiwaySegment.begin = event.vertex.latlng.glueindex;
} /*else if (taxiwaySegment.options.attributes.end === undefined || } else if (taxiwaySegment.options.attributes.end === undefined ||
Number(taxiwaySegment.getLatLngs()[taxiwaySegment.getLatLngs().length-1].glueindex) !== taxiwaySegment.options.attributes.end ) { (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.options.attributes.end = event.vertex.latlng['glueindex']
taxiwaySegment.end = event.vertex.latlng.glueindex; taxiwaySegment.end = Number(event.vertex.latlng.glueindex);
}*/ }
} }
}); });
this.on('editable:vertex:deleted', event => { this.on('editable:vertex:deleted', event => {
console.log('editable:vertex:deleted' + event) console.log('editable:vertex:deleted' + event)
@ -133,24 +137,24 @@ exports.extendTaxiSegment = function (taxiwaySegment) {
}); });
this.on('editable:vertex:clicked', function (event) { this.on('editable:vertex:clicked', function (event) {
var parking = this.featureLookup[event.vertex.latlng.glueindex].filter(n => n instanceof L.ParkingSpot); var parking = this.featureLookup[event.vertex.latlng.glueindex].filter(n => n instanceof L.ParkingSpot);
if(parking.length>0) { if (parking.length > 0) {
parking[0].selectParking(); parking[0].selectParking();
} else { } else {
this.editLayer.featureLookup[event.vertex.latlng.glueindex].forEach this.editLayer.featureLookup[event.vertex.latlng.glueindex].forEach
store.default.dispatch('setNode', event.vertex.latlng) store.default.dispatch('setNode', event.vertex.latlng)
if(event.vertex._icon!=null) { if (event.vertex._icon != null) {
event.vertex._icon.style['background-color'] = 'red'; event.vertex._icon.style['background-color'] = 'red';
} else if(event.vertex.icon!=null ) { } else if (event.vertex.icon != null) {
if(event.vertex.icon.style!=null) { if (event.vertex.icon.style != null) {
event.vertex.icon.style['background-color'] = 'red'; event.vertex.icon.style['background-color'] = 'red';
} else { } else {
event.vertex.setStyle({color : 'red'}) event.vertex.setStyle({ color: 'red' })
} }
} else if(event.vertex.options.icon!=null ) { } else if (event.vertex.options.icon != null) {
if(event.vertex.options.icon.style!=null) { if (event.vertex.options.icon.style != null) {
event.vertex.options.icon.style['background-color'] = 'red'; event.vertex.options.icon.style['background-color'] = 'red';
} else { } else {
event.vertex.options.icon._setIconStyles({color : 'red'}) event.vertex.options.icon._setIconStyles({ color: 'red' })
} }
} }
this.unwatch = store.default.watch( this.unwatch = store.default.watch(
@ -158,21 +162,21 @@ exports.extendTaxiSegment = function (taxiwaySegment) {
return state.Editable.data.node; return state.Editable.data.node;
}, },
(state) => { (state) => {
if( state === undefined || if (state === undefined ||
state.index !== Number(event.vertex.latlng.glueindex)) { state.index !== Number(event.vertex.latlng.glueindex)) {
if(event.vertex._icon!=null) { if (event.vertex._icon != null) {
event.vertex._icon.style['background-color'] = 'white'; event.vertex._icon.style['background-color'] = 'white';
} else if(event.vertex.icon!=null ) { } else if (event.vertex.icon != null) {
if(event.vertex.icon.style!=null) { if (event.vertex.icon.style != null) {
event.vertex.icon.style['background-color'] = 'white'; event.vertex.icon.style['background-color'] = 'white';
} else { } else {
event.vertex.setStyle({color : 'white'}) event.vertex.setStyle({ color: 'white' })
} }
} else if(event.vertex.options.icon!=null ) { } else if (event.vertex.options.icon != null) {
if(event.vertex.options.icon.style!=null) { if (event.vertex.options.icon.style != null) {
event.vertex.options.icon.style['background-color'] = 'white'; event.vertex.options.icon.style['background-color'] = 'white';
} else { } else {
event.vertex.options.icon._setIconStyles({color : 'white'}) event.vertex.options.icon._setIconStyles({ color: 'white' })
} }
} }
this.unwatch(); this.unwatch();
@ -190,7 +194,7 @@ exports.extendTaxiSegment = function (taxiwaySegment) {
console.log("Event Target : ", event.target); console.log("Event Target : ", event.target);
console.log("Middle Marker : ", event.vertex == event.vertex.middleMarker); console.log("Middle Marker : ", event.vertex == event.vertex.middleMarker);
console.log("Middle Marker : ", event.vertex.latlng.glueindex == undefined); console.log("Middle Marker : ", event.vertex.latlng.glueindex == undefined);
if(event.vertex.latlng.glueindex == undefined) if (event.vertex.latlng.glueindex == undefined)
return; return;
dragIndex = event.vertex.latlng.glueindex; dragIndex = event.vertex.latlng.glueindex;
}); });
@ -206,10 +210,13 @@ exports.extendTaxiSegment = function (taxiwaySegment) {
} }
dragIndex = -1; dragIndex = -1;
var parking = this.featureLookup[event.vertex.latlng.glueindex].filter(n => n instanceof L.ParkingSpot); var parking = this.featureLookup[event.vertex.latlng.glueindex].filter(n => n instanceof L.ParkingSpot);
if(parking.length>0) { if (parking.length > 0) {
parking[0].selectParking(); parking[0].selectParking();
} else { } else {
Vue.default.nextTick(function () {
store.default.dispatch('setNode', event.vertex.latlng) store.default.dispatch('setNode', event.vertex.latlng)
})
//
} }
}); });
@ -220,7 +227,7 @@ exports.extendTaxiSegment = function (taxiwaySegment) {
taxiwaySegment.__proto__.follow = function (dragIndex, event) { taxiwaySegment.__proto__.follow = function (dragIndex, event) {
this.featureLookup[dragIndex].forEach(element => { this.featureLookup[dragIndex].forEach(element => {
if(element !== event.target){ if (element !== event.target) {
if (element instanceof L.RunwayNode) { if (element instanceof L.RunwayNode) {
element.setLatLng(event.latlng); element.setLatLng(event.latlng);
} }
@ -266,9 +273,9 @@ exports.extendTaxiSegment = function (taxiwaySegment) {
}) })
}; };
taxiwaySegment.__proto__.updateStyle = function() { taxiwaySegment.__proto__.updateStyle = function () {
var style = {}; var style = {};
if(this.options.attributes.selected){ if (this.options.attributes.selected) {
style.color = 'red'; style.color = 'red';
} else if (this.options.attributes.isPushBackRoute) { } else if (this.options.attributes.isPushBackRoute) {
style.color = 'magenta'; style.color = 'magenta';
@ -279,11 +286,11 @@ exports.extendTaxiSegment = function (taxiwaySegment) {
this.setStyle(style); this.setStyle(style);
if (this.options.attributes.direction === 'forward') { if (this.options.attributes.direction === 'forward') {
this.setText(null); this.setText(null);
this.setText(' ⮞ ', {repeat: true, attributes: {fill: 'red', size: 30}}) this.setText(' ⮞ ', { repeat: true, attributes: { fill: 'red', size: 30 } })
} else if (this.options.attributes.direction === 'backward') { } else if (this.options.attributes.direction === 'backward') {
this.setText(null); this.setText(null);
this.setText(' ⮜ ', {repeat: true, attributes: {fill: 'red', size: 30}}) this.setText(' ⮜ ', { repeat: true, attributes: { fill: 'red', size: 30 } })
}else { } else {
this.setText(null); this.setText(null);
} }
}; };

7
src/renderer/store/modules/Editable.js
View File

@ -32,7 +32,9 @@ const mutations = {
if (node === undefined) { if (node === undefined) {
return return
} }
if (!state.data || state.type !== 'node') {
Vue.set(state, 'data', {}) Vue.set(state, 'data', {})
}
Vue.set(state.data, 'node', node) Vue.set(state.data, 'node', node)
Vue.set(state, 'index', node.index) Vue.set(state, 'index', node.index)
Vue.set(state, 'type', 'node') Vue.set(state, 'type', 'node')
@ -44,7 +46,12 @@ const mutations = {
Vue.set(state, 'type', 'runway') Vue.set(state, 'type', 'runway')
}, },
SET_EDIT_ARC (state, arc) { SET_EDIT_ARC (state, arc) {
if (arc === undefined) {
return
}
if (!state.data || state.type !== 'arc') {
Vue.set(state, 'data', {}) Vue.set(state, 'data', {})
}
Vue.set(state.data, 'arc', arc) Vue.set(state.data, 'arc', arc)
if (state.data.arc.name === undefined) { if (state.data.arc.name === undefined) {
Vue.set(state.data.arc, 'name', '') Vue.set(state.data.arc, 'name', '')