3.0.6

- fixes iPadOS detection and show mobile UI on iPadOS (like on iOS)
radiantmediaplayer · Apr 22, 2021 · 8b993d1 · 8b993d1
1 parent 90230fe
commit 8b993d1
Show file tree

Hide file tree

Showing 8 changed files with 185 additions and 1,071 deletions.
diff --git a/app/dev.html b/app/dev.html
@@ -15,24 +15,23 @@
 <body>
   <div class="rmp-container" id="rmpPlayer">
     <div class="rmp-content">
-      <video class="rmp-video"
-        src="https://www.rmp-streaming.com/media/big-buck-bunny-360p.mp4" playsinline muted
-        controls>
+      <video class="rmp-video" src="https://www.rmp-streaming.com/media/big-buck-bunny-360p.mp4"
+        playsinline muted controls>
       </video>
     </div>
   </div>
   <script type="module">
     import { RmpVast } from '../js/src/index.js';
     var id = 'rmpPlayer';
     var container = document.getElementById(id);
-    var ADTAG2 = 'https://www.radiantmediaplayer.com/vast/tags/inline-linear.xml?VASTVERSIONS=[VASTVERSIONS]&MEDIAMIME=[MEDIAMIME]';
-   // var ADTAG = 'https://www.radiantmediaplayer.com/vast/tags/non-linear.xml';
-   // var ADTAG3 = 'https://www.radiantmediaplayer.com/vast/tags/ad-pod-all-wrappers.xml';
+    // var ADTAG2 = 'https://www.radiantmediaplayer.com/vast/tags/inline-linear.xml?VASTVERSIONS=[VASTVERSIONS]&MEDIAMIME=[MEDIAMIME]';
+    var ADTAG = 'https://www.radiantmediaplayer.com/vast/tags/inline-linear-1.xml';
+    // var ADTAG3 = 'https://www.radiantmediaplayer.com/vast/tags/ad-pod-all-wrappers.xml';
     //var ADTAG2 = 'https://pubads.g.doubleclick.net/gampad/ads?sz=640x480&iu=/124319096/external/single_ad_samples&ciu_szs=300x250&impl=s&gdfp_req=1&env=vp&output=vast&unviewed_position_start=1&cust_params=deployment%3Ddevsite%26sample_ct%3Dlinear&correlator=';
     var params = {
       ajaxWithCredentials: false
     };
     window.rmpVast = new RmpVast(id, params, true);
-    window.rmpVast.loadAds(ADTAG2);
+    window.rmpVast.loadAds(ADTAG);
   </script>
 </body>
diff --git a/css/rmp-vast.css b/css/rmp-vast.css
@@ -3,7 +3,7 @@
   font-family: 'Roboto';
   font-style: normal;
   font-weight: 400;
