diff --git a/cat.html b/cat.html index 1fc09fe..9c9dd53 100644 --- a/cat.html +++ b/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(); + } } diff --git a/todo b/todo index f97bb83..1319fef 100644 --- a/todo +++ b/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