{"id":418,"date":"2013-04-02T21:52:19","date_gmt":"2013-04-02T20:52:19","guid":{"rendered":"http:\/\/powered-by-haiku.co.uk\/?page_id=418"},"modified":"2013-04-22T19:08:58","modified_gmt":"2013-04-22T18:08:58","slug":"multiple-quality-levels-jw5","status":"publish","type":"page","link":"https:\/\/powered-by-haiku.co.uk\/?page_id=418","title":{"rendered":"Multiple quality levels | JW5"},"content":{"rendered":"

\nSetting up multiple quality levels is as simple as providing additional sources for each file type, and including data-bitrate<\/code> and\/or data-width<\/code> parameters for each.<\/p>\n

Additionally for JW5 we need to specify a plugin<\/strong> that that will be used to switch between the different quality levels. This is done by including the div.jw-plugins<\/code> block with a specific div.jw-plugin<\/code> that has it’s data-type<\/code> set to hd-2<\/code><\/strike> – This is now auto-detected and the hd-2<\/code> plugin is added dynamically.<\/em><\/p>\n

<div class=\"jw-settings\" id=\"my_simple_settings\">
\n     <video id=\"my_simple_video\" poster=\"\/posters\/big-buck-bunny-preview.jpg\" preload=\"none\">
\n          <source src=\"\/videos\/mp4\/big-buck-bunny-360.mp4\" type=\"video\/mp4\" data-bitrate=\"555\" data-width=\"360\" \/>
\n          <source src=\"\/videos\/mp4\/big-buck-bunny-540.mp4\" type=\"video\/mp4\" data-bitrate=\"777\" data-width=\"540\" \/>
\n          <source src=\"\/videos\/mp4\/big-buck-bunny-720.mp4\" type=\"video\/mp4\" data-bitrate=\"999\" data-width=\"720\" \/>
\n     <\/video>
\n     <div class=\"jw-modes\">
\n          <div class=\"jw-mode\" data-type=\"html5\"><\/div>
\n          <div class=\"jw-mode\" data-type=\"flash\" data-src=\"\/jwplayer\/v5\/player.swf\"><\/div>
\n     <\/div>
\n     <div class=\"jw-plugins\">
\n          <div class=\"jw-plugin\" data-type=\"hd-2\"><\/div>
\n     <\/div><\/strike>
\n<\/div>
\n<\/code>\n<\/p>\n

In JW5 only the lowest and highest bitrate\/width combinations will be used to provide switching between SD and HD<\/strong><\/p>\n

Adding the above code to your page results in the following JW Player video with two-state quality switching:<\/p>\n

\n