Question

How can i create function onYouTubeIframeAPIReady from this example
https://developers.google.com/youtube/iframe_api_reference#Getting_Started in Dart? The API will call this function when the page has finished downloading the JavaScript for the player API.

Was it helpful?

Solution

Thank you, Günter! It's working in in Chrome.

<!DOCTYPE html>
<html>
<body>   
  <div id="player"></div>
  <script type="application/dart" src="ytube_iframe.dart"></script>
  <!-- for this next line to work, your pubspec.yaml file must have a dependency on 'browser' -->
  <script src="packages/browser/dart.js"></script> 
    <script src="packages/browser/interop.js"></script>
</body>
</html>

ytube_iframe.dart

import 'dart:html';
import 'dart:js' as js;
void main() {
  var tag = document.createElement('script');
  tag.src = "https://www.youtube.com/iframe_api";
  var firstScriptTag = document.getElementsByTagName('script')[0];
  firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);

  js.context['onYouTubeIframeAPIReady'] = onYouTubeIframeAPIReady;
  //js.context['onPlayerReady'] = onPlayerReady;
  //js.context['onPlayerStateChange'] = onPlayerStateChange;
}

var player; 
void onYouTubeIframeAPIReady() {
  var params = {
                'height': '390',
                'width': '640',
                'videoId': 'M7lc1UVf-VE',
                /*'events': {
                  'onReady': onPlayerReady,
                  'onStateChange': onPlayerStateChange
                }*/
              };
  var jsParams = new js.JsObject.jsify(params);
  player  = new js.JsObject(js.context['YT']['Player'], ['player',jsParams]);
}
Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top