Personnage qui patrouille

Les personnages permettent de peupler le jeu et de lui donner un aspect plus vivant et organique. Le déplacement de ce personnage permet une grande prédictibilité au joueur, permettant à ce dernier de tirer profit de sa position et de planifier ses déplacements.

Charger une image

load.js

const PNG = [

  "ghosty" ,

  "grass",
]

Créer un composant

component.js

// Ajoutes ici tes propres composants


function patroling(p) {
  // permet à un objet de se déplacer jusqu'à ce qu'il recontre un objet
  const param = {
    speed: 60,
    direction: vec2(-1, 0),
    uTrunDelay: 1,
    startDelay: 1,
    crossEachOther: true,
    ...p
  }
  return {
    direction: vec2(param.direction).unit(),
    resetDirection: vec2(param.direction).unit(),
    facing: 1,
    id: "partoling",
    add() {
      if (param.crossEachOther) this.collisionIgnore.push("partoling")
      this.on("collide", (obj, col) => {
        const l = col.isLeft() && this.direction.x < 0
        const r = col.isRight() && this.direction.x > 0
        if ((l || r) && !obj.is("player") && !obj.is("projectile")) {
          const n = this.direction.x > 0 ? -1 : 1
          if (obj.is("stopper")) tween(this.direction.x, n, param.uTrunDelay, (v) => (this.direction.x = v), easings.easeInSin)
          else tween(0, n, param.startDelay, (v) => (this.direction.x = v), easings.easeInSin)
        }
      })
    },
    update() {
      this.move(param.speed * this.direction.x, 0)
      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


    "u": () => [ // fantôme passif
        sprite("ghosty"),
        area(),
        anchor("bot"),
        body(),
        patroling(),
        falling(),
        respawn(),
        coloring(),
        alive(),
        opacity(),
        scale(),
        health(1),
      ],
      
    "U": () => [ // fantôme hostile
      sprite("ghosty"),
      area(),
      anchor("bot"),
      body(),
      patroling(),
      falling(),
      danger({ tag: "player" }),
      respawn(),
      coloring({ color: Color.fromHex("ff9696") }),
      alive(),
      opacity(),
      scale(),
      health(1),
    ],


    "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(),
    ],
    
    "=": () => [ // bloc
      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 U u U x
            =======  
        #            
      =====   
             
    `,
  },
  
];

body

body( { mass : 10 } ),

patroling

levelConf.js
tiles :

patroling({
  
  speed: 60,
  
  direction: vec2(-1, 0),
  
  uTrunDelay: 1,
  
  startDelay: 1,
  
  crossEachOther: true,
  
}),

danger

levelConf.js
tiles :

danger({

  damage: 1,

  collisions: ["top", "left", "bot", "right"],

  ongoing: false,

  target: "alive",

}),