clean up client side code, comment, add tiled source files

MoonshotLab · Oct 8, 2014 · 071f997 · 071f997
1 parent 3a49cd5
commit 071f997
Show file tree

Hide file tree

Showing 6 changed files with 83 additions and 75 deletions.
diff --git a/public/assets/layer-map.tmx b/public/assets/layer-map.tmx
@@ -0,0 +1,20 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<map version="1.0" orientation="orthogonal" width="10" height="10" tilewidth="16" tileheight="16">
+ <tileset firstgid="1" name="tileset" tilewidth="16" tileheight="16" spacing="1">
+  <image source="tileset.png" width="289" height="289"/>
+ </tileset>
+ <layer name="Stuff" width="10" height="10">
+  <data encoding="csv">
+0,0,0,0,0,0,0,0,0,0,
+0,0,0,0,0,0,0,0,0,0,
+0,0,0,0,0,0,0,0,0,0,
+0,0,0,0,0,0,0,0,0,0,
+0,0,0,0,0,0,0,0,0,0,
+0,0,0,0,0,0,0,0,0,0,
+0,0,9,11,0,0,9,11,0,0,
+0,0,43,45,0,0,43,45,0,0,
+0,0,0,0,0,0,0,0,0,0,
+0,0,0,0,0,0,0,0,0,0
+</data>
+ </layer>
+</map>
diff --git a/public/assets/outie.json b/public/assets/outie.json
@@ -1,13 +1,13 @@
-{ "height":5,
+{ "height":10,
  "layers":[
         {
-         "data":[0, 0, 0, 0, 0, 0, 0, 7, 0, 0, 0, 0, 0, 0, 0, 0, 9, 0, 8, 0, 0, 0, 0, 0, 0],
-         "height":5,
-         "name":"Tile Layer 1",
+         "data":[0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 111, 112, 0, 0, 0, 0, 0, 0, 0, 0, 128, 129, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 9, 11, 0, 0, 9, 11, 0, 0, 0, 0, 43, 45, 0, 0, 43, 45, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
+         "height":10,
+         "name":"Stuff",
          "opacity":1,
          "type":"tilelayer",
          "visible":true,
-         "width":5,
+         "width":10,
          "x":0,
          "y":0
         }],
@@ -16,24 +16,24 @@
     {
 
     },
- "tileheight":50,
+ "tileheight":16,
  "tilesets":[
         {
          "firstgid":1,
-         "image":"..\/..\/..\/..\/Desktop\/starstruck 2\/tiles-1.png",
-         "imageheight":64,
-         "imagewidth":272,
+         "image":"tileset.png",
+         "imageheight":289,
+         "imagewidth":289,
          "margin":0,
-         "name":"tiles-1",
+         "name":"tileset",
          "properties":
             {
 
             },
-         "spacing":0,
+         "spacing":1,
          "tileheight":16,
          "tilewidth":16
         }],
- "tilewidth":50,
+ "tilewidth":16,
  "version":1,
- "width":5
-}
+ "width":10
+}
diff --git a/public/assets/platforms.json b/public/assets/platforms.json
@@ -1,13 +1,13 @@
-{ "height":5,
+{ "height":10,
  "layers":[
         {
-         "data":[0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 9, 0, 8, 0, 0, 0, 0, 0, 0],
-         "height":5,
-         "name":"Tile Layer 1",
+         "data":[0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 9, 11, 0, 0, 9, 11, 0, 0, 0, 0, 43, 45, 0, 0, 43, 45, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
+         "height":10,
+         "name":"Stuff",
          "opacity":1,
          "type":"tilelayer",
          "visible":true,
-         "width":5,
+         "width":10,
          "x":0,
          "y":0
         }],
@@ -16,24 +16,24 @@
     {
 
     },
- "tileheight":50,
+ "tileheight":16,
  "tilesets":[
         {
          "firstgid":1,
-         "image":"..\/..\/..\/..\/Desktop\/starstruck 2\/tiles-1.png",
-         "imageheight":64,
-         "imagewidth":272,
+         "image":"tileset.png",
+         "imageheight":289,
+         "imagewidth":289,
          "margin":0,
-         "name":"tiles-1",
+         "name":"tileset",
          "properties":
             {
 
             },
-         "spacing":0,
+         "spacing":1,
          "tileheight":16,
          "tilewidth":16
         }],
- "tilewidth":50,
+ "tilewidth":16,
  "version":1,
- "width":5
-}
+ "width":10
+}
diff --git a/public/assets/tiles-1.png b/public/assets/tiles-1.png
diff --git a/public/assets/tileset.png b/public/assets/tileset.png
diff --git a/public/index.js b/public/index.js
@@ -1,89 +1,77 @@
 var socket = io();
+var platformLayer, outieLayer, outieIsHidden = true;
+var player, facing = 'left', jumpTimer = 0;
+var cursors, jumpButton;
 
-var map;
-var layer;
-var player;
-var facing = 'left';
-var jumpTimer = 0;
-var platformLayer;
-var outieLayer;
-var cursors;
-var jumpButton;
-var outieIsHidden = true;
 
 var preload = function(){
   game.load.tilemap('platforms', 'assets/platforms.json', null, Phaser.Tilemap.TILED_JSON);
   game.load.tilemap('outie', 'assets/outie.json', null, Phaser.Tilemap.TILED_JSON);
-  game.load.image('tiles-1', 'assets/tiles-1.png');
+  game.load.image('tileset', 'assets/tileset.png');
   game.load.spritesheet('dude', 'assets/dude.png', 32, 48);
 };
 
 
-var hidePlatform = function(){
-  socket.emit('hide-platform');
-  outieLayer.visible = false;
-};
+// Message back to the server, telling it to toggle
+// the status of the servo
+var toggleOutie = function(){
+  outieIsHidden = !outieIsHidden;
 
-var showPlatform = function(){
-  socket.emit('show-platform');
-  outieLayer.visible = true;
+  if(outieIsHidden){
+    socket.emit('hide-platform');
+    outieLayer.visible = false;
+  } else{
+    socket.emit('show-platform');
+    outieLayer.visible = true;
+  }
 };
 
 
 var create = function(){
   game.physics.startSystem(Phaser.Physics.ARCADE);
   game.stage.backgroundColor = '#000000';
+  game.physics.arcade.gravity.y = 500;
 
-  game.physics.arcade.gravity.y = 250;
-
+  // Player physics and animations
   player = game.add.sprite(32, 32, 'dude');
   game.physics.enable(player, Phaser.Physics.ARCADE);
 
-  player.body.bounce.y = 0.2;
+  player.body.bounce.y = 0.5;
   player.body.collideWorldBounds = true;
   player.body.setSize(20, 32, 5, 16);
 
   player.animations.add('left', [0, 1, 2, 3], 10, true);
   player.animations.add('turn', [4], 20, true);
   player.animations.add('right', [5, 6, 7, 8], 10, true);
 
+  // There's probably a better way to do this,
   var platformMap = game.add.tilemap('platforms');
   var outieMap = game.add.tilemap('outie');
-  platformMap.setCollisionByExclusion([ 13, 14, 15, 16, 46, 47, 48, 49, 50, 51 ]);
-  outieMap.setCollisionByExclusion([ 13, 14, 15, 16, 46, 47, 48, 49, 50, 51 ]);
-  platformMap.addTilesetImage('tiles-1');
-  outieMap.addTilesetImage('tiles-1');
-
-  platformLayer = platformMap.createLayer('Tile Layer 1');
-  outieLayer = outieMap.createLayer('Tile Layer 1');
-  platformLayer.debug=true;
-  outieLayer.debug=true;
-  outieLayer.visible = false;
 
-  game.camera.follow(player);
+  platformMap.addTilesetImage('tileset');
+  outieMap.addTilesetImage('tileset');
+  platformMap.setCollisionByExclusion([]);
+  outieMap.setCollisionByExclusion([]);
 
+  platformLayer = platformMap.createLayer('Stuff');
+  outieLayer = outieMap.createLayer('Stuff');
+  outieLayer.visible = false;
+  // End, todo better
+
+  // Buttons 'n stuff
   cursors = game.input.keyboard.createCursorKeys();
   jumpButton = game.input.keyboard.addKey(Phaser.Keyboard.SPACEBAR);
 
-
-  setInterval(function(){
-    outieIsHidden = !outieIsHidden;
-
-    if(outieIsHidden)
-      hidePlatform();
-    else
-      showPlatform();
-
-  }, 5000);
+  setInterval(toggleOutie, 1000);
 };
 
 
 var update = function() {
-  if(outieIsHidden)
-    game.physics.arcade.collide(player, platformLayer);
-  else
-    game.physics.arcade.collide(player, outieLayer);
+  // Determine which layer to treat as the collision layer
+  var collisionLayer = outieIsHidden ? platformLayer : outieLayer;
+  game.physics.arcade.collide(player, collisionLayer);
 
+  // Handle player movement
   player.body.velocity.x = 0;
 
   if (cursors.left.isDown){
@@ -121,6 +109,6 @@ var update = function() {
 
 
 var game = new Phaser.Game(
-  800, 600, Phaser.CANVAS, 'bizarrio',
+  160, 160, Phaser.CANVAS, 'bizarrio',
   { preload: preload, create: create, update: update }
 );