diff --git a/css/m4lab.css b/css/m4lab.css
index 3b849df949559af9e4d5b64d643d8f9f849073b7..536f60ba9c116ce98a8d01103b4ed65fc168b99c 100644
--- a/css/m4lab.css
+++ b/css/m4lab.css
@@ -626,4 +626,8 @@ justify-content:space-evenly;}
cursor: pointer; /* Add a mouse pointer on hover */
padding: 10px; /* Some padding */
font-size: 18px; /* Increase font size */
+}
+
+.video-tutorial {
+ width: 100%;
}
\ No newline at end of file
diff --git a/help/gitlab-pages.html b/help/gitlab-pages.html
index ac21fea717f4a4fd2eb38cb002b75bbf2a481f70..7e00cbf9002a02e4a8b2e84d9b292d946c42040a 100644
--- a/help/gitlab-pages.html
+++ b/help/gitlab-pages.html
@@ -556,6 +556,11 @@
</div>
<div id="collapse7t" class="card-body collapse">
<p>Dies is eine Vorlage mit einer einzigen Seite. Um den Inhalt anzupassen, ändern Sie die Datei index.html.</p>
+ <video class="video-tutorial" playsinline controls>
+ <source src="videos/reactive.mp4" type="video/mp4" />
+ <track kind="captions" label="German" src="videos/reactive_de.vtt" srclang="de" default />
+ <track kind="captions" label="English" src="videos/reactive_en.vtt" srclang="en" default />
+ </video>
</div>
</div>
@@ -573,6 +578,11 @@
Diese Vorlage hat eine einzelne Seite und ist für die Präsentation einer Studienarbeit (Bachelor- / Masterarbeit) gedacht. Im Home-Ordner müssen Sie die Dateien für Ihre Titelseite und die pdf Ihrer Arbeit austauschen. Klicken Sie dazu auf den 'Replace'-Knopf
<img src="/img/help/cover_thesis.png" width="95%"/>
Anschließend müssen in der Datei index.html Ihr Name, das Jahr etc. angepasst werden.
+ <video class="video-tutorial" playsinline controls>
+ <source src="videos/geology.mp4" type="video/mp4" />
+ <track kind="captions" label="German" src="videos/geology_de.vtt" srclang="de" default />
+ <track kind="captions" label="English" src="videos/geology_en.vtt" srclang="en" default />
+ </video>
</p>
</div>
</div>
@@ -595,23 +605,14 @@
Die Startseite deutet dabei immer auf den Ordner home, wenn Sie also die Startseite ändern wollen, müssen Sie den Ordner in 'home' umbenennen.
</p>
<img src="/img/help/generic.png"/>
+ <video class="video-tutorial" playsinline controls>
+ <source src="videos/serene.mp4" type="video/mp4" />
+ <track kind="captions" label="German" src="videos/serene_de.vtt" srclang="de" default />
+ <track kind="captions" label="English" src="videos/serene_en.vtt" srclang="en" default />
+ </video>
</div>
- </div>
-
- <br/>
-
- <div class="card">
- <div class="card-header">
- <h3 class="card-title">
- <a class="collapsed" data-toggle="collapse" href="#collapse10t" aria-expanded="false" aria-controls="collapse10t">
- <small>Videoanleitung</small></a>
- </h3>
- </div>
- <div id="collapse10t" class="card-body collapse">
- <video id="player" playsinline controls></video>
- <button id="next">Next</button>
- </div>
- </div>
+ </div>
+
</div>
</div>
@@ -662,7 +663,6 @@
<script src="/js/headfoot.js"></script>
<script src="/js/mobile.js"></script>
<script src="https://cdn.plyr.io/3.6.9/plyr.js"></script>
-<script src="/js/player.js"></script>
</body>
diff --git a/help/videos/geology_de.vtt b/help/videos/geology_de.vtt
index 8a365e569f00628596cb2cb02fbcd31789e9a7da..fda4474f6e47a1a5f893c00b96259a2056396835 100644
--- a/help/videos/geology_de.vtt
+++ b/help/videos/geology_de.vtt
@@ -1,62 +1,44 @@
-WEBVTT
-
-1
-00:00:21.471 --> 00:00:26.643
-Melden Sie sich bei Ihrem Portalkonto an und erstellen Sie ein neues Projekt
-
-2
-00:00:52.343 --> 00:00:57.114
-Öffnen Sie Ihr Projekt im Transferportal gitlab
-
-3
-00:01:03.114 --> 00:01:08.171
-Laden Sie das Logo und die Bilder in den öffentlichen Ordner hoch
-
-4
-00:01:56.929 --> 00:02:01.157
-Laden Sie die Diagrammfigur in den Home-Ordner hoch
-
-5
-00:02:16.328 --> 00:02:21.541
-Bearbeiten Sie die Einstellungen für die Seite und die Teilnehmer
-
-6
-00:04:21.043 --> 00:04:24.329
-Entfernen Sie den persönlichen Website-Eintrag
-
-7
-00:05:23.686 --> 00:05:25.243
-Speichern Sie die Änderungen
-
-8
-00:05:34.243 --> 00:05:36.114
-Bearbeiten Sie die Startseite
-
-9
-00:06:51.329 --> 00:06:54.271
-Ändern Sie die Quelle des Bildes
-
-10
-00:07:25.986 --> 00:07:29.914
-Entfernen Sie den Rest des Vorlageninhalts
-
-11
-00:08:00.057 --> 00:08:01.714
-Speichern Sie die Änderungen
-
-12
-00:08:14.186 --> 00:08:18.814
-Warten Sie einige Sekunden, bis die Webseite veröffentlicht wird
-
-13
-00:08:40.771 --> 00:08:42.414
-Immer noch am arbeiten...
-
-14
-00:08:50.271 --> 00:08:52.943
-Ihre Webseite ist veröffentlicht
-
-15
-00:09:11.086 --> 00:09:12.429
-Besuchen Sie die URL
-
+WEBVTT
+
+00:00:27.214 --> 00:00:32.386
+Melden Sie sich bei Ihrem Portalkonto an
+und erstellen Sie ein neues Projekt
+
+00:01:03.843 --> 00:01:08.614
+Öffnen Sie Ihr Projekt im Transferportal gitlab
+
+00:01:18.971 --> 00:01:24.029
+Laden Sie Logos oder Bilder
+in den öffentlichen Ordner hoch
+
+00:01:56.371 --> 00:02:01.586
+Bearbeiten Sie die Einstellungen
+für die Seite und die Teilnehmer
+
+00:03:45.850 --> 00:03:48.867
+Entfernen Sie den zweiten Teilnehmer
+
+00:04:23.133 --> 00:04:24.700
+Speichern Sie die Änderungen
+
+00:04:34.500 --> 00:04:37.467
+Ersetzen Sie das Cover der Abschlussarbeit
+
+00:04:59.167 --> 00:05:01.850
+Ersetzen Sie die PDF-Datei der Abschlussarbeit
+
+00:05:40.150 --> 00:05:42.017
+Bearbeiten Sie die Startseite
+
+00:08:06.683 --> 00:08:08.350
+Speichern Sie die Änderungen
+
+00:08:15.200 --> 00:08:19.833
+Warten Sie einige Sekunden,
+bis die Webseite veröffentlicht wird
+
+00:08:21.033 --> 00:08:23.717
+Ihre Webseite ist veröffentlicht
+
+00:08:34.250 --> 00:08:35.583
+Besuchen Sie die URL
\ No newline at end of file
diff --git a/help/videos/geology_en.vtt b/help/videos/geology_en.vtt
index 306c327c109c7fcc021ca5fef1f4e1b98816533f..7add24964eaebd423ed3f2bf083b57bfe030dd24 100644
--- a/help/videos/geology_en.vtt
+++ b/help/videos/geology_en.vtt
@@ -1,67 +1,58 @@
WEBVTT
1
-00:00:21.471 --> 00:00:26.643
+00:00:27.214 --> 00:00:32.386
Sign into your portal account
and create a new project
2
-00:00:52.343 --> 00:00:57.114
+00:01:03.843 --> 00:01:08.614
Open your project in the transfer portal gitlab
3
-00:01:03.114 --> 00:01:08.171
-Upload the logo
-and the images into the public folder
+00:01:18.971 --> 00:01:24.029
+Upload any logos
+or images into the public folder
4
-00:01:56.929 --> 00:02:01.157
-Upload the chart figure
-into the home folder
+00:01:56.371 --> 00:02:01.586
+Edit the settings for the
+page and the participants
5
-00:02:16.328 --> 00:02:21.541
-Edit the settings for the
-page and the participants
+00:03:45.850 --> 00:03:48.867
+Remove the second participant
6
-00:04:21.043 --> 00:04:24.329
-Remove the personal website entry
+00:04:23.133 --> 00:04:24.700
+Save the changes
7
-00:05:23.686 --> 00:05:25.243
-Save the changes
+00:04:34.500 --> 00:04:37.467
+Replace the cover of the thesis
8
-00:05:34.243 --> 00:05:36.114
-Edit the home page
+00:04:59.167 --> 00:05:01.850
+Replace the thesis PDF file
9
-00:06:51.329 --> 00:06:54.271
-Change the source of the image
+00:05:40.150 --> 00:05:42.017
+Edit the home page
10
-00:07:25.986 --> 00:07:29.914
-Remove the rest of the template content
-
-11
-00:08:00.057 --> 00:08:01.714
+00:08:06.683 --> 00:08:08.350
Save the changes
-12
-00:08:14.186 --> 00:08:18.814
+11
+00:08:15.200 --> 00:08:19.833
Wait a few seconds for the web page
to be published
-13
-00:08:40.771 --> 00:08:42.414
-Still working...
-
-14
-00:08:50.271 --> 00:08:52.943
+12
+00:08:21.033 --> 00:08:23.717
Your web page is published
-15
-00:09:11.086 --> 00:09:12.429
+13
+00:08:34.250 --> 00:08:35.583
Visit the URL
diff --git a/help/videos/reactive_de.vtt b/help/videos/reactive_de.vtt
index 8a365e569f00628596cb2cb02fbcd31789e9a7da..5f9f7c5c1dd91d542f0a864fee28fe6cb777f7d0 100644
--- a/help/videos/reactive_de.vtt
+++ b/help/videos/reactive_de.vtt
@@ -2,7 +2,8 @@ WEBVTT
1
00:00:21.471 --> 00:00:26.643
-Melden Sie sich bei Ihrem Portalkonto an und erstellen Sie ein neues Projekt
+Melden Sie sich bei Ihrem Portalkonto an
+und erstellen Sie ein neues Projekt
2
00:00:52.343 --> 00:00:57.114
@@ -10,15 +11,18 @@ Melden Sie sich bei Ihrem Portalkonto an und erstellen Sie ein neues Projekt
3
00:01:03.114 --> 00:01:08.171
-Laden Sie das Logo und die Bilder in den öffentlichen Ordner hoch
+Laden Sie das Logo und die Bilder
+in den öffentlichen Ordner hoch
4
00:01:56.929 --> 00:02:01.157
-Laden Sie die Diagrammfigur in den Home-Ordner hoch
+Laden Sie die Diagrammfigur
+in den Home-Ordner hoch
5
00:02:16.328 --> 00:02:21.541
-Bearbeiten Sie die Einstellungen für die Seite und die Teilnehmer
+Bearbeiten Sie die Einstellungen
+für die Seite und die Teilnehmer
6
00:04:21.043 --> 00:04:24.329
@@ -46,7 +50,8 @@ Speichern Sie die Änderungen
12
00:08:14.186 --> 00:08:18.814
-Warten Sie einige Sekunden, bis die Webseite veröffentlicht wird
+Warten Sie einige Sekunden,
+bis die Webseite veröffentlicht wird
13
00:08:40.771 --> 00:08:42.414
diff --git a/help/videos/serene_de.vtt b/help/videos/serene_de.vtt
new file mode 100644
index 0000000000000000000000000000000000000000..3be1c145a58b81729f237ad55e4311e749fcc0f4
--- /dev/null
+++ b/help/videos/serene_de.vtt
@@ -0,0 +1,83 @@
+WEBVTT
+
+00:00:20.271 --> 00:00:25.443
+Melden Sie sich bei Ihrem Portalkonto an
+und erstellen Sie ein neues Projekt
+
+00:00:48.514 --> 00:00:53.286
+Öffnen Sie Ihr Projekt im Transferportal gitlab
+
+00:00:58.043 --> 00:01:03.100
+Laden Sie Logos oder Bilder
+in den öffentlichen Ordner hoch
+
+00:02:17.243 --> 00:02:22.457
+Bearbeiten Sie die Einstellungen
+für die Seite und die Teilnehmer
+
+00:03:16.817 --> 00:03:18.817
+Bearbeiten Sie die Menüpunkte
+
+00:04:17.933 --> 00:04:20.133
+Bearbeiten Sie die Teilnehmer
+
+00:05:18.783 --> 00:05:21.800
+Entfernen Sie den persönlichen Website-Eintrag
+
+00:06:21.717 --> 00:06:23.283
+Speichern Sie die Änderungen
+
+00:06:52.333 --> 00:06:54.200
+Bearbeiten Sie die Startseite
+
+00:08:15.667 --> 00:08:19.467
+Entfernen Sie den Rest des Vorlageninhalts
+
+00:08:54.433 --> 00:08:56.717
+Restlichen Text hinzufügen
+
+00:09:40.317 --> 00:09:41.983
+Speichern Sie die Änderungen
+
+00:10:04.833 --> 00:10:07.117
+Ergebnisseite erstellen
+
+00:10:16.917 --> 00:10:20.467
+Kopieren Sie den Inhalt der Rohvorlage
+
+00:10:33.850 --> 00:10:38.317
+Erstellen Sie einen neuen Ordner im öffentlichen Ordner
+
+00:10:51.600 --> 00:10:54.417
+Erstellen Sie eine neue index.html-Datei
+
+00:11:06.950 --> 00:11:10.267
+Fügen Sie den Inhalt der Vorlage ein
+
+00:11:14.583 --> 00:11:15.933
+Speicher die Datei
+
+00:11:24.600 --> 00:11:26.750
+Laden Sie das Diagrammbild hoch
+
+00:11:42.333 --> 00:11:44.533
+Bearbeiten Sie die Ergebnisseite
+
+00:13:04.750 --> 00:13:07.900
+Ändern Sie die Quelle des Bildes
+
+00:13:34.050 --> 00:13:37.883
+Entfernen Sie den Rest des Vorlageninhalts
+
+00:14:07.500 --> 00:14:09.133
+Speichern Sie die Änderungen
+
+00:14:20.367 --> 00:14:25.000
+Warten Sie einige Sekunden,
+bis die Webseite veröffentlicht wird
+
+00:14:33.767 --> 00:14:36.450
+Ihre Webseite ist veröffentlicht
+
+00:14:45.183 --> 00:14:46.517
+Besuchen Sie die URL
\ No newline at end of file
diff --git a/help/videos/serene_en.vtt b/help/videos/serene_en.vtt
new file mode 100644
index 0000000000000000000000000000000000000000..737195200099787487518c82bafff5ee10e9999e
--- /dev/null
+++ b/help/videos/serene_en.vtt
@@ -0,0 +1,110 @@
+WEBVTT
+
+1
+00:00:20.271 --> 00:00:25.443
+Sign into your portal account
+and create a new project
+
+2
+00:00:48.514 --> 00:00:53.286
+Open your project in the transfer portal gitlab
+
+3
+00:00:58.043 --> 00:01:03.100
+Upload any logos
+or images into the public folder
+
+4
+00:02:17.243 --> 00:02:22.457
+Edit the settings for the
+page and the participants
+
+5
+00:03:16.817 --> 00:03:18.817
+Edit the menu items
+
+6
+00:04:17.933 --> 00:04:20.133
+Edit the participants
+
+7
+00:05:18.783 --> 00:05:21.800
+Remove the personal website entry
+
+8
+00:06:21.717 --> 00:06:23.283
+Save the changes
+
+9
+00:06:52.333 --> 00:06:54.200
+Edit the home page
+
+10
+00:08:15.667 --> 00:08:19.467
+Remove the rest of the template content
+
+11
+00:08:54.433 --> 00:08:56.717
+Add the remaining text
+
+12
+00:09:40.317 --> 00:09:41.983
+Save the changes
+
+13
+00:10:04.833 --> 00:10:07.117
+Create the outcome page
+
+14
+00:10:16.917 --> 00:10:20.467
+Copy the contents of the raw template
+
+15
+00:10:33.850 --> 00:10:38.317
+Create a new folder inside the public folder
+
+16
+00:10:51.600 --> 00:10:54.417
+Create a new index.html file
+
+17
+00:11:06.950 --> 00:11:10.267
+Paste the contents of the template
+
+18
+00:11:14.583 --> 00:11:15.933
+Save the file
+
+19
+00:11:24.600 --> 00:11:26.750
+Upload the chart image
+
+20
+00:11:42.333 --> 00:11:44.533
+Edit the outcome page
+
+21
+00:13:04.750 --> 00:13:07.900
+Change the source of the image
+
+22
+00:13:34.050 --> 00:13:37.883
+Remove the rest of the template content
+
+23
+00:14:07.500 --> 00:14:09.133
+Save the changes
+
+24
+00:14:20.367 --> 00:14:25.000
+Wait a few seconds for the web page
+to be published
+
+25
+00:14:33.767 --> 00:14:36.450
+Your web page is published
+
+26
+00:14:45.183 --> 00:14:46.517
+Visit the URL
+
diff --git a/js/player.js b/js/player.js
deleted file mode 100644
index cb250bfb52620bca97e275314ab416ea9387b53b..0000000000000000000000000000000000000000
--- a/js/player.js
+++ /dev/null
@@ -1,66 +0,0 @@
-const player = new Plyr('#player', {
- captions: { active: true, language: 'de', update: false }
-});
-
-player.source = {
- type: 'video',
- title: 'geology',
- sources: [
- {
- src: 'videos/reactive.mp4',
- type: 'video/mp4'
- }
- ],
- tracks: [
- {
- kind: 'captions',
- label: 'German',
- srclang: 'de',
- src: 'videos/reactive_de.vtt',
- default: true,
- },
- {
- kind: 'captions',
- label: 'English',
- srclang: 'en',
- src: 'videos/reactive_en.vtt'
- },
- ],
-};
-
-
-let btn = document.getElementById("next");
-
-
-btn.onclick = () => {
-
- player.source = {
- type: 'video',
- title: 'geology',
- sources: [
- {
- src: 'videos/geology.mp4',
- type: 'video/mp4',
- size: 720,
- }
- ],
- tracks: [
- {
- kind: 'captions',
- label: 'German',
- srclang: 'de',
- src: 'videos/geology_de.vtt',
- default: true,
- },
- {
- kind: 'captions',
- label: 'English',
- srclang: 'en',
- src: 'videos/geology_en.vtt'
- },
- ],
- };
- player.play();
-
-
-};
\ No newline at end of file