added video pages

5e821768 · Jonas Heinrich · 30a47e6f · 5e821768 · 5e821768 · 5e821768
Commit 5e821768 authored Feb 01, 2018 by Jonas Heinrich
--- a/css/videre.css
+++ b/css/videre.css
@@ -228,9 +228,3 @@ button {

 video::-webkit-media-controls {
  display: none !important; }
-
-video {
-  object-fit: cover;
-}
-
-/*# sourceMappingURL=videre.css.map */
--- a/js/map.js
+++ b/js/map.js
@@ -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');
  });

--- a/video/oceans.mp4
+++ b/video/oceans.mp4
--- a/video/video10.html
+++ b/video/video10.html
+<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>
--- a/video/video2.html
+++ b/video/video2.html
+<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>
--- a/video/video3.html
+++ b/video/video3.html
+<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>
--- a/video/video4.html
+++ b/video/video4.html
+<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>
--- a/video/video5.html
+++ b/video/video5.html
+<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>
--- a/video/video6.html
+++ b/video/video6.html
+<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>
--- a/video/video7.html
+++ b/video/video7.html
+<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>
--- a/video/video8.html
+++ b/video/video8.html
+<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>
--- a/video/video9.html
+++ b/video/video9.html
+<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>