*add firework effect for attaining goals
This commit is contained in:
Rob Pearce
parent
9176b45a50
commit
3df326dbbf
184
cat.html
184
cat.html
|
|
@ -181,6 +181,12 @@ var THINGSIZE = null;
|
|||
var GRIDW = null;
|
||||
var GRIDH = null;
|
||||
|
||||
var FIREWORKSIZE = 5;
|
||||
var FIREWORKFADESPEED = 0.015;
|
||||
var FIREWORKSHARDS = 32;
|
||||
var FIREWORKCOUNT = 4;
|
||||
var FIREWORKTRAILLEN = 5;
|
||||
|
||||
var MAXDIRS = 4;
|
||||
var DIRXMOD = [ 0, 1, 0, -1 ];
|
||||
var DIRYMOD = [ -1, 0, 1, 0 ];
|
||||
|
|
@ -1104,7 +1110,39 @@ var game = {
|
|||
|
||||
canvas: null,
|
||||
|
||||
addfirework : function() {
|
||||
addfireworks : function() {
|
||||
var delay = 0;
|
||||
for (i = 0; i < FIREWORKCOUNT; i++) {
|
||||
this.addfirework(delay);
|
||||
delay += 5;
|
||||
}
|
||||
},
|
||||
|
||||
addfirework : function(delay) {
|
||||
var i,nshards = FIREWORKSHARDS;
|
||||
var x,y,col;
|
||||
switch (rnd(6)) {
|
||||
case 0: col = "#ff0000"; break;
|
||||
case 1: col = "#00ff00"; break;
|
||||
case 2: col = "#0000ff"; break;
|
||||
case 3: col = "#ffff00"; break;
|
||||
case 4: col = "#00ffff"; break;
|
||||
case 5: col = "#ff00ff"; break;
|
||||
default: col = "#ff0000"; break;
|
||||
}
|
||||
x = rnd(GRIDW);
|
||||
y = rnd(GRIDH);
|
||||
console.log("adding fw at " + x + "," + y);
|
||||
for (i = 0; i < nshards; i++) {
|
||||
things.push(new thing(x, y, "firework", "firework-text", col));
|
||||
if (delay != undefined) {
|
||||
things[things.length-1].delay = delay;
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
|
||||
addflash : function() {
|
||||
this.screenflash = 1.0;
|
||||
game.dirty = true;
|
||||
},
|
||||
|
|
@ -1498,8 +1536,8 @@ console.log("lev " + lev + " newwid " + newwid + " ratio " + ratio);
|
|||
this.levels[curlevel].goals[i].progress = this.levels[curlevel].goals[i].count;
|
||||
|
||||
// add goal animation - fireworks ?
|
||||
//things.push(new thing(2,2, "text", "Goal!"));
|
||||
this.addfirework();
|
||||
game.addflash();
|
||||
game.addfireworks();
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -4548,7 +4586,8 @@ console.log("lev " + lev + " newwid " + newwid + " ratio " + ratio);
|
|||
}
|
||||
game.dirty = true;
|
||||
} else if (ch == 't') {
|
||||
game.addfirework();
|
||||
game.addflash();
|
||||
game.addfireworks();
|
||||
} else if (ch == 'l') {
|
||||
var what;
|
||||
console.log("changing last clicked thing thing at " + lastmx/GRIDSIZE + "," + lastmy/GRIDSIZE );
|
||||
|
|
@ -4794,6 +4833,7 @@ console.log("lev " + lev + " newwid " + newwid + " ratio " + ratio);
|
|||
//tapy = BOARDY + ((GRIDH*GRIDSIZE)/2) - (taph/2);
|
||||
tapx = 0;
|
||||
tapy = BOARDY;
|
||||
|
||||
} else if (newstate == "running") {
|
||||
this.initlevelvars();
|
||||
this.populategrid();
|
||||
|
|
@ -5132,7 +5172,7 @@ function collectprize(bag) {
|
|||
|
||||
if (bag.prize == "") return;
|
||||
|
||||
game.addfirework();
|
||||
game.addflash();
|
||||
|
||||
switch (bag.prize) {
|
||||
case "tissues": // all sleepy cats wake up
|
||||
|
|
@ -5320,6 +5360,9 @@ function thing(gridx, gridy, type, text, col) {
|
|||
this.slashes = []; // drawing slashes on bricks when damaged
|
||||
// list x,y coords. 0=x1 1=y2 3=x2 4=y2 etc.
|
||||
|
||||
this.lastx = []; // for firework trails
|
||||
this.lasty = [];
|
||||
|
||||
if (type == "random") {
|
||||
type = getrandomtype();
|
||||
//console.log("got random type "+ type);
|
||||
|
|
@ -5377,6 +5420,8 @@ function thing(gridx, gridy, type, text, col) {
|
|||
} else {
|
||||
this.size = TEXTSIZE;
|
||||
}
|
||||
} else if (this.type == "firework") {
|
||||
this.size = FIREWORKSIZE;
|
||||
} else {
|
||||
this.size = THINGSIZE;
|
||||
}
|
||||
|
|
@ -5404,6 +5449,8 @@ function thing(gridx, gridy, type, text, col) {
|
|||
}
|
||||
this.gridy = gridy;
|
||||
|
||||
this.delay = 0; // for fireworks
|
||||
|
||||
this.expcount = 0;
|
||||
this.expfadespeed = 0;
|
||||
this.expmax = 0;
|
||||
|
|
@ -5414,6 +5461,9 @@ function thing(gridx, gridy, type, text, col) {
|
|||
} else if (this.type == "brickpop") {
|
||||
this.yspeed = 0 - rndfloat(8);
|
||||
this.xspeed = rndfloat(32) - 16;
|
||||
} else if (this.type == "firework") {
|
||||
this.yspeed = 0 - rndfloat(16);
|
||||
this.xspeed = rndfloat(16) - 8;
|
||||
} else {
|
||||
this.yspeed = 0;
|
||||
this.xspeed = 0;
|
||||
|
|
@ -5648,6 +5698,11 @@ function thing(gridx, gridy, type, text, col) {
|
|||
|
||||
//ctx = game.context;
|
||||
|
||||
// don't draw delaying things
|
||||
if (this.delay > 0) {
|
||||
return;
|
||||
}
|
||||
|
||||
// check whether I'm in the drawn path
|
||||
if (pathcontains(this)) {
|
||||
inpath = true;
|
||||
|
|
@ -5658,11 +5713,58 @@ function thing(gridx, gridy, type, text, col) {
|
|||
ctx.globalAlpha = this.opacity;
|
||||
}
|
||||
|
||||
|
||||
// draw myself
|
||||
if (this.type == "text") {
|
||||
ctx.textAlign = "center";
|
||||
ctx.textBaseline = "middle";
|
||||
shadowtext(ctx, this.name, this.size, this.color, BOARDX + this.x,BOARDY + this.y);
|
||||
} else if (this.type == "firework") {
|
||||
var myx,myy;
|
||||
|
||||
|
||||
// draw trail
|
||||
if (this.lastx != undefined) {
|
||||
var i;
|
||||
for (i = 0; i < this.lastx.length ; i++) {
|
||||
var newopac = this.opacity + ((i+1)*FIREWORKFADESPEED);
|
||||
var nextx,netxy;
|
||||
if (newopac > 1) newopac = 1;
|
||||
|
||||
/*
|
||||
if (i == 0) {
|
||||
nextx = this.x - this.size/2;
|
||||
nexty = this.y - this.size/2;
|
||||
} else {
|
||||
nextx = this.lastx[i-1] - this.size/2;
|
||||
nexty = this.lasty[i-1] - this.size/2;
|
||||
}
|
||||
*/
|
||||
myx = this.lastx[i] - this.size/2;
|
||||
myy = this.lasty[i] - this.size/2;
|
||||
|
||||
//console.log("fw line: " + myx + "," + myy + " -> " + nextx + "," + nexty);
|
||||
|
||||
ctx.globalAlpha = newopac;
|
||||
ctx.fillStyle = this.color;
|
||||
ctx.lineWidth = this.size;
|
||||
ctx.fillRect(BOARDX + myx, BOARDY + myy, this.size, this.size);
|
||||
/*
|
||||
drawline(ctx, BOARDX + myx, BOARDY + myy,
|
||||
BOARDX + nextx, BOARDY + nexty,
|
||||
this.col, this.size);
|
||||
*/
|
||||
ctx.globalAlpha = 1.0;
|
||||
}
|
||||
}
|
||||
|
||||
myx = this.x - this.size/2;
|
||||
myy = this.y - this.size/2;
|
||||
|
||||
ctx.globalAlpha = this.opacity;
|
||||
ctx.fillStyle = this.color;
|
||||
ctx.fillRect(BOARDX + myx, BOARDY + myy, this.size, this.size);
|
||||
ctx.globalAlpha = 1.0;
|
||||
} else {
|
||||
var myimage;
|
||||
if (this.type == "cat") {
|
||||
|
|
@ -5954,6 +6056,9 @@ function thing(gridx, gridy, type, text, col) {
|
|||
|
||||
this.isanimating = function() {
|
||||
if (this.type == "text") return true;
|
||||
if (this.type == "firework") return true;
|
||||
if (this.type == "bagpop") return true;
|
||||
if (this.type == "brickpop") return true;
|
||||
if (this.state == "explode") return true;
|
||||
if (this.state == "shrink") return true;
|
||||
if (this.state == "parade") return true;
|
||||
|
|
@ -6059,32 +6164,72 @@ function thing(gridx, gridy, type, text, col) {
|
|||
var dofall = false;
|
||||
var belowthing = null,atbottom = false;
|
||||
|
||||
|
||||
if ((this.type == "bagpop") || (this.type == "brickpop")) {
|
||||
if (this.type == "firework" && this.delay > 0) {
|
||||
this.delay--;
|
||||
} else if ((this.type == "bagpop") || (this.type == "brickpop") || (this.type == "firework")) {
|
||||
game.dirty = true; // need to redraw
|
||||
|
||||
// regular gravity
|
||||
if ((this.gridy >= GRIDH-1)) {
|
||||
atbottom = true;
|
||||
if (this.type == "firework") {
|
||||
if (this.y >= SCREENH) {
|
||||
atbottom = true;
|
||||
}
|
||||
} else {
|
||||
if ((this.gridy >= GRIDH-1)) {
|
||||
atbottom = true;
|
||||
}
|
||||
}
|
||||
if (!atbottom) {
|
||||
game.dirty = true; // need to redraw
|
||||
// accelerate
|
||||
this.yspeed += GRAVITY;
|
||||
|
||||
// remember previous positions
|
||||
if (this.type == "firework") {
|
||||
// add current position to trail
|
||||
this.lastx.push(this.x);
|
||||
this.lasty.push(this.y);
|
||||
|
||||
// remove old positions from trail
|
||||
while (this.lastx.length >= FIREWORKTRAILLEN) {
|
||||
this.lastx.splice(0, 1);
|
||||
}
|
||||
while (this.lasty.length >= FIREWORKTRAILLEN) {
|
||||
this.lasty.splice(0, 1);
|
||||
}
|
||||
}
|
||||
|
||||
// move
|
||||
this.y += this.yspeed;
|
||||
this.x += this.xspeed;
|
||||
|
||||
// don't go below bottom of screen
|
||||
if (this.y > GRIDSIZE * GRIDH) {
|
||||
atbottom = true;
|
||||
if (this.type == "firework") {
|
||||
if (this.y >= SCREENH) {
|
||||
atbottom = true;
|
||||
}
|
||||
} else {
|
||||
if (this.y > GRIDSIZE * GRIDH) {
|
||||
atbottom = true;
|
||||
}
|
||||
}
|
||||
|
||||
// calc new gridx / gridy
|
||||
this.calcgridxy();
|
||||
|
||||
if ((this.gridy >= GRIDH-1)) {
|
||||
if (this.type != "firework") {
|
||||
if ((this.gridy >= GRIDH-1)) {
|
||||
atbottom = true;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
// fade
|
||||
if (this.type == "firework") {
|
||||
this.opacity -= FIREWORKFADESPEED;
|
||||
if (this.opacity <= 0) {
|
||||
this.opacity = 0;
|
||||
atbottom = true;
|
||||
}
|
||||
}
|
||||
|
|
@ -6366,13 +6511,13 @@ function mainloop() {
|
|||
game.drawsides();
|
||||
// draw non-animating objects
|
||||
for (i = 0; i < things.length; i += 1) {
|
||||
if (!things[i].isanimating()) {
|
||||
if (!things[i].isanimating() && things[i].type != "firework") {
|
||||
things[i].draw();
|
||||
}
|
||||
}
|
||||
// draw animating objects
|
||||
for (i = 0; i < things.length; i += 1) {
|
||||
if (things[i].isanimating()) {
|
||||
if (things[i].isanimating() && things[i].type != "firework") {
|
||||
things[i].draw();
|
||||
}
|
||||
}
|
||||
|
|
@ -6385,6 +6530,17 @@ function mainloop() {
|
|||
if ((game.state == "levelcomplete") || (game.state == "gameover")) {
|
||||
// draw buttons
|
||||
game.drawcontinuebutton();
|
||||
// spawn new fireworks
|
||||
if (countthingsoftype("firework") < (FIREWORKSHARDS*2)) {
|
||||
game.addfirework();
|
||||
}
|
||||
}
|
||||
|
||||
// draw fireworks
|
||||
for (i = 0; i < things.length; i += 1) {
|
||||
if (things[i].type == "firework") {
|
||||
things[i].draw();
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
|
|
|||
23
todo
23
todo
|
|
@ -11,33 +11,14 @@ https://www.smashingmagazine.com/2012/10/design-your-own-mobile-game/
|
|||
|
||||
-------------------
|
||||
|
||||
|
||||
*move goal progress increments to thing.kill() function
|
||||
*Make 'allowedthings' default to previous level's one.
|
||||
*fix lev6 help
|
||||
*bugfix: whitecats aren't ever appearing randomly?
|
||||
*new object: bricks
|
||||
*Don't allow extending path off the top of the grid.
|
||||
*fix incorrect pluralisation "foods" in goal text
|
||||
|
||||
??????????????
|
||||
no points for cats hitting bricks
|
||||
give points when things DIE, not when you start a parade.
|
||||
make points for parades come from the _side_ of the screen.
|
||||
(where the cats/whatever disappear)
|
||||
|
||||
make kill() take an arg ("don't give progress/points")
|
||||
|
||||
adjust brick points goal
|
||||
??????????????
|
||||
*add firework effect for attaining goals
|
||||
|
||||
new door fell down on top of new goat!!
|
||||
(or the other way around ??)
|
||||
check code for doors falling when off the top of the screen.
|
||||
check code for adding new objects at top of screen.
|
||||
|
||||
Powerup to break bricks
|
||||
|
||||
Powerup to break bricks (but only after bricks appear)
|
||||
|
||||
other colour cats
|
||||
|
||||
|
|
|
|||
Loading…
Reference in New Issue