Plateforme en mouvement alterné

Les plateformes en mouvement permettent d'introduire une dimension de timing dans les déplacements du joueur. Le mouvement alternatif de ces plateformes peut permettent au joueur de pouvoir prédir leur position et de planifier ces mouvements en conséquences. Avec un peu de créativité, l'utilisation des plateformes peut permettre une grande variété de défi pour le joueur.

Charger une image

load.js

const PNG = [

  "plate" ,

  "grass",
]

Créer un composant

component.js

// Ajoutes ici tes propres composants

function movingBackAndForth(p) {
  // permet à un objet de déplacer dans une direction puis dans le sens inverse en recontrant un objet "stopper"
  const param = {
    direction: vec2(1, 0),
    speed: 100,
    switchDelay: 1,
    ...p
  }
  return {
    direction: vec2(param.direction).unit(),
    facing: 1,
    add() {
      this.onCollide("stopper", () => {
        tween(
          this.direction,
          this.direction.scale(-1),
          param.switchDelay,
          (v) => (this.direction = v),
          easings.easeOutSine
        )
      })
    },
    update() {
      this.move(this.direction.scale(param.speed))
      if (this.direction.x > 0) this.facing = 1
      else if (this.direction.x < 0) this.facing = -1
    },
  }
}

Déclarer un symbole

levelConf.js

const LEVEL_CONFIG = {

  // paramètres du niveau

  tileWidth: 64,
  tileHeight: 64,
  backgroundColor: "afe1ff",
  gravity: 3200,

  tiles: {
    
    // listes des objets à placer dans les niveaux

    "<": () => [ // plateforme en mouvement <-
      sprite("plate"),
      pos(0,-64),
      movingBackAndForth({ direction: vec2(-1, 0) }),
      body({ isStatic: true }),
      area(),
      anchor("top"),
    ],
    
    ">": () => [ // plateforme en mouvement ->
      sprite("plate"),
      pos(0,-64),
      movingBackAndForth({ direction: vec2(1, 0) }),
      body({ isStatic: true }),
      area(),
      anchor("top"),
    ],
    
    "v": () => [ // plateforme en mouvement v
      sprite("plate"),
      pos(0,-64),
      movingBackAndForth({ direction: vec2(0, 1) }),
      body({ isStatic: true }),
      offscreen({ hide: true }),
      area(),
      anchor("top"),
    ],
    
    "^": () => [ // plateforme en mouvement ^
      sprite("plate"),
      pos(0,-64),
      movingBackAndForth({ direction: vec2(0, -1) }),
      body({ isStatic: true }),
      offscreen({ hide: true }),
      area(),
      anchor("top"),
    ],
    "x": () => [ // stopper
      rect(64, 64),
      opacity(0), 
      area(), 
      anchor("bot"), 
      "stopper"
    ],
    "#": () => [ // player
      sprite("bean"),
      platformerController(),
      alive(),
      opacity(),
      scale(),
      health(1, 4),
      area(),
      anchor("bot"),
      body(),
      respawn(),
      falling(),
      coloring(),
      animator(),
    ],
    
    "=": () => [ // block
      sprite("grass"),
      area(),
      body({ isStatic: true }),
      anchor("bot"),
      offscreen({ hide: true }),
    ],

  },

}

Placer les objets

level.js

const LEVELS = [
  
  // liste des niveaux du jeu

  {
    map: `
            x   < x       
          x         x     
                          
       #  ^               
      ===           v  ===
                          
          x         x     
            x >   x       
    `,
  },
  
];

movingBackAndForth

levelConf.js
tiles :
movingBackAndForth({

  direction: vec2(1, 0),

  speed: 100,

  switchDelay: 1,

}),