Search code examples
htmlembedmoodlesrcquicktime

Embed multiple videos into one embeded object


I'm working with Moodle to embed videos for an online class and I'm having trouble with the formats. I want to include close captions on the video and Apple Compressor does not seem to save captions to MP4 files. Therefore, I've started using .mov files instead of MP4s. Unfortunately, some students seem to have trouble viewing the .mov files. I was wondering if it would be possible to embed the .mov files and have the quicktime player default to the .mp4 if the .mov file didn't work.

I know this is possible with HTML5 videos, but unfortunately the current faculty wants to keep using the embedded QuickTime player. Here's what I have so far:

Is it possible to include two srcs somehow?

Thanks so much!


Solution

  • Maybe you could try to solve the problem with javascript. With this code, you can provide a link to change the source link to mp4:

    <script type="text/javascript">
        function fallback_to_mp4(video_id) {
            var video = document.getElementById(video_id);
            var mov_url = video.GetURL();
            var newsrc = mov_url.substr(0, file.lastIndexOf(".")) + ".mp4";
            video.SetURL(newsrc);
        }
    </script>
    
    <embed src="wrightwithcaptions.mov" type="video/mp4" autostart="false" 
        height="430" width="540" id="video1" enablejavascript="true" /> 
    
    <a href="javascript:fallback_to_mp4('video1');">
        Mp4 version
    </a>
    

    Or with this you could listen for error events and change the source to mp4 accordingly:

    <embed src="wrightwithcaptions.mov" type="video/mp4" autostart="false" 
        height="430" width="540" id="video1" enablejavascript="true" 
        postdomevents="true" /> 
    
    <script type="text/javascript">
        function fallback_to_mp4(video) {
            var mov_url = video.GetURL();
            var newsrc = mov_url.substr(0, file.lastIndexOf(".")) + ".mp4";
            video.SetURL(newsrc);
        }
        var video = document.getElementById("video1");
        video.addEventListener('qt_error', function() {
            fallback_to_mp4(video);
        };
    </script>
    

    I can't test the solutions now, because I'm on Linux (no quicktime, thanks apple). Anyway, here's the reference document for scripting with QuickTime: HTML Scripting Guide for QuickTime.