Aniview instream player in used in order to play content videos and ads

The player has very flexible configuration in order to match to the customer requirements

Sample Configuration

<div id="theplayer"> </div>
<script type="text/javascript">
(function()
{
	var config = {
		adConfig : {
			publisherId : "Your id",
			channelId : "Your id",
			ref1 : "",
			width : 100,
			height : 0,
			autoPlay : true,
			soundButton : true,
			pauseButton : true,
			closebutton : false,
			errorlimit : 100,
			vastRetry : 0,
			loop : true,
			position : ""
		},
		position : "theplayer", 
		width : 100,
		height : 0,
		showBigPlay : true, 
		showBigPlayOnPause : true,
		showBigPrevNextOnPause : true,
		soundButtonPosition : "right", 
		showPauseButton : true,
		showPrevButton : false, 
		showNextButton : false,
		showBigPrevNext : true, 
		showSoundButton : true,
		showVolumeControl : true,
		volumeControlVertical : true, 
		showErrorScreen : true, 
		durationPosition : "right", 
		playlistAutoSkipOnError : true, 
		showUiOnPause : false, 
		showTimelineReplay : true, 
		viewPercentageRequired : 1, 
		showFullScreen : false, 
		showDuration : true, 
		hideGuiOnMouseout : true, 
		hideGuiTimeout : 1, 
		timelineMode : "default", 
		spinner : "default", 
		theme : "solid", 
		themeColor : "#ff0000", 
		playOnView : false, 
		logo : {
			url : "LINK_TO_PNG",
			text : false,
			size : [
				90,
				42
			],
			position : "left"
		},
		startVolume : 1, 
		syncVolume : true, 
		autoPlay : false,
		autoLoop : true, 
		autoContinue : true, 
		showReplay : true,
		mobile : { 
			"showBigPlay" : true,
			"showBigPlayOnPause" : true,
			"showBigPrevNext" : true,
			"showUiOnPause" : false,
			"showPauseButton" : true,
			"showPrevButton" : false,
			"showNextButton" : false,
			"showFullScreen" : false,
			"hideGuiTimeout" : 2
		},
		replayText : "Replay",
		content : {
			"order" : 1, 
			"randomFrom" : 1, 
			"slotTimeout" : 5, 
			"breakingAds" : false, 
			"breakingAdsMode" : "default", 
			"contents" : [{
					"id" : "ID1", 
					"url" : "LINK_TO_MP4", 
					"fallbackUrl" : "LINK_TO_FALLBACK_MP4", 
					"clickThroughUrl" : "CLICKTHROUGH_URL",
					"type" : "video",
					"slots" : [{
							"type" : "ad", 
							"time" : 0 
						}
					]
				}, {
					"id" : "ID2", 
					"url" : "LINK_TO_MP4", 
					"fallbackUrl" : "LINK_TO_FALLBACK_MP4", 
					"clickThroughUrl" : "CLICKTHROUGH_URL",
					"type" : "video",
					"slots" : [{
							"type" : "ad", 
							"time" : 0 
						}
					]
				}
			]
		}
	};

	function downloadScript() {
		var scp = document.createElement('script');
		scp.src = "https://player.avplayer.com/script/2/v/avcplayer.js";
		scp.onload = function () {
			var AniviewContentPlayer = com.aniview.player.AniviewContentPlayer;
			var player = new AniviewContentPlayer(config);

			player.nextContent();
		}
		document.getElementsByTagName('head')[0].appendChild(scp);
	};

	downloadScript();

})();

Configuration Concept

Player Location

There are two options for the player location

https://player.avplayer.com/script/2/v/avcplayer.js This player will always be updated to the latest version
https://player.avplayer.com/script/2/2.54/avcplayer.js This will point to a specific version. Its up to the customer to upgrade to a later release as needed

adConfig

Default adConfig is defined in config.adConfig. This configuration is used by default for all ads in the player.

In “default“ mode its possible to define specific configuration per slot that will override the default adConfig - example below

Ads Mode

The ads mode defines how the content player works with ads

breakingAdsMode: Ads configuration mode
- “os“: In this mode the player runs the ad module and whenever and ad is available it will break and pause the content.
  In this mode only the default adConfig is used and slots configuration is ignored.
  There are multiple ways to control the aggressiveness of the player such as impCap per content, breakingAds: 10 that will create an interval between waterfall runs and additional ads player configurations.
- “op“: In this mode the player will allow ads as defined in the slots configuration. The player will use only the default adConfig.
  The advantage of this mode is that it will precache and use ads found in one slot on the next slot while default mode below will work like vpaid, meaning it will load the ads module separetly for each slot and will dump unused ads.
  In this mode breakingAds must be set to false.
