Using a 'Watch in HD' link with the JW FLV Player

Sunday, 25 January 2009 00:00

Using a 'Watch in HD' link with the JW FLV Player to change YouTube video formats on the fly is possible, and I'll explain how in this article.

If you aren't familar with the NEW YouTube HD/HQ video formats, read my article Introducing the NEW HD/HQ YouTube Video Formats.

This article assumes you have already read Playing HD/HQ YouTube Videos using the JW FLV Player.

Below is a player with sample links to show you how the JW FLV Player can be controlled. Clicking 'Watch in Normal Quality' will play the Gran Torino movie trailer in Format 18 and in a 4:3 aspect ratio. Clicking 'Different Trailer' will play the Che movie trailer in Format 18 and in a 4:3 aspect ratio. Clicking 'Watch in HD' will play the current video (whether that be GranTorino or Che) in Format 22 (HD) and in a 16:9 aspect ratio.

Watch in Normal Quality
Watch in HD
Different Trailer

Below is the code that contols the JW FLV Player on this page. It will be a good starting place for you as you create and customize your own webpages.

        function deletePlayer(theWrapper, thePlaceholder, thePlayerId) {
            swfobject.removeSWF(thePlayerId);
            var tmp=document.getElementById(theWrapper);
            if (tmp) { tmp.innerHTML = "<div id='" + thePlaceholder + "'></div>"; }
        }

        function createPlayer(thePlaceholder, thePlayerId, theWidth, theHeight, theFile, theAutostart) {
      var flashvars =
      {
        'config':               '/embed/flvplayer_config.xml',
        'file':                 theFile,
        'autostart':            theAutostart

      };

      var params =
      {
        'allowscriptaccess':    'always',
        'allowfullscreen':      'true'
      };

      var attributes =
      {
        'id':                   'thePlayerId',
        'name':                 'thePlayerId'
      };

swfobject.embedSWF('/embed/player.swf', thePlaceholder, theWidth, theHeight, '9.0.124', false, flashvars, params, attributes);
}

      function initPlayer(theFile, theWidth, theHeight, theAutostart) {
            deletePlayer('wrapper1', 'placeholder1', 'player1');
            createPlayer('placeholder1', 'player1',
                    theWidth,
                    theHeight,
                    theFile,
                    theAutostart)
        }
// --></script>

<a href="javascript:initPlayer(encodeURIComponent('youtube_format18.php?v=t2BiE0bwC1M'), '396', '297', true);"><span style="color: #0000ff;">Watch in Normal Quality</span></a><br />

<a href="javascript:initPlayer((player.getConfig().file).replace ('18', '22'), '528', '297', true);"><span style="color: #0000ff;">Watch in HD</span></a><br />

<a href="javascript:initPlayer(encodeURIComponent('youtube_format18.php?v=nQes9Iz8jBU'), '396', '297', true);"><span style="color: #0000ff;">Different Trailer</span></a><br />

Please leave me a comment if you found this article useful or if you have any questions.

Comments (4)

...

Thanks for updating us with the nice information.

Flv Player , September 06, 2010 | url

...

well this blog is great i love reading your articles.,http://www.discountpandorastore.org.uk

Pandora Beads UK , March 21, 2012 | url

...

Christmas is probably the most special day of the year for children. One thing that makes it special is the popular tradition of Santa Claus. ,http://www.louisvuittons2012.com

Louis Vuitton Stores , April 07, 2012 | url

...

If you wish to be the best man, you must suffer the bitterest of the bitter.,http://www.belstaffleather.org.uk

Belstaff Motorcycle Clothing , April 26, 2012 | url