From 1a681eb2b8d49f652fe61e06d2579fb089c8a177 Mon Sep 17 00:00:00 2001 From: "eric.minning" Date: Wed, 12 Nov 2025 20:14:56 +0100 Subject: [PATCH 001/121] Improved error log and implemented a variable and function for file path storage --- electron/main/preload.js | 10 +++++----- electron/main/renderer.js | 5 ++++- electron/main/script.js | 34 +++++++++++++++++++++++++++++----- 3 files changed, 38 insertions(+), 11 deletions(-) diff --git a/electron/main/preload.js b/electron/main/preload.js index 5a7a5d7..2ea0ca5 100644 --- a/electron/main/preload.js +++ b/electron/main/preload.js @@ -1,12 +1,12 @@ - - const { contextBridge, ipcRenderer, webUtils } = require('electron') try { contextBridge.exposeInMainWorld("explorer", { onFileDrop: (file) => webUtils.getPathForFile(file) - }) + }) + contextBridge.exposeInMainWorld("extractor", { + extract: (file) => ipcRenderer.send("extract", file) + }) } catch (error) { console.log("Error in preload.js"); -} - +} \ No newline at end of file diff --git a/electron/main/renderer.js b/electron/main/renderer.js index ad684ef..4175191 100644 --- a/electron/main/renderer.js +++ b/electron/main/renderer.js @@ -4,7 +4,8 @@ uploadContainer.addEventListener("dragover", (e) =>{ e.stopPropagation(); e.preventDefault(); } catch (error) { - console.log("Error in renderer.js dragover listener function") + console.log("Error in renderer.js dragover listener function"); + console.log(error); } }); @@ -21,10 +22,12 @@ uploadContainer.addEventListener("drop", (e) => { console.log(filePath) const files1 = e.dataTransfer.files; + setCurrentPathVariable(filePath); handleFiles(files1); } } catch (error) { console.log("Error in renderer.js with the listerner for the drop function"); + console.log(error); } diff --git a/electron/main/script.js b/electron/main/script.js index ab94700..8935a38 100644 --- a/electron/main/script.js +++ b/electron/main/script.js @@ -1,10 +1,11 @@ - +var curSelecPath = ""; //listener for the file explorer search manualUploadBtn.addEventListener('click', () => { try { videoUpload.click(); } catch (error) { console.log("Error in manualBtn EventListener click"); + console.log(error); } }); @@ -23,16 +24,16 @@ function checkBoxes() { if(isChecked){ //Code to submit the video - var pathTest = fileName.textContent + ""; - if(pathTest.endsWith(".mp4") || holdy.endsWith(".mov") || holdy.endsWith(".avi") || holdy.endsWith( ".mkv")){ - mapFunctions.get("extraction-video-to-audio").function({inputVideoPath: pathTest, outputType:"wav"}); + if(curSelecPath.endsWith(".mp4") || holdy.endsWith(".mov") || holdy.endsWith(".avi") || holdy.endsWith( ".mkv")){ + window.extractor.extract({inputVideoPath: curSelecPath, outputType:"wav"}) } } else { //language only english at the moment alert('Please select at least one document type.'); } } catch (error) { - console.log("Error") + console.log("Error in script.js checkBoxes function"); + console.log(error); } // mapFunctions.get("extraction-video-to-audio").function({inputVideoPath:"./a.mp4", outputType:"wav"}) @@ -40,6 +41,7 @@ function checkBoxes() { //language changing feature function changeLanguage(language) { + try { if (language === 'en') { document.getElementById('title').textContent = 'Video to document'; document.getElementById('h1').textContent = 'Video to document'; @@ -71,6 +73,11 @@ function changeLanguage(language) { document.getElementById('label_summary').textContent = 'टाइमस्टैम्प के साथ सारांश'; document.getElementById('submitButton').textContent = 'जमा करना'; } + } catch (error) { + console.log("Error in script.js changeLanguage function"); + console.log(error); + } + } @@ -80,6 +87,7 @@ videoUpload.addEventListener('change', () => { handleFiles(videoUpload.files); } catch (error) { console.log("Error in manualBtn EventListener change"); + console.log(error); } }); @@ -94,10 +102,16 @@ function handleFiles(files) { if (file.type.startsWith('video/')) { videoUpload.files = files; fileName.textContent = `Chosen video: ${file.name}`; + setCurrentPathVariable(files[0]) + }else{ + setCurrentPathVariable(""); } + }else{ + setCurrentPathVariable(""); } } catch (error) { console.log("Error in script.js handleFiles function"); + console.log(error); } } @@ -110,6 +124,16 @@ function updateProgressBar(bar, value){ bar.querySelector(".progress_text").textContent = `${value}%`; } catch (error) { console.log("Error in scripts.js updateProgressBar function"); + console.log(error); } +} + +function setCurrentPathVariable(value){ + try { + curSelecPath = value + ""; + } catch (error) { + console.log("Error in script.js setCurrentPathVariable"); + console.log(error); + } } \ No newline at end of file From 4a91f03289ac118bb0b948f7b62fd8eded79b850 Mon Sep 17 00:00:00 2001 From: "eric.minning" Date: Fri, 14 Nov 2025 18:32:41 +0100 Subject: [PATCH 002/121] Implemented a dropdown field for the languages as well as functions and a file to easily implement other languages. --- electron/main/index.html | 12 +++-- electron/main/languages.js | 36 ++++++++++++++ electron/main/preload.js | 4 ++ electron/main/renderer.js | 23 ++++++--- electron/main/script.js | 99 ++++++++++++++++++-------------------- 5 files changed, 108 insertions(+), 66 deletions(-) create mode 100644 electron/main/languages.js diff --git a/electron/main/index.html b/electron/main/index.html index f88b4c2..a8430af 100644 --- a/electron/main/index.html +++ b/electron/main/index.html @@ -10,9 +10,10 @@
- - - + +

