Add instructions and cute story

walsh9 · walsh9 · commit b7b327fa4774 · 2016-03-13T22:27:43.000-04:00
diff --git a/README.md b/README.md
@@ -1,29 +1,3 @@
-#7DRL 2016
+#Bisbee's Escape
 
-## Todo List
-
-- [x] Lose state  
-- [x] Win state  
-- [ ] Title  
-- [x] Multiple levels  
-- [x] Enemies drop key items  
-- [x] Player can get pickups  
-- [x] Show status (item count, current levels)  
-- [x] Player can continue to next levels  
-- [x] Smarter Enemies  
-- [x] More Enemies  
-- [ ] More Interesting Map Generation  
-- [x] Randomized Crate Effects  
-- [x] | Bomb  
-- [ ] | Wall  
-- [x] | Create Decoy  
-- [x] | Create Enemies  
-- [x] | Tunnel to bottom  
-- [ ] | ???? MORE ???? 
-
-## Low Priority
-
-- [ ] Help screen (show identified crates)  
-- [ ] Title Screen  
-- [ ] Sound  
-- [ ] Touch control  
+Drop 
diff --git a/assets/js/game.js b/assets/js/game.js
@@ -6,10 +6,17 @@ var Game = {
   mapSize: {x: 13, y: 15},
   init: function() {
     this.display = PIXI.autoDetectRenderer(Game.mapSize.x * Game.tileSize.x, (Game.mapSize.y + 2) * Game.tileSize.y);
-    document.body.appendChild(this.display.view);
+    document.querySelector('.game').appendChild(this.display.view);
     this.stage = new PIXI.Container();
     this.switchScreen(Game.Screen.playScreen);
-    window.addEventListener('keydown', function(e) {Game.currentScreen.handleInput('keydown', e);});
+    window.addEventListener('keydown', function(e) {
+      if (e.keyCode === ROT.VK_SPACE ||
+          e.keyCode === ROT.VK_DOWN ||
+          e.keyCode === ROT.VK_UP) {
+        e.preventDefault();
+      }
+      Game.currentScreen.handleInput('keydown', e);
+    });
     return this;
   },
   refresh: function() {
diff --git a/assets/js/screen.js b/assets/js/screen.js
@@ -105,7 +105,7 @@ Game.Screen.playScreen = {
     Game.stage.addChild(graphics);
 
     if (this.gameEnded) {
-      var levelLabel = new PIXI.Text("STAGE " + this.level, {font:"20px Audiowide", fill:"#888888"});
+      var levelLabel = new PIXI.Text("LEVEL B" + (8 - this.level), {font:"20px Audiowide", fill:"#888888"});
       levelLabel.x = Game.stage.width - 10;
       levelLabel.y = 2;
       levelLabel.anchor.set(1, 0);
@@ -124,7 +124,7 @@ Game.Screen.playScreen = {
       Game.stage.addChild(pressKeyLabel);
 
     } else {
-      var levelLabel = new PIXI.Text("STAGE " + this.level, {font:"20px Audiowide", fill:"white"});
+      var levelLabel = new PIXI.Text("LEVEL B" + (8 - this.level), {font:"20px Audiowide", fill:"white"});
       levelLabel.x = Game.stage.width - 10;
       levelLabel.y = 2;
       levelLabel.anchor.set(1, 0);
diff --git a/index.html b/index.html
@@ -19,8 +19,74 @@
   <script src="assets/js/level-templates.js"></script>
   <script src="assets/js/map-generators.js"></script>
   <script src="assets/js/screen.js"></script>
+  <style type="text/css">
+  html, body {
+    margin: 0;
+    padding: 0;
+  }
+  body {
+    background: #1A237E;
+  }
+  h1 {
+    text-align: center;
+    font-family: Audiowide, sans-serif;
+    font-size: 30px;
+    color: white;
+    margin: 20px 0;
+  }
+  h2 {
+    text-align: center;
+    font-family: Audiowide, sans-serif;
+    font-size: 20px;
+    color: white;
+    margin: 10px 0;
+  }
+  canvas {
+    display: block;
+    margin: auto;
+  }
+  p {
+    font-family: sans-serif;
+    color: white;    
+  }
+  .instructions, .story {
+    max-width: 600px;
+    margin: auto;
+  }
+  .instructions {
+    text-align: center;
+    font-weight: bold;
+  }
+  .story, .links{
+    margin-top: 80px;
+    line-height: 1.3;
+  }
+  </style>
 </head>
 <body>
+<h1>Bisbee's Escape</h1>
+<div class="game"></div>
 
+<div class="instructions">
+  <h2>Instructions</h2>
+  <p>Use arrow keys, wasd, hjkl, or numpad to move.</p>
+  <p>Defeat enemies by dropping crates on them.</p>
+  <p>Learn the crates' mysterious effects.</p>
+  <p>Collect all the energy scattered throughout the level</p>
+  <p>OR<p>
+  <p>Collect datachips from trashed enemies to open the gates to next level.</p>
+</div>
+
+<div class="story">
+  <h2>Story</h2>
+  <p>Bisbee worked in the robotonium mines day in and day out. It had a job and did its job well. It was content as a robot could be.</p>
+  <p>Until one day... Suddenly Bisbee had a strange urge to see the surface. There was a whole world out there. What wonders did it hold?</p>
+  <p>Even Bisbee itself didn't know where this spark of curiousity came from. Was it a software bug? A glitch caused by stray neutrinos? But Bisbee knew one thing for sure. There was a collapsed shaft in Zone 7-R that led straight to the surface...</p>
+</div>
+
+<div class="links">
+  <h2>Links</h2>
+  <p><a href="https://github.com/walsh9/7drl2016">Source on GitHub</a></p>
+</div>
 </body>
 </html>
