Changeset 2362


Ignore:
Timestamp:
08/08/12 18:49:28 (10 months ago)
Author:
pablo
Message:

Adds dock API test

Location:
branches/jw6/test
Files:
1 edited
1 moved

Legend:

Unmodified
Added
Removed

  • branches/jw6/test/api-dock.html

    r2334 r2362  
    22<html> 
    33<head> 
    4  
    5     <title>Dock icon test page</title> 
     4    <title>Dock Icons</title> 
    65    <script type="text/javascript" src="../bin-debug/jwplayer.js"></script> 
    7  
    8           <style type="text/css"> 
    9                 .wrapper { 
    10              width: 720px; 
    11              height: 200px; 
    12              position: relative; 
    13                 } 
    14            
    15           </style> 
    16  
     6    <link type="text/css" rel="stylesheet" href="assets/style.css"  media="all" /> 
    177</head> 
    18  
    198<body> 
    209 
     10<h1>Dock Icons</h1> 
     11<div class="core">List of test devices</div> 
     12<p>This page tests adding and removing dock icons.</p> 
    2113 
    22   <h1>Dock Icons</h1> 
    23    
    24   <form id="form" onsubmit="init();return false;"> 
    25       skin: <select name="skin" onchange="init()"> 
    26         <option value="">default</option> 
    27         <option value="../../../skins/beelden/src/beelden.xml">beelden</option> 
    28         <option value="../../../skins/stormtrooper/stormtrooper.zip">stormtrooper</option> 
    29         <option value="../../../skins/glow/glow.zip">glow</option> 
    30         <option value="../../../skins/five/five.zip">five</option> 
    31         <option value="../../../tags/skins/snel/snel.zip">snel</option> 
    32         <option value="../../../tags/skins/stijl/stijl.zip">stijl</option> 
    33         <option value="../../../skins/bekle/src/bekle.xml" >bekle</option> 
    34         <option selected value="../../../skins/six/src/six.xml">six</option> 
    35       </select> 
    36           mode: <select name="mode" onchange="init()"> 
    37         <option selected value="">html5</option> 
    38         <option value="flash">flash</option> 
    39       </select> 
    40           <input type="submit" value="go" /> 
    41   </form> 
    42    
    43    
    44                 <div class="wrapper"> 
    45           <div id="player2"></div> 
    46         </div> 
     14<h2>Adding onReady</h2> 
    4715 
     16<div id="onready"></div> 
    4817 
    49     <script type="text/javascript"> 
    50     var form = document.getElementById("form"); 
    51             function init() { 
    52                 var pl = jwplayer("player2").setup({ 
    53                       skin: form.skin.options[form.skin.selectedIndex].value, 
    54                       playlist: [ 
    55                             { 
    56                               sources:[ 
    57                                     { file: 'http://content.bitsontherun.com/videos/nPripu9l-1ahmry41.xyz', type: "mp4"}, 
    58                                     { file: 'http://content.bitsontherun.com/videos/nPripu9l-1Lq5Mnwq.xyz', type: "webm" }                
    59                                   ], 
    60                                   image: 'http://content.bitsontherun.com/thumbs/gSzpo2wh-480.jpg', 
    61                                   description: "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse ipsum leo, facilisis non laoreet sed, laoreet id tortor. Sed in lectus id enim scelerisque dictum nec sit amet odio. Pellentesque eget nisl arcu, quis tristique nibh. Nunc quis est eget erat posuere congue. Maecenas et turpis id ipsum eleifend adipiscing id et purus. Curabitur pulvinar ultricies leo, a semper tellus tempus eu. Praesent mattis ipsum eu eros placerat sodales. Maecenas laoreet libero quis lorem lacinia sit amet consequat nunc accumsan. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Nunc venenatis, mi suscipit accumsan venenatis, ligula lacus malesuada nisl, vel congue est nibh ut dolor. Sed ut tellus ut diam consequat scelerisque at sit amet lacus. Nulla egestas vehicula neque, et commodo metus sollicitudin ut. Sed sit amet nunc vitae arcu tincidunt ornare.", 
    62                                   title: "Big Buck Bunny"  
    63                                 },{ 
    64                                   sources:[ 
    65                     { file: 'http://content.bitsontherun.com/videos/yj1shGJB-1ahmry41.mp4' },                     
    66                                         { file: 'http://content.bitsontherun.com/videos/yj1shGJB-1Lq5Mnwq.webm' }         
    67                               ], 
    68                                   image: 'http://content.bitsontherun.com/thumbs/yj1shGJB-480.jpg', 
    69                               duration: 52, 
    70                               title: "Sintel Trailer" 
    71                                 },{ 
    72                                   sources:[ 
    73                                         { file: 'http://content.bitsontherun.com/videos/123-1ahmry41.xyz', type: "mp4"}, 
    74                                         { file: 'http://content.bitsontherun.com/videos/123-1Lq5Mnwq.xyz', type: "webm" }                 
    75                                   ], 
    76                                   title: "Error test",  
    77                   description: "This item will cause a player error" 
    78                           }], 
    79                       primary: form.mode.options[form.mode.selectedIndex].value, 
    80                       repeat: "none", 
    81                 }); 
    82          
    83                 pl.onReady(function () { 
    84                         add(0); 
    85                         add(1); 
    86                         add(2); 
    87                 }); 
    88             } 
    89          
    90             function remove(idx) { 
    91                 switch (idx) { 
    92                 case 0: 
    93                         jwplayer().getPlugin("dock").removeButton("related"); 
    94                         break; 
    95                 case 1: 
    96                         jwplayer().getPlugin("dock").removeButton("sharing"); 
    97                         break; 
    98                 case 2: 
    99                         jwplayer().getPlugin("dock").removeButton("hd"); 
    100                         break; 
    101                 } 
    102             } 
    103          
    104             function add(idx) { 
    105                 switch (idx) { 
    106                 case 0: 
    107                         jwplayer().getPlugin("dock").addButton("/plugins/related/assets/icon.png", "Related", function () { alert("related clicked") }, "related"); 
    108                         break; 
    109                 case 1: 
    110                         jwplayer().getPlugin("dock").addButton("/plugins/sharing/assets/icon.png", "Sharing", function () { alert("sharing clicked") }, "sharing"); 
    111                         break; 
    112                 case 2: 
    113                         jwplayer().getPlugin("dock").addButton("/plugins/hd/assets/dock.png", "HD", function () { alert("hd clicked") }, "hd"); 
    114                         break; 
    115                 } 
    116             } 
    117          
    118             init(); 
    119     </script> 
    120      
    121    
     18<script type="text/javascript"> 
     19    jwplayer("onready").setup({ 
     20        file: 'http://content.bitsontherun.com/videos/3XnJSIm4-52qL9xLP.mp4', 
     21        image: 'http://content.bitsontherun.com/thumbs/3XnJSIm4-480.jpg', 
     22        height: 240, 
     23        width: 480, 
     24        events: { 
     25                onReady: function() { 
     26                        this.addButton("assets/both.png", "Button sucessfully added", function() { alert("Button clicked"); }, "button"); 
     27                } 
     28        } 
     29    }); 
     30</script> 
     31 
     32<table><tr> 
     33    <th></th><th>Action</th><th>Expected result(s)</th><th>Works?</th> 
     34</tr><tr> 
     35    <td class="both"></td> 
     36    <td>Load the player</td> 
     37    <td>Firefox, IE8: Player loads in Flash.  Otherwise, player loads in HTML5 mode</td> 
     38    <td class="check"></td> 
     39</tr><tr> 
     40    <td class="desktop"></td> 
     41    <td>Begin playing</td> 
     42    <td>Player controls become visible, including a dock icon.</td> 
     43    <td class="check"></td> 
     44</tr><tr> 
     45    <td class="desktop"></td> 
     46    <td>Mouse over dock icon</td> 
     47    <td>Label should appear underneath the dock icon.</td> 
     48    <td class="check"></td> 
     49</tr><tr> 
     50    <td class="desktop"></td> 
     51    <td>Click dock icon</td> 
     52    <td>An alert should appear saying "Button clicked".</td> 
     53    <td class="check"></td> 
     54</tr></table> 
     55 
     56<h2>Adding Later</h2> 
     57 
     58<div id="later"></div> 
     59<button onclick="laterClick();">Add a Button</button> 
     60 
     61<script type="text/javascript"> 
     62    jwplayer("later").setup({ 
     63        file: 'http://content.bitsontherun.com/videos/3XnJSIm4-52qL9xLP.mp4', 
     64        image: 'http://content.bitsontherun.com/thumbs/3XnJSIm4-480.jpg', 
     65        height: 240, 
     66        width: 480, 
     67    }); 
     68 
     69        function laterClick() { 
     70                jwplayer("later").addButton("assets/both.png", "Button sucessfully added", function() { alert("Button clicked"); }, "button"); 
     71        } 
     72 
     73</script> 
     74 
     75<table><tr> 
     76    <th></th><th>Action</th><th>Expected result(s)</th><th>Works?</th> 
     77</tr><tr> 
     78    <td class="both"></td> 
     79    <td>Load the player</td> 
     80    <td>Firefox, IE8: Player loads in Flash.  Otherwise, player loads in HTML5 mode</td> 
     81    <td class="check"></td> 
     82</tr><tr> 
     83    <td class="desktop"></td> 
     84    <td>Begin playing</td> 
     85    <td>Player controls become visible, no dock icon.</td> 
     86    <td class="check"></td> 
     87</tr><tr> 
     88    <td class="desktop"></td> 
     89    <td>Click the "Add a Button" button, then mouse over player</td> 
     90    <td>Dock icon is now visible.</td> 
     91    <td class="check"></td> 
     92</tr></table> 
     93 
     94<h2>Removing</h2> 
     95 
     96<div id="remove"></div> 
     97<button onclick="removeClick();">Remove the Button</button> 
     98 
     99<script type="text/javascript"> 
     100    jwplayer("remove").setup({ 
     101        file: 'http://content.bitsontherun.com/videos/3XnJSIm4-52qL9xLP.mp4', 
     102        image: 'http://content.bitsontherun.com/thumbs/3XnJSIm4-480.jpg', 
     103        height: 240, 
     104        width: 480, 
     105        events: { 
     106            onReady: function() { 
     107                        this.addButton("assets/both.png", "Button sucessfully added", function() { alert("Button clicked"); }, "button");             
     108                } 
     109        } 
     110    }); 
     111 
     112        function removeClick() { 
     113                jwplayer("remove").removeButton("button"); 
     114        } 
     115 
     116</script> 
     117 
     118<table><tr> 
     119    <th></th><th>Action</th><th>Expected result(s)</th><th>Works?</th> 
     120</tr><tr> 
     121    <td class="both"></td> 
     122    <td>Load the player</td> 
     123    <td>Firefox, IE8: Player loads in Flash.  Otherwise, player loads in HTML5 mode</td> 
     124    <td class="check"></td> 
     125</tr><tr> 
     126    <td class="desktop"></td> 
     127    <td>Begin playing</td> 
     128    <td>Player controls become visible, including a dock icon.</td> 
     129    <td class="check"></td> 
     130</tr><tr> 
     131    <td class="desktop"></td> 
     132    <td>Click "Remove the Button" button, then mouse over the player</td> 
     133    <td>The dock icon is no longer visible.</td> 
     134    <td class="check"></td> 
     135</tr></table> 
     136 
    122137</body> 
    123    
    124138</html> 

  • branches/jw6/test/index.html

    r2361 r2362  
    1414<h2>Basic</h2> 
    1515<ul> 
    16 <li><a href="mp4.html">MP4 video file</a></li> 
    17 <li><a href="aac.html">AAC audio file</a></li> 
    18 <li><a href="youtube.html">YouTube video</a></li> 
    19 <li><a href="rss.html">RSS feed</a></li> 
     16<li><a href="mp4.html">MP4 Video File</a></li> 
     17<li><a href="aac.html">AAC Audio File</a></li> 
     18<li><a href="youtube.html">YouTube Video</a></li> 
     19<li><a href="rss.html">RSS Feed</a></li> 
    2020</ul> 
    2121 
    2222<h2>Embedding</h2> 
    2323<ul> 
    24 <li><a href="extensions.html">File extensions</a></li> 
    25 <li><a href="media-errors.html">Media errors</a></li> 
     24<li><a href="extensions.html">File Extensions</a></li> 
     25<li><a href="media-errors.html">Media Errors</a></li> 
    2626<li><a href="primary-fallback.html">Primary and Fallback</a></li> 
    2727<li><a href="dimensions.html">Player Dimensions</a></li> 
    … …  
    3333<h2>Playlists</h2> 
    3434<ul> 
    35 <li><a href="multiple-sources.html">Multiple sources</a></li> 
     35<li><a href="multiple-sources.html">Multiple Sources</a></li> 
    3636<li><a href="listbar.html">Listbar</a></li> 
    3737</ul> 
    … …  
    4040<ul> 
    4141<li><a href="skins.html">Loading Skins</a></li> 
    42 <li><a href="skin_errors.html">Skins Errors</a></li> 
     42<li><a href="skin_errors.html">Skin Errors</a></li> 
    4343</ul> 
    4444 
    … …  
    5252<h2>Javascripting</h2> 
    5353<ul> 
    54 <li><a href="api-quality.html">Quality levels</a></li> 
     54<li><a href="api-quality.html">Quality Levels</a></li> 
     55<li><a href="api-dock.html">Dock Icons</a></li> 
    5556</ul> 
    5657 
Note: See TracChangeset for help on using the changeset viewer.