Video fond YouTube

index.html

@@ -51,7 +51,7 @@
     </nav>
 
     <header class="masthead">
-        <video id="masthead-video"></video>
+	<iframe src="https://www.youtube.com/embed/RX_VXNl1xvg?modestbranding=1&rel=0&html5=1&controls=0&showinfo=0&autoplay=1&loop=1&playlist=RX_VXNl1xvg" frameborder="0" allowfullscreen></iframe>
 
         <a class="btn btn-default btn-xl" href="#about">
             <i class="fa fa-angle-down fa-2x" aria-hidden="true"></i>
@@ -320,59 +320,10 @@
     <!-- Custom scripts for this template -->
     <script src="js/creative.min.js"></script>
     
-    <script src="https://cdn.dashjs.org/latest/dash.all.min.js"></script>
-    
     <script>
-        var masthead_video = document.getElementById("masthead-video");
         var video_button = document.getElementById("video-sound");
         var fullscreen_button = document.getElementById("fullscreen-video");
         
-        function masthead_video_mute(mute) {
-            player.setMute(mute);
-            if (mute) {
-                video_button.children[0].children[0].setAttribute("xlink:href", "/vector/sprite.svg#sound-off");
-            }
-            else {
-                video_button.children[0].children[0].setAttribute("xlink:href", "/vector/sprite.svg#sound-on");
-            }
-        }
-
-        video_button.onclick = function () {
-            if (masthead_video.muted) {
-                masthead_video_mute(false);
-            } else {
-                masthead_video_mute(true);
-            }
-        };
-        
-        function loopVideo(e)
-        {
-            console.log("EVENT RECEIVED: " + e.type);
-            player.seek(0);
-            player.play();
-        }
-        
-        function fullscreen(video) {
-            if (video.requestFullscreen) {
-            video.requestFullscreen();
-            } else if (video.mozRequestFullScreen) {
-            video.mozRequestFullScreen();
-            } else if (video.webkitRequestFullscreen) {
-            video.webkitRequestFullscreen();
-            }
-        }
-        
-        fullscreen_button.onclick = function () {
-            fullscreen(masthead_video);
-        };
-        
-        var url = "video/dash/1_Compilation_Graphique/1_Compilation_Graphique.mpd";
-        var player = dashjs.MediaPlayer().create();
-        player.getDebug().setLogToBrowserConsole(false);
-        player.initialize(document.querySelector("#masthead-video"), url, true);
-        player.on(dashjs.MediaPlayer.events.PLAYBACK_ENDED,loopVideo);
-        player.setMute(true);
-        
         var portfolio_videos = document.getElementsByClassName('video-portfolio');
         
         for (video_div of portfolio_videos) {
@@ -382,8 +333,6 @@
         
         var comment_header = "<hr><p>"
         
-        var prev_video_mute = true;
-
         $('#iframeModal').on('show.bs.modal', function (event) {
             var modal = $(this);
             var button = $(event.relatedTarget);
@@ -400,11 +349,6 @@
             
             if (youtube_id) {
                 
-                if (!masthead_video.muted) {
-                    prev_video_mute = false;
-                    masthead_video_mute(true);
-                }
-                
                 url = 'https://www.youtube.com/embed/' + youtube_id + "?modestbranding=1&rel=0&html5=1";
                 
                 if (options) {
@@ -416,11 +360,6 @@
                 
             } else if (vimeo_id) {
             
-                if (!masthead_video.muted) {
-                    prev_video_mute = false;
-                    masthead_video_mute(true);
-                }
-            
                 url = 'https://player.vimeo.com/video/' + vimeo_id;
                 
                 iframe.setAttribute("allowfullscreen", "");
@@ -445,10 +384,6 @@
         $('#iframeModal').on('hidden.bs.modal', function () {
             $(this).find('.modal-body iframe')[0].src = "";
             $(this).find('.modal-body .modal-comment')[0].innerHTML = "";
-            
-            if (!prev_video_mute) {
-                masthead_video_mute(false);
-            }
         });
 
     </script>

scss/_masthead.scss

@@ -38,6 +38,16 @@ header.masthead {
     .btn-xl {
         padding: .5rem 1rem;
     }
+
+    iframe {
+      position: absolute;
+      top: 0;
+      left: 0;
+      width: 100%;
+      height: 100%;
+      pointer-events: none;
+    }
+
     @media (min-width: 768px) {
         height: 100%;
         #video-sound {

video/dash/mpd_generate.sh

@@ -1,41 +0,0 @@
-#!/bin/bash
-
-file=$1
-option=$2
-
-if [[ -n "$file" ]]; then
-
-    name=${file%.*}
-    
-    if [[ -d ${name} ]]; then
-        case $option in
-            --force)
-                echo "Deleting ${name}/ ..."
-                rm -rf ${name}
-                ;;
-            *)
-                echo "Please use the --force option to overwrite existing data"
-                exit 1
-                ;;
-            esac
-    fi
-    
-    mkdir -p ${name}
-
-    ffmpeg -i ${file} -c:a aac -ac 2 -ab 128k -vn ${name}/${name}-audio.mp4 &
-
-    ffmpeg -i ${file} -s 1920x1080 -c:v libx264 -b:v 5500k -x264opts 'keyint=50:min-keyint=50:no-scenecut' -profile:v main -preset fast -movflags +faststart ${name}/${name}-1080.mp4 &
-    
-    ffmpeg -i ${file} -s 1280x720 -c:v libx264 -b:v 2500k -x264opts 'keyint=50:min-keyint=50:no-scenecut' -profile:v main -preset fast -movflags +faststart ${name}/${name}-720.mp4 &
-    
-    ffmpeg -i ${file} -s 960x540 -c:v libx264 -b:v 1400k -x264opts 'keyint=50:min-keyint=50:no-scenecut' -profile:v main -preset fast -movflags +faststart ${name}/${name}-540.mp4 &
-    
-    ffmpeg -i ${file} -s 640x360 -c:v libx264 -b:v 650k -x264opts 'keyint=50:min-keyint=50:no-scenecut' -profile:v main -preset fast -movflags +faststart ${name}/${name}-360.mp4 &
-
-    wait
-
-    MP4Box -dash 4000 -rap -bs-switching no -profile live -out ${name}/${name}.mpd ${name}/${name}-1080.mp4#video ${name}/${name}-720.mp4#video ${name}/${name}-540.mp4#video ${name}/${name}-360.mp4#video ${name}/${name}-audio.mp4#audio
-
-else
-    echo "./mpd_generate.sh INPUT"
-fi