+
+
Manage document types
+ + + + + +
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Upload your video here:
@@ -82,7 +110,7 @@
-
@@ -105,18 +133,25 @@
+
+ 
+ 
+
+
+
+
+
+
@@ -128,7 +163,7 @@
-
Klick to submit:
+Click to submit:
diff --git a/electron/main/languages.js b/electron/main/languages.js
index 31ed3f9..fc0b1da 100644
--- a/electron/main/languages.js
+++ b/electron/main/languages.js
@@ -29,7 +29,19 @@ var languageOptions = {
"box1_p1": "---Starting---",
"box2_p2": "---Transkribing---",
"box3_p3": "---Document creation---",
- "labelType": "Select document type:"
+ "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":{
@@ -62,7 +74,19 @@ var languageOptions = {
"box1_p1": "---Startet---",
"box2_p2": "---Transkribing---",
"box3_p3": "---Dokument kreieren---",
- "labelType": "Wähle Dokumenttype:"
+ "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":{
"flagPath": "flags/india-flag-png-large.png",
@@ -94,7 +118,19 @@ var languageOptions = {
"box1_p1": "---प्रारंभ---",
"box2_p2": "---प्रतिलेखन---",
"box3_p3": "---दस्तावेज़ निर्माण---",
- "labelType": "दस्तावेज़ प्रकार चुनें:"
+ "labelType": "दस्तावेज़ प्रकार चुनें:",
+
+ "customDocBtn": "दस्तावेज़ प्रकार प्रबंधित करें",
+ "cd_h1": "दस्तावेज़ प्रकार प्रबंधित करें",
+ "cd_existingDocs": "मौजूदा दस्तावेज़ों का चयन करें (वैकल्पिक):",
+ "cd_docName": "दस्तावेज़ का नाम",
+ "docName": "यहां दस्तावेज़ का नाम दर्ज करें",
+ "cd_promt": "आपका संकेत:",
+ "prompt": "अपने दस्तावेज़ के लिए प्रॉम्प्ट यहां टाइप करें...",
+ "goBackBtn": "वापस करना",
+ "deleteBtn": "दस्तावेज़ हटाएँ",
+ "generateBtn": "दस्तावेज़ सहेजें",
+ "newDoc": "-- नया दस्तावेज़ बनाएँ --"
}
diff --git a/electron/main/renderer.js b/electron/main/renderer.js
index 58856de..38d8e78 100644
--- a/electron/main/renderer.js
+++ b/electron/main/renderer.js
@@ -5,12 +5,12 @@ Listeners for the program setup and changes
*/
//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) => {
+window.addEventListener('load', async (e) => {
try {
- loadLanguageOptions();
- const value = await window.onStartup.getModuleNames();
- loadAiOptions(value.ai_modules);
- loadTranscriptionOptions(value.transcription_modules);
+ 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");
@@ -19,15 +19,15 @@ window.addEventListener('load', async (e) => {
});
//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);
- }
-
+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 => {
@@ -36,7 +36,7 @@ stepButtons.forEach(btn => {
const step = parseInt(btn.dataset.step);
showStep(step);
} catch (error) {
-
+
}
});
});
@@ -46,16 +46,16 @@ 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);
+ if (currentStep < totalSteps) showStep(currentStep + 1);
} catch (error) {
-
+
}
});
@@ -66,36 +66,36 @@ Listeners for Step 1
*/
//Listener if a file has been draged over the drop down field
-uploadContainer.addEventListener("dragover", (e) =>{
- try {
- e.stopPropagation();
- e.preventDefault();
- } catch (error) {
- console.log("Error in renderer.js dragover listener function")
- }
-
+uploadContainer.addEventListener("dragover", (e) => {
+ try {
+ e.stopPropagation();
+ e.preventDefault();
+ } catch (error) {
+ console.log("Error in renderer.js dragover listener function")
+ }
+
});
//listener for when a file get dropped on the drag&drop field
uploadContainer.addEventListener("drop", (e) => {
- try {
- e.stopPropagation()
- e.preventDefault()
- const files = e.dataTransfer.files
- const filePath = window.explorer.onFileDrop(files[0])
- const testEndings = [".mp4", ".mov", ".avi", ".mkv"];
- var pathToLower = filePath.toLowerCase();
- if(testEndings.some(e => pathToLower.endsWith(e))){
- const files1 = e.dataTransfer.files;
- handleFiles(files1);
- }else{
- alert('The given file is not compatible. These are the available types: [".mp4", ".mov", ".avi", ".mkv"].');
- }
-
- } catch (error) {
- console.log("Error in renderer.js with the listerner for the drop function");
- console.log(error);
- }
+ try {
+ e.stopPropagation()
+ e.preventDefault()
+ const files = e.dataTransfer.files
+ const filePath = window.explorer.onFileDrop(files[0])
+ const testEndings = [".mp4", ".mov", ".avi", ".mkv"];
+ var pathToLower = filePath.toLowerCase();
+ if (testEndings.some(e => pathToLower.endsWith(e))) {
+ const files1 = e.dataTransfer.files;
+ handleFiles(files1);
+ } else {
+ alert('The given file is not compatible. These are the available types: [".mp4", ".mov", ".avi", ".mkv"].');
+ }
+
+ } catch (error) {
+ console.log("Error in renderer.js with the listerner for the drop function");
+ console.log(error);
+ }
})
//listener for the file explorer search when something got selected
@@ -118,7 +118,7 @@ manualUploadBtn.addEventListener('click', () => {
console.log("Error in manualBtn EventListener click");
console.log(error);
}
-
+
});
/*
@@ -133,65 +133,82 @@ 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);
+ });
+});
+
//Checkboxlistener so that only one can be selected at a time
-docFormat.addEventListener("change", (e) =>{
+docFormat.addEventListener("change", (e) => {
try {
- if(docFormat.checked){
+ if (docFormat.checked) {
docFormatSummary1.checked = false;
docFormatSummary2.checked = false;
docFormatSummary3.checked = false;
docFormatCustom.checked = false;
}
} catch (error) {
-
+
}
});
-docFormatSummary1.addEventListener("change", (e) =>{
+docFormatSummary1.addEventListener("change", (e) => {
try {
- if(docFormatSummary1.checked){
+ if (docFormatSummary1.checked) {
docFormat.checked = false;
docFormatSummary2.checked = false;
docFormatSummary3.checked = false;
docFormatCustom.checked = false;
}
} catch (error) {
-
+
}
});
-docFormatSummary2.addEventListener("change", (e) =>{
+docFormatSummary2.addEventListener("change", (e) => {
try {
- if(docFormatSummary2.checked){
+ if (docFormatSummary2.checked) {
docFormatSummary1.checked = false;
docFormat.checked = false;
docFormatSummary3.checked = false;
docFormatCustom.checked = false;
}
} catch (error) {
-
+
}
});
-docFormatSummary3.addEventListener("change", (e) =>{
+docFormatSummary3.addEventListener("change", (e) => {
try {
- if(docFormatSummary3.checked){
+ if (docFormatSummary3.checked) {
docFormatSummary1.checked = false;
docFormatSummary2.checked = false;
docFormat.checked = false;
docFormatCustom.checked = false;
}
} catch (error) {
-
+
}
});
-docFormatCustom.addEventListener("change", (e) =>{
+docFormatCustom.addEventListener("change", (e) => {
try {
- if(docFormatCustom.checked){
+ if (docFormatCustom.checked) {
docFormatSummary1.checked = false;
docFormatSummary2.checked = false;
docFormatSummary3.checked = false;
docFormat.checked = false;
}
} catch (error) {
-
+
}
});
@@ -202,62 +219,62 @@ Listeners for Step 4
*/
//Functions the the displayed progress in the progressbar can be changed out of the main process
window.electron.progress((event, arg) => {
- if(arg.curstep == 1){
- setCircleOne();
- }else if(arg.curstep == 2){
- setCircleZwo();
- } else if(arg.curstep == 3){
- setCircleThree();
- }else if(arg.curstep == 4){
- setCircleFour();
- }
+ if (arg.curstep == 1) {
+ setCircleOne();
+ } else if (arg.curstep == 2) {
+ setCircleZwo();
+ } else if (arg.curstep == 3) {
+ setCircleThree();
+ } else if (arg.curstep == 4) {
+ setCircleFour();
+ }
});
-function setCircleOne(){
+function setCircleOne() {
try {
- if(document.getElementById("box1").style.backgroundColor == "green"){
+ if (document.getElementById("box1").style.backgroundColor == "green") {
document.getElementById("box1").style.backgroundColor = "red";
- }else{
+ } else {
document.getElementById("box1").style.backgroundColor = "green";
}
} catch (error) {
}
};
-function setCircleZwo(){
+function setCircleZwo() {
try {
- if(document.getElementById("box2").style.backgroundColor == "green"){
+ if (document.getElementById("box2").style.backgroundColor == "green") {
document.getElementById("box2").style.backgroundColor = "red";
- }else{
+ } else {
document.getElementById("box2").style.backgroundColor = "green";
}
} catch (error) {
-
+
}
-
+
};
-function setCircleThree(){
+function setCircleThree() {
try {
- if(document.getElementById("box3").style.backgroundColor == "green"){
+ if (document.getElementById("box3").style.backgroundColor == "green") {
document.getElementById("box3").style.backgroundColor = "red";
- }else{
+ } else {
document.getElementById("box3").style.backgroundColor = "green";
}
} catch (error) {
-
+
}
-
+
};
-function setCircleFour(){
+function setCircleFour() {
try {
- if(document.getElementById("box4").style.backgroundColor == "green"){
+ if (document.getElementById("box4").style.backgroundColor == "green") {
document.getElementById("box4").style.backgroundColor = "red";
- }else{
+ } else {
document.getElementById("box4").style.backgroundColor = "green";
}
} catch (error) {
-
- }
+
+ }
};
/*
@@ -267,11 +284,11 @@ Listeners for Step 5
*/
//Speaker change listener
-cur_speaker.addEventListener("change", (e) =>{
+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
@@ -282,5 +299,93 @@ window.audios.speakerAudios((event, 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", "");
+});
+
diff --git a/electron/main/script.js b/electron/main/script.js
index 4b56dd5..581b4a2 100644
--- a/electron/main/script.js
+++ b/electron/main/script.js
@@ -5,6 +5,24 @@ let currentVideoPath = null;
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) {
@@ -38,12 +56,24 @@ function changeLanguage(language) {
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);
}
-
+
}
/*
@@ -59,7 +89,7 @@ let currentStep = 1;
const totalSteps = steps.length;
function showStep(stepNumber) {
- if (stepNumber < 1 || stepNumber > totalSteps){
+ if (stepNumber < 1 || stepNumber > totalSteps) {
console.error("StepNumber out of Bounds", stepNumber);
return;
}
@@ -70,7 +100,7 @@ function showStep(stepNumber) {
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");
+ if (activeBtn) activeBtn.classList.add("active");
prevBtn.disabled = stepNumber == 1;
nextBtn.disabled = stepNumber === totalSteps;
@@ -105,7 +135,7 @@ function handleFiles(files) {
}
//Video thumbnail generation. Shows a scene from the selected video file as a preview
-function generateThumbnail(path){
+function generateThumbnail(path) {
try {
const videoElement = document.getElementById("previewThumbnail");
while (videoElement.firstChild) videoElement.removeChild(videoElement.firstChild);
@@ -119,7 +149,7 @@ function generateThumbnail(path){
console.log("Error in the generateThumbnail function in the script.js file \n");
console.log(error);
}
-
+
}
@@ -131,13 +161,13 @@ Functions used in Step 2
*/
//function to load ai options to the drop down list
-function loadAiOptions(options){
+function loadAiOptions(options) {
try {
var menu = document.getElementById('ai_type');
var object_holdy;
- var choice ;
+ var choice;
object_holdy = options
- for(i = 0; i < options.length; i++){
+ for (i = 0; i < options.length; i++) {
choice = document.createElement('option');
choice.textContent = object_holdy[i].displayname;
choice.value = object_holdy[i].name;
@@ -150,13 +180,13 @@ function loadAiOptions(options){
}
//function to load transcription options to the drop down list
-function loadTranscriptionOptions(options){
+function loadTranscriptionOptions(options) {
try {
var menu = document.getElementById('transkript_type');
var object_holdy;
- var choice ;
+ var choice;
object_holdy = options
- for(i = 0; i < options.length; i++){
+ for (i = 0; i < options.length; i++) {
choice = document.createElement('option');
choice.textContent = object_holdy[i].displayname;
choice.value = object_holdy[i].name;
@@ -169,13 +199,13 @@ function loadTranscriptionOptions(options){
}
//function to load data type options to the drop down list
-function loadDataTypeOptions(options){
+function loadDataTypeOptions(options) {
try {
var menu = document.getElementById('output_type');
var object_holdy;
- var choice ;
+ var choice;
object_holdy = options
- for(i = 0; i < options.length; i++){
+ for (i = 0; i < options.length; i++) {
choice = document.createElement('option');
choice.textContent = object_holdy[i].displayname;
choice.value = object_holdy[i].name;
@@ -188,21 +218,30 @@ function loadDataTypeOptions(options){
}
//function to load language options to the drop down list
-function loadLanguageOptions(){
+function loadLanguageOptions() {
try {
-
+
var menu = document.getElementById('language_option');
+ var menu_doc = document.getElementById('document_language_option');
var object_holdy;
- var choice ;
+ var choice;
+ var choice2;
object_holdy = Object.keys(languageOptions);
- for(i = 0; i < object_holdy.length; i++){
+ 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);
@@ -225,14 +264,14 @@ Functions used in Step 4
*/
-//function to check if one checkbox is at least klicked. Final controll function before sending the input to the generation
+//function to check if one checkbox is at least clicked. Final controll function before sending the input to the generation
function checkBoxes() {
try {
const checkboxes = document.querySelectorAll('input[name="docFormat"]');
let isChecked = false;
var checkedCounter = 0;
- checkboxes.forEach(function(checkbox){
- if(checkbox.checked){
+ checkboxes.forEach(function (checkbox) {
+ if (checkbox.checked) {
isChecked = true;
checkedCounter++;
}
@@ -241,24 +280,24 @@ function checkBoxes() {
if (isChecked) {
//Code to submit the video
var selectedCheckboxes = {};
- checkboxes.forEach(function(checkbox){
- if(checkbox.checked){
+ checkboxes.forEach(function (checkbox) {
+ if (checkbox.checked) {
selectedCheckboxes[checkbox.nextElementSibling.textContent] = "";
- }
+ }
});
const testEndings = [".mp4", ".mov", ".avi", ".mkv"];
var pathTest = window.electronAPI.getFilePath(videoUpload.files[0]);
var pathToLower = pathTest.toLowerCase();
- if(testEndings.some(e => pathToLower.endsWith(e))){
+ if (testEndings.some(e => pathToLower.endsWith(e))) {
//assembly of the json for the main
var typeCheckbox;
- if(document.getElementById("docFormat").checked) typeCheckbox = document.getElementById("docFormat").value;
- if(document.getElementById("docFormatSummary1").checked) typeCheckbox = document.getElementById("docFormatSummary1").value;
- if(document.getElementById("docFormatSummary2").checked) typeCheckbox = document.getElementById("docFormatSummary2").value;
- if(document.getElementById("docFormatSummary3").checked) typeCheckbox = document.getElementById("docFormatSummary3").value;
- if(document.getElementById("docFormatCustom").checked) typeCheckbox = document.getElementById("docFormatCustom").value;
+ if (document.getElementById("docFormat").checked) typeCheckbox = document.getElementById("docFormat").value;
+ if (document.getElementById("docFormatSummary1").checked) typeCheckbox = document.getElementById("docFormatSummary1").value;
+ if (document.getElementById("docFormatSummary2").checked) typeCheckbox = document.getElementById("docFormatSummary2").value;
+ if (document.getElementById("docFormatSummary3").checked) typeCheckbox = document.getElementById("docFormatSummary3").value;
+ if (document.getElementById("docFormatCustom").checked) typeCheckbox = document.getElementById("docFormatCustom").value;
document.getElementById("testy").style.visibility = "visible"
document.getElementById("box1").style.backgroundColor = "red";
@@ -271,20 +310,20 @@ function checkBoxes() {
const aiType = document.getElementById("ai_type");
const sendingPackage = {
"video": {
- "module":"extraction-video-to-audio",
+ "module": "extraction-video-to-audio",
"inputVideoPath": pathTest
},
"transcription": {
"module": transcriptionType.value
},
"document": {
- "module":aiType.value,
+ "module": aiType.value,
"type": typeCheckbox,
"outputType": outputType.value
}
};
window.submit.submit(sendingPackage)
- }else{
+ } else {
alert('The given file is not compatible. These are the available types: [".mp4", ".mov", ".avi", ".mkv"].');
}
@@ -297,11 +336,11 @@ function checkBoxes() {
console.log("Error in script.js checkBoxes function");
console.log(error);
}
-
+
}
//function the the submit button on step 4 can be pressed
-function activateSubmitBtn(hasFile){
+function activateSubmitBtn(hasFile) {
try {
document.getElementById("submitButton").disabled = !hasFile;
} catch (error) {
@@ -319,11 +358,11 @@ function updateProgressBar(bar, value) {
console.log("Error in scripts.js updateProgressBar function");
console.log(error);
}
-
+
}
//function to hide the progressbar
-function deaktivateProgressbar(){
+function deaktivateProgressbar() {
try {
document.getElementById("progressbar").style.visibility = "hidden";
} catch (error) {
@@ -339,17 +378,17 @@ Functions used in Step 5
//function to load speaker options to the drop down list
-function loadSpeakerOptions(options){
+function loadSpeakerOptions(options) {
try {
var menu = document.getElementById('cur_speaker');
- var l = document.getElementById('cur_speaker').options.length -1;
- for(i = l; i >= 0; i--){
+ var l = document.getElementById('cur_speaker').options.length - 1;
+ for (i = l; i >= 0; i--) {
menu.remove(i);
}
var object_holdy;
var choice;
object_holdy = Object.keys(options);
- for(i = 0; i < object_holdy.length; i++){
+ for (i = 0; i < object_holdy.length; i++) {
choice = document.createElement('option');
choice.textContent = options[object_holdy[i]].name;
choice.value = object_holdy[i];
@@ -363,7 +402,7 @@ function loadSpeakerOptions(options){
}
//function to load speaker audio file options to the drop down list
-function loadSpeakerAudio(option){
+function loadSpeakerAudio(option) {
try {
var menu = document.getElementById('speakerAudioViewer');
var aud = document.createElement("source");
@@ -378,17 +417,17 @@ function loadSpeakerAudio(option){
//Audio value setter
var speakerAudios = {};
var speakerEndValues = {};
-function setSpeakerAudiosValue(valy){
+function setSpeakerAudiosValue(valy) {
try {
speakerAudios = valy;
speakerRewriten = valy;
document.getElementById("speakerAudioViewer").src = valy.speakerA.src;
} catch (error) {
-
+
}
}
//Function to rewrite the speaker name in the json
-function rewriteSpeakerName(){
+function rewriteSpeakerName() {
try {
var tempy = document.getElementById("cur_speaker").value;
speakerAudios[tempy].name = document.getElementById("newSpeaker").value;
@@ -398,7 +437,7 @@ function rewriteSpeakerName(){
}
}
//Function to send the json with the given names back to the program to rewrite the document file
-function sendSpeakerPackages(){
+function sendSpeakerPackages() {
try {
window.submitSpeaker.speaker_submit(speakerAudios);
} catch (error) {
@@ -421,14 +460,29 @@ function fileDownload() {
}
-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ß
- costumDocumentType.appendChild(option);
- });
- });
\ No newline at end of file
+
+
+
+/*
+
+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);
+ });
+ });
+}
\ No newline at end of file
diff --git a/electron/main/style.css b/electron/main/style.css
index 4f30c2d..ee73be1 100644
--- a/electron/main/style.css
+++ b/electron/main/style.css
@@ -9,7 +9,7 @@ body {
gap: 10px;
margin: 0;
}
-
+
#h1 {
position: absolute;
left: 50%;
@@ -22,42 +22,42 @@ body {
#h1-wrapper {
position: relative;
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
- width: 770px;
- height: 60px;
+ width: 780px;
+ height: 60px;
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;
margin-bottom: 10px;
display: flex;
align-items: center;
-}
+}
.upload-container {
background: white;
padding: 40px;
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;
width: 350px;
height: 200px;
transition: border 0.3s, background-color 0.3s;
border: 2px dashed #7378c9;
}
-
-
+
+
.upload-container.dragover {
border-color: #007BFF;
background-color: #eaf0ff;
}
-
-
+
+
.upload-container p {
margin: 0 0 15px 0;
font-size: 16px;
color: #555;
}
-
-
+
+
.file-name {
margin-top: 10px;
font-size: 14px;
@@ -66,19 +66,19 @@ body {
text-overflow: ellipsis;
white-space: nowrap;
}
-
+
#thumbnailContainer {
width: 100%;
display: flex;
justify-content: center;
margin-bottom: 15px;
}
-
+
#thumbnailImage {
width: 200px;
height: auto;
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;
}
@@ -87,7 +87,7 @@ body {
height: 100px;
/*border: 1px dashed black;*/
}
-
+
.custom-btn {
padding: 10px 20px;
margin-top: 10px;
@@ -98,81 +98,87 @@ body {
cursor: pointer;
font-size: 14px;
}
-
-
+
+
.custom-btn:hover {
background-color: #0056b3;
}
-
+
.submit-btn:hover {
background-color: #0056b3;
}
#step2 {
- gap: 30px;
+ gap: 25px;
}
.KI-wrapper {
margin-top: 10px;
}
-
+
input[type="file"] {
display: none;
}
-
+
.checkbox-group {
- --borderColor: #007bfff5;
- --borderWidth: .125em;
- }
+ --borderColor: #007bfff5;
+ --borderWidth: .125em;
+}
- .checkbox-group input[type=checkbox] {
- -webkit-appearance: none;
- appearance: none;
- vertical-align: middle;
- background: #fff;
- font-size: 1.8em;
- border-radius: 0.125em;
- display: inline-block;
- border: var(--borderWidth) solid var(--borderColor);
- width: 1em;
- height: 1em;
- position: relative;
- }
- .checkbox-group input[type=checkbox]:before,
- .checkbox-group input[type=checkbox]:after {
- content: "";
- position: absolute;
- background: var(--borderColor);
- width: calc(var(--borderWidth) * 3);
- height: var(--borderWidth);
- top: 50%;
- left: 10%;
- transform-origin: left center;
- }
- .checkbox-group input[type=checkbox]:before {
- transform: rotate(45deg) translate(calc(var(--borderWidth) / -2), calc(var(--borderWidth) / -2)) scaleX(0);
- transition: transform 200ms ease-in 200ms;
- }
- .checkbox-group input[type=checkbox]:after {
- width: calc(var(--borderWidth) * 5);
- transform: rotate(-45deg) translateY(calc(var(--borderWidth) * 2)) scaleX(0);
- transform-origin: left center;
- transition: transform 200ms ease-in;
- }
- .checkbox-group input[type=checkbox]:checked:before {
- transform: rotate(45deg) translate(calc(var(--borderWidth) / -2), calc(var(--borderWidth) / -2)) scaleX(1);
- transition: transform 200ms ease-in;
- }
- .checkbox-group input[type=checkbox]:checked:after {
- width: calc(var(--borderWidth) * 5);
- transform: rotate(-45deg) translateY(calc(var(--borderWidth) * 2)) scaleX(1);
- transition: transform 200ms ease-out 200ms;
- }
- .checkbox-group input[type=checkbox]:focus {
- outline: calc(var(--borderWidth) / 2) dotted rgba(0, 0, 0, 0.25);
- }
+.checkbox-group input[type=checkbox] {
+ -webkit-appearance: none;
+ appearance: none;
+ vertical-align: middle;
+ background: #fff;
+ font-size: 1.8em;
+ border-radius: 0.125em;
+ display: inline-block;
+ border: var(--borderWidth) solid var(--borderColor);
+ width: 1em;
+ height: 1em;
+ position: relative;
+}
-.checkbox-container{
+.checkbox-group input[type=checkbox]:before,
+.checkbox-group input[type=checkbox]:after {
+ content: "";
+ position: absolute;
+ background: var(--borderColor);
+ width: calc(var(--borderWidth) * 3);
+ height: var(--borderWidth);
+ top: 50%;
+ left: 10%;
+ transform-origin: left center;
+}
+
+.checkbox-group input[type=checkbox]:before {
+ transform: rotate(45deg) translate(calc(var(--borderWidth) / -2), calc(var(--borderWidth) / -2)) scaleX(0);
+ transition: transform 200ms ease-in 200ms;
+}
+
+.checkbox-group input[type=checkbox]:after {
+ width: calc(var(--borderWidth) * 5);
+ transform: rotate(-45deg) translateY(calc(var(--borderWidth) * 2)) scaleX(0);
+ transform-origin: left center;
+ transition: transform 200ms ease-in;
+}
+
+.checkbox-group input[type=checkbox]:checked:before {
+ transform: rotate(45deg) translate(calc(var(--borderWidth) / -2), calc(var(--borderWidth) / -2)) scaleX(1);
+ transition: transform 200ms ease-in;
+}
+
+.checkbox-group input[type=checkbox]:checked:after {
+ width: calc(var(--borderWidth) * 5);
+ transform: rotate(-45deg) translateY(calc(var(--borderWidth) * 2)) scaleX(1);
+ transition: transform 200ms ease-out 200ms;
+}
+
+.checkbox-group input[type=checkbox]:focus {
+ outline: calc(var(--borderWidth) / 2) dotted rgba(0, 0, 0, 0.25);
+}
+
+.checkbox-container {
margin-top: 8px;
display: flex;
justify-items: left;
@@ -180,13 +186,38 @@ input[type="file"] {
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 {
display: flex;
align-items: center;
justify-content: center;
padding: 10px 20px;
- margin: 100px auto 10px auto;
+ margin: 110px auto 10px auto;
background-color: #007BFF;
color: white;
border: none;
@@ -194,29 +225,29 @@ input[type="file"] {
cursor: pointer;
font-size: 14px;
}
-
+
.submit-btn:disabled {
opacity: 0.5;
cursor: not-allowed;
pointer-events: none;
}
-
+
.mitte {
background-color: #FFF;
display: flex;
- width: 700px;
+ width: 780px;
+ height: 500px;
flex-direction: column;
align-items: center;
- padding: 40px;
gap: 10px;
border: 0px;
border-color: black;
border-style: solid;
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;
width: 210px;
height: 30px;
@@ -226,15 +257,15 @@ input[type="file"] {
overflow: hidden;
visibility: hidden;
}
-
-.progress_fill{
+
+.progress_fill {
width: 0%;
height: 100%;
background: green;
transition: all 0.2s;
}
-
-.progress_text{
+
+.progress_text {
position: absolute;
top: 50%;
right: 5px;
@@ -252,7 +283,9 @@ input[type="file"] {
padding: 2px 10px 2px 10px;
}
-#ai_type, #transkript_type, #language_option {
+#ai_type,
+#transkript_type,
+#language_option {
padding: 3px;
}
@@ -260,7 +293,7 @@ input[type="file"] {
gap: 60px;
display: flex;
justify-content: center;
- overflow-wrap:inherit;
+ overflow-wrap: inherit;
padding-bottom: 20px;
margin-top: 40px;
margin-bottom: 10px;
@@ -274,7 +307,9 @@ input[type="file"] {
background: #fff;
padding: 10px 30px;
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 {
@@ -297,7 +332,9 @@ input[type="file"] {
/*panels*/
.step {
- margin-top: 50px;
+ margin-top: 40px;
+ margin-bottom: 40px;
+ ;
display: flex;
flex-direction: column;
min-height: 425px;
@@ -336,7 +373,7 @@ input[type="file"] {
cursor: not-allowed;
}
-.testy{
+.testy {
background-color: #FFF;
display: flex;
width: auto;
@@ -352,13 +389,13 @@ input[type="file"] {
}
.box2 {
- background-color: red;
- width: 40px;
- height: 40px;
- padding: 5px;
- border: 1px solid black;
- margin: 5px;
- border-radius: 100px;
+ background-color: red;
+ width: 40px;
+ height: 40px;
+ padding: 5px;
+ border: 1px solid black;
+ margin: 5px;
+ border-radius: 100px;
}
li {
@@ -394,24 +431,24 @@ li {
display: none;
}
-#toggle1:checked + .hamburger1 .top {
+#toggle1:checked+.hamburger1 .top {
-webkit-transform: rotate(-45deg);
- transform: rotate(-45deg);
+ transform: rotate(-45deg);
margin-top: 22.5px;
}
-#toggle1:checked + .hamburger1 .meat {
+#toggle1:checked+.hamburger1 .meat {
-webkit-transform: rotate(45deg);
- transform: rotate(45deg);
+ transform: rotate(45deg);
margin-top: -5px;
}
-#toggle1:checked + .hamburger1 .bottom {
+#toggle1:checked+.hamburger1 .bottom {
-webkit-transform: scale(0);
- transform: scale(0);
+ transform: scale(0);
}
-#toggle1:checked ~ .menu1 {
+#toggle1:checked~.menu1 {
height: 150px;
width: 300px;
}
@@ -465,7 +502,9 @@ li {
transition: all 0.3s ease;
}
-#step2, #step3, #step5 {
+#step2,
+#step3,
+#step5 {
font-size: larger;
}
@@ -489,7 +528,7 @@ li {
align-items: center;
justify-content: center;
padding: 10px 20px;
- margin: 100px auto 10px auto;
+ margin: 110px auto 10px auto;
background-color: #007BFF;
color: white;
border: none;
@@ -498,7 +537,8 @@ li {
font-size: 14px;
}
-#speakerLocker, #speakerResender{
+#speakerLocker,
+#speakerResender {
padding: 10px 20px;
margin: 20px auto;
background-color: #007BFF;
@@ -513,7 +553,77 @@ li {
font-size: 25px;
}
-.speakerView, .speakerAudio, .speakerWrite{
+.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;
}
\ No newline at end of file