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

Dpad button ids, add warning in positionControl.vue about gloabl listeners, deduplicate listener for capture.

Browse source
This commit is contained in:
Julian Stirling 2025-11-11 10:24:19 +00:00
parent 3aa6f75f61
commit 616e93ef97
3 changed files with 27 additions and 13 deletions
Download patch file Download diff file Expand all files Collapse all files

1
webapp/src/components/tabContentComponents/controlComponents/paneControl.vue
View file

@ -10,7 +10,6 @@
action="capture_jpeg" action="capture_jpeg"
:submit-data="{ stream_name: 'main' }" :submit-data="{ stream_name: 'main' }"
:submit-label="'Low Resolution'" :submit-label="'Low Resolution'"
:submit-on-event="'globalCaptureEvent'"
@response="handleCaptureResponse" @response="handleCaptureResponse"
@error="modalError" @error="modalError"
/> />

7
webapp/src/components/tabContentComponents/controlComponents/positionControl.vue
View file

@ -1,3 +1,10 @@
<!-- This is the main position component for the control tab.
Do not reuse this component until we remove global listeners for move.
This component shows themotor positions in a closed accordion along with the move
and zero position buttons. It also includes the d-pad.
-->
<template> <template>
<div> <div>
<ul uk-accordion="multiple: true"> <ul uk-accordion="multiple: true">

32
webapp/src/components/tabContentComponents/controlComponents/stageControlButtons.vue
View file

@ -1,27 +1,35 @@
<template> <template>
<div class="uk-flex uk-flex-center uk-flex-middle uk-margin"> <div class="uk-flex uk-flex-center uk-flex-middle uk-margin">
<div class="dpad-grid"> <div class="dpad-grid">
<button class="uk-button uk-button-primary dpad-btn" @click="move(0, 1, 0)"> <button id="up-button" class="uk-button uk-button-primary dpad-btn" @click="move(0, 1, 0)">
<span class="material-symbols-outlined sync-icon"> arrow_upward </span> <span class="material-symbols-outlined sync-icon"> arrow_upward </span>
</button> </button>
<button class="uk-button uk-button-primary dpad-btn" @click="move(-1, 0, 0)"> <button id="left-button" class="uk-button uk-button-primary dpad-btn" @click="move(-1, 0, 0)">
<span class="material-symbols-outlined sync-icon"> arrow_back </span> <span class="material-symbols-outlined sync-icon"> arrow_back </span>
</button> </button>
<button class="uk-button uk-button-primary dpad-btn" @click="move(1, 0, 0)"> <button id="right-button" class="uk-button uk-button-primary dpad-btn" @click="move(1, 0, 0)">
<span class="material-symbols-outlined sync-icon"> arrow_forward </span> <span class="material-symbols-outlined sync-icon"> arrow_forward </span>
</button> </button>
<button class="uk-button uk-button-primary dpad-btn" @click="move(0, -1, 0)"> <button id="down-button" class="uk-button uk-button-primary dpad-btn" @click="move(0, -1, 0)">
<span class="material-symbols-outlined sync-icon"> arrow_downward </span> <span class="material-symbols-outlined sync-icon"> arrow_downward </span>
</button> </button>
<button class="uk-button uk-button-primary dpad-btn" @click="move(0, 0, -1)"> <button
id="focus-out-button"
class="uk-button uk-button-primary dpad-btn"
@click="move(0, 0, -1)"
>
<span class="material-symbols-outlined sync-icon"> remove </span> <span class="material-symbols-outlined sync-icon"> remove </span>
</button> </button>
<button class="uk-button uk-button-primary dpad-btn" @click="move(0, 0, 1)"> <button
id="focus-in-button"
class="uk-button uk-button-primary dpad-btn"
@click="move(0, 0, 1)"
>
<span class="material-symbols-outlined sync-icon"> add </span> <span class="material-symbols-outlined sync-icon"> add </span>
</button> </button>
</div> </div>
@ -50,27 +58,27 @@ export default {
} }
/* Place buttons within grid */ /* Place buttons within grid */
.dpad-grid button:nth-child(1) { .dpad-grid #up-button {
grid-column: 2; grid-column: 2;
grid-row: 1; grid-row: 1;
} }
.dpad-grid button:nth-child(2) { .dpad-grid #left-button {
grid-column: 1; grid-column: 1;
grid-row: 2; grid-row: 2;
} }
.dpad-grid button:nth-child(3) { .dpad-grid #right-button {
grid-column: 3; grid-column: 3;
grid-row: 2; grid-row: 2;
} }
.dpad-grid button:nth-child(4) { .dpad-grid #down-button {
grid-column: 2; grid-column: 2;
grid-row: 3; grid-row: 3;
} }
.dpad-grid button:nth-child(5) { .dpad-grid #focus-out-button {
grid-column: 1; grid-column: 1;
grid-row: 5; grid-row: 5;
} }
.dpad-grid button:nth-child(6) { .dpad-grid #focus-in-button {
grid-column: 3; grid-column: 3;
grid-row: 5; grid-row: 5;
} }