Merge pull request #272 from rdkcentral/dev

Dev

Author: wouterlucas

CHANGELOG.md

@@ -1,5 +1,14 @@
 # Changelog
 
+## v4.7.0
+
+*20 oct 2021*
+
+- Fixed issues with playing Video as a texture (#189)
+- Added (semi private) getter for consumer to VideoPlayer plugin
+- Added error handling (by firing an error to the consumer) when play() on the video tag returns an error (with a Promise wrapper fallback for older browsers)
+- Added fix that allows periods to be used in a Router hash
+
 ## v4.6.1
 
 *30 aug 2021*

docs/changelog.md

@@ -1,5 +1,14 @@
 # Changelog
 
+## v4.7.0
+
+*20 oct 2021*
+
+- Fixed issues with playing Video as a texture (#189)
+- Added (semi private) getter for consumer to VideoPlayer plugin
+- Added error handling (by firing an error to the consumer) when play() on the video tag returns an error (with a Promise wrapper fallback for older browsers)
+- Added fix that allows periods to be used in a Router hash
+
 ## v4.6.1
 
 *30 aug 2021*

docs/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lightningjs/sdk",
-  "version": "4.6.1",
+  "version": "4.7.0",
   "license": "Apache-2.0",
   "scripts": {
     "postinstall": "node ./scripts/postinstall.js",
@@ -23,6 +23,7 @@
   "dependencies": {
     "@babel/polyfill": "^7.11.5",
     "@lightningjs/core": "*",
+    "@michieljs/execute-as-promise": "^1.0.0",
     "deepmerge": "^4.2.2",
     "localCookie": "github:WebPlatformForEmbedded/localCookie",
     "shelljs": "^0.8.4",

package-lock.json

@@ -1,6 +1,6 @@
 {
   "name": "@lightningjs/sdk",
-  "version": "4.6.1",
+  "version": "4.7.0",
   "license": "Apache-2.0",
   "scripts": {
     "postinstall": "node ./scripts/postinstall.js",
@@ -23,6 +23,7 @@
   "dependencies": {
     "@babel/polyfill": "^7.11.5",
     "@lightningjs/core": "*",
+    "@michieljs/execute-as-promise": "^1.0.0",
     "deepmerge": "^4.2.2",
     "localCookie": "github:WebPlatformForEmbedded/localCookie",
     "shelljs": "^0.8.4",

package.json

@@ -150,7 +150,7 @@ export const getValuesFromHash = (hash = '', path) => {
   // we already did the matching part
   path = stripRegex(path, '')
 
-  const getUrlParts = /(\/?:?[\w%\s:-]+)/g
+  const getUrlParts = /(\/?:?[\w%\s:.-]+)/g
   const hashParts = hash.match(getUrlParts) || []
   const routeParts = path.match(getUrlParts) || []
   const getNamedGroup = /^\/:([\w-]+)\/?/

src/Router/utils/route.js

@@ -74,16 +74,21 @@ export default class VideoTexture extends Lightning.Component {
 
   start() {
     const stage = this.stage
+    this._lastTime = 0
     if (!this._updateVideoTexture) {
       this._updateVideoTexture = () => {
         if (this.videoTexture.options.source && this.videoEl.videoWidth && this.active) {
           const gl = stage.gl
 
           const currentTime = new Date().getTime()
+          const getVideoPlaybackQuality = this.videoEl.getVideoPlaybackQuality()
 
           // When BR2_PACKAGE_GST1_PLUGINS_BAD_PLUGIN_DEBUGUTILS is not set in WPE, webkitDecodedFrameCount will not be available.
           // We'll fallback to fixed 30fps in this case.
-          const frameCount = this.videoEl.webkitDecodedFrameCount
+          // As 'webkitDecodedFrameCount' is about to deprecate, check for the 'totalVideoFrames'
+          const frameCount = getVideoPlaybackQuality
+            ? getVideoPlaybackQuality.totalVideoFrames
+            : this.videoEl.webkitDecodedFrameCount
 
           const mustUpdate = frameCount
             ? this._lastFrame !== frameCount

src/VideoPlayer/VideoTexture.js

@@ -17,6 +17,8 @@
  * limitations under the License.
  */
 
+import executeAsPromise from '@michieljs/execute-as-promise'
+
 import Metrics from '../Metrics'
 import Log from '../Log'
 import Ads from '../Ads'
@@ -233,11 +235,15 @@ const videoPlayerPlugin = {
         state.playingAds = true
         ads.prerolls().then(() => {
           state.playingAds = false
-          loader(url, videoEl, config).then(() => {
-            registerEventListeners()
-            this.show()
-            this.play()
-          })
+          loader(url, videoEl, config)
+            .then(() => {
+              registerEventListeners()
+              this.show()
+              this.play()
+            })
+            .catch(e => {
+              fireOnConsumer('error', { videoElement: videoEl, event: e })
+            })
         })
       })
     }
@@ -279,7 +285,9 @@ const videoPlayerPlugin = {
   play() {
     if (!this.canInteract) return
     if (textureMode === true) videoTexture.start()
-    videoEl.play()
+    executeAsPromise(videoEl.play, null, videoEl).catch(e => {
+      fireOnConsumer('error', { videoElement: videoEl, event: e })
+    })
   },
 
   pause() {
@@ -424,6 +432,10 @@ const videoPlayerPlugin = {
   get _videoEl() {
     return videoEl
   },
+
+  get _consumer() {
+    return consumer
+  },
 }
 
 export default autoSetupMixin(videoPlayerPlugin, () => {