Movatterモバイル変換


[0]ホーム

URL:


Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

Sign up
Appearance settings

Google IMA HTML5 preroll ad plugin for Clappr player

NotificationsYou must be signed in to change notification settings

kslimani/clappr-google-ima-html5-preroll

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

This plugin is"deprecated" and may not be compatible with future Clappr player releases.

Please consider usingclappr-ima-plugin plugin.

Google IMA HTML5 preroll ad plugin for Clappr player

Google IMA HTML5 SDK (v3)LINEAR PREROLL AD ONLY ad plugin forClappr video player.

This is a simpleproof of concept based onClappr ad skeleton plugin example.

This plugin is supportedONLY by Clappr version0.2.87 or greater. (For older Clappr versions, use the0.0.7 or0.1.0 version of the plugin).

On mobile devices, it support onlyClappr playbacks which use an HTML5 video element.

See alsodemo page hosted on Github.

Usage

Add both Clappr and the plugin scripts to your HTML:

<head><scripttype="text/javascript"src="https://cdn.jsdelivr.net/npm/clappr@latest/dist/clappr.min.js"></script><scripttype="text/javascript"src="https://cdn.jsdelivr.net/npm/clappr-google-ima-html5-preroll-plugin@latest/dist/clappr-google-ima-html5-preroll-plugin.min.js"></script><!-- yes, that's a long name ;-) --></head>

Then just addClapprGoogleImaHtml5PrerollPlugin into the list of plugins of your player instance, and the options for the plugin go in thegoogleImaHtml5PrerollPlugin property as shown below.

varplayer=newClappr.Player({source:"http://your.video/here.mp4",autoPlay:false,// Set to false and use plugin autostart option (or set to true if tag is false)plugins:{core:[ClapprGoogleImaHtml5PrerollPlugin],},googleImaHtml5PrerollPlugin:{tag:'VAST_TAG_URL',// VAST tag URL (or false to disable plugin)vpaid:1,// Default is 0 (0 is DISABLED, 1 is ENABLED and 2 is INSECURE)// autostart: false, // Default is true// events: { /* Event map */ },// imaLoadTimeout: 3000, // Default is 6000 milliseconds// nonLinearDuration: 20000, // Default is 15000 milliseconds// maxDuration: 30000, // Default is false (DISABLED)// locale: 'fr', // Any two-letter ISO 639-1 code. Default is false (Do not setup)// disableLoader: true, // Default is false (Loader is enabled)}});

For more details about VPAID modes, seeGoogle IMA VPAID 2 support.

Events

For more details, seeGoogle IMA events types.

// [...]  googleImaHtml5PrerollPlugin:{events:{ima_loaded:function(o){// This event signal that ima SDK is loaded// o.target is plugin instance and o.ima is google.ima objectconsole.log('ima_loaded',o)// o.ima.settings.setDisableCustomPlaybackForIOS10Plus(true);},content_resume_requested:function(){console.log('content_resume_requested')},content_pause_requested:function(){console.log('content_pause_requested')},loaded:function(){console.log('loaded')},click:function(){console.log('click')},impression:function(){console.log('impression')},started:function(){console.log('started')},first_quartile:function(){console.log('first_quartile')},midpoint:function(){console.log('midpoint')},third_quartile:function(){console.log('third_quartile')},complete:function(){console.log('complete')},paused:function(){console.log('paused')},resumed:function(){console.log('resumed')},skipped:function(){console.log('skipped')},user_close:function(){console.log('user_close')},ad_error:function(e){console.log('ad_error: '+e.getError())},// AdErrorEventerror:function(e){console.log('error',e)},}}// [...]

Development

Install dependencies :

  yarn install

Start HTTP dev server (http://0.0.0.0:8080) :

  yarn run start

About

Google IMA HTML5 preroll ad plugin for Clappr player

Topics

Resources

Stars

Watchers

Forks

Packages

No packages published

Contributors3

  •  
  •  
  •  

[8]ページ先頭

©2009-2025 Movatter.jp