diff --git a/documentation.md b/documentation.md index 15f8bee..f6ad0c5 100644 --- a/documentation.md +++ b/documentation.md @@ -7,6 +7,7 @@ 4. [IPC](#ipc) 5. [Authentication](#authentication) 6. [UI](#ui) +7. [Storage](#storage) ## How to run the Software If you read the readme file, you will see the basic setup command in order to run the program. @@ -37,7 +38,7 @@ The program iterates through all of the folders within `./services/modules`, and This map is available ANYWHERE in the backend code, even within a module, which means, you can call a module, from within a module, from within a module, from within yet another module. ## Modules -Building a new module is super easy, any idiot can get it done. +Building a new module is super easy, anyone can get it done. All you need to do is follow the previously mentioned structure. When you have created your module file, the `.js` file, you simply copy paste this code snippet into it. ```js @@ -52,7 +53,7 @@ module.exports = { } } ``` -If by this point, you cared enough to actually look at the code and the modules and so on, you might have spotted a file in `./services/modules/utility` called `example.js`. +If you had a look at the code and the modules and so on, you might have spotted a file in `./services/modules/utility` called `example.js`. This is a template file that you can just copy paste and use as a base for your new module. It has the same exact code as mentioned right above. Now as for how the code works. @@ -157,7 +158,6 @@ with more defined explanations regarding the steps of the GUI. All parts used in Files used for the UI: - index.html -- help_page.html - style.css - script.js - renderer.js @@ -175,10 +175,6 @@ Folders used for the UI: This file is the basic framework of our software. Comments in the code define the different UI sections. The comments are the headlines of the code below them. -**help_page.html:** -This is the html to the help page that is accessible though the burger menu in the software. -Currently only available in german. It describes the different parts of the program in more depth. - **style.css:** Contains all the css code of the software used in the UI. @@ -222,4 +218,19 @@ This directory contains the flags used for the language selection dropdown menu. Pictures for the document preview are stored here. **/node_modules:** -Contains nodes used by electron. \ No newline at end of file +Contains nodes used by electron. + +## Storage + +In the root directory of the project you will find the `storage` folder. +This directory is used to persist **all artifacts generated throughout the processing pipeline**, allowing each step to operate independently while still sharing results. + +Each module is expected to **read from and write to this directory**, depending on its responsibility in the pipeline. + +The storage folder contains the following sub folders: +- **audio** stores the extracted audio from the video + - **audio-snippets** store the individual speaker snippets for speaker identification +- **documents** store the HTML files generated by the AI / LLM modules +- **documentType** stores the premade prompt templates used for the AI calls +- **transcriptionSummaries** store the transcripts after they have been transformed from word-level to sentence-level +- **transcripts** store the raw transcripts returned by the transcription services diff --git a/electron/main/flags/czechia-flag-png-large.png b/electron/main/flags/czechia-flag-png-large.png new file mode 100644 index 0000000..12c47be Binary files /dev/null and b/electron/main/flags/czechia-flag-png-large.png differ diff --git a/electron/main/flags/russia-flag-png-large.png b/electron/main/flags/russia-flag-png-large.png new file mode 100644 index 0000000..0dd9a16 Binary files /dev/null and b/electron/main/flags/russia-flag-png-large.png differ diff --git a/electron/main/help_page.html b/electron/main/help_page.html index 17c54bb..e1618e4 100644 --- a/electron/main/help_page.html +++ b/electron/main/help_page.html @@ -17,302 +17,18 @@ align-items: center; } - /* ===== CONTAINER ===== */ - .container { - background: white; - width: 90%; - max-width: 800px; - height: 85vh; - /* feste Höhe */ - border-radius: 12px; - box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1); - display: flex; - flex-direction: column; - } - - /* ===== FIXER TOP-BEREICH ===== */ - .top-bar { - padding: 15px 20px; - border-bottom: 1px solid #eee; - display: flex; - justify-content: space-between; - align-items: center; - flex-shrink: 0; - } - - /* Buttons */ - .back-btn, - .toc-toggle { - background: #007BFF; - color: white; - border: none; - padding: 8px 14px; - border-radius: 6px; - cursor: pointer; - font-size: 14px; - } - - .back-btn:hover, - .toc-toggle:hover { - background: #0056b3; - } - - /* ===== TOC ===== */ - .toc-wrapper { - position: relative; - } - - .toc { - position: absolute; - right: 0; - top: 45px; - background: white; - border-radius: 8px; - box-shadow: 0 8px 25px rgba(0, 0, 0, 0.15); - padding: 10px; - min-width: 220px; - display: none; - z-index: 5; - } - - .toc a { - display: block; - padding: 8px 10px; - color: #007BFF; - text-decoration: none; - border-radius: 6px; - } - - .toc a:hover { - background: #f0f2f5; - } - - .toc.show { - display: block; - } - - /* ===== SCROLLBEREICH ===== */ - .content { - padding: 30px; - overflow-y: auto; - flex: 1; - } - - /* Inhalt */ - h1 { - text-align: center; - color: #333; - } - - .step { - margin-bottom: 20px; - margin-top: 20px; - } - - .step h2 { - color: #0056b3; - } - - .step h3 { - color: #555; - margin-bottom: 5px; - } - - .step p { - color: #555; - line-height: 1.6; - } - - .step img { - width: 100%; - max-height: 350px; - object-fit: contain; - border-radius: 8px; - margin-top: 15px; - border: 1px solid #ddd; - } + -
- - -
- - - - -

Programm Anleitung

- - -
- - -
-
- - -
- -
-

Video zu Dokument umwandeln.

- -
-

Schritt 1 - Video auswählen

-

- - Ziehe eine Videodatei in das Drag-and-Drop-Feld oder klicke auf „Video - suchen“,
- um eine Datei über deinen Dateibrowser auszuwählen.
- - Klicke anschließend auf Schritt 2 oder auf den blauen Pfeil rechts, um - fortzufahren. -

-
-
-

Schritt 2 - Konfiguration

-

- - Wähle im ersten Auswahlmenü die zu verwendende KI.
- - Wähle im zweiten Auswahlmenü das zu verwendende Transkriptions-Tool.
- - Wähle im dritten Auswahlmenü das Dateiformat des zu erstellenden - Dokuments.
- - Wähle im vierten Auswahlmenü die Sprache des zu erstellenden Dokuments.
- - Klicke anschließend auf Schritt 3 oder auf den blauen Pfeil rechts, um - fortzufahren. -

-
-
-

Schritt 3 - Dokumententyp auswählen

-

- - Wähle einen Dokumententyp über die Checkbox oder einen zuvor erstellten Dokumententyp aus dem - Dropdown-Menü aus.
- - Klicke anschließend auf Schritt 4 oder auf den blauen Pfeil rechts, um - fortzufahren. -

-
-
-

Schritt 4 - Bestätigen

-

- Klicke auf „Submit“, um die Dokumentengenerierung zu starten.
- Während der Verarbeitung werden vier Statuspunkte angezeigt, die sich schrittweise von rot zu - grün färben und den aktuellen Fortschritt darstellen: -

- Punkt 1: Upload und Vorbereitung der Videodatei.
- Punkt 2: Transkription des Videoinhalts.
- Punkt 3: KI-gestützte Verarbeitung und Dokumentenerstellung.
- Punkt 4: Abschluss der Generierung und Bereitstellung des Dokuments. -

- Nach erfolgreichem Abschluss klicke auf Schritt 5 oder auf den blauen Pfeil - rechts, um fortzufahren. -

-
-
-

Schritt 5 - Sprecher identifizieren

-

- Im Auswahlmenü kannst du einen erkannten Sprecher auswählen.
- Über den Play-Button lässt sich ein gesprochener Satz anhören, um den Sprecher eindeutig zu - identifizieren.
- Mit dem Lautsprecher-Symbol kannst du die Lautstärke anpassen.
- Über das Drei-Punkte-Menü lässt sich die Wiedergabegeschwindigkeit einstellen.

- - Im Textfeld „Write name“ gibst du den tatsächlichen Namen des Sprechers ein, - damit dieser im Dokument - anstelle von Platzhaltern wie z. B. „Sprecher A“ angezeigt wird.
- Bestätige die Eingabe mit „Rename Speaker“.

- - Mit dem Button „Rewrite Document“ werden anschließend alle - Sprecherbezeichnungen im Dokument ersetzt.

- - Klicke danach auf Schritt 6 oder auf den blauen Pfeil rechts, um fortzufahren. -

-
-
-

Schritt 6 - Dokument speichern

-

- Klicke auf „Download“, um das Dokument zu speichern.
- Es öffnet sich anschließend ein Dateiexplorer, in dem du den gewünschten Speicherort auswählen - kannst. -

-
-
- - -
-

Dokumententyp erstellen

-

- - Öffne oben links das Burgermenü und wähle den Punkt „Dokumententypen - verwalten“.
- - Wähle anschließend im Auswahlmenü die Option „-- Neuen Dokumententyp erstellen - --“.
- - Vergib einen aussagekräftigen Namen für den neuen Dokumententyp.
- - Formuliere den Prompt für die KI-gestützte Verarbeitung sorgfältig.
- - Klicke auf Dokumententyp speichern.

- Hinweis:
Der eingegebene Prompt wird unverändert an einen KI-Dienst - übermittelt. - Achte daher unbedingt auf die Einhaltung der geltenden Datenschutzrichtlinien und gib keine - sensiblen oder personenbezogenen Daten ein. -

-
- -
-

Dokumententyp bearbeiten

-

- - Öffne oben links das Burgermenü und wähle den Punkt „Dokumententypen - verwalten“.
- - Wähle anschließend im Auswahlmenü den zu bearbeitenden Dokumententyp aus.
- - Überarbeite den bestehenden KI-Prompt oder formuliere einen neuen Prompt.
- - Klicke abschließend auf „Dokumententyp speichern“.

- - Hinweis:
- Der eingegebene Prompt wird unverändert an einen KI-Dienst übermittelt. - Achte daher unbedingt auf die Einhaltung der geltenden Datenschutzrichtlinien und gib keine - sensiblen oder personenbezogenen Daten ein. -

-
- -
-

Dokumententyp löschen

-

- Öffne oben links das Burgermenü und wähle den Punkt „Dokumententypen - verwalten“.
- - Wähle anschließend im Auswahlmenü den zu löschenden Dokumententyp aus.
- - Klicke abschließend auf „Dokumententyp löschen“.

- - Hinweis:
- Nach Bestätigung des Löschvorgangs kann der Dokumententyp nicht wiederhergestellt werden. -

-
-
- -
+ diff --git a/electron/main/icons/agenda_example.png b/electron/main/icons/agenda_example.png new file mode 100644 index 0000000..e2c365d Binary files /dev/null and b/electron/main/icons/agenda_example.png differ diff --git a/electron/main/icons/follow_up_report_example.png b/electron/main/icons/follow_up_report_example.png new file mode 100644 index 0000000..fcd1aed Binary files /dev/null and b/electron/main/icons/follow_up_report_example.png differ diff --git a/electron/main/icons/result_protocol_example.png b/electron/main/icons/result_protocol_example.png new file mode 100644 index 0000000..7056807 Binary files /dev/null and b/electron/main/icons/result_protocol_example.png differ diff --git a/electron/main/icons/sprint_planning_note_example.png b/electron/main/icons/sprint_planning_note_example.png new file mode 100644 index 0000000..43e6d11 Binary files /dev/null and b/electron/main/icons/sprint_planning_note_example.png differ diff --git a/electron/main/index.html b/electron/main/index.html index 39d4251..d88605a 100644 --- a/electron/main/index.html +++ b/electron/main/index.html @@ -1,340 +1,397 @@ - - - - Video to document - - - - -
-
- +
+

Video to document

- -
- -
-
-
1. Step
-
2. Step
-
3. Step
-
4. Step
-
5. Step
-
6. Step
+
+
+
-
- +
+
1. Step
+
2. Step
+
3. Step
+
4. Step
+
5. Step
+
6. Step
+
- -
- -