const display = new Display();

const display = new Display();
display.perform();
display.start(800, 600);
display.backgroundColor("#0a0a2a");

const player = new Component(40, 40, "blue", 100, 100);
display.add(player);

new Component(width, height, color, x, y, type)
// type: "rect" | "image" | "text" (default: "rect")

const player = new Component(40, 40, "blue", 100, 100);
player.physics = true;
player.gravity = 0.4;
player.bounce = 0.2;
display.add(player);

function update() {
    if (display.keys[39]) player.speedX = 4;
    player.hitBottom();
    move.bound(player);
}

display.camera.worldWidth = 2000;
display.camera.worldHeight = 2000;

function update() {
    display.camera.follow(player, true);
    display.camera.setZoom(1.2);
}

function onExplosion() {
    display.camera.shake(8, 8);
    display.camera.shakeRotation(0.05);
}

function update() {
    move.bound(player);
    move.pointTo(turret, mouse.x, mouse.y);
    if (display.keys[68]) move.accelerate(player, 0.5, 0, 8, 0);
    else move.decelerate(player, 0.3, 0);
}

display.tile = [
    new Component(32, 32, "green", 0, 0), // tile 1
    new Component(32, 32, "brown", 0, 0)  // tile 2
];

display.map = [
    [1, 1, 1, 1, 1],
    [1, 0, 2, 0, 1],
    [1, 1, 1, 1, 1]
];

display.tileMap();
display.tileFace.show();

// Runtime editing
display.tileFace.add(1, 5, 3);
display.tileFace.remove(5, 3);

// Collision
if (display.tileFace.crashWith(player, 1)) {
    // hit a wall
}

// Get all coins (tile type 2)
const coins = display.tileFace.tiles(2);

new Tctxt(size, font, color, x, y, align, stroke, baseline, bgColor, padX, padY)

const score = new Tctxt(
    "24px", "Arial", "white", 20, 40,
    "left", false, "alphabetic", "rgba(0,0,0,0.5)", 10, 5
);
score.setText("Score: 0");
display.add(score);

function update() {
    score.setText("Score: " + scoreValue);
    score.fixed();
}

new Sound(src, options)

const jump = new Sound("jump.wav");
const music = new Sound("theme.mp3", { loop: true, volume: 0.5 });

jump.play();
music.play();

window.soundManager = new SoundManager();

const sm = new SoundManager();
window.soundManager = sm;

sm.load("coin", "coin.wav");
sm.load("explosion", "boom.wav");
sm.load("music_theme", "theme.mp3");

sm.playMusic("music_theme");

function update() {
    if (collectCoin) sm.play("coin");
}

const ps = new ParticleSystem(display);

const ps = new ParticleSystem(display);

function update() {
    ps.update();

    // Single particle
    ps.emit(player.x, player.y, {
        color: "cyan", life: 30, speedY: -2
    });

    // Burst
    move.particles.explosion(ps, enemy.x, enemy.y, 30);

    // Emitter
    const fire = ps.createEmitter(400, 300, {
        rate: 40,
        randomSpread: true,
        speed: 2,
        color: "#ff4400",
        life: 35,
        gravity: -0.06
    });
    fire.setPosition(player.x + 20, player.y + 30);
}

new Sprite(image, frameWidth, frameHeight, frameCount, frameSpeed, x, y)

new AnimatedSprite(image, frameWidth, frameHeight, x, y)

// Basic Sprite
const explosion = new Sprite("explode.png", 64, 64, 8, 4, 300, 200);
display.add(explosion);

// AnimatedSprite with clips
const hero = new AnimatedSprite("hero.png", 64, 64, 400, 300);
hero.addAnimation("idle", 0, 3, 10, true);
hero.addAnimation("walk", 4, 11, 5, true);
hero.addAnimation("jump", 12, 15, 4, false);
display.add(hero);

function update() {
    if (isMoving) hero.playAnimation("walk");
    else hero.playAnimation("idle");
    hero.updateAnimation();
}

display.perform();
display.start(800, 600);

// Background (renders behind everything)
fake.bgComm = new Component(1600, 1200, null, 0, 0, "image");
fake.bgComm.setImage("sky.png");

// Static objects (tilemaps, backgrounds)
fake.add(backgroundTilemap);

// Dynamic objects (player, enemies)
display.add(player);