Ignore:
Timestamp:
09/29/10 18:33:09 (3 years ago)
Author:
pablo
Message:

Updates to the documentation

File:
1 edited

Legend:

Unmodified
Added
Removed

  • trunk/fl5/doc/publishers/javascriptapi.rst

    r1342 r1344  
    1212--------------- 
    1313 
    14 To get a sense of the possibilities, here's a quick example that showcases how to control the player from the page: 
     14First, you'll need to upload the API library (*jwplayer.js*) to your web server.  We recommend putting it, along with *player.swf*, in a folder called **jwplayer** in the root of your site.  Once it's on your web server, add this bit of code to your HTML pages, in the *<head>* of your page: 
     15 
     16.. code-block:: html 
     17 
     18        <head> 
     19                <script type="text/javascript" src="/jwplayer/jwplayer.js"></script> 
     20        </head> 
     21 
     22To get a sense of the possibilities of what you can do with the API, here's a quick example that showcases how to control the player from the page: 
    1523 
    1624.. code-block:: html 
    … …  
    2028    <script type="text/javascript"> 
    2129        jwplayer("container").setup({ 
    22             flashplayer: "/jwplayer/jwplayer.swf", 
     30            flashplayer: "/jwplayer/player.swf", 
    2331            file: "/uploads/video.mp4", 
    2432            height: 270, 
    … …  
    4048    <script type="text/javascript"> 
    4149        jwplayer("container").setup({ 
    42             flashplayer: "/jwplayer/jwplayer.swf", 
     50            flashplayer: "/jwplayer/player.swf", 
    4351            file: "/uploads/video.mp4", 
    4452            height: 270, 
    … …  
    6169* Listen to events from a player. 
    6270 
     71Embedding with SWFObject 
     72++++++++++++++++++++++++ 
     73 
     74If you embed the player using SWFObject, rather than the built-in *setup()* function, you can still use the JavaScript API, although you'll need to wait for Flash to be loaded on the page before interacting with the API.  SWFObject 2.2 includes a callback function (in this example, named **flashLoaded**) which is executed when SWFObject has finished embedding Flash into the page.  Make sure you wait until this function is called before making any calls to the API. 
     75 
     76Here's a simple example of using the `SWFObject callback <http://code.google.com/p/swfobject/wiki/api>`_: 
     77 
     78.. code-block:: javascript 
     79 
     80        var flashvars = { file:"/videos/video.mp4" }; 
     81        var params = { allowfullscreen:"true", allowscriptaccess:"always" }; 
     82        var attributes = { id:"player", name:"player" }; 
     83         
     84        swfobject.embedSWF("/jwplayer/player.swf", "container", 320, 240, "9.0.115", "false",  
     85            flashvars, params, attributes, flashLoaded); 
     86 
     87        function flashLoaded(e) { 
     88                // e.ref is a reference to the Flash object.  We'll pass it to jwplayer() so the API knows where the player is. 
     89          
     90            // Add event listeners 
     91            jwplayer(e.ref).onReady(function() { alert("Player is ready"); }); 
     92            jwplayer(e.ref).onPlay(function() { alert("Player is playing"); }); 
     93 
     94            // Interact with the player 
     95            jwplayer(e.ref).play(); 
     96        } 
     97 
     98Embedding with an <object> or <embed> tag 
     99+++++++++++++++++++++++++++++++++++++++++ 
     100 
     101If you embed the player directly using an *<object>* or *<embed>* tag, simply pass your tag's id to the API when referencing the player: 
     102 
     103.. code-block:: html 
     104 
     105        <embed 
     106          id="player" 
     107          name="player" 
     108          src="/jwplayer/player.swf" 
     109          width="320" 
     110          height="240" 
     111          allowscriptaccess="always" 
     112          allowfullscreen="true" 
     113          flashvars="file=/videos/video.mp4" 
     114        /> 
     115         
     116        <script type="text/javascript"> 
     117            jwplayer("player").onReady(function() { alert("Player is ready"); }); 
     118            jwplayer("player").onPlay(function() { alert("Player is playing"); }); 
     119            jwplayer("player").play(); 
     120        </script> 
    63121 
    64122Selecting 
    … …  
    75133Only when you have multiple players on a page, you need to be more specific on which player you want to interact with. In that case, there are three ways to select a player: 
    76134 
    77 * With the *id* of the element you :ref:`instantiated <embed>` the player over: 
     135* With the *id* of the element you :ref:`instantiated <embedding>` the player over: 
    78136     
    79137    .. code-block:: javascript 
    … …  
    280338    ); 
    281339 
    282 Note that our :ref:`official embed method <embed>` contains a shortcut for assigning event listeners, directly in the embed code: 
     340Note that our :ref:`official embed method <embedding>` contains a shortcut for assigning event listeners, directly in the embed code: 
    283341 
    284342.. code-block:: html 
    … …  
    288346    <script type="text/javascript"> 
    289347        jwplayer("container").setup({ 
    290             flashplayer: "/jwplayer/jwplayer.swf", 
     348            flashplayer: "/jwplayer/player.swf", 
    291349            file: "/uploads/video.mp4", 
    292350            height: 270, 
Note: See TracChangeset for help on using the changeset viewer.