chalwheel now 'fits to screen' instead of 'stretching' on widscreen formats

scripts/songselect/chalwheel.lua

@@ -25,8 +25,9 @@ local effector = 0
 local searchText = gfx.CreateLabel("", 5, 0)
 local searchIndex = 1
 
-local backgroundImage = gfx.CreateSkinImage("challenge_select/bg.png", 0)
-local challengeCardBG = gfx.CreateSkinImage("challenge_select/small_box.png", 0)
+local backgroundImage = gfx.CreateSkinImage("bg_pattern.png", gfx.IMAGE_REPEATX | gfx.IMAGE_REPEATY)
+local challengeBGImage = gfx.CreateSkinImage("challenge_select/bg.png", 0)
+local challengeCardBGImage = gfx.CreateSkinImage("challenge_select/small_box.png", 0)
 
 local jacketFallback = gfx.CreateSkinImage("song_select/loading.png", 0)
 local showGuide = game.GetSkinSetting("show_guide")
@@ -117,39 +118,21 @@ get_page_size = function()
     return math.floor(wheelSize / 2)
 end
 
--- Responsive UI variables
+-- Window variables
+local resX, resY
+
 -- Aspect Ratios
-local aspectFloat = 1.0
-local aspectRatio = "widescreen"
 local landscapeWidescreenRatio = 16 / 9
 local landscapeStandardRatio = 4 / 3
 local portraitWidescreenRatio = 9 / 16
 
--- Responsive sizes
-local fifthX = 0
-local fourthX = 0
-local thirdX = 0
-local halfX = 0
-local fullX = 0
+-- Portrait sizes
+local fullX, fullY
 
-local fifthY = 0
-local fourthY = 0
-local thirdY = 0
-local halfY = 0
-local fullY = 0
-
-adjustScreen = function(x, y)
-    aspectFloat = x / y;
-    fifthX = x / 5
-    fourthX = x / 4
-    thirdX = x / 3
-    halfX = x / 2
-    fullX = x
-
-    fifthY = y / 5
-    fourthY = y / 4
-    thirdY = y / 3
-    halfY = y / 2
+local resolutionChange = function(x, y)
+    resX = x
+    resY = y
+    fullX = portraitWidescreenRatio * y
     fullY = y
 end
 
@@ -207,7 +190,7 @@ draw_challenge = function(challenge, x, y, w, h, selected)
 
     local _draw_card_bg = function()
         gfx.BeginPath()
-        gfx.ImageRect(x, y, w, h, challengeCardBG, 1, 0)
+        gfx.ImageRect(x, y, w, h, challengeCardBGImage, 1, 0)
     end
 
     local _draw_info = function()
@@ -400,13 +383,11 @@ draw_chalwheel = function(x, y, w, h)
     local challengeAspect = 4.367
     local selectedChallengeAspect = 3.305
 
-    local portraitAspectCorrection = portraitWidescreenRatio / aspectFloat
-
     local width = math.floor(w * 0.839)
-    local height = math.floor((width / challengeAspect) * portraitAspectCorrection)
+    local height = math.floor(width / challengeAspect)
 
     local selectedWidth = math.floor(w * 0.944)
-    local selectedHeight = math.floor((selectedWidth / selectedChallengeAspect) * portraitAspectCorrection)
+    local selectedHeight = math.floor(selectedWidth / selectedChallengeAspect)
 
     local offsetX = w / 2 - width / 2 -- center
     local centerY = h / 2 - height / 2
@@ -504,22 +485,28 @@ draw_search = function(x, y, w, h)
 end
 
 render = function(deltaTime)
-    timer = (timer + deltaTime)
-    timer = timer % 2
-    resx, resy = game.GetResolution();
-
-    gfx.BeginPath()
-    gfx.ImageRect(0, 0, resx, resy, backgroundImage, 1, 0)
-    adjustScreen(resx, resy);
-
-    gfx.BeginPath();
-    gfx.LoadSkinFont("dfmarugoth.ttf");
-    gfx.FontSize(40);
-    gfx.FillColor(255, 255, 255);
-    if chalwheel.challenges and chalwheel.challenges[1] then
-        -- draw chalwheel
-        draw_chalwheel(0, 0, fullX, fullY)
+    -- detect resolution change
+    local resx, resy = game.GetResolution();
+    if resx ~= resX or resy ~= resY then
+        resolutionChange(resx, resy)
     end
+
+    -- draw background image
+    gfx.BeginPath()
+    bgImageWidth, bgImageHeight = gfx.ImageSize(backgroundImage)
+    gfx.Rect(0, 0, resX, resY)
+    gfx.FillPaint(gfx.ImagePattern(0, 0, bgImageWidth, bgImageHeight, 0, backgroundImage, 0.2))
+    gfx.Fill()
+
+    if chalwheel.challenges and chalwheel.challenges[1] then
+        -- draw surface background
+        gfx.BeginPath()
+        gfx.ImageRect((resX - fullX) / 2, 0, fullX, fullY, challengeBGImage, 1, 0)
+
+        -- draw chalwheel
+        gfx.BeginPath();
+        draw_chalwheel((resX - fullX) / 2, 0, fullX, fullY)
+    
         -- Draw Legend Information
         --[[
         if showGuide then
@@ -546,6 +533,7 @@ render = function(deltaTime)
         gfx.ForceRender()
         --]]
     end
+end
 
 set_index = function(newIndex, scrollamt)
     if newIndex ~= selectedIndex then