From 5e783052a53bd4eff352bbd4150ed91cea87033f Mon Sep 17 00:00:00 2001
From: Jonathan Gamble <101470903+schlawg@users.noreply.github.com>
Date: Wed, 12 Feb 2025 17:09:36 -0600
Subject: [PATCH 1/3] fix bar flicker on android brave

can probably delete in a few months
---
 ui/round/src/clock/clockView.ts | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/ui/round/src/clock/clockView.ts b/ui/round/src/clock/clockView.ts
index f2532e71da680..b4fe9bdafe5f1 100644
--- a/ui/round/src/clock/clockView.ts
+++ b/ui/round/src/clock/clockView.ts
@@ -113,7 +113,9 @@ function showBar(ctrl: RoundController, color: Color) {
 
 export function updateElements(clock: ClockController, els: ClockElements, millis: Millis): void {
   if (els.time) els.time.innerHTML = formatClockTime(millis, clock.showTenths(millis), true, clock.opts.nvui);
-  if (els.bar) els.bar.style.transform = 'scale(' + clock.timeRatio(millis) + ',1)';
+  // 12/02/2025 Brave 1.74.51 android flickers the bar oninline transforms, even though .bar is display: none
+  if (els.bar && getComputedStyle(els.bar).display === 'block')
+    els.bar.style.transform = 'scale(' + clock.timeRatio(millis) + ',1)';
   if (els.clock) {
     const cl = els.clock.classList;
     if (millis < clock.emergMs) cl.add('emerg');

From 2d782467754c20b16439edb248f2845ad4e5ac78 Mon Sep 17 00:00:00 2001
From: Jonathan Gamble <101470903+schlawg@users.noreply.github.com>
Date: Wed, 12 Feb 2025 22:49:21 -0600
Subject: [PATCH 2/3] qualify window global

---
 ui/round/src/clock/clockView.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/ui/round/src/clock/clockView.ts b/ui/round/src/clock/clockView.ts
index b4fe9bdafe5f1..b9fde96ea2679 100644
--- a/ui/round/src/clock/clockView.ts
+++ b/ui/round/src/clock/clockView.ts
@@ -114,7 +114,7 @@ function showBar(ctrl: RoundController, color: Color) {
 export function updateElements(clock: ClockController, els: ClockElements, millis: Millis): void {
   if (els.time) els.time.innerHTML = formatClockTime(millis, clock.showTenths(millis), true, clock.opts.nvui);
   // 12/02/2025 Brave 1.74.51 android flickers the bar oninline transforms, even though .bar is display: none
-  if (els.bar && getComputedStyle(els.bar).display === 'block')
+  if (els.bar && window.getComputedStyle(els.bar).display === 'block')
     els.bar.style.transform = 'scale(' + clock.timeRatio(millis) + ',1)';
   if (els.clock) {
     const cl = els.clock.classList;

From 467e46bd27e987b766c1d7b3ba84863ea4a804ff Mon Sep 17 00:00:00 2001
From: Thibault Duplessis <t@lichess.org>
Date: Thu, 13 Feb 2025 10:16:52 +0100
Subject: [PATCH 3/3] try to avoid calling window.getComputedStyle 10x per
 second whenever possible

---
 ui/common/src/device.ts         | 6 ++----
 ui/round/src/clock/clockView.ts | 6 ++++--
 2 files changed, 6 insertions(+), 6 deletions(-)

diff --git a/ui/common/src/device.ts b/ui/common/src/device.ts
index dd3612d3ba717..d337bff62f7c0 100644
--- a/ui/common/src/device.ts
+++ b/ui/common/src/device.ts
@@ -66,11 +66,9 @@ export const isTouchDevice = (): boolean => !hasMouse(); // prefer isTouchDevice
 
 export const isMobile = (): boolean => isAndroid() || isIos();
 
-export const isAndroid = (): boolean => /Android/.test(navigator.userAgent);
+export const isAndroid: () => boolean = memoize(() => /Android/.test(navigator.userAgent));
 
-export const isIos: () => boolean = memoize<boolean>(
-  () => /iPhone|iPod/.test(navigator.userAgent) || isIPad(),
-);
+export const isIos: () => boolean = memoize(() => /iPhone|iPod/.test(navigator.userAgent) || isIPad());
 
 export const isIPad = (): boolean =>
   navigator?.maxTouchPoints > 2 && /iPad|Macintosh/.test(navigator.userAgent);
diff --git a/ui/round/src/clock/clockView.ts b/ui/round/src/clock/clockView.ts
index b9fde96ea2679..5b38e89191d01 100644
--- a/ui/round/src/clock/clockView.ts
+++ b/ui/round/src/clock/clockView.ts
@@ -7,6 +7,7 @@ import type { ClockElements, ClockController } from './clockCtrl';
 import type { Hooks } from 'snabbdom';
 import { looseH as h, type VNode, bind } from 'common/snabbdom';
 import type { Position } from '../interfaces';
+import { isAndroid, isCol1 } from 'common/device';
 
 export function renderClock(ctrl: RoundController, player: Player, position: Position): VNode {
   const clock = ctrl.clock!,
@@ -114,8 +115,9 @@ function showBar(ctrl: RoundController, color: Color) {
 export function updateElements(clock: ClockController, els: ClockElements, millis: Millis): void {
   if (els.time) els.time.innerHTML = formatClockTime(millis, clock.showTenths(millis), true, clock.opts.nvui);
   // 12/02/2025 Brave 1.74.51 android flickers the bar oninline transforms, even though .bar is display: none
-  if (els.bar && window.getComputedStyle(els.bar).display === 'block')
-    els.bar.style.transform = 'scale(' + clock.timeRatio(millis) + ',1)';
+  if (els.bar)
+    if (!isAndroid() || !isCol1() || window.getComputedStyle(els.bar).display === 'block')
+      els.bar.style.transform = 'scale(' + clock.timeRatio(millis) + ',1)';
   if (els.clock) {
     const cl = els.clock.classList;
     if (millis < clock.emergMs) cl.add('emerg');