From c50f1b64e574bc650d89585c8312538b9aa35687 Mon Sep 17 00:00:00 2001
From: ed <s@ocv.me>
Date: Fri, 18 Jun 2021 21:46:15 +0200
Subject: [PATCH] dodge android-chrome bug: canvas aspect ratio

---
 copyparty/httpconn.py    |  2 +-
 copyparty/web/browser.js | 39 +++++++++++++++++++++++++--------------
 copyparty/web/util.js    |  2 +-
 3 files changed, 27 insertions(+), 16 deletions(-)

diff --git a/copyparty/httpconn.py b/copyparty/httpconn.py
index 4dda1c13..97a07b39 100644
--- a/copyparty/httpconn.py
+++ b/copyparty/httpconn.py
@@ -172,7 +172,7 @@ class HttpConn(object):
                     self.log("client rejected our certificate (nice)")
 
                 elif "ALERT_CERTIFICATE_UNKNOWN" in em:
-                    # chrome-android keeps doing this
+                    # android-chrome keeps doing this
                     pass
 
                 else:
diff --git a/copyparty/web/browser.js b/copyparty/web/browser.js
index 8e429b22..66149002 100644
--- a/copyparty/web/browser.js
+++ b/copyparty/web/browser.js
@@ -298,7 +298,7 @@ var pbar = (function () {
 		gradh = -1,
 		grad;
 
-	function onresize() {
+	r.onresize = function () {
 		r.buf = canvas_cfg(ebi('barbuf'));
 		r.pos = canvas_cfg(ebi('barpos'));
 		r.drawbuf();
@@ -372,8 +372,8 @@ var pbar = (function () {
 		pctx.fillText(t2, xt2, yt);
 	};
 
-	window.addEventListener('resize', onresize);
-	onresize();
+	window.addEventListener('resize', r.onresize);
+	r.onresize();
 	return r;
 })();
 
@@ -384,7 +384,7 @@ var vbar = (function () {
 		gradh = -1,
 		can, ctx, w, h, grad1, grad2;
 
-	function onresize() {
+	r.onresize = function () {
 		r.can = canvas_cfg(ebi('pvol'));
 		can = r.can.can;
 		ctx = r.can.ctx;
@@ -403,8 +403,8 @@ var vbar = (function () {
 		ctx.fillStyle = grad2; ctx.fillRect(0, 0, w, h);
 		ctx.fillStyle = grad1; ctx.fillRect(0, 0, w * mp.vol, h);
 	};
-	window.addEventListener('resize', onresize);
-	onresize();
+	window.addEventListener('resize', r.onresize);
+	r.onresize();
 
 	var rect;
 	function mousedown(e) {
@@ -542,14 +542,23 @@ var mpui = (function () {
 		// indicate playback state in ui
 		widget.paused(mp.au.paused);
 
-		// draw current position in song
-		if (!mp.au.paused)
-			pbar.drawpos();
-
-		// occasionally draw buffered regions
-		if (++nth == 5) {
-			pbar.drawbuf();
+		if (++nth > 69) {
+			// android-chrome breaks aspect ratio with unannounced viewport changes
 			nth = 0;
+			if (is_touch) {
+				nth = 1;
+				pbar.onresize();
+				vbar.onresize();
+			}
+		}
+		else {
+			// draw current position in song
+			if (!mp.au.paused)
+				pbar.drawpos();
+
+			// occasionally draw buffered regions
+			if (++nth % 5 == 0)
+				pbar.drawbuf();
 		}
 
 		// preload next song
@@ -820,7 +829,7 @@ var audio_eq = (function () {
 // plays the tid'th audio file on the page
 function play(tid, seek, call_depth) {
 	if (mp.order.length == 0)
-		return alert('no audio found wait what');
+		return console.log('no audio found wait what');
 
 	var tn = tid;
 	if ((tn + '').indexOf('f-') === 0)
@@ -1087,6 +1096,8 @@ var thegrid = (function () {
 			lfiles.style.display = '';
 			gfiles.style.display = 'none';
 		}
+		pbar.onresize();
+		vbar.onresize();
 	};
 
 	var btnclick = function (e) {
diff --git a/copyparty/web/util.js b/copyparty/web/util.js
index 70dd0d9e..a3ca8481 100644
--- a/copyparty/web/util.js
+++ b/copyparty/web/util.js
@@ -6,7 +6,7 @@ if (!window['console'])
     };
 
 
-var clickev = window.Touch ? 'touchstart' : 'click',
+var is_touch = 'ontouchstart' in window,
     ANDROID = /(android)/i.test(navigator.userAgent);