Video to document

@@ -46,7 +47,8 @@
- - + + + \ No newline at end of file diff --git a/electron/main/languages.js b/electron/main/languages.js new file mode 100644 index 0000000..6262dc0 --- /dev/null +++ b/electron/main/languages.js @@ -0,0 +1,36 @@ +var languageOptions = { + "eng":{ + "title": "Video to document", + "h1": "Video to document", + "p1": "Drag and drop video file", + "fileName": "No video chosen", + "manualUploadBtn": "Search video", + "checkbox_group": "Choose prefered document style:", + "label_format": "Meeting report", + "label_summary": "Summary with timestamps", + "submitButton": "Submit" + }, + "de":{ + "title": "Video zu Dokument", + "h1": "Video zu Dokument", + "p1": "Video per Drag & Drop ablegen", + "fileName": "Kein Video ausgewaehlt", + "manualUploadBtn": "Video suchen", + "checkbox_group": "Bevorzugte Dokumentvarianten:", + "label_format": "Meeting Bericht", + "label_summary": "Zusammenfassung mit Zeitstempeln", + "submitButton": "Absenden" + }, + "in":{ + "title": "दस्तावेज़ के लिए वीडियो", + "h1": "दस्तावेज़ के लिए वीडियो", + "p1": "वीडियो फ़ाइल खींचें और छोड़ें", + "fileName": "कोई वीडियो नहीं चुना गया", + "manualUploadBtn": "वीडियो खोजें", + "checkbox_group": "पसंदीदा दस्तावेज़ शैली चुनें:", + "label_format": "बैठक रिपोर्ट", + "label_summary": "टाइमस्टैम्प के साथ सारांश", + "submitButton": "जमा करना" + } + +}; \ No newline at end of file diff --git a/electron/main/preload.js b/electron/main/preload.js index 2ea0ca5..4cc8eb6 100644 --- a/electron/main/preload.js +++ b/electron/main/preload.js @@ -7,6 +7,10 @@ try { contextBridge.exposeInMainWorld("extractor", { extract: (file) => ipcRenderer.send("extract", file) }) + contextBridge.exposeInMainWorld("electronAPI", { + getFilePath: (file) => {return webUtils.getPathForFile(file)} + }) + } catch (error) { console.log("Error in preload.js"); } \ No newline at end of file diff --git a/electron/main/renderer.js b/electron/main/renderer.js index 4175191..2291f64 100644 --- a/electron/main/renderer.js +++ b/electron/main/renderer.js @@ -4,8 +4,7 @@ uploadContainer.addEventListener("dragover", (e) =>{ e.stopPropagation(); e.preventDefault(); } catch (error) { - console.log("Error in renderer.js dragover listener function"); - console.log(error); + console.log("Error in renderer.js dragover listener function") } }); @@ -22,13 +21,21 @@ uploadContainer.addEventListener("drop", (e) => { console.log(filePath) const files1 = e.dataTransfer.files; - setCurrentPathVariable(filePath); handleFiles(files1); } } catch (error) { console.log("Error in renderer.js with the listerner for the drop function"); - console.log(error); - } - - -}) \ No newline at end of file + } +}) + + + window.addEventListener('load', (e) => { + console.log("test"); + loadLanguageOptions(); +}); + +language_option.addEventListener('change', (e)=>{ + const select = document.getElementById('language_option'); + console.log(select.value); + changeLanguage(select.value); +}); diff --git a/electron/main/script.js b/electron/main/script.js index 8935a38..c66c976 100644 --- a/electron/main/script.js +++ b/electron/main/script.js @@ -1,11 +1,9 @@ -var curSelecPath = ""; //listener for the file explorer search manualUploadBtn.addEventListener('click', () => { try { videoUpload.click(); } catch (error) { console.log("Error in manualBtn EventListener click"); - console.log(error); } }); @@ -24,16 +22,16 @@ function checkBoxes() { if(isChecked){ //Code to submit the video - if(curSelecPath.endsWith(".mp4") || holdy.endsWith(".mov") || holdy.endsWith(".avi") || holdy.endsWith( ".mkv")){ - window.extractor.extract({inputVideoPath: curSelecPath, outputType:"wav"}) + var pathTest = window.electronAPI.getFilePath(videoUpload.files[0]); + if(pathTest.endsWith(".mp4") || holdy.endsWith(".mov") || holdy.endsWith(".avi") || holdy.endsWith( ".mkv")){ + window.extractor.extract({inputVideoPath: pathTest, outputType:"wav"}) } } else { //language only english at the moment alert('Please select at least one document type.'); } } catch (error) { - console.log("Error in script.js checkBoxes function"); - console.log(error); + console.log(error) } // mapFunctions.get("extraction-video-to-audio").function({inputVideoPath:"./a.mp4", outputType:"wav"}) @@ -42,58 +40,31 @@ function checkBoxes() { //language changing feature function changeLanguage(language) { try { - if (language === 'en') { - document.getElementById('title').textContent = 'Video to document'; - document.getElementById('h1').textContent = 'Video to document'; - document.getElementById('p1').textContent = 'Drag and drop video file'; - document.getElementById('fileName').textContent = 'No video chosen'; - document.getElementById('manualUploadBtn').textContent = 'Search video'; - document.getElementById('checkbox_group').textContent = 'Choose prefered document style:'; - document.getElementById('label_format').textContent = 'Meeting report'; - document.getElementById('label_summary').textContent = 'Summary with timestamps'; - document.getElementById('submitButton').textContent = 'Submit'; - } else if (language === 'de') { - document.getElementById('title').textContent = 'Video zu Dokument'; - document.getElementById('h1').textContent = 'Video zu Dokument'; - document.getElementById('p1').textContent = 'Video per Drag & Drop ablegen'; - document.getElementById('fileName').textContent = 'Kein Video ausgewaehlt'; - document.getElementById('manualUploadBtn').textContent = 'Video suchen'; - document.getElementById('checkbox_group').textContent = 'Bevorzugte Dokumentvarianten:'; - document.getElementById('label_format').textContent = 'Meeting Bericht'; - document.getElementById('label_summary').textContent = 'Zusammenfassung mit Zeitstempeln'; - document.getElementById('submitButton').textContent = 'Absenden'; - } else if(language == "in") { - document.getElementById('title').textContent = 'दस्तावेज़ के लिए वीडियो'; - document.getElementById('h1').textContent = 'दस्तावेज़ के लिए वीडियो'; - document.getElementById('p1').textContent = 'वीडियो फ़ाइल खींचें और छोड़ें'; - document.getElementById('fileName').textContent = 'कोई वीडियो नहीं चुना गया'; - document.getElementById('manualUploadBtn').textContent = 'वीडियो खोजें'; - document.getElementById('checkbox_group').textContent = 'पसंदीदा दस्तावेज़ शैली चुनें:'; - document.getElementById('label_format').textContent = 'बैठक रिपोर्ट'; - document.getElementById('label_summary').textContent = 'टाइमस्टैम्प के साथ सारांश'; - document.getElementById('submitButton').textContent = 'जमा करना'; - } + 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) { - console.log("Error in script.js changeLanguage function"); console.log(error); } - + } - //listener for the file explorer search when something got selected videoUpload.addEventListener('change', () => { try { handleFiles(videoUpload.files); } catch (error) { console.log("Error in manualBtn EventListener change"); - console.log(error); } }); - - //function to display the file path in the drop down box function handleFiles(files) { try { @@ -102,16 +73,10 @@ function handleFiles(files) { if (file.type.startsWith('video/')) { videoUpload.files = files; fileName.textContent = `Chosen video: ${file.name}`; - setCurrentPathVariable(files[0]) - }else{ - setCurrentPathVariable(""); } - }else{ - setCurrentPathVariable(""); } } catch (error) { console.log("Error in script.js handleFiles function"); - console.log(error); } } @@ -124,16 +89,44 @@ function updateProgressBar(bar, value){ bar.querySelector(".progress_text").textContent = `${value}%`; } catch (error) { console.log("Error in scripts.js updateProgressBar function"); - console.log(error); } } -function setCurrentPathVariable(value){ +//function to load ai options to the drop down list +function loadAiOptions(options){ try { - curSelecPath = value + ""; + var menu = document.getElementById('ai_type'); + for(i = 0; i < options.length; i++){ + var opty = options[i]; + var namey = "option" + i; + var choice = document.createElement(namey); + choice.textContent = "t"; + choice.value = i; + menu.appendChild(choice); + } } catch (error) { - console.log("Error in script.js setCurrentPathVariable"); + console.log("Error in script.js loadAiOptions function"); + 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); } } \ No newline at end of file From 9441699561a27e1ff06606f5c8335d3665dd1848 Mon Sep 17 00:00:00 2001 From: santa Date: Sun, 16 Nov 2025 14:46:19 +0100 Subject: [PATCH 003/121] if Pruefung fuer Datei Endung gefixt --- electron/main/renderer.js | 12 +++-- electron/main/script.js | 92 +++++++++++++++++++++------------------ 2 files changed, 58 insertions(+), 46 deletions(-) diff --git a/electron/main/renderer.js b/electron/main/renderer.js index ad684ef..1bf23ea 100644 --- a/electron/main/renderer.js +++ b/electron/main/renderer.js @@ -16,15 +16,21 @@ uploadContainer.addEventListener("drop", (e) => { e.preventDefault() const files = e.dataTransfer.files const filePath = window.explorer.onFileDrop(files[0]) - var holdy = filePath + ""; - if(holdy.endsWith(".mp4") || holdy.endsWith(".mov") || holdy.endsWith(".avi") || holdy.endsWith( ".mkv")){ - console.log(filePath) + var holdy = String(filePath); + const lower = holdy.toLowerCase(); + const validExt = [".mp4", ".mov", ".avi", ".mkv"]; + + if(validExt.some(ext => lower.endsWith(ext))){ + console.log(filePath); const files1 = e.dataTransfer.files; handleFiles(files1); + }else{ + console.log('Video format invalid!'); } } catch (error) { console.log("Error in renderer.js with the listerner for the drop function"); + console.log(error); } diff --git a/electron/main/script.js b/electron/main/script.js index b947cdb..fac9960 100644 --- a/electron/main/script.js +++ b/electron/main/script.js @@ -6,7 +6,7 @@ manualUploadBtn.addEventListener('click', () => { } catch (error) { console.log("Error in manualBtn EventListener click"); } - + }); //function to check if one checkbox is at least klicked @@ -15,18 +15,24 @@ function checkBoxes() { const checkboxes = document.querySelectorAll('input[name="docFormat"]'); let isChecked = false; - checkboxes.forEach(function(checkbox){ - if(checkbox.checked){ + checkboxes.forEach(function (checkbox) { + if (checkbox.checked) { isChecked = true; } }); - if(isChecked){ + if (isChecked) { //Code to submit the video var pathTest = window.electronAPI.getFilePath(videoUpload.files[0]); - if(pathTest.endsWith(".mp4") || holdy.endsWith(".mov") || holdy.endsWith(".avi") || holdy.endsWith( ".mkv")){ - window.extractor.extract({inputVideoPath: pathTest, outputType:"wav"}) + + const lower = pathTest.toLowerCase(); + const validExt = [".mp4", ".mov", ".avi", ".mkv"]; + + if(validExt.some(ext => lower.endsWith(ext))){ + window.extractor.extract({ inputVideoPath: pathTest, outputType: "wav" }); } + + } else { //language only english at the moment alert('Please select at least one document type.'); @@ -34,43 +40,43 @@ function checkBoxes() { } catch (error) { console.log(error) } - -// mapFunctions.get("extraction-video-to-audio").function({inputVideoPath:"./a.mp4", outputType:"wav"}) + + // mapFunctions.get("extraction-video-to-audio").function({inputVideoPath:"./a.mp4", outputType:"wav"}) } //language changing feature function changeLanguage(language) { - if (language === 'en') { - document.getElementById('title').textContent = 'Video to document'; - document.getElementById('h1').textContent = 'Video to document'; - document.getElementById('p1').textContent = 'Drag and drop video file'; - document.getElementById('fileName').textContent = 'No video chosen'; - document.getElementById('manualUploadBtn').textContent = 'Search video'; - document.getElementById('checkbox_group').textContent = 'Choose prefered document style:'; - document.getElementById('label_format').textContent = 'Meeting report'; - document.getElementById('label_summary').textContent = 'Summary with timestamps'; - document.getElementById('submitButton').textContent = 'Submit'; - } else if (language === 'de') { - document.getElementById('title').textContent = 'Video zu Dokument'; - document.getElementById('h1').textContent = 'Video zu Dokument'; - document.getElementById('p1').textContent = 'Video per Drag & Drop ablegen'; - document.getElementById('fileName').textContent = 'Kein Video ausgewaehlt'; - document.getElementById('manualUploadBtn').textContent = 'Video suchen'; - document.getElementById('checkbox_group').textContent = 'Bevorzugte Dokumentvarianten:'; - document.getElementById('label_format').textContent = 'Meeting Bericht'; - document.getElementById('label_summary').textContent = 'Zusammenfassung mit Zeitstempeln'; - document.getElementById('submitButton').textContent = 'Absenden'; - } else if(language == "in") { - document.getElementById('title').textContent = 'दस्तावेज़ के लिए वीडियो'; - document.getElementById('h1').textContent = 'दस्तावेज़ के लिए वीडियो'; - document.getElementById('p1').textContent = 'वीडियो फ़ाइल खींचें और छोड़ें'; - document.getElementById('fileName').textContent = 'कोई वीडियो नहीं चुना गया'; - document.getElementById('manualUploadBtn').textContent = 'वीडियो खोजें'; - document.getElementById('checkbox_group').textContent = 'पसंदीदा दस्तावेज़ शैली चुनें:'; - document.getElementById('label_format').textContent = 'बैठक रिपोर्ट'; - document.getElementById('label_summary').textContent = 'टाइमस्टैम्प के साथ सारांश'; - document.getElementById('submitButton').textContent = 'जमा करना'; - } + if (language === 'en') { + document.getElementById('title').textContent = 'Video to document'; + document.getElementById('h1').textContent = 'Video to document'; + document.getElementById('p1').textContent = 'Drag and drop video file'; + document.getElementById('fileName').textContent = 'No video chosen'; + document.getElementById('manualUploadBtn').textContent = 'Search video'; + document.getElementById('checkbox_group').textContent = 'Choose prefered document style:'; + document.getElementById('label_format').textContent = 'Meeting report'; + document.getElementById('label_summary').textContent = 'Summary with timestamps'; + document.getElementById('submitButton').textContent = 'Submit'; + } else if (language === 'de') { + document.getElementById('title').textContent = 'Video zu Dokument'; + document.getElementById('h1').textContent = 'Video zu Dokument'; + document.getElementById('p1').textContent = 'Video per Drag & Drop ablegen'; + document.getElementById('fileName').textContent = 'Kein Video ausgewaehlt'; + document.getElementById('manualUploadBtn').textContent = 'Video suchen'; + document.getElementById('checkbox_group').textContent = 'Bevorzugte Dokumentvarianten:'; + document.getElementById('label_format').textContent = 'Meeting Bericht'; + document.getElementById('label_summary').textContent = 'Zusammenfassung mit Zeitstempeln'; + document.getElementById('submitButton').textContent = 'Absenden'; + } else if (language == "in") { + document.getElementById('title').textContent = 'दस्तावेज़ के लिए वीडियो'; + document.getElementById('h1').textContent = 'दस्तावेज़ के लिए वीडियो'; + document.getElementById('p1').textContent = 'वीडियो फ़ाइल खींचें और छोड़ें'; + document.getElementById('fileName').textContent = 'कोई वीडियो नहीं चुना गया'; + document.getElementById('manualUploadBtn').textContent = 'वीडियो खोजें'; + document.getElementById('checkbox_group').textContent = 'पसंदीदा दस्तावेज़ शैली चुनें:'; + document.getElementById('label_format').textContent = 'बैठक रिपोर्ट'; + document.getElementById('label_summary').textContent = 'टाइमस्टैम्प के साथ सारांश'; + document.getElementById('submitButton').textContent = 'जमा करना'; + } } @@ -81,7 +87,7 @@ videoUpload.addEventListener('change', () => { } catch (error) { console.log("Error in manualBtn EventListener change"); } - + }); @@ -99,11 +105,11 @@ function handleFiles(files) { } catch (error) { console.log("Error in script.js handleFiles function"); } - + } //function to regulate the progress on the progressbar -function updateProgressBar(bar, value){ +function updateProgressBar(bar, value) { try { value = Math.round(value); bar.querySelector(".progress_fill").style.width = `${value}%`; @@ -111,5 +117,5 @@ function updateProgressBar(bar, value){ } catch (error) { console.log("Error in scripts.js updateProgressBar function"); } - + } \ No newline at end of file From ab0e737f337e7fad09601beb096f6eb82da3e008 Mon Sep 17 00:00:00 2001 From: Verena Schulz Date: Sun, 16 Nov 2025 15:06:47 +0100 Subject: [PATCH 004/121] Submit button disabled without video, bigger middle part and dropzone, button in dropzone --- electron/main/index.html | 7 +++---- electron/main/script.js | 19 ++++++++++++++++++- electron/main/style.css | 19 +++++++++++++++++-- 3 files changed, 38 insertions(+), 7 deletions(-) diff --git a/electron/main/index.html b/electron/main/index.html index a8430af..acb2de5 100644 --- a/electron/main/index.html +++ b/electron/main/index.html @@ -21,10 +21,9 @@

