solocla/trf_certest
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fixed canvas dimension

Browse Source
This commit is contained in:
Claudio 2025-09-22 08:15:01 +02:00
parent 5b47416841
commit 447a0d1dea
3 changed files with 4 additions and 49 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
public/userarea/modal_parts.php
View File

@ -45,7 +45,7 @@
<div class="col-md-6"> <div class="col-md-6">
<h6>Foto del Campione</h6> <h6>Foto del Campione</h6>
<div style="display: flex; align-items: center; margin-bottom: 10px;"> <div style="display: flex; align-items: center; margin-bottom: 10px;">
<button type="button" class="btn btn-secondary btn-sm" id="downloadPhotoBtn" style="padding: 0.1rem 0.5rem; font-size: 0.8rem; margin-right: 10px;"><i class="fas fa-download"></i> Scarica Foto</button> <button type="button" class="btn btn-primary btn-sm" id="downloadPhotoBtn" style="padding: 0.1rem 0.5rem; font-size: 0.8rem; margin-right: 10px;"><i class="fas fa-download"></i> </button>
<div id="photoSelectorContainer" style="display: none;"></div> <div id="photoSelectorContainer" style="display: none;"></div>
</div> </div>
<div style="position: relative; width: 100%; min-height: 400px;"> <div style="position: relative; width: 100%; min-height: 400px;">

49
public/userarea/parts.js
View File

