Tuto tiny-ecs beatemup Part 3 transitions menu options

We quickly go through the Transitions Class, the Menu scene and the Options scene as they were covered in the Gideros Game Template1 Tutorial and we are only getting started ;-)

the transitions.lua file

In the init.lua file we initialize some global variables.

In this file we initialize:

• the plugins for our game
• some global app variables, like the user screen size and the app size (mobile friendly)
• we also setup our fonts variables here because we may use them in more than one scene
• we setup a table to hold the overall theme of our app. This is the place you customize the UI for your game
• finally we also store all tweens in a table we can refer to in other scenes (transitions, ...)

All of the above variables may be used in multiple if not all scenes of our game, so imho it makes sense to centralize them all here.

The code:

-- plugins
--require "classes/tiny-ecs" -- declared as a local variable in the Game Class
--require "cbump" -- declared as a local variable in the Game Class

-- global app variables
screenwidth, screenheight = application:get("screenSize") -- the actual user screen size!
myappleft, myapptop, myappright, myappbot = application:getLogicalBounds() -- for mobile
myappwidth, myappheight = myappright - myappleft, myappbot - myapptop
--print(myappleft, myapptop, myappright, myappbot)
--print(myappwidth, myappheight)
ismyappfullscreen = false

-- global ttf fonts
myttf = TTFont.new("fonts/Cabin-Regular-TTF.ttf", 2.8*8) -- for UI
myttf2 = TTFont.new("fonts/Cabin-Regular-TTF.ttf", 1.5*8) -- for HUD

-- global UI theme
g_ui_theme = {}
g_ui_theme.backgroundcolor = 0x46464a
g_ui_theme.pixelcolorup = 0x8d595d
g_ui_theme.pixelcolordown = 0xc09c98
g_ui_theme.textcolorup = 0xd9d2cb
g_ui_theme.textcolordown = 0xd9d2cb
g_ui_theme.textcolordisabled = 0xd9d2cb
g_ui_theme.tooltiptextcolor = 0x3a1d20
g_ui_theme.tooltipoffsetx = -7*8
g_ui_theme.tooltipoffsety = 1*4
g_ui_theme.exit = 0xf41212

-- tweens table for transitions
tweens = {
	"inBack", -- 1
    "outBack", -- 2
    "inOutBack", -- 3
    "inBounce", -- 4
    "outBounce", -- 5
    "inOutBounce", -- 6
    "inCircular", -- 7
    "outCircular", -- 8
    "inOutCircular", -- 9
    "inCubic", -- 10
    "outCubic", -- 11
    "inOutCubic", -- 12
    "inElastic", -- 13
    "outElastic", -- 14
    "inOutElastic", -- 15
    "inExponential", -- 16
    "outExponential", -- 17
    "inOutExponential", -- 18
    "linear", -- 19
    "inQuadratic", -- 20
    "outQuadratic", -- 21
    "inOutQuadratic", -- 22
    "inQuartic", -- 23
    "outQuartic", -- 24
    "inOutQuartic", -- 25
    "inQuintic", -- 26
    "outQuintic", -- 27
    "inOutQuintic", -- 28
    "inSine", -- 29
    "outSine", -- 30
    "inOutSine", -- 31
}

the main.lua file

In the main.lua file is the last file to be loaded when launching the game.

This is where I like to set up the windows, put global functions and start the game:

• the windows parameters (title, position, ...)
• the global app functions to load and save user's preferences to disk
• some global variables specific to the game
• start the game (transition to the menu scene)

The code:

-- windows title and position
if not application:isPlayerMode() then
	application:set("windowTitle", "GIDEROS BEAT'EM UP TECS")
	application:set("windowPosition", (screenwidth-myappwidth)*0.5, (screenheight-myappheight)*0.4)
--	application:enableDrawInfo(vector(1, 1, 0, 1))
end

-- global prefs functions
function myLoadPrefs(xconfigfilepath)
	local mydata = getData(xconfigfilepath) -- try to read information from file
	if not mydata then -- if no prefs file, create it
		mydata = {}
		-- set prefs
		mydata.g_language = g_language
		mydata.g_bgmvolume = g_bgmvolume
		mydata.g_sfxvolume = g_sfxvolume
		mydata.g_difficulty = g_difficulty
--		mydata.g_unlockedlevel = g_unlockedlevel
		-- controls
		mydata.g_keyleft = g_keyleft
		mydata.g_keyright = g_keyright
		mydata.g_keyup = g_keyup
		mydata.g_keydown = g_keydown
		mydata.g_keyaction1 = g_keyaction1
		mydata.g_keyaction2 = g_keyaction2
		mydata.g_keyaction3 = g_keyaction3
		-- save prefs
		saveData(xconfigfilepath, mydata) -- create file and save datas
	else -- prefs file exists, use it!
		-- set prefs
		g_language = mydata.g_language
		g_bgmvolume = mydata.g_bgmvolume
		g_sfxvolume = mydata.g_sfxvolume
		g_difficulty = mydata.g_difficulty
