Steven/SignatureCardFrontend
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

I am idot, java is error

Browse Source
This commit is contained in:
Steven Tracey 2023-06-06 23:49:30 -04:00
parent e487a11761
commit a9f3be99cb
3 changed files with 50 additions and 23 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
stylesheet.css
View File

@ -301,7 +301,7 @@ input[type="checkbox"], input[type="radio"] {
height: 225px;
border: solid 2px var(--theme-gray)
}
.card canvas {
.card img {
position: absolute;
height: auto;
}

59
websocket.js
View File

@ -21,24 +21,51 @@ liveGenWS.addEventListener("open", (e) => {
liveGenWS.send("start;");
}, false);
liveGenWS.addEventListener("message", (e) => {
if (e.data instanceof ArrayBuffer || e.data instanceof Blob) {
let blob = e.data;
if (e.data instanceof ArrayBuffer) {
blob = new Blob([e.data], { type: "image/png" });
}
const constDataType = dataType;
createImageBitmap(blob, 0, 0, 1080, 602, { resizeWidth: 404, resizeHeight: 225 }).then(imgBmp => {
const layerElem = document.getElementById(constDataType + "Layer");
let ctx = layerElem.getContext("2d");
ctx.clearRect(0, 0, 404, 225);
ctx.drawImage(imgBmp, 0, 0);
});
} else if (typeof e.data === "string") {
dataType = e.data;
}
console.log(e.data);
const constDataType = dataType;
if (e.data instanceof ArrayBuffer || e.data instanceof Blob) {
let blob = e.data;
if (e.data instanceof ArrayBuffer) {
blob = new Blob([e.data], { type: "image/png" });
}
let urlCreator = window.URL || window.webkitURL;
let imageUrl = urlCreator.createObjectURL(blob);
updateLayer(constDataType, imageUrl).then(() => console.log("Updated Layer: " + constDataType));
} else if (typeof e.data === "string") {
dataType = e.data;
}
}, false);
async function updateLayer(type, imageUrl) {
let workingLayer;
switch (type) {
case "location": {
workingLayer = locationLayer;
break;
}
case "background": {
workingLayer = backgroundLayer;
break;
}
case "name": {
workingLayer = nameLayer;
break;
}
case "title": {
workingLayer = titleLayer;
break;
}
case "email": {
workingLayer = emailLayer;
break;
}
case "extension" || "directNumber" || "cellNumber": {
workingLayer = numbersLayer;
break;
}
}
workingLayer.src = imageUrl;
}
function handleUpdate(val, elem) {
liveGenWS.send(val + ";" + elem.value);
}

12
websocket/index.html
View File

@ -45,12 +45,12 @@
<main>
<div class="card">
<a id="card" href="#">
<canvas id="backgroundLayer" width="404" height="225" style="z-index: 0;"></canvas>
<canvas id="nameLayer" width="404" height="225" style="z-index: 1;"></canvas>
<canvas id="titleLayer" width="404" height="225" style="z-index: 2;"></canvas>
<canvas id="emailLayer" width="404" height="225" style="z-index: 3;"></canvas>
<canvas id="locationLayer" width="404" height="225" style="z-index: 4;"></canvas>
<canvas id="numbersLayer" width="404" height="225" style="z-index: 5;"></canvas>
<img id="backgroundLayer" src="#" width="404" height="225" style="z-index: 0;">
<img id="nameLayer" src="#" width="404" height="225" style="z-index: 1;">
<img id="titleLayer" src="#" width="404" height="225" style="z-index: 2;">
<img id="emailLayer" src="#" width="404" height="225" style="z-index: 3;">
<img id="locationLayer" src="#" width="404" height="225" style="z-index: 4;">
<img id="numbersLayer" src="#" width="404" height="225" style="z-index: 5;">
</a>
</div>
<div class="container">