Odyc.js

🚪 Scene Transitions

To create multiple scenes in your game, simply call createGame() multiple times. Each call completely replaces the previous scene.


🎬 Basic Principle

function openMenu() {
	createGame({
		// Menu configuration
		templates: [
			{
				sprite: '1',
				onCollide() {
					openGame() // Go to game
				}
			}
		]
	})
}

function openGame() {
	createGame({
		// Game configuration
		templates: [
			{
				sprite: '2',
				onCollide() {
					openMenu() // Back to menu
				}
			}
		]
	})
}

openMenu() // Start

💾 Preserving Data

Variables declared outside createGame() are preserved between scenes:

let score = 0
let level = 1

function nextLevel() {
	level++
	createGame({
		onStart() {
			showMessage(`Level ${level} - Score: ${score}`)
		}
		//...
	})
}

Note

Each createGame() completely recreates the game. Only global variables persist.


🚫 Clearing the Screen

The game.clear() method stops the game and replaces the display with a solid color:

const game = createGame({
	templates: [
		{
			sprite: '1',
			async onCollide() {
				await game.openMessage('...')
				game.clear('0') // Clear with specific color

				// Then create new scene
				createGame({
					//...
				})
			}
		}
	]
})

Parameter:

  • color (string|number, optional): Color to clear with. If not specified, uses the game’s background color.

Note

Usually not necessary, but useful to avoid flashing between a scene with a message and a new scene.