added image prefetch

This commit is contained in:
naielv
2025-06-13 16:09:16 +02:00
parent 7088a54e23
commit 8056fbdb71
2 changed files with 150 additions and 8 deletions

View File

@@ -318,7 +318,92 @@
} }
</style> </style>
<link href="static/toastr.min.css" rel="stylesheet" /> <link href="static/toastr.min.css" rel="stylesheet" />
<!--<link rel="stylesheet" href="static/simplemde.min.css">-->
<link rel="prefetch" href="icon512_maskable.png" />
<link rel="prefetch" href="icon512_rounded.png" />
<link rel="prefetch" href="index.html" />
<link rel="prefetch" href="manifest.json" />
<link rel="prefetch" href="sw.js" />
<link rel="prefetch" href="static/axe.js" />
<link rel="prefetch" href="static/doublescroll.js" />
<link rel="prefetch" href="static/gun.js" />
<link rel="prefetch" href="static/jquery.js" />
<link rel="prefetch" href="static/load.js" />
<link rel="prefetch" href="static/open.js" />
<link rel="prefetch" href="static/path.js" />
<link rel="prefetch" href="static/radisk.js" />
<link rel="prefetch" href="static/radix.js" />
<link rel="prefetch" href="static/rindexed.js" />
<link rel="prefetch" href="static/sea.js" />
<link rel="prefetch" href="static/showdown.min.js" />
<link rel="prefetch" href="static/simplemde.min.css" />
<link rel="prefetch" href="static/simplemde.min.js" />
<link rel="prefetch" href="static/store.js" />
<link rel="prefetch" href="static/synchronous.js" />
<link rel="prefetch" href="static/TeleSec.jpg" />
<link rel="prefetch" href="static/toastr.min.css" />
<link rel="prefetch" href="static/toastr.min.js" />
<link rel="prefetch" href="static/webrtc.js" />
<link rel="prefetch" href="static/yson.js" />
<link rel="prefetch" href="static/ico/add.png" />
<link rel="prefetch" href="static/ico/azucar-moreno.png" />
<link rel="prefetch" href="static/ico/azucar-blanco.jpg" />
<link rel="prefetch" href="static/ico/stevia.jpg" />
<link rel="prefetch" href="static/ico/stevia-gotas.webp" />
<link rel="prefetch" href="static/ico/sacarina.jpg" />
<link rel="prefetch" href="static/ico/arrow_down_blue.png" />
<link rel="prefetch" href="static/ico/arrow_left_green.png" />
<link rel="prefetch" href="static/ico/arrow_up_red.png" />
<link rel="prefetch" href="static/ico/camera2.png" />
<link rel="prefetch" href="static/ico/cereales.png" />
<link rel="prefetch" href="static/ico/checkbox.png" />
<link rel="prefetch" href="static/ico/checkbox_unchecked.png" />
<link rel="prefetch" href="static/ico/connect_ok.svg" />
<link rel="prefetch" href="static/ico/connect_ko.svg" />
<link rel="prefetch" href="static/ico/coffee_bean.png" />
<link rel="prefetch" href="static/ico/colacao.jpg" />
<link rel="prefetch" href="static/ico/cookies.png" />
<link rel="prefetch" href="static/ico/cow.png" />
<link rel="prefetch" href="static/ico/delete.png" />
<link rel="prefetch" href="static/ico/fire.png" />
<link rel="prefetch" href="static/ico/keyboard_key_g.png" />
<link rel="prefetch" href="static/ico/keyboard_key_p.png" />
<link rel="prefetch" href="static/ico/lollipop.png" />
<link rel="prefetch" href="static/ico/milk.png" />
<link rel="prefetch" href="static/ico/preferences.png" />
<link rel="prefetch" href="static/ico/sizes.png" />
<link rel="prefetch" href="static/ico/statusok.png" />
<link rel="prefetch" href="static/ico/snowflake.png" />
<link rel="prefetch" href="static/ico/tea_bag.png" />
<link rel="prefetch" href="static/ico/thermometer2.png" />
<link rel="prefetch" href="static/ico/user.png" />
<link rel="prefetch" href="static/ico/user_generic.png" />
<link rel="prefetch" href="static/ico/water_tap.png" />
<link rel="prefetch" href="static/ico/wheat.png" />
<link rel="prefetch" href="static/ico/layered1/Azucar-Az. Blanco.png" />
<link rel="prefetch" href="static/ico/layered1/Azucar-Az. Moreno.png" />
<link rel="prefetch" href="static/ico/layered1/Azucar-Edulcorante.png" />
<link rel="prefetch" href="static/ico/layered1/Azucar-Sacarina.png" />
<link rel="prefetch" href="static/ico/layered1/Azucar-Sin.png" />
<link rel="prefetch" href="static/ico/layered1/Azucar-Stevia (Gotas).png" />
<link rel="prefetch" href="static/ico/layered1/Azucar-Stevia (Pastillas).png" />
<link rel="prefetch" href="static/ico/layered1/Background.png" />
<link rel="prefetch" href="static/ico/layered1/Cafeina-Con.png" />
<link rel="prefetch" href="static/ico/layered1/Cafeina-Sin.png" />
<link rel="prefetch" href="static/ico/layered1/Leche-Agua.png" />
<link rel="prefetch" href="static/ico/layered1/Leche-Sin lactosa.png" />
<link rel="prefetch" href="static/ico/layered1/Leche-Vegetal.png" />
<link rel="prefetch" href="static/ico/layered1/Leche-de Vaca.png" />
<link rel="prefetch" href="static/ico/layered1/Selección-CafeSolo.png" />
<link rel="prefetch" href="static/ico/layered1/Selección-CaféLeche.png" />
<link rel="prefetch" href="static/ico/layered1/Selección-ColaCao.png" />
<link rel="prefetch" href="static/ico/layered1/Selección-Infusion.png" />
<link rel="prefetch" href="static/ico/layered1/Selección-Leche.png" />
<link rel="prefetch" href="static/ico/layered1/Tamaño-Grande.png" />
<link rel="prefetch" href="static/ico/layered1/Tamaño-Pequeño.png" />
<link rel="prefetch" href="static/ico/layered1/Temperatura-Caliente.png" />
<link rel="prefetch" href="static/ico/layered1/Temperatura-Frio.png" />
<link rel="prefetch" href="static/ico/layered1/Temperatura-Templado.png" />
</head> </head>
<body> <body>
@@ -697,7 +782,6 @@
gun.get(TABLE).get("heartbeat"), gun.get(TABLE).get("heartbeat"),
"heartbeat-" + CurrentISOTime() "heartbeat-" + CurrentISOTime()
); );
// console.log("Beep")
gun.get(TABLE).get("heartbeat").load(console.debug); gun.get(TABLE).get("heartbeat").load(console.debug);
}, 5000); }, 5000);
gun.get(TABLE).on((data) => {var e = true}) gun.get(TABLE).on((data) => {var e = true})
@@ -708,6 +792,66 @@
} catch { } catch {
console.log("ScreenLock Failed") console.log("ScreenLock Failed")
} }
function setLayeredImages(comanda, key) {
// Base paths for each layer type (adjust paths as needed)
const basePaths = {
Selección: "static/ico/layered1/",
Café: "static/ico/layered1/",
Endulzante: "static/ico/layered1/",
Cafeina: "static/ico/layered1/",
Leche: "static/ico/layered1/",
};
// Map for Selección to filenames
const selectionMap = {
"ColaCao con leche": "Selección-ColaCao.png",
"Infusión": "Selección-Infusion.png",
"Café con leche": "Selección-CaféLeche.png",
"Solo Leche": "Selección-Leche.png",
"Solo café (sin leche)": "Selección-CaféSolo.png",
};
// Start div with relative positioning for layering
let html = `<div style="position: relative; width: 200px; height: 200px; background: white; display: inline-block;">`;
// Layer 1: Selección image
const selection = comanda["Selección"];
if (selectionMap[selection]) {
html += `<img id="img1-${key}" src="${basePaths.Selección + selectionMap[selection]}" style="position: absolute; top: 0; left: 0; width: 100%; height: 100%;">`;
}
// Layer 2: Café
if (comanda.Café) {
html += `<img id="img2-${key}" src="${basePaths.Café}Café-${comanda.Café}.png" style="position: absolute; top: 0; left: 0; width: 100%; height: 100%;">`;
}
// Layer 3: Endulzante
if (comanda.Endulzante) {
html += `<img id="img3-${key}" src="${basePaths.Endulzante}Azucar-${comanda.Endulzante}.png" style="position: absolute; top: 0; left: 0; width: 100%; height: 100%;">`;
}
// Layer 4: Cafeina
if (comanda.Cafeina) {
html += `<img id="img4-${key}" src="${basePaths.Cafeina}Cafeina-${comanda.Cafeina}.png" style="position: absolute; top: 0; left: 0; width: 100%; height: 100%;">`;
}
// Layer 5: Leche
if (comanda.Leche) {
html += `<img id="img5-${key}" src="${basePaths.Leche}Leche-${comanda.Leche}.png" style="position: absolute; top: 0; left: 0; width: 100%; height: 100%;">`;
}
// Layer 6: Temperatura
if (comanda.Temperatura) {
html += `<img id="img6-${key}" src="${basePaths.Leche}Temperatura-${comanda.Temperatura}.png" style="position: absolute; top: 0; left: 0; width: 100%; height: 100%;">`;
}
// Layer 7: Tamaño
if (comanda.Tamaño) {
html += `<img id="img7-${key}" src="${basePaths.Leche}Tamaño-${comanda.Tamaño}.png" style="position: absolute; top: 0; left: 0; width: 100%; height: 100%;">`;
}
// Close div
html += "</div>";
return html;
}
function addCategory( function addCategory(
parent, parent,
name, name,
@@ -1815,7 +1959,6 @@
resizeInputImage( resizeInputImage(
file, file,
function (url) { function (url) {
console.log(url);
document.getElementById(render_foto).src = url; document.getElementById(render_foto).src = url;
resized = url; resized = url;
}, },
@@ -2201,7 +2344,9 @@
<br><button id="${btn_Entregado}" class="">Entregado</button> <br><button id="${btn_Entregado}" class="">Entregado</button>
<br><button id="${btn_Deuda}" class="">Deuda</button> <br><button id="${btn_Deuda}" class="">Deuda</button>
<br><button id="${btn_Pagado}" class="">Pagado</button></td> <br><button id="${btn_Pagado}" class="">Pagado</button></td>
<td><pre style="font-size: 17px;">${SC_parse(JSON.parse(data.Comanda)) + <td>
${setLayeredImages(JSON.parse(data.Comanda), data._key)}
<pre style="font-size: 17px; display: inline-block;">${SC_parse(JSON.parse(data.Comanda)) +
"<hr>" + "<hr>" +
data.Notas data.Notas
}</pre></td> }</pre></td>
@@ -2349,12 +2494,10 @@
function add_row(data, key) { function add_row(data, key) {
if (data != null) { if (data != null) {
data["_key"] = key; data["_key"] = key;
console.log(old[key], data.Estado)
if (old[key] == undefined) { if (old[key] == undefined) {
old[key] = ""; old[key] = "";
} }
if (old[key] != data.Estado) { if (old[key] != data.Estado) {
console.log("SC:Updated:", data)
if (tts && document.getElementById(tts_check).checked) { if (tts && document.getElementById(tts_check).checked) {
var msg = `Comanda de ${SC_Personas[data.Persona].Region}. - ${JSON.parse(data.Comanda)["Selección"]}. - ${SC_Personas[data.Persona].Nombre}. - ${data.Estado}` var msg = `Comanda de ${SC_Personas[data.Persona].Region}. - ${JSON.parse(data.Comanda)["Selección"]}. - ${SC_Personas[data.Persona].Nombre}. - ${data.Estado}`
console.log("TTS: " + msg) console.log("TTS: " + msg)
@@ -2367,7 +2510,6 @@
rows2[key] = data; rows2[key] = data;
old[key] = data.Estado; old[key] = data.Estado;
} else { } else {
// console.log("delete", key);
delete rows2[key]; delete rows2[key];
delete old[key]; delete old[key];
} }

2
sw.js
View File

@@ -1,4 +1,4 @@
var cacheName = 'telesec_2025-06-13_3'; var cacheName = 'telesec_2025-06-13_5';
self.addEventListener('install', event => { self.addEventListener('install', event => {
event.waitUntil( event.waitUntil(