ActionScript Examples (Player V2 Deprecated)

ActionScript Examples demonstrate the embedding capability of the Ooyala player and the capability to add additional features to the player using the Player API.

Flex ActionScript 3 API Interface Example

Note: Ooyala Player V2 has been deprecated and is scheduled to be disabled. For details and alternatives, see the OVP Release Notes.

The following three examples, "Flex ActionScript 3 API interface," "Getting Started Example," and "Additional Player Functionality Example" demonstrate the flexibility and variety of the Player ActionScript APIs.

The following example illustrates the use of the ActionScript Interface.

package com.ooyala.api
{
 /**
 * Player API
 */
 [Event (name="currentItemEmbedCodeChanged" )]
 [Event (name="embedCodeChanged" )]
 [Event (name="playComplete" , type="flash.events.Event" )]
 [Event (name="loadComplete" )]
 [Event (name="playheadTimeChanged" )]
 [Event (name="stateChanged" )]
 [Event (name="totalTimeChanged" )]
 [Event (name="volumeChanged" )]

 public class Player extends UIComponent
 {

   /**
   * Load the Ooyala player
   */
   public function load():void

   /**
   * Pass "query string parameters" to change the movie or channel in the player.
   * You can pass a string (similar to HTML Snippet query string
   * and FlashVars in direct Flash embed) or properties of an object
   */
   public function set queryStringParameters(parameters:*): void
   /**
   * embedCode of the player itself (for a channel, it will be channel)
   */
   [Bindable (event="embedCodeChanged" )]
   public function get embedCode():String
   /**
   * Convenient shortcut for set queryStringParameters('embedCode='+value)
   * i.e. Reloads movie/channel in player
   */
   public function set embedCode(value:String): void
   /**
   * Total time (in seconds) of the currently active item in the player
   * For a channel, the total length of the current video in the channel
   */
   [Bindable (event="totalTimeChanged" )]
   public function get totalTime():Number
   /**
   * Playhead time for the current active video in the player
   * For a channel, the playhead time of the current video in the channel
   */
   [Bindable (event="playheadTimeChanged" )]
   public function get playheadTime():Number
   /**
   * Seek within the active video in the channel
   */
   public function set playheadTime(value:Number): void
   /**
   * Player Volume setting
   */
   [Bindable (event="volumeChanged")]
   public function get volume():Number
   public function set volume(value:Number): void
   /**
   * The current state of the player. One of:
   * playing
   * paused
   * buffering
   * finished
   * error
   */
  [Bindable (event="stateChanged")]
  public function get state():String
  /**
  * The embedCode of the current video in the player.
  * In the case of a channel, this will be the embedCode
  * of the current video in the channel
  */
  [Bindable (event="currentItemEmbedCodeChanged" )]
  public function get currentItemEmbedCode():String
  /**
  * Play the current video or channel
  */
  public function play():void
  /**
  * Play the current video or channel
  */
  public function pause():void

 }//end of class
}

   

Getting Started Example

This is the first of two examples that illustrate the ability of the Ooyala player to be embedded in an Adobe Flex application using Adobe ActionScript 3. This example shows a basic integration while the following "Additional Functionality" example shows how to use more of the features exposed in the API. Sample source code, including these two examples, is available at:

Flash API Demo

Please note that your player will need to target Flash 10. More information on this can be found at:

Targeting Flash Player 10

<?xml version="1.0" encoding="utf-8"?>
<mx:Application
 applicationComplete="player.load()"
 backgroundColor="#000000"
 layout="vertical"
 xmlns:mx="http://www.adobe.com/2006/mxml"
 xmlns:ooyala="com.ooyala.api.*"
 >
 <ooyala:Player
   id="player"
   width="100%"
   height="100%"
   embedCode="x0b2E6REM6ksHP8PMsOaWRNkq2uwLyFv"
   loadComplete="player.playMovie()"
 />
</mx:Application>

   

Additional Functionality Example

In addition to the Flex ActionScript examples, we have an Flash project example available at:

Flash API Demo

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
  applicationComplete="player.load()"
  backgroundColor="#000000"
  layout="absolute"
  xmlns:ooyala="com.ooyala.api.*" >
<ooyala:Player id="player" width="100%" height="100%"
  queryStringParameters="{source.selectedItem}"
/>
<mx:HBox y="0" horizontalCenter="0"
  backgroundColor="black" backgroundAlpha="0.5"
  borderColor="white" borderStyle="solid" borderThickness="1"
  cornerRadius="10"
  paddingLeft="10" paddingTop="10" paddingRight="10" paddingBottom="10">
<mx:VBox color="white" fontWeight="bold" minWidth="150">
<mx:Label text="Current Time: {player.playheadTime.toFixed(2)}s"/>
<mx:Label text="Total Time: {player.totalTime}s"/>
<mx:Label text="Volume: {(player.volume * 100).toFixed(0)}%"/>
<mx:Label text="Play State: {player.state}"/>
</mx:VBox>
<mx:ComboBox id="source" selectedIndex="0" labelField="comboboxLabel">
<mx:Array>
<mx:Object
  comboboxLabel="Sample Video #1"
  embedCode="x0b2E6REM6ksHP8PMsOaWRNkq2uwLyFv"
  hide="sharing,fullscreen,endscreen"
/>
<mx:Object
  comboboxLabel="Sample Video #2"
  embedCode="sxM2I6UiPuCkPaUuWM6KObYoyA-MOBcn"
  hide="info"
/>
</mx:Array>
</mx:ComboBox>
<mx:Button label="Play" click="player.playMovie()"
  visible="{player.state != 'playing'}"
  includeInLayout="{player.state != 'playing'}"/>
<mx:Button label="Pause" click="player.pauseMovie()"
  visible="{player.state == 'playing'}"
  includeInLayout="{player.state == 'playing'}"/>
<mx:Button label="seek -30s" click="player.playheadTime -= 30"/>
<mx:Button label="seek +30s" click="player.playheadTime += 30"/>
<mx:Button label="volume 25%" click="player.volume = 0.25"/>
</mx:HBox>
</mx:Application>
   

Was this article helpful?