BEEEG "reimplementation" of service screen

new pager/page management library
This commit is contained in:
Hersi 2022-04-03 01:35:41 +02:00
parent e19763a9bf
commit b1649fa80f
11 changed files with 371 additions and 216 deletions

View File

@ -0,0 +1,63 @@
---@class Field
---@field parent Page
---@field posX number
---@field posY number
local Field = {
drawCustomFooter = nil, ---@type function void()
handleButtonInput = nil, ---@type function void(integer number)
handleKnobInput = nil, ---@type function void(integer knob, number delta)
}
---Create a new Field instance
---@param o table
---@return Field
function Field:new(o)
self.__index = self -- self refers to Field, not the instance
o = o or {} -- o is the instance of Field
setmetatable(o, self)
--set instance members
o.parent = o.parent or nil
o.posX = o.posX or 0
o.posY = o.posY or 0
return o
end
function Field:render(deltaTime)
gfx.Save()
gfx.Translate(self.posX, self.posY)
gfx.BeginPath()
gfx.FillColor(255, 0, 128, 192)
gfx.StrokeColor(0, 0, 0)
gfx.StrokeWidth(2)
gfx.Rect(-50, -50, 100, 100)
gfx.Fill()
gfx.Stroke()
gfx.BeginPath()
gfx.MoveTo(-50, 0)
gfx.LineTo(50, 0)
gfx.MoveTo(0, -50)
gfx.LineTo(0, 50)
gfx.StrokeColor(0, 0, 0, 64)
gfx.StrokeWidth(2)
gfx.Stroke()
local fontSize = 18
local fontMargin = 4
gfx.BeginPath()
gfx.FontSize(fontSize)
gfx.LoadSkinFont("dfmarugoth.ttf")
gfx.FillColor(0, 0, 0)
gfx.TextAlign(gfx.TEXT_ALIGN_CENTER | gfx.TEXT_ALIGN_MIDDLE)
gfx.Text("TEXTURE", 0, -fontSize / 2 - fontMargin)
gfx.Text("MISSING", 0, fontSize / 2 + fontMargin)
gfx.Restore()
end
return Field

View File

@ -0,0 +1,76 @@
---@class Page
---@field content Field[]
---@field viewHandler nil|PageView
local Page = {
drawBackground = nil, ---@type nil|function void(number deltaTime)
drawHeader = nil, ---@type nil|function void(number deltaTime)
drawFooter = nil, ---@type nil|function void(number deltaTime)
}
---Create a new Page instance
---@param o? table
---@return Page
function Page:new(o)
self.__index = self
o = o or {}
setmetatable(o, self)
--set instance members
o.content = o.content or {}
o.viewHandler = o.viewHandler or nil
return o
end
---Add field to page
---@param field Field
function Page:addField(field)
field.parent = self
table.insert(self.content, field)
end
---Handle controller button input
---
---Overload this function to implement page-specific behaviour
---@param button integer
function Page:handleButtonInput(button)
if button == game.BUTTON_BCK then
if self.viewHandler then
self.viewHandler:back()
end
end
end
---Handle controller knob input
---
---Overload this function to implement page-specific behaviour
---@param knob integer
---@param delta number
function Page:handleKnobInput(knob, delta) end
---Render page
---@param deltaTime number frametime in seconds
function Page:render(deltaTime)
---background
if self.drawBackground then
self:drawBackground(deltaTime)
end
--render children
for _, child in ipairs(self.content) do
child:render(deltaTime)
end
---header
if self.drawHeader then
self:drawHeader(deltaTime)
end
---footer
if self.drawFooter then
self:drawFooter(deltaTime)
end
end
return Page

View File

@ -0,0 +1,60 @@
---@class PageView
---@field pageStack Page[]
local PageView = {}
local function pushStack(t, o)
table.insert(t, 1, o)
end
local function popStack(t)
return table.remove(t, 1)
end
---Create a new PageView instance
---@param rootPage Page
---@return PageView
function PageView:new(rootPage)
self.__index = self
local o = {}
setmetatable(o, self)
--set viewHandler as this instance for rootPage
rootPage.viewHandler = o
--set instance members
o.pageStack = {}
pushStack(o.pageStack, rootPage)
return o
end
---Navigate to page
---@param page Page
function PageView:navigate(page)
page.viewHandler = self
pushStack(self.pageStack, page)
end
---Navigate to the previous page
function PageView:back()
if not self.pageStack[1] then
game.Log("PageView:back() : pageStack empty, cannot go back", game.LOGGER_WARNING)
return
end
self.pageStack[1].viewHandler = nil
popStack(self.pageStack)
end
function PageView:render(deltaTime)
if not self.pageStack[1] then
-- pageStack empty, cannot render, but do not error out, also do not log every frame
return
else
self.pageStack[1]:render(deltaTime)
end
end
return PageView

