loading graphic layers works with right order

This commit is contained in:
Jeena 2014-11-15 17:02:27 +01:00
parent 522b5092f5
commit 9c9db8ca8c
6 changed files with 132 additions and 33 deletions

View file

@ -88,6 +88,13 @@ function (Parent, Settings, Nc, PIXI, AbstractLayer) {
return paths;
};
Level.prototype.setupLayer = function(options, behind, referenceId) {
Parent.prototype.setupLayer.call(this, options, behind, referenceId);
console.log(options.layerId, behind, referenceId);
Nc.trigger(Nc.ns.client.view.layer.createAndInsert, options.layerId, 1, behind, referenceId);
};
/*
Level.prototype.createItems = function(options) {
options.layerId = AbstractLayer.ID.ITEM;
Nc.trigger(Nc.ns.client.view.layer.createAndInsert, options.layerId, 1, AbstractLayer.ID.SPAWN, true);
@ -110,5 +117,10 @@ function (Parent, Settings, Nc, PIXI, AbstractLayer) {
Parent.prototype.createSpawnPoints.call(this, options);
};
Level.prototype.createContainer = function(options) {
Parent.prototype.createContainer.call(this, options);
};
*/
return Level;
});

View file

@ -1,9 +1,10 @@
define([
"Game/Core/Loader/TiledLevel",
"Game/Config/Settings"
"Game/Config/Settings",
"Lib/Utilities/NotificationCenter",
],
function (Parent, Settings) {
function (Parent, Settings, Nc) {
function TiledLevel(uid, engine, gameObjects) {
this.layerId = "background";
@ -55,12 +56,38 @@ function (Parent, Settings) {
paths.push(texturePath);
};
// FIXME: iterate through image layers and add images
var background = this.getLayer(levelData, "background");
paths.push(Settings.MAPS_PATH + background.image);
return paths;
}
TiledLevel.prototype.setupLayer = function(options, behind, referenceId) {
Parent.prototype.setupLayer.call(this, options, behind, referenceId);
// So far only one image per layer is possible because of Tiled editor
if (options.type == "imagelayer") {
var texturePath = Settings.MAPS_PATH + options.image;
var callback = function(mesh) {
Nc.trigger(Nc.ns.client.view.mesh.add, options.layerId, mesh);
}
Nc.trigger(Nc.ns.client.view.mesh.create,
options.layerId,
texturePath,
callback,
{
x: 200
}
);
}
};
TiledLevel.prototype.addBackground = function(options) {
var texturePath = Settings.GRAPHICS_PATH + options.image;

View file

@ -33,7 +33,6 @@ function (Abstract, DomController, Settings, Exception, Nc) {
}
Abstract.prototype.addMethod.call(AbstractView, 'render');
Abstract.prototype.addMethod.call(AbstractView, 'createAndInsert', ['id', 'parallaxSpeed', 'referenceId', 'behind']);
Abstract.prototype.addMethod.call(AbstractView, 'addFilter', ['mesh', 'options']);
Abstract.prototype.addMethod.call(AbstractView, 'removeFilter', ['mesh', 'options']);
Abstract.prototype.addMethod.call(AbstractView, 'setCameraPosition', ['x', 'y']);

View file

@ -22,7 +22,11 @@ function (Nc, Exception, Layer) {
];
}
LayerManager.prototype.createAndInsert = function(id, parallaxSpeed, referenceId, behind) {
/*
* 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) {
var referenceIndex = -1;
behind = !!behind;
@ -44,11 +48,13 @@ function (Nc, Exception, Layer) {
}
var layer = new Layer(id, parallaxSpeed);
var layerIndex = behind ? referenceIndex -1 : referenceIndex;
var layerIndex = behind ? referenceIndex : referenceIndex + 1;
this.layers.splice(layerIndex, 0, layer);
this.rearrangeLayers();
console.log(this.layers.map(function(o) {return o.name}))
};
LayerManager.prototype.rearrangeLayers = function() {

View file

@ -65,6 +65,15 @@ define([
this.spawnPoints = points;
};
Level.prototype.setupLayer = function(options, behind, referenceId) {
// will be extended (so far only in client)
}
Level.prototype.createContainer = function(options) {
// nothing to do here yet, in the future perhaps synchronize day/night graphics
};
Level.prototype.getRandomSpawnPoint = function() {
if(!this.spawnPoints) {
return {

View file

@ -6,20 +6,21 @@ define([
"Lib/Utilities/Options",
"Lib/Utilities/Exception",
"Lib/Utilities/NotificationCenter",
"Game/Client/View/Abstract/Layer",
"Game/" + GLOBALS.context + "/Collision/Detector",
"Game/" + GLOBALS.context + "/GameObjects/Tile",
"Game/" + GLOBALS.context + "/GameObjects/Item",
"Game/" + GLOBALS.context + "/GameObjects/Items/Skateboard",
], function (Parent, Settings, ItemSettings, Box2D, Options, Exception, Nc, CollisionDetector, Tile, Item, Skateboard) {
], function (Parent, Settings, ItemSettings, Box2D, Options, Exception, Nc, AbstractLayer, CollisionDetector, Tile, Item, Skateboard) {
function TiledLevel (path, engine) {
this.layerMapping = {
tiles: this.createTiles.bind(this),
//collision: this.createTiles.bind(this), collision renamed to tiles
items: this.createItems.bind(this),
spawnpoints: this.createSpawnPoints.bind(this)
//collision: this.createTiles.bind(this), collision renamed to tiles
};
this.levelData = null;
@ -32,42 +33,87 @@ define([
TiledLevel.prototype.setup = function(levelData) {
this.levelData = levelData;
// Make sure spawnpoints layer is created first because of add before and behind
var layers = levelData.layers.sort(function(a, b) {
return a.name == "spawnpoints" ? -1 : b.name == "spawnpoints" ? 1 : 0;
var spawnpointsExists = levelData.layers.some(function(o) {
return o.name == "spawnpoints";
});
for (var i = 0; i < layers.length; i++) {
var layerOptions = layers[i];
layerOptions.z = i;
if(this.layerMapping[layerOptions.name]) {
this.layerMapping[layerOptions.name](layerOptions);
} else {
if (!spawnpointsExists) {
console.warn('No layerMapping for level file layer: ' + layerOptions.name);
return;
}
function getLayerId(name, i) {
var mapping = {
tiles: AbstractLayer.ID.TILE,
items: AbstractLayer.ID.ITEM,
spawnpoints: AbstractLayer.ID.SPAWN
}
if(mapping[name]) {
return mapping[name];
}
return "layer-" + i + "-" + name;
}
var spawnpointsFound = false,
lastLayerId;
// from spawnpoints to background
for (var i = levelData.layers.length - 1; i >= 0; i--) {
var layerOptions = levelData.layers[i];
layerOptions.z = i;
layerOptions.layerId = getLayerId(layerOptions.name, i);
if (layerOptions.name == "spawnpoints") {
spawnpointsFound = true;
}
if (!spawnpointsFound) {
continue;
}
this.setupLayer(layerOptions, true, lastLayerId);
if(this.layerMapping[layerOptions.name]) {
this.layerMapping[layerOptions.name](layerOptions);
}
lastLayerId = layerOptions.layerId;
}
spawnpointsFound = false; // reset (used in mkLayer)
lastLayerId = AbstractLayer.ID.SPAWN;
// from spawnpoints to foreground
for (var i = 0; i < levelData.layers.length; i++) {
var layerOptions = levelData.layers[i];
layerOptions.z = i;
layerOptions.layerId = getLayerId(layerOptions.name, i);
if (layerOptions.name == "spawnpoints") {
spawnpointsFound = true;
continue;
}
if (!spawnpointsFound) {
continue;
}
this.setupLayer(layerOptions, false, lastLayerId);
if(this.layerMapping[layerOptions.name]) {
this.layerMapping[layerOptions.name](layerOptions);
}
lastLayerId = layerOptions.layerId;
};
Parent.prototype.setup.call(this, levelData);
};
/*
TiledLevel.prototype.addBackground = function(path) {
var texturePath = Settings.GRAPHICS_PATH + "Backgrounds/starnight.png";
var callback = function (mesh) {
Nc.trigger(Nc.ns.client.view.mesh.add, mesh, 0); // FIXME: add at z layer -1 or so
}
Nc.trigger(Nc.ns.client.view.mesh.create, texturePath, callback, {
width: 4000,
height: 2959,
x: -(4000 - Settings.STAGE_WIDTH) / 2,
y: -(2959 + Settings.STAGE_HEIGHT + 700) / 2
});
}
*/
TiledLevel.prototype.createTiles = function(options) {
console.log('core tiledlevel createTiles');
var data = options.data;
var tilesOptions = [];