lunes, 13 de junio de 2011

Crear reproductor de You Tube Libre







Loading...

Player state: --
Current Time: --:-- | Duration: --:--
Bytes Total: -- | Start Bytes: -- | Bytes Loaded: --
Controls: Play | Pause | Mute | Unmute
 <- Set Volume | Volume: --
Código:


<!--
You are free to copy and use this sample in accordance with the terms of the
Apache license (http://www.apache.org/licenses/LICENSE-2.0.html)
-->

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <meta http-equiv="content-type" content="text/html; charset=utf-8"/>
    <title>YouTube Player API Sample</title>
    <style type="text/css">
      #videoDiv 
        margin-right3px;
      }
      #videoInfo {
        margin-left3px;
      }
    </style>
    <script src="http://www.google.com/jsapi" type="text/javascript"></script>
    <script type="text/javascript">
      google.load("swfobject""2.1");
    </script>    
    <script type="text/javascript">
      /*
       * Chromeless player has no controls.
       */
      
      // Update a particular HTML element with a new value
      function updateHTML(elmIdvalue{
        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 || volume 100{
          alert("Please enter a valid volume between 0 and 100.");
        }
        else if(ytplayer){
          ytplayer.setVolume(volume);
        }
      }
      
      function playVideo({
        if (ytplayer{
          ytplayer.playVideo();
        }
      }
      
      function pauseVideo({
        if (ytplayer{
          ytplayer.pauseVideo();
        }
      }
      
      function muteVideo({
        if(ytplayer{
          ytplayer.mute();
        }
      }
      
      function unMuteVideo({
        if(ytplayer{
          ytplayer.unMute();
        }
      }
      
      
      // 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(updatePlayerInfo250);
        updatePlayerInfo();
        ytplayer.addEventListener("onStateChange""onPlayerStateChange");
        ytplayer.addEventListener("onError""onPlayerError");
        //Load an initial video into the player
        ytplayer.cueVideoById("ylLzyHk54Z0");
      }
      
      // The "main method" of this sample. Called when someone clicks "Run".
      function loadPlayer({
        // Lets Flash from another domain call JavaScript
        var params allowScriptAccess"always" };
        // 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?" +
                           "&enablejsapi=1&playerapiid=player1"
                           "videoDiv""480""295""8"nullnullparamsatts);
      }
      function _run({
        loadPlayer();
      }
      google.setOnLoadCallback(_run);
    </script>
  </head>
  <body style="font-family: Arial;border: 0 none;">
    <table>
    <tr>
    <td><div id="videoDiv">Loading...</div></td>
    <td valign="top">
      <div id="videoInfo">
        <p>Player state: <span id="playerState">--</span></p>
        <p>Current Time: <span id="videoCurrentTime">--:--</span| Duration: <span id="videoDuration">--:--</span></p>
        <p>Bytes Total: <span id="bytesTotal">--</span| Start Bytes: <span id="startBytes">--</span| Bytes Loaded: <span id="bytesLoaded">--</span></p>
        <p>Controls: <href="javascript:void(0);" onclick="playVideo();">Play</a<href="javascript:void(0);" onclick="pauseVideo();">Pause</a<href="javascript:void(0);" onclick="muteVideo();">Mute</a<href="javascript:void(0);" onclick="unMuteVideo();">Unmute</a></p>
        <p><input id="volumeSetting" type="text" size="3" />&nbsp;<href="javascript:void(0)" onclick="setVideoVolume();">&lt;- Set Volume</a| Volume: <span id="volume">--</span></p>
      </div>
    </td></tr>
    </table>
  </body>
</html>


PARA PODER EDITAR ESTE CÓDIGO CONSULTA ESTA PÁGINA:
Google,inc.
Fuente|Google,INC.

No hay comentarios: