0.1.3

Properly add/remove listener for contextmenu event on VAST player

README.md

@@ -208,7 +208,7 @@ The following methods provide context information for the rmp-vast instance:
 - `getIsUsingContentPlayerForAds()`: on iOS (which we love) the VAST player is the content player. This is to avoid fullscreen management issues and to provide a consistent user experience. This method will return true for iOS, false otherwise
 
 ## Autoplay support
-This is done by adding the `autoplay` attribute to the video tag having the `rmp-video` class. For muted autoplay (mobile) also add the `muted` attribute on this element. After that you just need to wait for the `play` event on the content player and call `loadAds` method. See the test/spec/LinearMutedAutoplaySpec.html file for a complete example.
+This is done by adding the `autoplay` attribute to the video tag having the `rmp-video` class. For muted autoplay (mobile) also add the `muted` attribute on this element. After that you just need to wait for the `play` event on the content player and call `loadAds` method. See the test/LinearMutedAutoplaySpec.html file for a complete example.
 
 Detecting autoplay capabilities for a targeted device is not within rmp-vast scope of support but we strongly encourage you use a feature detection script to do so. Indeed OS may apply restrictions and users may have specific settings or accessibility requirements that can prevent autoplay of HTML5 video. In order to provide a good user experience and to avoid technical issues it is best to feature detect autoplay support before using it.
 

js/dist/rmp-vast.js

@@ -1,6 +1,6 @@
 /**
  * @license Copyright (c) 2017 Radiant Media Player | https://www.radiantmediaplayer.com
- * rmp-vast 0.1.2
+ * rmp-vast 0.1.3
  * GitHub: https://github.com/radiantmediaplayer/rmp-vast
  * MIT License: https://github.com/radiantmediaplayer/rmp-vast/blob/master/LICENSE
  */
@@ -597,6 +597,13 @@ var _appendClickUIOnMobile = function _appendClickUIOnMobile() {
   this.adContainer.appendChild(this.clickUIOnMobile);
 };
 
+var _onContextMenu = function _onContextMenu(event) {
+  if (event) {
+    event.stopPropagation();
+    event.preventDefault();
+  }
+};
+
 LINEAR.update = function (url, type) {
   if (DEBUG) {
     _fw.FW.log('RMP-VAST: update vast player for linear creative of type ' + type + ' located at ' + url);
@@ -612,6 +619,10 @@ LINEAR.update = function (url, type) {
   this.onEndedResumeContent = _onEndedResumeContent.bind(this);
   this.vastPlayer.addEventListener('ended', this.onEndedResumeContent);
 
+  // prevent built in menu to show on right click
+  this.onContextMenu = _onContextMenu.bind(this);
+  this.vastPlayer.addEventListener('contextmenu', this.onContextMenu);
+
   // append source to vast player if not there already
   if (!this.useContentPlayerForAds) {
     var existingVastPlayerSource = this.adContainer.getElementsByTagName('source')[0];
@@ -2215,13 +2226,6 @@ var _destroyVastPlayer = function _destroyVastPlayer() {
   _api.API.createEvent.call(this, 'addestroyed');
 };
 
-var _onContextMenu = function _onContextMenu(event) {
-  if (event) {
-    event.stopPropagation();
-    event.preventDefault();
-  }
-};
-
 VASTPLAYER.init = function () {
   if (DEBUG) {
     _fw.FW.log('RMP-VAST: init called on VASTPLAYER');
@@ -2243,9 +2247,6 @@ VASTPLAYER.init = function () {
     if (this.contentPlayer.muted) {
       this.vastPlayer.muted = true;
     }
-    // prevent built in menu to show on right click
-    this.onContextMenu = _onContextMenu.bind(this);
-    this.vastPlayer.addEventListener('contextmenu', this.onContextMenu);
     this.vastPlayer.setAttribute('x-webkit-airplay', 'allow');
     if (typeof this.contentPlayer.playsInline === 'boolean' && this.contentPlayer.playsInline) {
       this.vastPlayer.playsInline = true;

js/src/creatives/linear.js

@@ -72,6 +72,13 @@ var _appendClickUIOnMobile = function () {
   this.adContainer.appendChild(this.clickUIOnMobile);
 };
 
+var _onContextMenu = function (event) {
+  if (event) {
+    event.stopPropagation();
+    event.preventDefault();
+  }
+};
+
 LINEAR.update = function (url, type) {
   if (DEBUG) {
     FW.log('RMP-VAST: update vast player for linear creative of type ' + type + ' located at ' + url);
@@ -87,6 +94,10 @@ LINEAR.update = function (url, type) {
   this.onEndedResumeContent = _onEndedResumeContent.bind(this);
   this.vastPlayer.addEventListener('ended', this.onEndedResumeContent);
 
+  // prevent built in menu to show on right click
+  this.onContextMenu = _onContextMenu.bind(this);
+  this.vastPlayer.addEventListener('contextmenu', this.onContextMenu);
+
   // append source to vast player if not there already
   if (!this.useContentPlayerForAds) {
     let existingVastPlayerSource = this.adContainer.getElementsByTagName('source')[0];

js/src/players/vast-player.js

@@ -69,13 +69,6 @@ var _destroyVastPlayer = function () {
   API.createEvent.call(this, 'addestroyed');
 };
 
-var _onContextMenu = function (event) {
-  if (event) {
-    event.stopPropagation();
-    event.preventDefault();
-  }
-};
-
 VASTPLAYER.init = function () {
   if (DEBUG) {
     FW.log('RMP-VAST: init called on VASTPLAYER');
@@ -97,9 +90,6 @@ VASTPLAYER.init = function () {
     if (this.contentPlayer.muted) {
       this.vastPlayer.muted = true;
     }
-    // prevent built in menu to show on right click
-    this.onContextMenu = _onContextMenu.bind(this);
-    this.vastPlayer.addEventListener('contextmenu', this.onContextMenu);
     this.vastPlayer.setAttribute('x-webkit-airplay', 'allow');
     if (typeof this.contentPlayer.playsInline === 'boolean' && this.contentPlayer.playsInline) {
       this.vastPlayer.playsInline = true;

js/src/rmp-vast-header.js

@@ -1,6 +1,6 @@
 /**
  * @license Copyright (c) 2017 Radiant Media Player | https://www.radiantmediaplayer.com
- * rmp-vast 0.1.2
+ * rmp-vast 0.1.3
  * GitHub: https://github.com/radiantmediaplayer/rmp-vast
  * MIT License: https://github.com/radiantmediaplayer/rmp-vast/blob/master/LICENSE
  */

package.json

@@ -1,6 +1,6 @@
 {
   "name": "rmp-vast",
-  "version": "0.1.2",
+  "version": "0.1.3",
   "author": "Radiant Media Player <[email protected]>",
   "description": "A client-side JavaScript solution to load, parse and display VAST resources (advertising)",
   "repository": {