View File

@ -72,6 +72,9 @@ local function handleScreenResponse(res)
return
end
currentScreen = screens[res.toScreen]
if currentScreen.screen.reset then
currentScreen.screen.reset()
end
end
end

View File

@ -1,6 +1,11 @@
local Dim = require("common.dimensions")
local Wallpaper = require("components.wallpaper")
local PageView = require("components.pager.pageview")
local ServicePage = require("titlescreen.service.servicepage")
local Field = require("components.pager.field")
--[[ WIP: REIMPLEMENTATION
local triggerSplashScreen = false
local updateUrl, updateVersion = game.UpdateAvailable()
@ -195,9 +200,29 @@ local rootMenu = {
{label = "BACK TO TITLE SCREEN", type = "back", handler = function() triggerSplashScreen = true end},
}
local menu = rootMenu
local index = 1
]]
local pages = {
root = {
page = ServicePage:new{title="MAIN MENU"},
fields = {
Field:new(),
Field:new(),
Field:new(),
}
},
}
for _, field in ipairs(pages.root.fields) do
pages.root.page:addField(field)
end
local pageview = PageView:new(pages.root.page)
local function reset()
pageview = PageView:new(pages.root.page)
end
local function render(deltaTime)
Dim.updateResolution()
@ -206,6 +231,10 @@ local function render(deltaTime)
Dim.transformToScreenSpace()
pageview:render(deltaTime)
--[[ WIP: REIMPLEMENTATION
gfx.BeginPath()
gfx.FillColor(0, 0, 0, 255)
gfx.Rect(0, 0, 1080, 1920)
@ -245,43 +274,15 @@ local function render(deltaTime)
gfx.Text(menuItem.label, 100, yOffset)
end
if (triggerSplashScreen) then
triggerSplashScreen = false
]]
if not pageview.pageStack[1] then
return {eventType = "switch", toScreen = "splash"}
end
end
local onButtonPressed = function(button)
local direction = 0
if button == game.BUTTON_STA then
if (menu[index].handler) then
menu[index].handler()
elseif menu[index].children ~= nil then
menu = menu[index].children
index = 1
-- If the back button does not exist, add it.
if (menu[#menu].type ~= "back") then
menu[#menu + 1] = {
type = "back",
label = "BACK TO MAIN MENU",
handler = function()
index = 1
menu = rootMenu
end,
}
end
end
elseif button == game.BUTTON_BTA then
direction = -1
elseif button == game.BUTTON_BTB then
direction = 1
end
index = (index - 1 + direction) % #menu + 1
local function onButtonPressed(button)
pageview.pageStack[1]:handleButtonInput(button)
end
return {render = render, onButtonPressed = onButtonPressed}
return {reset = reset, render = render, onButtonPressed = onButtonPressed}

View File

@ -1,51 +0,0 @@
local dim = require("common.dimensions")
PAGE_DEFAULT_FONT_SIZE = 24
PAGE_DEFAULT_FONT_FACE = "dfmarugoth.ttf"
PAGE_DEFAULT_FONT_COLOR = {255, 255, 255, 255}
PAGE_DEFAULT_MARGIN = {72, 24, 0, 56} --{left, top, right, bottom}
PAGE_DEFAULT_SPACING = 4
PAGE_DEFAULT_FOOTER = {
"BT-A/BT-B = UP/DOWN",
"START = SELECT",
"BACK = RETURN TO LAST PAGE"
}
function DrawPageFooter(footer)
local bottomPageMargin = PAGE_DEFAULT_MARGIN[4]
local lineHeight = PAGE_DEFAULT_FONT_SIZE + PAGE_DEFAULT_SPACING
gfx.BeginPath()
gfx.FontSize(PAGE_DEFAULT_FONT_SIZE)
gfx.LoadSkinFont(PAGE_DEFAULT_FONT_FACE)
gfx.FillColor(table.unpack(PAGE_DEFAULT_FONT_COLOR))
gfx.TextAlign(gfx.TEXT_ALIGN_CENTER | gfx.TEXT_ALIGN_BOTTOM)
if type(footer) == "table" then
for index, line in ipairs(footer) do
local yFooterBase = dim.design.height - bottomPageMargin - #footer * lineHeight
gfx.Text(line, 1080 / 2, yFooterBase + (index-1) * lineHeight)
end
elseif type(footer) == "string" then
local yFooterBase = dim.design.height - bottomPageMargin
gfx.Text(footer, 1080 / 2, yFooterBase)
end
end
---Default button input handler
---@param page Page
---@param button integer
function HandlePageButtonInput(page, button)
local direction = 0
if button == game.BUTTON_BCK then
page.viewHandler:back()
return
end
if button == game.BUTTON_BTA then
direction = -1
elseif button == game.BUTTON_BTB then
direction = 1
end
page.selectedIdx = (page.selectedIdx - 1 + direction) % #page.fields + 1
end

View File

@ -1,29 +0,0 @@
require("titlescreen.service.common")
---@class Field
local Field = {
label = "",
parent = nil, ---@type Page
drawCustomFooter = nil, ---@type function void()
handleButtonInput = nil, ---@type function void(integer number)
handleKnobInput = nil, ---@type function void(integer knob, number delta)
}
function Field:new(o, label)
o = o or {}
setmetatable(o, self)
self.__index = self
self.label = label or ""
return o
end
function Field:render(deltaTime)
gfx.BeginPath()
gfx.FontSize(PAGE_DEFAULT_FONT_SIZE)
gfx.LoadSkinFont(PAGE_DEFAULT_FONT_FACE)
gfx.FillColor(table.unpack(PAGE_DEFAULT_FONT_COLOR))
gfx.TextAlign(gfx.TEXT_ALIGN_LEFT | gfx.TEXT_ALIGN_BOTTOM)
gfx.Text("<undefined>", 0, 0)
end
return Field

View File

@ -1,59 +0,0 @@
require("titlescreen.service.common")
---@class Page
local Page = {
title = "",
selectedIdx = 0,
fields = {}, ---@type Field[]
footer = PAGE_DEFAULT_FOOTER,
viewHandler = nil ---@type PageView
}
function Page:new(o, parent, title)
o = o or {}
setmetatable(o, self)
self.__index = self
self.parent = parent or nil
self.title = title or ""
return o
end
---Add field to page
---@param field Field
function Page:addField(field)
field.parent = self
table.insert(self.fields, field)
end
function Page:handleButtonInput(button)
if self.fields[selectedIndex] and self.fields[selectedIndex].handleButtonInput then
self.fields[selectedIndex].handleButtonInput(button)
else
HandlePageButtonInput(self, button)
end
end
function Page:handleKnobInput(knob, delta)
if self.fields[selectedIndex] and self.fields[selectedIndex].handleKnobInput then
self.fields[selectedIndex].handleKnobInput(knob, delta)
end
end
function Page:render(deltaTime)
--render page stuff
---background
---header
---footer
if self.fields[selectedIndex] and self.fields[selectedIndex].drawCustomFooter then
self.fields[selectedIndex].drawCustomFooter()
else
DrawPageFooter(self.footer)
end
--render children
for _, field in ipairs(self.fields) do
field.render(deltaTime)
end
end
return Page

View File

@ -1,40 +0,0 @@
---@class PageView
local PageView = {
pageStack = {} ---@type Page[]
}
local function pushStack(t, o)
table.insert(t, 1, o)
end
local function popStack(t)
return table.remove(t, 1)
end
function PageView:new(o, rootPage)
o = o or {}
setmetatable(o, self)
self.__index = self
rootPage.viewHandler = self
pushStack(self.pageStack, rootPage)
end
---Navigate to page
---@param page Page
function PageView:navigate(page)
page.viewHandler = self
pushStack(self.pageStack, page)
end
function PageView:back()
self.pageStack[1].viewHandler = nil
popStack(self.pageStack)
end
function PageView:render(deltaTime)
if self.pageStack[1] then
self.pageStack[1].render(deltaTime)
end
end
return PageView

View File

@ -0,0 +1,124 @@
local dim = require("common.dimensions")
local Page = require("components.pager.page")
---@class ServicePage: Page
---@field title string
---@field selectedIdx integer
---@field footer string[]
local ServicePage = {
SERVICE_DEFAULT_FONT_SIZE = 24,
SERVICE_DEFAULT_FONT_FACE = "dfmarugoth.ttf",
SERVICE_DEFAULT_FONT_COLOR = {255, 255, 255, 255}, --{r, g, b, a}
SERVICE_DEFAULT_MARGIN = {92, 128, 0, 56}, --{left, top, right, bottom}
SERVICE_DEFAULT_SPACING = 4,
SERVICE_DEFAULT_FOOTER = {
"BT-A/BT-B = UP/DOWN",
"START = SELECT",
"BACK = RETURN TO LAST PAGE"
}
}
---Create a new ServicePage instance
---
---Inherits from Page
---@return ServicePage
function ServicePage:new(o)
self.__index = self
setmetatable(self, {__index = Page})
o = Page:new(o)
setmetatable(o, self)
o.title = o.title or ""
o.selectedIdx = o.selectedIdx or 0
o.footer = o.footer or self.SERVICE_DEFAULT_FOOTER
return o
end
---Add field to page
---@param field Field
function ServicePage:addField(field)
field.posX = ServicePage.SERVICE_DEFAULT_MARGIN[1]
field.posY = ServicePage.SERVICE_DEFAULT_MARGIN[2] + #self.content * (ServicePage.SERVICE_DEFAULT_FONT_SIZE + ServicePage.SERVICE_DEFAULT_SPACING)
Page.addField(self, field)
end
function ServicePage:drawBackground(deltaTime)
gfx.BeginPath()
gfx.FillColor(0, 0, 0)
gfx.Rect(0, 0, dim.design.width, dim.design.height)
gfx.Fill()
end
function ServicePage:drawHeader(deltaTime)
gfx.BeginPath()
gfx.FontSize(ServicePage.SERVICE_DEFAULT_FONT_SIZE)
gfx.LoadSkinFont(ServicePage.SERVICE_DEFAULT_FONT_FACE)
gfx.FillColor(table.unpack(ServicePage.SERVICE_DEFAULT_FONT_COLOR))
gfx.TextAlign(gfx.TEXT_ALIGN_CENTER | gfx.TEXT_ALIGN_TOP)
gfx.Text(self.title, dim.design.width / 2, ServicePage.SERVICE_DEFAULT_FONT_SIZE)
end
function ServicePage:drawFooter(deltaTime)
if self.content[selectedIndex] and self.content[selectedIndex].drawCustomFooter then
self.content[selectedIndex].drawCustomFooter(deltaTime)
else
local bottomPageMargin = ServicePage.SERVICE_DEFAULT_MARGIN[4]
local lineHeight = ServicePage.SERVICE_DEFAULT_FONT_SIZE + ServicePage.SERVICE_DEFAULT_SPACING
gfx.BeginPath()
gfx.FontSize(ServicePage.SERVICE_DEFAULT_FONT_SIZE)
gfx.LoadSkinFont(ServicePage.SERVICE_DEFAULT_FONT_FACE)
gfx.FillColor(table.unpack(ServicePage.SERVICE_DEFAULT_FONT_COLOR))
gfx.TextAlign(gfx.TEXT_ALIGN_CENTER | gfx.TEXT_ALIGN_BOTTOM)
if type(self.footer) == "table" then
for index, line in ipairs(self.footer) do
local yFooterBase = dim.design.height - bottomPageMargin - #self.footer * lineHeight
gfx.Text(line, 1080 / 2, yFooterBase + (index-1) * lineHeight)
end
elseif type(self.footer) == "string" then
local yFooterBase = dim.design.height - bottomPageMargin
gfx.Text(self.footer, 1080 / 2, yFooterBase)
end
end
end
---Handle controller button input
---@param button integer
function ServicePage:handleButtonInput(button)
local stop_processing = false
if self.content[selectedIndex] and self.content[selectedIndex].handleButtonInput then
stop_processing = self.content[selectedIndex].handleButtonInput(button)
end
-- default behaviour
if not stop_processing then
local direction = 0
if button == game.BUTTON_BCK then
if self.viewHandler then
self.viewHandler:back()
end
return
end
if button == game.BUTTON_BTA then
direction = -1
elseif button == game.BUTTON_BTB then
direction = 1
end
self.selectedIdx = (self.selectedIdx - 1 + direction) % #self.content + 1
end
end
---Handle controller knob input
---@param knob integer
---@param delta number
function ServicePage:handleKnobInput(knob, delta)
if self.content[selectedIndex] and self.content[selectedIndex].handleKnobInput then
self.content[selectedIndex].handleKnobInput(knob, delta)
end
end
return ServicePage

View File

@ -126,9 +126,15 @@ local function splash2(deltaTime)
splashTimer = splashTimer - deltaTime
end
local function reset()
triggerSkip = false
splashState = "init"
splashTimer = 0
end
function render(deltaTime)
if triggerSkip then
triggerSkip = false
reset()
game.StopSample("titlescreen/splash/splash1.wav")
return {
eventType = "switch",
@ -154,6 +160,7 @@ function render(deltaTime)
elseif splashState == "splash2" then
splash2(deltaTime)
elseif splashState == "done" then
reset()
return {
eventType = "switch",
toScreen = "title"