mirror of
https://gitlab.rlp.net/proj-wise2526-video2document/video2document.git
synced 2026-06-15 18:01:52 +02:00
Merge branch 'develop' into 'main'
Fixed the change speaker feature. every step till the point where its send to... See merge request proj-wise2526-video2document/video2document!72
This commit is contained in:
Hughes, Mike
@@ -0,0 +1,161 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="de">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Custom Document</title>
|
||||
<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>
|
||||
</head>
|
||||
<body>
|
||||
<div class="container">
|
||||
<h1>Custom Document Generator</h1>
|
||||
|
||||
<label for="docName">Dokumentname:</label>
|
||||
<input type="text" id="docName" placeholder="Gib hier den Dokumentnamen ein">
|
||||
|
||||
<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>
|
||||
|
||||
<label for="prompt">Dein Prompt:</label>
|
||||
<textarea id="prompt" placeholder="Schreibe hier den Prompt für dein Dokument..."></textarea>
|
||||
|
||||
<div class="buttons">
|
||||
<a href="index.html">
|
||||
<button id="goBackBtn">Abbrechen</button>
|
||||
</a>
|
||||
<button id="generateBtn">Dokument speichern</button>
|
||||
</div>
|
||||
|
||||
<div id="result"></div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
const goBackBtn = document.getElementById("goBackBtn");
|
||||
const generateBtn = document.getElementById("generateBtn");
|
||||
const existingDocs = document.getElementById("existingDocs");
|
||||
const docNameInput = document.getElementById("docName");
|
||||
const promptInput = document.getElementById("prompt");
|
||||
const resultDiv = document.getElementById("result");
|
||||
|
||||
// Zurück zur Haupt-GUI
|
||||
goBackBtn.addEventListener("click", () => {
|
||||
window.electronAPI.goBackToMain();
|
||||
});
|
||||
|
||||
// Generiere Dokument
|
||||
generateBtn.addEventListener("click", () => {
|
||||
const prompt = promptInput.value.trim();
|
||||
let docName = docNameInput.value.trim();
|
||||
const selectedExisting = existingDocs.value;
|
||||
|
||||
if (!prompt) {
|
||||
alert("Bitte gib einen Prompt ein!");
|
||||
return;
|
||||
}
|
||||
|
||||
// Wenn ein vorhandenes Dokument ausgewählt wurde, hängt der Prompt daran
|
||||
if (selectedExisting) {
|
||||
docName = selectedExisting; // prompt wird an vorhandenes Dokument angehängt
|
||||
} else if (!docName) {
|
||||
alert("Bitte gib einen Dokumentnamen ein, wenn du ein neues Dokument erstellen möchtest!");
|
||||
return;
|
||||
}
|
||||
|
||||
// Demo-Ausgabe im Result-Div
|
||||
resultDiv.innerHTML = `<strong>Dokumentname:</strong> ${docName}<br><strong>Prompt:</strong> ${prompt}`;
|
||||
|
||||
// Hier kannst du den Prompt an dein LLM oder Module-Handler senden
|
||||
// z.B. window.submit.submit({documentName: docName, prompt: prompt})
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
+19
-13
@@ -19,8 +19,8 @@
|
||||
</label>
|
||||
|
||||
<nav class="menu1">
|
||||
<a href="index2.html" class="li1">Custom document</a>
|
||||
<a href="index3.html" class="li1">Help</a>
|
||||
<a href="custom_document.html" class="li1">Custom document</a>
|
||||
<a href="" class="li1">Help</a>
|
||||
</nav>
|
||||
</nav>
|
||||
</section>
|
||||
@@ -57,23 +57,28 @@
|
||||
</div>
|
||||
|
||||
<div class="step" id="step2" style="display:none;">
|
||||
<div class="labelDiv" id="labelDiv">
|
||||
<div class="KI-wrapper">
|
||||
<label id="labelKI">Select ki:</label>
|
||||
<label id="labelTranscription">Select transcription:</label>
|
||||
<label id="labelType">Select type:</label>
|
||||
<label id="labelLanguage">Select language:</label>
|
||||
<img id="labelLanguageFlag" src="flags/united-kingdom-flag-png-large.jpg" width="20" height="10" >
|
||||
<select name="ai_type" id="ai_type"></select>
|
||||
</div>
|
||||
<div class="dropdownMenus" id="dropdownMenus">
|
||||
<select name="ai_type" id="ai_type">
|
||||
</select>
|
||||
<select name="transkript_type" id="transkript_type">
|
||||
</select>
|
||||
|
||||
<div class="transcript-wrap">
|
||||
<label id="labelTranscription">Select transcription:</label>
|
||||
<select name="transkript_type" id="transkript_type"></select>
|
||||
</div>
|
||||
|
||||
<div class="type-wrapper">
|
||||
<label id="labelType">Select type:</label>
|
||||
<select name="output_type" id="output_type">
|
||||
<option value="pdf">.pdf</option>
|
||||
<option value="word">.word</option>
|
||||
<option value="txt">.txt</option>
|
||||
</select>
|
||||
</div>
|
||||
|
||||
<div class="language-wrapper">
|
||||
<label id="labelLanguage">Select language:</label>
|
||||
<img id="labelLanguageFlag" src="flags/united-kingdom-flag-png-large.jpg" width="20" height="10" >
|
||||
<select name="language_option" id="language_option">
|
||||
</select>
|
||||
</div>
|
||||
@@ -129,7 +134,6 @@
|
||||
<div class="speakerView" id="speakerView">
|
||||
<label id="labelSpeaker">Select Speaker:</label>
|
||||
<select name="cur_speaker" id="cur_speaker">
|
||||
<options>Stefan</options>
|
||||
</select>
|
||||
</div>
|
||||
<div class="speakerAudio" id="speakerAutio">
|
||||
@@ -142,9 +146,11 @@
|
||||
<label id="labelSpeakerWriter">Write name:</label>
|
||||
<input type="text" id="newSpeaker">
|
||||
</div>
|
||||
<div class="speakerButton-group">
|
||||
<button id="speakerLocker" onclick="rewriteSpeakerName()">Rename Speaker</button>
|
||||
<button id="speakerResender" onclick="sendSpeakerPackages()">Rewrite document</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="step" id="step6" style="display:none;">
|
||||
<button class="download-btn" id="downloadButton" onclick="fileDownload()">Download</button>
|
||||
|
||||
@@ -23,7 +23,7 @@ try {
|
||||
speakerAudios: (callback) => ipcRenderer.on('speakerAudios', callback)
|
||||
})
|
||||
contextBridge.exposeInMainWorld("submitSpeaker", {
|
||||
submitSpeaker: (speaker_names) => {ipcRenderer.send("speaker_submit", speaker_names)}
|
||||
speaker_submit: (speaker_names) => {ipcRenderer.send("speaker_submit", speaker_names)}
|
||||
})
|
||||
|
||||
contextBridge.exposeInMainWorld("download", {
|
||||
|
||||
@@ -19,7 +19,6 @@ uploadContainer.addEventListener("drop", (e) => {
|
||||
const testEndings = [".mp4", ".mov", ".avi", ".mkv"];
|
||||
var pathToLower = filePath.toLowerCase();
|
||||
if(testEndings.some(e => pathToLower.endsWith(e))){
|
||||
document.getElementById("progressbar").style.visibility = "visible";
|
||||
const files1 = e.dataTransfer.files;
|
||||
handleFiles(files1);
|
||||
}else{
|
||||
@@ -28,6 +27,7 @@ uploadContainer.addEventListener("drop", (e) => {
|
||||
|
||||
} catch (error) {
|
||||
console.log("Error in renderer.js with the listerner for the drop function");
|
||||
console.log(error);
|
||||
}
|
||||
})
|
||||
|
||||
@@ -169,7 +169,7 @@ docFormatCustom.addEventListener("change", (e) =>{
|
||||
//Speaker change listener
|
||||
cur_speaker.addEventListener("change", (e) =>{
|
||||
try {
|
||||
document.getElementById("speakerAudioViewer").src = valy[e.target.value].source;
|
||||
document.getElementById("speakerAudioViewer").src = speakerAudios[document.getElementById("cur_speaker").value].src;
|
||||
} catch (error) {
|
||||
|
||||
}
|
||||
|
||||
@@ -212,7 +212,7 @@ function loadLanguageOptions(){
|
||||
function loadSpeakerOptions(options){
|
||||
try {
|
||||
var menu = document.getElementById('cur_speaker');
|
||||
var l = document.getElementById("cur_speaker").options.length -1;
|
||||
var l = document.getElementById('cur_speaker').options.length -1;
|
||||
for(i = l; i >= 0; i--){
|
||||
menu.remove(i);
|
||||
}
|
||||
@@ -222,9 +222,10 @@ function loadSpeakerOptions(options){
|
||||
for(i = 0; i < object_holdy.length; i++){
|
||||
choice = document.createElement('option');
|
||||
choice.textContent = options[object_holdy[i]].name;
|
||||
choice.value = options[object_holdy[i]].name;
|
||||
choice.value = object_holdy[i];
|
||||
menu.appendChild(choice);
|
||||
}
|
||||
document.getElementById("speakerAudioViewer").src = options.speakerA.src;
|
||||
} catch (error) {
|
||||
console.log("Error in script.js loadSpeakerOptions function");
|
||||
console.log(error);
|
||||
@@ -285,7 +286,7 @@ function showStep(stepNumber) {
|
||||
return;
|
||||
}
|
||||
steps.forEach(step => step.style.display = "none");
|
||||
document.getElementById("step" + stepNumber).style.display = "block";
|
||||
document.getElementById("step" + stepNumber).style.display = "flex";
|
||||
|
||||
stepButtons.forEach(btn => btn.classList.remove("active"));
|
||||
document.querySelector(`.step-item[data-step="${stepNumber}"]`).classList.add("active");
|
||||
@@ -316,15 +317,15 @@ function rewriteSpeakerName(){
|
||||
try {
|
||||
var tempy = document.getElementById("cur_speaker").value;
|
||||
speakerAudios[tempy].name = document.getElementById("newSpeaker").value;
|
||||
setSpeakerAudiosValue(speakerAudios);
|
||||
loadSpeakerOptions(speakerAudios);
|
||||
} catch (error) {
|
||||
|
||||
console.log("\n\n\n" + error + "\n\n\n")
|
||||
}
|
||||
}
|
||||
|
||||
function sendSpeakerPackages(){
|
||||
try {
|
||||
window.sendSpeakerPackages(speakerAudios);
|
||||
window.submitSpeaker.speaker_submit(speakerAudios);
|
||||
} catch (error) {
|
||||
|
||||
}
|
||||
|
||||
+36
-6
@@ -17,7 +17,6 @@ body {
|
||||
transform: translate(-50%, -50%);
|
||||
margin: 0;
|
||||
z-index: 20;
|
||||
|
||||
}
|
||||
|
||||
#h1-wrapper {
|
||||
@@ -109,6 +108,14 @@ body {
|
||||
background-color: #0056b3;
|
||||
}
|
||||
|
||||
#step2 {
|
||||
gap: 30px;
|
||||
}
|
||||
|
||||
.KI-wrapper {
|
||||
margin-top: 40px;
|
||||
}
|
||||
|
||||
input[type="file"] {
|
||||
display: none;
|
||||
}
|
||||
@@ -176,12 +183,10 @@ input[type="file"] {
|
||||
|
||||
.submit-btn {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 10px 20px;
|
||||
margin-left: 300px;
|
||||
margin-top: 30px;
|
||||
margin-bottom: 70px;
|
||||
margin: 130px auto 10px auto;
|
||||
background-color: #007BFF;
|
||||
color: white;
|
||||
border: none;
|
||||
@@ -295,7 +300,6 @@ input[type="file"] {
|
||||
margin-top: 70px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
min-height: 400px;
|
||||
}
|
||||
|
||||
@@ -465,6 +469,21 @@ li {
|
||||
font-size: larger;
|
||||
}
|
||||
|
||||
#step4 {
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
#step5 {
|
||||
align-items: flex-start;
|
||||
}
|
||||
|
||||
.button-group {
|
||||
display: flex;
|
||||
gap: 12px;
|
||||
justify-content: center;
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
.download-btn {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
@@ -481,3 +500,14 @@ li {
|
||||
cursor: pointer;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
#speakerLocker, #speakerResender{
|
||||
padding: 10px 20px;
|
||||
margin: 20px auto;
|
||||
background-color: #007BFF;
|
||||
color: white;
|
||||
border: none;
|
||||
border-radius: 8px;
|
||||
cursor: pointer;
|
||||
font-size: 14px;
|
||||
}
|
||||
@@ -209,8 +209,7 @@ electron.ipcMain.on("file_submit", async (event, args) => {
|
||||
|
||||
|
||||
await mapFunctions.get("extract-speaker-snippets").function({audioPath: audiopath, jsonPath: transcriptpath }).then(resp => {
|
||||
mainWindow.webContents.send("submitSpeaker", resp)
|
||||
console.log(resp)
|
||||
mainWindow.webContents.send("speakerAudios", resp)
|
||||
}).catch(err => {
|
||||
mainWindow.webContents.send("error", err)
|
||||
return
|
||||
@@ -224,6 +223,9 @@ electron.ipcMain.on("file_download", async() => {
|
||||
await mapFunctions.get("htmlDocumentConverter").convert({inputPath:globalFinalHtmlPath, format: globalArgs.document.outputType, showDialog: true});
|
||||
})
|
||||
|
||||
electron.ipcMain.on("speaker_submit", async() => {
|
||||
console.log("\n\n\nJa also hier kam was an \n\n\n");
|
||||
})
|
||||
|
||||
let q =
|
||||
{
|
||||
|
||||
Reference in New Issue
Block a user