Ayamel.js

Client-side services and display elements for the Flagship Media Library interface.

Scripts, purposes, and usage.

Table of Contents:

• actor.js
• annotator.js
• async.js
• Ayamel.js
• ControlBar.js
• ControlBarComponents.js
• h5Clip.js
• language_modules.js
• h5Clip.js
• MediaController.js
• MediaControls.js
• ProgressBar.js
• swfobject.js
• Text.js
• textmenu.js
• TimedMedia.js
• UniformAspectRatio.js
• video.js
• VideoPlayer.js
• ytClip.js

actor.js

Um... I'm not sure how this fits in.

Dependencies:

• Ayamel.js

annotator.js

Used for annotating stuff. You can call it with one of the following:

Annotator.HTML(config, content);

Annotates HTML.

Parameter | Type | Description --- | ---| --- config | Object | Configuration. Not sure exactly what it needs/can contain. content | DOM Element? | The content to annotate

Annotator.Text(config, content);

Annotates text.

Parameter | Type | Description --- | ---| --- config | Object | Configuration. Not sure exactly what it needs/can contain. content | String? | The content to annotate

Dependencies:

• None

async.js

Don't know.

Dependencies:

• None

Ayamel.js

This is the starting point of the Ayamel scripts. This defines a namespace contained within the Ayamel object. It also defines an AyamelElement which is used as the prototype for other elements. You'll never call just the Ayamel object, but one of the sub objects which each require a separate script to work properly. These include:

• TimedMedia
• VideoPlayer
• Video
• Text

Dependencies:

• None

Used by:

• actor.js
• MediaController.js
• Text.js
• TimedMedia.js
• UniformAspectRatio.js
• video.js
• VideoPlayer.js

ControlBar.js

This is the control bar for media controller. This creates a graphical interface that can be used to control media playback. This is a customizable alternative to MediaControls.js.

Dependencies:

• ProgressBar.js
• ControlBarComponents.js
• jQuery

Used by:

• MediaController.js

You shouldn't ever need to call it, as it's called from MediaController.js

ControlBarComponents.js

This defines a bunch of components that can be added to the control bar. You shouldn't ever need to call this, as you can define the components through the video player.

Dependencies:

• jQuery

Used by:

• ControlBar.js

h5Clip.js

This script defines the video player installer which can be used to support HTML5 video.

Dependencies:

• Ayamel.js
• video.js

To use the installer, do one of the following:

Ayamel.AddVideoPlayer(h5PlayerInstall, priority, callback);
Ayamel.InstallVideoPlayers([h5PlayerInstall, ...], callback)

For a description of these functions, see video.js

language_modules.js

Something to do with languages.

Dependencies:

• None

MediaController.js

As the name suggests, this is a controller for media. This connects the media player with the controls.

Dependencies:

• Ayamel.js
• ControlBar.js or MediaControls.js

Used by:

• VideoPlayer.js

MediaControls.js

Provides a graphical interface for controlling media. Can use ControlBar.js instead.

Dependencies:

• None

Used by:

• MediaController.js

ProgressBar.js

The progress bar used by the control bar.

Dependencies:

• jQuery

Used by:

• ControlBar.js

swfobject.js

Used to load flash objects onto the page.

Dependencies:

• None

Used by:

• ytClip.js

Text.js

Has to do with text somehow.

Dependencies:

• Ayamel.js
• TextMenu.js

textmenu.js

A menu for text?

Used by:

• TextMenu.js

TimedMedia.js

An abstract layer for working with timed media (video, audio).

Dependencies:

• Ayamel.js

Used by:

• video.js

UniformAspectRatio.js

This helps maniuplate DOM Elements such that a certain aspect ratio can be maintained.

Dependencies:

• Ayamel.js

Used by:

• VideoPlayer.js

video.js

This adds video support. Provides video player installers.

Dependencies:

• TimedMedia.js

It provides the following video player installers within the Ayamel namespace:

Ayamel.AddVideoPlayer(installer, priority, callback)

Installs a video player.

Parameter | Type | Description --- | ---| --- installer | Player installer | The video player installer. priority | integer | The priority of the player. The lower the number the more preferred the player callback | function | A callback function

Ayamel.InstallVideoPlayers(installers, callback)

Installs multiple video players.

Parameter | Type | Description --- | ---| --- installers | Array of player installers | The list of video players to install. The order is the priority. callback | function | A callback function

VideoPlayer.js

An interface for creating video players on the page.

Dependencies:

• Ayamel.js
• MediaController.js
• UniformAspectRatio.js

To create a video player, do the following:

var player = Ayamel.VideoPlayer(parameters);

Creates a video player on the page.

parameters is an object. The following are valid within it:

Parameter | Type | Description | Required --- | --- | --- | --- aspectRatio | Number | The ratio of height to width on a scale of 100. 50 is a square. | Yes components | Array of strings | The components to add to the player. | No element | DOM Element | The element where the video player will be added. | Yes resource | Resource | The video resource that will be played. | Yes

Valid components include:

• play The play/pause button
• volume The volume control
• captions Caption track selection. For more information, see ControlBar.js
• More coming soon!

ytClip.js

This script defines the video player installer which can be used to support YouTube videos.

Dependencies:

• Ayamel.js
• swfobject.js
• video.js

To use the installer, do one of the following:

Ayamel.AddVideoPlayer(ytPlayerInstall, priority, callback);
Ayamel.InstallVideoPlayers([ytPlayerInstall, ...], callback)

For a description of these functions, see video.js