/codiscovery_live_2048_javascript

Primary LanguageJavaScript

2048

Couleurs

  • Background: #faf8ef
  • Body: #776e65
  • Grid: #bbada0
  • Tile: #d7c6b5

Styles

.cell-2 { background-color: #eee4da; color: #776e65; } .cell-4 { background-color: #eee1c9; color: #776e65; } .cell-8 { color: #f9f6f2; background-color: #f3b27a; } .cell-16 { color: #f9f6f2; background-color: #f69664; } .cell-32 { color: #f9f6f2; background-color: #f77c5f; } .cell-64 { color: #f9f6f2; background-color: #f75f3b; } .cell-128 { color: #f9f6f2; background-color: #edd073; } .cell-256 { color: #f9f6f2; background-color: #edcc62; } .cell-512 { color: #f9f6f2; background-color: #edc950; } .cell-1024 { color: #f9f6f2; background-color: #edc53f; font-size: 2em; } .cell-2048 { color: #f9f6f2; background-color: #edc22e; font-size: 2em; }

.cell-position-0-0 { top: 0px; left: 0px; } .cell-position-0-1 { top: 0px; left: 110px; }

.cell-position-0-2 { top: 0px; left: 220px; }

.cell-position-0-3 { top: 0px; left: 330px; }

.cell-position-1-0 { top: 110px; left: 0px; } .cell-position-1-1 { top: 110px; left: 110px; }

.cell-position-1-2 { top: 110px; left: 220px; }

.cell-position-1-3 { top: 110px; left: 330px; }

.cell-position-2-0 { top: 220px; left: 0px; } .cell-position-2-1 { top: 220px; left: 110px; }

.cell-position-2-2 { top: 220px; left: 220px; }

.cell-position-2-3 { top: 220px; left: 330px; }

.cell-position-3-0 { top: 330px; left: 0px; } .cell-position-3-1 { top: 330px; left: 110px; }

.cell-position-3-2 { top: 330px; left: 220px; }

.cell-position-3-3 { top: 330px; left: 330px; }

Etapes

  • Créer la grille virtuelle

  • Détecter les cases vides

  • Afficher la grille HTML

  • Ajouter N chiffres à la grille virtuelle

  • Ajouter N chiffres à la grille HTML

  • Bouger à gauche

  • Bouger à droite

  • Bouger en haut

  • Bouger en bas