eddy/zeiss_utils
1
0
Fork 0
mirror of https://github.com/eddyem/zeiss_utils.git synced 2026-03-20 00:30:56 +03:00
Code Issues Packages Projects Releases Wiki Activity

add web-interface

Browse Source
This commit is contained in:
eddyem
2019-10-23 17:49:32 +03:00
parent cbec6c1f63
commit d348acd7f9
7 changed files with 322 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

49
Z1000_focus/html/focus.html Normal file
View File

@@ -0,0 +1,49 @@
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<style type="text/css">
body{text-align:center;}
.shadow{
position:absolute;
text-align:center;
vertical-align: center;
top:0;
display: none;
left:0;
width:100%;
height:100%;
background-color: lightGrey;
opacity: 0.5;
}
.B{font-weight: bold;}
.big{font-size: 200%;}
.M{margin-bottom: 5px;}
.C{text-align:center; padding: 10px;}
.btm{margin-top: 15px; color: red; position: fixed; bottom: 10px;
width: 50%; left: 25%; font-size: 200%;}
</style>
<script src="focus.js" type="text/javascript" language="javascript"></script>
<title>Zeiss-1000 focusing</title>
</head>
<body onload="Foc.Run();">
<noscript><h1>Turn ON JavaScript!!!</h1></noscript>
<div class="C" id="container">
<div class="C M big" onclick="Foc.upd();">
Current F=<span id="curFval"></span>
</div>
<div class="C M big">
<label for="speed">Speed: </label>
<input style="width: 50px" id="speed" type="number" value="1" min="1" max="4" onchange="Foc.chSpd(this.value);">
<button class="B" id="F-" onmousedown="Foc.Move(-1);" onmouseup="Foc.Stop();">-</button>
<!--<input style="width: 300px" id="focSlider" type="range" min="0" max="100" step="1" value="50" readonly>-->
<button class="B" id="F+" onmousedown="Foc.Move(1);" onmouseup="Foc.Stop();">+</button>&nbsp;&nbsp;
</div>
<div class="C big">
<button class="B" id="Fstop" onclick="Foc.Stop();">Stop</button>
<input style="width: 130px" id="focSet" type="number" lang="en-150" value="2" min="0.1" max="65" step="0.01"> <!-- onchange="Foc.Ch(this.value);"-->
<button class="B" id="Fset" onclick="Foc.SetFocus();">Set</button>
</div>
</div>
<div class="shadow" id="shadow">
</body>
</html>

143
Z1000_focus/html/focus.js Normal file
View File

@@ -0,0 +1,143 @@
Foc = function(){
// const REQ_PATH=window.location.hostname+":4444/";
const REQ_PATH="http://dasha.sao.ru:4444/";
var minVal=0.01, maxVal=76.5, curVal = 3.0, curSpeed = 1;
var timeout_upd, timeout_msg;
// ID
function $(id){ return document.getElementById(id); }
// Request: req_SRT - request string, _onOK - function to run if all OK
function sendrequest(req_STR, _onOK){
var request = new XMLHttpRequest(), timeout_id;
request.open("POST", REQ_PATH + req_STR, true);
request.onreadystatechange=function(){
if (request.readyState == 4){
if (request.status == 200){
clearTimeout(timeout_id);
if(_onOK) _onOK(request);
}
else{
clearTimeout(timeout_id);
blockMsg("Request Error");
}
}
}
request.send(req_STR);
timeout_id = setTimeout(function(){blockMsg("Request timeout");}, 3000);
}
// show message blocking all
function blockMsg(txt, bgcolor){
$("shadow").style.display = "block";
if(!bgcolor) bgcolor = "red";
$("shadow").innerHTML = txt.replace("\n", "<br>");
}
// parse answer for status request
function chkStatus(req){
var msg = req.responseText;
console.log("Get status message: " + msg);
if(msg == "OK"){
$("shadow").innerHTML = "";
$("shadow").style.display = "none";
}else blockMsg(msg);
};
// parse answer for command requests
function chkCmd(req){
var msg = req.responseText;
console.log("Get cmd answer: " + msg);
if(msg != "OK") alert(msg);
}
/*
function ch_status(txt, bgcolor){
function rmmsg(){clearTimeout(timeout_msg);document.body.removeChild($("_msg_div"));}
clearTimeout(timeout_msg);
if(!bgcolor) bgcolor = "red";
if(!$("_msg_div")){ // ÄÏÂÁ×ÌÑÅÍ ÂÌÏË ÄÌÑ ×Ù×ÏÄÁ ÓÏÏÂÝÅÎÉÊ
var div = document.createElement('div'), s = div.style;
div.id = "_msg_div";
div.class = "btm";
document.body.appendChild(div);
};
$("_msg_div").style.backgroundColor = bgcolor;
$("_msg_div").innerHTML = txt.replace("\n", "<br>");
$("_msg_div").addEventListener("click", rmmsg, true)
timeout_msg = setTimeout(rmmsg, 5000);
}*/
var first = true;
function chF(req){
console.log(req.responseText);
curVal = Number(req.responseText);
if(first){
$('focSet').value = curVal;
first = false;
}
$('curFval').innerHTML = curVal;
//$('focSlider').value = curVal;
}
function getdata(){
clearTimeout(timeout_upd);
sendrequest("focus", chF);
sendrequest("status", chkStatus);
timeout_upd = setTimeout(getdata, 1000);
}
// init all things
function FirstRun(){
blockMsg("init", "black");
// first we should get all params
chSpd($('speed').value);
var F = $('focSet');
F.value = curVal;
F.min = minVal;
F.max = maxVal;
getdata();
}
// send new focus value
function SetFocus(){
var set = $('focSet').value;
if(set < minVal || set > maxVal){
alert("Wrong focus value");
return;
}
console.log("Set focus: " + set);
sendrequest("goto="+set, chkCmd);
}
function Move(dir){
console.log("Move to " + ((dir > 0) ? "+" : "-") + " with speed " + curSpeed);
var targspeeds = [ 130, 400, 800, 1200 ];
var cmd = "targspeed=" + ((dir > 0) ? "" : "-") + targspeeds[curSpeed-1];
sendrequest(cmd, chkCmd);
console.log("send request " + cmd);
}
function Stop(){
sendrequest("stop", chkCmd);
console.log("Stop");
}
// slider or input field changed
function change(val){
if(val < minVal) val = minVal;
else if(val > maxVal) val = maxVal;
//$('focSlider').value = val;
$('focSet').value = val;
console.log("Chfocval: " + val);
}
function chSpd(val){
if(val < 1) val = 1;
else if(val > 4) val = 4;
$('speed').value = val;
curSpeed = val;
console.log("Chspd: " + val);
}
// update value in input field by current
function update(){
$('focSet').value = curVal;
}
return{
Run: FirstRun,
SetFocus: SetFocus,
Move: Move,
Stop: Stop,
Ch: change,
chSpd: chSpd,
upd: update,
}
}();