Compare commits

..

6 Commits

16 changed files with 673 additions and 1481 deletions
Vendored
BIN
View File
Binary file not shown.
BIN
View File
Binary file not shown.
BIN
View File
Binary file not shown.
+115 -108
View File
@@ -1,154 +1,161 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="de"> <html lang="de">
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Custom Document</title> <title>Custom Document</title>
<style> <style>
body {
font-family: Arial, sans-serif;
background: #f0f2f5;
margin: 0;
padding: 0;
display: flex;
justify-content: center;
align-items: center;
min-height: 100vh;
}
.container {
background: white;
padding: 30px;
margin-top: 50px;
border-radius: 12px;
box-shadow: 0 4px 20px rgba(0,0,0,0.1);
width: 90%;
max-width: 600px;
}
h1 {
text-align: center;
color: #333;
}
label {
font-weight: bold;
margin-top: 15px;
display: block;
color: #555;
}
input[type="text"], textarea, select {
width: 100%;
padding: 10px;
margin-top: 5px;
border-radius: 6px;
border: 1px solid #ccc;
font-size: 14px;
}
textarea {
height: 120px;
resize: vertical;
}
.buttons {
display: flex;
justify-content: space-between;
margin-top: 25px;
}
button {
padding: 10px 20px;
font-size: 14px;
border: none;
border-radius: 6px;
cursor: pointer;
transition: 0.2s;
background-color: #007BFF;
color: white;
}
button:hover {
background-color: #0056b3;
}
@media (max-width: 500px) {
.buttons {
flex-direction: column;
}
.buttons button {
width: 100%;
margin-top: 10px;
}
}
#result {
margin-top: 20px;
color: #333;
word-break: break-word;
}
</style> </style>
</head> </head>
<body> <body>
<div class="container"> <div class="container">
<h1>Manage document types</h1> <h1>Custom Document Generator</h1>
<label for="existingDocs">Vorhandene Dokumententypen auswählen (optional):</label> <label for="docName">Dokumentname:</label>
<!--Drop Down--> <input type="text" id="docName" placeholder="Gib hier den Dokumentnamen ein">
<select name="existingDocs" id="existingDocs">
<option value="newDoc">-- Neuen Dokumententyp erstellen --</option> <label for="existingDocs">Vorhandene Dokumente auswählen (optional):</label>
<select id="existingDocs">
<option value="">-- Neues Dokument erstellen --</option>
<option value="meeting_report_001">Meeting Report 001</option>
<option value="summary_01">Summary 01</option>
<option value="project_plan_A">Project Plan A</option>
</select> </select>
<div id="docNameWrapper">
<label for="docName">Name des Dokumententyps:</label>
<input type="text" id="docName" placeholder="Gib hier den Namen für den Dokumententyp ein">
</div>
<label for="prompt">Dein Prompt:</label> <label for="prompt">Dein Prompt:</label>
<textarea id="prompt" placeholder="Schreibe hier den Prompt für dein Dokumententyp..."></textarea> <textarea id="prompt" placeholder="Schreibe hier den Prompt für dein Dokument..."></textarea>
<div class="buttons"> <div class="buttons">
<a href="index.html"> <a href="index.html">
<button id="goBackBtn">Abbrechen</button> <button id="goBackBtn">Abbrechen</button>
</a> </a>
<button id="deleteBtn">Dokumententyp löschen</button> <button id="generateBtn">Dokument speichern</button>
<button id="generateBtn">Dokumententyp speichern</button>
</div> </div>
<div id="result"></div> <div id="result"></div>
</div> </div>
<script src="languages.js"></script>
<script> <script>
const goBackBtn = document.getElementById("goBackBtn"); const goBackBtn = document.getElementById("goBackBtn");
const generateBtn = document.getElementById("generateBtn"); const generateBtn = document.getElementById("generateBtn");
const deleteBtn = document.getElementById("deleteBtn");
const existingDocs = document.getElementById("existingDocs"); const existingDocs = document.getElementById("existingDocs");
const docNameInput = document.getElementById("docName"); const docNameInput = document.getElementById("docName");
const promptInput = document.getElementById("prompt"); const promptInput = document.getElementById("prompt");
const resultDiv = document.getElementById("result"); const resultDiv = document.getElementById("result");
const exampleText = "";
// dokumente speichern // Zurück zur Haupt-GUI
goBackBtn.addEventListener("click", () => {
window.electronAPI.goBackToMain();
});
// Generiere Dokument
generateBtn.addEventListener("click", () => { generateBtn.addEventListener("click", () => {
const name = docNameInput.value.trim(); const prompt = promptInput.value.trim();
const content = promptInput.value.trim(); let docName = docNameInput.value.trim();
if (!name || !content) { const selectedExisting = existingDocs.value;
resultDiv.textContent = "Bitte Name des Dokumententyps und Prompt ausfüllen.";
setTimeout(() => {
resultDiv.textContent = "";
}, 3000);
return;
}
window.api.saveTxtFile(name, content).then();
resultDiv.textContent = "Dokumententyp erfolgreich gespeichert!";
setTimeout(() => {
resultDiv.textContent = "";
}, 3000);
reloadDocuments();
}); if (!prompt) {
alert("Bitte gib einen Prompt ein!");
// dokumente löschen
deleteBtn.addEventListener("click", () => {
const name = docNameInput.value.trim();
if (!name) {
resultDiv.textContent = "Bitte Name des Dokumententyps angeben.";
setTimeout(() => {
resultDiv.textContent = "";
}, 3000);
return; return;
} }
const confirmDelete = confirm( // Wenn ein vorhandenes Dokument ausgewählt wurde, hängt der Prompt daran
`Möchtest du den Dokumententyp "${name}" wirklich löschen?` if (selectedExisting) {
); docName = selectedExisting; // prompt wird an vorhandenes Dokument angehängt
} else if (!docName) {
if (!confirmDelete) return; alert("Bitte gib einen Dokumentnamen ein, wenn du ein neues Dokument erstellen möchtest!");
window.api.deleteTxtFile(name).then((success) => {
if (success) {
resultDiv.textContent = "Dokumententyp erfolgreich gelöscht!";
reloadDocuments();
existingDocs.value = "newDoc";
existingDocs.dispatchEvent(new Event("change"));
} else {
resultDiv.textContent = "Dokumententyp konnte nicht gelöscht werden.";
}
setTimeout(() => {
resultDiv.textContent = "";
}, 3000);
});
});
//function to load existingDoc options to the drop down list
const select = document.getElementById('existingDocs');
window.api.getTxtFiles().then(files => {
reloadDocuments();
});
//content anzeigen
const docNameWrapper = document.getElementById("docNameWrapper");
existingDocs.addEventListener("change", async () => {
const selected = existingDocs.value;
if (selected === "newDoc") {
docNameWrapper.classList.remove("hidden");
docNameInput.value = "";
promptInput.value = exampleText;
return; return;
} }
docNameWrapper.classList.add("hidden");
const content = await window.api.readTxtFile(selected); // Demo-Ausgabe im Result-Div
promptInput.value = content; resultDiv.innerHTML = `<strong>Dokumentname:</strong> ${docName}<br><strong>Prompt:</strong> ${prompt}`;
docNameInput.value = selected.replace(".txt", "");
});
//reload drop down // Hier kannst du den Prompt an dein LLM oder Module-Handler senden
function reloadDocuments() { // z.B. window.submit.submit({documentName: docName, prompt: prompt})
[...existingDocs.querySelectorAll('option:not([value="newDoc"])')]
.forEach(o => o.remove());
window.api.getTxtFiles().then(files => {
files.forEach(file => {
const option = document.createElement('option');
option.value = file;
option.textContent = file
.replace('.txt', '') // Endung entfernen
.replace(/_/g, ' ') // Leerzeichen ersetzen
.replace(/\b\w/g, c => c.toUpperCase()) // ersten Buchstaben groß
existingDocs.appendChild(option);
}); });
});
}
</script> </script>
</body> </body>
</html> </html>
-320
View File
@@ -1,320 +0,0 @@
<!DOCTYPE html>
<html lang="de">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Anleitung</title>
<style>
body {
font-family: Arial, sans-serif;
background: #f0f2f5;
margin: 0;
height: 100vh;
display: flex;
justify-content: center;
align-items: center;
}
/* ===== CONTAINER ===== */
.container {
background: white;
width: 90%;
max-width: 800px;
height: 85vh;
/* feste Höhe */
border-radius: 12px;
box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
display: flex;
flex-direction: column;
}
/* ===== FIXER TOP-BEREICH ===== */
.top-bar {
padding: 15px 20px;
border-bottom: 1px solid #eee;
display: flex;
justify-content: space-between;
align-items: center;
flex-shrink: 0;
}
/* Buttons */
.back-btn,
.toc-toggle {
background: #007BFF;
color: white;
border: none;
padding: 8px 14px;
border-radius: 6px;
cursor: pointer;
font-size: 14px;
}
.back-btn:hover,
.toc-toggle:hover {
background: #0056b3;
}
/* ===== TOC ===== */
.toc-wrapper {
position: relative;
}
.toc {
position: absolute;
right: 0;
top: 45px;
background: white;
border-radius: 8px;
box-shadow: 0 8px 25px rgba(0, 0, 0, 0.15);
padding: 10px;
min-width: 220px;
display: none;
z-index: 5;
}
.toc a {
display: block;
padding: 8px 10px;
color: #007BFF;
text-decoration: none;
border-radius: 6px;
}
.toc a:hover {
background: #f0f2f5;
}
.toc.show {
display: block;
}
/* ===== SCROLLBEREICH ===== */
.content {
padding: 30px;
overflow-y: auto;
flex: 1;
}
/* Inhalt */
h1 {
text-align: center;
color: #333;
}
.step {
margin-bottom: 20px;
margin-top: 20px;
}
.step h2 {
color: #0056b3;
}
.step h3 {
color: #555;
margin-bottom: 5px;
}
.step p {
color: #555;
line-height: 1.6;
}
.step img {
width: 100%;
max-height: 350px;
object-fit: contain;
border-radius: 8px;
margin-top: 15px;
border: 1px solid #ddd;
}
</style>
</head>
<body>
<div class="container">
<!-- FIXER OBERER TEIL -->
<div class="top-bar">
<a href="index.html">
<button class="back-btn">Zurück</button>
</a>
<h1>Programm Anleitung</h1>
<div class="toc-wrapper">
<button class="toc-toggle" onclick="toggleTOC()">Inhaltsverzeichnis</button>
<div class="toc" id="toc">
<a href="#convertVid" onclick="closeTOC()">Video zu Dokument umwandeln</a>
<a href="#firstStep" onclick="closeTOC()">Schritt 1 - Video auswählen</a>
<a href="#secondStep" onclick="closeTOC()">Schritt 2 - Konfiguration</a>
<a href="#thirdStep" onclick="closeTOC()">Schritt 3 - Dokumententyp auswählen</a>
<a href="#fourthStep" onclick="closeTOC()">Schritt 4 - Bestätigen</a>
<a href="#fifthStep" onclick="closeTOC()">Schritt 5 - Sprecher identifizieren</a>
<a href="#sixthStep" onclick="closeTOC()">Schritt 6 - Dokument speichern</a>
<a href="#createDoc" onclick="closeTOC()">Dokumententyp erstellen</a>
<a href="#editDoc" onclick="closeTOC()">Dokumententyp bearbeiten</a>
<a href="#deleteDoc" onclick="closeTOC()">Dokumententyp löschen</a>
</div>
</div>
</div>
<!-- NUR DIESER TEIL SCROLLT -->
<div class="content">
<div class="step" id="convertVid">
<h2>Video in ein Dokument umwandeln.</h2>
<div class="step" id="firstStep">
<h3>Schritt 1 - Video auswählen</h3>
<p id="firstStep">
- Ziehe eine Videodatei in das Drag-and-Drop-Feld oder klicke auf <strong>„Video
suchen“</strong>,<br>
um eine Datei über deinen Dateibrowser auszuwählen.<br>
- Klicke anschließend auf <strong>Schritt 2</strong> oder auf den blauen Pfeil rechts, um
fortzufahren.
</p>
</div>
<div class="step" id="secondStep">
<h3>Schritt 2 - Konfiguration</h3>
<p>
- Wähle im ersten Auswahlmenü die zu verwendende <strong>KI</strong>.<br>
- Wähle im zweiten Auswahlmenü das zu verwendende <strong>Transkriptions-Tool</strong>.<br>
- Wähle im dritten Auswahlmenü das <strong>Dateiformat</strong> des zu erstellenden
Dokuments.<br>
- Wähle im vierten Auswahlmenü die <strong>Sprache</strong> des zu erstellenden Dokuments.<br>
- Klicke anschließend auf <strong>Schritt 3</strong> oder auf den blauen Pfeil rechts, um
fortzufahren.
</p>
</div>
<div class="step" id="thirdStep">
<h3>Schritt 3 - Dokumententyp auswählen</h3>
<p>
- Wähle einen Dokumententyp über die Checkbox oder einen zuvor erstellten Dokumententyp aus dem
Dropdown-Menü aus.<br>
- Klicke anschließend auf <strong>Schritt 4</strong> oder auf den blauen Pfeil rechts, um
fortzufahren.
</p>
</div>
<div class="step" id="fourthStep">
<h3>Schritt 4 - Bestätigen</h3>
<p>
Klicke auf <strong>„Submit“</strong>, um die Dokumentengenerierung zu starten.<br>
Während der Verarbeitung werden vier Statuspunkte angezeigt, die sich schrittweise von rot zu
grün färben und den aktuellen Fortschritt darstellen:
<br><br>
Punkt 1: Upload und Vorbereitung der Videodatei.<br>
Punkt 2: Transkription des Videoinhalts.<br>
Punkt 3: KI-gestützte Verarbeitung und Dokumentenerstellung.<br>
Punkt 4: Abschluss der Generierung und Bereitstellung des Dokuments.
<br><br>
Nach erfolgreichem Abschluss klicke auf <strong>Schritt 5</strong> oder auf den blauen Pfeil
rechts, um fortzufahren.
</p>
</div>
<div class="step" id="fifthStep">
<h3>Schritt 5 - Sprecher identifizieren</h3>
<p>
Im Auswahlmenü kannst du einen erkannten Sprecher auswählen.<br>
Über den Play-Button lässt sich ein gesprochener Satz anhören, um den Sprecher eindeutig zu
identifizieren.<br>
Mit dem Lautsprecher-Symbol kannst du die Lautstärke anpassen.<br>
Über das Drei-Punkte-Menü lässt sich die Wiedergabegeschwindigkeit einstellen.<br><br>
Im Textfeld <strong>„Write name“</strong> gibst du den tatsächlichen Namen des Sprechers ein,
damit dieser im Dokument
anstelle von Platzhaltern wie z. B. „Sprecher A“ angezeigt wird.<br>
Bestätige die Eingabe mit <strong>„Rename Speaker“</strong>.<br><br>
Mit dem Button <strong>„Rewrite Document“</strong> werden anschließend alle
Sprecherbezeichnungen im Dokument ersetzt.<br><br>
Klicke danach auf <strong>Schritt 6</strong> oder auf den blauen Pfeil rechts, um fortzufahren.
</p>
</div>
<div class="step" id="sixthStep">
<h3>Schritt 6 - Dokument speichern</h3>
<p>
Klicke auf <strong>„Download“</strong>, um das Dokument zu speichern.<br>
Es öffnet sich anschließend ein Dateiexplorer, in dem du den gewünschten Speicherort auswählen
kannst.
</p>
</div>
</div>
<div class="step" id="createDoc">
<h2>Dokumententyp erstellen</h2>
<p>
- Öffne oben links das Burgermenü und wähle den Punkt <strong>„Dokumententypen
verwalten“</strong>.<br>
- Wähle anschließend im Auswahlmenü die Option <strong>„-- Neuen Dokumententyp erstellen
--“</strong>.<br>
- Vergib einen aussagekräftigen Namen für den neuen Dokumententyp.<br>
- Formuliere den Prompt für die KI-gestützte Verarbeitung sorgfältig.<br>
- Klicke auf <strong>Dokumententyp speichern</strong>.<br><br>
<strong>Hinweis:</strong> <br>Der eingegebene Prompt wird unverändert an einen KI-Dienst
übermittelt.
Achte daher unbedingt auf die Einhaltung der geltenden Datenschutzrichtlinien und gib keine
sensiblen oder personenbezogenen Daten ein.
</p>
</div>
<div class="step" id="editDoc">
<h2>Dokumententyp bearbeiten</h2>
<p>
- Öffne oben links das Burgermenü und wähle den Punkt <strong>„Dokumententypen
verwalten“</strong>.<br>
- Wähle anschließend im Auswahlmenü den zu bearbeitenden Dokumententyp aus.<br>
- Überarbeite den bestehenden KI-Prompt oder formuliere einen neuen Prompt.<br>
- Klicke abschließend auf <strong>„Dokumententyp speichern“</strong>.<br><br>
<strong>Hinweis:</strong><br>
Der eingegebene Prompt wird unverändert an einen KI-Dienst übermittelt.
Achte daher unbedingt auf die Einhaltung der geltenden Datenschutzrichtlinien und gib keine
sensiblen oder personenbezogenen Daten ein.
</p>
</div>
<div class="step" id="deleteDoc">
<h2>Dokumententyp löschen</h2>
<p> - Öffne oben links das Burgermenü und wähle den Punkt <strong>„Dokumententypen
verwalten“</strong>.<br>
- Wähle anschließend im Auswahlmenü den zu löschenden Dokumententyp aus.<br>
- Klicke abschließend auf <strong>„Dokumententyp löschen“</strong>.<br><br>
<strong>Hinweis:</strong><br>
Nach Bestätigung des Löschvorgangs kann der Dokumententyp nicht wiederhergestellt werden.
</p>
</div>
</div>
</div>
<script>
function toggleTOC() {
document.getElementById("toc").classList.toggle("show");
}
function closeTOC() {
document.getElementById("toc").classList.remove("show");
}
document.addEventListener("click", function (e) {
const toc = document.getElementById("toc");
const toggle = document.querySelector(".toc-toggle");
if (!toc.contains(e.target) && !toggle.contains(e.target)) {
toc.classList.remove("show");
}
});
</script>
</body>
</html>
Binary file not shown.

