Add rock sprites and Z sorting of sprites
This commit is contained in:
parent
1cd11d05bb
commit
c899948192
8 changed files with 76 additions and 20 deletions
BIN
assets/sprites/rock-large.png
Normal file
BIN
assets/sprites/rock-large.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 1.5 KiB |
BIN
assets/sprites/rock-medium.png
Normal file
BIN
assets/sprites/rock-medium.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 1.1 KiB |
BIN
assets/sprites/rock-small.png
Normal file
BIN
assets/sprites/rock-small.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 587 B |
|
@ -56,15 +56,25 @@ LevelDatabase = {
|
|||
],
|
||||
|
||||
rocks: [
|
||||
{x: 768, y: 798, z: -256, type: "tall"},
|
||||
{x: 738, y: 768, z: -256, type: "short"},
|
||||
{x: 768, y: 738, z: -256, type: "tall"},
|
||||
{x: 798, y: 768, z: -256, type: "short"},
|
||||
{x: 768, y: 798, z: 0, type: "small"},
|
||||
{x: 738, y: 768, z: 0, type: "large"},
|
||||
{x: 768, y: 738, z: 0, type: "small"},
|
||||
{x: 798, y: 768, z: 0, type: "large"},
|
||||
|
||||
{x: 1536, y: 798, z: -256, type: "tall"},
|
||||
{x: 1506, y: 768, z: -256, type: "short"},
|
||||
{x: 1536, y: 738, z: -256, type: "tall"},
|
||||
{x: 1566, y: 768, z: -256, type: "short"}
|
||||
{x: 1536, y: 798, z: 0, type: "small"},
|
||||
{x: 1506, y: 768, z: 0, type: "large"},
|
||||
{x: 1536, y: 738, z: 0, type: "small"},
|
||||
{x: 1566, y: 768, z: 0, type: "large"},
|
||||
|
||||
{x: 768, y: 1298, z: 0, type: "small"},
|
||||
{x: 738, y: 1268, z: 0, type: "large"},
|
||||
{x: 768, y: 1238, z: 0, type: "small"},
|
||||
{x: 798, y: 1268, z: 0, type: "large"},
|
||||
|
||||
{x: 1536, y: 1298, z: 0, type: "small"},
|
||||
{x: 1506, y: 1268, z: 0, type: "large"},
|
||||
{x: 1536, y: 1238, z: 0, type: "small"},
|
||||
{x: 1566, y: 1268, z: 0, type: "large"}
|
||||
],
|
||||
|
||||
spawn: {
|
||||
|
|
|
@ -84,9 +84,9 @@ Dolphin = function(level, axis, position, z) {
|
|||
dolphin.position.x += Math.cos(dolphin.angle) * axis.radius;
|
||||
dolphin.position.y += Math.sin(dolphin.angle) * axis.radius;
|
||||
} else {
|
||||
dolphin.angle = (axis.angle - 90) * Math.PI / 180;
|
||||
dolphin.position.x += Math.sin(dolphin.angle) * dolphin.axis.position;
|
||||
dolphin.position.y -= Math.cos(dolphin.angle) * dolphin.axis.position;
|
||||
dolphin.angle = (axis.angle + 90) * Math.PI / 180;
|
||||
dolphin.position.x -= Math.sin(dolphin.angle) * dolphin.axis.position;
|
||||
dolphin.position.y += Math.cos(dolphin.angle) * dolphin.axis.position;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
@ -10,6 +10,7 @@ Entity = function(level, x, y, z) {
|
|||
entity.addSprite = function(name, sprite) {
|
||||
anims[name] = sprite;
|
||||
level.addSprite(sprite);
|
||||
sprite.ZINDEX = 0;
|
||||
}
|
||||
|
||||
entity.currentSprite = function(name) {
|
||||
|
|
|
@ -25,6 +25,10 @@ Level = function(levelName) {
|
|||
level.init = function() {
|
||||
dolphin = Dolphin(level, level.map.spawn.axis, level.map.spawn.position, level.map.spawn.z);
|
||||
placeEntityInGrid(dolphin);
|
||||
|
||||
level.map.rocks.forEach(function(rock) {
|
||||
placeEntityInGrid(Rock(level, rock.x, rock.y, rock.z, rock.type));
|
||||
});
|
||||
}
|
||||
|
||||
level.think = function() {
|
||||
|
@ -36,9 +40,15 @@ Level = function(levelName) {
|
|||
});
|
||||
|
||||
// Camera thinker.
|
||||
camera.x = 1024;
|
||||
camera.y = 384;
|
||||
camera.angle = Math.PI / 2;
|
||||
var targetX, targetY;
|
||||
|
||||
targetX = dolphin.position.x - 250*Math.cos(dolphin.angle);
|
||||
targetY = dolphin.position.y - 250*Math.sin(dolphin.angle);
|
||||
|
||||
camera.x += (targetX - camera.x) / 4;
|
||||
camera.y += (targetY - camera.y) / 4;
|
||||
camera.z = dolphin.position.z;
|
||||
camera.angle = Math.atan2(dolphin.position.y - camera.y, dolphin.position.x - camera.x);
|
||||
}
|
||||
|
||||
level.render = function(frames) {
|
||||
|
@ -47,6 +57,10 @@ Level = function(levelName) {
|
|||
return;
|
||||
}
|
||||
|
||||
var sprite = entity.activeSprite;
|
||||
|
||||
sprite.visible = false;
|
||||
|
||||
// Start with the angle and distance for the entity.
|
||||
var xdist, ydist,
|
||||
angle, distance;
|
||||
|
@ -55,14 +69,13 @@ Level = function(levelName) {
|
|||
angle = (Math.atan2(ydist, xdist) - camera.angle + Math.PI) % (2 * Math.PI) - Math.PI;
|
||||
distance = Math.sqrt(ydist*ydist + xdist*xdist);
|
||||
|
||||
if (distance > 1024 || distance < 1 || Math.abs(angle) > Math.PI/2) {
|
||||
if (distance > 1024 || distance < 16 || Math.abs(angle) > Math.PI/2) {
|
||||
// Not in the viewport.
|
||||
entity.activeSprite.visible = false;
|
||||
return;
|
||||
}
|
||||
|
||||
// In the viewport.
|
||||
entity.activeSprite.visible = true;
|
||||
sprite.visible = true;
|
||||
|
||||
distance *= Math.cos(angle);
|
||||
|
||||
|
@ -73,9 +86,23 @@ Level = function(levelName) {
|
|||
scrY = (entity.position.z - camera.z)*scrScale + 150;
|
||||
|
||||
// Set sprite position.
|
||||
entity.activeSprite.position.set(scrX, scrY);
|
||||
entity.activeSprite.scale.set(scrScale, scrScale);
|
||||
entity.activeSprite.alpha = Math.min(4 - (distance/256), 1);
|
||||
sprite.position.set(scrX, scrY);
|
||||
sprite.scale.set(scrScale, scrScale);
|
||||
sprite.alpha = Math.min(4 - (distance/256), 1);
|
||||
|
||||
// Use distance to sort.
|
||||
sprite.ZINDEX = Math.round(distance/8);
|
||||
|
||||
var index = level.stage.getChildIndex(sprite);
|
||||
try {
|
||||
while (index > 0 && level.stage.getChildAt(index-1).ZINDEX < sprite.ZINDEX) {
|
||||
index--;
|
||||
}
|
||||
while (level.stage.getChildAt(index+1).ZINDEX > sprite.ZINDEX) {
|
||||
index++;
|
||||
}
|
||||
} catch (e) {}
|
||||
level.stage.setChildIndex(sprite, index);
|
||||
});
|
||||
}
|
||||
|
||||
|
|
18
level/Rock.js
Normal file
18
level/Rock.js
Normal file
|
@ -0,0 +1,18 @@
|
|||
Rock = function(level, x, y, z, size) {
|
||||
var rock = Entity(level, x, y, z);
|
||||
|
||||
rock.bbox = {
|
||||
x: 12,
|
||||
y: 12,
|
||||
z: ({
|
||||
small: 12,
|
||||
medium: 31,
|
||||
large: 47
|
||||
})[size]
|
||||
};
|
||||
|
||||
rock.addSprite("sprite", Renderer.sprite("rock-" + size));
|
||||
rock.currentSprite("sprite");
|
||||
|
||||
return rock;
|
||||
};
|
Loading…
Add table
Reference in a new issue