rahix/openflexure-microscope-server
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Added step size and position-reading boxes

Browse source
This commit is contained in:
Joel Collins 2019-02-11 16:57:52 +00:00
parent a89aec6c57
commit 28692cc375
1 changed files with 75 additions and 2 deletions
Download patch file Download diff file Expand all files Collapse all files

77
src/components/paneNavigate.vue
View file

@ -1,6 +1,68 @@
<template>
<div id="paneNavigate">
Navigate
<div v-if="$store.state.connected" id="paneNavigate">
<ul uk-accordion>
<li>
<a class="uk-accordion-title" href="#">Configure</a>
<div class="uk-accordion-content">
<div class="uk-child-width-1-2" uk-grid>
<div>
<label class="uk-form-label" for="form-stacked-text">x-y step size</label>
<div class="uk-form-controls">
<input v-model="stepXy" class="uk-input uk-form-width-medium uk-form-small" type="number" name="inputStepXy">
</div>
</div>
<div>
<label class="uk-form-label" for="form-stacked-text">z step size</label>
<div class="uk-form-controls">
<input v-model="stepZz" class="uk-input uk-form-width-medium uk-form-small" type="number" name="inputStepZz">
</div>
</div>
</div>
</div>
</li>
<li>
<a class="uk-accordion-title" href="#">Move-to</a>
<div class="uk-accordion-content">
<form @submit.prevent="handleSubmit">
<div class="uk-child-width-1-3" uk-grid>
<div>
<label class="uk-form-label" for="form-stacked-text">x</label>
<div class="uk-form-controls">
<input v-model="$store.state.apiState.stage.position.x" class="uk-input uk-form-small" type="number" name="inputPositionX">
</div>
</div>
<div>
<label class="uk-form-label" for="form-stacked-text">y</label>
<div class="uk-form-controls">
<input v-model="$store.state.apiState.stage.position.y" class="uk-input uk-form-small" type="number" name="inputPositionY">
</div>
</div>
<div>
<label class="uk-form-label" for="form-stacked-text">z</label>
<div class="uk-form-controls">
<input v-model="$store.state.apiState.stage.position.z" class="uk-input uk-form-small" type="number" name="inputPositionZx">
</div>
</div>
</div>
<p>
<button class="uk-button uk-button-default uk-form-small uk-float-right uk-width-1-1">Move</button>
</p>
</form>
</div>
</li>
</ul>
<p>
TODO: Basic keyboard control by adding event listeners to this pane (e.g. v-on:keyup.)
<br>
@ -18,6 +80,13 @@
export default {
name: 'paneNavigate',
data: function () {
return {
stepXy: 50,
stepZz: 20
}
},
methods: {
// Handle global mouse wheel events to be associated with navigation
wheelmonitor: function(event) {
@ -41,6 +110,10 @@ export default {
console.log("A key was pressed:");
console.log(event.keyCode)
}
},
handleSubmit: function(event) {
console.log("Position form submitted!")
}
},