--		g_unlockedlevel = mydata.g_unlockedlevel
		-- controls
		g_keyleft = mydata.g_keyleft
		g_keyright = mydata.g_keyright
		g_keyup = mydata.g_keyup
		g_keydown = mydata.g_keydown
		g_keyaction1 = mydata.g_keyaction1
		g_keyaction2 = mydata.g_keyaction2
		g_keyaction3 = mydata.g_keyaction3
	end
end

function mySavePrefs(xconfigfilepath)
	local mydata = {} -- clear the table
	-- set prefs
	mydata.g_language = g_language
	mydata.g_bgmvolume = g_bgmvolume
	mydata.g_sfxvolume = g_sfxvolume
	mydata.g_difficulty = g_difficulty
--	mydata.g_unlockedlevel = g_unlockedlevel
	-- controls
	mydata.g_keyleft = g_keyleft
	mydata.g_keyright = g_keyright
	mydata.g_keyup = g_keyup
	mydata.g_keydown = g_keydown
	mydata.g_keyaction1 = g_keyaction1
	mydata.g_keyaction2 = g_keyaction2
	mydata.g_keyaction3 = g_keyaction3
	-- save prefs
	saveData(xconfigfilepath, mydata) -- save new data
end

-- prefs file and initial default global prefs values
g_configfilepath = "|D|configfile.txt"
g_language = application:getLanguage()
g_bgmvolume = 50 -- 0-100
g_sfxvolume = 20 -- 0-100
g_difficulty = 1 -- 0=easy, 1=normal, 2=hard
g_totallevels = 3
g_currlevel = 1 -- change here to test a specific level
--g_unlockedlevel = g_currlevel
g_keyleft = KeyCode.LEFT
g_keyright = KeyCode.RIGHT
g_keyup = KeyCode.UP
g_keydown = KeyCode.DOWN
g_keyaction1 = KeyCode.C -- punch
g_keyaction2 = KeyCode.X -- kick
g_keyaction3 = KeyCode.W -- jump

-- load saved prefs from file (|D|configfile.txt)
myLoadPrefs(g_configfilepath)

-- global functions
function switchToScene(xscene) -- scenes transition
	-- unload current assets
	stage:removeAllListeners()
	for i = stage:getNumChildren(), 1, -1 do
		stage:getChildAt(i):removeAllListeners()
		stage:removeChildAt(i)
	end collectgarbage()
	-- transition to next scene (eg.: Menu.new())
	stage:addChild(Transitions.new(xscene))
end

-- anims, faster accessed via int than string
local i = 1
g_ANIM_DEFAULT = i
i += 1
g_ANIM_IDLE_R = i
i += 1
g_ANIM_WALK_R = i
i += 1
g_ANIM_RUN_R = i
i += 1
g_ANIM_JUMP1_R = i
i += 1
g_ANIM_WIN_R = i
i += 1
g_ANIM_HURT_R = i
i += 1
g_ANIM_STANDUP_R = i
i += 1
g_ANIM_LOSE1_R = i
i += 1
g_ANIM_PUNCH_ATTACK1_R = i
i += 1
g_ANIM_PUNCH_ATTACK2_R = i
i += 1
g_ANIM_KICK_ATTACK1_R = i
i += 1
g_ANIM_KICK_ATTACK2_R = i
i += 1
g_ANIM_PUNCHJUMP_ATTACK1_R = i
i += 1
g_ANIM_KICKJUMP_ATTACK1_R = i

-- ***************
--  START THE APP
-- ***************
-- bg
application:setBackgroundColor(g_ui_theme.backgroundcolor)
-- company/app/game logo
local logo = Bitmap.new(Texture.new("gfx/logo.png"))
logo:setAnchorPoint(0.5, 0.5)
logo:setPosition(myappwidth/2+myappleft, myappheight/2)
stage:addChild(logo)

local function preloader() -- loading textures and sounds when app is starting
	stage:removeEventListener(Event.ENTER_FRAME, preloader) -- run it only once!
	-- preload your assets here or preload them calling a Class function eg.: MenuScene.preload(), SoundManager.preload()
	-- timer
	local timer = Timer.new(1500, 1) -- show logo: duration
	timer:addEventListener(Event.TIMER, function()
		switchToScene(Menu.new()) -- LevelX, Win, Menu
	end) timer:start()
end

-- on first app frame, start the app/game
stage:addEventListener(Event.ENTER_FRAME, preloader)

main.lua Code comments

The global prefs functions are used to save the user's preferences like key remapping, sound volume and difficulty.

Before the game is launched, the app reads the file and sets the stored values. If there is no file preferences yet, we set the preferences with initial default values.

The switchToScene function is used to switch between scenes. It unloads the previous scene and transitions to the new one.

Then there are some global variables specific to the game: all the animations for our actors (g_ANIM_DEFAULT, g_ANIM_IDLE_R, ...). The _R suffix indicates our sprites are facing Right. Here we only need right facing animations but you may easily add left animations with an _L suffix.

Finally we start the app with a logo transitioning to the Menu scene.

Next?

We quickly go through what is already in the Gideros Game Template1 tutorial. The next part will do this as well: transitions, menu and options scenes.

Prev.: Tuto tiny-ecs beatemup Part 2 Init and Main
Next: Tuto tiny-ecs beatemup Part 4 XXX

Tutorial - tiny-ecs beatemup

---

• Main Page
• Lua API
• Main API
• Plugins