Better point selection

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

View File

@ -25,12 +25,12 @@ script:
deploy:
skip_cleanup: true
overwrite: true
name: '0.0.12'
name: '0.0.13'
provider: releases
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=
file_glob: true
file: build/*
on:
branches: '0.0.12'
branches: '0.0.13'
repo: Portree-Kid/flightgear-airports

View File

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

View File

@ -343,6 +343,9 @@
}
}).filter(n => n);
},
/**
*
*/
setPointCoords (index, coordinates) {
var position = new Coordinates(coordinates);
@ -372,15 +375,20 @@
element.getLatLngs()[0].update(latlng);
element.setLatLngs(element.getLatLngs());
element.updateBeginVertex(latlng);
element.editor.refresh();
element.editor.reset();
element.updateMiddle();
}
if (Number(element.end) === Number(index)) {
element.getLatLngs()[element.getLatLngs().length - 1].update(latlng);
element.setLatLngs(element.getLatLngs());
element.updateEndVertex(latlng);
element.editor.refresh();
element.editor.reset();
element.updateMiddle();
}
} else if (element instanceof L.Editable.VertexMarker) {
/*
console.log(element);
element.setLatLng(latlng);
element.latlngs.forEach((latlng1, index) => {
@ -391,6 +399,7 @@
});
element.editor.feature.setLatLngs(element.latlngs);
element.editor.feature.updateMiddle();
*/
}
});
},
@ -608,8 +617,13 @@
*/
},
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;
}
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);
@ -679,6 +693,8 @@
element._latlngs.forEach(element => {
if(element.__vertex && Number(element.glueindex) === Number(nIndex)){
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)
}
}

View File

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

View File

