mirror of
https://github.com/jomjol/AI-on-the-edge-device.git
synced 2025-12-11 22:16:56 +03:00
nightly
This commit is contained in:
jomjol
419
sd-card/html/alignment.html
Normal file
419
sd-card/html/alignment.html
Normal file
@@ -0,0 +1,419 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8"/>
|
||||
<title>Make Alignment</title>
|
||||
</head>
|
||||
|
||||
<div class="body-content">
|
||||
|
||||
<div id="createrefernce">
|
||||
<div style="padding-left: 30px">
|
||||
<h3>Define Alignment Structure in Reference Image</h3>
|
||||
|
||||
<div style="padding-left: 30px">
|
||||
<table>
|
||||
<tr>
|
||||
<td>
|
||||
<canvas id="canvas" crossorigin></canvas>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
<table>
|
||||
<tr>
|
||||
<tr>
|
||||
<td>
|
||||
<select id="index" name="reference" onchange="ChangeSelection()">
|
||||
<option value="0" selected>Reference 0</option>
|
||||
<option value="1" >Reference 1</option>
|
||||
</select>
|
||||
Storage path/name: <input type="text" name="name" id="name">
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<td>
|
||||
<table>
|
||||
<tr>
|
||||
<td>
|
||||
x: <input type="number" name="refx" id="refx" step=1 onchange="valuemanualchanged()">
|
||||
</td>
|
||||
<td>
|
||||
dx: <input type="number" name="refdx" id="refdx" step=1 onchange="valuemanualchanged()">
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
y: <input type="number" name="refy" id="refy" step=1 onchange="valuemanualchanged()">
|
||||
</td>
|
||||
<td>
|
||||
dy: <input type="number" name="refdy" id="refdy" step=1 onchange="valuemanualchanged()">
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
<input type="button" value="Update Reference" onclick="CutOutReference()">
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</td>
|
||||
</tr>
|
||||
<table>
|
||||
<tr>
|
||||
<td>
|
||||
Original Image
|
||||
</td>
|
||||
<td>
|
||||
Reference Image
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
<img id="img_ref_org" src = "/img_tmp/ref_zw_org.jpg">
|
||||
</td>
|
||||
<td>
|
||||
<img id="img_ref" src = "/img_tmp/ref_zw.jpg">
|
||||
</td>
|
||||
<td>
|
||||
<input type="button" value="Enhance Contrast" onclick="EnhanceContrast()">
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
|
||||
<tr>
|
||||
<td>
|
||||
<input type="submit" name="saveroi" onclick="SaveToConfig()" value="Save to Config.ini">
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script type="text/javascript" src="./readconfig.js"></script>
|
||||
|
||||
<script language="JavaScript">
|
||||
var canvas = document.getElementById('canvas'),
|
||||
ctx = canvas.getContext('2d'),
|
||||
imageObj = new Image(),
|
||||
rect = {},
|
||||
drag = false,
|
||||
aktindex = 0,
|
||||
refInfo,
|
||||
enhanceCon = false;
|
||||
basepath = "http://192.168.178.26";
|
||||
basepath = "";
|
||||
|
||||
function ChangeSelection(){
|
||||
aktindex = parseInt(document.getElementById("index").value);
|
||||
UpdateReference();
|
||||
}
|
||||
|
||||
function SaveToConfig(){
|
||||
refInfo["name"] = document.getElementById("name").value;
|
||||
refInfo["x"] = document.getElementById("refx").value;
|
||||
refInfo["y"] = document.getElementById("refy").value;
|
||||
refInfo["dx"] = document.getElementById("refdx").value;
|
||||
refInfo["dy"] = document.getElementById("refdy").value;
|
||||
UpdateConfig(refInfo, aktindex, enhanceCon, basepath);
|
||||
// location.reload();
|
||||
}
|
||||
|
||||
function EnhanceContrast(){
|
||||
refInfo["name"] = document.getElementById("name").value;
|
||||
refInfo["x"] = document.getElementById("refx").value;
|
||||
refInfo["y"] = document.getElementById("refy").value;
|
||||
refInfo["dx"] = document.getElementById("refdx").value;
|
||||
refInfo["dy"] = document.getElementById("refdy").value;
|
||||
|
||||
enhanceCon = true;
|
||||
MakeContrastImageZW(refInfo, enhanceCon, basepath);
|
||||
var url = basepath + "/fileserver" + "/img_tmp/ref_zw.jpg?" + Date.now();
|
||||
document.getElementById("img_ref").src = url;
|
||||
var url = basepath + "/fileserver" + "/img_tmp/ref_zw_org.jpg?" + Date.now();
|
||||
document.getElementById("img_ref_org").src = url;
|
||||
}
|
||||
|
||||
function UpdateReference(){
|
||||
refInfo = GetCoordinates(aktindex, basepath);
|
||||
document.getElementById("img_ref").onload = function () {
|
||||
document.getElementById("refdx").value = this.width;
|
||||
document.getElementById("refdy").value = this.height;
|
||||
refInfo["dx"] = this.width;
|
||||
refInfo["dy"] = this.height;
|
||||
rect.w = document.getElementById("refdx").value;
|
||||
rect.h = document.getElementById("refdy").value;
|
||||
draw();
|
||||
}
|
||||
|
||||
var url = basepath + "/fileserver" + "/img_tmp/ref_zw_org.jpg?" + Date.now();
|
||||
document.getElementById("img_ref_org").src = url;
|
||||
var url = basepath + "/fileserver" + "/img_tmp/ref_zw.jpg?" + Date.now();
|
||||
document.getElementById("img_ref").src = url;
|
||||
|
||||
document.getElementById("name").value = refInfo["name"];
|
||||
document.getElementById("refx").value = refInfo["x"];
|
||||
document.getElementById("refy").value = refInfo["y"];
|
||||
rect.startX = document.getElementById("refx").value;
|
||||
rect.startY = document.getElementById("refy").value;
|
||||
draw();
|
||||
}
|
||||
|
||||
function ParseIni(_basepath) {
|
||||
loadConfigJS(_basepath);
|
||||
ParseReference();
|
||||
UpdateReference();
|
||||
}
|
||||
|
||||
function dataURLtoBlob(dataurl) {
|
||||
var arr = dataurl.split(','), mime = arr[0].match(/:(.*?);/)[1],
|
||||
bstr = atob(arr[1]), n = bstr.length, u8arr = new Uint8Array(n);
|
||||
while(n--){
|
||||
u8arr[n] = bstr.charCodeAt(n);
|
||||
}
|
||||
return new Blob([u8arr], {type:mime});
|
||||
}
|
||||
|
||||
function SaveReference()
|
||||
{
|
||||
|
||||
if (confirm("Are you sure you want to update \"reference.jpg\"?")) {
|
||||
var xhttp = new XMLHttpRequest();
|
||||
|
||||
/* first delete the old firmware */
|
||||
xhttp.onreadystatechange = function() {
|
||||
if (xhttp.readyState == 4) {
|
||||
if (xhttp.status == 200) {
|
||||
/* keine Reaktion, damit sich das Dokument nicht ändert */
|
||||
} else if (xhttp.status == 0) {
|
||||
alert("Server closed the connection abruptly!");
|
||||
location.reload()
|
||||
} else {
|
||||
alert(xhttp.status + " Error!\n" + xhttp.responseText);
|
||||
location.reload()
|
||||
}
|
||||
}
|
||||
};
|
||||
xhttp.open("POST", basepath + "/delete/config/reference.jpg", false);
|
||||
xhttp.send();
|
||||
/* ----------------------------- */
|
||||
|
||||
|
||||
xhttp.onreadystatechange = function() {
|
||||
if (xhttp.readyState == 4) {
|
||||
if (xhttp.status == 200) {
|
||||
alert("Update \"reference.jpg\" successfull!\n\nTo make it active you need to reboot.")
|
||||
document.reload();
|
||||
} else if (xhttp.status == 0) {
|
||||
alert("Server closed the connection abruptly!");
|
||||
location.reload()
|
||||
} else {
|
||||
alert(xhttp.status + " Error!\n" + xhttp.responseText);
|
||||
location.reload()
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
upload_path = basepath + "/upload/config/reference.jpg";
|
||||
|
||||
var canvas = document.getElementById("canvas");
|
||||
|
||||
var JPEG_QUALITY=0.5;
|
||||
var dataUrl = canvas.toDataURL('image/jpeg', JPEG_QUALITY);
|
||||
var rtn = dataURLtoBlob(dataUrl);
|
||||
|
||||
xhttp.open("POST", upload_path, true);
|
||||
xhttp.send(rtn);
|
||||
}
|
||||
}
|
||||
|
||||
function loadCanvas(dataURL) {
|
||||
var canvas = document.getElementById('canvas');
|
||||
var context = canvas.getContext('2d');
|
||||
|
||||
imageObj.onload = function() {
|
||||
canvas.width = this.width;
|
||||
canvas.height = this.height;
|
||||
drawImage();
|
||||
};
|
||||
|
||||
imageObj.src = dataURL;
|
||||
}
|
||||
|
||||
|
||||
function getCoords(elem) { // crossbrowser version
|
||||
var box = elem.getBoundingClientRect();
|
||||
var body = document.body;
|
||||
var docEl = document.documentElement;
|
||||
var scrollTop = window.pageYOffset || docEl.scrollTop || body.scrollTop;
|
||||
var scrollLeft = window.pageXOffset || docEl.scrollLeft || body.scrollLeft;
|
||||
var clientTop = docEl.clientTop || body.clientTop || 0;
|
||||
var clientLeft = docEl.clientLeft || body.clientLeft || 0;
|
||||
var top = box.top + scrollTop - clientTop;
|
||||
var left = box.left + scrollLeft - clientLeft;
|
||||
return { top: Math.round(top), left: Math.round(left) };
|
||||
}
|
||||
|
||||
|
||||
|
||||
function init() {
|
||||
canvas.addEventListener('mousedown', mouseDown, false);
|
||||
canvas.addEventListener('mouseup', mouseUp, false);
|
||||
canvas.addEventListener('mousemove', mouseMove, false);
|
||||
loadCanvas(basepath + "/fileserver/config/reference.jpg");
|
||||
ParseIni(basepath);
|
||||
drawImage();
|
||||
}
|
||||
function drawImage(){
|
||||
var canvas = document.getElementById('canvas');
|
||||
var context = canvas.getContext('2d');
|
||||
|
||||
context.clearRect(0,0,imageObj.width,imageObj.height);
|
||||
context.save();
|
||||
context.drawImage(imageObj, 0, 0);
|
||||
// context.restore();
|
||||
}
|
||||
|
||||
|
||||
function CutOutReference(){
|
||||
refInfo["x"] = document.getElementById("refx").value;
|
||||
refInfo["y"] = document.getElementById("refy").value;
|
||||
refInfo["dx"] = document.getElementById("refdx").value;
|
||||
refInfo["dy"] = document.getElementById("refdy").value;
|
||||
MakeRefZW(refInfo, basepath);
|
||||
var url = basepath + "/fileserver" + "/img_tmp/ref_zw.jpg?" + Date.now();
|
||||
document.getElementById("img_ref_org").src = url;
|
||||
var url = basepath + "/fileserver" + "/img_tmp/ref_zw_org.jpg?" + Date.now();
|
||||
document.getElementById("img_ref").src = url;
|
||||
draw();
|
||||
}
|
||||
|
||||
function drawGrid(){
|
||||
var canvas = document.getElementById('canvas');
|
||||
var ctx = canvas.getContext('2d');
|
||||
w = canvas.width;
|
||||
h = canvas.height;
|
||||
ctx.save();
|
||||
ctx.strokeStyle = '#00FF00';
|
||||
|
||||
for (i = h/2; i < h; i += 100)
|
||||
{
|
||||
ctx.moveTo(0, i);
|
||||
ctx.lineTo(w, i);
|
||||
ctx.stroke();
|
||||
ctx.moveTo(0, h-i);
|
||||
ctx.lineTo(w, h-i);
|
||||
ctx.stroke();
|
||||
}
|
||||
for (i = w/2; i < w; i += 100)
|
||||
{
|
||||
ctx.moveTo(i, 0);
|
||||
ctx.lineTo(i, h);
|
||||
ctx.stroke();
|
||||
ctx.moveTo(w-i, 0);
|
||||
ctx.lineTo(w-i, h);
|
||||
ctx.stroke(); }
|
||||
// ctx.restore();
|
||||
}
|
||||
|
||||
|
||||
function draw() {
|
||||
var canvas = document.getElementById('canvas');
|
||||
var context = canvas.getContext('2d');
|
||||
context.drawImage(imageObj, 0, 0);
|
||||
lw = 4
|
||||
context.lineWidth = lw;
|
||||
context.strokeStyle = "#FF0000";
|
||||
var x0 = parseInt(rect.startX) - parseInt(lw/2);
|
||||
var y0 = parseInt(rect.startY) - parseInt(lw/2);
|
||||
var dx = parseInt(rect.w) + parseInt(lw);
|
||||
var dy = parseInt(rect.h) + parseInt(lw);
|
||||
context.strokeRect(x0, y0, dx, dy);
|
||||
}
|
||||
|
||||
function getCoords(elem) { // crossbrowser version
|
||||
var box = elem.getBoundingClientRect();
|
||||
var body = document.body;
|
||||
var docEl = document.documentElement;
|
||||
var scrollTop = window.pageYOffset || docEl.scrollTop || body.scrollTop;
|
||||
var scrollLeft = window.pageXOffset || docEl.scrollLeft || body.scrollLeft;
|
||||
var clientTop = docEl.clientTop || body.clientTop || 0;
|
||||
var clientLeft = docEl.clientLeft || body.clientLeft || 0;
|
||||
var top = box.top + scrollTop - clientTop;
|
||||
var left = box.left + scrollLeft - clientLeft;
|
||||
return { top: Math.round(top), left: Math.round(left) };
|
||||
}
|
||||
|
||||
function mouseDown(e) {
|
||||
zw = getCoords(this)
|
||||
rect.startX = e.pageX - zw.left;
|
||||
rect.startY = e.pageY - zw.top;
|
||||
document.getElementById("refx").value = rect.startX;
|
||||
document.getElementById("refy").value = rect.startY;
|
||||
drag = true;
|
||||
}
|
||||
|
||||
function mouseUp() {
|
||||
drag = false;
|
||||
if (rect.w < 0) {
|
||||
rect.w = -rect.w
|
||||
rect.startX-=rect.w
|
||||
}
|
||||
if (rect.h < 0) {
|
||||
rect.h = -rect.h
|
||||
rect.startY-=rect.h
|
||||
}
|
||||
document.getElementById("refdx").value = rect.w;
|
||||
document.getElementById("refdy").value = rect.h;
|
||||
document.getElementById("refx").value = rect.startX;
|
||||
document.getElementById("refy").value = rect.startY;
|
||||
}
|
||||
|
||||
function mouseMove(e) {
|
||||
if (drag) {
|
||||
zw = getCoords(this)
|
||||
rect.w = (e.pageX - zw.left) - rect.startX;
|
||||
rect.h = (e.pageY - zw.top) - rect.startY ;
|
||||
document.getElementById("refdx").value = rect.w;
|
||||
document.getElementById("refdy").value = rect.h;
|
||||
draw();
|
||||
}
|
||||
else {
|
||||
draw();
|
||||
var canvas = document.getElementById('canvas');
|
||||
var context = canvas.getContext('2d');
|
||||
|
||||
zw = getCoords(this);
|
||||
x = e.pageX - zw.left;
|
||||
y = e.pageY - zw.top;
|
||||
|
||||
context.lineWidth = 2;
|
||||
context.strokeStyle = "#00FF00";
|
||||
context.beginPath();
|
||||
context.moveTo(0,y);
|
||||
context.lineTo(canvas.width, y);
|
||||
context.moveTo(x, 0);
|
||||
context.lineTo(x, canvas.height);
|
||||
context.stroke();
|
||||
}
|
||||
}
|
||||
|
||||
function valuemanualchanged(){
|
||||
if (!drag) {
|
||||
rect.w = document.getElementById("refdx").value;
|
||||
rect.h = document.getElementById("refdy").value;
|
||||
rect.startX = document.getElementById("refx").value;
|
||||
rect.startY = document.getElementById("refy").value;
|
||||
draw();
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
init();
|
||||
</script>
|
||||
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
418
sd-card/html/alignment_define.html
Normal file
418
sd-card/html/alignment_define.html
Normal file
@@ -0,0 +1,418 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8"/>
|
||||
<title>Make Alignment</title>
|
||||
</head>
|
||||
|
||||
<div class="body-content">
|
||||
|
||||
<div id="createrefernce">
|
||||
<div style="padding-left: 30px">
|
||||
<h3>Define Alignment Structure in Reference Image</h3>
|
||||
|
||||
<div style="padding-left: 30px">
|
||||
<table>
|
||||
<tr>
|
||||
<td>
|
||||
<canvas id="canvas" crossorigin></canvas>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
<table>
|
||||
<tr>
|
||||
<tr>
|
||||
<td>
|
||||
<select id="index" name="reference" onchange="ChangeSelection()">
|
||||
<option value="0" selected>Reference 0</option>
|
||||
<option value="1" >Reference 1</option>
|
||||
</select>
|
||||
Storage path/name: <input type="text" name="name" id="name">
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<td>
|
||||
<table>
|
||||
<tr>
|
||||
<td>
|
||||
x: <input type="number" name="refx" id="refx" step=1 onchange="valuemanualchanged()">
|
||||
</td>
|
||||
<td>
|
||||
dx: <input type="number" name="refdx" id="refdx" step=1 onchange="valuemanualchanged()">
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
y: <input type="number" name="refy" id="refy" step=1 onchange="valuemanualchanged()">
|
||||
</td>
|
||||
<td>
|
||||
dy: <input type="number" name="refdy" id="refdy" step=1 onchange="valuemanualchanged()">
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
<input type="button" value="Update Reference" onclick="CutOutReference()">
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</td>
|
||||
</tr>
|
||||
<table>
|
||||
<tr>
|
||||
<td>
|
||||
Original Image
|
||||
</td>
|
||||
<td>
|
||||
Reference Image
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
<img id="img_ref_org" src = "/img_tmp/ref_zw_org.jpg">
|
||||
</td>
|
||||
<td>
|
||||
<img id="img_ref" src = "/img_tmp/ref_zw.jpg">
|
||||
</td>
|
||||
<td>
|
||||
<input type="button" value="Enhance Contrast" onclick="EnhanceContrast()">
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
|
||||
<tr>
|
||||
<td>
|
||||
<input type="submit" name="saveroi" onclick="SaveToConfig()" value="Save to Config.ini">
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script type="text/javascript" src="./readconfig.js"></script>
|
||||
|
||||
<script language="JavaScript">
|
||||
var canvas = document.getElementById('canvas'),
|
||||
ctx = canvas.getContext('2d'),
|
||||
imageObj = new Image(),
|
||||
rect = {},
|
||||
drag = false,
|
||||
aktindex = 0,
|
||||
refInfo,
|
||||
enhanceCon = false;
|
||||
basepath = "http://192.168.178.26";
|
||||
|
||||
function ChangeSelection(){
|
||||
aktindex = parseInt(document.getElementById("index").value);
|
||||
UpdateReference();
|
||||
}
|
||||
|
||||
function SaveToConfig(){
|
||||
refInfo["name"] = document.getElementById("name").value;
|
||||
refInfo["x"] = document.getElementById("refx").value;
|
||||
refInfo["y"] = document.getElementById("refy").value;
|
||||
refInfo["dx"] = document.getElementById("refdx").value;
|
||||
refInfo["dy"] = document.getElementById("refdy").value;
|
||||
UpdateConfig(refInfo, aktindex, enhanceCon, basepath);
|
||||
// location.reload();
|
||||
}
|
||||
|
||||
function EnhanceContrast(){
|
||||
refInfo["name"] = document.getElementById("name").value;
|
||||
refInfo["x"] = document.getElementById("refx").value;
|
||||
refInfo["y"] = document.getElementById("refy").value;
|
||||
refInfo["dx"] = document.getElementById("refdx").value;
|
||||
refInfo["dy"] = document.getElementById("refdy").value;
|
||||
|
||||
enhanceCon = true;
|
||||
MakeContrastImageZW(refInfo, enhanceCon, basepath);
|
||||
var url = basepath + "/fileserver" + "/img_tmp/ref_zw.jpg?" + Date.now();
|
||||
document.getElementById("img_ref").src = url;
|
||||
var url = basepath + "/fileserver" + "/img_tmp/ref_zw_org.jpg?" + Date.now();
|
||||
document.getElementById("img_ref_org").src = url;
|
||||
}
|
||||
|
||||
function UpdateReference(){
|
||||
refInfo = GetCoordinates(aktindex, basepath);
|
||||
document.getElementById("img_ref").onload = function () {
|
||||
document.getElementById("refdx").value = this.width;
|
||||
document.getElementById("refdy").value = this.height;
|
||||
refInfo["dx"] = this.width;
|
||||
refInfo["dy"] = this.height;
|
||||
rect.w = document.getElementById("refdx").value;
|
||||
rect.h = document.getElementById("refdy").value;
|
||||
draw();
|
||||
}
|
||||
|
||||
var url = basepath + "/fileserver" + "/img_tmp/ref_zw_org.jpg?" + Date.now();
|
||||
document.getElementById("img_ref_org").src = url;
|
||||
var url = basepath + "/fileserver" + "/img_tmp/ref_zw.jpg?" + Date.now();
|
||||
document.getElementById("img_ref").src = url;
|
||||
|
||||
document.getElementById("name").value = refInfo["name"];
|
||||
document.getElementById("refx").value = refInfo["x"];
|
||||
document.getElementById("refy").value = refInfo["y"];
|
||||
rect.startX = document.getElementById("refx").value;
|
||||
rect.startY = document.getElementById("refy").value;
|
||||
draw();
|
||||
}
|
||||
|
||||
function ParseIni(_basepath) {
|
||||
loadConfigJS(_basepath);
|
||||
ParseReference();
|
||||
UpdateReference();
|
||||
}
|
||||
|
||||
function dataURLtoBlob(dataurl) {
|
||||
var arr = dataurl.split(','), mime = arr[0].match(/:(.*?);/)[1],
|
||||
bstr = atob(arr[1]), n = bstr.length, u8arr = new Uint8Array(n);
|
||||
while(n--){
|
||||
u8arr[n] = bstr.charCodeAt(n);
|
||||
}
|
||||
return new Blob([u8arr], {type:mime});
|
||||
}
|
||||
|
||||
function SaveReference()
|
||||
{
|
||||
|
||||
if (confirm("Are you sure you want to update \"reference.jpg\"?")) {
|
||||
var xhttp = new XMLHttpRequest();
|
||||
|
||||
/* first delete the old firmware */
|
||||
xhttp.onreadystatechange = function() {
|
||||
if (xhttp.readyState == 4) {
|
||||
if (xhttp.status == 200) {
|
||||
/* keine Reaktion, damit sich das Dokument nicht ändert */
|
||||
} else if (xhttp.status == 0) {
|
||||
alert("Server closed the connection abruptly!");
|
||||
location.reload()
|
||||
} else {
|
||||
alert(xhttp.status + " Error!\n" + xhttp.responseText);
|
||||
location.reload()
|
||||
}
|
||||
}
|
||||
};
|
||||
xhttp.open("POST", basepath + "/delete/config/reference.jpg", false);
|
||||
xhttp.send();
|
||||
/* ----------------------------- */
|
||||
|
||||
|
||||
xhttp.onreadystatechange = function() {
|
||||
if (xhttp.readyState == 4) {
|
||||
if (xhttp.status == 200) {
|
||||
alert("Update \"reference.jpg\" successfull!\n\nTo make it active you need to reboot.")
|
||||
document.reload();
|
||||
} else if (xhttp.status == 0) {
|
||||
alert("Server closed the connection abruptly!");
|
||||
location.reload()
|
||||
} else {
|
||||
alert(xhttp.status + " Error!\n" + xhttp.responseText);
|
||||
location.reload()
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
upload_path = basepath + "/upload/config/reference.jpg";
|
||||
|
||||
var canvas = document.getElementById("canvas");
|
||||
|
||||
var JPEG_QUALITY=0.5;
|
||||
var dataUrl = canvas.toDataURL('image/jpeg', JPEG_QUALITY);
|
||||
var rtn = dataURLtoBlob(dataUrl);
|
||||
|
||||
xhttp.open("POST", upload_path, true);
|
||||
xhttp.send(rtn);
|
||||
}
|
||||
}
|
||||
|
||||
function loadCanvas(dataURL) {
|
||||
var canvas = document.getElementById('canvas');
|
||||
var context = canvas.getContext('2d');
|
||||
|
||||
imageObj.onload = function() {
|
||||
canvas.width = this.width;
|
||||
canvas.height = this.height;
|
||||
drawImage();
|
||||
};
|
||||
|
||||
imageObj.src = dataURL;
|
||||
}
|
||||
|
||||
|
||||
function getCoords(elem) { // crossbrowser version
|
||||
var box = elem.getBoundingClientRect();
|
||||
var body = document.body;
|
||||
var docEl = document.documentElement;
|
||||
var scrollTop = window.pageYOffset || docEl.scrollTop || body.scrollTop;
|
||||
var scrollLeft = window.pageXOffset || docEl.scrollLeft || body.scrollLeft;
|
||||
var clientTop = docEl.clientTop || body.clientTop || 0;
|
||||
var clientLeft = docEl.clientLeft || body.clientLeft || 0;
|
||||
var top = box.top + scrollTop - clientTop;
|
||||
var left = box.left + scrollLeft - clientLeft;
|
||||
return { top: Math.round(top), left: Math.round(left) };
|
||||
}
|
||||
|
||||
|
||||
|
||||
function init() {
|
||||
canvas.addEventListener('mousedown', mouseDown, false);
|
||||
canvas.addEventListener('mouseup', mouseUp, false);
|
||||
canvas.addEventListener('mousemove', mouseMove, false);
|
||||
loadCanvas(basepath + "/fileserver/config/reference.jpg");
|
||||
ParseIni(basepath);
|
||||
drawImage();
|
||||
}
|
||||
function drawImage(){
|
||||
var canvas = document.getElementById('canvas');
|
||||
var context = canvas.getContext('2d');
|
||||
|
||||
context.clearRect(0,0,imageObj.width,imageObj.height);
|
||||
context.save();
|
||||
context.drawImage(imageObj, 0, 0);
|
||||
// context.restore();
|
||||
}
|
||||
|
||||
|
||||
function CutOutReference(){
|
||||
refInfo["x"] = document.getElementById("refx").value;
|
||||
refInfo["y"] = document.getElementById("refy").value;
|
||||
refInfo["dx"] = document.getElementById("refdx").value;
|
||||
refInfo["dy"] = document.getElementById("refdy").value;
|
||||
MakeRefZW(refInfo, basepath);
|
||||
var url = basepath + "/fileserver" + "/img_tmp/ref_zw.jpg?" + Date.now();
|
||||
document.getElementById("img_ref_org").src = url;
|
||||
var url = basepath + "/fileserver" + "/img_tmp/ref_zw_org.jpg?" + Date.now();
|
||||
document.getElementById("img_ref").src = url;
|
||||
draw();
|
||||
}
|
||||
|
||||
function drawGrid(){
|
||||
var canvas = document.getElementById('canvas');
|
||||
var ctx = canvas.getContext('2d');
|
||||
w = canvas.width;
|
||||
h = canvas.height;
|
||||
ctx.save();
|
||||
ctx.strokeStyle = '#00FF00';
|
||||
|
||||
for (i = h/2; i < h; i += 100)
|
||||
{
|
||||
ctx.moveTo(0, i);
|
||||
ctx.lineTo(w, i);
|
||||
ctx.stroke();
|
||||
ctx.moveTo(0, h-i);
|
||||
ctx.lineTo(w, h-i);
|
||||
ctx.stroke();
|
||||
}
|
||||
for (i = w/2; i < w; i += 100)
|
||||
{
|
||||
ctx.moveTo(i, 0);
|
||||
ctx.lineTo(i, h);
|
||||
ctx.stroke();
|
||||
ctx.moveTo(w-i, 0);
|
||||
ctx.lineTo(w-i, h);
|
||||
ctx.stroke(); }
|
||||
// ctx.restore();
|
||||
}
|
||||
|
||||
|
||||
function draw() {
|
||||
var canvas = document.getElementById('canvas');
|
||||
var context = canvas.getContext('2d');
|
||||
context.drawImage(imageObj, 0, 0);
|
||||
lw = 4
|
||||
context.lineWidth = lw;
|
||||
context.strokeStyle = "#FF0000";
|
||||
var x0 = parseInt(rect.startX) - parseInt(lw/2);
|
||||
var y0 = parseInt(rect.startY) - parseInt(lw/2);
|
||||
var dx = parseInt(rect.w) + parseInt(lw);
|
||||
var dy = parseInt(rect.h) + parseInt(lw);
|
||||
context.strokeRect(x0, y0, dx, dy);
|
||||
}
|
||||
|
||||
function getCoords(elem) { // crossbrowser version
|
||||
var box = elem.getBoundingClientRect();
|
||||
var body = document.body;
|
||||
var docEl = document.documentElement;
|
||||
var scrollTop = window.pageYOffset || docEl.scrollTop || body.scrollTop;
|
||||
var scrollLeft = window.pageXOffset || docEl.scrollLeft || body.scrollLeft;
|
||||
var clientTop = docEl.clientTop || body.clientTop || 0;
|
||||
var clientLeft = docEl.clientLeft || body.clientLeft || 0;
|
||||
var top = box.top + scrollTop - clientTop;
|
||||
var left = box.left + scrollLeft - clientLeft;
|
||||
return { top: Math.round(top), left: Math.round(left) };
|
||||
}
|
||||
|
||||
function mouseDown(e) {
|
||||
zw = getCoords(this)
|
||||
rect.startX = e.pageX - zw.left;
|
||||
rect.startY = e.pageY - zw.top;
|
||||
document.getElementById("refx").value = rect.startX;
|
||||
document.getElementById("refy").value = rect.startY;
|
||||
drag = true;
|
||||
}
|
||||
|
||||
function mouseUp() {
|
||||
drag = false;
|
||||
if (rect.w < 0) {
|
||||
rect.w = -rect.w
|
||||
rect.startX-=rect.w
|
||||
}
|
||||
if (rect.h < 0) {
|
||||
rect.h = -rect.h
|
||||
rect.startY-=rect.h
|
||||
}
|
||||
document.getElementById("refdx").value = rect.w;
|
||||
document.getElementById("refdy").value = rect.h;
|
||||
document.getElementById("refx").value = rect.startX;
|
||||
document.getElementById("refy").value = rect.startY;
|
||||
}
|
||||
|
||||
function mouseMove(e) {
|
||||
if (drag) {
|
||||
zw = getCoords(this)
|
||||
rect.w = (e.pageX - zw.left) - rect.startX;
|
||||
rect.h = (e.pageY - zw.top) - rect.startY ;
|
||||
document.getElementById("refdx").value = rect.w;
|
||||
document.getElementById("refdy").value = rect.h;
|
||||
draw();
|
||||
}
|
||||
else {
|
||||
draw();
|
||||
var canvas = document.getElementById('canvas');
|
||||
var context = canvas.getContext('2d');
|
||||
|
||||
zw = getCoords(this);
|
||||
x = e.pageX - zw.left;
|
||||
y = e.pageY - zw.top;
|
||||
|
||||
context.lineWidth = 2;
|
||||
context.strokeStyle = "#00FF00";
|
||||
context.beginPath();
|
||||
context.moveTo(0,y);
|
||||
context.lineTo(canvas.width, y);
|
||||
context.moveTo(x, 0);
|
||||
context.lineTo(x, canvas.height);
|
||||
context.stroke();
|
||||
}
|
||||
}
|
||||
|
||||
function valuemanualchanged(){
|
||||
if (!drag) {
|
||||
rect.w = document.getElementById("refdx").value;
|
||||
rect.h = document.getElementById("refdy").value;
|
||||
rect.startX = document.getElementById("refx").value;
|
||||
rect.startY = document.getElementById("refy").value;
|
||||
draw();
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
init();
|
||||
</script>
|
||||
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
78
sd-card/html/edit_config_neu.html
Normal file
78
sd-card/html/edit_config_neu.html
Normal file
@@ -0,0 +1,78 @@
|
||||
<html>
|
||||
<body>
|
||||
|
||||
<table>
|
||||
<tr><td>Config.ini:</td></tr>
|
||||
<tr>
|
||||
<td colspan="3">
|
||||
<textarea id="inputTextToSave" cols="80" rows="25"></textarea>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><button onclick="saveTextAsFile()">Update Config.ini</button></td>
|
||||
</tr>
|
||||
</table>
|
||||
|
||||
<script type="text/javascript" src="./readconfig.js"></script>
|
||||
|
||||
<script type="text/javascript">
|
||||
|
||||
|
||||
function LoadConfigNeu() {
|
||||
loadConfigJS();
|
||||
document.getElementById("inputTextToSave").value = getConfig();
|
||||
}
|
||||
|
||||
function saveTextAsFile()
|
||||
{
|
||||
if (confirm("Are you sure you want to update \"config.ini\"?")) {
|
||||
var xhttp = new XMLHttpRequest();
|
||||
|
||||
/* first delete the old firmware */
|
||||
xhttp.onreadystatechange = function() {
|
||||
if (xhttp.readyState == 4) {
|
||||
if (xhttp.status == 200) {
|
||||
/* keine Reaktion, damit sich das Dokument nicht ändert */
|
||||
} else if (xhttp.status == 0) {
|
||||
alert("Server closed the connection abruptly!");
|
||||
location.reload()
|
||||
} else {
|
||||
alert(xhttp.status + " Error!\n" + xhttp.responseText);
|
||||
location.reload()
|
||||
}
|
||||
}
|
||||
};
|
||||
xhttp.open("POST", "/delete/config/config.ini", false);
|
||||
xhttp.send();
|
||||
/* ----------------------------- */
|
||||
|
||||
var textToSave = document.getElementById("inputTextToSave").value;
|
||||
|
||||
xhttp.onreadystatechange = function() {
|
||||
if (xhttp.readyState == 4) {
|
||||
if (xhttp.status == 200) {
|
||||
alert("Update \"config.ini\" successfull!\n\nTo make it active you need to reboot.")
|
||||
document.reload();
|
||||
} else if (xhttp.status == 0) {
|
||||
alert("Server closed the connection abruptly!");
|
||||
location.reload()
|
||||
} else {
|
||||
alert(xhttp.status + " Error!\n" + xhttp.responseText);
|
||||
location.reload()
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
upload_path = "/upload/config/config.ini";
|
||||
|
||||
xhttp.open("POST", upload_path, true);
|
||||
xhttp.send(textToSave);
|
||||
}
|
||||
}
|
||||
|
||||
LoadConfigNeu();
|
||||
|
||||
</script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
249
sd-card/html/image_ref.html
Normal file
249
sd-card/html/image_ref.html
Normal file
@@ -0,0 +1,249 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8"/>
|
||||
<title>Make refernce</title>
|
||||
|
||||
<link rel="stylesheet" type="text/css" href="/static/configurator/site.css"/>
|
||||
|
||||
</head>
|
||||
|
||||
<body onScroll="document.cookie='ypos=' + window.pageYOffset">
|
||||
|
||||
<div class="body-content">
|
||||
|
||||
<div id="createrefernce">
|
||||
|
||||
|
||||
<script language="JavaScript">
|
||||
function createscroll(){
|
||||
var zw = document.cookie
|
||||
var n1 = zw.indexOf('ypos=')
|
||||
var n2 = zw.indexOf(";", n1)
|
||||
var a = zw.substr(n1+5, n2-n1-5)
|
||||
//window.alert(zw + " -- "+ a + " -- " + + n1 + " -- " + n2)
|
||||
window.scrollTo(0, a)
|
||||
}
|
||||
</script>
|
||||
|
||||
<div style="padding-left: 30px">
|
||||
|
||||
<h3>Create Reference out of Raw Image</h3>
|
||||
|
||||
<div style="padding-left: 30px">
|
||||
|
||||
<form method="post">
|
||||
<input type="hidden" name="csrfmiddlewaretoken" value="lxUFaiYFqzjTUDz63phwtZsErDkz9WjIHPsw56IM1nOYkkvljkwbA2TuKvP97GJy">
|
||||
<table>
|
||||
<tr>
|
||||
<td>
|
||||
|
||||
<table>
|
||||
<tr>
|
||||
<td>
|
||||
<h4>Pre-rotate Angle</h4>
|
||||
</td>
|
||||
<td>
|
||||
<input type="number" id="prerotateangle" name="prerotateangle" value=179.0 min="-360" max="360">°
|
||||
<input type="button" value="Rotate" onclick="drawRotated()">
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
<h4>Fine Alignment</h4>
|
||||
</td>
|
||||
<td>
|
||||
<input type="number" id="finerotate" name="finerotate" value=0.0 min="-1" max="1" step="0.2" onchange="drawRotated()">°
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</td>
|
||||
|
||||
|
||||
</tr>
|
||||
</table>
|
||||
|
||||
<table>
|
||||
<tr>
|
||||
<td>
|
||||
<canvas id="canvas"></canvas>
|
||||
</td>
|
||||
<td>
|
||||
<input type="hidden" name="degree" id="degree" value="0">
|
||||
<input type="button" value="Save Reference Image" onclick="SaveReference()">
|
||||
</td>
|
||||
|
||||
</tr>
|
||||
</table>
|
||||
</form>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script language="JavaScript">
|
||||
var canvas = document.getElementById('canvas'),
|
||||
ctx = canvas.getContext('2d'),
|
||||
imageObj = new Image();
|
||||
|
||||
function dataURLtoBlob(dataurl) {
|
||||
var arr = dataurl.split(','), mime = arr[0].match(/:(.*?);/)[1],
|
||||
bstr = atob(arr[1]), n = bstr.length, u8arr = new Uint8Array(n);
|
||||
while(n--){
|
||||
u8arr[n] = bstr.charCodeAt(n);
|
||||
}
|
||||
return new Blob([u8arr], {type:mime});
|
||||
}
|
||||
|
||||
function SaveReference()
|
||||
{
|
||||
|
||||
if (confirm("Are you sure you want to update \"reference2.jpg\"?")) {
|
||||
var xhttp = new XMLHttpRequest();
|
||||
|
||||
/* first delete the old firmware */
|
||||
xhttp.onreadystatechange = function() {
|
||||
if (xhttp.readyState == 4) {
|
||||
if (xhttp.status == 200) {
|
||||
/* keine Reaktion, damit sich das Dokument nicht ändert */
|
||||
} else if (xhttp.status == 0) {
|
||||
alert("Server closed the connection abruptly!");
|
||||
location.reload()
|
||||
} else {
|
||||
alert(xhttp.status + " Error!\n" + xhttp.responseText);
|
||||
location.reload()
|
||||
}
|
||||
}
|
||||
};
|
||||
xhttp.open("POST", "http://192.168.178.22/delete/config/reference2.jpg", false);
|
||||
xhttp.send();
|
||||
/* ----------------------------- */
|
||||
|
||||
|
||||
xhttp.onreadystatechange = function() {
|
||||
if (xhttp.readyState == 4) {
|
||||
if (xhttp.status == 200) {
|
||||
alert("Update \"reference2.jpg\" successfull!\n\nTo make it active you need to reboot.")
|
||||
document.reload();
|
||||
} else if (xhttp.status == 0) {
|
||||
alert("Server closed the connection abruptly!");
|
||||
location.reload()
|
||||
} else {
|
||||
alert(xhttp.status + " Error!\n" + xhttp.responseText);
|
||||
location.reload()
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
upload_path = "http://192.168.178.22/upload/config/reference2.jpg";
|
||||
|
||||
var canvas = document.getElementById("canvas");
|
||||
|
||||
var JPEG_QUALITY=0.5;
|
||||
var dataUrl = canvas.toDataURL('image/jpeg', JPEG_QUALITY);
|
||||
var rtn = dataURLtoBlob(dataUrl);
|
||||
|
||||
xhttp.open("POST", upload_path, true);
|
||||
xhttp.send(rtn);
|
||||
}
|
||||
}
|
||||
|
||||
function loadCanvas(dataURL) {
|
||||
var canvas = document.getElementById('canvas');
|
||||
var context = canvas.getContext('2d');
|
||||
|
||||
imageObj.onload = function() {
|
||||
canvas.width = this.width;
|
||||
canvas.height = this.height;
|
||||
drawRotated();
|
||||
createscroll();
|
||||
};
|
||||
|
||||
imageObj.src = dataURL;
|
||||
}
|
||||
|
||||
|
||||
function getCoords(elem) { // crossbrowser version
|
||||
var box = elem.getBoundingClientRect();
|
||||
var body = document.body;
|
||||
var docEl = document.documentElement;
|
||||
var scrollTop = window.pageYOffset || docEl.scrollTop || body.scrollTop;
|
||||
var scrollLeft = window.pageXOffset || docEl.scrollLeft || body.scrollLeft;
|
||||
var clientTop = docEl.clientTop || body.clientTop || 0;
|
||||
var clientLeft = docEl.clientLeft || body.clientLeft || 0;
|
||||
var top = box.top + scrollTop - clientTop;
|
||||
var left = box.left + scrollLeft - clientLeft;
|
||||
return { top: Math.round(top), left: Math.round(left) };
|
||||
}
|
||||
|
||||
|
||||
|
||||
function init() {
|
||||
// alert("load image");
|
||||
loadCanvas("http://192.168.178.22/fileserver/img_tmp/raw.jpg");
|
||||
drawRotated();
|
||||
}
|
||||
|
||||
function drawRotated(){
|
||||
finerot= parseFloat(document.getElementById("finerotate").value);
|
||||
prerot = parseFloat(document.getElementById("prerotateangle").value);
|
||||
if (finerot == 1) {
|
||||
prerot+=1
|
||||
finerot = 0
|
||||
}
|
||||
if (finerot == -1) {
|
||||
prerot-=1
|
||||
finerot = 0
|
||||
}
|
||||
degrees = finerot + prerot;
|
||||
document.getElementById("finerotate").value = finerot;
|
||||
document.getElementById("prerotateangle").value = prerot;
|
||||
document.getElementById("degree").value = degrees;
|
||||
|
||||
|
||||
var canvas = document.getElementById('canvas');
|
||||
var context = canvas.getContext('2d');
|
||||
|
||||
context.clearRect(0,0,imageObj.width,imageObj.height);
|
||||
context.save();
|
||||
context.translate(imageObj.width/2,imageObj.height/2);
|
||||
context.rotate(degrees*Math.PI/180);
|
||||
context.drawImage(imageObj,-imageObj.width/2,-imageObj.height/2);
|
||||
context.restore();
|
||||
drawGrid();
|
||||
}
|
||||
function drawGrid(){
|
||||
var canvas = document.getElementById('canvas');
|
||||
var ctx = canvas.getContext('2d');
|
||||
w = canvas.width;
|
||||
h = canvas.height;
|
||||
ctx.save();
|
||||
ctx.strokeStyle = '#00FF00';
|
||||
|
||||
for (i = h/2; i < h; i += 100)
|
||||
{
|
||||
ctx.moveTo(0, i);
|
||||
ctx.lineTo(w, i);
|
||||
ctx.stroke();
|
||||
ctx.moveTo(0, h-i);
|
||||
ctx.lineTo(w, h-i);
|
||||
ctx.stroke();
|
||||
}
|
||||
for (i = w/2; i < w; i += 100)
|
||||
{
|
||||
ctx.moveTo(i, 0);
|
||||
ctx.lineTo(i, h);
|
||||
ctx.stroke();
|
||||
ctx.moveTo(w-i, 0);
|
||||
ctx.lineTo(w-i, h);
|
||||
ctx.stroke(); }
|
||||
ctx.restore();
|
||||
}
|
||||
|
||||
init();
|
||||
</script>
|
||||
|
||||
|
||||
<hr/>
|
||||
</div>
|
||||
</body onScroll="document.cookie='ypos=' + window.pageYOffset">
|
||||
</html>
|
||||
@@ -25,7 +25,7 @@
|
||||
</tr>
|
||||
<tr>
|
||||
Result:<p>
|
||||
<iframe name="maincontent" id ="maincontent" src="" title="fileserver" allowfullscreen></iframe>
|
||||
<iframe name="result" id ="result" src="" title="fileserver" allowfullscreen></iframe>
|
||||
</tr>
|
||||
|
||||
</table>
|
||||
@@ -35,8 +35,8 @@ function setprevalue() {
|
||||
var inputVal = document.getElementById("myInput").value;
|
||||
inputVal = inputVal.replace(",", ".");
|
||||
_value = "/setPreValue.html?value="+inputVal;
|
||||
document.getElementById('maincontent').src = _value;
|
||||
location.reload();
|
||||
document.getElementById('result').src = _value;
|
||||
// location.reload();
|
||||
}
|
||||
</script>
|
||||
|
||||
|
||||
306
sd-card/html/readconfig.js
Normal file
306
sd-card/html/readconfig.js
Normal file
@@ -0,0 +1,306 @@
|
||||
var config_gesamt;
|
||||
var config_split;
|
||||
var ref = new Array(2);
|
||||
|
||||
function MakeRefZW(zw, _basepath){
|
||||
url = _basepath + "/editflow.html?task=cutref&in=/config/reference.jpg&out=/img_tmp/ref_zw_org.jpg&x=" + zw["x"] + "&y=" + zw["y"] + "&dx=" + zw["dx"] + "&dy=" + zw["dy"];
|
||||
var xhttp = new XMLHttpRequest();
|
||||
try {
|
||||
xhttp.open("GET", url, false);
|
||||
xhttp.send(); }
|
||||
catch (error)
|
||||
{
|
||||
// alert("Deleting Config.ini failed");
|
||||
}
|
||||
FileCopyOnServer("/img_tmp/ref_zw_org.jpg", "/img_tmp/ref_zw.jpg", _basepath);
|
||||
}
|
||||
|
||||
function GetCoordinates(index, _basepath){
|
||||
FileCopyOnServer(ref[index]["name"], "/img_tmp/ref_zw.jpg", _basepath);
|
||||
|
||||
FileDeleteOnServer("/img_tmp/ref_zw_org.jpg", _basepath);
|
||||
var namezw = ref[index]["name"].replace(".jpg", "_org.jpg");
|
||||
FileCopyOnServer(namezw, "/img_tmp/ref_zw_org.jpg", _basepath);
|
||||
|
||||
return ref[index];
|
||||
}
|
||||
|
||||
function ParseReference() {
|
||||
config_split = config_gesamt.split("\n");
|
||||
var i = 0;
|
||||
|
||||
for (var i in config_split) {
|
||||
if (config_split[i].trim() == "[Alignment]")
|
||||
break;
|
||||
}
|
||||
|
||||
if (i >= config_split.length){
|
||||
return;
|
||||
}
|
||||
|
||||
var akt_ref = 0;
|
||||
++i;
|
||||
|
||||
while ((akt_ref < 2) && (i < config_split.length) && (config_split[i][0] != "[")) {
|
||||
var linesplit = ZerlegeZeile(config_split[i]);
|
||||
if (linesplit.length == 3)
|
||||
{
|
||||
ref[akt_ref] = new Object();
|
||||
ref[akt_ref]["pos_ref"] = i;
|
||||
ref[akt_ref]["name"] = linesplit[0];
|
||||
ref[akt_ref]["x"] = linesplit[1];
|
||||
ref[akt_ref]["y"] = linesplit[2];
|
||||
akt_ref++;
|
||||
}
|
||||
++i;
|
||||
}
|
||||
}
|
||||
|
||||
function UpdateConfig(zw, _index, _enhance, _basepath){
|
||||
var zeile = zw["name"] + " " + zw["x"] + ", " + zw["y"];
|
||||
var _pos = ref[_index]["pos_ref"];
|
||||
config_split[_pos] = zeile;
|
||||
FileDeleteOnServer("/config/config.ini", _basepath);
|
||||
|
||||
var config_gesamt = "";
|
||||
for (var i = 0; i < config_split.length; ++i)
|
||||
{
|
||||
config_gesamt = config_gesamt + config_split[i] + "\n";
|
||||
}
|
||||
|
||||
var rtn = new Blob([config_gesamt], {type: 'mime'});
|
||||
|
||||
FileSendContent(config_gesamt, "/config/config.ini", _basepath);
|
||||
|
||||
var namezw = zw["name"];
|
||||
FileCopyOnServer("/img_tmp/ref_zw.jpg", namezw, _basepath);
|
||||
var namezw = zw["name"].replace(".jpg", "_org.jpg");
|
||||
FileCopyOnServer("/img_tmp/ref_zw_org.jpg", namezw, _basepath);
|
||||
}
|
||||
|
||||
function MakeContrastImageZW(zw, _enhance, _basepath){
|
||||
url = _basepath + "/editflow.html?task=cutref&in=/config/reference.jpg&out=/img_tmp/ref_zw.jpg" + "&x=" + zw["x"] + "&y=" + zw["y"] + "&dx=" + zw["dx"] + "&dy=" + zw["dy"];
|
||||
if (_enhance == true){
|
||||
url = url + "&enhance=true";
|
||||
}
|
||||
|
||||
var xhttp = new XMLHttpRequest();
|
||||
try {
|
||||
xhttp.open("GET", url, false);
|
||||
xhttp.send(); }
|
||||
catch (error)
|
||||
{
|
||||
// alert("Deleting Config.ini failed");
|
||||
}
|
||||
}
|
||||
|
||||
function createReader(file) {
|
||||
var image = new Image();
|
||||
reader.onload = function(evt) {
|
||||
var image = new Image();
|
||||
image.onload = function(evt) {
|
||||
var width = this.width;
|
||||
var height = this.height;
|
||||
alert (width); // will produce something like 198
|
||||
};
|
||||
image.src = evt.target.result;
|
||||
};
|
||||
reader.readAsDataURL(file);
|
||||
}
|
||||
|
||||
function GetReferenceSize(name){
|
||||
img = new Image();
|
||||
var xhttp = new XMLHttpRequest();
|
||||
|
||||
url = "http://192.168.178.22/fileserver" + name;
|
||||
xhttp.open("GET", url, false);
|
||||
xhttp.send();
|
||||
|
||||
var response = xhttp.responseText;
|
||||
var binary = ""
|
||||
|
||||
for (var responseText = xhttp.responseText, responseTextLen = responseText.length, binary = "", i = 0; i < responseTextLen; ++i) {
|
||||
binary += String.fromCharCode(responseText.charCodeAt(i) & 255)
|
||||
}
|
||||
img.src = 'data:image/jpeg;base64,'+ window.btoa(binary);
|
||||
|
||||
return [img.width, img.height];
|
||||
}
|
||||
|
||||
|
||||
function ZerlegeZeile(input)
|
||||
{
|
||||
var Output = Array(0);
|
||||
delimiter = " =,";
|
||||
|
||||
input = trim(input, delimiter);
|
||||
var pos = findDelimiterPos(input, delimiter);
|
||||
var token;
|
||||
while (pos > -1) {
|
||||
token = input.substr(0, pos);
|
||||
token = trim(token, delimiter);
|
||||
Output.push(token);
|
||||
input = input.substr(pos+1, input.length);
|
||||
input = trim(input, delimiter);
|
||||
pos = findDelimiterPos(input, delimiter);
|
||||
}
|
||||
Output.push(input);
|
||||
|
||||
return Output;
|
||||
|
||||
}
|
||||
|
||||
function findDelimiterPos(input, delimiter)
|
||||
{
|
||||
var pos = -1;
|
||||
var zw;
|
||||
var akt_del;
|
||||
|
||||
for (var anz = 0; anz < delimiter.length; ++anz)
|
||||
{
|
||||
akt_del = delimiter[anz];
|
||||
zw = input.indexOf(akt_del);
|
||||
if (zw > -1)
|
||||
{
|
||||
if (pos > -1)
|
||||
{
|
||||
if (zw < pos)
|
||||
pos = zw;
|
||||
}
|
||||
else
|
||||
pos = zw;
|
||||
}
|
||||
}
|
||||
return pos;
|
||||
}
|
||||
|
||||
|
||||
|
||||
function trim(istring, adddelimiter)
|
||||
{
|
||||
while ((istring.length > 0) && (adddelimiter.indexOf(istring[0]) >= 0)){
|
||||
istring = istring.substr(1, istring.length-1);
|
||||
}
|
||||
|
||||
while ((istring.length > 0) && (adddelimiter.indexOf(istring[istring.length-1]) >= 0)){
|
||||
istring = istring.substr(0, istring.length-1);
|
||||
}
|
||||
|
||||
return istring;
|
||||
}
|
||||
|
||||
|
||||
|
||||
function loadConfigJS(_basepath) {
|
||||
var xhttp = new XMLHttpRequest();
|
||||
try {
|
||||
url = _basepath + '/fileserver/config/config.ini';
|
||||
xhttp.open("GET", url, false);
|
||||
xhttp.send();
|
||||
config_gesamt = xhttp.responseText;
|
||||
}
|
||||
catch (error)
|
||||
{
|
||||
// alert("Deleting Config.ini failed");
|
||||
}
|
||||
}
|
||||
|
||||
function getConfig() {
|
||||
return config_txt;
|
||||
}
|
||||
|
||||
|
||||
|
||||
function dataURLtoBlob(dataurl) {
|
||||
var arr = dataurl.split(','), mime = arr[0].match(/:(.*?);/)[1],
|
||||
bstr = atob(arr[1]), n = bstr.length, u8arr = new Uint8Array(n);
|
||||
while(n--){
|
||||
u8arr[n] = bstr.charCodeAt(n);
|
||||
}
|
||||
return new Blob([u8arr], {type:mime});
|
||||
}
|
||||
|
||||
function FileCopyOnServer(_source, _target, _basepath = ""){
|
||||
url = _basepath + "/editflow.html?task=copy&in=" + _source + "&out=" + _target;
|
||||
var xhttp = new XMLHttpRequest();
|
||||
try {
|
||||
xhttp.open("GET", url, false);
|
||||
xhttp.send(); }
|
||||
catch (error)
|
||||
{
|
||||
// alert("Deleting Config.ini failed");
|
||||
}
|
||||
}
|
||||
|
||||
function FileDeleteOnServer(_filename, _basepath = ""){
|
||||
var xhttp = new XMLHttpRequest();
|
||||
var okay = false;
|
||||
|
||||
xhttp.onreadystatechange = function() {
|
||||
if (xhttp.readyState == 4) {
|
||||
if (xhttp.status == 200) {
|
||||
okay = true;
|
||||
} else if (xhttp.status == 0) {
|
||||
// alert("Server closed the connection on delete abruptly!");
|
||||
location.reload()
|
||||
} else {
|
||||
// alert(xhttp.status + " Error!\n" + xhttp.responseText);
|
||||
location.reload()
|
||||
}
|
||||
}
|
||||
};
|
||||
try {
|
||||
var url = _basepath + "/delete" + _filename;
|
||||
xhttp.open("POST", url, false);
|
||||
xhttp.send();
|
||||
}
|
||||
catch (error)
|
||||
{
|
||||
// alert("Deleting Config.ini failed");
|
||||
}
|
||||
|
||||
return okay;
|
||||
}
|
||||
|
||||
function FileSendContent(_content, _filename, _basepath = ""){
|
||||
var xhttp = new XMLHttpRequest();
|
||||
var okay = false;
|
||||
|
||||
xhttp.onreadystatechange = function() {
|
||||
if (xhttp.readyState == 4) {
|
||||
if (xhttp.status == 200) {
|
||||
okay = true;
|
||||
} else if (xhttp.status == 0) {
|
||||
alert("Server closed the connection abruptly!");
|
||||
} else {
|
||||
alert(xhttp.status + " Error!\n" + xhttp.responseText);
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
try {
|
||||
upload_path = _basepath + "/upload" + _filename;
|
||||
xhttp.open("POST", upload_path, false);
|
||||
xhttp.send(_content);
|
||||
}
|
||||
catch (error)
|
||||
{
|
||||
// alert("Deleting Config.ini failed");
|
||||
}
|
||||
return okay;
|
||||
}
|
||||
|
||||
function SaveReferenceImage(_id_canvas, _filename, _doDelete, _basepath = ""){
|
||||
if (_doDelete){
|
||||
FileDeleteOnServer(_filename, _basepath);
|
||||
}
|
||||
|
||||
var canvas = document.getElementById(_id_canvas);
|
||||
var JPEG_QUALITY=0.8;
|
||||
var dataUrl = canvas.toDataURL('image/jpeg', JPEG_QUALITY);
|
||||
var rtn = dataURLtoBlob(dataUrl);
|
||||
if (!FileSendContent(rtn, _filename, _basepath)){
|
||||
alert("Error on saving reference image (" + _filename + ")!\nPlease retry.");
|
||||
location.reload();
|
||||
};
|
||||
}
|
||||
Reference in New Issue
Block a user