-  src: url(https://fonts.gstatic.com/s/roboto/v20/KFOmCnqEu92Fr1Mu4mxP.ttf) format('truetype');
+  src: url(https://fonts.gstatic.com/s/roboto/v27/KFOmCnqEu92Fr1Mu4mxP.ttf) format('truetype');
 }
 .rmp-container {
   position: relative;

diff --git a/css/rmp-vast.min.css b/css/rmp-vast.min.css
diff --git a/js/src/fw/env.js b/js/src/fw/env.js
@@ -21,6 +21,14 @@ const _getUserAgent = function () {
 };
 const userAgent = _getUserAgent();
 
+const _getPlatform = function () {
+  if (navigator && navigator.platform) {
+    return navigator.platform;
+  }
+  return null;
+};
+const platform = _getPlatform();
+
 const _filterVersion = function (pattern) {
   if (userAgent !== null) {
     const versionArray = userAgent.match(pattern);
@@ -40,6 +48,14 @@ const _getDevicePixelRatio = function () {
 };
 ENV.devicePixelRatio = _getDevicePixelRatio();
 
+const _maxTouchPoints = function () {
+  if (navigator && typeof navigator.maxTouchPoints === 'number') {
+    return navigator.maxTouchPoints;
+  }
+  return -1;
+};
+ENV.maxTouchPoints = _maxTouchPoints();
+
 const IOS_PATTERN = /(ipad|iphone|ipod)/i;
 const IOS_VERSION_PATTERN = /os\s+(\d+)_/i;
 const _isIos = function () {
@@ -65,7 +81,7 @@ const _isMacOS = function () {
   }
   return [isMacOS, macOSXMinorVersion];
 };
-const isMacOS = _isMacOS();
+let isMacOS = _isMacOS();
 
 const SAFARI_PATTERN = /safari\/[.0-9]*/i;
 const SAFARI_VERSION_PATTERN = /version\/(\d+)\./i;
@@ -81,13 +97,18 @@ const _isSafari = function () {
 };
 const isSafari = _isSafari();
 
+const MAC_PLATFORM_PATTERN = /macintel/i;
 const _isIpadOS = function () {
-  if (!isIos[0] && isSafari[0] && isSafari[1] > 12 && isMacOS[0] && isMacOS[1] > 14 && ENV.devicePixelRatio > 1) {
+  if (!isIos[0] && hasTouchEvents && MAC_PLATFORM_PATTERN.test(platform) && devicePixelRatio > 1 &&
+    ENV.maxTouchPoints > 1) {
     return true;
   }
   return false;
 };
 ENV.isIpadOS = _isIpadOS();
+if (ENV.isIpadOS) {
+  isMacOS = [false, -1];
+}
 
 const ANDROID_PATTERN = /android/i;
 const ANDROID_VERSION_PATTERN = /android\s*(\d+)\./i;
@@ -99,7 +120,7 @@ const _isAndroid = function () {
   if (ANDROID_PATTERN.test(userAgent)) {
     support = [true, _filterVersion(ANDROID_VERSION_PATTERN)];
   }
-  return support; 
+  return support;
 };
 
 // from https://developer.mozilla.org/en-US/docs/Web/HTTP/Browser_detection_using_the_user_agent
@@ -131,10 +152,9 @@ const _hasNativeFullscreenSupport = function () {
   return false;
 };
 
-ENV.isSafari = isSafari;
 ENV.isIos = isIos;
 ENV.isAndroid = _isAndroid();
-ENV.isMacOS = _isMacOS();
+ENV.isMacOSSafari = isMacOS[0] && isSafari[0];
 ENV.isFirefox = _isFirefox();
 ENV.isMobile = false;
 if (ENV.isIos[0] || ENV.isAndroid[0] || ENV.isIpadOS) {

diff --git a/js/src/index.js b/js/src/index.js
@@ -1,6 +1,6 @@
 /**
  * @license Copyright (c) 2017-2020 Radiant Media Player | https://www.radiantmediaplayer.com
- * rmp-vast 3.0.5
+ * rmp-vast 3.0.6
  * GitHub: https://github.com/radiantmediaplayer/rmp-vast
  * MIT License: https://github.com/radiantmediaplayer/rmp-vast/blob/master/LICENSE
  */
@@ -50,6 +50,8 @@ export class RmpVast {
     }
     if (this.debug) {
       FW.log('creating new RmpVast instance');
+      FW.log('environment follows');
+      FW.log(null, ENV);
       FW.logVideoEvents(this.contentPlayer, 'content');
     }
     // reset loadAds variables - this is reset at addestroyed 

diff --git a/js/src/utils/default.js b/js/src/utils/default.js
@@ -31,7 +31,7 @@ DEFAULT.instanceVariables = function () {
   // on iOS and macOS Safari we use content player to play ads
   // to avoid issues related to fullscreen management and autoplay
   // as fullscreen on iOS is handled by the default OS player
-  if (ENV.isIos[0] || (ENV.isMacOS[0] && ENV.isSafari[0]) || ENV.isIpadOS) {
+  if (ENV.isIos[0] || ENV.isMacOSSafari || ENV.isIpadOS) {
     this.useContentPlayerForAds = true;
     if (this.debug) {
       FW.log('vast player will be content player');