Difference between revisions of "User:Cgomes7/Subtitle Documentation"

From CDOT Wiki
Jump to: navigation, search
(Subtitle Plug-in)
 
(33 intermediate revisions by the same user not shown)
Line 1: Line 1:
== Subtitle Documentation ==
+
== Subtitle Plug-in ==
 +
Adds a text subtitle to the video that appears at the start time and disappears at the end time. Subtitles can be translated into different languages using Google translate. The accessibility option allows for a user to disable the subtitles.
 +
 
 +
To use subtitle plug-in, import:
 +
 
 +
<script src="popcorn.subtitle.js"></script>
 +
 
 +
To use Google translate, import:
 +
 
 +
<script src="http://google.com/jsapi"></script>
 +
 
 +
== Examples ==
 +
===Simple Example===
 +
      .subtitle({
 +
        start: 5, // seconds
 +
        end: 15, // seconds
 +
        text: 'this is the a subtitle',
 +
      } )
 +
 
 +
===Simple Example with Google Translate:===
 +
  .subtitle({
 +
    start: 20, // seconds
 +
    end: 45, // seconds
 +
    text: 'this is another subtitle',
 +
    language: "en",
 +
    languagesrc: "language",
 +
  } )
 +
Then use combo box to select language:
 +
  <div>
 +
  Choose your language
 +
  <select id="language">
 +
      <option value="zh" selected="selected">Chinese</option>
 +
      <option value="en">English</option>
 +
      <option value="fr">French</option>
 +
      <option value="de">German</option>
 +
      <option value="it">Italian</option>
 +
      <option value="ja">Japanese</option>
 +
      <option value="ko">Korean</option>
 +
      <option value="fa">Persian</option>
 +
      <option value="pl">Polish</option>
 +
      <option value="pt">Portuguese</option>
 +
      <option value="es">Spanish</option>
 +
  </select>
 +
</div>
 +
 
 +
===Simple Example with Accessibility:===
 +
  .subtitle({
 +
    start: 20, // seconds
 +
    end: 45, // seconds
 +
    text: 'this is another subtitle',
 +
    language: "en",
 +
    accessibilitysrc: "accessibility"
 +
  } )
 +
 
 +
Then use check box to turn accessibility on and off:
 +
 
 +
    <div>
 +
      <input type="checkbox" id="accessibility" checked="checked" />All subtitles (accessibility)
 +
    </div>
 +
 
 +
== Syntax ==
 +
.subtitle({
 +
        start:
 +
        end:
 +
        text:
 +
        language:
 +
        languagesrc:
 +
        accessibilitysrc:
 +
      } )
 +
== Parameters ==
 +
 
 +
'''Start:''' is the time the subtitle to appear (INT)
 +
 
 +
'''End:''' is the time the subtitle to disappear (INT)
 +
 
 +
'''Text:''' is the text that will appear (STRING)
 +
 
 +
'''Language:'''          [optional] the language of the subtitle (STRING)
 +
 
 +
'''Languagesrc:'''          [optional] the source of the language option (Combo Box)
 +
 
 +
'''Accessibilitysrc:'''          [optional] the source of the accessibility option (Check Box)
 +
 
 +
== Returns ==
 +
Nothing
  
 
== Links ==
 
== Links ==
'''Source Code'''
 
 
*[https://github.com/annasob/popcorn-js/blob/0.4/plugins/subtitle/popcorn.subtitle.js Subtitle Source Code]
 
*[https://github.com/annasob/popcorn-js/blob/0.4/plugins/subtitle/popcorn.subtitle.js Subtitle Source Code]
'''Examples'''
 
 
*[https://github.com/annasob/popcorn-js/blob/0.4/plugins/subtitle/popcorn.subtitle.html Example Source Code]
 
*[https://github.com/annasob/popcorn-js/blob/0.4/plugins/subtitle/popcorn.subtitle.html Example Source Code]

Latest revision as of 18:52, 7 March 2011

Subtitle Plug-in

Adds a text subtitle to the video that appears at the start time and disappears at the end time. Subtitles can be translated into different languages using Google translate. The accessibility option allows for a user to disable the subtitles.

To use subtitle plug-in, import:

<script src="popcorn.subtitle.js"></script>

To use Google translate, import:

<script src="http://google.com/jsapi"></script>

Examples

Simple Example

     .subtitle({
       start: 5, // seconds
       end: 15, // seconds
       text: 'this is the a subtitle',
     } )

Simple Example with Google Translate:

  .subtitle({
    start: 20, // seconds
    end: 45, // seconds
    text: 'this is another subtitle',
    language: "en",
    languagesrc: "language",
  } )

Then use combo box to select language:

  Choose your language
  <select id="language">
     <option value="zh" selected="selected">Chinese</option>
     <option value="en">English</option>
     <option value="fr">French</option>
     <option value="de">German</option>
     <option value="it">Italian</option>
     <option value="ja">Japanese</option>
     <option value="ko">Korean</option>
     <option value="fa">Persian</option>
     <option value="pl">Polish</option>
     <option value="pt">Portuguese</option>
     <option value="es">Spanish</option>
  </select>

Simple Example with Accessibility:

  .subtitle({
    start: 20, // seconds
    end: 45, // seconds
    text: 'this is another subtitle',
    language: "en",
    accessibilitysrc: "accessibility"
  } )

Then use check box to turn accessibility on and off:

     <input type="checkbox" id="accessibility" checked="checked" />All subtitles (accessibility)

Syntax

.subtitle({
       start: 
       end: 
       text: 
       language: 
       languagesrc: 
       accessibilitysrc: 
     } )

Parameters

Start: is the time the subtitle to appear (INT)

End: is the time the subtitle to disappear (INT)

Text: is the text that will appear (STRING)

Language: [optional] the language of the subtitle (STRING)

Languagesrc: [optional] the source of the language option (Combo Box)

Accessibilitysrc: [optional] the source of the accessibility option (Check Box)

Returns

Nothing

Links