API: Player

The foxneod library handles creating two kinds of players for you: iframe players and non-iframe players (aka "standard" players). Working with thePlatform's iframe players means taking a couple more steps, but this module abstracts a lot of that for you. You specify what attributes you want to pass to the player by either defining an object and calling createIframe() or by assigning a data-player attribute to your HTML element and then passing in a selector to that element.

foxneod.player.clearPlayerMessage()

If you've used setPlayerMessage() and want to remove it, just call this.

foxneod.player.setPlayerMessage({
	message: "The message we want to display"
});

foxneod.player.clearPlayerMessage(); //removes the message from the screen

foxneod.player.control()

If you're using multiple iframe players on a page, use this method to specify which player to control by passing in a selector for it. This function essentially changes the player reference to be a specific player, so that calling commands on it like play() or setPlayerMessage() will only affect that player.

foxneod.control('#player1').pause();
foxneod.control('#player1').setPlayerMessage({
	message: 'Only applies to player 1'
});

foxneod.player.createIframe()

This method takes three arguments (third is optional): the selector of where to inject the player, the URL to the page to display inside the iframe, and an (optional) object of attributes to be passed to the player.

data-player attribute (aka the markup way)

Instead of passing an object of attributes to the player, you can use the data-player attribute.

<div class="player" data-player="width=640|height=360|releaseURL=http://link.theplatform.com/s/fox.com/GyJn1LWj4pik?mbr=true|autoplay=true"></div>

Then, all you need to do is make sure that the selector that you pass into createIframe() points to HTML elements with data-player attributes like this.

foxneod.player.createIframe('.player', 'myIframePage.html');

the javascript way

If you'd rather not define your attributes in markup, you can pass a standard object as the third parameter for what you want your attributes to be.

foxneod.player.createIframe('#myPlayerHolder', 'page.html', {
	releaseURL: "http://link.theplatform.com/s/fox.com/GyJn1LWj4pik?mbr=true",
	autoplay: false
});

If you're already creating a player on the page by calling new FDM_Player(), then you can use the property names and values, but you can drop the player. bit. For example:

//before
var player = new FDM_Player("player", 640, 360);
player.autoplay = true;
player.share_email = 'false';
player.releaseURL = 'http://link.theplatform.com/s/fox.com/qlYqu8y_bOKo?mbr=true';

//after
foxneod.player.createIframe('#player', 'page.html', {
	autoplay: true,
	share_email: 'false',
	releaseURL: 'http://link.theplatform.com/s/fox.com/qlYqu8y_bOKo?mbr=true'
});

foxneod.player.getController()

Maybe you want access to the lower level so you can interact with the PDK directly, or maybe you just want to debug your appliaction. If either of those sounds like you, you can use this to get the controller associated with a player on the page. Just pass in the selector of the player, and if a controller is associated with it, it will be returned.

foxneod.player.getController('#myPlayerID').addEventListener('OnMediaStart', function (event) {
	//do stuff
});

foxneod.player.setPlayerMessage()

If you want to cover the player with a black overlay and a centered message and you want it to work in both Flash and HTML5, use this method. The two available options right now are message and clearAfter. The clearAfter option is optional, and defaults to 0, which just means that the message will stay on screen until clearPlayerMessage() is called. If you'd like the message to disappear after a certain period of time, just specify the number (in seconds) with the clearAfter option.

foxneod.player.setPlayerMessage({
	message: "The message we want to display",
	clearAfter: 10 //how long to leave up the message (in seconds). Use 0 to not set a timer.
});

foxneod.player.hide()

Hides the player on the page by setting its CSS display property to none.

foxneod.player.hide();

foxneod.player.show()

Shows a hidden player on the page by setting its CSS display property to its original value.

foxneod.player.show();

foxneod.player.getCurrentVideo()

Returns the current video loaded into the player. Only available after OnMediaLoadStart fires.

foxneod.player.getMostRecentAd()

Returns the event object from the most recently played ad. Only available after OnMediaLoadStart fires for ad playback.

foxneod.player.seekTo()

Seeks to the time provided (in seconds).

foxneod.player.seekTo(10); //seeks to 10 seconds

foxneod.player.play()

Resumes playback if paused, does nothing otherwise.

foxneod.player.play(); //if video is playing or not loaded, this does nothing

foxneod.player.pause()

Pauses playback if playing, does nothing otherwise.

foxneod.player.pause(); //if video is playing or not loaded, this does nothing

foxneod.player.loadVideo()

This method takes in a release URL, and loads the video into the player but doesn't start playing it back. This method returns a Promise object that has methods like done() and fail(). We use the jQuery Deferred object: read more here;

foxneod.player.loadVideo('http://link.theplatform.com/s/fox.com/tpvXj0h_rZfu?mbr=true')
	.done(function (response) {
		console.log('response', response);
	});

foxneod.player.loadVideo('http://link.theplatform.com/s/fox.com/tpvXj0h_rZfu?mbr=true').then(function () {
	this.play();
});