Commit ac8bd28a authored by Koukofikis's avatar Koukofikis
Browse files

Merge branch 'MLAB-615' into 'testing'

Add videos player for help videos

See merge request !146
parents 89f44c03 6c2ca746
Pipeline #5703 passed with stage
in 30 seconds
......@@ -13,6 +13,7 @@
<link rel="stylesheet" href="/css/Testimonials.css">
<link rel="stylesheet" href="/css/help.css">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.8.2/css/all.css" integrity="sha384-oS3vJWv+0UjzBfQzYUhtDYW+Pj2yciDJxpsK1OYPAYjqT085Qq/1cq5FLXAZQ7Ay" crossorigin="anonymous">
<link href="https://cdn.plyr.io/3.6.9/plyr.css" rel="stylesheet" />
</head>
<body>
......@@ -595,7 +596,22 @@
</p>
<img src="/img/help/generic.png"/>
</div>
</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>
......@@ -645,6 +661,9 @@
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script>
<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>
</html>
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
1
00:00:21.471 --> 00:00:26.643
Sign into your portal account
and create a new project
2
00:00:52.343 --> 00:00:57.114
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
4
00:01:56.929 --> 00:02:01.157
Upload the chart figure
into the home folder
5
00:02:16.328 --> 00:02:21.541
Edit the settings for the
page and the participants
6
00:04:21.043 --> 00:04:24.329
Remove the personal website entry
7
00:05:23.686 --> 00:05:25.243
Save the changes
8
00:05:34.243 --> 00:05:36.114
Edit the home page
9
00:06:51.329 --> 00:06:54.271
Change the source of the image
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
Save the changes
12
00:08:14.186 --> 00:08:18.814
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
Your web page is published
15
00:09:11.086 --> 00:09:12.429
Visit the URL
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
1
00:00:21.471 --> 00:00:26.643
Sign into your portal account
and create a new project
2
00:00:52.343 --> 00:00:57.114
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
4
00:01:56.929 --> 00:02:01.157
Upload the chart figure
into the home folder
5
00:02:16.328 --> 00:02:21.541
Edit the settings for the
page and the participants
6
00:04:21.043 --> 00:04:24.329
Remove the personal website entry
7
00:05:23.686 --> 00:05:25.243
Save the changes
8
00:05:34.243 --> 00:05:36.114
Edit the home page
9
00:06:51.329 --> 00:06:54.271
Change the source of the image
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
Save the changes
12
00:08:14.186 --> 00:08:18.814
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
Your web page is published
15
00:09:11.086 --> 00:09:12.429
Visit the URL
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
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment