Update edit_alignment.html

This commit is contained in:
michael
2024-09-26 14:41:25 +02:00
committed by GitHub
parent ebcec97d1d
commit 2b7da5b44e

View File

@@ -1,8 +1,9 @@
<!DOCTYPE html>
<html lang="en" xml:lang="en">
<head>
<title>Alignment markers</title>
<meta charset="UTF-8" />
<title>Alignment markers</title>
<style>
h1 {font-size: 2em;}
@@ -79,9 +80,13 @@
-ms-transform: translate(-50%,-50%);
}
</style>
<link href="firework.css?v=$COMMIT_HASH" rel="stylesheet">
<script type="text/javascript" src="common.js?v=$COMMIT_HASH"></script>
<script type="text/javascript" src="jquery-3.6.0.min.js?v=$COMMIT_HASH"></script>
<script type="text/javascript" src="firework.js?v=$COMMIT_HASH"></script>
</head>
<body style="font-family: arial; padding: 0px 10px;">
@@ -164,12 +169,11 @@
</tr>
</table>
<script type="text/javascript" src="common.js?v=$COMMIT_HASH"></script>
<script type="text/javascript" src="readconfigcommon.js?v=$COMMIT_HASH"></script>
<script type="text/javascript" src="readconfigparam.js?v=$COMMIT_HASH"></script>
<script type="text/javascript" src="readconfigparam.js?v=$COMMIT_HASH"></script>
<script type="text/javascript" src="readconfigcommon.js?v=$COMMIT_HASH"></script>
<script language="JavaScript">
var canvas = document.getElementById('canvas'),
<script type="text/javascript">
var canvas = document.getElementById('canvas'),
ctx = canvas.getContext('2d'),
imageObj = new Image(),
rect = {},
@@ -183,7 +187,7 @@ var canvas = document.getElementById('canvas'),
cofcat,
param;
function doReboot() {
function doReboot() {
if (confirm("Are you sure you want to reboot? Did you save your changes?")) {
var stringota = domainname + "/reboot";
window.location = stringota;
@@ -191,9 +195,9 @@ function doReboot() {
window.location.assign(stringota);
window.location.replace(stringota);
}
}
}
function ChangeSelection(){
function ChangeSelection(){
aktindex = parseInt(document.getElementById("index").value);
if (aktindex == 0 && neueref1 == 1) {
@@ -202,13 +206,12 @@ function ChangeSelection(){
else if (aktindex == 1 && neueref2 == 1) {
UpdateReference();
}
else
{
else {
LoadReference();
}
}
}
function SaveToConfig() {
function SaveToConfig() {
document.getElementById("overlay").style.display = "block";
document.getElementById("overlaytext").innerHTML = "Save Alignment Marker...";
@@ -256,9 +259,9 @@ function SaveToConfig() {
else {
document.getElementById("overlay").style.display = "none";
}
}
}
function EnhanceContrast() {
function EnhanceContrast() {
document.getElementById("overlay").style.display = "block";
document.getElementById("overlaytext").innerHTML = "Enhancing Image Contrast...";
@@ -319,9 +322,9 @@ function EnhanceContrast() {
// Delay so the overlay gets shown
task();
}, 1);
}
}
function UpdateReference(){
function UpdateReference(){
document.getElementById("img_ref").onload = function () {
document.getElementById("refdx").value = this.width;
document.getElementById("refdy").value = this.height;
@@ -346,23 +349,9 @@ function UpdateReference(){
rect.startX = document.getElementById("refx").value;
rect.startY = document.getElementById("refy").value;
draw();
}
function dataURLtoBlob(dataurl) {
var arr = dataurl.split(',');
var mime = arr[0].match(/:(.*?);/)[1];
var bstr = atob(arr[1]);
var n = bstr.length;
var u8arr = new Uint8Array(n);
while(n--){
u8arr[n] = bstr.charCodeAt(n);
}
return new Blob([u8arr], {type:mime});
}
function loadCanvas(dataURL) {
function loadCanvas(dataURL) {
var canvas = document.getElementById('canvas');
var context = canvas.getContext('2d');
@@ -373,9 +362,9 @@ function loadCanvas(dataURL) {
};
imageObj.src = dataURL;
}
}
function getCoords(elem) { // crossbrowser version
function getCoords(elem) { // crossbrowser version
var box = elem.getBoundingClientRect();
var body = document.body;
var docEl = document.documentElement;
@@ -386,19 +375,19 @@ function getCoords(elem) { // crossbrowser version
var top = box.top + scrollTop - clientTop;
var left = box.left + scrollLeft - clientLeft;
return { top: Math.round(top), left: Math.round(left) };
}
}
/* hash #description open the details part of the page */
function openDescription() {
/* hash #description open the details part of the page */
function openDescription() {
if(window.location.hash) {
var hash = window.location.hash.substring(1); //Puts hash in variable, and removes the # character
if(hash == 'description') {
document.getElementById("desc_details").open = false;
}
}
}
}
function LoadReference(){
function LoadReference(){
document.getElementById("img_ref").onload = function () {
document.getElementById("refdx").value = this.width;
document.getElementById("refdy").value = this.height;
@@ -423,9 +412,9 @@ function LoadReference(){
rect.startX = document.getElementById("refx").value;
rect.startY = document.getElementById("refy").value;
draw();
}
}
function init() {
function init() {
openDescription();
document.getElementById("updatemarker").disabled = false;
@@ -454,9 +443,9 @@ function init() {
LoadReference();
drawImage();
draw();
}
}
function drawImage(){
function drawImage(){
var canvas = document.getElementById('canvas');
var context = canvas.getContext('2d');
@@ -464,9 +453,9 @@ function drawImage(){
context.save();
context.drawImage(imageObj, 0, 0);
// context.restore();
}
}
function CutOutReference(){
function CutOutReference(){
document.getElementById("overlay").style.display = "block";
document.getElementById("overlaytext").innerHTML = "Updating marker...";
@@ -534,9 +523,9 @@ function CutOutReference(){
// Delay so the overlay gets shown
task();
}, 1);
}
}
function drawGrid(){
function drawGrid(){
var canvas = document.getElementById('canvas');
var ctx = canvas.getContext('2d');
var w = canvas.width;
@@ -562,9 +551,9 @@ function drawGrid(){
ctx.stroke();
}
// ctx.restore();
}
}
function draw() {
function draw() {
var canvas = document.getElementById('canvas');
var context = canvas.getContext('2d');
context.drawImage(imageObj, 0, 0);
@@ -576,18 +565,18 @@ function draw() {
var dx = parseInt(rect.w) + parseInt(lw);
var dy = parseInt(rect.h) + parseInt(lw);
context.strokeRect(x0, y0, dx, dy);
}
}
function mouseDown(e) {
function mouseDown(e) {
var 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 EnDisableItem(_status, _name, _optional) {
function EnDisableItem(_status, _name, _optional) {
_color = "rgb(122, 122, 122)";
if (_status) {
@@ -600,9 +589,9 @@ function EnDisableItem(_status, _name, _optional) {
}
document.getElementById(_name).style.color = _color;
}
}
function mouseUp() {
function mouseUp() {
drag = false;
if (rect.w < 0) {
@@ -619,9 +608,9 @@ function mouseUp() {
document.getElementById("refdy").value = rect.h;
document.getElementById("refx").value = rect.startX;
document.getElementById("refy").value = rect.startY;
}
}
function mouseMove(e) {
function mouseMove(e) {
if (drag) {
var zw = getCoords(this)
rect.w = (e.pageX - zw.left) - rect.startX;
@@ -648,14 +637,14 @@ function mouseMove(e) {
context.lineTo(x, canvas.height);
context.stroke();
}
}
}
function namechanged() {
function namechanged() {
_name = document.getElementById("name").value;
refInfo[aktindex]["name"] = _name;
}
}
function valuemanualchanged(){
function valuemanualchanged(){
if (!drag) {
rect.w = document.getElementById("refdx").value;
rect.h = document.getElementById("refdy").value;
@@ -663,9 +652,9 @@ function valuemanualchanged(){
rect.startY = document.getElementById("refy").value;
draw();
}
}
}
init();
init();
</script>
</body>
</html>