From 1f82229e8a3c4251ff4b725e4d0382698ef166c4 Mon Sep 17 00:00:00 2001
From: Vavency <vavency@gmail.com>
Date: Thu, 12 Jun 2025 22:04:19 +0300
Subject: [PATCH] [frontend] SkModPlayer re-add overdraw to mitigate GPU upload
 race condition.

---
 packages/frontend/src/components/SkModPlayer.vue | 8 +++++---
 1 file changed, 5 insertions(+), 3 deletions(-)

diff --git a/packages/frontend/src/components/SkModPlayer.vue b/packages/frontend/src/components/SkModPlayer.vue
index 4e694d1df5..41488fbc22 100644
--- a/packages/frontend/src/components/SkModPlayer.vue
+++ b/packages/frontend/src/components/SkModPlayer.vue
@@ -127,8 +127,8 @@ const player = ref(new ChiptuneJsPlayer(new ChiptuneJsConfig()));
 const maxRowNumbers = 0xFF;
 // Mainly used to hide race condition connected to canvas transfer to graphics buffer when software rendering.
 // Found that 2 is a good default but needs more testing.
-const overdraw = 0;
-const rowBuffer = 26 + overdraw;
+const overdraw = 2;
+const rowBuffer = 26 + (overdraw * 2);
 // It would be a great option for users to set themselves.
 const maxChannelLimit = 0xFF;
 let buffer = null;
@@ -204,6 +204,9 @@ function populateCanvasSlices () {
 }
 
 onMounted(() => {
+	// That 3 is a magic number for inline-grid re-alignment, if at any point sliceDisplay switches to grid remember to remove that 3.
+	if (sliceDisplay.value) sliceDisplay.value.style.top = -(overdraw * CHAR_HEIGHT + 3) + 'px';
+
 	player.value.load(url).then((result) => {
 		buffer = result;
 		try {
@@ -620,7 +623,6 @@ onDeactivated(() => {
 			position: relative;
 			background-color: black;
 			image-rendering: pixelated;
-			top: -3px;
 
 			.patternSlice {
 				image-rendering: pixelated;