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 backgroundImage = gfx.CreateSkinImage("bg_pattern.png", gfx.IMAGE_REPEATX | gfx.IMAGE_REPEATY)
-local challengeCardBG = gfx.CreateSkinImage("challenge_select/small_box.png", 0)
+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
+-- Portrait sizes
-local fifthX = 0
+local fullX, fullY
-local fourthX = 0
-local thirdX = 0
-local halfX = 0
-local fullX = 0
 
-local fifthY = 0
+local resolutionChange = function(x, y)
-local fourthY = 0
+    resX = x
-local thirdY = 0
+    resY = y
-local halfY = 0
+    fullX = portraitWidescreenRatio * y
-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
     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,47 +485,54 @@ draw_search = function(x, y, w, h)
 end
 
 render = function(deltaTime)
-    timer = (timer + deltaTime)
+    -- detect resolution change
-    timer = timer % 2
+    local resx, resy = game.GetResolution();
-    resx, resy = game.GetResolution();
+    if resx ~= resX or resy ~= resY then
+        resolutionChange(resx, resy)
+    end
 
+    -- draw background image
     gfx.BeginPath()
-    gfx.ImageRect(0, 0, resx, resy, backgroundImage, 1, 0)
+    bgImageWidth, bgImageHeight = gfx.ImageSize(backgroundImage)
-    adjustScreen(resx, resy);
+    gfx.Rect(0, 0, resX, resY)
+    gfx.FillPaint(gfx.ImagePattern(0, 0, bgImageWidth, bgImageHeight, 0, backgroundImage, 0.2))
+    gfx.Fill()
 
-    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 surface background
-        draw_chalwheel(0, 0, fullX, fullY)
-    end
-    -- Draw Legend Information
-    --[[
-    if showGuide then
-        draw_legend(0, (fifthY / 3) * 14, fullX, (fifthY / 3) * 1)
-    end
-    --]]
-
-    -- draw text search
-
-    --[[
-    draw_search(fifthX * 2, 5, fifthX * 3, fifthY / 5)
-
-    doffset = doffset * 0.9
-    soffset = soffset * 0.8
-    if chalwheel.searchStatus then
         gfx.BeginPath()
-        gfx.FillColor(255, 255, 255)
+        gfx.ImageRect((resX - fullX) / 2, 0, fullX, fullY, challengeBGImage, 1, 0)
-        gfx.FontSize(20);
+
-        gfx.TextAlign(gfx.TEXT_ALIGN_LEFT + gfx.TEXT_ALIGN_TOP)
+        -- draw chalwheel
-        gfx.Text(chalwheel.searchStatus, 3, 3)
+        gfx.BeginPath();
+        draw_chalwheel((resX - fullX) / 2, 0, fullX, fullY)
+    
+        -- Draw Legend Information
+        --[[
+        if showGuide then
+            draw_legend(0, (fifthY / 3) * 14, fullX, (fifthY / 3) * 1)
+        end
+        --]]
+
+        -- draw text search
+
+        --[[
+        draw_search(fifthX * 2, 5, fifthX * 3, fifthY / 5)
+
+        doffset = doffset * 0.9
+        soffset = soffset * 0.8
+        if chalwheel.searchStatus then
+            gfx.BeginPath()
+            gfx.FillColor(255, 255, 255)
+            gfx.FontSize(20);
+            gfx.TextAlign(gfx.TEXT_ALIGN_LEFT + gfx.TEXT_ALIGN_TOP)
+            gfx.Text(chalwheel.searchStatus, 3, 3)
+        end
+        gfx.LoadSkinFont("dfmarugoth.ttf");
+        gfx.ResetTransform()
+        gfx.ForceRender()
+        --]]
     end
-    gfx.LoadSkinFont("dfmarugoth.ttf");
-    gfx.ResetTransform()
-    gfx.ForceRender()
-    --]]
 end
 
 set_index = function(newIndex, scrollamt)