dnviti/cai-foligno-tools
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Update ai-meeting/meeting.html

Browse Source
This commit is contained in:
Daniele Viti
2025-11-12 00:09:59 +00:00
parent 197545d4d2
commit 3dea8ce7b3
1 changed files with 194 additions and 58 deletions
Download Patch File Download Diff File Expand all files Collapse all files

170
ai-meeting/meeting.html
View File

@@ -67,17 +67,25 @@
} }
input[type="text"], input[type="text"],
input[type="password"] { input[type="password"],
textarea {
width: 100%; width: 100%;
padding: 14px; padding: 14px;
border: 2px solid #e0e0e0; border: 2px solid #e0e0e0;
border-radius: 10px; border-radius: 10px;
font-size: 16px; font-size: 16px;
transition: all 0.3s; transition: all 0.3s;
font-family: inherit;
}
textarea {
resize: vertical;
min-height: 120px;
} }
input[type="text"]:focus, input[type="text"]:focus,
input[type="password"]:focus { input[type="password"]:focus,
textarea:focus {
outline: none; outline: none;
border-color: #667eea; border-color: #667eea;
box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1); box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1);
@@ -509,8 +517,10 @@
<body> <body>
<!-- Sezione Upload --> <!-- Sezione Upload -->
<div id="uploadSection" class="upload-container"> <div id="uploadSection" class="upload-container">
<h1>🎙️ Carica Audio</h1> <h1>🎙️ Carica Audio o Trascrizione</h1>
<div class="subtitle">Formati supportati: MP3, WAV, M4A, OGG</div> <div class="subtitle">
Audio: MP3, WAV, M4A, OGG | Trascrizione: TXT
</div>
<form id="uploadForm"> <form id="uploadForm">
<div class="form-group"> <div class="form-group">
@@ -543,7 +553,6 @@
id="fileInput" id="fileInput"
name="file" name="file"
accept="audio/*" accept="audio/*"
required
/> />
<label <label
for="fileInput" for="fileInput"
@@ -558,7 +567,41 @@
</div> </div>
</div> </div>
<button type="submit" id="submitBtn">Invia Audio</button> <div class="form-group">
<label>Oppure Trascrizione (file .txt)</label>
<div class="file-input-wrapper">
<input
type="file"
id="transcriptInput"
name="transcript"
accept=".txt,text/plain"
/>
<label
for="transcriptInput"
class="file-input-label"
id="transcriptLabel"
>
<div class="file-info" id="transcriptInfo">
<div class="upload-icon">📝</div>
<div>
Tocca per selezionare una trascrizione
</div>
</div>
</label>
</div>
</div>
<div class="form-group">
<label>Oppure Incolla Trascrizione</label>
<textarea
id="transcriptText"
name="transcriptText"
placeholder="Incolla qui la trascrizione del meeting..."
rows="8"
></textarea>
</div>
<button type="submit" id="submitBtn">Invia</button>
</form> </form>
<div class="loading" id="loading"> <div class="loading" id="loading">
@@ -636,6 +679,10 @@
const fileInput = document.getElementById("fileInput"); const fileInput = document.getElementById("fileInput");
const fileLabel = document.getElementById("fileLabel"); const fileLabel = document.getElementById("fileLabel");
const fileInfo = document.getElementById("fileInfo"); const fileInfo = document.getElementById("fileInfo");
const transcriptInput = document.getElementById("transcriptInput");
const transcriptLabel = document.getElementById("transcriptLabel");
const transcriptInfo = document.getElementById("transcriptInfo");
const transcriptText = document.getElementById("transcriptText");
const submitBtn = document.getElementById("submitBtn"); const submitBtn = document.getElementById("submitBtn");
const uploadMessage = document.getElementById("uploadMessage"); const uploadMessage = document.getElementById("uploadMessage");
const resultMessage = document.getElementById("resultMessage"); const resultMessage = document.getElementById("resultMessage");
@@ -650,15 +697,26 @@
const newUploadBtn = document.getElementById("newUploadBtn"); const newUploadBtn = document.getElementById("newUploadBtn");
let selectedFile = null; let selectedFile = null;
let selectedTranscript = null;
let receivedHtml = null; let receivedHtml = null;
let editorInstance = null; let editorInstance = null;
let isEditing = false; let isEditing = false;
let isEditingHtml = false; let isEditingHtml = false;
// Gestione selezione file // Gestione selezione file audio
fileInput.addEventListener("change", function () { fileInput.addEventListener("change", function () {
if (this.files && this.files[0]) { if (this.files && this.files[0]) {
selectedFile = this.files[0]; selectedFile = this.files[0];
selectedTranscript = null;
transcriptInput.value = "";
transcriptText.value = "";
transcriptLabel.classList.remove("has-file");
transcriptInfo.classList.remove("has-file");
transcriptInfo.innerHTML = `
<div class="upload-icon">📝</div>
<div>Tocca per selezionare una trascrizione</div>
`;
const fileName = selectedFile.name; const fileName = selectedFile.name;
const fileSize = (selectedFile.size / 1024 / 1024).toFixed( const fileSize = (selectedFile.size / 1024 / 1024).toFixed(
2, 2,
@@ -682,6 +740,57 @@
} }
}); });
// Gestione selezione trascrizione da file
transcriptInput.addEventListener("change", function () {
if (this.files && this.files[0]) {
selectedTranscript = this.files[0];
selectedFile = null;
fileInput.value = "";
transcriptText.value = "";
fileLabel.classList.remove("has-file");
fileInfo.classList.remove("has-file");
fileInfo.innerHTML = `
<div class="upload-icon">🎵</div>
<div>Tocca per selezionare un file audio</div>
`;
const fileName = selectedTranscript.name;
const fileSize = (selectedTranscript.size / 1024).toFixed(
2,
);
transcriptLabel.classList.add("has-file");
transcriptInfo.classList.add("has-file");
transcriptInfo.innerHTML = `
<div class="upload-icon">✅</div>
<div><strong>${fileName}</strong></div>
<div style="font-size: 12px; margin-top: 5px;">${fileSize} KB</div>
`;
}
});
// Gestione textarea trascrizione
transcriptText.addEventListener("input", function () {
if (this.value.trim().length > 0) {
selectedFile = null;
selectedTranscript = null;
fileInput.value = "";
transcriptInput.value = "";
fileLabel.classList.remove("has-file");
fileInfo.classList.remove("has-file");
transcriptLabel.classList.remove("has-file");
transcriptInfo.classList.remove("has-file");
fileInfo.innerHTML = `
<div class="upload-icon">🎵</div>
<div>Tocca per selezionare un file audio</div>
`;
transcriptInfo.innerHTML = `
<div class="upload-icon">📝</div>
<div>Tocca per selezionare una trascrizione</div>
`;
}
});
// Funzione per convertire OGG in MP3 // Funzione per convertire OGG in MP3
async function convertToMP3(audioFile) { async function convertToMP3(audioFile) {
return new Promise(async (resolve, reject) => { return new Promise(async (resolve, reject) => {
@@ -747,9 +856,13 @@
const username = document.getElementById("username").value; const username = document.getElementById("username").value;
const password = document.getElementById("password").value; const password = document.getElementById("password").value;
const pastedTranscript = transcriptText.value.trim();
if (!selectedFile) { if (!selectedFile && !selectedTranscript && !pastedTranscript) {
showUploadMessage("Seleziona un file audio", "error"); showUploadMessage(
"Seleziona un file audio, carica una trascrizione o incolla il testo",
"error",
);
return; return;
} }
@@ -758,6 +871,32 @@
uploadMessage.classList.remove("show"); uploadMessage.classList.remove("show");
try { try {
const credentials = btoa(`${username}:${password}`);
let requestBody;
let requestHeaders = {
Authorization: `Basic ${credentials}`,
};
// Se è stato incollato del testo nella textarea o caricato un file di trascrizione
if (pastedTranscript || selectedTranscript) {
loadingText.textContent =
"Elaborazione trascrizione...";
// Ottieni il testo (da textarea o da file)
let transcriptTextContent;
if (pastedTranscript) {
transcriptTextContent = pastedTranscript;
} else {
transcriptTextContent =
await selectedTranscript.text();
}
// Invia come body text/plain
requestBody = transcriptTextContent;
requestHeaders["Content-Type"] = "text/plain";
}
// Altrimenti gestisci il file audio con FormData
else {
let fileToUpload = selectedFile; let fileToUpload = selectedFile;
const fileExt = selectedFile.name const fileExt = selectedFile.name
.split(".") .split(".")
@@ -805,12 +944,11 @@
fileInfo.classList.remove("converting"); fileInfo.classList.remove("converting");
} }
loadingText.textContent = "Elaborazione in corso..."; loadingText.textContent = "Elaborazione audio...";
const formData = new FormData(); const formData = new FormData();
formData.append("file", fileToUpload); formData.append("file", fileToUpload);
requestBody = formData;
const credentials = btoa(`${username}:${password}`); }
// Create fetch with timeout for Firefox // Create fetch with timeout for Firefox
const controller = new AbortController(); const controller = new AbortController();
@@ -823,10 +961,8 @@
"https://n8n-prod.commandware.com/webhook/ai_meeting_parse", "https://n8n-prod.commandware.com/webhook/ai_meeting_parse",
{ {
method: "POST", method: "POST",
headers: { headers: requestHeaders,
Authorization: `Basic ${credentials}`, body: requestBody,
},
body: formData,
signal: controller.signal, signal: controller.signal,
}, },
); );