- “default“ : in this mode the defined slots define the time when ads are called. Each slot may have its time and timeout. As well, it is possible to define for each slot the channel that will be used and the adConfig configuration
```
config: {
  adConfig: {
    //Default ad config to be used in all slots
  },
  content: {
    contents: [{
      //Content configuration
      slots: [{
        adConfig:{
          //All relevant ad config parameters specific to this slot
          //This will override the default adConfig
        },
        time: 0
      }]
    }]
  }
}
```
  In default mode, breakingAds must be set to false: breakingAds : false
breaking ads: This parameter is relevant only if breakingAdsMode - “os“. for example, breakingAds: 10
breaking ads define the time interval between ads - its similar to midrollTime in the ads player.

Slots Configuration

Slots define the time where we want the ad to appear. In each slot the time of the ad is defined. time: 0 means prerol; - this means that we will search for ads for the configured timeout and will display an ad (if available) before the content.

Slots configuration is relevant only in default and op modes. In os mode slots are ignored.
Each slot can define the number of ads that we want to show in the slot (v 2.54 and above)
In midroll slots, the time is the desired time (seconds) of the ad slot relative to the content time. The actual time when the ads will appear can be slightly different as we are not pausing the content and there may be some timeout of the ad to start

There are multiple ways to define slots:

slots array per content
commonSlots: commonSlots is an array of slots that will be used for all slots.
commonSlots are merged with each content slots
firstPrerollSlot: Slot definition for the first preroll slot in the session: This slot configuration is used as is in the first preroll slot of the session. It will override any existing configuration of the first slot if exist.

In order to implement a session with 2 ads in the first preroll, 2 post rolls and 2 prerolls in the next contents the following configuration can be used:

firstPrerollSlot: {
  "time": 0,            //Slot time, 0 is preroll
  "nextAdTimeout": 6,   //If more than one ads in the slot, the timeout for the second ad
  "preloadAdTime": 10,  //Timeout for the first ad in the slot 
  "maxAds": 2           //Maximum number of ads in the slot
},
commonSlots: {
  "time": 0,
  "nextAdTimeout": 8,
  "preloadAdTime": 15,
  "maxAds": 4           //2 as postrolls 2 as prerolls of the second content and on
}

Configuration Options


