{"id":617,"date":"2013-11-27T20:00:31","date_gmt":"2013-11-27T20:00:31","guid":{"rendered":"http:\/\/powered-by-haiku.co.uk\/?p=617"},"modified":"2013-12-20T09:49:24","modified_gmt":"2013-12-20T09:49:24","slug":"how-to-enable-video-captions-with-jw-player-6-when-viewing-on-mobile-ios7","status":"publish","type":"post","link":"http:\/\/powered-by-haiku.co.uk\/?p=617","title":{"rendered":"How to enable video captions with JW Player 6 when viewing on mobile iOS7"},"content":{"rendered":"

JW Player 6 doesn’t currently* support WebVTT captions \/ subtitles when playing video on mobile iOS7.<\/strong> * the current version being 6.7.4071<\/em><\/p>\n

Here’s how you can fix that…<\/strong><\/p>\n

1) Set up JW Player normally, including the tracks<\/code> block<\/a> where applicable:<\/p>\n

jwplayer(\"...\").setup({...});
\n<\/code><\/p>\n

2) Get a handle to the JW instance<\/p>\n

var jwp = jwplayer(\"...\");
\n<\/code><\/p>\n

3) Attach the following onPlay listener<\/p>\n

jwp.onPlay(function() {
\n  if(jwplayer.utils.isIOS()){
\n    \/* Get the video *\/
\n    var oVid = jwp.container.getElementsByTagName(\"video\")[0];
\n    if(oVid){
\n      \/* Remove existing tracks *\/
\n      var oTracks = oVid.getElementsByTagName(\"track\");
\n      if(oTracks){
\n        for(var tr=oTracks.length,tre=0; tr>=tre; tr--){
\n          if(oTracks[tr]) oVid.removeChild(oTracks[tr]);
\n        }
\n      }
\n      \/* Add this playlist item tracks *\/
\n      var oPLI = jwp.getPlaylistItem();
\n      if(oPLI && oPLI[\"tracks\"] && oPLI[\"tracks\"].length>0){
\n        for( var tr in oPLI[\"tracks\"]){
\n          var oTR = oPLI[\"tracks\"][tr];
\n          var oTrackTag = document.createElement(\"track\");
\n          for(var attr in oTR){
\n            var sAttr = (attr==\"file\"?\"src\":attr);
\n            if(attr!=\"default\"||(attr==\"default\" && oTR[attr]==true)) oTrackTag.setAttribute(sAttr,oTR[attr]);
\n          }
\n          oVid.appendChild(oTrackTag);
\n        }
\n      }
\n    }
\n  }
\n});
\n<\/code><\/p>\n

That’s it! Enjoy captioned video on your iPhone. <\/p>\n","protected":false},"excerpt":{"rendered":"

JW Player 6 doesn’t currently* support WebVTT captions \/ subtitles when playing video on mobile iOS7. * the current version being 6.7.4071 Here’s how you can fix that… 1) Set up JW Player normally, including the tracks block where applicable: jwplayer(“…”).setup({…}); 2) Get a handle to the JW instance var jwp = jwplayer(“…”); 3) Attach… Continue reading →<\/span><\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[10],"tags":[],"class_list":["post-617","post","type-post","status-publish","format-standard","hentry","category-jw-player"],"_links":{"self":[{"href":"http:\/\/powered-by-haiku.co.uk\/index.php?rest_route=\/wp\/v2\/posts\/617","targetHints":{"allow":["GET"]}}],"collection":[{"href":"http:\/\/powered-by-haiku.co.uk\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"http:\/\/powered-by-haiku.co.uk\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"http:\/\/powered-by-haiku.co.uk\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"http:\/\/powered-by-haiku.co.uk\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=617"}],"version-history":[{"count":9,"href":"http:\/\/powered-by-haiku.co.uk\/index.php?rest_route=\/wp\/v2\/posts\/617\/revisions"}],"predecessor-version":[{"id":626,"href":"http:\/\/powered-by-haiku.co.uk\/index.php?rest_route=\/wp\/v2\/posts\/617\/revisions\/626"}],"wp:attachment":[{"href":"http:\/\/powered-by-haiku.co.uk\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=617"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"http:\/\/powered-by-haiku.co.uk\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=617"},{"taxonomy":"post_tag","embeddable":true,"href":"http:\/\/powered-by-haiku.co.uk\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=617"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}