# Midroll Video Ads

## Player Code setup

### Prerroll, Midroll (00:10), Midroll (50%), Postroll

    <!--Initialize player, Nuevo plugin and setup roll videos-->
    <script>
    	var player = videojs('player_one');
    	player.nuevo();
    	player.vroll([
    		{
    			src: "//opencdn.b-cdn.net/video/preroll.mp4",
    			type: "video/mp4",
    			href: "https://url-to-go-on-click",
    			offset: '0',  //must be '0' for preroll video
    			skip: 5, //optionally
    			id: '1' //useful for tracking roll video
    		}, {
    			src: "//opencdn.b-cdn.net/video/midroll1.mp4",
    			type: "video/mp4",
    			href: "https://url-to-go-on-click",
    			offset: '10', //midroll starts at 00:10
    			skip: 5, //optionally
    			id: '2'
    		}
    			src: "//opencdn.b-cdn.net/video/midroll2.mp4",
    			type: "video/mp4",
    			href: "https://url-to-go-on-click",
    			offset: '50%', //midroll starts at half of video
    			skip: 5, //optionally
    			id: '3'
    		}
    			src: "//opencdn.b-cdn.net/video/postroll.mp4",
    			type: "video/mp4",
    			href: "https://url-to-go-on-click",
    			offset: '100%', //must be '100%' for postroll video
    			skip: 5, //optionally
    			id: '4'
    		}
    	]);
    </script>

Preroll video must have option "offset: 0", psotroll video must have option "offset: 100%".
You can't use postroll video for live streams. You can't use offset percentage value for live stream.
To play midroll video one after another just set same "offset" value.

### Tracking video ad by ad ID

    <script>
       player.on('vroll', function(event, data) {
    	  var ad_id = data.id;
    	  var action = data.action;
       }
    </script>

Actions tracked by the plugin are "start", "paused", "resumed" "skipped", "completed", "error", "clicked",