@ -1,4 +1,6 @@
/* eslint-disable */
const Vue = require('vue');
var L = require('leaflet');
const store = require('../store');
@ -12,14 +14,14 @@ exports.extendTaxiSegment = function (taxiwaySegment) {
}
};
taxiwaySegment.__proto__.updateEndVertex = function (latlng) {
if(this._latlngs[1].__vertex){
if (this._latlngs[1].__vertex) {
this._latlngs[1].__vertex.setLatLng(latlng);
}
};
taxiwaySegment.__proto__.updateMiddle = function () {
this._latlngs.forEach(element => {
if(element.__vertex.middleMarker){
if (element.__vertex.middleMarker) {
element.__vertex.middleMarker.updateLatLng();
}
});
@ -43,24 +45,24 @@ exports.extendTaxiSegment = function (taxiwaySegment) {
};
taxiwaySegment.__proto__.addListeners = function () {
this.on('click', function (event) {
event.target.setStyle({color : 'red'});
event.target.setStyle({ color: 'red' });
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) {
if (event.target.options.attributes === undefined) {
event.target.options.attributes = {};
}
event.target.options.attributes.index = event.target._leaflet_id;
event.target.options.attributes.selected = true;
store.default.dispatch('setArc', event.target.options.attributes);
}
this.unwatch = store.default.watch(
function (state) {
this.unwatch = store.default.watch(
function (state) {
return state.Editable.data.arc;
},
() => {
},
(arc) => {
console.debug(arc);
// Reset colour
if(event.target instanceof L.Polyline &&
if (event.target instanceof L.Polyline &&
event.target.options.attributes &&
event.target.options.attributes.selected) {
event.target.options.attributes.selected = false;
@ -68,11 +70,12 @@ exports.extendTaxiSegment = function (taxiwaySegment) {
this.unwatch();
}
}
,
{
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) {
if (dragIndex >= 0) {
@ -85,45 +88,46 @@ exports.extendTaxiSegment = function (taxiwaySegment) {
// 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'};
if (taxiwaySegment.options.attributes === undefined) {
taxiwaySegment.options.attributes = { direction: 'bi-directional' };
}
taxiwaySegment.updateStyle();
// 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}`)
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 ||
Number(taxiwaySegment.getLatLngs()[taxiwaySegment.getLatLngs().length-1].glueindex) !== taxiwaySegment.options.attributes.end ) {
taxiwaySegment.options.attributes.end = event.vertex.latlng['glueindex']
taxiwaySegment.end = event.vertex.latlng.glueindex;
}*/
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.on('editable:vertex:deleted', event => {
console.log('editable:vertex:deleted' + event)
});
@ -133,51 +137,51 @@ exports.extendTaxiSegment = function (taxiwaySegment) {
});
this.on('editable:vertex:clicked', function (event) {
var parking = this.featureLookup[event.vertex.latlng.glueindex].filter(n => n instanceof L.ParkingSpot);
if(parking.length>0) {
parking[0].selectParking();
if (parking.length > 0) {
parking[0].selectParking();
} else {
this.editLayer.featureLookup[event.vertex.latlng.glueindex].forEach
store.default.dispatch('setNode', event.vertex.latlng)
if(event.vertex._icon!=null) {
if (event.vertex._icon != null) {
event.vertex._icon.style['background-color'] = 'red';
} else if(event.vertex.icon!=null ) {
if(event.vertex.icon.style!=null) {
} else if (event.vertex.icon != null) {
if (event.vertex.icon.style != null) {
event.vertex.icon.style['background-color'] = 'red';
} else {
event.vertex.setStyle({color : 'red'})
event.vertex.setStyle({ color: 'red' })
}
} else if(event.vertex.options.icon!=null ) {
if(event.vertex.options.icon.style!=null) {
} else if (event.vertex.options.icon != null) {
if (event.vertex.options.icon.style != null) {
event.vertex.options.icon.style['background-color'] = 'red';
} else {
event.vertex.options.icon._setIconStyles({color : 'red'})
event.vertex.options.icon._setIconStyles({ color: 'red' })
}
}
this.unwatch = store.default.watch(
function (state) {
return state.Editable.data.node;
return state.Editable.data.node;
},
(state) => {
if( state === undefined ||
state.index !== Number(event.vertex.latlng.glueindex)) {
if(event.vertex._icon!=null) {
event.vertex._icon.style['background-color'] = 'white';
} else if(event.vertex.icon!=null ) {
if(event.vertex.icon.style!=null) {
event.vertex.icon.style['background-color'] = 'white';
} else {
event.vertex.setStyle({color : 'white'})
}
} else if(event.vertex.options.icon!=null ) {
if(event.vertex.options.icon.style!=null) {
event.vertex.options.icon.style['background-color'] = 'white';
} else {
event.vertex.options.icon._setIconStyles({color : 'white'})
}
(state) => {
if (state === undefined ||
state.index !== Number(event.vertex.latlng.glueindex)) {
if (event.vertex._icon != null) {
event.vertex._icon.style['background-color'] = 'white';
} else if (event.vertex.icon != null) {
if (event.vertex.icon.style != null) {
event.vertex.icon.style['background-color'] = 'white';
} else {
event.vertex.setStyle({ color: 'white' })
}
} else if (event.vertex.options.icon != null) {
if (event.vertex.options.icon.style != null) {
event.vertex.options.icon.style['background-color'] = 'white';
} else {
event.vertex.options.icon._setIconStyles({ color: 'white' })
}
this.unwatch();
}
this.unwatch();
}
}
,
{
deep: true //add this if u need to watch object properties change etc.
@ -190,8 +194,8 @@ exports.extendTaxiSegment = function (taxiwaySegment) {
console.log("Event Target : ", event.target);
console.log("Middle Marker : ", event.vertex == event.vertex.middleMarker);
console.log("Middle Marker : ", event.vertex.latlng.glueindex == undefined);
if(event.vertex.latlng.glueindex == undefined)
return;
if (event.vertex.latlng.glueindex == undefined)
return;
dragIndex = event.vertex.latlng.glueindex;
});
this.on('editable:vertex:dragend', function (event) {
@ -206,21 +210,24 @@ exports.extendTaxiSegment = function (taxiwaySegment) {
}
dragIndex = -1;
var parking = this.featureLookup[event.vertex.latlng.glueindex].filter(n => n instanceof L.ParkingSpot);
if(parking.length>0) {
parking[0].selectParking();
if (parking.length > 0) {
parking[0].selectParking();
} else {
store.default.dispatch('setNode', event.vertex.latlng)
Vue.default.nextTick(function () {
store.default.dispatch('setNode', event.vertex.latlng)
})
//
}
});
};
/**
*
*/
/**
*
*/
taxiwaySegment.__proto__.follow = function (dragIndex, event) {
taxiwaySegment.__proto__.follow = function (dragIndex, event) {
this.featureLookup[dragIndex].forEach(element => {
if(element !== event.target){
if (element !== event.target) {
if (element instanceof L.RunwayNode) {
element.setLatLng(event.latlng);
}
@ -266,24 +273,24 @@ exports.extendTaxiSegment = function (taxiwaySegment) {
})
};
taxiwaySegment.__proto__.updateStyle = function() {
taxiwaySegment.__proto__.updateStyle = function () {
var style = {};
if(this.options.attributes.selected){
if (this.options.attributes.selected) {
style.color = 'red';
} else if (this.options.attributes.isPushBackRoute) {
style.color = 'magenta';
} else if (this.options.attributes.isPushBackRoute) {
style.color = 'magenta';
}
else {
style.color = '#3388ff';
style.color = '#3388ff';
}
this.setStyle(style);
if (this.options.attributes.direction === 'forward') {
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') {
this.setText(null);
this.setText(' ⮜ ', {repeat: true, attributes: {fill: 'red', size: 30}})
}else {
this.setText(' ⮜ ', { repeat: true, attributes: { fill: 'red', size: 30 } })
} else {
this.setText(null);
}
};

View File

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