Before

Width:  |  Height:  |  Size: 154 KiB

+19 -74
View File
@@ -5,7 +5,6 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<title id="title">Video to document</title> <title id="title">Video to document</title>
<link rel="stylesheet" href="style.css"> <link rel="stylesheet" href="style.css">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/lc-select@1.3.0/themes/light.css">
</head> </head>
<body> <body>
@@ -20,66 +19,30 @@
</label> </label>
<nav class="menu1"> <nav class="menu1">
<button id="customDocBtn" onclick="showCD()">Manage document types</button> <a href="custom_document.html" class="li1">Manage document types</a>
<a href="help_page.html" class="li1">Help</a> <a href="" class="li1">Help</a>
</nav> </nav>
</nav> </nav>
</section> </section>
<h1 id="h1">Video to document</h1> <h1 id="h1">Video to document</h1>
<div class="gui-language">
<!-- to do: Ausprobieren mit li, a oder button, im Notfall ohne Flaggen Icons, kein hover-->
<select name="language_option" id="language_option"></select>
</div>
</div> </div>
<div class="step-nav"> <div class="step-nav">
<div class="step-item active" data-step="1" id="step_nav1">1. Step</div> <div class="step-item active" data-step="1">1. Step</div>
<div class="step-item" data-step="2" id="step_nav2">2. Step</div> <div class="step-item" data-step="2">2. Step</div>
<div class="step-item" data-step="3" id="step_nav3">3. Step</div> <div class="step-item" data-step="3">3. Step</div>
<div class="step-item" data-step="4" id="step_nav4">4. Step</div> <div class="step-item" data-step="4">4. Step</div>
<div class="step-item" data-step="5" id="step_nav5">5. Step</div> <div class="step-item" data-step="5">5. Step</div>
<div class="step-item" data-step="6" id="step_nav6">6. Step</div> <div class="step-item" data-step="6">6. Step</div>
</div> </div>
<div id="middleContainerWrapper" class="middle-container-wrapper"> <div id="middleContainerWrapper" class="middle-container-wrapper">
<button id="prevBtn" class="navBtn" disabled>&larr;</button> <button id="prevBtn" class="navBtn" disabled>&larr;</button>
<!-- Visible middle part-->
<div class="mitte" id="mitte"> <div class="mitte" id="mitte">
<!--Costum document section-->
<div class="container" id="cdContainer" style="display:none;">
<h1 id="cd_h1">Manage document types</h1>
<label for="existingDocs" id="cd_existingDocs">Select existing documents (optional):</label>
<!--Drop Down-->
<select name="existingDocs" id="existingDocs">
<option value="newDoc" id="newDoc">-- Create new document --</option>
</select>
<div id="docNameWrapper">
<label for="docName" id="cd_docName">Document name:</label>
<input type="text" id="docName" placeholder="Enter the document name here">
</div>
<label for="prompt" id="cd_promt">Your prompt:</label>
<textarea id="prompt" placeholder="Type the prompt for your document here..."></textarea>
<div class="buttons">
<button id="goBackBtn">Return</button>
<button id="deleteBtn">Delete document</button>
<button id="generateBtn">Save document</button>
</div>
<div id="result"></div>
</div>
<!-- Here starts code from step 1-->
<div class="step" id="step1"> <div class="step" id="step1">
<h2 class="h2">Upload your video here:</h2>
<div class="upload-container" id="uploadContainer"> <div class="upload-container" id="uploadContainer">
<p id="p1">Drag and drop video file</p> <p id="p1">Drag and drop video file</p>
<video id="previewThumbnail" autoplay="false"> <video id="previewThumbnail" autoplay="false">
@@ -93,9 +56,7 @@
</div> </div>
</div> </div>
<!-- Here starts code from step 2-->
<div class="step" id="step2" style="display:none;"> <div class="step" id="step2" style="display:none;">
<h2 class="h2">Choose your preferences:</h2>
<div class="KI-wrapper"> <div class="KI-wrapper">
<label id="labelKI">Select ki:</label> <label id="labelKI">Select ki:</label>
<select name="ai_type" id="ai_type"></select> <select name="ai_type" id="ai_type"></select>
@@ -110,87 +71,73 @@
<label id="labelType">Select type:</label> <label id="labelType">Select type:</label>
<select name="output_type" id="output_type"> <select name="output_type" id="output_type">
<option value="pdf">.pdf</option> <option value="pdf">.pdf</option>
<option value="word">.docx</option> <option value="word">.word</option>
<option value="txt">.txt</option> <option value="txt">.txt</option>
</select> </select>
</div> </div>
<div class="language-wrapper"> <div class="language-wrapper">
<label id="labelLanguage">Select language:</label> <label id="labelLanguage">Select language:</label>
<img id="labelLanguageFlag" src="flags/united-kingdom-flag-png-large.jpg" width="20" height="10" >
<select name="document_language_option" id="document_language_option"> <select name="language_option" id="language_option">
</select> </select>
</div> </div>
</div> </div>
<!-- Here starts code from step 3-->
<!-- Hover Effekt für Dokumentenvorschau, Fragezeichen hinter Text, drüber hoven zeigt Beispieldokument -->
<div class="step" id="step3" style="display:none;"> <div class="step" id="step3" style="display:none;">
<div class="checkbox-group"> <div class="checkbox-group">
<h2 class="h2">Choose prefered document style:</h2> <label id="checkbox-label" for="checkbox-group">Choose prefered document style:</label>
<div class="checkbox-container"> <div class="checkbox-container">
<input type="checkbox" name ="docFormat" id="docFormat" value="followup-report"> <input type="checkbox" name ="docFormat" id="docFormat" value="followup-report">
<label id="label_format" for="docFormat">Follow-up Report</label> <label id="label_format" for="docFormat">Follow-up Report</label>
<div class="figure1">
<img class="img-icon" src="icons/question-mark-button-icon--free-clip-art-30.png">
<img class="img-hover1" src="flags/germany-flag-png-large.jpg">
</div>
</div> </div>
<div class="checkbox-container"> <div class="checkbox-container">
<input type="checkbox" name="docFormat" id="docFormatSummary1" value="agenda"> <input type="checkbox" name="docFormat" id="docFormatSummary1" value="agenda">
<label id="label_summary" for="docFormatSummary">Agenda</label> <label id="label_summary" for="docFormatSummary">Agenda</label>
<img class="img-icon" src="icons/question-mark-button-icon--free-clip-art-30.png">
</div> </div>
<div class="checkbox-container"> <div class="checkbox-container">
<input type="checkbox" name="docFormat" id="docFormatSummary2" value="result-protocol"> <input type="checkbox" name="docFormat" id="docFormatSummary2" value="result-protocol">
<label id="label_summary" for="docFormatSummary">Resultprotocol</label> <label id="label_summary" for="docFormatSummary">Resultprotocol</label>
<img class="img-icon" src="icons/question-mark-button-icon--free-clip-art-30.png">
</div> </div>
<div class="checkbox-container"> <div class="checkbox-container">
<input type="checkbox" name="docFormat" id="docFormatSummary3" value="sprint-planning"> <input type="checkbox" name="docFormat" id="docFormatSummary3" value="sprint-planning">
<label id="label_summary" for="docFormatSummary">Sprint Planning Note</label> <label id="label_summary" for="docFormatSummary">Sprint Planning Note</label>
<img class="img-icon" src="icons/question-mark-button-icon--free-clip-art-30.png">
</div> </div>
<div class="checkbox-container"> <div class="checkbox-container">
<input type="checkbox" name="docFormat" id="docFormatCustom" value="custom"> <input type="checkbox" name="docFormat" id="docFormatCustom" value="custom">
<select name="customDocumentTypes" id="customDocumentTypes"> <select name="ai_type" id="ai_type">
<option>nichts</option>
</select> </select>
</div> </div>
</div> </div>
</div> </div>
<!-- Here starts code from step 4-->
<div class="step" id="step4" style="display:none;"> <div class="step" id="step4" style="display:none;">
<h2 class="h2">Click to submit:</h2>
<button class="submit-btn" id="submitButton" onclick="checkBoxes()" disabled>Submit</button> <button class="submit-btn" id="submitButton" onclick="checkBoxes()" disabled>Submit</button>
<div class="testy" id="testy"> <div class="testy" id="testy">
<div class="box2" id="box1"> <div class="box2" id="box1">
</div> </div>
<p id="box1_p1">---Starting---</p> <p>---Starting---</p>
<div class="box2" id="box2"> <div class="box2" id="box2">
</div> </div>
<p id="box2_p2">---Transkribing---</p> <p>---Transkribing---</p>
<div class="box2" id="box3"> <div class="box2" id="box3">
</div> </div>
<p id="box3_p3">---Document creation---</p> <p>---Document creation---</p>
<div class="box2" id="box4"> <div class="box2" id="box4">
</div> </div>
</div> </div>
</div> </div>
<!-- Here starts code from step 5-->
<div class="step" id="step5" style="display:none;"> <div class="step" id="step5" style="display:none;">
<h2 class="h2">Change names of the speakers:</h2>
<div class="speakerView" id="speakerView"> <div class="speakerView" id="speakerView">
<label id="labelSpeaker">Select Speaker:</label> <label id="labelSpeaker">Select Speaker:</label>
<select name="cur_speaker" id="cur_speaker"> <select name="cur_speaker" id="cur_speaker">
</select> </select>
</div> </div>
<div class="speakerAudio" id="speakerAutio"> <div class="speakerAudio" id="speakerAutio">
<label id="labelSpeakerAudio">Selected Speaker:</label> <label id="labelSpeakerAudio">Selected Speaker</label>
<audio controls id="speakerAudioViewer"> <audio controls id="speakerAudioViewer">
Currently there is no audio file here. Currently there is no audio file here.
</audio> </audio>
@@ -205,9 +152,7 @@
</div> </div>
</div> </div>
<!-- Here starts code from step 6-->
<div class="step" id="step6" style="display:none;"> <div class="step" id="step6" style="display:none;">
<h2 class="h2">Klick to download your document:</h2>
<button class="download-btn" id="downloadButton" onclick="fileDownload()">Download</button> <button class="download-btn" id="downloadButton" onclick="fileDownload()">Download</button>
</div> </div>
</div> </div>
@@ -215,7 +160,7 @@
<button id ="nextBtn" class="navBtn">&rarr;</button> <button id ="nextBtn" class="navBtn">&rarr;</button>
</div> </div>
<script src="https://cdn.jsdelivr.net/npm/lc-select@1.3.0/lc_select.min.js"></script>
<script src="languages.js"></script> <script src="languages.js"></script>
<script src="script.js"></script> <script src="script.js"></script>
<script src="./renderer.js"></script> <script src="./renderer.js"></script>
+3 -92
View File
@@ -12,37 +12,7 @@ var languageOptions = {
"checkbox_group": "Choose prefered document style:", "checkbox_group": "Choose prefered document style:",
"label_format": "Meeting report", "label_format": "Meeting report",
"label_summary": "Summary with timestamps", "label_summary": "Summary with timestamps",
"submitButton": "Submit", "submitButton": "Submit"
"step_nav1": "Step 1",
"step_nav2": "Step 2",
"step_nav3": "Step 3",
"step_nav4": "Step 4",
"step_nav5": "Step 5",
"step_nav6": "Step 6",
"h2": "Upload your video here:",
"labelSpeaker": "Select Speaker:",
"labelSpeakerAudio": "Selected Speaker:",
"labelSpeakerWriter": "Write name:",
"speakerLocker": "Rename speaker",
"speakerResender": "Rewrite document",
"downloadButton": "Download",
"box1_p1": "---Starting---",
"box2_p2": "---Transkribing---",
"box3_p3": "---Document creation---",
"labelType": "Select document type:",
"customDocBtn": "Manage document types",
"cd_h1": "Manage document types",
"cd_existingDocs": "Select existing documents (optional):",
"cd_docName": "Document name",
"docName": "Enter the document name here",
"cd_promt": "Your prompt:",
"prompt": "Type the prompt for your document here...",
"goBackBtn": "Return",
"deleteBtn": "Delete document",
"generateBtn": "Save document",
"newDoc": "-- Create new document --"
}, },
"de":{ "de":{
"flagPath": "flags/germany-flag-png-large.jpg", "flagPath": "flags/germany-flag-png-large.jpg",
@@ -57,36 +27,7 @@ var languageOptions = {
"checkbox_group": "Bevorzugte Dokumentvarianten:", "checkbox_group": "Bevorzugte Dokumentvarianten:",
"label_format": "Meeting Bericht", "label_format": "Meeting Bericht",
"label_summary": "Zusammenfassung mit Zeitstempeln", "label_summary": "Zusammenfassung mit Zeitstempeln",
"submitButton": "Absenden", "submitButton": "Absenden"
"step_nav1": "Schritt 1",
"step_nav2": "Schritt 2",
"step_nav3": "Schritt 3",
"step_nav4": "Schritt 4",
"step_nav5": "Schritt 5",
"step_nav6": "Schritt 6",
"h2": "Uploade dein Video hier:",
"labelSpeaker": "Wähle Sprecher:",
"labelSpeakerAudio": "Ausgewählter Sprecher:",
"labelSpeakerWriter": "Schreib Namen:",
"speakerLocker": "Ersetze Namen",
"speakerResender": "Überschreibe Dokument",
"downloadButton": "Download",
"box1_p1": "---Startet---",
"box2_p2": "---Transkribing---",
"box3_p3": "---Dokument kreieren---",
"labelType": "Wähle Dokumenttype:",
"customDocBtn": "Dokumenttypen verwalten",
"cd_h1": "Dokumenttypen verwalten",
"cd_existingDocs": "Vorhandene Dokumente auswählen (optional):",
"cd_docName": "Dokument Name",
"docName": "Geben Sie hier den Dokumentnamen ein",
"cd_promt": "Ihr Prompt:",
"prompt": "Geben Sie hier die Eingabeaufforderung für Ihr Dokument ein...",
"goBackBtn": "Zurück",
"deleteBtn": "Lösche Dokument",
"generateBtn": "Speicher Dokument",
"newDoc": "-- Neues Dokument erstellen --"
}, },
"in":{ "in":{
"flagPath": "flags/india-flag-png-large.png", "flagPath": "flags/india-flag-png-large.png",
@@ -101,37 +42,7 @@ var languageOptions = {
"checkbox_group": "पसंदीदा दस्तावेज़ शैली चुनें:", "checkbox_group": "पसंदीदा दस्तावेज़ शैली चुनें:",
"label_format": "बैठक रिपोर्ट", "label_format": "बैठक रिपोर्ट",
"label_summary": "टाइमस्टैम्प के साथ सारांश", "label_summary": "टाइमस्टैम्प के साथ सारांश",
"submitButton": "जमा करना", "submitButton": "जमा करना"
"step_nav1": "स्टेप 1",
"step_nav2": "स्टेप 2",
"step_nav3": "स्टेप 3",
"step_nav4": "स्टेप 4",
"step_nav5": "स्टेप 5",
"step_nav6": "स्टेप 6",
"h2": "अपना वीडियो यहां अपलोड करें:",
"labelSpeaker": "स्पीकर चुनें:",
"labelSpeakerAudio": "चयनित वक्ता:",
"labelSpeakerWriter": "नाम लिखें:",
"speakerLocker": "स्पीकर का नाम बदलें",
"speakerResender": "दस्तावेज़ पुनः लिखें",
"downloadButton": "डाउनलोड करना",
"box1_p1": "---प्रारंभ---",
"box2_p2": "---प्रतिलेखन---",
"box3_p3": "---दस्तावेज़ निर्माण---",
"labelType": "दस्तावेज़ प्रकार चुनें:",
"customDocBtn": "दस्तावेज़ प्रकार प्रबंधित करें",
"cd_h1": "दस्तावेज़ प्रकार प्रबंधित करें",
"cd_existingDocs": "मौजूदा दस्तावेज़ों का चयन करें (वैकल्पिक):",
"cd_docName": "दस्तावेज़ का नाम",
"docName": "यहां दस्तावेज़ का नाम दर्ज करें",
"cd_promt": "आपका संकेत:",
"prompt": "अपने दस्तावेज़ के लिए प्रॉम्प्ट यहां टाइप करें...",
"goBackBtn": "वापस करना",
"deleteBtn": "दस्तावेज़ हटाएँ",
"generateBtn": "दस्तावेज़ सहेजें",
"newDoc": "-- नया दस्तावेज़ बनाएँ --"
} }
}; };
+20 -27
View File
@@ -3,46 +3,39 @@ const { contextBridge, ipcRenderer, webUtils } = require('electron')
try { try {
contextBridge.exposeInMainWorld("explorer", { contextBridge.exposeInMainWorld("explorer", {
onFileDrop: (file) => webUtils.getPathForFile(file) onFileDrop: (file) => webUtils.getPathForFile(file)
}) });
contextBridge.exposeInMainWorld("submit", { contextBridge.exposeInMainWorld("submit", {
submit: (meeting_specifications) => { ipcRenderer.send("file_submit", meeting_specifications) } submit: (meeting_specifications) => ipcRenderer.send("file_submit", meeting_specifications)
}) });
// ALLE electronAPI Funktionen in EINEM Objekt
contextBridge.exposeInMainWorld("electronAPI", { contextBridge.exposeInMainWorld("electronAPI", {
getFilePath: (file) => { return webUtils.getPathForFile(file) } getFilePath: (file) => webUtils.getPathForFile(file),
}) saveSpeakerMapping: (data) => ipcRenderer.send("save-speaker-mapping", data)
});
contextBridge.exposeInMainWorld("onStartup", { contextBridge.exposeInMainWorld("onStartup", {
getModuleNames: () => ipcRenderer.invoke('get-module-names') getModuleNames: () => ipcRenderer.invoke('get-module-names')
}) });
contextBridge.exposeInMainWorld('electron', { contextBridge.exposeInMainWorld('electron', {
progress: (callback) => ipcRenderer.on('progress', callback) progress: (callback) => ipcRenderer.on('progress', callback)
}) });
contextBridge.exposeInMainWorld('audios', { contextBridge.exposeInMainWorld('audios', {
speakerAudios: (callback) => ipcRenderer.on('speakerAudios', callback) speakerAudios: (callback) => ipcRenderer.on('speakerAudios', callback)
})
contextBridge.exposeInMainWorld("submitSpeaker", {
speaker_submit: (speaker_names) => { ipcRenderer.send("speaker_submit", speaker_names) }
})
contextBridge.exposeInMainWorld("download", {
file_download: () => { ipcRenderer.send("file_download") }
})
//documenttypes
contextBridge.exposeInMainWorld('api', {
getTxtFiles: () => ipcRenderer.invoke('get-txt-files'),
saveTxtFile: (name, content) =>
ipcRenderer.invoke('save-txt-file', name, content),
readTxtFile: (fileName) =>
ipcRenderer.invoke('read-txt-file', fileName),
deleteTxtFile: (fileName) =>
ipcRenderer.invoke('delete-txt-file', fileName)
}); });
contextBridge.exposeInMainWorld("submitSpeaker", {
speaker_submit: (speaker_names) => ipcRenderer.send("speaker_submit", speaker_names)
});
ipcRenderer.on("error", (event, err) => { alert(err) }) contextBridge.exposeInMainWorld("download", {
file_download: () => ipcRenderer.send("file_download")
});
ipcRenderer.on("error", (event, err) => { alert(err) });
} catch (error) { } catch (error) {
console.log("Error in preload.js"); console.log("Error in preload.js", error);
} }
+86 -234
View File
@@ -1,72 +1,5 @@
/*
Listeners for the program setup and changes uploadContainer.addEventListener("dragover", (e) =>{
*/
//Listener for when the gui has been loaded so it can fill the dop down menus in step 2 and the language options
window.addEventListener('load', async (e) => {
try {
loadLanguageOptions();
const value = await window.onStartup.getModuleNames();
loadAiOptions(value.ai_modules);
loadTranscriptionOptions(value.transcription_modules);
} catch (error) {
console.log("Error in the window listener load in the renderer.js \n");
console.log(error);
}
});
//Listener if the language of the displayed text's in the gui should be changed
language_option.addEventListener('change', (e) => {
try {
const select = document.getElementById('language_option');
changeLanguage(select.value);
} catch (error) {
console.log("Error in the language_option change listener in the renderer.js");
console.log(error);
}
});
stepButtons.forEach(btn => {
btn.addEventListener("click", () => {
try {
const step = parseInt(btn.dataset.step);
showStep(step);
} catch (error) {
}
});
});
//Listener if the button to change the current step to the previus one is pressed
prevBtn.addEventListener("click", () => {
try {
if (currentStep > 1) showStep(currentStep - 1);
} catch (error) {
}
});
//Listener if the button to change the current step to the next one is pressed
nextBtn.addEventListener("click", () => {
try {
if (currentStep < totalSteps) showStep(currentStep + 1);
} catch (error) {
}
});
/*
Listeners for Step 1
*/
//Listener if a file has been draged over the drop down field
uploadContainer.addEventListener("dragover", (e) => {
try { try {
e.stopPropagation(); e.stopPropagation();
e.preventDefault(); e.preventDefault();
@@ -85,10 +18,10 @@ uploadContainer.addEventListener("drop", (e) => {
const filePath = window.explorer.onFileDrop(files[0]) const filePath = window.explorer.onFileDrop(files[0])
const testEndings = [".mp4", ".mov", ".avi", ".mkv"]; const testEndings = [".mp4", ".mov", ".avi", ".mkv"];
var pathToLower = filePath.toLowerCase(); var pathToLower = filePath.toLowerCase();
if (testEndings.some(e => pathToLower.endsWith(e))) { if(testEndings.some(e => pathToLower.endsWith(e))){
const files1 = e.dataTransfer.files; const files1 = e.dataTransfer.files;
handleFiles(files1); handleFiles(files1);
} else { }else{
alert('The given file is not compatible. These are the available types: [".mp4", ".mov", ".avi", ".mkv"].'); alert('The given file is not compatible. These are the available types: [".mp4", ".mov", ".avi", ".mkv"].');
} }
@@ -98,6 +31,29 @@ uploadContainer.addEventListener("drop", (e) => {
} }
}) })
window.addEventListener('load', async (e) => {
try {
loadLanguageOptions();
const value = await window.onStartup.getModuleNames();
loadAiOptions(value.ai_modules);
loadTranscriptionOptions(value.transcription_modules);
} catch (error) {
}
});
language_option.addEventListener('change', (e)=>{
try {
const select = document.getElementById('language_option');
changeLanguage(select.value);
} catch (error) {
}
});
//listener for the file explorer search when something got selected //listener for the file explorer search when something got selected
videoUpload.addEventListener("change", () => { videoUpload.addEventListener("change", () => {
try { try {
@@ -121,39 +77,37 @@ manualUploadBtn.addEventListener('click', () => {
}); });
/* stepButtons.forEach(btn => {
btn.addEventListener("click", () => {
try {
const step = parseInt(btn.dataset.step);
showStep(step);
} catch (error) {
Listeners for Step 2
*/
/*
Listeners for Step 3
*/
window.api.getTxtFiles().then(files => {
var menu = document.getElementById('customDocumentTypes');
var l = document.getElementById('customDocumentTypes').options.length - 1;
for (i = l; i >= 0; i--) {
menu.remove(i);
} }
files.forEach(file => {
const option = document.createElement('option');
option.value = file;
option.textContent = file
.replace('.txt', '') // Endung entfernen
.replace(/_/g, ' ') // Leerzeichen ersetzen
.replace(/\b\w/g, c => c.toUpperCase()) // ersten Buchstaben groß
menu.appendChild(option);
}); });
}); });
prevBtn.addEventListener("click", () => {
try {
if (currentStep > 1) showStep(currentStep - 1);
} catch (error) {
}
});
nextBtn.addEventListener("click", () => {
try {
if(currentStep < totalSteps) showStep(currentStep + 1);
} catch (error) {
}
});
//Checkboxlistener so that only one can be selected at a time //Checkboxlistener so that only one can be selected at a time
docFormat.addEventListener("change", (e) => { docFormat.addEventListener("change", (e) =>{
try { try {
if (docFormat.checked) { if(docFormat.checked){
docFormatSummary1.checked = false; docFormatSummary1.checked = false;
docFormatSummary2.checked = false; docFormatSummary2.checked = false;
docFormatSummary3.checked = false; docFormatSummary3.checked = false;
@@ -163,9 +117,9 @@ docFormat.addEventListener("change", (e) => {
} }
}); });
docFormatSummary1.addEventListener("change", (e) => { docFormatSummary1.addEventListener("change", (e) =>{
try { try {
if (docFormatSummary1.checked) { if(docFormatSummary1.checked){
docFormat.checked = false; docFormat.checked = false;
docFormatSummary2.checked = false; docFormatSummary2.checked = false;
docFormatSummary3.checked = false; docFormatSummary3.checked = false;
@@ -175,9 +129,9 @@ docFormatSummary1.addEventListener("change", (e) => {
} }
}); });
docFormatSummary2.addEventListener("change", (e) => { docFormatSummary2.addEventListener("change", (e) =>{
try { try {
if (docFormatSummary2.checked) { if(docFormatSummary2.checked){
docFormatSummary1.checked = false; docFormatSummary1.checked = false;
docFormat.checked = false; docFormat.checked = false;
docFormatSummary3.checked = false; docFormatSummary3.checked = false;
@@ -187,9 +141,9 @@ docFormatSummary2.addEventListener("change", (e) => {
} }
}); });
docFormatSummary3.addEventListener("change", (e) => { docFormatSummary3.addEventListener("change", (e) =>{
try { try {
if (docFormatSummary3.checked) { if(docFormatSummary3.checked){
docFormatSummary1.checked = false; docFormatSummary1.checked = false;
docFormatSummary2.checked = false; docFormatSummary2.checked = false;
docFormat.checked = false; docFormat.checked = false;
@@ -199,9 +153,9 @@ docFormatSummary3.addEventListener("change", (e) => {
} }
}); });
docFormatCustom.addEventListener("change", (e) => { docFormatCustom.addEventListener("change", (e) =>{
try { try {
if (docFormatCustom.checked) { if(docFormatCustom.checked){
docFormatSummary1.checked = false; docFormatSummary1.checked = false;
docFormatSummary2.checked = false; docFormatSummary2.checked = false;
docFormatSummary3.checked = false; docFormatSummary3.checked = false;
@@ -212,40 +166,48 @@ docFormatCustom.addEventListener("change", (e) => {
} }
}); });
/* //Speaker change listener
cur_speaker.addEventListener("change", (e) =>{
try {
document.getElementById("speakerAudioViewer").src = speakerAudios[document.getElementById("cur_speaker").value].src;
} catch (error) {
Listeners for Step 4 }
});
window.audios.speakerAudios((event, arg) => {
loadSpeakerOptions(arg);
setSpeakerAudiosValue(arg);
});
*/
//Functions the the displayed progress in the progressbar can be changed out of the main process
window.electron.progress((event, arg) => { window.electron.progress((event, arg) => {
if (arg.curstep == 1) { if(arg.curstep == 1){
setCircleOne(); setCircleOne();
} else if (arg.curstep == 2) { }else if(arg.curstep == 2){
setCircleZwo(); setCircleZwo();
} else if (arg.curstep == 3) { } else if(arg.curstep == 3){
setCircleThree(); setCircleThree();
} else if (arg.curstep == 4) { }else if(arg.curstep == 4){
setCircleFour(); setCircleFour();
} }
}); });
function setCircleOne() { function setCircleOne(){
try { try {
if (document.getElementById("box1").style.backgroundColor == "green") { if(document.getElementById("box1").style.backgroundColor == "green"){
document.getElementById("box1").style.backgroundColor = "red"; document.getElementById("box1").style.backgroundColor = "red";
} else { }else{
document.getElementById("box1").style.backgroundColor = "green"; document.getElementById("box1").style.backgroundColor = "green";
} }
} catch (error) { } catch (error) {
} }
}; };
function setCircleZwo() { function setCircleZwo(){
try { try {
if (document.getElementById("box2").style.backgroundColor == "green") { if(document.getElementById("box2").style.backgroundColor == "green"){
document.getElementById("box2").style.backgroundColor = "red"; document.getElementById("box2").style.backgroundColor = "red";
} else { }else{
document.getElementById("box2").style.backgroundColor = "green"; document.getElementById("box2").style.backgroundColor = "green";
} }
} catch (error) { } catch (error) {
@@ -253,11 +215,11 @@ function setCircleZwo() {
} }
}; };
function setCircleThree() { function setCircleThree(){
try { try {
if (document.getElementById("box3").style.backgroundColor == "green") { if(document.getElementById("box3").style.backgroundColor == "green"){
document.getElementById("box3").style.backgroundColor = "red"; document.getElementById("box3").style.backgroundColor = "red";
} else { }else{
document.getElementById("box3").style.backgroundColor = "green"; document.getElementById("box3").style.backgroundColor = "green";
} }
} catch (error) { } catch (error) {
@@ -265,11 +227,11 @@ function setCircleThree() {
} }
}; };
function setCircleFour() { function setCircleFour(){
try { try {
if (document.getElementById("box4").style.backgroundColor == "green") { if(document.getElementById("box4").style.backgroundColor == "green"){
document.getElementById("box4").style.backgroundColor = "red"; document.getElementById("box4").style.backgroundColor = "red";
} else { }else{
document.getElementById("box4").style.backgroundColor = "green"; document.getElementById("box4").style.backgroundColor = "green";
} }
} catch (error) { } catch (error) {
@@ -277,115 +239,5 @@ function setCircleFour() {
} }
}; };
/*
Listeners for Step 5
*/
//Speaker change listener
cur_speaker.addEventListener("change", (e) => {
try {
document.getElementById("speakerAudioViewer").src = speakerAudios[document.getElementById("cur_speaker").value].src;
} catch (error) {
}
});
//Function so the main process can give the gui a json with the speakers and their audio
window.audios.speakerAudios((event, arg) => {
loadSpeakerOptions(arg);
setSpeakerAudiosValue(arg);
});
/*
Listeners for the costum documents section
*/
goBackBtn.addEventListener("click", () => {
showCD();
});
// dokumente speichern
generateBtn.addEventListener("click", () => {
const name = docName.value.trim();
const content = document.getElementById("prompt").value.trim();
if (!name || !content) {
result.textContent = "Bitte Dokumentname und Prompt ausfüllen.";
console.log(name + " " + content);
setTimeout(() => {
result.textContent = "";
}, 3000);
return;
}
window.api.saveTxtFile(name, content).then();
result.textContent = "Dokument erfolgreich gespeichert!";
setTimeout(() => {
result.textContent = "";
}, 3000);
reloadDocuments();
});
// dokumente löschen
deleteBtn.addEventListener("click", () => {
const name = docName.value.trim();
if (!name) {
result.textContent = "Bitte Dokumentname angeben.";
setTimeout(() => {
result.textContent = "";
}, 3000);
return;
}
const confirmDelete = confirm(
`Möchtest du das Dokument "${name}" wirklich löschen?`
);
if (!confirmDelete) return;
window.api.deleteTxtFile(name).then((success) => {
if (success) {
result.textContent = "Dokument erfolgreich gelöscht!";
reloadDocuments();
existingDocs.value = "newDoc";
existingDocs.dispatchEvent(new Event("change"));
} else {
result.textContent = "Dokument konnte nicht gelöscht werden.";
}
setTimeout(() => {
result.textContent = "";
}, 3000);
});
});
//function to load existingDoc options to the drop down list
window.api.getTxtFiles().then(files => {
reloadDocuments();
});
//content anzeigen
existingDocs.addEventListener("change", async () => {
const existingDocsed = existingDocs.value;
const exampleText = "";
if (existingDocsed === "newDoc") {
docNameWrapper.classList.remove("hidden");
docName.value = "";
prompt.value = exampleText;
return;
}
docNameWrapper.classList.add("hidden");
const content = await window.api.readTxtFile(existingDocsed);
prompt.value = content;
docName.value = existingDocsed.replace(".txt", "");
});
+180 -319
View File
@@ -1,270 +1,5 @@
let currentVideoPath = null; let currentVideoPath = null;
//function to check if one checkbox is at least klicked
/*
Functions used in the setup or affect most of the gui
*/
var showCDValue = 0;
function showCD() {
if(showCDValue == 0){
document.getElementById('cdContainer').style.display = "block";
document.getElementById('step1').style.display ="none";
document.getElementById('step2').style.display ="none";
document.getElementById('step3').style.display ="none";
document.getElementById('step4').style.display ="none";
document.getElementById('step5').style.display ="none";
document.getElementById('step6').style.display ="none";
showCDValue = 1;
} else {
currentStep = 1;
showCDValue = 0;
document.getElementById('cdContainer').style.display = "none";
showStep(1);
}
}
//language changing feature => changes the language of every displayed text
function changeLanguage(language) {
try {
//document.getElementById('labelLanguageFlag').src = languageOptions[language].flagPath;
document.getElementById('labelKI').textContent = languageOptions[language].labelKI;
document.getElementById('labelTranscription').textContent = languageOptions[language].labelTranscription;
document.getElementById('labelLanguage').textContent = languageOptions[language].labelLanguage;
document.getElementById('title').textContent = languageOptions[language].title;
//document.getElementById('h1').textContent = languageOptions[language].h1;
document.getElementById('p1').textContent = languageOptions[language].p1;
document.getElementById('fileName').textContent = languageOptions[language].fileName;
document.getElementById('manualUploadBtn').textContent = languageOptions[language].manualUploadBtn;
document.getElementById('label_format').textContent = languageOptions[language].label_format;
document.getElementById('label_summary').textContent = languageOptions[language].label_summary;
document.getElementById('submitButton').textContent = languageOptions[language].submitButton;
document.getElementById('step_nav1').textContent = languageOptions[language].step_nav1;
document.getElementById('step_nav2').textContent = languageOptions[language].step_nav2;
document.getElementById('step_nav3').textContent = languageOptions[language].step_nav3;
document.getElementById('step_nav4').textContent = languageOptions[language].step_nav4;
document.getElementById('step_nav5').textContent = languageOptions[language].step_nav5;
document.getElementById('step_nav6').textContent = languageOptions[language].step_nav6;
//document.getElementById('h2').textContent = languageOptions[language].h2;
document.getElementById('labelSpeaker').textContent = languageOptions[language].labelSpeaker;
document.getElementById('labelSpeakerAudio').textContent = languageOptions[language].labelSpeakerAudio;
document.getElementById('labelSpeakerWriter').textContent = languageOptions[language].labelSpeakerWriter;
document.getElementById('speakerLocker').textContent = languageOptions[language].speakerLocker;
document.getElementById('speakerResender').textContent = languageOptions[language].speakerResender;
document.getElementById('downloadButton').textContent = languageOptions[language].downloadButton;
document.getElementById('box1_p1').textContent = languageOptions[language].box1_p1;
document.getElementById('box2_p2').textContent = languageOptions[language].box2_p2;
document.getElementById('box3_p3').textContent = languageOptions[language].box3_p3;
document.getElementById('labelType').textContent = languageOptions[language].labelType;
document.getElementById('customDocBtn').textContent = languageOptions[language].customDocBtn;
document.getElementById('cd_h1').textContent = languageOptions[language].cd_h1;
document.getElementById('cd_existingDocs').textContent = languageOptions[language].cd_existingDocs;
document.getElementById('cd_docName').textContent = languageOptions[language].cd_docName;
document.getElementById('docName').placeholder = languageOptions[language].docName;
document.getElementById('cd_promt').textContent = languageOptions[language].cd_promt;
document.getElementById('prompt').placeholder = languageOptions[language].prompt;
document.getElementById('goBackBtn').textContent = languageOptions[language].goBackBtn;
document.getElementById('deleteBtn').textContent = languageOptions[language].deleteBtn;
document.getElementById('generateBtn').textContent = languageOptions[language].generateBtn;
document.getElementById('newDoc').textContent = languageOptions[language].newDoc;
} catch (error) {
console.log("Error in script.js changeLanguage function");
console.log(error);
}
}
/*
Functions used for the step navigation
*/
//Step-navigation
const steps = document.querySelectorAll(".step");
const stepButtons = document.querySelectorAll(".step-item");
let currentStep = 1;
const totalSteps = steps.length;
function showStep(stepNumber) {
if (stepNumber < 1 || stepNumber > totalSteps) {
console.error("StepNumber out of Bounds", stepNumber);
return;
}
steps.forEach(step => step.style.display = "none");
document.getElementById("step" + stepNumber).style.display = "flex";
stepButtons.forEach(btn => btn.classList.remove("active"));
document.querySelector(`.step-item[data-step="${stepNumber}"]`).classList.add("active");
const activeBtn = document.querySelector(`.step-item[data-step="${stepNumber}"]`);
if (activeBtn) activeBtn.classList.add("active");
prevBtn.disabled = stepNumber == 1;
nextBtn.disabled = stepNumber === totalSteps;
currentStep = stepNumber;
}
/*
Functions used in Step 1
*/
//function to display the file path in the drop down box
function handleFiles(files) {
try {
if (files.length > 0) {
const file = files[0];
if (file.type.startsWith('video/')) {
const filePath = window.explorer.onFileDrop(files[0])
videoUpload.files = files;
fileName.textContent = `Chosen video: ${file.name}`;
currentVideoPath = filePath;
generateThumbnail(filePath);
activateSubmitBtn(true);
}
}
} catch (error) {
console.log("Error in script.js handleFiles function");
console.log(error);
}
}
//Video thumbnail generation. Shows a scene from the selected video file as a preview
function generateThumbnail(path) {
try {
const videoElement = document.getElementById("previewThumbnail");
while (videoElement.firstChild) videoElement.removeChild(videoElement.firstChild);
videoElement.src = path;
videoElement.type = "video/mov";
videoElement.load();
videoElement.style.maxWidth = 40;
videoElement.style.maxHeight = 40;
videoElement.autoplay = false;
} catch (error) {
console.log("Error in the generateThumbnail function in the script.js file \n");
console.log(error);
}
}
/*
Functions used in Step 2
*/
//function to load ai options to the drop down list
function loadAiOptions(options) {
try {
var menu = document.getElementById('ai_type');
var object_holdy;
var choice;
object_holdy = options
for (i = 0; i < options.length; i++) {
choice = document.createElement('option');
choice.textContent = object_holdy[i].displayname;
choice.value = object_holdy[i].name;
menu.appendChild(choice);
}
} catch (error) {
console.log("Error in script.js loadAiOptions function");
console.log(error);
}
}
//function to load transcription options to the drop down list
function loadTranscriptionOptions(options) {
try {
var menu = document.getElementById('transkript_type');
var object_holdy;
var choice;
object_holdy = options
for (i = 0; i < options.length; i++) {
choice = document.createElement('option');
choice.textContent = object_holdy[i].displayname;
choice.value = object_holdy[i].name;
menu.appendChild(choice);
}
} catch (error) {
console.log("Error in script.js function loadTranscriptionOptions");
console.log(error);
}
}
//function to load data type options to the drop down list
function loadDataTypeOptions(options) {
try {
var menu = document.getElementById('output_type');
var object_holdy;
var choice;
object_holdy = options
for (i = 0; i < options.length; i++) {
choice = document.createElement('option');
choice.textContent = object_holdy[i].displayname;
choice.value = object_holdy[i].name;
menu.appendChild(choice);
}
} catch (error) {
console.log("Error in script.js function loadDataTypeOptions");
console.log(error);
}
}
//function to load language options to the drop down list
function loadLanguageOptions() {
try {
var menu = document.getElementById('language_option');
var menu_doc = document.getElementById('document_language_option');
var object_holdy;
var choice;
var choice2;
object_holdy = Object.keys(languageOptions);
for (i = 0; i < object_holdy.length; i++) {
choice = document.createElement('option');
choice.textContent = object_holdy[i];
choice.value = object_holdy[i];
choice.setAttribute('data-image', languageOptions[object_holdy[i]].flagPath);
choice2 = document.createElement('option');
choice2.textContent = object_holdy[i];
choice2.value = object_holdy[i];
choice2.setAttribute('data-image', languageOptions[object_holdy[i]].flagPath);
menu_doc.appendChild(choice2);
menu.appendChild(choice);
}
new lc_select(document.getElementById('language_option')); //loads the flag images so they get displayed in the gui
new lc_select(document.getElementById('document_language_option'));
} catch (error) {
console.log("Error in script.js loadLanguageOptions function");
console.log(error);
}
}
/*
Functions used in Step 3
*/
/*
Functions used in Step 4
*/
//function to check if one checkbox is at least clicked. Final controll function before sending the input to the generation
function checkBoxes() { function checkBoxes() {
try { try {
const checkboxes = document.querySelectorAll('input[name="docFormat"]'); const checkboxes = document.querySelectorAll('input[name="docFormat"]');
@@ -339,13 +74,49 @@ function checkBoxes() {
} }
//function the the submit button on step 4 can be pressed //language changing feature
function activateSubmitBtn(hasFile) { function changeLanguage(language) {
try { try {
document.getElementById("submitButton").disabled = !hasFile; document.getElementById('labelLanguageFlag').src = languageOptions[language].flagPath;
document.getElementById('labelKI').textContent = languageOptions[language].labelKI;
document.getElementById('labelTranscription').textContent = languageOptions[language].labelTranscription;
document.getElementById('labelLanguage').textContent = languageOptions[language].labelLanguage;
document.getElementById('title').textContent = languageOptions[language].title;
document.getElementById('h1').textContent = languageOptions[language].h1;
document.getElementById('p1').textContent = languageOptions[language].p1;
document.getElementById('fileName').textContent = languageOptions[language].fileName;
document.getElementById('manualUploadBtn').textContent = languageOptions[language].manualUploadBtn;
document.getElementById('checkbox_group').textContent = languageOptions[language].checkbox_group;
document.getElementById('label_format').textContent = languageOptions[language].label_format;
document.getElementById('label_summary').textContent = languageOptions[language].label_summary;
document.getElementById('submitButton').textContent = languageOptions[language].submitButton;
} catch (error) { } catch (error) {
console.log("Error in script.js changeLanguage function");
console.log(error); console.log(error);
} }
}
//function to display the file path in the drop down box
function handleFiles(files) {
try {
if (files.length > 0) {
const file = files[0];
if (file.type.startsWith('video/')) {
const filePath = window.explorer.onFileDrop(files[0])
videoUpload.files = files;
fileName.textContent = `Chosen video: ${file.name}`;
currentVideoPath = filePath;
generateThumbnail(filePath);
activateSubmitBtn(true);
}
}
} catch (error) {
console.log("Error in script.js handleFiles function");
console.log(error);
}
} }
//function to regulate the progress on the progressbar //function to regulate the progress on the progressbar
@@ -361,21 +132,81 @@ function updateProgressBar(bar, value) {
} }
//function to hide the progressbar //function to load ai options to the drop down list
function deaktivateProgressbar() { function loadAiOptions(options) {
try { try {
document.getElementById("progressbar").style.visibility = "hidden"; var menu = document.getElementById('ai_type');
var object_holdy;
var choice;
object_holdy = options
for (i = 0; i < options.length; i++) {
choice = document.createElement('option');
choice.textContent = object_holdy[i].displayname;
choice.value = object_holdy[i].name;
menu.appendChild(choice);
}
} catch (error) { } catch (error) {
console.log("Error in script.js loadAiOptions function");
console.log(error); console.log(error);
} }
} }
/* //function to load transcription options to the drop down list
function loadTranscriptionOptions(options) {
try {
var menu = document.getElementById('transkript_type');
var object_holdy;
var choice;
object_holdy = options
for (i = 0; i < options.length; i++) {
choice = document.createElement('option');
choice.textContent = object_holdy[i].displayname;
choice.value = object_holdy[i].name;
menu.appendChild(choice);
}
} catch (error) {
console.log("Error in script.js function loadTranscriptionOptions");
console.log(error);
}
}
Functions used in Step 5 //function to load data type options to the drop down list
function loadDataTypeOptions(options) {
*/ try {
var menu = document.getElementById('output_type');
var object_holdy;
var choice;
object_holdy = options
for (i = 0; i < options.length; i++) {
choice = document.createElement('option');
choice.textContent = object_holdy[i].displayname;
choice.value = object_holdy[i].name;
menu.appendChild(choice);
}
} catch (error) {
console.log("Error in script.js function loadDataTypeOptions");
console.log(error);
}
}
//function to load language options to the drop down list
function loadLanguageOptions() {
try {
var menu = document.getElementById('language_option');
var object_holdy;
var choice;
object_holdy = Object.keys(languageOptions);
for (i = 0; i < object_holdy.length; i++) {
choice = document.createElement('option');
choice.textContent = object_holdy[i];
choice.value = object_holdy[i];
menu.appendChild(choice);
}
} catch (error) {
console.log("Error in script.js loadLanguageOptions function");
console.log(error);
}
}
//function to load speaker options to the drop down list //function to load speaker options to the drop down list
function loadSpeakerOptions(options) { function loadSpeakerOptions(options) {
@@ -414,6 +245,61 @@ function loadSpeakerAudio(option) {
} }
} }
function activateSubmitBtn(hasFile) {
try {
document.getElementById("submitButton").disabled = !hasFile;
} catch (error) {
console.log(error);
}
}
function deaktivateProgressbar() {
try {
document.getElementById("progressbar").style.visibility = "hidden";
} catch (error) {
console.log(error);
}
}
//Video thumbnail generation
function generateThumbnail(path) {
const videoElement = document.getElementById("previewThumbnail");
while (videoElement.firstChild) videoElement.removeChild(videoElement.firstChild);
videoElement.src = path;
videoElement.type = "video/mov";
videoElement.load();
videoElement.style.maxWidth = 40;
videoElement.style.maxHeight = 40;
videoElement.autoplay = false;
}
//Step-navigation
const steps = document.querySelectorAll(".step");
const stepButtons = document.querySelectorAll(".step-item");
let currentStep = 1;
const totalSteps = steps.length;
function showStep(stepNumber) {
if (stepNumber < 1 || stepNumber > totalSteps) {
console.error("StepNumber out of Bounds", stepNumber);
return;
}
steps.forEach(step => step.style.display = "none");
document.getElementById("step" + stepNumber).style.display = "flex";
stepButtons.forEach(btn => btn.classList.remove("active"));
document.querySelector(`.step-item[data-step="${stepNumber}"]`).classList.add("active");
const activeBtn = document.querySelector(`.step-item[data-step="${stepNumber}"]`);
if (activeBtn) activeBtn.classList.add("active");
prevBtn.disabled = stepNumber == 1;
nextBtn.disabled = stepNumber === totalSteps;
currentStep = stepNumber;
}
//Audio value setter //Audio value setter
var speakerAudios = {}; var speakerAudios = {};
var speakerEndValues = {}; var speakerEndValues = {};
@@ -426,30 +312,33 @@ function setSpeakerAudiosValue(valy) {
} }
} }
//Function to rewrite the speaker name in the json
function rewriteSpeakerName() { function rewriteSpeakerName() {
try { try {
var tempy = document.getElementById("cur_speaker").value; const oldKey = document.getElementById("cur_speaker").value;
speakerAudios[tempy].name = document.getElementById("newSpeaker").value; const newName = document.getElementById("newSpeaker").value;
speakerAudios[oldKey].name = newName;
loadSpeakerOptions(speakerAudios); loadSpeakerOptions(speakerAudios);
} catch (error) {
console.log("\n\n\n" + error + "\n\n\n") // IPC-Aufruf an Electron main process
} window.electronAPI.saveSpeakerMapping({
} speakerId: oldKey,
//Function to send the json with the given names back to the program to rewrite the document file speakerName: newName
function sendSpeakerPackages() { });
try {
window.submitSpeaker.speaker_submit(speakerAudios);
} catch (error) { } catch (error) {
console.log(error); console.log(error);
} }
} }
/* function sendSpeakerPackages() {
try {
window.submitSpeaker.speaker_submit(speakerAudios);
} catch (error) {
Functions for Step 6 }
}
*/
function fileDownload() { function fileDownload() {
try { try {
@@ -458,31 +347,3 @@ function fileDownload() {
console.error("Download failed:", error); console.error("Download failed:", error);
} }
} }
/*
Functions for the custom document section
*/
//reload drop down
function reloadDocuments() {
[...existingDocs.querySelectorAll('option:not([value="newDoc"])')]
.forEach(o => o.remove());
window.api.getTxtFiles().then(files => {
files.forEach(file => {
const option = document.createElement('option');
option.value = file;
option.textContent = file
.replace('.txt', '') // Endung entfernen
.replace(/_/g, ' ') // Leerzeichen ersetzen
.replace(/\b\w/g, c => c.toUpperCase()) // ersten Buchstaben groß
existingDocs.appendChild(option);
});
});
}
+46 -162
View File
@@ -22,10 +22,10 @@ body {
#h1-wrapper { #h1-wrapper {
position: relative; position: relative;
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
width: 780px; width: 770px;
height: 60px; height: 60px;
background-color: #FFF; background-color: #FFF;
box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.1); box-shadow: 0px 4px 10px rgba(0,0,0,0.1);
border-radius: 5px; border-radius: 5px;
margin-bottom: 10px; margin-bottom: 10px;
display: flex; display: flex;
@@ -36,7 +36,7 @@ body {
background: white; background: white;
padding: 40px; padding: 40px;
border-radius: 12px; border-radius: 12px;
box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1); box-shadow: 0 4px 10px rgba(0,0,0,0.1);
text-align: center; text-align: center;
width: 350px; width: 350px;
height: 200px; height: 200px;
@@ -78,7 +78,7 @@ body {
width: 200px; width: 200px;
height: auto; height: auto;
border-radius: 10px; border-radius: 10px;
box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.1); box-shadow: 0px 4px 10px rgba(0,0,0,0.1);
object-fit: cover; object-fit: cover;
} }
@@ -109,11 +109,11 @@ body {
} }
#step2 { #step2 {
gap: 25px; gap: 30px;
} }
.KI-wrapper { .KI-wrapper {
margin-top: 10px; margin-top: 40px;
} }
input[type="file"] { input[type="file"] {
@@ -123,9 +123,9 @@ input[type="file"] {
.checkbox-group { .checkbox-group {
--borderColor: #007bfff5; --borderColor: #007bfff5;
--borderWidth: .125em; --borderWidth: .125em;
} }
.checkbox-group input[type=checkbox] { .checkbox-group input[type=checkbox] {
-webkit-appearance: none; -webkit-appearance: none;
appearance: none; appearance: none;
vertical-align: middle; vertical-align: middle;
@@ -137,10 +137,9 @@ input[type="file"] {
width: 1em; width: 1em;
height: 1em; height: 1em;
position: relative; position: relative;
} }
.checkbox-group input[type=checkbox]:before,
.checkbox-group input[type=checkbox]:before, .checkbox-group input[type=checkbox]:after {
.checkbox-group input[type=checkbox]:after {
content: ""; content: "";
position: absolute; position: absolute;
background: var(--borderColor); background: var(--borderColor);
@@ -149,36 +148,31 @@ input[type="file"] {
top: 50%; top: 50%;
left: 10%; left: 10%;
transform-origin: left center; transform-origin: left center;
} }
.checkbox-group input[type=checkbox]:before {
.checkbox-group input[type=checkbox]:before {
transform: rotate(45deg) translate(calc(var(--borderWidth) / -2), calc(var(--borderWidth) / -2)) scaleX(0); transform: rotate(45deg) translate(calc(var(--borderWidth) / -2), calc(var(--borderWidth) / -2)) scaleX(0);
transition: transform 200ms ease-in 200ms; transition: transform 200ms ease-in 200ms;
} }
.checkbox-group input[type=checkbox]:after {
.checkbox-group input[type=checkbox]:after {
width: calc(var(--borderWidth) * 5); width: calc(var(--borderWidth) * 5);
transform: rotate(-45deg) translateY(calc(var(--borderWidth) * 2)) scaleX(0); transform: rotate(-45deg) translateY(calc(var(--borderWidth) * 2)) scaleX(0);
transform-origin: left center; transform-origin: left center;
transition: transform 200ms ease-in; transition: transform 200ms ease-in;
} }
.checkbox-group input[type=checkbox]:checked:before {
.checkbox-group input[type=checkbox]:checked:before {
transform: rotate(45deg) translate(calc(var(--borderWidth) / -2), calc(var(--borderWidth) / -2)) scaleX(1); transform: rotate(45deg) translate(calc(var(--borderWidth) / -2), calc(var(--borderWidth) / -2)) scaleX(1);
transition: transform 200ms ease-in; transition: transform 200ms ease-in;
} }
.checkbox-group input[type=checkbox]:checked:after {
.checkbox-group input[type=checkbox]:checked:after {
width: calc(var(--borderWidth) * 5); width: calc(var(--borderWidth) * 5);
transform: rotate(-45deg) translateY(calc(var(--borderWidth) * 2)) scaleX(1); transform: rotate(-45deg) translateY(calc(var(--borderWidth) * 2)) scaleX(1);
transition: transform 200ms ease-out 200ms; transition: transform 200ms ease-out 200ms;
} }
.checkbox-group input[type=checkbox]:focus {
.checkbox-group input[type=checkbox]:focus {
outline: calc(var(--borderWidth) / 2) dotted rgba(0, 0, 0, 0.25); outline: calc(var(--borderWidth) / 2) dotted rgba(0, 0, 0, 0.25);
} }
.checkbox-container { .checkbox-container{
margin-top: 8px; margin-top: 8px;
display: flex; display: flex;
justify-items: left; justify-items: left;
@@ -186,38 +180,13 @@ input[type="file"] {
gap: 5px; gap: 5px;
} }
.figure1 {
position: relative;
}
.img-hover1 {
position: absolute;
width: 200px;
height: 200px;
top: 0;
right: 40%;
left: 0;
bottom: 0;
object-fit: contain;
display: none;
transition: opacity .2s;
}
.figure1:hover .img-hover1 {
display: flex;
}
.img-icon {
width: 15px;
height: 15px;
}
.submit-btn { .submit-btn {
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
padding: 10px 20px; padding: 10px 20px;
margin: 110px auto 10px auto; margin: 130px auto 10px auto;
background-color: #007BFF; background-color: #007BFF;
color: white; color: white;
border: none; border: none;
@@ -235,19 +204,19 @@ input[type="file"] {
.mitte { .mitte {
background-color: #FFF; background-color: #FFF;
display: flex; display: flex;
width: 780px; width: 700px;
height: 500px;
flex-direction: column; flex-direction: column;
align-items: center; align-items: center;
padding: 40px;
gap: 10px; gap: 10px;
border: 0px; border: 0px;
border-color: black; border-color: black;
border-style: solid; border-style: solid;
border-radius: 6px; border-radius: 6px;
box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.1); box-shadow: 0px 4px 10px rgba(0,0,0,0.1);
} }
.progressbar { .progressbar{
position: relative; position: relative;
width: 210px; width: 210px;
height: 30px; height: 30px;
@@ -258,14 +227,14 @@ input[type="file"] {
visibility: hidden; visibility: hidden;
} }
.progress_fill { .progress_fill{
width: 0%; width: 0%;
height: 100%; height: 100%;
background: green; background: green;
transition: all 0.2s; transition: all 0.2s;
} }
.progress_text { .progress_text{
position: absolute; position: absolute;
top: 50%; top: 50%;
right: 5px; right: 5px;
@@ -283,9 +252,7 @@ input[type="file"] {
padding: 2px 10px 2px 10px; padding: 2px 10px 2px 10px;
} }
#ai_type, #ai_type, #transkript_type, #language_option {
#transkript_type,
#language_option {
padding: 3px; padding: 3px;
} }
@@ -293,7 +260,7 @@ input[type="file"] {
gap: 60px; gap: 60px;
display: flex; display: flex;
justify-content: center; justify-content: center;
overflow-wrap: inherit; overflow-wrap:inherit;
padding-bottom: 20px; padding-bottom: 20px;
margin-top: 40px; margin-top: 40px;
margin-bottom: 10px; margin-bottom: 10px;
@@ -307,9 +274,7 @@ input[type="file"] {
background: #fff; background: #fff;
padding: 10px 30px; padding: 10px 30px;
border-radius: 6px; border-radius: 6px;
box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1); box-shadow: 0 4px 10px rgba(0,0,0,0.1);
max-width: 720px;
min-width: 720px;
} }
.step-item { .step-item {
@@ -332,12 +297,10 @@ input[type="file"] {
/*panels*/ /*panels*/
.step { .step {
margin-top: 40px; margin-top: 70px;
margin-bottom: 40px;
;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
min-height: 425px; min-height: 400px;
} }
/*Navigation arrows*/ /*Navigation arrows*/
@@ -373,7 +336,7 @@ input[type="file"] {
cursor: not-allowed; cursor: not-allowed;
} }
.testy { .testy{
background-color: #FFF; background-color: #FFF;
display: flex; display: flex;
width: auto; width: auto;
@@ -431,24 +394,24 @@ li {
display: none; display: none;
} }
#toggle1:checked+.hamburger1 .top { #toggle1:checked + .hamburger1 .top {
-webkit-transform: rotate(-45deg); -webkit-transform: rotate(-45deg);
transform: rotate(-45deg); transform: rotate(-45deg);
margin-top: 22.5px; margin-top: 22.5px;
} }
#toggle1:checked+.hamburger1 .meat { #toggle1:checked + .hamburger1 .meat {
-webkit-transform: rotate(45deg); -webkit-transform: rotate(45deg);
transform: rotate(45deg); transform: rotate(45deg);
margin-top: -5px; margin-top: -5px;
} }
#toggle1:checked+.hamburger1 .bottom { #toggle1:checked + .hamburger1 .bottom {
-webkit-transform: scale(0); -webkit-transform: scale(0);
transform: scale(0); transform: scale(0);
} }
#toggle1:checked~.menu1 { #toggle1:checked ~ .menu1 {
height: 150px; height: 150px;
width: 300px; width: 300px;
} }
@@ -502,9 +465,7 @@ li {
transition: all 0.3s ease; transition: all 0.3s ease;
} }
#step2, #step2, #step3, #step5 {
#step3,
#step5 {
font-size: larger; font-size: larger;
} }
@@ -528,7 +489,10 @@ li {
align-items: center; align-items: center;
justify-content: center; justify-content: center;
padding: 10px 20px; padding: 10px 20px;
margin: 110px auto 10px auto; margin-left: auto;
margin-right: 0px;
margin-top: 130px;
margin-bottom: 10px;
background-color: #007BFF; background-color: #007BFF;
color: white; color: white;
border: none; border: none;
@@ -537,8 +501,7 @@ li {
font-size: 14px; font-size: 14px;
} }
#speakerLocker, #speakerLocker, #speakerResender{
#speakerResender {
padding: 10px 20px; padding: 10px 20px;
margin: 20px auto; margin: 20px auto;
background-color: #007BFF; background-color: #007BFF;
@@ -548,82 +511,3 @@ li {
cursor: pointer; cursor: pointer;
font-size: 14px; font-size: 14px;
} }
.h2 {
font-size: 25px;
}
.speakerView,
.speakerAudio,
.speakerWrite {
margin-top: auto;
margin-bottom: auto;
}
.container {
background: white;
padding: 30px;
margin-top: 50px;
border-radius: 12px;
box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
width: 90%;
max-width: 650px;
}
input[type="text"],
textarea,
select {
width: 80%;
padding: 10px;
margin-top: 5px;
border-radius: 6px;
border: 1px solid #ccc;
font-size: 14px;
}
textarea {
height: 120px;
resize: vertical;
}
.buttons {
display: flex;
justify-content: space-between;
margin-top: 25px;
}
.hidden {
visibility: hidden;
}
button {
padding: 10px 20px;
font-size: 14px;
border: none;
border-radius: 6px;
cursor: pointer;
transition: 0.2s;
background-color: #007BFF;
color: white;
}
button:hover {
background-color: #0056b3;
}
@media (max-width: 500px) {
.buttons {
flex-direction: column;
}
.buttons button {
width: 100%;
margin-top: 10px;
}
}
#result {
margin-top: 20px;
color: #333;
word-break: break-word;
}
+16 -36
View File
@@ -103,7 +103,23 @@ electron.ipcMain.handle('get-module-names', async () => {
return module_array return module_array
}); });
electron.ipcMain.on("save-speaker-mapping", (event, data) => {
const filePath = "/Users/mikehughes/PROJ/video2document/storage/speakerMapping/speakerMapping.json";
const payload = {
speakerId: data.speakerId,
speakerName: data.speakerName,
updated: new Date().toISOString()
};
try {
fs.writeFileSync(filePath, JSON.stringify(payload, null, 2), "utf8");
console.log("Speaker mapping saved!");
} catch (error) {
console.error("Failed to save speaker mapping", error);
}
});
// electron.ipcMain.on("get_modules", async (event, args) => { // electron.ipcMain.on("get_modules", async (event, args) => {
// let module_array = { // let module_array = {
// "ai_modules":[], // "ai_modules":[],
@@ -263,39 +279,3 @@ let q1 = {
{name:"qeg", displayname:"aqghegahu"} {name:"qeg", displayname:"aqghegahu"}
] ]
} }
//gibt Documentfiles an preload zurück
electron.ipcMain.handle('get-txt-files', () => {
const storagePath = `${mainDir}/storage/documentType`
return fs.readdirSync(storagePath)
.filter(f => f.endsWith('.txt'))
});
//speichern neuer document types
electron.ipcMain.handle('save-txt-file', (event, fileName, content) => {
const filePath = `${mainDir}/storage/documentType/${fileName}.txt`;
fs.writeFileSync(filePath, content, 'utf8');
return true;
});
//read file content
electron.ipcMain.handle('read-txt-file', (event, fileName) => {
const filePath = `${mainDir}/storage/documentType/${fileName}`;
return fs.readFileSync(filePath, 'utf8');
});
//delete documentfiles
electron.ipcMain.handle('delete-txt-file', (event, fileName) => {
const filePath = `${mainDir}/storage/documentType/${fileName}.txt`;
if (fs.existsSync(filePath)) {
fs.unlinkSync(filePath);
return true;
} else {
return false;
}
});
+8 -4
View File
@@ -450,6 +450,7 @@
"resolved": "https://registry.npmjs.org/@types/node/-/node-24.9.2.tgz", "resolved": "https://registry.npmjs.org/@types/node/-/node-24.9.2.tgz",
"integrity": "sha512-uWN8YqxXxqFMX2RqGOrumsKeti4LlmIMIyV0lgut4jx7KQBcBiW6vkDtIBvHnHIquwNfJhk8v2OtmO8zXWHfPA==", "integrity": "sha512-uWN8YqxXxqFMX2RqGOrumsKeti4LlmIMIyV0lgut4jx7KQBcBiW6vkDtIBvHnHIquwNfJhk8v2OtmO8zXWHfPA==",
"license": "MIT", "license": "MIT",
"peer": true,
"dependencies": { "dependencies": {
"undici-types": "~7.16.0" "undici-types": "~7.16.0"
} }
@@ -1305,7 +1306,8 @@
"version": "0.0.1534754", "version": "0.0.1534754",
"resolved": "https://registry.npmjs.org/devtools-protocol/-/devtools-protocol-0.0.1534754.tgz", "resolved": "https://registry.npmjs.org/devtools-protocol/-/devtools-protocol-0.0.1534754.tgz",
"integrity": "sha512-26T91cV5dbOYnXdJi5qQHoTtUoNEqwkHcAyu/IKtjIAxiEqPMrDiRkDOPWVsGfNZGmlQVHQbZRSjD8sxagWVsQ==", "integrity": "sha512-26T91cV5dbOYnXdJi5qQHoTtUoNEqwkHcAyu/IKtjIAxiEqPMrDiRkDOPWVsGfNZGmlQVHQbZRSjD8sxagWVsQ==",
"license": "BSD-3-Clause" "license": "BSD-3-Clause",
"peer": true
}, },
"node_modules/diff": { "node_modules/diff": {
"version": "4.0.2", "version": "4.0.2",
@@ -3488,9 +3490,10 @@
} }
}, },
"node_modules/qs": { "node_modules/qs": {
"version": "6.14.0", "version": "6.14.1",
"resolved": "https://registry.npmjs.org/qs/-/qs-6.14.0.tgz", "resolved": "https://registry.npmjs.org/qs/-/qs-6.14.1.tgz",
"integrity": "sha512-YWWTjgABSKcvs/nWBi9PycY/JiPJqOD4JA6o9Sej2AtvSGarXxKC3OQSk4pAarbdQlKAh5D4FCQkJNkW+GAn3w==", "integrity": "sha512-4EK3+xJl8Ts67nLYNwqw/dsFVnCf+qR7RgXSK9jEEm9unao3njwMDdmsdvoKBKHzxd7tCYz5e5M+SnMjdtXGQQ==",
"license": "BSD-3-Clause",
"dependencies": { "dependencies": {
"side-channel": "^1.1.0" "side-channel": "^1.1.0"
}, },
@@ -4204,6 +4207,7 @@
"integrity": "sha512-jl1vZzPDinLr9eUt3J/t7V6FgNEw9QjvBPdysz9KfQDD41fQrC2Y4vKQdiaUpFT4bXlb1RHhLpp8wtm6M5TgSw==", "integrity": "sha512-jl1vZzPDinLr9eUt3J/t7V6FgNEw9QjvBPdysz9KfQDD41fQrC2Y4vKQdiaUpFT4bXlb1RHhLpp8wtm6M5TgSw==",
"devOptional": true, "devOptional": true,
"license": "Apache-2.0", "license": "Apache-2.0",
"peer": true,
"bin": { "bin": {
"tsc": "bin/tsc", "tsc": "bin/tsc",
"tsserver": "bin/tsserver" "tsserver": "bin/tsserver"
@@ -0,0 +1,70 @@
const fs = require('fs');
const path = require('path');
const module_exports = {
name: "replace_speaker",
type: "processor",
displayname: "Speaker Name Replacer",
description: "Replaces speaker placeholder names with actual names based on a mapping in HTML files",
async function({ inputHtmlPath, speakerMappingPath }) {
return await this.replaceNames(inputHtmlPath, speakerMappingPath);
},
replaceNames: async function(inputHtmlPath, speakerMappingPath) {
try {
const htmlContent = await fs.promises.readFile(inputHtmlPath, "utf-8");
const mappingData = await fs.promises.readFile(speakerMappingPath, "utf-8");
let speakerMap = {};
try {
const parsed = JSON.parse(mappingData);
if (parsed.speakerId && parsed.speakerName) {
speakerMap[parsed.speakerId] = parsed.speakerName;
} else {
Object.assign(speakerMap, parsed);
}
} catch (e) {
const lines = mappingData.trim().split('\n');
lines.forEach(line => {
const [placeholder, realName] = line.split(',').map(s => s.trim());
if (placeholder && realName) speakerMap[placeholder] = realName;
});
}
let outputContent = htmlContent;
Object.entries(speakerMap).forEach(([placeholder, realName]) => {
const regex = new RegExp(`[\$begin:math:text$\\\\\[\]\?\$\{placeholder\}\[\\$end:math:text$\\]]?`, 'g');
outputContent = outputContent.replace(regex, realName);
});
await fs.promises.writeFile(inputHtmlPath, outputContent, "utf-8");
return inputHtmlPath;
} catch (error) {
console.error("Error replacing speaker names:", error);
throw error;
}
}
};
module.exports = module_exports;
if (require.main === module) {
(async () => {
const args = process.argv.slice(2);
if (args.length < 2) process.exit(1);
const [inputHtmlPath, speakerMappingPath] = args;
if (!fs.existsSync(inputHtmlPath)) process.exit(1);
if (!fs.existsSync(speakerMappingPath)) process.exit(1);
try {
await module_exports.replaceNames(inputHtmlPath, speakerMappingPath);
} catch (err) {
process.exit(1);
}
})();
}
@@ -0,0 +1,5 @@
{
"speakerId": "speakerB",
"speakerName": "Peter",
"updated": "2026-01-10T13:54:55.608Z"
}