Great big ESLint
This commit is contained in:
Joel Collins
parent
051eabbdc3
commit
ebcb938da1
48 changed files with 3890 additions and 2536 deletions
|
|
@ -1,98 +1,144 @@
|
|||
<template>
|
||||
<div id="paneNavigate">
|
||||
|
||||
<ul uk-accordion="multiple: true; animation: false">
|
||||
<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 class="uk-open">
|
||||
<a class="uk-accordion-title" href="#">Move-to</a>
|
||||
<div class="uk-accordion-content">
|
||||
|
||||
<form @submit.prevent="handleSubmit">
|
||||
<div class="uk-grid-small uk-child-width-1-3" uk-grid>
|
||||
<div id="paneNavigate">
|
||||
<ul uk-accordion="multiple: true; animation: false">
|
||||
<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</label>
|
||||
<label class="uk-form-label" for="form-stacked-text"
|
||||
>x-y step size</label
|
||||
>
|
||||
<div class="uk-form-controls">
|
||||
<input v-model="setPosition.x" class="uk-input uk-form-small" type="number" name="inputPositionX">
|
||||
<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">y</label>
|
||||
<label class="uk-form-label" for="form-stacked-text"
|
||||
>z step size</label
|
||||
>
|
||||
<div class="uk-form-controls">
|
||||
<input v-model="setPosition.y" class="uk-input uk-form-small" type="number" name="inputPositionY">
|
||||
<input
|
||||
v-model="stepZz"
|
||||
class="uk-input uk-form-width-medium uk-form-small"
|
||||
type="number"
|
||||
name="inputStepZz"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
|
||||
<li class="uk-open">
|
||||
<a class="uk-accordion-title" href="#">Move-to</a>
|
||||
<div class="uk-accordion-content">
|
||||
<form @submit.prevent="handleSubmit">
|
||||
<div class="uk-grid-small 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="setPosition.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="setPosition.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="setPosition.z"
|
||||
class="uk-input uk-form-small"
|
||||
type="number"
|
||||
name="inputPositionZx"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<p>
|
||||
<button
|
||||
class="uk-button uk-button-primary uk-form-small uk-float-right uk-width-1-1"
|
||||
>
|
||||
Move
|
||||
</button>
|
||||
</p>
|
||||
</form>
|
||||
</div>
|
||||
</li>
|
||||
|
||||
<!--Show autofocus if default plugin is enabled-->
|
||||
<li
|
||||
v-if="this.$store.state.apiState.plugin.includes('default_autofocus')"
|
||||
class="uk-open"
|
||||
>
|
||||
<a class="uk-accordion-title" href="#">Autofocus</a>
|
||||
<div class="uk-accordion-content">
|
||||
<div v-if="isAutofocusing">
|
||||
<progressBar />
|
||||
</div>
|
||||
|
||||
<div
|
||||
class="uk-grid-small uk-child-width-1-3"
|
||||
:hidden="isAutofocusing"
|
||||
uk-grid
|
||||
>
|
||||
<div>
|
||||
<label class="uk-form-label" for="form-stacked-text">z</label>
|
||||
<div class="uk-form-controls">
|
||||
<input v-model="setPosition.z" class="uk-input uk-form-small" type="number" name="inputPositionZx">
|
||||
</div>
|
||||
<button
|
||||
class="uk-button uk-button-default uk-form-small uk-float-right uk-width-1-1"
|
||||
@click="runFastAutofocus(2000, 300)"
|
||||
>
|
||||
Fast
|
||||
</button>
|
||||
</div>
|
||||
<div>
|
||||
<button
|
||||
class="uk-button uk-button-default uk-form-small uk-float-right uk-width-1-1"
|
||||
@click="runAutofocus([-60, -30, 0, 30, 60])"
|
||||
>
|
||||
Medium
|
||||
</button>
|
||||
</div>
|
||||
<div>
|
||||
<button
|
||||
class="uk-button uk-button-default uk-form-small uk-float-right uk-width-1-1"
|
||||
@click="runAutofocus([-20, -10, 0, 10, 20])"
|
||||
>
|
||||
Fine
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<p>
|
||||
<button class="uk-button uk-button-primary uk-form-small uk-float-right uk-width-1-1">Move</button>
|
||||
</p>
|
||||
</form>
|
||||
|
||||
</div>
|
||||
</li>
|
||||
|
||||
<!--Show autofocus if default plugin is enabled-->
|
||||
<li v-if="this.$store.state.apiState.plugin.includes('default_autofocus')" class="uk-open">
|
||||
<a class="uk-accordion-title" href="#">Autofocus</a>
|
||||
<div class="uk-accordion-content">
|
||||
|
||||
<div v-if="isAutofocusing">
|
||||
<progressBar/>
|
||||
</div>
|
||||
|
||||
<div class="uk-grid-small uk-child-width-1-3" v-bind:hidden="isAutofocusing" uk-grid>
|
||||
<div>
|
||||
<button v-on:click="runFastAutofocus(2000, 300);" class="uk-button uk-button-default uk-form-small uk-float-right uk-width-1-1">Fast</button>
|
||||
</div>
|
||||
<div>
|
||||
<button v-on:click="runAutofocus([-60,-30,0,30,60]);" class="uk-button uk-button-default uk-form-small uk-float-right uk-width-1-1">Medium</button>
|
||||
</div>
|
||||
<div>
|
||||
<button v-on:click="runAutofocus([-20,-10,0,10,20]);" class="uk-button uk-button-default uk-form-small uk-float-right uk-width-1-1">Fine</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</li>
|
||||
|
||||
</ul>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import axios from 'axios'
|
||||
import progressBar from "../genericComponents/progressBar"
|
||||
import axios from "axios";
|
||||
import progressBar from "../genericComponents/progressBar";
|
||||
|
||||
// Key Codes
|
||||
const keyCodes = {
|
||||
|
|
@ -104,17 +150,17 @@ const keyCodes = {
|
|||
down: 40,
|
||||
enter: 13,
|
||||
esc: 27
|
||||
}
|
||||
};
|
||||
|
||||
// Export main app
|
||||
export default {
|
||||
name: 'paneNavigate',
|
||||
name: "PaneNavigate",
|
||||
|
||||
components: {
|
||||
progressBar
|
||||
},
|
||||
|
||||
data: function () {
|
||||
data: function() {
|
||||
return {
|
||||
keysDown: {},
|
||||
stepXy: 200,
|
||||
|
|
@ -122,40 +168,57 @@ export default {
|
|||
setPosition: this.$store.state.apiState.stage.position,
|
||||
isAutofocusing: false,
|
||||
moveLock: false
|
||||
};
|
||||
},
|
||||
|
||||
computed: {
|
||||
positionApiUri: function() {
|
||||
return this.$store.getters.uri + "/stage/position";
|
||||
},
|
||||
autofocusApiUri: function() {
|
||||
return this.$store.getters.uri + "/plugin/default/autofocus/autofocus";
|
||||
},
|
||||
fastAutofocusApiUri: function() {
|
||||
return (
|
||||
this.$store.getters.uri + "/plugin/default/autofocus/fast_autofocus"
|
||||
);
|
||||
}
|
||||
},
|
||||
|
||||
created: function () {
|
||||
window.addEventListener('keydown', this.keyDownMonitor);
|
||||
created: function() {
|
||||
window.addEventListener("keydown", this.keyDownMonitor);
|
||||
window.addEventListener("keyup", this.keyUpMonitor);
|
||||
window.addEventListener('wheel', this.wheelMonitor);
|
||||
window.addEventListener("wheel", this.wheelMonitor);
|
||||
},
|
||||
|
||||
mounted() {
|
||||
// A global signal listener to perform a move action
|
||||
this.$root.$on('globalMoveEvent', (x, y, z, absolute) => {
|
||||
this.moveRequest(x, y, z, absolute)
|
||||
})
|
||||
this.$root.$on("globalMoveEvent", (x, y, z, absolute) => {
|
||||
this.moveRequest(x, y, z, absolute);
|
||||
});
|
||||
},
|
||||
|
||||
beforeDestroy () {
|
||||
beforeDestroy() {
|
||||
// Remove global signal listener to perform a move action
|
||||
this.$root.$off('globalMoveEvent')
|
||||
this.$root.$off("globalMoveEvent");
|
||||
},
|
||||
|
||||
destroyed: function () {
|
||||
window.removeEventListener('keydown', this.keyDownMonitor);
|
||||
destroyed: function() {
|
||||
window.removeEventListener("keydown", this.keyDownMonitor);
|
||||
window.removeEventListener("keyup", this.keyUpMonitor);
|
||||
window.removeEventListener('wheel', this.wheelMonitor);
|
||||
window.removeEventListener("wheel", this.wheelMonitor);
|
||||
},
|
||||
|
||||
methods: {
|
||||
// Handle global mouse wheel events to be associated with navigation
|
||||
wheelMonitor: function(event) {
|
||||
// Only capture scroll if the event target's parent contains the "scrollTarget" class
|
||||
if (event.target.parentNode.classList.contains("scrollTarget") || event.target.classList.contains("scrollTarget")) {
|
||||
var z_rel = (event.deltaY)/100 * this.stepZz
|
||||
this.moveRequest(0, 0, z_rel, false)
|
||||
if (
|
||||
event.target.parentNode.classList.contains("scrollTarget") ||
|
||||
event.target.classList.contains("scrollTarget")
|
||||
) {
|
||||
var z_rel = (event.deltaY / 100) * this.stepZz;
|
||||
this.moveRequest(0, 0, z_rel, false);
|
||||
}
|
||||
},
|
||||
|
||||
|
|
@ -164,9 +227,15 @@ export default {
|
|||
this.keysDown[event.keyCode] = true; //Add key to array
|
||||
|
||||
// Convert keyCode dict into a list of key codes
|
||||
var keyCodeList = Object.keys(keyCodes).map(function(key){return keyCodes[key];});
|
||||
var keyCodeList = Object.keys(keyCodes).map(function(key) {
|
||||
return keyCodes[key];
|
||||
});
|
||||
|
||||
if (!(event.target instanceof HTMLInputElement) && !(event.target.classList.contains('lightbox-link')) && keyCodeList.includes(event.keyCode)) {
|
||||
if (
|
||||
!(event.target instanceof HTMLInputElement) &&
|
||||
!event.target.classList.contains("lightbox-link") &&
|
||||
keyCodeList.includes(event.keyCode)
|
||||
) {
|
||||
//console.log(this.keysDown)
|
||||
// Calculate movement array
|
||||
var x_rel = 0;
|
||||
|
|
@ -192,7 +261,7 @@ export default {
|
|||
}
|
||||
|
||||
// Make a position request
|
||||
this.moveRequest(x_rel, y_rel, z_rel, false)
|
||||
this.moveRequest(x_rel, y_rel, z_rel, false);
|
||||
}
|
||||
},
|
||||
|
||||
|
|
@ -200,105 +269,102 @@ export default {
|
|||
delete this.keysDown[event.keyCode]; //Remove key from array
|
||||
},
|
||||
|
||||
handleSubmit: function(event) {
|
||||
handleSubmit: function() {
|
||||
this.moveRequest(
|
||||
this.setPosition.x,
|
||||
this.setPosition.y,
|
||||
this.setPosition.z,
|
||||
true,
|
||||
)
|
||||
true
|
||||
);
|
||||
},
|
||||
|
||||
moveRequest: function(x, y, z, absolute) {
|
||||
console.log(`Sending move request of ${x}, ${y}, ${z}`)
|
||||
console.log(`Sending move request of ${x}, ${y}, ${z}`);
|
||||
// If not movement-locked
|
||||
if (!this.moveLock) {
|
||||
// Lock move requests
|
||||
this.moveLock = true
|
||||
this.moveLock = true;
|
||||
|
||||
// Send move request
|
||||
axios.post(this.positionApiUri, {
|
||||
x: x,
|
||||
y: y,
|
||||
z: z,
|
||||
absolute: absolute
|
||||
})
|
||||
.then(response => {
|
||||
this.$store.dispatch('updateState'); // Update store state
|
||||
this.setPosition = response.data.stage.position; // Update boxes from response
|
||||
})
|
||||
.catch(error => {
|
||||
this.modalError(error) // Let mixin handle error
|
||||
})
|
||||
.then(() => {
|
||||
this.moveLock = false // Release the move lock
|
||||
})
|
||||
axios
|
||||
.post(this.positionApiUri, {
|
||||
x: x,
|
||||
y: y,
|
||||
z: z,
|
||||
absolute: absolute
|
||||
})
|
||||
.then(response => {
|
||||
this.$store.dispatch("updateState"); // Update store state
|
||||
this.setPosition = response.data.stage.position; // Update boxes from response
|
||||
})
|
||||
.catch(error => {
|
||||
this.modalError(error); // Let mixin handle error
|
||||
})
|
||||
.then(() => {
|
||||
this.moveLock = false; // Release the move lock
|
||||
});
|
||||
}
|
||||
},
|
||||
|
||||
runAutofocus: function(dz) {
|
||||
if (!this.moveLock) {
|
||||
// Lock move requests
|
||||
this.moveLock = true
|
||||
this.isAutofocusing = true
|
||||
axios.post(this.autofocusApiUri, {dz: dz})
|
||||
.then(response => {
|
||||
console.log("Autofocus Task ID: " + response.data.id)
|
||||
// Start the store polling TaskId for success
|
||||
return this.$store.dispatch('pollTask', [response.data.id, null, null])
|
||||
})
|
||||
.then(() => {
|
||||
console.log("Successfully finished autofocus")
|
||||
})
|
||||
.catch(error => {
|
||||
this.modalError(error) // Let mixin handle error
|
||||
})
|
||||
.finally(() => {
|
||||
console.log("Cleaning up after autofocus.")
|
||||
this.isAutofocusing = false;
|
||||
this.moveLock = false // Release the move lock
|
||||
})
|
||||
this.moveLock = true;
|
||||
this.isAutofocusing = true;
|
||||
axios
|
||||
.post(this.autofocusApiUri, { dz: dz })
|
||||
.then(response => {
|
||||
console.log("Autofocus Task ID: " + response.data.id);
|
||||
// Start the store polling TaskId for success
|
||||
return this.$store.dispatch("pollTask", [
|
||||
response.data.id,
|
||||
null,
|
||||
null
|
||||
]);
|
||||
})
|
||||
.then(() => {
|
||||
console.log("Successfully finished autofocus");
|
||||
})
|
||||
.catch(error => {
|
||||
this.modalError(error); // Let mixin handle error
|
||||
})
|
||||
.finally(() => {
|
||||
console.log("Cleaning up after autofocus.");
|
||||
this.isAutofocusing = false;
|
||||
this.moveLock = false; // Release the move lock
|
||||
});
|
||||
}
|
||||
},
|
||||
|
||||
runFastAutofocus: function(dz, backlash) {
|
||||
if (!this.moveLock) {
|
||||
// Lock move requests
|
||||
this.moveLock = true
|
||||
this.isAutofocusing = true
|
||||
axios.post(this.fastAutofocusApiUri, {dz: dz, backlash: backlash})
|
||||
.then(response => {
|
||||
console.log("Autofocus Task ID: " + response.data.id)
|
||||
// Start the store polling TaskId for success
|
||||
return this.$store.dispatch('pollTask', [response.data.id, null, null])
|
||||
})
|
||||
.then(() => {
|
||||
console.log("Successfully finished autofocus")
|
||||
})
|
||||
.catch(error => {
|
||||
this.modalError(error) // Let mixin handle error
|
||||
})
|
||||
.finally(() => {
|
||||
console.log("Cleaning up after autofocus.")
|
||||
this.isAutofocusing = false
|
||||
this.moveLock = false // Release the move lock
|
||||
})
|
||||
this.moveLock = true;
|
||||
this.isAutofocusing = true;
|
||||
axios
|
||||
.post(this.fastAutofocusApiUri, { dz: dz, backlash: backlash })
|
||||
.then(response => {
|
||||
console.log("Autofocus Task ID: " + response.data.id);
|
||||
// Start the store polling TaskId for success
|
||||
return this.$store.dispatch("pollTask", [
|
||||
response.data.id,
|
||||
null,
|
||||
null
|
||||
]);
|
||||
})
|
||||
.then(() => {
|
||||
console.log("Successfully finished autofocus");
|
||||
})
|
||||
.catch(error => {
|
||||
this.modalError(error); // Let mixin handle error
|
||||
})
|
||||
.finally(() => {
|
||||
console.log("Cleaning up after autofocus.");
|
||||
this.isAutofocusing = false;
|
||||
this.moveLock = false; // Release the move lock
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
},
|
||||
|
||||
computed: {
|
||||
positionApiUri: function () {
|
||||
return this.$store.getters.uri + "/stage/position"
|
||||
},
|
||||
autofocusApiUri: function () {
|
||||
return this.$store.getters.uri + "/plugin/default/autofocus/autofocus"
|
||||
},
|
||||
fastAutofocusApiUri: function () {
|
||||
return this.$store.getters.uri + "/plugin/default/autofocus/fast_autofocus"
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
</script>
|
||||
};
|
||||
</script>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue