FatimaGr commited on
Commit
6abf534
·
verified ·
1 Parent(s): e61e27a
Files changed (1) hide show
  1. static/script.js +23 -28
static/script.js CHANGED
@@ -211,6 +211,7 @@ function loadResumerPage() {
211
 
212
  //Quand on clique sur le boutton traduction ---------------
213
 
 
214
  function loadTraductionPage() {
215
  document.body.style.setProperty('--background-image', "url('traduction.webp')");
216
  let appContainer = document.createElement("div");
@@ -222,25 +223,25 @@ function loadResumerPage() {
222
  <div class="logo-bottom">AI</div>
223
  </div>
224
  <div class="menu-section">
225
- <button class="menu-btn" id="resumerButton">SUMMARIZE</button>
226
- <button class="menu-btn" id="qesdocButton">DOC-QUESTIONS</button>
227
- <button class="menu-btn" id="visualisationButton">VISUALIZATION</button>
228
  </div>
229
  <div class="menu-section">
230
  <div class="menu-title">IMAGES</div>
231
- <button class="menu-btn" id="interpretationButton">INTERPRETATION</button>
232
- <button class="menu-btn" id="qesimgButton">IMAGES-QUESTIONS</button>
233
  </div>
234
  </div>
235
  <div class="main-content-area">
236
  <div class="document-container">
237
- <h1 class="document-main-title">Documents Operations</h1>
238
- <h2 class="document-subtitle">TRANSLATE🌍</h2>
239
  <div class="upload-container">
240
  <div class="file-drop-zone" id="fileDropZone">
241
  <label for="translateFile" class="file-upload-label">
242
  <img src="up.png" id="uploadIcon" class="upload-icon" alt="Upload">
243
- <span class="drop-text" id="dropText">Drop your file here or click to browse</span>
244
  </label>
245
  <input type="file" id="translateFile" class="file-input" accept=".doc,.docx,.xls,.xlsx,.pdf,.ppt,.pptx" hidden>
246
  </div>
@@ -354,14 +355,14 @@ function loadResumerPage() {
354
  </div>
355
  <div class="results-container">
356
  <div class="results-placeholder">
357
- <p class="placeholder-text" id="translateResult">The result will appear here...</p>
358
  <div id="downloadSection" style="display: none; margin-top: 20px;">
359
- <h3 style="color: white; margin-bottom: 10px;">Download the translation</h3>
360
  <div style="display: flex; gap: 10px;">
361
  <button id="downloadPdf" class="download-btn">PDF</button>
362
  <button id="downloadWord" class="download-btn">Word</button>
363
  <button id="downloadPpt" class="download-btn">PowerPoint</button>
364
- <button id="downloadTxt" class="download-btn">Text</button>
365
  </div>
366
  </div>
367
  </div>
@@ -442,12 +443,12 @@ function loadResumerPage() {
442
  const resultElement = document.getElementById("translateResult");
443
 
444
  if (!fileInput.files[0]) {
445
- resultElement.innerText = "⚠️No file selected";
446
  return;
447
  }
448
 
449
  if (!targetLang) {
450
- resultElement.innerText = "⚠️No language selected";
451
  return;
452
  }
453
 
@@ -456,7 +457,7 @@ function loadResumerPage() {
456
  formData.append("target_lang", targetLang);
457
 
458
  try {
459
- resultElement.innerText = "Translation in progress...🕐";
460
  const response = await fetch("/translate/", {
461
  method: "POST",
462
  body: formData,
@@ -470,23 +471,17 @@ function loadResumerPage() {
470
  const data = await response.json();
471
 
472
  if (data.translated_text) {
473
- resultContainer.innerHTML = `
474
- <h3 style="text-align: center; font-size: 1.5rem; font-weight: bold; color: black;">📝 Translation :</h3>
475
- <br>
476
- <p style="text-align: center; font-size: 1.2rem; font-weight: bold; color: black;">${data.translated_text}</p>
477
- `;
478
-
479
- // Stocker le texte traduit pour le téléchargement
480
- resultContainer.dataset.translatedText = data.translated_text;
481
-
482
- // Afficher les options de téléchargement
483
- document.getElementById("downloadSection").style.display = "block";
484
- } else {
485
- resultElement.innerText = "❌ Translation not available.";
486
  }
487
  } catch (error) {
488
  console.error("Erreur:", error);
489
- resultElement.innerText = "⚠️Échec de la traduction: " + error.message;
490
  }
491
  }
492
 
 
211
 
212
  //Quand on clique sur le boutton traduction ---------------
213
 
214
+
215
  function loadTraductionPage() {
216
  document.body.style.setProperty('--background-image', "url('traduction.webp')");
217
  let appContainer = document.createElement("div");
 
223
  <div class="logo-bottom">AI</div>
224
  </div>
225
  <div class="menu-section">
226
+ <button class="menu-btn" id="resumerButton">RESUME</button>
227
+ <button class="menu-btn" id="qesdocButton">QUESTION</button>
228
+ <button class="menu-btn" id="visualisationButton">VISUALISATION</button>
229
  </div>
230
  <div class="menu-section">
231
  <div class="menu-title">IMAGES</div>
232
+ <button class="menu-btn" id="interpretationButton">INTERPRETER</button>
233
+ <button class="menu-btn" id="qesimgButton">QUESTIONS</button>
234
  </div>
235
  </div>
236
  <div class="main-content-area">
237
  <div class="document-container">
238
+ <h1 class="document-main-title">Opérations sur documents</h1>
239
+ <h2 class="document-subtitle">TRANSLATE</h2>
240
  <div class="upload-container">
241
  <div class="file-drop-zone" id="fileDropZone">
242
  <label for="translateFile" class="file-upload-label">
243
  <img src="up.png" id="uploadIcon" class="upload-icon" alt="Upload">
244
+ <span class="drop-text" id="dropText">Déposez votre fichier ici ou cliquez pour parcourir</span>
245
  </label>
246
  <input type="file" id="translateFile" class="file-input" accept=".doc,.docx,.xls,.xlsx,.pdf,.ppt,.pptx" hidden>
247
  </div>
 
355
  </div>
356
  <div class="results-container">
357
  <div class="results-placeholder">
358
+ <p class="placeholder-text" id="translateResult">Le résultat apparaîtra ici...</p>
359
  <div id="downloadSection" style="display: none; margin-top: 20px;">
360
+ <h3 style="color: white; margin-bottom: 10px;">Télécharger la traduction</h3>
361
  <div style="display: flex; gap: 10px;">
362
  <button id="downloadPdf" class="download-btn">PDF</button>
363
  <button id="downloadWord" class="download-btn">Word</button>
364
  <button id="downloadPpt" class="download-btn">PowerPoint</button>
365
+ <button id="downloadTxt" class="download-btn">Texte</button>
366
  </div>
367
  </div>
368
  </div>
 
443
  const resultElement = document.getElementById("translateResult");
444
 
445
  if (!fileInput.files[0]) {
446
+ resultElement.innerText = "Veuillez sélectionner un fichier";
447
  return;
448
  }
449
 
450
  if (!targetLang) {
451
+ resultElement.innerText = "Veuillez sélectionner une langue";
452
  return;
453
  }
454
 
 
457
  formData.append("target_lang", targetLang);
458
 
459
  try {
460
+ resultElement.innerText = "Traduction en cours...";
461
  const response = await fetch("/translate/", {
462
  method: "POST",
463
  body: formData,
 
471
  const data = await response.json();
472
 
473
  if (data.translated_text) {
474
+ resultElement.innerText = "📝 Traduction : " + data.translated_text;
475
+ // Stocker le texte traduit pour le téléchargement
476
+ resultElement.dataset.translatedText = data.translated_text;
477
+ // Afficher les options de téléchargement
478
+ document.getElementById("downloadSection").style.display = "block";
479
+ } else {
480
+ resultElement.innerText = "❌ Traduction non disponible.";
 
 
 
 
 
 
481
  }
482
  } catch (error) {
483
  console.error("Erreur:", error);
484
+ resultElement.innerText = "Échec de la traduction: " + error.message;
485
  }
486
  }
487