Premier test dash mpd

Dockerfile

@@ -1,9 +1,18 @@
 FROM nginx:alpine
 RUN sed -i 's/#gzip/gzip/g' /etc/nginx/nginx.conf && \
     sed -i '/gzip *on/ a gzip_types text/css application/javascript image/svg+xml;' /etc/nginx/nginx.conf && \
-    apk add --no-cache sassc nodejs && \
-    npm install -g svg-sprite-generator
+    apk add --no-cache sassc nodejs build-base ffmpeg git coreutils bash && \
+    npm install -g svg-sprite-generator && \
+    
+    git clone https://github.com/gpac/gpac.git && \
+    cd gpac && \
+    ./configure --static-mp4box --use-zlib=no && \
+    make && \
+    make install
+
 COPY . /usr/share/nginx/html
 WORKDIR /usr/share/nginx/html
 RUN sassc -m -t compressed scss/creative.scss css/creative.css && \
-    svg-sprite-generate -d vector/ -o vector/sprite.svg
+    svg-sprite-generate -d vector/ -o vector/sprite.svg && \
+    cd video && \
+    ./mpd_generate.sh 1_Compilation_Graphique.webm

index.html

@@ -64,9 +64,7 @@
     </nav>
 
     <header class="masthead">
-        <video id="masthead-video" autoplay loop muted>
-            <source src="video/1_Compilation_Graphique.webm" type="video/webm">
-        </video>
+        <video id="masthead-video" loop></video>
 
         <a class="btn btn-default btn-xl" href="#about">
             <i class="fa fa-angle-down fa-2x" aria-hidden="true"></i>
@@ -191,6 +189,8 @@
     <!-- Custom scripts for this template -->
     <script src="js/creative.min.js"></script>
     
+    <script src="http://cdn.dashjs.org/latest/dash.all.min.js"></script>
+    
     <script>
         var masthead_video = document.getElementById("masthead-video");
         var video_button = document.getElementById("video-sound");
@@ -205,6 +205,12 @@
             }
         };
         
+        var url = "video/1_Compilation_Graphique/1_Compilation_Graphique.mpd";
+        var player = dashjs.MediaPlayer().create();
+        player.initialize(document.querySelector("#masthead-video"), url, true);
+        player.setFastSwitchEnabled(true);
+        player.setMute(true);
+        
         var portfolio_videos = document.getElementsByClassName('video-portfolio');
         
         for (video_div of portfolio_videos) {