Optimize liveview2D

This commit is contained in:
Ewoud
2023-03-28 16:02:29 +02:00
parent a560db06ff
commit 6316c5ef6b
5 changed files with 2248 additions and 2261 deletions

View File

@@ -1937,40 +1937,30 @@ function toggleSync()
function toggleLiveview()
{
if (isM) {
//WLEDMM adding liveview2D support on main ui
isLv = !isLv;
gId("colorGFX").style.display = isLv? "inline":"none";
gId("effectGFX").style.display = isLv? "inline":"none";
gId("segGFX").style.display = isLv? "inline":"none";
canvasPeek = gId("canvasPeek");
peek(canvasPeek, !isLv); //set off if !isLv
gId('buttonSr').className = (isLv) ? "active":"";
if (isLv) peek(canvasPeek); //W
} else {
//WLEDMM adding liveview2D support
//WLEDMM remove liveview2D support here
if (isInfo && isM) toggleInfo();
if (isNodes && isM) toggleNodes();
isLv = !isLv;
var lvID = "liveview";
// if (isM) {
// lvID = "liveview2D"
// if (isLv) {
// var cn = '<iframe id="liveview2D" src="about:blank"></iframe>';
// d.getElementById('kliveview2D').innerHTML = cn;
// }
// gId('mliveview2D').style.transform = (isLv) ? "translateY(0px)":"translateY(100%)";
// }
gId(lvID).style.display = (isLv) ? "block":"none";
var url = (loc?`http://${locip}`:'') + "/" + lvID;
gId(lvID).src = (isLv) ? url:"about:blank";
gId('buttonSr').className = (isLv) ? "active":"";
if (!isLv && ws && ws.readyState === WebSocket.OPEN) ws.send('{"lv":false}');
size();
}
gId('buttonSr').className = (isLv) ? "active":"";
if (ws && ws.readyState === WebSocket.OPEN) ws.send(`{"lv":${isLv}}`);
}
function toggleInfo()

View File

@@ -1,4 +1,4 @@
function peek(c, setOff=false) {
function peek(c) {
// Check for canvas support
var ctx = c.getContext('2d');
if (ctx) { // Access the rendering context
@@ -16,8 +16,8 @@ function peek(c, setOff=false) {
}
}
ws.binaryType = "arraybuffer";
function processWSData(e) {
ws.addEventListener('message',(e)=>{
// function processWSData(e) {
try {
if (toString.call(e.data) === '[object ArrayBuffer]') {
let leds = new Uint8Array(e.data);
@@ -33,21 +33,18 @@ function peek(c, setOff=false) {
return 25+225*color/255;
} //WLEDMM in range 55 - 205
for (y=0.5;y<mH;y++) for (x=0.5; x<mW; x++) {
ctx.fillStyle = `rgb(${colorAmp(leds[i])},${colorAmp(leds[i+1])},${colorAmp(leds[i+2])})`;
ctx.beginPath();
ctx.arc(x*pPL+lOf, y*pPL, pPL*0.4, 0, 2 * Math.PI);
ctx.fill();
if (leds[i]!= 0 || leds[i+1]!= 0 || leds[i+2]!= 0) { //WLEDMM: do not show blacks
ctx.fillStyle = `rgb(${colorAmp(leds[i])},${colorAmp(leds[i+1])},${colorAmp(leds[i+2])})`;
ctx.beginPath();
ctx.arc(x*pPL+lOf, y*pPL, pPL*0.4, 0, 2 * Math.PI);
ctx.fill();
}
i+=3;
}
}
} catch (err) {
console.error("Peek WS error:",err);
}
}
if (!setOff)
ws.addEventListener('message', processWSData);
else
ws.removeEventListener('message', processWSData);
});
}
}