@ -1,6 +1,4 @@
$(document).ready(function () { $(document).ready(function () {
console.log("parts.js caricato correttamente");
// =================== // ===================
// GLOBAL STATE // GLOBAL STATE
// =================== // ===================
@ -41,7 +39,6 @@ $(document).ready(function () {
][0].transcript ][0].transcript
.trim() .trim()
.toLowerCase(); .toLowerCase();
console.log("Transcript vocale:", transcript);
const $currentRow = $("#partsTableBody tr:last"); const $currentRow = $("#partsTableBody tr:last");
const $descriptionInput = $currentRow.find(".part-description"); const $descriptionInput = $currentRow.find(".part-description");
@ -82,7 +79,6 @@ $(document).ready(function () {
}; };
recognition.onerror = function (event) { recognition.onerror = function (event) {
console.error("Errore riconoscimento vocale:", event.error);
if (event.error === "no-speech" || event.error === "aborted") { if (event.error === "no-speech" || event.error === "aborted") {
if (isVoiceActive) recognition.start(); if (isVoiceActive) recognition.start();
} else { } else {
@ -95,7 +91,6 @@ $(document).ready(function () {
if (isVoiceActive) recognition.start(); if (isVoiceActive) recognition.start();
}; };
} else { } else {
console.warn("Riconoscimento vocale non supportato dal browser.");
$("#toggleVoiceBtn").hide(); $("#toggleVoiceBtn").hide();
} }
@ -295,7 +290,6 @@ $(document).ready(function () {
const img = $("#samplePhoto"); const img = $("#samplePhoto");
img.off("load").attr("src", photoPath); img.off("load").attr("src", photoPath);
img.on("load", function () { img.on("load", function () {
console.log("Foto caricata:", photoPath);
const canvas = document.getElementById("photoCanvas"); const canvas = document.getElementById("photoCanvas");
const ctx = canvas.getContext("2d"); const ctx = canvas.getContext("2d");
const naturalWidth = img[0].naturalWidth; const naturalWidth = img[0].naturalWidth;
@ -370,13 +364,10 @@ $(document).ready(function () {
// 6. Registra gli eventi // 6. Registra gli eventi
fabricCanvas.on("mouse:down", function (options) { fabricCanvas.on("mouse:down", function (options) {
console.log("Mouse down event triggered on canvas");
if (selectedPartNumber === null) { if (selectedPartNumber === null) {
console.log("Nessun partNumber selezionato");
return; return;
} }
if (options.target) { if (options.target) {
console.log("Click su oggetto esistente, ignorato");
return; return;
} }
const pointer = fabricCanvas.getPointer(options.e); const pointer = fabricCanvas.getPointer(options.e);
@ -419,10 +410,6 @@ $(document).ready(function () {
markUnsaved(); markUnsaved();
selectedPartNumber = null; selectedPartNumber = null;
$("#partsList li").removeClass("active"); $("#partsList li").removeClass("active");
console.log(
"Marker aggiunto per partNumber:",
selectedPartNumber,
);
}); });
// 7. Forza focus e render // 7. Forza focus e render
@ -432,15 +419,6 @@ $(document).ready(function () {
// 8. Aggiorna marker e descrizioni esistenti per questa foto // 8. Aggiorna marker e descrizioni esistenti per questa foto
updateMarkers(); updateMarkers();
updateDescriptions(); updateDescriptions();
console.log("Canvas Fabric.js reinizializzato per:", photoPath);
console.log(
"Dimensioni canvas:",
photoData.displayWidth,
"x",
photoData.displayHeight,
);
console.log("Scale factor:", photoData.scale);
}, 10); // Piccolo delay per assicurare che il DOM sia pronto }, 10); // Piccolo delay per assicurare che il DOM sia pronto
}); });
} }
@ -893,7 +871,6 @@ $(document).ready(function () {
return; return;
selectedPartNumber = $(this).data("part-number"); selectedPartNumber = $(this).data("part-number");
$(this).addClass("active").siblings().removeClass("active"); $(this).addClass("active").siblings().removeClass("active");
console.log("PartNumber selezionato:", selectedPartNumber);
}); });
$("#showMixParts").on("change", function () { $("#showMixParts").on("change", function () {
@ -1035,7 +1012,6 @@ $(document).ready(function () {
// MARKERS & DESCRIPTIONS // MARKERS & DESCRIPTIONS
// =================== // ===================
function updateMarkers() { function updateMarkers() {
console.log("Aggiornamento marker");
// Rimuovi marker esistenti // Rimuovi marker esistenti
for (let partNumber in markerObjects) { for (let partNumber in markerObjects) {
fabricCanvas.remove(markerObjects[partNumber]); fabricCanvas.remove(markerObjects[partNumber]);
@ -1120,7 +1096,6 @@ $(document).ready(function () {
}); });
group.on("moving", function () { group.on("moving", function () {
console.log("Marker spostato:", marker.partNumber);
marker.x = this.left / photoData.scale; marker.x = this.left / photoData.scale;
marker.y = this.top / photoData.scale; marker.y = this.top / photoData.scale;
markUnsaved(); markUnsaved();
@ -1131,14 +1106,9 @@ $(document).ready(function () {
}); });
fabricCanvas.renderAll(); fabricCanvas.renderAll();
console.log(
"Marker aggiornati, totale:",
Object.keys(markerObjects).length,
);
} }
function updateDescriptions() { function updateDescriptions() {
console.log("Aggiornamento descrizioni");
const currentPhoto = $("#samplePhoto").attr("src"); const currentPhoto = $("#samplePhoto").attr("src");
const annotations = photoAnnotations[currentPhoto] || { const annotations = photoAnnotations[currentPhoto] || {
markers: [], markers: [],
@ -1189,7 +1159,7 @@ $(document).ready(function () {
scaleY: 1, scaleY: 1,
backgroundColor: "rgba(255, 255, 255, 0.8)", backgroundColor: "rgba(255, 255, 255, 0.8)",
fontFamily: "Arial", fontFamily: "Arial",
fontSize: 20, fontSize: 24,
fill: "#000000", fill: "#000000",
padding: 10, padding: 10,
editable: false, editable: false,
@ -1205,7 +1175,6 @@ $(document).ready(function () {
}); });
descriptionTextbox.on("scaling", function () { descriptionTextbox.on("scaling", function () {
console.log("Descrizione ridimensionata");
fitFontToBox(this); fitFontToBox(this);
annotations.descriptionSize.width = this.width * this.scaleX; annotations.descriptionSize.width = this.width * this.scaleX;
annotations.descriptionSize.height = this.height * this.scaleY; annotations.descriptionSize.height = this.height * this.scaleY;
@ -1213,7 +1182,6 @@ $(document).ready(function () {
}); });
descriptionTextbox.on("moving", function () { descriptionTextbox.on("moving", function () {
console.log("Descrizione spostata");
annotations.descriptionPosition.x = this.left / photoData.scale; annotations.descriptionPosition.x = this.left / photoData.scale;
annotations.descriptionPosition.y = this.top / photoData.scale; annotations.descriptionPosition.y = this.top / photoData.scale;
markUnsaved(); markUnsaved();
@ -1222,11 +1190,10 @@ $(document).ready(function () {
fabricCanvas.add(descriptionTextbox); fabricCanvas.add(descriptionTextbox);
fitFontToBox(descriptionTextbox); fitFontToBox(descriptionTextbox);
fabricCanvas.renderAll(); fabricCanvas.renderAll();
console.log("Descrizioni aggiornate");
} }
function fitFontToBox(textbox) { function fitFontToBox(textbox) {
let fontSize = 20; let fontSize = 24;
textbox.set("fontSize", fontSize); textbox.set("fontSize", fontSize);
textbox.setCoords(); textbox.setCoords();
@ -1256,7 +1223,6 @@ $(document).ready(function () {
} }
function clearCanvasMarkers(clearDescriptions = true) { function clearCanvasMarkers(clearDescriptions = true) {
console.log("Pulizia marker e descrizioni");
const currentPhoto = $("#samplePhoto").attr("src"); const currentPhoto = $("#samplePhoto").attr("src");
if (clearDescriptions && photoAnnotations[currentPhoto]) { if (clearDescriptions && photoAnnotations[currentPhoto]) {
photoAnnotations[currentPhoto].hasDescriptions = false; photoAnnotations[currentPhoto].hasDescriptions = false;
@ -1303,7 +1269,6 @@ $(document).ready(function () {
} }
function undoLastMarker() { function undoLastMarker() {
console.log("Annullamento ultimo marker");
const currentPhoto = $("#samplePhoto").attr("src"); const currentPhoto = $("#samplePhoto").attr("src");
if ( if (
photoAnnotations[currentPhoto] && photoAnnotations[currentPhoto] &&
@ -1320,7 +1285,6 @@ $(document).ready(function () {
} }
$("#addDescriptionsBtn").on("click", function () { $("#addDescriptionsBtn").on("click", function () {
console.log("Aggiunta descrizioni");
const currentPhoto = $("#samplePhoto").attr("src"); const currentPhoto = $("#samplePhoto").attr("src");
if (!photoAnnotations[currentPhoto]) { if (!photoAnnotations[currentPhoto]) {
photoAnnotations[currentPhoto] = { photoAnnotations[currentPhoto] = {
@ -1348,7 +1312,6 @@ $(document).ready(function () {
// SAVE PHOTO // SAVE PHOTO
// =================== // ===================
$("#savePhotoBtn").on("click", function () { $("#savePhotoBtn").on("click", function () {
console.log("Inizio salvataggio foto");
if (!$("#samplePhoto").attr("src")) { if (!$("#samplePhoto").attr("src")) {
const errorMsg = $( const errorMsg = $(
'<div class="alert alert-danger temp-alert" role="alert">Nessuna foto caricata da salvare.</div>', '<div class="alert alert-danger temp-alert" role="alert">Nessuna foto caricata da salvare.</div>',
@ -1409,7 +1372,6 @@ $(document).ready(function () {
}, 5000); }, 5000);
}; };
} catch (e) { } catch (e) {
console.error("Errore in Fabric.js toDataURL:", e);
const errorMsg = $( const errorMsg = $(
'<div class="alert alert-danger temp-alert" role="alert">Errore durante la generazione dell\'immagine annotata.</div>', '<div class="alert alert-danger temp-alert" role="alert">Errore durante la generazione dell\'immagine annotata.</div>',
); );
@ -1489,11 +1451,6 @@ $(document).ready(function () {
// Carica effettivamente la prima foto // Carica effettivamente la prima foto
loadSinglePhoto(firstPhotoPath); loadSinglePhoto(firstPhotoPath);
console.log(
"Foto aggiunta al dropdown e ritornato alla prima:",
firstPhotoPath,
);
} else { } else {
// Se non c'è dropdown, ricarica la foto corrente per vedere la versione pulita // Se non c'è dropdown, ricarica la foto corrente per vedere la versione pulita
const currentPhoto = const currentPhoto =
@ -1532,7 +1489,6 @@ $(document).ready(function () {
// PULISCI IL CANVAS COMPLETAMENTE // PULISCI IL CANVAS COMPLETAMENTE
clearCanvasMarkers(true); // Pulisce marker e descrizioni clearCanvasMarkers(true); // Pulisce marker e descrizioni
clearUnsaved(); clearUnsaved();
console.log("Foto salvata e originale pulita");
} else { } else {
const errorMsg = $( const errorMsg = $(
'<div class="alert alert-danger temp-alert" role="alert">Errore: ' + '<div class="alert alert-danger temp-alert" role="alert">Errore: ' +
@ -1564,7 +1520,6 @@ $(document).ready(function () {
}, },
}); });
} catch (e) { } catch (e) {
console.error("Errore in canvas.toDataURL:", e);
const errorMsg = $( const errorMsg = $(
'<div class="alert alert-danger temp-alert" role="alert">Errore durante la creazione dell\'immagine finale.</div>', '<div class="alert alert-danger temp-alert" role="alert">Errore durante la creazione dell\'immagine finale.</div>',
); );

2
public/userarea/photos_popup.php
View File

@ -254,7 +254,7 @@ $result->saveToFile($qrCodeFile);
<button id="addToCanvasBtn">Aggiungi Selezionate al Canvas</button> <button id="addToCanvasBtn">Aggiungi Selezionate al Canvas</button>
<!-- Canvas per editing --> <!-- Canvas per editing -->
<canvas id="collageCanvas" width="800" height="600" style="border: 1px solid #ccc; margin-top: 20px;"></canvas> <canvas id="collageCanvas" width="960" height="720" style="border: 1px solid #ccc; margin-top: 20px;"></canvas>
<!-- Pannello dei livelli --> <!-- Pannello dei livelli -->
<div id="layersPanel" style="width: 120px; max-height: 600px; overflow-y: auto; background: #f8f9fa; padding: 10px; position: absolute; right: 0; top: 60px;"> <div id="layersPanel" style="width: 120px; max-height: 600px; overflow-y: auto; background: #f8f9fa; padding: 10px; position: absolute; right: 0; top: 60px;">