Example 2 - Process Ad Events with Javascript

This example illustrates the javascript callback API for Ad related events. Events are fired by the Open Ad Streamer when a linear ad starts, reaches the first quartile, midpoint, 3rd quartile and on completion. Events are also fired when non-linear ads are shown, hidden, companions shown and hidden, and the ad notice shown and hidden. Finally events are fired when an ad is clicked.

To start receiving these events, the "canFireAPICalls" config property must be set to "true". It is "true" by default.

In this example, a series of DIVs are displayed around the player. As each event fires, the corresponding DIV is turned green. If you have Firebug installed, bring up the console. Debug output is shown as each event fires so you can see the javascript callback event occur.



Linear Start

Linear 1st Quartile

Linear Midpoint

Linear 3rd Quartile

Linear Complete

Linear Clicked

Ad Notice Show

Ad Notice Hide

Non Linear Show

Non Linear Hide

Non Linear Click

Non Linear Close Click

Linear Ad Skipped

Companion Show

Companion Hide

Ad Stop

Ad Pause

Ad Resume

Ad Replay

Ad Mute

Ad Unmute

Ad Fullscreen Entry

Ad Fullscreen Exit

VPAID Ad Start

VPAID Ad Complete

VPAID Ad Error

VPAID Ad Expanded Change

VPAID Ad Linear Change

VPAID Ad Time Change

The configuration for this example is:


// An example ad event Javascript callback

function onLinearAdStart(ad) {
    debug("OVA CALLBACK EVENT: linear ad begin");
    debug(ad);
    document.getElementById("linear-ad-start").style.backgroundColor = "#00CC00";	
}

//... the other callback functions go in here

flowplayer("a.player614x345", "", {
    plugins: {	    
        controls: {
            autoHide: "always"
        },

        ova: {
            url: "",

            "canFireAPICalls": true,
            
            "shows": {
                 "streams": [
                      {
                          "file": "",
                          "duration":"00:00:30"
                      }
                 ]
            },

            "ads": {
                 "skipAd": {
                     "enabled": true
                 },
                 "servers": [
                     {
                          "type": "OpenX",
                          "apiAddress": "",
                     }
                 ],
                 "schedule": [
                      {
                          "zone": "5",
                          "position": "pre-roll"
                      },
                      {
                          "zone": "33",
                          "width": 450,
                          "height": 50,
                          "startTime": "00:00:05",
                          "duration": "15"
                      }
                 ],
            },

            "debug": {
                 "levels": ""
            }
        }
    }
});