Added scroll-to-focus
This commit is contained in:
parent
03eeb122d6
commit
45e26b33af
1 changed files with 22 additions and 6 deletions
|
|
@ -1,9 +1,9 @@
|
||||||
<html>
|
<html>
|
||||||
<head>
|
<head>
|
||||||
<title>Video Streaming Demonstration</title>
|
<title>OpenFlexure Microscope API Demo</title>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<h1>Video Streaming Demonstration</h1>
|
<h1>OpenFlexure Microscope API Demo</h1>
|
||||||
<img src="{{ url_for('stream') }}">
|
<img src="{{ url_for('stream') }}">
|
||||||
<br>
|
<br>
|
||||||
|
|
||||||
|
|
@ -18,6 +18,10 @@
|
||||||
<br>
|
<br>
|
||||||
<input type="range" name="stageVelocityInput" min="50" max="200" value="100" oninput="updateStageVelocity(this.value);">
|
<input type="range" name="stageVelocityInput" min="50" max="200" value="100" oninput="updateStageVelocity(this.value);">
|
||||||
<input type="text" id="stageVelocityText" value="100" disabled>
|
<input type="text" id="stageVelocityText" value="100" disabled>
|
||||||
|
<br>
|
||||||
|
|
||||||
|
Scroll focus: <input type="checkbox" id="scrollFocusCheck" checked>
|
||||||
|
|
||||||
|
|
||||||
</body>
|
</body>
|
||||||
|
|
||||||
|
|
@ -87,6 +91,12 @@
|
||||||
setStagePositions(x_abs, y_abs, z_abs)
|
setStagePositions(x_abs, y_abs, z_abs)
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// Standard callback for user-controller movement
|
||||||
|
function keyMoveCallback(response, status) {
|
||||||
|
console.log(status, response);
|
||||||
|
updateStagePositions(response);
|
||||||
|
}
|
||||||
|
|
||||||
// Methods for input events
|
// Methods for input events
|
||||||
addEventListener("keydown", function (e) {
|
addEventListener("keydown", function (e) {
|
||||||
keysDown[e.keyCode] = true; //Add key to array
|
keysDown[e.keyCode] = true; //Add key to array
|
||||||
|
|
@ -118,10 +128,6 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
// Make a position request
|
// Make a position request
|
||||||
function keyMoveCallback(response, status) {
|
|
||||||
console.log(status, response);
|
|
||||||
updateStagePositions(response);
|
|
||||||
}
|
|
||||||
safeRequest("POST", "{{ url_for('position') }}", { "absolute": false, "x": x_rel, "y": y_rel, "z": z_rel}, keyMoveCallback)
|
safeRequest("POST", "{{ url_for('position') }}", { "absolute": false, "x": x_rel, "y": y_rel, "z": z_rel}, keyMoveCallback)
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
@ -130,6 +136,16 @@
|
||||||
addEventListener("keyup", function (e) {
|
addEventListener("keyup", function (e) {
|
||||||
delete keysDown[e.keyCode]; //Remove key from array
|
delete keysDown[e.keyCode]; //Remove key from array
|
||||||
}, false);
|
}, false);
|
||||||
|
|
||||||
|
window.addEventListener('wheel', function(e) {
|
||||||
|
multiplier = 1/100;
|
||||||
|
z_delta = e.deltaY * multiplier * focusVelocity;
|
||||||
|
console.log(z_delta);
|
||||||
|
if (document.getElementById("scrollFocusCheck").checked == true) {
|
||||||
|
// Make a position request
|
||||||
|
safeRequest("POST", "{{ url_for('position') }}", { "absolute": false, "z": z_delta}, keyMoveCallback)
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
// Methods for making requests
|
// Methods for making requests
|
||||||
function safeRequest(method, url, payload, callback) {
|
function safeRequest(method, url, payload, callback) {
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue