Added click navigation
This commit is contained in:
parent
61ea32efb8
commit
0c305295d3
3 changed files with 21 additions and 4 deletions
|
|
@ -16,8 +16,18 @@ export default {
|
|||
|
||||
methods: {
|
||||
clickmonitor: function(event) {
|
||||
// TODO: Add logic
|
||||
console.log("The preview was clicked!");
|
||||
// Calculate steps from event coordinates and store config FOV
|
||||
var xCoordinate = event.offsetX;
|
||||
var yCoordinate = event.offsetY;
|
||||
|
||||
var xRelative = (0.5*event.target.offsetWidth - xCoordinate)/event.target.offsetWidth;
|
||||
var yRelative = (0.5*event.target.offsetHeight - yCoordinate)/event.target.offsetHeight;
|
||||
|
||||
var xSteps = xRelative * this.$store.state.apiConfig.fov[0];
|
||||
var ySteps = yRelative * this.$store.state.apiConfig.fov[1];
|
||||
|
||||
// Emit a signal to move, acted on by panelNavigate.vue
|
||||
this.$root.$emit('globalMoveEvent', xSteps, ySteps, 0, false)
|
||||
}
|
||||
},
|
||||
|
||||
|
|
@ -32,8 +42,8 @@ export default {
|
|||
|
||||
<style scoped lang="less">
|
||||
.streamDisplay img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
text-align: center;
|
||||
object-fit: contain
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -98,6 +98,13 @@ export default {
|
|||
}
|
||||
},
|
||||
|
||||
mounted() {
|
||||
// A global signal listener to perform a move action
|
||||
this.$root.$on('globalMoveEvent', (x, y, z, absolute) => {
|
||||
this.moveRequest(x, y, z, absolute)
|
||||
})
|
||||
},
|
||||
|
||||
methods: {
|
||||
// Handle global mouse wheel events to be associated with navigation
|
||||
wheelMonitor: function(event) {
|
||||
|
|
|
|||
|
|
@ -25,7 +25,7 @@ export default {
|
|||
computed: {
|
||||
disableIfDisconnected: function () {
|
||||
return {
|
||||
'uk-disabled': !this.$store.state.connected
|
||||
'uk-disabled': !this.$store.getters.ready
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue