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

Bidirectional Binding Parking/Heading

Browse Source
This commit is contained in:
portree_kid 2020-06-02 12:02:37 +02:00
parent 66687bb35f
commit 3aea131727
5 changed files with 80 additions and 37 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -388,7 +388,7 @@
latlng1.update(latlng); latlng1.update(latlng);
} }
}); });
element.editor.feature.setLatLngs(latlngs); element.editor.feature.setLatLngs(element.latlngs);
element.editor.feature.updateMiddle(); element.editor.feature.updateMiddle();
} }
}); });
@ -549,13 +549,13 @@
}) })
}, },
editedParking() { editedParking() {
console.log('Edited Parking : ' + this.$store.state.Editable.data.parking)
if (this.$store.state.Editable.index === undefined || if (this.$store.state.Editable.index === undefined ||
this.$store.state.Editable.data.parking === undefined || this.$store.state.Editable.data.parking === undefined ||
this.featureLookup===undefined) { this.featureLookup===undefined) {
return return
} }
this.$store.dispatch('updatedParking', this.$store.state.Editable.data.parking); console.log('Edited Parking : ' + this.$store.state.Editable.data.parking)
//Notify list
if (this.featureLookup[this.$store.state.Editable.index]===undefined) { if (this.featureLookup[this.$store.state.Editable.index]===undefined) {
return return
} }
@ -565,6 +565,9 @@
element.updateVertexFromDirection(); element.updateVertexFromDirection();
} }
}) })
if (this.$store.state.Editable.data.parking.coords) {
this.setPointCoords(this.$store.state.Editable.index, this.$store.state.Editable.data.parking.coords)
}
}, },
editedParkings() { editedParkings() {
if (this.featureLookup===undefined) { if (this.featureLookup===undefined) {

2
src/renderer/components/NodeEdit.vue
View File

@ -72,7 +72,7 @@
if (newValue==='unknown') { if (newValue==='unknown') {
} }
this.$store.commit('SET_EDIT_COORDS', newValue) this.$store.commit('SET_EDIT_NODE_COORDS', newValue)
} }
}, },
isOnRunway: { isOnRunway: {

30
src/renderer/components/ParkingEdit.vue
View File

@ -88,7 +88,7 @@
<span class="label">Heading :</span> <span class="label">Heading :</span>
</el-col> </el-col>
<el-col :span="17"> <el-col :span="17">
<el-input-number v-model="heading" :min="-1" :max="361" :step="0.1" :precision="1" :disabled="!editing"></el-input-number> <el-input-number v-model="heading" :min="-361" :max="720" :step="0.1" :precision="1" :disabled="!editing"></el-input-number>
</el-col> </el-col>
</el-row> </el-row>
<el-row> <el-row>
@ -157,9 +157,11 @@
// {value: 'forward', label: 'forward'}, // {value: 'forward', label: 'forward'},
// {value: 'backward', label: 'backward'} // {value: 'backward', label: 'backward'}
// ] // ]
storedairlineCodes.forEach(element => { if(storedairlineCodes) {
airlineCodes.push({value: element, label: element}); storedairlineCodes.forEach(element => {
}); airlineCodes.push({value: element, label: element});
});
}
return airlineCodes return airlineCodes
}, },
airlineCodes: { airlineCodes: {
@ -204,15 +206,15 @@
// getter // getter
get: function () { get: function () {
if(this.$store.state.Editable.index!==undefined) { if(this.$store.state.Editable.index!==undefined) {
var ret = this.$parent.$parent.$parent.$refs.editLayer.getPointCoords(this.$store.state.Editable.index) return this.$store.state.Editable.data.parking.coords;
return ret[0].lat + " " + ret[0].lng
} }
}, },
// setter // setter
set: function (newValue) { set: function (newValue) {
var position = new Coordinates(newValue); if (newValue==='unknown') {
console.log(position);
this.$parent.$parent.$parent.$refs.editLayer.setPointCoords(this.$store.state.Editable.index, position) }
this.$store.commit('SET_EDIT_PARKING_COORDS', newValue)
} }
}, },
heading: { heading: {
@ -222,13 +224,15 @@
}, },
// setter // setter
set: function (newValue) { set: function (newValue) {
if (newValue>=360) { while (newValue>=360) {
newValue -= 360 newValue -= 360
} }
if (newValue<0) { while (newValue<0) {
newValue += 360 newValue += 360
} }
this.$store.commit('SET_EDIT_PARKING_HEADING', newValue) if (Number(this.$store.state.Editable.data.parking.heading) !== newValue) {
this.$store.commit('SET_EDIT_PARKING_HEADING', newValue)
}
} }
}, },
wingspan: { wingspan: {

53
src/renderer/loaders/ParkingSpot.js
View File

@ -72,11 +72,11 @@ L.ParkingSpot = L.Circle.extend({
} }
} }
}, },
removeDirection: function () { removeDirection() {
this.direction = undefined; this.direction = undefined;
}, },
// Update the direction vertex from the direction // Update the direction vertex from the direction
updateVertexFromDirection: function () { updateVertexFromDirection() {
if (this.editEnabled()) { if (this.editEnabled()) {
var start = this._latlng; var start = this._latlng;
var options = { units: 'kilometers' }; var options = { units: 'kilometers' };
@ -91,13 +91,12 @@ L.ParkingSpot = L.Circle.extend({
} }
}, },
// Update the direction from the moved direction vertex // Update the direction from the moved direction vertex
updateDirectionFromVertex: function () { updateDirectionFromVertex() {
if (this.editEnabled()) { if (this.editEnabled()) {
var start = this._latlng; var start = this._latlng;
var end = this.editor._resizeLatLng.__vertex.getLatLng(); var end = this.editor._resizeLatLng.__vertex.getLatLng();
var heading = turf.bearing([start.lng, start.lat], [end.lng, end.lat]); var heading = turf.bearing([start.lng, start.lat], [end.lng, end.lat]);
this.options.attributes.heading = heading; this.options.attributes.heading = heading;
const output = validRadii.reduce((prev, curr) => Math.abs(curr - this._mRadius) < Math.abs(prev - this._mRadius) ? curr : prev); const output = validRadii.reduce((prev, curr) => Math.abs(curr - this._mRadius) < Math.abs(prev - this._mRadius) ? curr : prev);
console.debug('Found radius ' + output); console.debug('Found radius ' + output);
@ -121,6 +120,7 @@ L.ParkingSpot = L.Circle.extend({
var style = {}; var style = {};
style['color'] = 'red'; style['color'] = 'red';
this.setStyle(style); this.setStyle(style);
element.updateWheelPos();
}, },
deselect() { deselect() {
var style = {}; var style = {};
@ -144,24 +144,35 @@ L.ParkingSpot = L.Circle.extend({
event.target.updateWheelPos(); event.target.updateWheelPos();
} }
}); });
/* this.on('editable:vertex:drag', function (event) {
this.on('editable:vertex:drag', function (event) { console.debug("Drag Parking : ", event);
console.debug("Drag : ", event);
}); });
*/ this.on('editable:vertex:dragend', function (event) {
this.on('click', function (event) { console.debug("DragEnd Parking : ", event);
console.debug("Click : " + event.target);
store.default.dispatch('setParking', event.target.options.attributes); store.default.dispatch('setParking', event.target.options.attributes);
store.default.dispatch('setParkingCoords', event.target.getLatLng().lat.toFixed(5) + ' ' + event.target.getLatLng().lng.toFixed(5));
/*
store.default.dispatch('setParkingHeading', this.options.attributes.heading)
store.default.dispatch('setParkingRadius', this.options.attributes.radius)
*/
});
this.on('click', function (event) {
console.debug("Click Parking : " + event.target);
store.default.dispatch('setParking', event.target.options.attributes);
store.default.dispatch('setParkingCoords', event.target.getLatLng().lat.toFixed(5) + ' ' + event.target.getLatLng().lng.toFixed(5));
this.select(); this.select();
this.unwatch = store.default.watch( this.unwatch = store.default.watch(
function (state) { function (state) {
return state.Editable.data.parking; return state.Editable.data.parking;
}, },
() => { (state) => {
if (event.target instanceof L.ParkingSpot) { if(state === undefined ||
event.target.setStyle({color : '#3388ff'}); state.index !== Number(event.target.glueindex)) {
this.unwatch(); if (event.target instanceof L.ParkingSpot) {
} this.deselect();
this.unwatch();
}
}
} }
, ,
{ {
@ -180,9 +191,14 @@ L.ParkingSpot = L.Circle.extend({
return state.Editable.data.parking; return state.Editable.data.parking;
}, },
() => { () => {
event.target.setStyle({color : '#3388ff'}); if(state === undefined ||
this.unwatch(); state.index !== Number(event.target.glueindex)) {
} if (event.target instanceof L.ParkingSpot) {
this.deselect();
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.
@ -230,6 +246,7 @@ L.ParkingSpot = L.Circle.extend({
// element.extensions(); // element.extensions();
element.updateMiddleMarker(); element.updateMiddleMarker();
element.updateVertexFromDirection(); element.updateVertexFromDirection();
element.updateWheelPos();
} }
else if (element instanceof L.TaxiwaySegment) { else if (element instanceof L.TaxiwaySegment) {
if (element.begin === dragIndex) { if (element.begin === dragIndex) {

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

@ -59,6 +59,13 @@ const mutations = {
Vue.set(state.data.parking, 'number', parkingName) Vue.set(state.data.parking, 'number', parkingName)
}, },
'SET_EDIT_PARKING_HEADING' (state, heading) { 'SET_EDIT_PARKING_HEADING' (state, heading) {
while (heading >= 360) {
heading -= 360
}
while (heading < 0) {
heading += 360
}
Vue.set(state.data.parking, 'heading', heading) Vue.set(state.data.parking, 'heading', heading)
}, },
'SET_EDIT_PARKING_AIRLINES' (state, airlineCodes) { 'SET_EDIT_PARKING_AIRLINES' (state, airlineCodes) {
@ -70,6 +77,9 @@ const mutations = {
'SET_EDIT_PARKING_RADIUS' (state, radius) { 'SET_EDIT_PARKING_RADIUS' (state, radius) {
Vue.set(state.data.parking, 'radius', radius) Vue.set(state.data.parking, 'radius', radius)
}, },
'SET_EDIT_PARKING_COORDS' (state, coords) {
Vue.set(state.data.parking, 'coords', coords)
},
'SET_EDIT_ARC_NAME' (state, arcName) { 'SET_EDIT_ARC_NAME' (state, arcName) {
Vue.set(state.data.arc, 'name', arcName) Vue.set(state.data.arc, 'name', arcName)
}, },
@ -82,7 +92,7 @@ const mutations = {
'SET_EDIT_HOLDPOINTTYPE' (state, holdPointType) { 'SET_EDIT_HOLDPOINTTYPE' (state, holdPointType) {
Vue.set(state.data.node, 'holdPointType', holdPointType) Vue.set(state.data.node, 'holdPointType', holdPointType)
}, },
'SET_EDIT_COORDS' (state, coords) { 'SET_EDIT_NODE_COORDS' (state, coords) {
Vue.set(state.data.node, 'coords', coords) Vue.set(state.data.node, 'coords', coords)
}, },
'SET_EDIT_ISONRUNWAY' (state, isOnRunway) { 'SET_EDIT_ISONRUNWAY' (state, isOnRunway) {
@ -100,12 +110,21 @@ const actions = {
async setParking (context, parking) { async setParking (context, parking) {
context.commit(SET_EDIT_PARKING, parking) context.commit(SET_EDIT_PARKING, parking)
}, },
async setParkingRadius (context, radius) {
context.commit('SET_EDIT_PARKING_RADIUS', radius)
},
async setParkingHeading (context, heading) {
context.commit('SET_EDIT_PARKING_HEADING', heading)
},
async setParkingCoords (context, coords) {
context.commit('SET_EDIT_PARKING_COORDS', coords)
},
async setArc (context, arc) { async setArc (context, arc) {
context.commit(SET_EDIT_ARC, arc) context.commit(SET_EDIT_ARC, arc)
}, },
async setNode (context, node) { async setNode (context, node) {
context.commit('SET_EDIT_NODE', node.attributes) context.commit('SET_EDIT_NODE', node.attributes)
context.commit('SET_EDIT_COORDS', node.lat.toFixed(5) + ' ' + node.lng.toFixed(5)) context.commit('SET_EDIT_NODE_COORDS', node.lat.toFixed(5) + ' ' + node.lng.toFixed(5))
} }
} }