rudimentary attempt of implementing chromeless youtube player in meteor

chromelessyoutubemeteor

if (Meteor.isClient) {

   function updateHTML(elmId, value) {
        document.getElementById(elmId).innerHTML = value;
      }
      
      // This function is called when an error is thrown by the player
      function onPlayerError(errorCode) {
        alert("An error occured of type:" + errorCode);
      }
      
      // This function is called when the player changes state
      function onPlayerStateChange(newState) {
        updateHTML("playerState", newState);
      }
      
      // Display information about the current state of the player
      function updatePlayerInfo() {
        // Also check that at least one function exists since when IE unloads the
        // page, it will destroy the SWF before clearing the interval.
        if(ytplayer && ytplayer.getDuration) {
          updateHTML("videoDuration", ytplayer.getDuration());
          updateHTML("videoCurrentTime", ytplayer.getCurrentTime());
          updateHTML("bytesTotal", ytplayer.getVideoBytesTotal());
          updateHTML("startBytes", ytplayer.getVideoStartBytes());
          updateHTML("bytesLoaded", ytplayer.getVideoBytesLoaded());
          updateHTML("volume", ytplayer.getVolume());
        }
      }
      
      // Allow the user to set the volume from 0-100
      function setVideoVolume() {
        var volume = parseInt(document.getElementById("volumeSetting").value);
        if(isNaN(volume) || volume < 0 || volume > 100) {
          alert("Please enter a valid volume between 0 and 100.");
        }
        else if(ytplayer){
          ytplayer.setVolume(volume);
        }
      }
      
      function beginVideo() {
        if(ytplayer) {
          ytplayer.loadVideoById("xvLiWpBZ8ps");
        }
      }


      function playVideo() {
        if (ytplayer) {
          ytplayer.playVideo();
        }
      }
      
      function pauseVideo() {
        if (ytplayer) {
          ytplayer.pauseVideo();
        }
      }
      
      function muteVideo() {
        if(ytplayer) {
          ytplayer.mute();
        }
      }
      
      function unMuteVideo() {
        if(ytplayer) {
          ytplayer.unMute();
        }
      }
      
      
     
      
      // The "main method" of this sample. Called when someone clicks "Run".
      function loadPlayer() {
        // Lets Flash from another domain call JavaScript
        var params = { allowScriptAccess: "always",
                       scale: "exactFit"           };
        // The element id of the Flash embed
        var atts = { id: "ytPlayer" };
        // All of the magic handled by SWFObject (http://code.google.com/p/swfobject/)
        swfobject.embedSWF("http://www.youtube.com/apiplayer?" +
                           "modestbranding=1&enablejsapi=1&playerapiid=videoDiv", 
                           "videoDiv", "100%", "100%", "9", null, null, params, atts);
      }
      function _run() {
        loadPlayer();
      }

      google.setOnLoadCallback(_run);
 
  
  Template.hello.greeting = function () {
       return "Welcome to yt.";
  };
  Template.hello.rendered = function () {
 // This function is automatically called by the player once it loads
      function onYouTubePlayerReady(playerId) {
        ytplayer = document.getElementById("ytPlayer");
        // This causes the updatePlayerInfo function to be called every 250ms to
        // get fresh data from the player
        //setInterval(updatePlayerInfo, 250);
        updatePlayerInfo();
        ytplayer.addEventListener("onStateChange", "onPlayerStateChange");
        ytplayer.addEventListener("onError", "onPlayerError");
        //Load an initial video into the player
        
        
      }
  }
  Template.hello.events({
     'click .Load' : function () {
      beginVideo();
      },

      'click .Pause' : function () {
     pauseVideo();
      }
 });
}

if (Meteor.isServer) {
  Meteor.startup(function () {
    // code to run on server at startup
  });
}