Commit everything.

ecj2 · Aug 10, 2017 · fa89bba · fa89bba
commit fa89bba
Show file tree

Hide file tree

Showing 18 changed files with 2,304 additions and 0 deletions.
diff --git a/LICENSE.md b/LICENSE.md
@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2017 Eric Johnson
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.
diff --git a/README.md b/README.md
@@ -0,0 +1,7 @@
+# Kitten Kerfuffle
+
+My [KrampusHack 2016](https://github.com/ecj2/kitten-kerfuffle) entry rewritten for the Web in JavaScript using [Momo](https://github.com/ecj2/momo/).
+
+## License
+
+This game is licensed under the MIT License &ndash; see the [LICENSE.md](https://github.com/ecj2/kitten-kerfuffle-js/blob/master/LICENSE.md) file for details.
diff --git a/css/main.css b/css/main.css
@@ -0,0 +1,49 @@
+body {
+
+  background: #eee;
+  margin: 28px 0 0 0;
+  font-family: Verdana, sans-serif;
+  font-size: 18px;
+  color: #333;
+  text-align: left;
+  line-height: 28px;
+}
+
+#wrap {
+
+  width: 768px;
+  margin: auto;
+}
+
+header {
+
+  margin: 0 0 28px 0;
+  text-align: center;
+}
+
+header h1 {
+
+  margin: 0;
+  font-size: 32px;
+  font-weight: normal;
+  color: #333;
+}
+
+a {
+
+  color: blue;
+  text-decoration: none;
+}
+
+a:hover {
+
+  text-decoration: underline;
+}
+
+canvas {
+
+  background: url("../data/png/loading.png") #000;
+  width: 768px;
+  height: 448px;
+  border: 1px solid #222;
+}
diff --git a/data/mp3/annoying.mp3 b/data/mp3/annoying.mp3
diff --git a/data/mp3/kitten_meow.mp3 b/data/mp3/kitten_meow.mp3
diff --git a/data/mp3/meow.mp3 b/data/mp3/meow.mp3
diff --git a/data/png/arrow.png b/data/png/arrow.png
diff --git a/data/png/atlas.png b/data/png/atlas.png
diff --git a/data/png/error.png b/data/png/error.png
diff --git a/data/png/loading.png b/data/png/loading.png
diff --git a/data/ttf/font.ttf b/data/ttf/font.ttf
diff --git a/index.html b/index.html
@@ -0,0 +1,25 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="utf-8">
+    <title>Kitten Kerfuffle</title>
+    <link rel="stylesheet" href="css/main.css">
+    <script src="https://cdn.rawgit.com/ecj2/momo/e5911deabd14d11b7e95912afcba0860d6c3f074/momo.js"></script>
+    <script src="js/global.js"></script>
+    <script src="js/camera.js"></script>
+    <script src="js/nini.js"></script>
+    <script src="js/kitten.js"></script>
+    <script src="js/main.js"></script>
+    <script src="js/map.js"></script>
+  </head>
+  <body>
+    <div id="wrap">
+      <header>
+        <h1>Kitten Kerfuffle</h1>
+      </header>
+      <canvas id="game">
+        Your browser does not support the canvas element.
+      </canvas>
+    </div>
+  </body>
+</html>
diff --git a/js/camera.js b/js/camera.js
@@ -0,0 +1,47 @@
+Camera = new class {
+
+  constructor() {
+
+    this.x = 0;
+    this.y = 0;
+  }
+
+  update() {
+
+    // Follow Nini in the middle of the screen.
+    this.x = Nini.getX() - (CANVAS_W / 2) + (TILE_SIZE / 2);
+    this.y = Nini.getY() - (CANVAS_H / 2) + (TILE_SIZE / 2);
+
+    if (this.x < TILE_SIZE) {
+
+      // Stop at the map's left fringe.
+      this.x = TILE_SIZE;
+    }
+    else if (this.x > (TILE_SIZE * NUMBER_OF_TILES_X) - CANVAS_W - TILE_SIZE) {
+
+      // Stop at the map's right fringe.
+      this.x = (TILE_SIZE * NUMBER_OF_TILES_X) - CANVAS_W - TILE_SIZE;
+    }
+
+    if (this.y < TILE_SIZE) {
+
+      // Stop at the map's top fringe.
+      this.y = TILE_SIZE;
+    }
+    else if (this.y > (TILE_SIZE * NUMBER_OF_TILES_Y) - CANVAS_H - TILE_SIZE) {
+
+      // Stop at the map's bottom fringe.
+      this.y = (TILE_SIZE * NUMBER_OF_TILES_Y) - CANVAS_H - TILE_SIZE;
+    }
+  }
+
+  getX() {
+
+    return this.x;
+  }
+
+  getY() {
+
+    return this.y;
+  }
+};
diff --git a/js/global.js b/js/global.js
@@ -0,0 +1,42 @@
+// Objects.
+let Map = undefined;
+let Nini = undefined;
+let Camera = undefined;
+
+// Images.
+let atlas = undefined;
+let arrow = undefined;
+
+// Fonts.
+let font = undefined;
+
+// Sounds.
+let meow = undefined;
+let annoying = undefined;
+let kitten_meow = undefined;
+
+// Miscellaneous.
+
+let kittens = [];
+
+let kittens_found = 0;
+
+let points = 0;
+
+const UP = 0;
+const DOWN = 1;
+const LEFT = 2;
+const RIGHT = 3;
+
+const TILE_SIZE = 64;
+
+const CANVAS_W = 768;
+const CANVAS_H = 448;
+
+const NUMBER_OF_TILES_X = 12 * 16;
+const NUMBER_OF_TILES_Y = 6 * 6;
+
+function getRandomNumber() {
+
+  return Math.floor(Math.random() * 100);
+}