From fadaec7d56ac49650bd6e170b28d2ccfe5556262 Mon Sep 17 00:00:00 2001
From: Pranam Lashkari <lpranam@collabora.com>
Date: Fri, 8 Sep 2023 05:44:13 +0800
Subject: [PATCH] browser: notify user for unsupported video

detect if video is able to play via checking if any frames are decoded,
in other cases(i.e: file not found or corrupted file) check for the errors in source and video

Signed-off-by: Pranam Lashkari <lpranam@collabora.com>
Change-Id: I22bfc836a98ec0eb2caa58b89332b2531d69d18f
---
 browser/src/layer/vector/SVGGroup.js     | 49 ++++++++++++++++++++++++
 browser/src/map/handler/Map.SlideShow.js |  6 +++
 2 files changed, 55 insertions(+)

diff --git a/browser/src/layer/vector/SVGGroup.js b/browser/src/layer/vector/SVGGroup.js
index f347f95940af7..cd0a4f09e83fc 100644
--- a/browser/src/layer/vector/SVGGroup.js
+++ b/browser/src/layer/vector/SVGGroup.js
@@ -3,6 +3,8 @@
  * L.SVGGroup
  */
 
+/* global _ */
+
 L.SVGGroup = L.Layer.extend({
 
 	options: {
@@ -78,6 +80,53 @@ L.SVGGroup = L.Layer.extend({
 		var point = this._map.latLngToLayerPoint(this._bounds.getNorthWest());
 		svgLastChild.setAttribute('x', point.x);
 		svgLastChild.setAttribute('y', point.y);
+
+		var video = svgLastChild.getElementsByTagName('video')[0];
+		var source = svgLastChild.getElementsByTagName('source')[0];
+		this.checkVideoSupport(video, source);
+	},
+
+	checkVideoSupport: function(video,source, videos) {
+		var that = this;
+
+		if (video) {
+			video.addEventListener('playing', function() {
+				window.setTimeout(function() {
+					if (video.webkitDecodedFrameCount === 0) {
+						that.showUnsupportedVideoWarning();
+					}
+				}, 1000);
+			});
+
+			video.addEventListener('error', function() {
+				that.showUnsupportedVideoWarning();
+			});
+		}
+
+		if (source) {
+			source.addEventListener('error', function() {
+				that.showUnsupportedVideoWarning();
+			});
+		}
+
+		if (videos) { // slide show may have more than one video and it does not require any selection
+			for (var i = 0; i < videos.length; i++) {
+				if (videos[i].networkState === 3) { // 3 = NETWORK_NO_SOURCE = No HTMLMediaElement src found
+					this.showUnsupportedVideoWarning();
+					break;
+				}
+				var source = videos[i].getElementsByTagName('source')[0];
+				source.addEventListener('error', function() {
+					this.showUnsupportedVideoWarning();
+				});
+			}
+		}
+
+	},
+
+	showUnsupportedVideoWarning: function() {
+		var videoWarning = _('Document contains unsupported video');
+		this._map.uiManager.showSnackbar(videoWarning);
 	},
 
 	addEmbeddedSVG: function (svgString) {
diff --git a/browser/src/map/handler/Map.SlideShow.js b/browser/src/map/handler/Map.SlideShow.js
index 44b1bbf7108b8..ce88d52ee12c4 100644
--- a/browser/src/map/handler/Map.SlideShow.js
+++ b/browser/src/map/handler/Map.SlideShow.js
@@ -115,6 +115,12 @@ L.Map.SlideShow = L.Handler.extend({
 		var separator = (this._slideURL.indexOf('?') === -1) ? '?' : '&';
 		this._slideShow.src = this._slideURL + separator + 'StartSlideNumber=' + this._startSlideNumber;
 		this._slideShow.contentWindow.focus();
+
+		var that = this;
+		this._slideShow.addEventListener('load', function() {
+			var videos = that._slideShow.contentWindow.document.getElementsByTagName('video');
+			L.SVGGroup.prototype.checkVideoSupport(undefined, undefined, videos);
+		});
 	},
 
 	_processSlideshowLinks: function() {