Portes

Les portes permettent de diviser un jeu en plusieurs niveaux et d'introduire un nouveau type de circulation pour le joueur. Les niveaux peuvent s'enchainer les uns après les autres de manière continue et ainsi rythmer la progression du joueur. Un même niveau peut aussi comprendre différentes portes vers différents niveaux, à la manière d'un hub.

Charger une image

load.js

const PNG = [

  "door" ,

  "grass" ,
  "bean"  ,
]

Charger un effet sonore

load.js

const MP3 = [

"door" ,

"wooosh" ,
"off"  ,
]

Créer un composant

component.js

// Ajoutes ici tes propres composants

function door( destination = null ){
  
  // change de niveau lorsqu'un joueur touche l'objet
  
  const delay = 0 
  
  return {
    
    add(){
      this.onCollide( "player", () => this.enter() )  
    }, 
    
    enter(){
      const d = (destination==null) ? CURRENT_LEVEL + 1 : destination
      wait( delay , () => this.next(d) )   
      play( "door" )
    },
    
    next(d){
      if ( d < LEVELS.length ) CURRENT_LEVEL = d
      else                     CURRENT_LEVEL = 0
      go( "game" )  
    },
    
} }

Déclarer un symbole

level.js

const levelConf = {
  
  // paramètres du niveau
  
  tileWidth: 64,
  tileHeight: 64,

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

   "D": () => [ // porte vers le niveau suivant
      sprite("door"),
      area(),
      door(),
      anchor("bot"),			
      offscreen({ hide: true }),
    ],
   "0": () => [ // porte vers le niveau 0
      sprite("door"),
      area(),
      door(0),
      anchor("bot"),			
      offscreen({ hide: true }),
    ],
   "1": () => [ // porte vers le niveau 1
      sprite("door"),
      area(),
      door(1),
      anchor("bot"),			
      offscreen({ hide: true }),
    ],
   "2": () => [ // porte vers le niveau 2
      sprite("door"),
      area(),
      door(2),
      anchor("bot"),			
      offscreen({ hide: true }),
    ],
   "3": () => [ // porte vers le niveau 3
      sprite("door"),
      area(),
      door(3),
      anchor("bot"),			
      offscreen({ hide: true }),
    ],
    "#": () => [ // player
      sprite("bean"),
      platformerController(),
      health(1),
      character(),
      area(),
      anchor("bot"),
      body(),
    ],
    
    "=": () => [ // bloc
      sprite("grass"),
      area(),
      body({ isStatic: true }),
      anchor("bot"),			
      offscreen({ hide: true }),
    ],

  },

}

Placer les objets

level.js

const LEVELS = [

  // liste des niveaux du jeu

  [
    " 2       " ,
    "===   ===" ,
    "         " ,
    "         " ,
    " #     D " ,
    "===   ===" ,
  ],
  [
    " 2       " ,
    "===      " ,
    "         " ,
    "    =    " ,
    " 0     # " ,
    "===   ===" ,
  ],
  [
    " #     3 " ,
    "===   ===" ,
    "         " ,
    "    =    " ,
    "       1 " ,
    "      ===" ,
  ],
  [
    " 2     # " ,
    "===   ===" ,
    "         " ,
    "         " ,
    "       1 " ,
    "===   ===" ,
  ],
  
];

le niveau de destination

Emmène iveau suivant si laissé vierge

lockedDoor ( 1 )

un niveau de départ

Pour ne pas perdre de temps lors de la réalisation des niveaux, il est recommandé de modifier la valeur de la variable CURRENT_LEVEL pour commencer le jeu directement sur le niveau de son choix ( 0 pour le premier niveau, 1 pour le second, et ainsi de suite ).

let CURRENT_LEVEL = 1