mirror of
https://gitlab.rlp.net/proj-wise2526-video2document/video2document.git
synced 2026-06-15 18:01:52 +02:00
Merge branch 'feature/ui-test' of https://gitlab.rlp.net/proj-wise2526-video2document/video2document into feature/ui-test
This commit is contained in:
@@ -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>
|
||||||
+18
-13
@@ -19,8 +19,8 @@
|
|||||||
</label>
|
</label>
|
||||||
|
|
||||||
<nav class="menu1">
|
<nav class="menu1">
|
||||||
<a href="index2.html" class="li1">Custom document</a>
|
<a href="custom_document.html" class="li1">Custom document</a>
|
||||||
<a href="index3.html" class="li1">Help</a>
|
<a href="" class="li1">Help</a>
|
||||||
</nav>
|
</nav>
|
||||||
</nav>
|
</nav>
|
||||||
</section>
|
</section>
|
||||||
@@ -57,26 +57,31 @@
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="step" id="step2" style="display:none;">
|
<div class="step" id="step2" style="display:none;">
|
||||||
<div class="labelDiv" id="labelDiv">
|
<div class="KI-wrap">
|
||||||
<label id="labelKI">Select ki:</label>
|
<label id="labelKI">Select ki:</label>
|
||||||
<label id="labelTranscription">Select transcription:</label>
|
<select name="ai_type" id="ai_type"></select>
|
||||||
<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" >
|
|
||||||
</div>
|
</div>
|
||||||
<div class="dropdownMenus" id="dropdownMenus">
|
|
||||||
<select name="ai_type" id="ai_type">
|
<div class="transcript-wrap">
|
||||||
</select>
|
<label id="labelTranscription">Select transcription:</label>
|
||||||
<select name="transkript_type" id="transkript_type">
|
<select name="transkript_type" id="transkript_type"></select>
|
||||||
</select>
|
</div>
|
||||||
|
|
||||||
|
<div class="type-wrapper">
|
||||||
|
<label id="labelType">Select type:</label>
|
||||||
<select name="output_type" id="output_type">
|
<select name="output_type" id="output_type">
|
||||||
<option value="pdf">.pdf</option>
|
<option value="pdf">.pdf</option>
|
||||||
<option value="word">.word</option>
|
<option value="word">.word</option>
|
||||||
<option value="txt">.txt</option>
|
<option value="txt">.txt</option>
|
||||||
</select>
|
</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 name="language_option" id="language_option">
|
||||||
</select>
|
</select>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="step" id="step3" style="display:none;">
|
<div class="step" id="step3" style="display:none;">
|
||||||
|
|||||||
@@ -17,7 +17,6 @@ body {
|
|||||||
transform: translate(-50%, -50%);
|
transform: translate(-50%, -50%);
|
||||||
margin: 0;
|
margin: 0;
|
||||||
z-index: 20;
|
z-index: 20;
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
#h1-wrapper {
|
#h1-wrapper {
|
||||||
@@ -108,6 +107,12 @@ body {
|
|||||||
.submit-btn:hover {
|
.submit-btn:hover {
|
||||||
background-color: #0056b3;
|
background-color: #0056b3;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
#step2 {
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
gap: 30px;
|
||||||
|
}
|
||||||
|
|
||||||
input[type="file"] {
|
input[type="file"] {
|
||||||
display: none;
|
display: none;
|
||||||
|
|||||||
Reference in New Issue
Block a user