Changeset 1293


Ignore:
Timestamp:
09/20/10 07:19:11 (3 years ago)
Author:
jeroen
Message:

2.0 version of captions plugin (jw5 API)

Location:
plugins/captions/v5
Files:
39 added
23 deleted
4 edited
6 copied
1 moved

Legend:

Unmodified
Added
Removed
  • plugins/captions/v5/build/build.sh

    r1205 r1293  
    77echo "Compiling with MXMLC..." 
    88 
    9 $FLEXPATH/bin/mxmlc ../src/com/longtailvideo/plugins/qualitymonitor/QualityMonitor.as -sp ../src -o ../qualitymonitor.swf -library-path+=../lib -load-externs=../lib/jwplayer-5-classes.xml -use-network=false -optimize=true -incremental=false 
     9$FLEXPATH/bin/mxmlc ../src/com/longtailvideo/plugins/captions/Captions.as -sp ../src -o ../captions.swf -library-path+=../lib -load-externs=../lib/jwplayer-5-classes.xml -use-network=false -optimize=true -incremental=false 
    1010 
    11 # $FLEXPATH/bin/compc -source-path ../src -output ../qualitymonitor.swc -compiler.library-path $FLEXPATH/frameworks/libs -compiler.library-path ../lib -include-classes com.longtailvideo.plugins.qualitymonitor.QualityMonitor -link-report='../qualitymonitor-classes.xml' 
     11# $FLEXPATH/bin/compc -source-path ../src -output ../captions.swc -compiler.library-path $FLEXPATH/frameworks/libs -compiler.library-path ../lib -include-classes com.longtailvideo.plugins.captions.Captions -link-report='../captions-classes.xml' 
  • plugins/captions/v5/captions.xml

    r907 r1293  
    1818                </flashvar> 
    1919                <flashvar> 
    20                         <name>callback</name> 
    21                         <default></default> 
    22                         <description>Name of a javscript method the captions can be pinged to.</description> 
    23                 </flashvar> 
    24                 <flashvar> 
    2520                        <name>file</name> 
    2621                        <default></default> 
    2722                        <description>Location of the captions in (TimedText or SRT format) to display.</description> 
     23                </flashvar> 
     24                <flashvar> 
     25                        <name>fontsize</name> 
     26                        <default>14</default> 
     27                        <description> 
     28                                Base fontsize of the captions, correlating to 80 characters per line. 
     29                                Increase this for small players, decrease this for lengthy texts. 
     30                        </description> 
    2831                </flashvar> 
    2932                <flashvar> 
  • plugins/captions/v5/doc/guides/conf.py

    r1260 r1293  
    2626 
    2727# General information about the project. 
    28 project = 'JW Player Qualitymonitor Plugin' 
     28project = 'JW Player Captions Plugin' 
    2929copyright = 'LongTail Video' 
    3030 
     
    6363 
    6464# Output file base name for HTML help builder. 
    65 htmlhelp_basename = 'Qualitymonitor' 
     65htmlhelp_basename = 'Captions' 
    6666 
    6767 
     
    7777# (source start file, target name, title, author, documentclass [howto/manual]). 
    7878latex_documents = [ 
    79   ('index','Qualitymonitor.tex','JW Player Qualitymonitor Plugin','www.longtailvideo.com','howto',False) 
     79  ('index','Captions.tex','JW Player Captions Plugin','www.longtailvideo.com','howto',False) 
    8080] 
    8181 
  • plugins/captions/v5/doc/guides/index.rst

    r1260 r1293  
    1 Qualitymonitor plugin 
    2 ===================== 
     1=============== 
     2Captions plugin 
     3=============== 
    34 
    45.. toctree:: 
  • plugins/captions/v5/doc/guides/reference.rst

    r1260 r1293  
    22============ 
    33 
    4 The Qualitymonitor plugin for the JW Player is used to monitor the status of the bitrate switching / dynamic streaming functionalty of the player. This functionality is triggered by loading multiple quality levels of one video into the player. It will then monitor certain quality metrics and play the  optimal stream is served for every viewer. 
    5  
    6 For more info about this functionality, please refer to the dedicated sections in the HTTP resp. RTMP streaming guides: 
    7  
    8 *  `HTTP bitrate switching <http://www.longtailvideo.com/support/jw-player/jw-player-for-flash-v5/12534/video-delivery-http-pseudo-streaming#bitrateswitching>`_  
    9 * `RTMP dynamic streaming <http://www.longtailvideo.com/support/jw-player/jw-player-for-flash-v5/12535/video-delivery-rtmp-streaming#dynamicstreaming>`_ functionality of the player. 
    10  
    11 Screenshot 
    12 ========== 
    13  
    14 Here's a screenshot of a JW Player with the qualitymonitor plugin: 
    15  
    16  .. image:: ../assets/qualitymonitor.png 
    17     :alt: Skinning examples. 
    18      
    19  
    20 The plugin consists of two sections. The biggest one is the overlay at the top of the video that lists and charts the current quality metrics. Additionally, the plugin contains a small messaging area in the middle of the screen, for printing player messages that relate to the video quality. 
    21  
    22  
    23 Metrics 
    24 ======= 
    25  
    26 The Qualitymonitor plugin monitors the following metrics: 
    27  
    28 * The **bandwidth** of the current connection, in kilobits per second (green). 
    29 * The number of **frames dropped** per second (red). 
    30 * The **width** of the video screen (blue). 
    31 * The currently playing **quality level** (white). The required width and bandwidth of this level is shown between parentheses. 
    32  
    33 Messages 
    34 -------- 
    35  
    36 In addition to these four metrics, the plugin displays two quality level related messages in the middle of the screen: 
    37  
    38 * The completion of a smooth transition for `RTMP dynamic streaming <http://www.longtailvideo.com/support/jw-player/jw-player-for-flash-v5/12535/video-delivery-rtmp-streaming#dynamicstreaming>`_ (in green text). 
    39 * The blacklisting and un-blacklisting of a quality level as a result of too many framedrops (in red text). 
    40  
    41 .. note:: 
    42  
    43   The framedrop detection and resulting (un)blacklisting of levels is only supported in JW Player 5.3+. For JW Player 5.0, 5.1 and 5.2, the framedrop chart will simply remain at 0. 
    44  
     4The Captions plugin for JW Player supports the display of a closed captions or foreign language subtitle track with audio or video files. More creative use cases are karaoke, or the displaying of timed comments or footnotes with the video. 
     5 
     6Captions are read from an external file in either the W3C recommended DFXP (TimedText) XML format or in the SubRip Text plain-text format. Alternatively, the Captions plugin can display captions embedded into MP4 files. 
     7 
     8The plugin supports playlists and can be skinned using the JW Player PNG skinning model. 
     9 
     10 
     11 
     12.. _options: 
    4513 
    4614Configuration Options 
    4715===================== 
    4816 
    49 Embedding the qualitymonitor plugin is a matter of setting amending its name to the **plugins** player option. The  plugin contains no configuration options itself. 
    50  
    51 Here is a basic embed code example of a player using the qualitymonitor plugin. This example uses the SWFObject 2.0 embedding script: 
     17Like the `JW Player overall <http://www.longtailvideo.com/support/jw-player/jw-player-for-flash-v5/12536/configuration-options>`_, the Captions plugin can be configured with options set in the embed code. The following configuration options (flashvars) are available: 
     18 
     19.. describe:: captions.back 
     20 
     21   When set to **true**, a semitransparant black background is drawn below the captions. This background makes the captions more readeable (nice for small texts), but does set the captions more apart from the video. 
     22    
     23   By default, this black background is not shown. Instead, the player renders a thin black outline around the captions, similar to TV / DVD captions. 
     24 
     25.. describe:: captions.file 
     26 
     27   Location of the captions file(s) to display. Should be the URL to a valid :ref:`DFXP <dfxp>` or :ref:`SRT <srt>` captions file.  
     28    
     29   If your captions are embedded in your MP4 videos, or if you use a playlist, this option is not needed. The Captions plugin will automatically load and display captions found in either the video metadata or playlist contents. 
     30    
     31   .. note:: 
     32    
     33      If your captions file(s) are located at another webserver than your JW Player (*player.swf*), you need to place a **crossdomain.xml** file in the root of that webserver. Without a *crossdomain.xml*, the Flash plugin will refuse to load the captions for security reasons. More info can be found `in this reference <http://www.longtailvideo.com/support/jw-player/jw-player-for-flash-v5/12541/crossdomain-file-loading-restrictions>`_. 
     34 
     35.. describe:: captions.fontsize 
     36 
     37   The base size of the captions text in pixels. Is **14** by default. This fits about 80 characters per line, just like with TV / DVD. The fontsize can be overridden with this option, but also with styling rules embedded in a  :ref:`DFXP <dfxp>` or :ref:`SRT <srt>` captions file. 
     38 
     39.. describe:: captions.state 
     40 
     41   Describes whether to show the captions on startup or not. The default is **true** (captions are shown). 
     42    
     43   .. note:: 
     44    
     45      The *state* option is also saved in a cookie. When a user disables the captions on one video, they will be disabled by default on subsequent videos he watches on the same site. The configuration option overrides the cookie. 
     46 
     47 
     48Dock Option 
     49----------- 
     50 
     51One option for `the player itself <http://www.longtailvideo.com/support/jw-player/jw-player-for-flash-v5/12536/configuration-options>`_ greatly influences the interface of the Captions plugin. This option is called **dock** and can be set to either *true* (the default) or *false*. 
     52 
     53* When set *true*, the button to show/hide captions is displayed in the *dock*, an area in the top right of the display. 
     54* When set *false* the button to show/hide captions is displayed in the controlbar, usually at the right side, before the mute button (this can be set in the skin). 
     55 
     56Dock buttons are larger than controlbar buttons, which allows for clearer graphics to display. Dock buttons automatically fade out after a few seconds of playback. 
     57 
     58Examples 
     59-------- 
     60 
     61Here is an example embed code of a player using the captions plugin. This example uses the `SWFObject 2.0 <http://code.google.com/p/swfobject/>`_ embedding script: 
    5262 
    5363.. code-block:: html 
     
    5767   <script type="text/javascript"> 
    5868     swfobject.embedSWF("player.swf","container","480","270","9.0.115","false",{ 
    59        file: "/static/dynamic_stream.xml", 
    60        plugins: "qualitymonitor" 
     69       file: "/static/video.mp4", 
     70       plugins: "captions", 
     71      "captions.file": "/static/captions.xml" 
    6172     }); 
    6273   </script> 
    6374 
     75Here is a second embed code, in which the *dock* is disabled (showing a controlbar button) and the *captions.back* is enabled (showing the black background): 
     76 
     77.. code-block:: html 
     78 
     79   <p id="container">The player will be placed here</p> 
     80    
     81   <script type="text/javascript"> 
     82     swfobject.embedSWF("player.swf","container","480","270","9.0.115","false",{ 
     83       file: "/static/video.mp4", 
     84       plugins: "captions", 
     85      "captions.back": true, 
     86      "captions.file": "/static/captions.xml", 
     87      dock: false 
     88     }); 
     89   </script> 
     90 
     91Here's a screenshot of both examples: 
     92 
     93.. image:: ../assets/examples.png 
     94        :alt: Captions example. 
     95 
     96.. note:: 
     97 
     98   The dock button will automatically fade away after 3 seconds of playback. 
     99 
     100 
     101 
     102 
     103Supported Formats 
     104================= 
     105 
     106The plugin supports two distinct text formats for loading the captions. Additionally, the plugin can display texttracks embedded in MP4 files. 
     107 
     108A great, easy to use tool for creating subtitles is `Subtitle Horse <http://www.subtitle-horse.com/>`_. It's an online editor that allows you to *live* insert captions into your video. The captions can be exported to both SRT and DFXP. It is also possible to edit already existing SRT or DFXP files ánd the tool can be downloaded, e.g. for inclusion in your own CMS. 
     109 
     110 
     111.. _dfxp: 
     112 
     113W3C TimedText (DFXP) 
     114-------------------- 
     115 
     116The `W3C TimedText format <http://www.w3.org/TR/2010/PR-ttaf1-dfxp-20100914/>`_ is an XML format for storing closed captions or subtitles. Another name for this format is DFXP (Distribution Format Exchange Profile). Here is an example: 
     117 
     118.. code-block:: xml 
     119 
     120   <tt xmlns="http://www.w3.org/2006/10/ttaf1"> 
     121     <body> 
     122       <div> 
     123         <p begin="00:00:08" end="00:00:10">- Nothing is going on.</p> 
     124         <p begin="00:00:10.5" end="00:00:12.5">You liar!</p> 
     125         <p begin="00:00:13.5" end="00:00:15">Are you?</p> 
     126         <p begin="00:00:17" end="00:00:20">Violet, please!<br/>- I am not your babe!</p> 
     127         <p begin="00:00:34" end="00:00:36">Vi, please.<br/>- Leave me alone!</p> 
     128       </div> 
     129     </body> 
     130   </tt> 
     131 
     132The *<br/>* tags inside the paragraphs identify linebreaks in the captions. With the default fontsize, about 80 characters fit on a single line. This is similar to TV / DVD standards. 
     133 
     134Though the format supports multiple languages (by using multiple *<div lang='xx'>* elements), only one language/div is supported by the Captions plugin for now. 
     135 
     136.. note:: 
     137 
     138   Your DFXP files should use UTF8 encoding in order to correctly display special characters (accents, but also Chinese or Hebrew). 
     139 
     140Styling 
     141^^^^^^^ 
     142 
     143TimedText files can contain directions for styling the captions. These can be inserted in two ways, both supported by the Captions plugin: 
     144 
     145* The *<tt>* element can contain a *<head>* tag with multiple style elements. These styles are all given an ID. The individual pragraphs in the *<body>* can be linked to the style rules using the *<p style="xx">* attribute. 
     146* Each paragraph can contain *<span tts:xxx="yyy">* elements, to only style certain text snippets. 
     147 
     148The following style rules are supported by the Captions plugin: 
     149 
     150* **color**, e.g. *<span tts:color="#ffcc00">hello</span>*. 
     151* **fontFamily**, e.g. *<span tts:fontFamily="Arial, sans-serif">hello</span>*. 
     152* **fontSize**, e.g. *<span tts:fontSize="20">hello</span>*. 
     153* **fontStyle**, e.g. *<span tts:fontStyle="italic">hello</span>*. 
     154* **fontWeight**, e.g. *<span tts:fontWeight="bold">hello</span>*. 
     155* **textDecoration**, e.g. *<span tts:textDecoration="underline">hello</span>*. 
     156 
     157Here is the example DFXP file again, this time with styling rules in both the head and in inline spans. Don't forget the additional namespace declaration for the *tts* elements: 
     158 
     159.. code-block:: xml 
     160 
     161   <tt xmlns="http://www.w3.org/2006/10/ttaf1" xmlns:tts="http://www.w3.org/2006/04/ttaf1#styling"> 
     162     <head> 
     163      <styling> 
     164         <style id="normal" tts:fontSize="15" /> 
     165         <style id="yellow" tts:fontSize="15" tts:color="#FFFF00" /> 
     166         <style id="bigred" tts:color="#FF0000" tts:textDecoration="underline" tts:fontSize="20" /> 
     167      </styling> 
     168     </head> 
     169     <body> 
     170       <div> 
     171         <p begin="00:00:08" end="00:00:10" style="normal">- Nothing is going on.</p> 
     172         <p begin="00:00:10.5" end="00:00:12.5" style="normal"> 
     173            You <span tts:fontSize="+10">liar</span>! 
     174         </p> 
     175         <p begin="00:00:13.5" end="00:00:15" style="yellow">Are you?</p> 
     176         <p begin="00:00:17" end="00:00:20" style="bigred"> 
     177            Violet, please!<br/>- I am <span tts:fontSize="30">not</span> your babe! 
     178         </p> 
     179         <p begin="00:00:24" end="00:00:29" style="normal"> 
     180            You <span tts:fontFamily="Times, serif">stupid cow</span>,<br/> 
     181            look what you gone and done now, ay. 
     182         </p> 
     183       </div> 
     184     </body> 
     185   </tt> 
     186 
     187.. note:: 
     188 
     189   The captions plugin does not support either a *<span>* in *<span>* or a *<br/>* in *<span>* construction inside paragraphs. This would make the parsing of texts needlessly complex. 
     190 
     191.. note:: 
     192 
     193   Fontsizes can be set both with absolute (*<font size="15">*) and with relative (*<font size="+5">*) values. 
     194 
     195.. _srt: 
     196 
     197SubRip (SRT) 
     198------------ 
     199 
     200The `SubRip captions format <http://en.wikipedia.org/wiki/SubRip>`_ uses plain text files. Here's an example again: 
     201 
     202.. code-block:: text 
     203 
     204   1 
     205   00:00:08,000 --> 00:00:10,000 
     206   Nothing is going on. 
     207    
     208   2 
     209   00:00:10,500 --> 00:00:12,500 
     210   Violet, please! 
     211   - I am not your babe! 
     212    
     213   3 
     214   00:00:17,000 --> 00:00:20,000 
     215   You stupid cow, 
     216   look what you gone and done now, ay. 
     217 
     218The formatting is easy to read, but also easy to break, especially in the timecode lines. Make sure to use the correct delimiters. 
     219 
     220A double linebreak with enumeration is used to distinct between caption entries. Single linebreaks can be used to add breaks in the captions themselves. We recommend you stick to about 80 characters per line. This looks good with a default setup of the captions plugin. It is also the standard for TV / DVD setups. 
     221 
     222.. note::  
     223 
     224   Your SRT files should use UTF8 encoding in order to correctly display special characters (accents, but also Chinese or Hebrew). 
     225 
     226Styling 
     227^^^^^^^ 
     228 
     229The SRT format does not support any styling by itself. The Captions plugin does support styling though, by using a few basic HTML tags. In effect, the same set of styles as with :ref:`DFXP <dfxp>` is supported: 
     230 
     231* *<b>* (bold), *<i>* (italic) and *<u>* (underline) 
     232* *<font color="#ff0000" face="Courier, monospace" size="+2">* (font style) 
     233 
     234Here is the same SRT example, this time with a number of styling tags: 
     235 
     236.. code-block:: text 
     237 
     238   1 
     239   00:00:08,000 --> 00:00:10,000 
     240   <b>Nothing</b> is going on. 
     241    
     242   2 
     243   00:00:10,500 --> 00:00:12,500 
     244   Violet, <i>please</i>! 
     245   - I am <font face="Courier, monospace" size="+10" color="#FF0000">not</font> your babe! 
     246 
     247   3 
     248   00:00:17,000 --> 00:00:20,000 
     249   <font color="#00FF00">You <i><u>stupid cow</u></i>, 
     250   <b>look</b> what you gone and done now, ay.</font> 
     251 
     252.. note:: 
     253 
     254   Fontsizes can be set both with absolute (*<font size="15">*) and with relative (*<font size="+5">*) values. 
     255 
     256 
     257 
     258MPEG-4 Timed Text 
     259----------------- 
     260 
     261The MP4 media container has the ability to `embed timed text tracks <http://en.wikipedia.org/wiki/MPEG-4_Part_17>`_, in addition to e.g. a video and an audio track. This text data, often referred to as MPEG-4 Timed Text, is automatically picked up and displayed by the Captions plugin. 
     262 
     263The Captions plugin ignores the *trackid* of a Timed Text track. In other words, the plugin only supports a single text track, since all incoming textdata is simply printed in the captions area. 
     264 
     265Since MPEG-4 Timed Text is a plain-text format, no styling options are supported (except the *captions.fontsize* and *captions.back* :ref:`configuration options <options>`). 
     266 
     267.. note:: 
     268 
     269   There is little support for displaying MPEG-4 Timed Text across media players. Another player supporting this is the Quicktime player built into Apple's iOS (iPod/iPhone/iPad).  
     270 
     271Handbrake 
     272^^^^^^^^^ 
     273 
     274A great tool for embedding captions in MP4 files is `Handbrake <http://handbrake.fr/>`_. This free, cross-platform encoding tool can: 
     275 
     276* Embed captions from external SRT files into your transcodes. 
     277* Migrate captions from DVDs it rips into your transcodes. 
     278 
     279.. note::  
     280 
     281   Handbrake's `documentation <http://trac.handbrake.fr/wiki/Subtitles>`_ uses the term *subtitles* instead of *captions*. 
     282 
     283 
     284 
     285 
     286Playlist support 
     287================ 
     288 
     289Captions can be assigned to one or more videos in a playlist. You can mix SRT, TT and MPEG-4 captions with videos that have no captions in a single feed. Since none of the XML playlist formats define elements for linking to captions files, the captions should be set using the `JWPlayer XML namespace <http://www.longtailvideo.com/support/jw-player/jw-player-for-flash-v5/12537/xml-playlist-support>`_. In practice, the namespace is enabled by: 
     290 
     291* Setting an **xmlns:jwplayer** attribute in the main XML tag. 
     292* Prefixing the XML elements with **jwplayer:**, e.g. *<jwplayer:sharing.code>*. 
     293 
     294Example 
     295------- 
     296 
     297Here is an example embed code for captions with a playlist, using the `SWFObject 2.0 <http://code.google.com/p/swfobject/>`_ embedding script. Note the *captions.file* option is not set: 
     298 
     299.. code-block:: html 
     300 
     301   <p id="container">The player will be placed here</p> 
     302    
     303   <script type="text/javascript"> 
     304     swfobject.embedSWF("player.swf","container","480","270","9.0.115","false",{ 
     305       file: "/static/playlist.xml", 
     306       plugins: "captions" 
     307     }); 
     308   </script> 
     309 
     310And here is how the *playlist.xml* from this example can look like. The *captions.file* option is now set for each entry: 
     311 
     312.. code-block:: xml 
     313 
     314   <rss version="2.0" xmlns:jwplayer="http://developer.longtailvideo.com/"> 
     315     <channel> 
     316       <title>Example RSS playlist with captions</title> 
     317    
     318       <item> 
     319         <title>Coronation Street</title> 
     320         <description>This entry has external DFXP captions</description> 
     321         <enclosure url="/static/corrie.flv" /> 
     322         <jwplayer:captions.file>/static/corrie.xml</jwplayer:captions.file> 
     323       </item> 
     324    
     325       <item> 
     326         <title>Big Buck Bunny</title> 
     327         <description>This entry has external SRT captions.</description> 
     328         <enclosure url="/static/bunny.mp4" /> 
     329         <jwplayer:captions.file>/static/bunny.srt</jwplayer:captions.file> 
     330       </item> 
     331    
     332     </channel> 
     333   </rss> 
     334 
     335.. note:: 
     336    
     337   The same `crossdomain file restrictions  <http://www.longtailvideo.com/support/jw-player/jw-player-for-flash-v5/12541/crossdomain-file-loading-restrictions>`_ that apply to captions also apply to playlists. Therefore make sure you have placed a *crossdomain.xml* on the webserver that hosts your captions and playlist, if they are different from the *player.swf*'s webserver. 
     338 
     339 
    64340 
    65341 
     
    67343======== 
    68344 
    69 This plugin cannot be skinned. 
     345The Captions plugin includes support for styling its controlbar or dock button through the JW Player `PNG Skinning Model <http://www.longtailvideo.com/support/jw-player/jw-player-for-flash-v5/14/skinning-the-jw-player-5>`_. Styling of the captions themselves must be included in the DFXP or SRT captions file. 
     346 
     347Due to current limitations in the PNG skinning model, not all desired results can be achieved: 
     348 
     349* Rollovers cannot be set, for neither the *dock* nor the *controlbar* button. 
     350* Alternative icons (for the **off** state) cannot be set, for neither the *dock* nor the *controlbar* button. 
     351* Contrary to regular controlbar buttons, the captions controlbar button is given a margin of 5px to its left and to its right. You should take this into account, removing any margins you have in the button graphics. 
     352 
     353Here's an example of a skin that includes custom Captions graphics: 
     354 
     355.. image:: ../assets/stijlskin.png 
     356        :alt: Skinning example. 
     357 
     358This skin, called **Stijl**, can be `freely downloaded here <http://www.longtailvideo.com/addons/skins/25/Stijl>`_. 
     359 
     360XML Block 
     361--------- 
     362 
     363Here is the XML code block you should include in your PNG skin to style the Captions plugin: 
     364 
     365.. code-block:: html 
     366 
     367   ... 
     368   <component name="captions"> 
     369     <elements> 
     370       <element name="controlbarButton" src="controlbar.png" /> 
     371       <element name="dockIcon" src="dock.png" /> 
     372     </elements> 
     373   </component> 
     374 
     375The two PNG images (*controlbar.png* and *dock.png*) should be placed in a **captions** subdirectory of the main skin directory. 
     376 
    70377 
    71378 
     
    74381========= 
    75382 
     383An annoying known bug is the fact the Captions area is *stealing* mouse focus from the video screen. The plugin contains the neccessary *.mouseChildren=false* and *.mouseEnabled=false* settings, but the mouse doesn't pass nontheless. Suggestions are welcome! 
     384 
    76385Version 2.0 
    77386----------- 
    78387 
    79 * Switched from the 4.x to the 5.x plugin API. As of now, the plugin cannot be loaded in the JW Player v4. 
    80 * Added support for monitoring framedrops in the chart, and level (un)blacklisting events in the center message. 
    81 * Colored the various quality metrics in the chart, to easily distinct between them. 
    82 * Made the chart stop drawing when the video is paused or stopped. 
    83  
    84  
    85  
     388* Migrated plugin to V5 API; new Captions.as implements IPlugin and works natively with JW 5+. As of 2.0, the plugin doesn't work with the 4.x player anymore. 
     389* Added support for styling using TimedText Styles (color, fontFamily, fontSize, fontWeight, fontStyle, fontWeight). Styles can be defined both inline and in the *<head>* of a TimedText file. 
     390* Added besic support for PNG skinning, by allowing a custom controlbar and dock icon. 
     391* Added support for error handling. 404 not founds, crossdomain security errors and file parsing errors are caught. 
     392* Added support for controlbars placed over the display, by moving the captions further up. 
     393* Fixed an issue that left the captions 'back' element visible as a thin bar when there where no captions. 
     394* Fixed an issue where captions loaded though the configuration options were ignored when using a single-track playlist. 
  • plugins/captions/v5/test/index.html

    r1077 r1293  
    55<script type="text/javascript" src="assets/jquery.js"></script> 
    66<script type="text/javascript" src="assets/swfobject.js"></script> 
    7 <script type="text/javascript" src="index.js"></script> 
     7<script type="text/javascript" src="settings.js"></script> 
    88<script type="text/javascript"> 
    99 
     
    301301 
    302302</script> 
    303 <style  type="text/css" media="all"> 
    304         body { font-family: Arial, sans-serif; padding: 20px 40px; } 
    305         a { color: #58C; } 
    306         object { display: block; margin: 0 auto; border: 1px solid #FFF; } 
    307         form, div { margin: 0 0 40px 0; } 
    308         fieldset { clear:both; padding: 5px 10px 10px 10px; margin: 0; background:#F5F5F5; border: 1px solid #7A2; } 
    309         hr { border:0;  clear: both; display: block; height: 10px; width: 100%; } 
    310         legend { padding: 0; font-weight: bold; } 
    311         label { display: block; float: left; width: 19%; font-size: 70%; margin: 5px 0 0 0; } 
    312         input, select { margin: 2px 0; border: 1px solid #999; display: block; float: left; width: 80%; } 
    313         button { margin: 0; padding: 5px 0; width: 100%; border: 0; background: #7A2; color: #FFF; } 
    314         li { list-style: none; display: block; float: left; padding: 8px 16px; color: #FFF; margin-right: 2px; 
    315                 border-bottom: 2px solid #FFF; font-size: 70%; cursor: pointer; background: #7A2; } 
    316         ul { display: block; padding: 0; margin: 0; } 
    317         p { font-size: 85%; line-height: 150%; padding: 0 0 0 19%; } 
    318  
    319         #javascript { height: 100px; display: none; } 
    320         #javascript form { width: 32%; margin-right: 2%; float: left; } 
    321         #javascript #listenersform { float: right; margin: 0; } 
    322         #preview { background: #F5F5F5; text-align: center; } 
    323         #preview a { display: block; float: right; padding: 5px 10px; font-size: 80%; color: #666; } 
    324         #flashvarsform li.active { border-bottom: 2px solid #7A2; cursor: default; } 
    325         #flashvarsform fieldset { display: none; } 
    326         #plugins { height: 100px; } 
    327 </style> 
    328303</head> 
    329304<body> 
  • plugins/captions/v5/test/settings.js

    r1077 r1293  
    11var settings = { 
    2         /** Player versions to test. **/ 
     2        /** Players to list. **/ 
    33        players: { 
    4                 '5.0':'/player/tags/mediaplayer-5.0/player.swf', 
    5                 '5.1':'/player/tags/mediaplayer-5.0/player.swf', 
    6                 'trunk':'/player/trunk/fl5/player.swf' 
     4                '5.3':'players/5.3.swf', 
     5                '5.2':'players/5.2.swf', 
     6                '5.1':'players/5.1.swf', 
     7                '5.0':'players/5.0.swf' 
    78        }, 
    8         /** Available JW4 plugins to test. **/ 
     9        /** Plugins to list. **/ 
    910        plugins: { 
    10                 audiodescription:'/player/plugins/audiodescription/v5/audiodescription.swf', 
    11                 captions:'../captions.swf', 
    12                 hd:'/player/plugins/hd/v4/hd.swf' 
     11                captions:'../captions.swf' 
    1312        }, 
    14         /** PNG skins to test. **/ 
     13        /** Skins to list. **/ 
    1514        skins: { 
    1615                none:'', 
    17                 beelden:'/player/skins/beelden/beelden.xml', 
    18                 bekle:'/player/skins/bekle/bekle.xml', 
    19                 bluemetal:'/player/skins/bluemetal/bluemetal.xml', 
    20                 classic:'/player/skins/classic/classic.xml', 
    21                 five:'/player/skins/five/five.xml', 
    22         lulu:'/player/skins/lulu/lulu.xml', 
    23                 modieus:'/player/skins/modieus/modieus.xml', 
    24                 nacht:'/player/skins/nacht/nacht.xml', 
    25                 snel:'/player/skins/snel/snel.xml', 
    26         stormtrooper:'/player/skins/stormtrooper/stormtrooper.xml' 
     16                bekle:'skins/bekle.zip', 
     17                glow:'skins/glow.zip', 
     18                modieus:'skins/modieus.zip', 
     19                stijl:'skins/stijl.zip', 
    2720        }, 
    2821        /** All the setup examples with their flashvars. **/ 
    2922        examples: { 
    3023                '':{}, 
    31                 'TT captions with button in the dock': { 
    32                         dock:'true', 
     24                'TT plain captions': { 
    3325                        plugins:'captions', 
    34                         file:'/player/testing/files/corrie.flv', 
    35                         'captions.file':'/player/testing/files/corrie.xml' 
     26                        file:'../assets/corrie.flv', 
     27                        image:'assets/corrie.jpg', 
     28                        'captions.file':'assets/plain.xml' 
    3629                }, 
    37                 'SRT captions with button in the controlbar': { 
     30                'SRT plain captions': { 
    3831                        dock:'false', 
    3932                        plugins:'captions', 
    40                         file:'/player/testing/files/corrie.flv', 
    41                         'captions.file':'/player/testing/files/corrie.srt' 
     33                        file:'../assets/corrie.flv', 
     34                        image:'assets/corrie.jpg', 
     35                        'captions.file':'assets/plain.srt' 
    4236                }, 
    4337                'TT captions with styling': { 
    4438                        plugins:'captions', 
    45                         file:'/player/testing/files/bunny.flv', 
    46                         'captions.file':'/player/testing/files/captions.xml' 
     39                        file:'../assets/corrie.flv', 
     40                        image:'assets/corrie.jpg', 
     41                        'captions.file':'assets/styled.xml' 
    4742                }, 
    4843                'SRT captions with styling': { 
    4944                        plugins:'captions', 
    50                         file:'/player/testing/files/bunny.flv', 
    51                         'captions.file':'/player/testing/files/captions.srt' 
     45                        file:'../assets/corrie.flv', 
     46                        image:'assets/corrie.jpg', 
     47                        'captions.file':'assets/styled.srt' 
    5248                }, 
    53                 'Caption selector in the dock': { 
     49                'MP4 timedtext captions': { 
    5450                        plugins:'captions', 
    55                         dock:'true', 
    56                         file:'/player/testing/files/bunny.flv', 
    57                         'captions.file':'english:/player/testing/files/captions.srt,deutsch:/player/testing/files/captions.srt,nederlands:/player/testing/files/corrie.srt' 
     51                        file:'../assets/bunny.mp4', 
     52                        image:'assets/bunny.jpg' 
    5853                }, 
    59                 'Caption selector in the controlbar': { 
     54                ' ':{}, 
     55                'Playlist with captions': { 
     56                        dock:false, 
     57                        file:'assets/playlist.xml', 
     58                        height:240, 
     59                        playlist:'right', 
     60                        playlistsize:240, 
    6061                        plugins:'captions', 
    61                         dock:'false', 
    62                         file:'/player/testing/files/bunny.flv', 
    63                         'captions.file':'language 1:/player/testing/files/captions.srt,language 2:/player/testing/files/captions.srt,another one:/player/testing/files/corrie.srt' 
     62                        width:720 
    6463                }, 
    65                 'Javascript callback (console.log)': { 
     64                'Multibitrate stream with captions': { 
    6665                        plugins:'captions', 
    67                         file:'/player/testing/files/corrie.flv', 
    68                         'captions.file':'/player/testing/files/corrie.xml', 
    69                         'captions.callback':'console.log' 
     66                        file:'http://content.bitsontherun.com/jwp/nPripu9l.xml', 
     67                        captions:'assets/bunny.srt' 
    7068                } 
    7169        } 
Note: See TracChangeset for help on using the changeset viewer.