Drag and drop video file

No video chosen
-
- - + +
@@ -39,7 +38,7 @@
- +
diff --git a/electron/main/script.js b/electron/main/script.js index c66c976..68c0bc8 100644 --- a/electron/main/script.js +++ b/electron/main/script.js @@ -129,4 +129,21 @@ function loadLanguageOptions(){ console.log("Error in script.js loadLanguageOptions function"); console.log(error); } -} \ No newline at end of file +} + +function activateSubmitBtn(hasFile){ + submitButton.disabled = !hasFile; +} + +videoUpload.addEventListener("change", () => { + activateSubmitBtn(videoUpload.files.length > 0); +}); + +uploadContainer.addEventListener("drop", (e) => { + e.preventDefault(); + const file = e.dataTransfer.files[0]; + + if(file){ + activateSubmitBtn(true); + } +}); \ No newline at end of file diff --git a/electron/main/style.css b/electron/main/style.css index e9abb50..35f8488 100644 --- a/electron/main/style.css +++ b/electron/main/style.css @@ -5,7 +5,7 @@ body { justify-content: center; align-items: center; height: 100vh; - background-color: #555; + background-color: #666; gap: 15px; margin: 0; } @@ -17,7 +17,8 @@ body { border-radius: 12px; box-shadow: 0 4px 10px rgba(0,0,0,0.1); text-align: center; - width: 400px; + width: 350px; + height: 100px; transition: border 0.3s, background-color 0.3s; border: 2px dashed #ccc; } @@ -40,11 +41,15 @@ body { margin-top: 10px; font-size: 14px; color: #333; + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; } .custom-btn { padding: 10px 20px; + margin-top: 40px; background-color: #007BFF; color: white; border: none; @@ -84,6 +89,8 @@ gap: 5px; .submit-btn { padding: 10px 20px; + margin-top: 10px; + margin-bottom: 10px; background-color: #007BFF; color: white; border: none; @@ -92,9 +99,16 @@ gap: 5px; font-size: 14px; } +.submit-btn:disabled { + opacity: 0.5; + cursor: not-allowed; + pointer-events: none; +} + .mitte { background-color: #f2f3f4; display: flex; + width: 500px; flex-direction: column; align-items: center; padding: 5% 50px; @@ -103,6 +117,7 @@ gap: 5px; border: 1px; border-color: black; border-style: solid; + border-radius: 6px; } h1 { From 1e3d830ae271c26803902f323636689d3b8b8700 Mon Sep 17 00:00:00 2001 From: "eric.minning" Date: Mon, 17 Nov 2025 11:27:17 +0100 Subject: [PATCH 005/121] Fixed a merg mistake and added try/catch lines --- electron/main/renderer.js | 19 ++++++++++++++----- electron/main/script.js | 33 ++++++++++++++++++++++++--------- 2 files changed, 38 insertions(+), 14 deletions(-) diff --git a/electron/main/renderer.js b/electron/main/renderer.js index 2291f64..48a0edb 100644 --- a/electron/main/renderer.js +++ b/electron/main/renderer.js @@ -30,12 +30,21 @@ uploadContainer.addEventListener("drop", (e) => { window.addEventListener('load', (e) => { - console.log("test"); - loadLanguageOptions(); + try { + console.log("test"); + loadLanguageOptions(); + } catch (error) { + + } + }); language_option.addEventListener('change', (e)=>{ - const select = document.getElementById('language_option'); - console.log(select.value); - changeLanguage(select.value); + try { + const select = document.getElementById('language_option'); + changeLanguage(select.value); + } catch (error) { + + } + }); diff --git a/electron/main/script.js b/electron/main/script.js index 68c0bc8..7907f40 100644 --- a/electron/main/script.js +++ b/electron/main/script.js @@ -4,6 +4,7 @@ manualUploadBtn.addEventListener('click', () => { videoUpload.click(); } catch (error) { console.log("Error in manualBtn EventListener click"); + console.log(error); } }); @@ -23,18 +24,18 @@ function checkBoxes() { if(isChecked){ //Code to submit the video var pathTest = window.electronAPI.getFilePath(videoUpload.files[0]); - if(pathTest.endsWith(".mp4") || holdy.endsWith(".mov") || holdy.endsWith(".avi") || holdy.endsWith( ".mkv")){ - window.extractor.extract({inputVideoPath: pathTest, outputType:"wav"}) + if(pathTest.endsWith(".mp4") || pathTest.endsWith(".mov") || pathTest.endsWith(".avi") || pathTest.endsWith( ".mkv")){ + window.extractor.extract({inputVideoPath: pathTest, outputType:"wav"}); } } else { //language only english at the moment alert('Please select at least one document type.'); } } catch (error) { - console.log(error) + console.log("Error in script.js checkBoxes function"); + console.log(error); } -// mapFunctions.get("extraction-video-to-audio").function({inputVideoPath:"./a.mp4", outputType:"wav"}) } //language changing feature @@ -50,6 +51,7 @@ function changeLanguage(language) { document.getElementById('label_summary').textContent = languageOptions[language].label_summary; document.getElementById('submitButton').textContent = languageOptions[language].submitButton; } catch (error) { + console.log("Error in script.js changeLanguage function"); console.log(error); } @@ -61,6 +63,7 @@ videoUpload.addEventListener('change', () => { handleFiles(videoUpload.files); } catch (error) { console.log("Error in manualBtn EventListener change"); + console.log(error); } }); @@ -77,6 +80,7 @@ function handleFiles(files) { } } catch (error) { console.log("Error in script.js handleFiles function"); + console.log(error); } } @@ -89,6 +93,7 @@ function updateProgressBar(bar, value){ bar.querySelector(".progress_text").textContent = `${value}%`; } catch (error) { console.log("Error in scripts.js updateProgressBar function"); + console.log(error); } } @@ -136,14 +141,24 @@ function activateSubmitBtn(hasFile){ } videoUpload.addEventListener("change", () => { - activateSubmitBtn(videoUpload.files.length > 0); + try { + activateSubmitBtn(videoUpload.files.length > 0); + } catch (error) { + console.log(error); + } + }); uploadContainer.addEventListener("drop", (e) => { - e.preventDefault(); - const file = e.dataTransfer.files[0]; + try { + e.preventDefault(); + const file = e.dataTransfer.files[0]; - if(file){ - activateSubmitBtn(true); + if(file){ + activateSubmitBtn(true); + } + } catch (error) { + console.log(error); } + }); \ No newline at end of file From ada231cd2836a68aa9b1825524847efcd4354e1d Mon Sep 17 00:00:00 2001 From: "eric.minning" Date: Mon, 17 Nov 2025 13:15:37 +0100 Subject: [PATCH 006/121] Implemented a deaktivateProgressbar function --- electron/main/index.html | 4 +++- electron/main/script.js | 35 ++++++++++++++++++++++++++++------- electron/main/style.css | 1 + 3 files changed, 32 insertions(+), 8 deletions(-) diff --git a/electron/main/index.html b/electron/main/index.html index acb2de5..81473cb 100644 --- a/electron/main/index.html +++ b/electron/main/index.html @@ -12,6 +12,8 @@
+
@@ -40,7 +42,7 @@ -
+
0%
diff --git a/electron/main/script.js b/electron/main/script.js index 7907f40..a1ee2e8 100644 --- a/electron/main/script.js +++ b/electron/main/script.js @@ -23,9 +23,17 @@ function checkBoxes() { if(isChecked){ //Code to submit the video + var selectedCheckboxes = {}; + checkboxes.forEach(function(checkbox){ + if(checkbox.checked){ + selectedCheckboxes[checkbox.nextElementSibling.textContent] = ""; + } + }); + console.log(selectedCheckboxes); var pathTest = window.electronAPI.getFilePath(videoUpload.files[0]); if(pathTest.endsWith(".mp4") || pathTest.endsWith(".mov") || pathTest.endsWith(".avi") || pathTest.endsWith( ".mkv")){ - window.extractor.extract({inputVideoPath: pathTest, outputType:"wav"}); + document.getElementById("progressbar").style.visibility = "visible"; + //window.extractor.extract({inputVideoPath: pathTest, outputType:"wav"}); } } else { //language only english at the moment @@ -102,12 +110,13 @@ function updateProgressBar(bar, value){ function loadAiOptions(options){ try { var menu = document.getElementById('ai_type'); + var object_holdy; + var choice ; + object_holdy = Object.keys(languageOptions); for(i = 0; i < options.length; i++){ - var opty = options[i]; - var namey = "option" + i; - var choice = document.createElement(namey); - choice.textContent = "t"; - choice.value = i; + choice = document.createElement('option'); + choice.textContent = object_holdy[i]; + choice.value = object_holdy[i]; menu.appendChild(choice); } } catch (error) { @@ -137,7 +146,19 @@ function loadLanguageOptions(){ } function activateSubmitBtn(hasFile){ - submitButton.disabled = !hasFile; + try { + submitButton.disabled = !hasFile; + } catch (error) { + console.log(error); + } +} + +function deaktivateProgressbar(){ + try { + document.getElementById("progressbar").style.visibility = "hidden"; + } catch (error) { + console.log(error); + } } videoUpload.addEventListener("change", () => { diff --git a/electron/main/style.css b/electron/main/style.css index 35f8488..a376058 100644 --- a/electron/main/style.css +++ b/electron/main/style.css @@ -131,6 +131,7 @@ h1 { background: rgb(42, 46, 78); border-radius: 5px; overflow: hidden; + visibility: hidden; } .progress_fill{ From f8fb71e1467730a47adcbec510c0798453f5800f Mon Sep 17 00:00:00 2001 From: "eric.minning" Date: Mon, 17 Nov 2025 15:02:22 +0100 Subject: [PATCH 007/121] Added Verenas function to have a preview image of the selected video file --- electron/main/index.html | 5 +++ electron/main/renderer.js | 33 ++++++++++++++++++ electron/main/script.js | 54 ++++++----------------------- electron/main/style.css | 72 +++++++++++++++++++++++---------------- 4 files changed, 92 insertions(+), 72 deletions(-) diff --git a/electron/main/index.html b/electron/main/index.html index 81473cb..d9d09ed 100644 --- a/electron/main/index.html +++ b/electron/main/index.html @@ -22,7 +22,12 @@

Drag and drop video file

+
No video chosen
+
+ +
diff --git a/electron/main/renderer.js b/electron/main/renderer.js index 48a0edb..32ea225 100644 --- a/electron/main/renderer.js +++ b/electron/main/renderer.js @@ -22,7 +22,9 @@ uploadContainer.addEventListener("drop", (e) => { const files1 = e.dataTransfer.files; handleFiles(files1); + generateThumbnail(filePath); } + } catch (error) { console.log("Error in renderer.js with the listerner for the drop function"); } @@ -48,3 +50,34 @@ language_option.addEventListener('change', (e)=>{ } }); + +videoUpload.addEventListener("change", () => { + try { + activateSubmitBtn(videoUpload.files.length > 0); + } catch (error) { + console.log(error); + } + +}); + +//listener for the file explorer search when something got selected +videoUpload.addEventListener('change', () => { + try { + handleFiles(videoUpload.files); + } catch (error) { + console.log("Error in manualBtn EventListener change"); + console.log(error); + } + +}); + +//listener for the file explorer search +manualUploadBtn.addEventListener('click', () => { + try { + videoUpload.click(); + } catch (error) { + console.log("Error in manualBtn EventListener click"); + console.log(error); + } + +}); \ No newline at end of file diff --git a/electron/main/script.js b/electron/main/script.js index a1ee2e8..852b98d 100644 --- a/electron/main/script.js +++ b/electron/main/script.js @@ -1,13 +1,3 @@ -//listener for the file explorer search -manualUploadBtn.addEventListener('click', () => { - try { - videoUpload.click(); - } catch (error) { - console.log("Error in manualBtn EventListener click"); - console.log(error); - } - -}); //function to check if one checkbox is at least klicked function checkBoxes() { @@ -65,17 +55,6 @@ function changeLanguage(language) { } -//listener for the file explorer search when something got selected -videoUpload.addEventListener('change', () => { - try { - handleFiles(videoUpload.files); - } catch (error) { - console.log("Error in manualBtn EventListener change"); - console.log(error); - } - -}); - //function to display the file path in the drop down box function handleFiles(files) { try { @@ -161,25 +140,14 @@ function deaktivateProgressbar(){ } } -videoUpload.addEventListener("change", () => { - try { - activateSubmitBtn(videoUpload.files.length > 0); - } catch (error) { - console.log(error); - } - -}); - -uploadContainer.addEventListener("drop", (e) => { - try { - e.preventDefault(); - const file = e.dataTransfer.files[0]; - - if(file){ - activateSubmitBtn(true); - } - } catch (error) { - console.log(error); - } - -}); \ No newline at end of file +//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; +} diff --git a/electron/main/style.css b/electron/main/style.css index a376058..074b62e 100644 --- a/electron/main/style.css +++ b/electron/main/style.css @@ -5,12 +5,12 @@ body { justify-content: center; align-items: center; height: 100vh; - background-color: #666; + background-color: #999; gap: 15px; margin: 0; } - - + + .upload-container { background: white; padding: 40px; @@ -18,25 +18,25 @@ body { box-shadow: 0 4px 10px rgba(0,0,0,0.1); text-align: center; width: 350px; - height: 100px; + height: 120px; transition: border 0.3s, background-color 0.3s; - border: 2px dashed #ccc; + 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; @@ -45,8 +45,22 @@ 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); + object-fit: cover; +} + .custom-btn { padding: 10px 20px; margin-top: 40px; @@ -57,27 +71,27 @@ body { cursor: pointer; font-size: 14px; } - - + + .custom-btn:hover { background-color: #0056b3; } - + .submit-btn:hover { background-color: #0056b3; } - + input[type="file"] { display: none; } - + .checkbox-container{ margin-top: 8px; display: flex; align-items: center; gap: 5px; } - + .checkbox-group { margin-top: 15px; margin-bottom: 15px; @@ -86,7 +100,7 @@ gap: 5px; gap: 10px; align-items: flex-start; } - + .submit-btn { padding: 10px 20px; margin-top: 10px; @@ -98,13 +112,13 @@ gap: 5px; cursor: pointer; font-size: 14px; } - + .submit-btn:disabled { opacity: 0.5; cursor: not-allowed; pointer-events: none; } - + .mitte { background-color: #f2f3f4; display: flex; @@ -119,11 +133,11 @@ gap: 5px; border-style: solid; border-radius: 6px; } - + h1 { align-content: center; } - + .progressbar{ position: relative; width: 210px; @@ -133,14 +147,14 @@ h1 { overflow: hidden; visibility: hidden; } - + .progress_fill{ width: 0%; height: 100%; background: green; transition: all 0.2s; } - + .progress_text{ position: absolute; top: 50%; @@ -148,16 +162,16 @@ h1 { transform: translateY(-50%); color: white; } - + .flagsBtns { display: flex; justify-content: flex-end; } - + .de_Btn, .eng_Btn, .in_Btn { padding: 8px 16px; color: white; border: none; border-radius: 8px; cursor: pointer; -} \ No newline at end of file +} From 4f57ec25bf0dc9842d6b71327a269f9f939d580b Mon Sep 17 00:00:00 2001 From: "eric.minning" Date: Mon, 17 Nov 2025 15:18:18 +0100 Subject: [PATCH 008/121] Changed the handleFiles function so it also contains the call for the generateThumbnail function --- electron/main/renderer.js | 3 --- electron/main/script.js | 2 ++ 2 files changed, 2 insertions(+), 3 deletions(-) diff --git a/electron/main/renderer.js b/electron/main/renderer.js index 32ea225..7e97240 100644 --- a/electron/main/renderer.js +++ b/electron/main/renderer.js @@ -18,11 +18,8 @@ uploadContainer.addEventListener("drop", (e) => { const filePath = window.explorer.onFileDrop(files[0]) var holdy = filePath + ""; if(holdy.endsWith(".mp4") || holdy.endsWith(".mov") || holdy.endsWith(".avi") || holdy.endsWith( ".mkv")){ - console.log(filePath) - const files1 = e.dataTransfer.files; handleFiles(files1); - generateThumbnail(filePath); } } catch (error) { diff --git a/electron/main/script.js b/electron/main/script.js index 852b98d..003d5f4 100644 --- a/electron/main/script.js +++ b/electron/main/script.js @@ -61,8 +61,10 @@ function handleFiles(files) { 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}`; + generateThumbnail(filePath); } } } catch (error) { From 7b01c4f022bb1054b24888c69f3c24a755e3cd44 Mon Sep 17 00:00:00 2001 From: Verena Schulz Date: Mon, 17 Nov 2025 16:00:53 +0100 Subject: [PATCH 009/121] Video icon improvement, changed dropdown alignment --- electron/main/index.html | 2 +- electron/main/style.css | 29 +++++++++++++++++------------ 2 files changed, 18 insertions(+), 13 deletions(-) diff --git a/electron/main/index.html b/electron/main/index.html index d9d09ed..472b823 100644 --- a/electron/main/index.html +++ b/electron/main/index.html @@ -9,7 +9,7 @@
-
+