Skip to content

GitLab

Commit 5e821768 authored by Jonas Heinrich's avatar Jonas Heinrich
Browse files
Options

added video pages

parent 30a47e6f
Hide whitespace changes
Inline Side-by-side
Showing with 532 additions and 7 deletions
css/videre.css
View file @ 5e821768
......@@ -228,9 +228,3 @@ button {
video::-webkit-media-controls {
display: none !important; }
video {
object-fit: cover;
}
/*# sourceMappingURL=videre.css.map */
js/map.js
View file @ 5e821768
......@@ -113,7 +113,7 @@ map.on('load', function() {
});
map.on('click', 'exhibits', function (e) {
var link = e.features[0].properties.link;
var link = e.features[0].properties.url;
$( "content" ).empty();
$("content").hide().load(link).fadeIn('slow');
});
......
video/video10.html 0 → 100644
View file @ 5e821768
<html>
<body>
<div id="player" class="vid-wrapper videre-container mouse-entered" style="width: 100%;">
<div class="vid-html5">
<video src="https://vjs.zencdn.net/v/oceans.mp4?HD" id="html-player" style="width: 100%;"></video>
</div>
<div class="vid-toggle-layer"></div>
<div class="vid-shadow-layer"></div>
<div class="vid-controls-bottom flex align-center justify-center">
<div class="vid-controls-wrapper">
<div class="vid-controls-contents flex align-center justify-center">
<button class="vid-play-btn item"><i class="ion-ios-play flex align-center"></i></button>
<div class="vid-volume-container flex align-center">
<button class="vid-volume-control item"><i class="ion-android-volume-up flex align-center"></i></button>
<div id="vol-control" class="vid-volume-slider"></div>
</div>
<span class="vid-current-time"></span>
<div class="vid-progress">
<div class="progress-bg"></div>
<div class="progress-loaded"></div>
<div class="progress-fg"></div>
<div class="progress-hovertime"></div>
</div>
<span class="vid-duration"></span>
<button class="vid-request-fullscreen item"><i class="ion-android-expand flex align-center"></i></button>
</div>
</div>
</div>
<div class="vid-bottom-progress-bar">
<div class="progress-fg"></div>
</div>
</div>
<div class="description">
<h2>Josef Albers - Ehrung des Quadrats: Gelbe Zentrum (1954)</h2>
<p class="prose-big">Bla bla</p>
Bla bla bla Bla bla bla Bla bla bla Bla bla bla Bla bla bla Bla bla bla
Bla bla bla Bla bla bla Bla bla bla
Bla bla bla Bla bla bla Bla bla blaBla bla bla Bla bla bla Bla bla bla
Bla bla bla Bla bla bla Bla bla blaBla bla bla Bla bla bla Bla bla bla
Bla bla bla Bla bla bla Bla bla bla
Bla bla bla Bla bla bla Bla bla blaBla bla bla Bla bla bla Bla bla blaBla bla bla Bla bla bla Bla bla bla
Bla bla bla Bla bla bla Bla bla blaBla bla bla Bla bla bla Bla bla bla
Bla bla bla Bla bla bla Bla bla blaBla bla bla Bla bla bla Bla bla blaBla bla bla Bla bla bla Bla bla blaBla bla bla Bla bla bla Bla bla bla
</div>
</content>
</div>
</body>
<script language="javascript">
$(document).ready(function(){
$('#player').videre();
});
</script>
</html>
video/video2.html 0 → 100644
View file @ 5e821768
<html>
<body>
<div id="player" class="vid-wrapper videre-container mouse-entered" style="width: 100%;">
<div class="vid-html5">
<video src="https://vjs.zencdn.net/v/oceans.mp4?HD" id="html-player" style="width: 100%;"></video>
</div>
<div class="vid-toggle-layer"></div>
<div class="vid-shadow-layer"></div>
<div class="vid-controls-bottom flex align-center justify-center">
<div class="vid-controls-wrapper">
<div class="vid-controls-contents flex align-center justify-center">
<button class="vid-play-btn item"><i class="ion-ios-play flex align-center"></i></button>
<div class="vid-volume-container flex align-center">
<button class="vid-volume-control item"><i class="ion-android-volume-up flex align-center"></i></button>
<div id="vol-control" class="vid-volume-slider"></div>
</div>
<span class="vid-current-time"></span>
<div class="vid-progress">
<div class="progress-bg"></div>
<div class="progress-loaded"></div>
<div class="progress-fg"></div>
<div class="progress-hovertime"></div>
</div>
<span class="vid-duration"></span>
<button class="vid-request-fullscreen item"><i class="ion-android-expand flex align-center"></i></button>
</div>
</div>
</div>
<div class="vid-bottom-progress-bar">
<div class="progress-fg"></div>
</div>
</div>
<div class="description">
<h2>Josef Albers - Ehrung des Quadrats: Gelbe Zentrum (1954)</h2>
<p class="prose-big">Bla bla</p>
Bla bla bla Bla bla bla Bla bla bla Bla bla bla Bla bla bla Bla bla bla
Bla bla bla Bla bla bla Bla bla bla
Bla bla bla Bla bla bla Bla bla blaBla bla bla Bla bla bla Bla bla bla
Bla bla bla Bla bla bla Bla bla blaBla bla bla Bla bla bla Bla bla bla
Bla bla bla Bla bla bla Bla bla bla
Bla bla bla Bla bla bla Bla bla blaBla bla bla Bla bla bla Bla bla blaBla bla bla Bla bla bla Bla bla bla
Bla bla bla Bla bla bla Bla bla blaBla bla bla Bla bla bla Bla bla bla
Bla bla bla Bla bla bla Bla bla blaBla bla bla Bla bla bla Bla bla blaBla bla bla Bla bla bla Bla bla blaBla bla bla Bla bla bla Bla bla bla
</div>
</content>
</div>
</body>
<script language="javascript">
$(document).ready(function(){
$('#player').videre();
});
</script>
</html>
video/video3.html 0 → 100644
View file @ 5e821768
<html>
<body>
<div id="player" class="vid-wrapper videre-container mouse-entered" style="width: 100%;">
<div class="vid-html5">
<video src="https://vjs.zencdn.net/v/oceans.mp4?HD" id="html-player" style="width: 100%;"></video>
</div>
<div class="vid-toggle-layer"></div>
<div class="vid-shadow-layer"></div>
<div class="vid-controls-bottom flex align-center justify-center">
<div class="vid-controls-wrapper">
<div class="vid-controls-contents flex align-center justify-center">
<button class="vid-play-btn item"><i class="ion-ios-play flex align-center"></i></button>
<div class="vid-volume-container flex align-center">
<button class="vid-volume-control item"><i class="ion-android-volume-up flex align-center"></i></button>
<div id="vol-control" class="vid-volume-slider"></div>
</div>
<span class="vid-current-time"></span>
<div class="vid-progress">
<div class="progress-bg"></div>
<div class="progress-loaded"></div>
<div class="progress-fg"></div>
<div class="progress-hovertime"></div>
</div>
<span class="vid-duration"></span>
<button class="vid-request-fullscreen item"><i class="ion-android-expand flex align-center"></i></button>
</div>
</div>
</div>
<div class="vid-bottom-progress-bar">
<div class="progress-fg"></div>
</div>
</div>
<div class="description">
<h2>Josef Albers - Ehrung des Quadrats: Gelbe Zentrum (1954)</h2>
<p class="prose-big">Bla bla</p>
Bla bla bla Bla bla bla Bla bla bla Bla bla bla Bla bla bla Bla bla bla
Bla bla bla Bla bla bla Bla bla bla
Bla bla bla Bla bla bla Bla bla blaBla bla bla Bla bla bla Bla bla bla
Bla bla bla Bla bla bla Bla bla blaBla bla bla Bla bla bla Bla bla bla
Bla bla bla Bla bla bla Bla bla bla
Bla bla bla Bla bla bla Bla bla blaBla bla bla Bla bla bla Bla bla blaBla bla bla Bla bla bla Bla bla bla
Bla bla bla Bla bla bla Bla bla blaBla bla bla Bla bla bla Bla bla bla
Bla bla bla Bla bla bla Bla bla blaBla bla bla Bla bla bla Bla bla blaBla bla bla Bla bla bla Bla bla blaBla bla bla Bla bla bla Bla bla bla
</div>
</content>
</div>
</body>
<script language="javascript">
$(document).ready(function(){
$('#player').videre();
});
</script>
</html>
video/video4.html 0 → 100644
View file @ 5e821768
<html>
<body>
<div id="player" class="vid-wrapper videre-container mouse-entered" style="width: 100%;">
<div class="vid-html5">
<video src="https://vjs.zencdn.net/v/oceans.mp4?HD" id="html-player" style="width: 100%;"></video>
</div>
<div class="vid-toggle-layer"></div>
<div class="vid-shadow-layer"></div>
<div class="vid-controls-bottom flex align-center justify-center">
<div class="vid-controls-wrapper">
<div class="vid-controls-contents flex align-center justify-center">
<button class="vid-play-btn item"><i class="ion-ios-play flex align-center"></i></button>
<div class="vid-volume-container flex align-center">
<button class="vid-volume-control item"><i class="ion-android-volume-up flex align-center"></i></button>
<div id="vol-control" class="vid-volume-slider"></div>
</div>
<span class="vid-current-time"></span>
<div class="vid-progress">
<div class="progress-bg"></div>
<div class="progress-loaded"></div>
<div class="progress-fg"></div>
<div class="progress-hovertime"></div>
</div>
<span class="vid-duration"></span>
<button class="vid-request-fullscreen item"><i class="ion-android-expand flex align-center"></i></button>
</div>
</div>
</div>
<div class="vid-bottom-progress-bar">
<div class="progress-fg"></div>
</div>
</div>
<div class="description">
<h2>Josef Albers - Ehrung des Quadrats: Gelbe Zentrum (1954)</h2>
<p class="prose-big">Bla bla</p>
Bla bla bla Bla bla bla Bla bla bla Bla bla bla Bla bla bla Bla bla bla
Bla bla bla Bla bla bla Bla bla bla
Bla bla bla Bla bla bla Bla bla blaBla bla bla Bla bla bla Bla bla bla
Bla bla bla Bla bla bla Bla bla blaBla bla bla Bla bla bla Bla bla bla
Bla bla bla Bla bla bla Bla bla bla
Bla bla bla Bla bla bla Bla bla blaBla bla bla Bla bla bla Bla bla blaBla bla bla Bla bla bla Bla bla bla
Bla bla bla Bla bla bla Bla bla blaBla bla bla Bla bla bla Bla bla bla
Bla bla bla Bla bla bla Bla bla blaBla bla bla Bla bla bla Bla bla blaBla bla bla Bla bla bla Bla bla blaBla bla bla Bla bla bla Bla bla bla
</div>
</content>
</div>
</body>
<script language="javascript">
$(document).ready(function(){
$('#player').videre();
});
</script>
</html>
video/video5.html 0 → 100644
View file @ 5e821768
<html>
<body>
<div id="player" class="vid-wrapper videre-container mouse-entered" style="width: 100%;">
<div class="vid-html5">
<video src="https://vjs.zencdn.net/v/oceans.mp4?HD" id="html-player" style="width: 100%;"></video>
</div>
<div class="vid-toggle-layer"></div>
<div class="vid-shadow-layer"></div>
<div class="vid-controls-bottom flex align-center justify-center">
<div class="vid-controls-wrapper">
<div class="vid-controls-contents flex align-center justify-center">
<button class="vid-play-btn item"><i class="ion-ios-play flex align-center"></i></button>
<div class="vid-volume-container flex align-center">
<button class="vid-volume-control item"><i class="ion-android-volume-up flex align-center"></i></button>
<div id="vol-control" class="vid-volume-slider"></div>
</div>
<span class="vid-current-time"></span>
<div class="vid-progress">
<div class="progress-bg"></div>
<div class="progress-loaded"></div>
<div class="progress-fg"></div>
<div class="progress-hovertime"></div>
</div>
<span class="vid-duration"></span>
<button class="vid-request-fullscreen item"><i class="ion-android-expand flex align-center"></i></button>
</div>
</div>
</div>
<div class="vid-bottom-progress-bar">
<div class="progress-fg"></div>
</div>
</div>
<div class="description">
<h2>Josef Albers - Ehrung des Quadrats: Gelbe Zentrum (1954)</h2>
<p class="prose-big">Bla bla</p>
Bla bla bla Bla bla bla Bla bla bla Bla bla bla Bla bla bla Bla bla bla
Bla bla bla Bla bla bla Bla bla bla
Bla bla bla Bla bla bla Bla bla blaBla bla bla Bla bla bla Bla bla bla
Bla bla bla Bla bla bla Bla bla blaBla bla bla Bla bla bla Bla bla bla
Bla bla bla Bla bla bla Bla bla bla
Bla bla bla Bla bla bla Bla bla blaBla bla bla Bla bla bla Bla bla blaBla bla bla Bla bla bla Bla bla bla
Bla bla bla Bla bla bla Bla bla blaBla bla bla Bla bla bla Bla bla bla
Bla bla bla Bla bla bla Bla bla blaBla bla bla Bla bla bla Bla bla blaBla bla bla Bla bla bla Bla bla blaBla bla bla Bla bla bla Bla bla bla
</div>
</content>
</div>
</body>
<script language="javascript">
$(document).ready(function(){
$('#player').videre();
});
</script>
</html>
video/video6.html 0 → 100644
View file @ 5e821768
<html>
<body>
<div id="player" class="vid-wrapper videre-container mouse-entered" style="width: 100%;">
<div class="vid-html5">
<video src="https://vjs.zencdn.net/v/oceans.mp4?HD" id="html-player" style="width: 100%;"></video>
</div>
<div class="vid-toggle-layer"></div>
<div class="vid-shadow-layer"></div>
<div class="vid-controls-bottom flex align-center justify-center">
<div class="vid-controls-wrapper">
<div class="vid-controls-contents flex align-center justify-center">
<button class="vid-play-btn item"><i class="ion-ios-play flex align-center"></i></button>
<div class="vid-volume-container flex align-center">
<button class="vid-volume-control item"><i class="ion-android-volume-up flex align-center"></i></button>
<div id="vol-control" class="vid-volume-slider"></div>
</div>
<span class="vid-current-time"></span>
<div class="vid-progress">
<div class="progress-bg"></div>
<div class="progress-loaded"></div>
<div class="progress-fg"></div>
<div class="progress-hovertime"></div>
</div>
<span class="vid-duration"></span>
<button class="vid-request-fullscreen item"><i class="ion-android-expand flex align-center"></i></button>
</div>
</div>
</div>
<div class="vid-bottom-progress-bar">
<div class="progress-fg"></div>
</div>
</div>
<div class="description">
<h2>Josef Albers - Ehrung des Quadrats: Gelbe Zentrum (1954)</h2>
<p class="prose-big">Bla bla</p>
Bla bla bla Bla bla bla Bla bla bla Bla bla bla Bla bla bla Bla bla bla
Bla bla bla Bla bla bla Bla bla bla
Bla bla bla Bla bla bla Bla bla blaBla bla bla Bla bla bla Bla bla bla
Bla bla bla Bla bla bla Bla bla blaBla bla bla Bla bla bla Bla bla bla
Bla bla bla Bla bla bla Bla bla bla
Bla bla bla Bla bla bla Bla bla blaBla bla bla Bla bla bla Bla bla blaBla bla bla Bla bla bla Bla bla bla
Bla bla bla Bla bla bla Bla bla blaBla bla bla Bla bla bla Bla bla bla
Bla bla bla Bla bla bla Bla bla blaBla bla bla Bla bla bla Bla bla blaBla bla bla Bla bla bla Bla bla blaBla bla bla Bla bla bla Bla bla bla
</div>
</content>
</div>
</body>
<script language="javascript">
$(document).ready(function(){
$('#player').videre();
});
</script>
</html>
video/video7.html 0 → 100644
View file @ 5e821768
<html>
<body>
<div id="player" class="vid-wrapper videre-container mouse-entered" style="width: 100%;">
<div class="vid-html5">
<video src="https://vjs.zencdn.net/v/oceans.mp4?HD" id="html-player" style="width: 100%;"></video>
</div>
<div class="vid-toggle-layer"></div>
<div class="vid-shadow-layer"></div>
<div class="vid-controls-bottom flex align-center justify-center">
<div class="vid-controls-wrapper">
<div class="vid-controls-contents flex align-center justify-center">
<button class="vid-play-btn item"><i class="ion-ios-play flex align-center"></i></button>
<div class="vid-volume-container flex align-center">
<button class="vid-volume-control item"><i class="ion-android-volume-up flex align-center"></i></button>
<div id="vol-control" class="vid-volume-slider"></div>
</div>
<span class="vid-current-time"></span>
<div class="vid-progress">
<div class="progress-bg"></div>
<div class="progress-loaded"></div>
<div class="progress-fg"></div>
<div class="progress-hovertime"></div>
</div>
<span class="vid-duration"></span>
<button class="vid-request-fullscreen item"><i class="ion-android-expand flex align-center"></i></button>
</div>
</div>
</div>
<div class="vid-bottom-progress-bar">
<div class="progress-fg"></div>
</div>
</div>
<div class="description">
<h2>Josef Albers - Ehrung des Quadrats: Gelbe Zentrum (1954)</h2>
<p class="prose-big">Bla bla</p>
Bla bla bla Bla bla bla Bla bla bla Bla bla bla Bla bla bla Bla bla bla
Bla bla bla Bla bla bla Bla bla bla
Bla bla bla Bla bla bla Bla bla blaBla bla bla Bla bla bla Bla bla bla
Bla bla bla Bla bla bla Bla bla blaBla bla bla Bla bla bla Bla bla bla
Bla bla bla Bla bla bla Bla bla bla
Bla bla bla Bla bla bla Bla bla blaBla bla bla Bla bla bla Bla bla blaBla bla bla Bla bla bla Bla bla bla
Bla bla bla Bla bla bla Bla bla blaBla bla bla Bla bla bla Bla bla bla
Bla bla bla Bla bla bla Bla bla blaBla bla bla Bla bla bla Bla bla blaBla bla bla Bla bla bla Bla bla blaBla bla bla Bla bla bla Bla bla bla
</div>
</content>
</div>
</body>
<script language="javascript">
$(document).ready(function(){
$('#player').videre();
});
</script>
</html>
video/video8.html 0 → 100644
View file @ 5e821768
<html>
<body>
<div id="player" class="vid-wrapper videre-container mouse-entered" style="width: 100%;">
<div class="vid-html5">
<video src="https://vjs.zencdn.net/v/oceans.mp4?HD" id="html-player" style="width: 100%;"></video>
</div>
<div class="vid-toggle-layer"></div>
<div class="vid-shadow-layer"></div>
<div class="vid-controls-bottom flex align-center justify-center">
<div class="vid-controls-wrapper">
<div class="vid-controls-contents flex align-center justify-center">
<button class="vid-play-btn item"><i class="ion-ios-play flex align-center"></i></button>
<div class="vid-volume-container flex align-center">
<button class="vid-volume-control item"><i class="ion-android-volume-up flex align-center"></i></button>
<div id="vol-control" class="vid-volume-slider"></div>
</div>
<span class="vid-current-time"></span>
<div class="vid-progress">
<div class="progress-bg"></div>
<div class="progress-loaded"></div>
<div class="progress-fg"></div>
<div class="progress-hovertime"></div>
</div>
<span class="vid-duration"></span>
<button class="vid-request-fullscreen item"><i class="ion-android-expand flex align-center"></i></button>
</div>
</div>
</div>
<div class="vid-bottom-progress-bar">
<div class="progress-fg"></div>
</div>
</div>
<div class="description">
<h2>Josef Albers - Ehrung des Quadrats: Gelbe Zentrum (1954)</h2>
<p class="prose-big">Bla bla</p>
Bla bla bla Bla bla bla Bla bla bla Bla bla bla Bla bla bla Bla bla bla
Bla bla bla Bla bla bla Bla bla bla
Bla bla bla Bla bla bla Bla bla blaBla bla bla Bla bla bla Bla bla bla
Bla bla bla Bla bla bla Bla bla blaBla bla bla Bla bla bla Bla bla bla
Bla bla bla Bla bla bla Bla bla bla
Bla bla bla Bla bla bla Bla bla blaBla bla bla Bla bla bla Bla bla blaBla bla bla Bla bla bla Bla bla bla
Bla bla bla Bla bla bla Bla bla blaBla bla bla Bla bla bla Bla bla bla
Bla bla bla Bla bla bla Bla bla blaBla bla bla Bla bla bla Bla bla blaBla bla bla Bla bla bla Bla bla blaBla bla bla Bla bla bla Bla bla bla
</div>
</content>
</div>
</body>
<script language="javascript">
$(document).ready(function(){
$('#player').videre();
});
</script>
</html>
video/video9.html 0 → 100644
View file @ 5e821768
<html>
<body>
<div id="player" class="vid-wrapper videre-container mouse-entered" style="width: 100%;">
<div class="vid-html5">
<video src="https://vjs.zencdn.net/v/oceans.mp4?HD" id="html-player" style="width: 100%;"></video>
</div>
<div class="vid-toggle-layer"></div>
<div class="vid-shadow-layer"></div>
<div class="vid-controls-bottom flex align-center justify-center">
<div class="vid-controls-wrapper">
<div class="vid-controls-contents flex align-center justify-center">
<button class="vid-play-btn item"><i class="ion-ios-play flex align-center"></i></button>
<div class="vid-volume-container flex align-center">
<button class="vid-volume-control item"><i class="ion-android-volume-up flex align-center"></i></button>
<div id="vol-control" class="vid-volume-slider"></div>
</div>
<span class="vid-current-time"></span>
<div class="vid-progress">
<div class="progress-bg"></div>
<div class="progress-loaded"></div>
<div class="progress-fg"></div>
<div class="progress-hovertime"></div>
</div>
<span class="vid-duration"></span>
<button class="vid-request-fullscreen item"><i class="ion-android-expand flex align-center"></i></button>
</div>
</div>
</div>
<div class="vid-bottom-progress-bar">
<div class="progress-fg"></div>
</div>
</div>
<div class="description">
<h2>Josef Albers - Ehrung des Quadrats: Gelbe Zentrum (1954)</h2>
<p class="prose-big">Bla bla</p>
Bla bla bla Bla bla bla Bla bla bla Bla bla bla Bla bla bla Bla bla bla
Bla bla bla Bla bla bla Bla bla bla
Bla bla bla Bla bla bla Bla bla blaBla bla bla Bla bla bla Bla bla bla
Bla bla bla Bla bla bla Bla bla blaBla bla bla Bla bla bla Bla bla bla
Bla bla bla Bla bla bla Bla bla bla
Bla bla bla Bla bla bla Bla bla blaBla bla bla Bla bla bla Bla bla blaBla bla bla Bla bla bla Bla bla bla
Bla bla bla Bla bla bla Bla bla blaBla bla bla Bla bla bla Bla bla bla
Bla bla bla Bla bla bla Bla bla blaBla bla bla Bla bla bla Bla bla blaBla bla bla Bla bla bla Bla bla blaBla bla bla Bla bla bla Bla bla bla
</div>
</content>
</div>
</body>
<script language="javascript">
$(document).ready(function(){
$('#player').videre();
});
</script>
</html>
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