Guide Start Application
Now that we have everything ready for our first test, let's go over our code so far:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>First FlevaR Game</title>
<script defer src="FlevaR.js"></script>
<script defer src="main.js"></script>
</head>
<body>
<!-- container for our application -->
<div id="flevaRContainer"></div>
</body>
</html>const flevaRContainerElement = document.getElementById("flevaRContainer");
const flevar = new FlevaR(flevaRContainerElement, {});
const load = async function () {
await flevar.createSprite("first_sprite");
flevar.createPrefab("first_prefab", function (prefab) {
prefab._x = 50;
prefab._y = 100;
prefab.useSprite("first_sprite");
});
flevar.createScene("first_scene", function (scene) {
scene.addPrefab("first_prefab");
});
flevar.useScene("first_scene");
flevar.start(1000/30);
}
load();As noticed, we wrap the creation within an asynchronous function, since browsers do not yet support top-level await.
To run the engine, we call flevar.start(interval); giving the frame rate in milliseconds.
Whenever ready, view your game by opening your HTML file via a live server of your choice. (This example used VSCode and the "Live Server Extension")
You have successfully created your first FlevaR game!
Next, let's make it interact-able! (Coming soon)
