fixes initial level positioning

app/Game/Client/Loader/Level.js

@@ -12,6 +12,10 @@ function (Parent, Settings, Nc, PIXI, AbstractLayer) {
 
     function Level (uid, engine, gameObjects) {
         Parent.call(this, uid, engine, gameObjects);
+        this.levelSize = {
+            width: 0,
+            height: 0
+        }
     }
 
     Level.prototype = Object.create(Parent.prototype);
@@ -112,7 +116,16 @@ function (Parent, Settings, Nc, PIXI, AbstractLayer) {
         if (options.properties && options.properties.parallaxSpeed) {
             parallaxSpeed = parseFloat(options.properties.parallaxSpeed);
         } 
-        Nc.trigger(Nc.ns.client.view.layer.createAndInsert, options.layerId, parallaxSpeed, behind, referenceId);
+        Nc.trigger(
+            Nc.ns.client.view.layer.createAndInsert,
+            options.layerId,
+            {
+                parallaxSpeed: parallaxSpeed,
+                levelSize: this.levelSize
+            },
+            behind,
+            referenceId
+        );
     };
 
     return Level;

app/Game/Client/Loader/TiledLevel.js

@@ -16,16 +16,14 @@ function (Parent, Settings, Nc) {
     TiledLevel.prototype = Object.create(Parent.prototype);
 
     TiledLevel.prototype.setup = function(levelData) {
-        /*
+        var tilesLayerData = this.getLayer(levelData, "tiles");
-        FIXME: find a name for this shit!
+        this.levelSize = {
-        for (var i = 0; i < levelData.layers.length; i++) {
+            width: tilesLayerData.width * Settings.TILE_SIZE,
-            var layerOptions = levelData.layers[i];
+            height: tilesLayerData.height * Settings.TILE_SIZE
-            layerOptions.z = i;
-            if(!this.layerMapping[layerOptions.name]) {
-                this.createLayer(layerOptions);
-            }
         };
-        */
+
+        Nc.trigger(Nc.ns.client.view.layer.levelSizeUpdate, this.levelSize);
+
         Parent.prototype.setup.call(this, levelData);
     };
 

app/Game/Client/Networker.js

@@ -38,7 +38,7 @@ function (ProtocolHelper, GameController, User, Nc, Settings, DomController) {
         Nc.on(Nc.ns.client.to.server.gameCommand.send, this.sendGameCommand, this);
         Nc.on(Nc.ns.core.game.events.level.loaded, this.onLevelLoaded, this);
 
-        DomController.setNick(nickname);        
+        DomController.setNick(nickname);
     }
 
     // Socket callbacks

app/Game/Client/View/Abstract/Layer.js

@@ -6,18 +6,23 @@ function (Abstract) {
 
 	"use strict";
 
-    function Layer(name, parallaxSpeed) {
+    function Layer(name, options) {
     	this.name = name;
-    	this.parallaxSpeed = parallaxSpeed;
+    	this.parallaxSpeed = options.parallaxSpeed || 0;
         this.zoom = { 
-            current: 1, 
+            current: window.innerWidth / 600,
-            target: 1
+            target: window.innerWidth / 600
         };
         this.position = {
             current: { x: 0, y: 0},
             target: { x: 0, y: 0}
         };
 
+        if(options.levelSize) {
+            this.position.current.x = -options.levelSize.width / 2;
+            this.position.current.y = -options.levelSize.height / 2;            
+        }
+
         this.ncTokens = [];
     }
 
@@ -52,7 +57,9 @@ function (Abstract) {
     };
 
     Layer.prototype.destroy = function() {
-        
+        for (var i = 0; i < this.ncTokens.length; i++) {
+            Nc.off(this.ncTokens[i]);
+        };
     };
 
     return Layer;

app/Game/Client/View/LayerManager.js

@@ -36,8 +36,8 @@ function (Nc, Exception, Layer) {
      * If no referenceId is given, the layer is inserted in the far background (behind=true)
      * or in the foreground (behind=false/null)
      */
-    LayerManager.prototype.createAndInsert = function(id, parallaxSpeed, behind, referenceId) {
+    LayerManager.prototype.createAndInsert = function(id, options, behind, referenceId) {
-        var layer =  new Layer(id, parallaxSpeed);
+        var layer =  new Layer(id, options);
         this.insert(layer, behind, referenceId);
     };
 

app/Game/Client/View/Pixi/Layer.js

@@ -3,19 +3,28 @@ define([
 	"Lib/Vendor/Pixi",
     "Game/Client/View/Pixi/ColorRangeReplaceFilter",
     "Game/Config/Settings",
-    "Lib/Utilities/ColorConverter"
+    "Lib/Utilities/ColorConverter",
+    "Lib/Utilities/NotificationCenter"
 ],
 
-function (Parent, PIXI, ColorRangeReplaceFilter, Settings, ColorConverter) {
+function (Parent, PIXI, ColorRangeReplaceFilter, Settings, ColorConverter, Nc) {
 
 	"use strict";
     
-    function Layer (name, parallaxSpeed) {
+    function Layer (name, options) {
-        Parent.call(this, name, parallaxSpeed);
+        Parent.call(this, name, options);
         this.container = new PIXI.DisplayObjectContainer();
         this.container.x = 0;
         this.container.y = 0;
         this.static = false;
+        this.levelSize = {
+            width: 0,
+            height: 0
+        }
+
+        this.ncTokens = this.ncTokens.concat([
+            Nc.on(Nc.ns.client.view.layer.levelSizeUpdate, this.onLevelSizeUpdate, this)
+        ]);
 
         if (Settings.SHOW_LAYER_INFO) {
 
@@ -53,6 +62,10 @@ function (Parent, PIXI, ColorRangeReplaceFilter, Settings, ColorConverter) {
 
     Layer.prototype = Object.create(Parent.prototype);
 
+    Layer.prototype.onLevelSizeUpdate = function(levelSize) {
+        this.levelSize = levelSize;
+    };
+
     Layer.prototype.getAvailableMeshFilters = function() {
         return {
             "blur": PIXI.BlurFilter,
@@ -241,31 +254,29 @@ function (Parent, PIXI, ColorRangeReplaceFilter, Settings, ColorConverter) {
         // Position
 
         if (!this.static) {
-            // Fixme: needs to read from actual level size
-            var levelSize = {
-                x: 600,
-                y: 400
-            }
-
             var posXStep = (this.position.target.x - this.position.current.x) * Settings.CAMERA_GLIDE / 100;
             this.position.current.x += posXStep;
 
             var posYStep = (this.position.target.y - this.position.current.y) * Settings.CAMERA_GLIDE / 100;
             this.position.current.y += posYStep;
 
-            this.container.x = this.position.current.x + levelSize.x / 2 - (-this.parallaxSpeed) * (this.position.current.x + levelSize.x / 2);
-            this.container.y = this.position.current.y + levelSize.y / 2 - (-this.parallaxSpeed) * (this.position.current.y + levelSize.y / 2);
-
-
             // Add here to set 0,0 not in the center of the map but the level origin in the top left
+            // FIXME: use a different kind of flag than "name"
             if (this.name == "spawn" 
                 || this.name == "tile" 
                 || this.name == "item"
                 || this.name == "ghost"
                 || this.name == "swiper"
                 || this.parallaxSpeed == 0) {
+
                 this.container.x = this.position.current.x;
                 this.container.y = this.position.current.y;
+
+            } else {
+                var x = this.position.current.x + this.levelSize.width / 2;
+                this.container.x = x - x * -this.parallaxSpeed;
+                var y = this.position.current.y + this.levelSize.height / 2;
+                this.container.y = y - y * -this.parallaxSpeed;
             }
 
             this.container.x *= this.zoom.current;

app/Game/Client/View/Pixi/Layers/Debug.js

@@ -10,9 +10,8 @@ function (Parent, PIXI) {
     function Debug() {
     	Parent.call(this, "debug", 0.00000001);
 
-
+        this.graphics = new PIXI.Graphics();
-      this.graphics = new PIXI.Graphics();
+        this.container.addChild(this.graphics);
-      this.container.addChild(this.graphics);
     }
 
     Debug.prototype = Object.create(Parent.prototype);

app/Game/Client/View/Pixi/Layers/Ghost.js

@@ -10,19 +10,25 @@ function (Parent, PIXI, Nc, Settings) {
 	"use strict";
  
     function Ghost() {
-    	Parent.call(this, "ghost", 0);
+    	Parent.call(this, "ghost", {parallaxSpeed: 0});
 
-		this.ncTokens = [
+		this.ncTokens = this.ncTokens.concat([
+            Nc.on(Nc.ns.client.view.layer.levelSizeUpdate, this.onLevelSizeUpdate, this),
             Nc.on(Nc.ns.client.view.playerArrow.createAndAdd, this.onCreateAndAddPlayerArrow, this),
             Nc.on(Nc.ns.client.view.playerArrow.update, this.onUpdatePlayerArrow, this),
             Nc.on(Nc.ns.client.view.healthBar.createAndAdd, this.onCreateAndAddHealthBar, this),
             Nc.on(Nc.ns.client.view.healthBar.update, this.onUpdateHealthBar, this),
             Nc.on(Nc.ns.client.view.healthBar.remove, this.onRemoveHealthBar, this),
-        ];
+        ]);
 
     }
 
     Ghost.prototype = Object.create(Parent.prototype);
+
+    Ghost.prototype.onLevelSizeUpdate = function(levelSize) {
+        this.position.current.x = -levelSize.width / 2;
+        this.position.current.y = -levelSize.height / 2;  
+    };
  
     Ghost.prototype.onCreateAndAddPlayerArrow = function(callback, options) {
 
@@ -107,12 +113,6 @@ function (Parent, PIXI, Nc, Settings) {
     Ghost.prototype.onRemoveHealthBar = function(healthBar) {
         this.container.removeChild(healthBar);
     };
-
-    Ghost.prototype.destroy = function() {
-        for (var i = 0; i < this.ncTokens.length; i++) {
-            Nc.off(this.ncTokens[i]);
-        };
-    };
  
     return Ghost;
  

app/Game/Client/View/Pixi/Layers/Messages.js

@@ -10,11 +10,11 @@ function (Parent, PIXI, Nc, Settings) {
     "use strict";
  
     function Messages() {
-    	Parent.call(this, "messages", -1);
+    	Parent.call(this, "messages", {parallaxSpeed:-1});
 
-		this.ncTokens = [
+		this.ncTokens = this.ncTokens.concat([
             Nc.on(Nc.ns.client.view.gameStats.kill, this.onKill, this)
-        ];
+        ]);
 
         this.mainTextOptions = {
             font: "normal 22px 'Joystix'",

app/Game/Client/View/Pixi/Layers/Swiper.js

@@ -8,14 +8,14 @@ define([
 function (Parent, PIXI, Nc, Settings) {
  
     function Swiper() {
-    	Parent.call(this, "swiper", 0);
+    	Parent.call(this, "swiper", {parallaxSpeed:0});
 
         this.static = true;
 
-    	this.ncTokens = [
+    	this.ncTokens = this.ncTokens.concat([
             Nc.on(Nc.ns.client.view.swiper.swipe, this.swipe, this),
             Nc.on(Nc.ns.client.view.swiper.end, this.end, this)
-        ];
+        ]);
 
         this.sprite = new PIXI.Graphics();
         this.container.addChild(this.sprite);

app/Game/Client/View/Pixi/View.js

@@ -66,6 +66,7 @@ function (Parent, DomController, PIXI, Settings, Nc, Exception, GameStats, Layer
 
         }
 
+        this.onDisplaySizeChange(false);
 
         this.stage = new PIXI.Stage(0x333333);
 
@@ -168,7 +169,7 @@ function (Parent, DomController, PIXI, Settings, Nc, Exception, GameStats, Layer
 
     PixiView.prototype.calculateCenterPosition = function() {
         var target = this.me.getHeadPosition();
-
+        
         var centerPosition = {x: target.x, y: target.y};
         centerPosition.x *= Settings.RATIO * -1;
         centerPosition.y *= Settings.RATIO * -1;

app/Game/Config/Settings.js

@@ -35,7 +35,7 @@ function () {
         ORIGINAL_TILE_SIZE: 25,
         TILE_SIZE: 20,
         CAMERA_IS_ORTHOGRAPHIC: true,
-        CAMERA_GLIDE: 12, // % of the way per frame
+        CAMERA_GLIDE: 6, // % of the way per frame
         VIEW_CONTROLLER: 0 ? "Three" : "Pixi",
         ARROW_GLIDE: 30, // % of the way per frame     
         SHOW_LAYER_INFO: false,

app/Lib/Utilities/NotificationCenter.js

@@ -32,7 +32,8 @@ function (Exception) {
                 },
                 view: {
                     layer: {
-                        createAndInsert: null
+                        createAndInsert: null,
+                        levelSizeUpdate: null
                     },
                     mesh: {
                         create: null,