adConfig	Object	Default adConfig for ads
position	String	The div id where the player should be positioned
width	Number	The width of the player. If width is 100 and height is 0, the player automatically adopt to the space available
height	Number	The height of the player
autoPlay	Boolean	Start playing automatically or wait for click on the play button
autoLoop	Boolean	Automatically restart playlist when it ends
autoContinue	Boolean	Auto continue to next content when the content ends
showReplay	Boolean	Show or not the replay button when playlist ends (and autoLoop is false)
replayText	String	Text to show with replay button
showTitle	String	Where to show the content title. Possible values - left/right
content	Object	Content object
content.order	Number	0: Order of content according to configuration 1: random
content.randomFrom	Number	If order is 1, randomize from the content defined
content.breakingAds	Number/false	false: No breaking ads Must be false with breakingAdsMode “op“ and “default“ Number: Defines midrollTime - time between running the waterfall Mast be set with breakingAdsMode: “os“
content.breakingAdsMode	String	Ads mode of the player: See above for detailed info “os”: The player runs the ad module and whenever and ad is available it will break and pause the content “op“: (Recommended) The player will search for ads and start the ads as defined in the slots configuration. “default“: The player will search for ads and start the ads as defined in the slots configuration.
content.impCap	Number	Max number of ads allowed in the player
content.firstPrerollSlot	Object	Slot configuration for the first preroll in the player
content.commonSlots	Array	Array of slots configuration that is used for all contents. Will be merged with slots defined per content if any
content.contents	Array	Array of video content elements
content.contents[].id	String	Unique id of the content
content.contents[].url	String	Url of video to play
content.contents[].fallbackUrl	String	Optional fallback url of video. Typically used with hls videos and will be used if hls video fails to play
content.contents[].clickThrough	String	If defined, when clicking on the video it will open this url
content.contents[].type	String	Must be “video“
content.contents[].impCap	Number	Max number of impressions for this video
content.contents[].slots	Array	Array of slots configuration for this video. Used only with “op“ and “default“ breakingAdsMode
content.contents[].slots[].adConfig	Object	adConfig for the specific slot. Used only with “default“ mode
content.contents[].slots.time	Number	Time in seconds when we want to play the ad. 0 for preroll
content.contents[].slots.preloadAdTime	Number	V2.54 and above Timeout in sec for first ad in the slot use content.contents[].slots.timeout in previous versions
content.contents[].slots.nextAdTimeout	Number	V2.54 and above Timeout in sec for next ads in the slot. Relevant only if maxAds bigger than 1
content.contents[].slots.maxAds	Number	V2.54 and above Max number of ads in the slot
floating, sticky	Object	floating or sticky configuration floating: The player floats when not in view sticky: The player floats all the time
floating.resize	Boolean	If true, the floating resize the player and not using scale
floating.size sticky.size	Number	The resize scale of the floated player. 0-1 With sticky set to 1
floating.floatOnBottom	Boolean	Float the player also when the player is below the view. Relevant only to floating
floating.position sticky.position	String	Can be one of: “bottom-right“, “bottom-left“, “top-right“, “top-left“, “top”, ”bottom”
floating.closeButton	Boolean	Show close button on floating player
floating.left sticky.left	Number	Margin from the left of the screen
floating.right sticky.right	Number	Margin from the right of the screen
floating.top sticky.top	Number	Margin from the top of the screen
floating.bottom sticky.bottom	Number	Margin from the bottom of the screen
floating.textFont	String	Set the font for the text, make sure showTitle is set. Relevant for floating.position: top/bottom
floating.textColor	Object	Set the text color, options are Black/White, make sure showTitle is set. Relevant for floating.position: top/bottom
floating.backgroundColor	Object	Set the background color, options are Black/White, make sure showTitle is set. Relevant for floating.position: top/bottom
floating.textSize	Number	Set the text size, make sure showTitle is set. Relevant for floating.position: top/bottom
showBigPlay	Boolean	Show big play button
showBigPlayOnPause	Boolean	Show or not the big play button when the player is paused
showBigPrevNextOnPause	Boolean	Show or not the prev and next buttons when the player is paused
soundButtonPosition	String	The position of the sound button on the controls bar. Can be “left“ or “right“
showPauseButton	Boolean	Show or not the play/pause button on the control bar
showPrevButton	Boolean	Show or not the prev button on the control bar
showNextButton	Boolean	Show or not the next button on the control bar
showBigPrevNext	Boolean	Show or not the big prev and next buttons
showSoundButton	Boolean	Show or not the sound button at the control bar
showVolumeControl	Boolean	Show or not the volume control on the control bar
volumeControlVertical	Boolean	Show vertical or horizontal volume control bar
durationPosition	String	Video duration position in the control bar. Can be “left“ or “right“
showDuration	Boolean	Show or not the video duration
showTimelineReplay		Show or not the replay button on content/playlist end
showFullScreen		Show or not the full screen button
hideGuiOnMouseout		In desktop, hide or don’t hide play gui when mouse is out of player area
hideGuiTimeout	Number(2)	In mobile, number of sec to wait before hiding timeout after first click on UI
timelineMode	String	Default: Show default timeline Bottom: Timeline is shown on the bottom of the control bar None: No timeline
spinner	String	Default: Show circle spinner Dots: Show dots spinner ... None: Dont show spinne
theme	String	Default: Control bar has grayed background Solid: Control bar has no grayed background
themeColor	String	Color code for controls
logo	Object	Custom logo info
logo.url	String	URL of logo png
logo.text	String	Text to show with the logo
logo.size	Number	Size in pixels of the logo
logo.position	String	Position of the logo. Can be: “top-left“, “top-right“
startVolume	Number	Start volume. With autoPlay: true must be set to 0
syncVolume	Boolean	Sync ads and content volume
startMode	Object	Prevent the player to load content before it have an imprssion. Relevant for mode “OP” with preroll and mode “OS” Adds functionality to the player when it opens. By not adding more flags the player will show the poster of the first content until an impression will occur or the play button will be pressed, in case there is no poster it will show a black screen.
startMode.mode	String	For now, supports only "WaitForAd", it’s a must variable for the configuration
startMode.hidden	Boolean	The player will be hidden and will open only if it got an impression, when opens it will open growing height animation.
startMode.openAnim	Boolean	Supports the “hidden” flag and will make the player open with animation
startMode.showPlayer	Boolean	Always open the space of the player, even if the player is hidden
startMode.noFloat	Boolean	When the poster is shown, and the player is with floating configuartin, the player won’t float until an impression will occur or the play button will be pressed.
startMode.playButtonDelay	Number	In case there is no impression the play button will appear after “playButtonDelay” seconds. By pressing it the content video will start
autoSkip	Object	Activate the auto skip functionality, after 20 seconds a skip button with a filling bar for 10 seconds will appear. If any gesture on the player won’t accrue, the player will skip the content. It is also possible to click the next button to skip immediately. Relevant for mode “OP” only
autoSkip.time	Number	Default is 30 seconds, the end time in which the player will skip
autoSkip.timeout	Number	Default is 10 seconds, the timeout in which the auto skip will appear before the autoSkip.time

Instream Player Implementation Guide