/**/ 'use strict'; window.onload = function() { var canvas = document.getElementById('canvas'); var width = canvas.width = window.innerWidth; var height = canvas.height = window.innerHeight; var context = canvas.getContext('2d'); var Q = 0; var w4 = width / 4; var w2 = width / 2; var w = width; var h4 = height / 4; var h2 = height / 2; var h = height; var flowers = []; var fireworks = []; function drawShape(startX, startY, controlX, controlY, endX, endY, color, startLine) { context.fillStyle = color; context.beginPath(); if(startLine) { context.moveTo(startLine.x, startLine.y); context.lineTo(startX, startY); } else { context.moveTo(startX, startY); } context.quadraticCurveTo(controlX, controlY, endX, endY); context.closePath(); context.fill(); } function drawText(text, size, color, x, y) { context.fillStyle = color; context.font = size + 'px Slackey'; context.textAlign = 'center'; context.textBaseline = 'middle'; context.fillText(text, x, y); } function drawCircle(x, y, radius, color) { context.fillStyle = color; context.beginPath(); context.arc(Math.abs(x), Math.abs(y), Math.abs(radius), 0, Math.PI * 2, false); context.closePath(); context.fill(); } function randomColor() { var color = 'rgb('; var coma = ', ' var red = Math.floor(Math.random() * 256); var green = Math.floor(Math.random() * 256); var blue = Math.floor(Math.random() * 256); color += red + coma + green + coma + blue; return color + ')'; } function Firework(x, y) { this.x = x; this.y = y; this.dx = []; this.dy = []; this.r = []; this.s = []; this.c = []; this.q = Math.floor(Math.random() * 20) + 10; this.a = []; this.dd = []; this.ss = []; this.d = false; for(var q = 0; q < this.q; q += 1) { this.dx[q] = this.x; this.dy[q] = this.y; this.s[q] = Math.floor(Math.random() * 9) + 1; this.r[q] = Math.floor(width / 100) + Math.floor(Math.random() * 10); this.c[q] = randomColor(); this.a[q] = Math.floor(Math.random() * 360) * Math.PI / 180; this.dd[q] = Math.floor(Math.random() * 2) === 0 ? -1 : 1; this.ss[q] = parseFloat('0.0' + (Math.floor(Math.random() * 9) + 1)); } } Firework.prototype.draw = function() { for(var q = 0; q < this.q; q += 1) { drawCircle(this.dx[q], this.dy[q], this.r[q], this.c[q]); } }; Firework.prototype.move = function() { for(var q = 0; q < this.q; q += 1) { this.dx[q] += this.dd[q] * this.s[q] * Math.cos(this.a[q]); this.dy[q] += this.dd[q] * this.s[q] * Math.sin(this.a[q]); this.r[q] -= this.ss[q]; } }; Firework.prototype.check = function() { for(var q = 0; q < this.q; q += 1) { if(this.dx[q] < 0 || this.dy[q] < 0 || this.dx[q] > width || this.dy[q] > height) { this.d = true; break; } } }; function Flower(x, y) { this.x = x; this.y = y; this.r = Math.floor(width / 100); this.R = this.r; this.r3 = Math.floor(this.r / 3); this.r2 = Math.floor(this.r / 2); this.c = randomColor(); this.pc = [randomColor(), randomColor()]; this.tc = 7; this.t = Math.floor(Math.random() * this.tc); this.rs = Math.floor(Math.random() * 9) + 1; this.gs = parseFloat('0.0' + this.rs); this.d = false; } Flower.prototype.draw = function() { drawCircle(this.x, this.y, this.r, this.c); if(this.t === 0) {//1 for(var q = 0, Q = 0; q <= 360; q += 30, Q += 1) { var c = Q % 2 === 0 ? this.pc[0] : this.pc[1]; drawCircle(this.x + this.r * Math.cos(q * Math.PI / 180), this.y + this.r * Math.sin(q * Math.PI / 180), this.r3, c); } } else if(this.t === 1) {//2 for(var q = 0, Q = 0; q <= 360; q += 45, Q += 1) { var c = Q % 2 === 0 ? this.pc[0] : this.pc[1]; drawCircle(this.x + this.r * Math.cos(q * Math.PI / 180), this.y + this.r * Math.sin(q * Math.PI / 180), this.r2, c); } } else if(this.t === 2) {//3 for(var q = 0, Q = 0; q <= 360; q += 36, Q += 1) { var c = Q % 2 === 0 ? this.pc[0] : this.pc[1]; drawShape(this.x + this.r * Math.sin(q * Math.PI / 180), this.y + this.r * Math.cos(q * Math.PI / 180), this.x + this.r - this.r2 * Math.sin(q * Math.PI / 180), this.y + this.r - this.r2 * Math.cos(q * Math.PI / 180), this.x + this.r * 2 * Math.cos(q * Math.PI / 180), this.y + this.r * 2 * Math.sin(q * Math.PI / 180), c); drawCircle(this.x + this.r * Math.cos(q * Math.PI / 180), this.y + this.r * Math.sin(q * Math.PI / 180), this.r3, c); } } else if(this.t === 3) {//4 for(var q = 0, Q = 0; q <= 360; q += 24, Q += 1) { var c = Q % 2 === 0 ? this.pc[0] : this.pc[1]; drawCircle(this.x + this.r * Math.sin(q * Math.PI / 180), this.y + this.r * Math.cos(q * Math.PI / 180), this.r2, c); } } else if(this.t === 4) {//5 for(var q = 0, Q = 0; q <= 360; q += 40, Q += 1) { var c = Q % 2 === 0 ? this.pc[0] : this.pc[1]; var c2 = c === this.pc[0] ? this.pc[1] : this.pc[0]; drawCircle(this.x + this.r * 2 * Math.sin(q * Math.PI / 180), this.y + this.r * Math.cos(q * Math.PI / 180), this.r2, c); drawCircle(this.x + this.r * Math.sin(q * Math.PI / 180), this.y + this.r * Math.cos(q * Math.PI / 180), this.r2, c2); } } else if(this.t === 5) {//6 for(var q = 0, Q = 0; q <= 360; q += 24, Q += 1) { var c = Q % 2 === 0 ? this.pc[0] : this.pc[1]; drawCircle(this.x + this.r * Math.cos(q * Math.PI / 180), this.y + this.r * Math.sin(q * Math.PI / 180), this.r2, c); drawCircle(this.x - this.r + Q * Math.cos(q * Math.PI / 180), this.y - this.r + Q * Math.sin(q * Math.PI / 180), this.r2, c); drawCircle(this.x + this.r - Q * Math.sin(q * Math.PI / 180), this.y + this.r - Q * Math.cos(q * Math.PI / 180), this.r2, c); } } else if(this.t === 6) {//7 for(var q = 0, Q = 0; q <= 360; q += 120, Q += 1) { var c = Q % 2 === 0 ? this.pc[0] : this.pc[1]; drawCircle(this.x + this.r * Math.cos(q * Math.PI / 180), this.y + this.r * Math.sin(q * Math.PI / 180), this.r2, c); for(var q = 0, Q = 0; q <= 360; q += 120, Q += 1) { var c = Q % 2 === 0 ? this.pc[0] : this.pc[1]; drawCircle(this.x + this.r3 * Math.cos(q * Math.PI / 180), this.y + this.r3 * Math.sin(q * Math.PI / 180), this.r2, c); } } } }; Flower.prototype.grow = function() { this.r += this.gs; this.r2 += this.gs; this.r3 += this.gs; if(this.r >= this.R * 3) { this.d = true; } }; Flower.prototype.blow = function() { fireworks.push(new Firework(this.x, this.y)); }; Flower.prototype.move = function() { // }; function drawBackground() { context.fillStyle = 'yellowgreen'; context.fillRect(0, 0, w, h); drawShape(0, 0, w2, h2, w - w4, 0, 'lightgreen'); drawShape(0, h, w2, h2, w, h, 'lawngreen'); drawShape(0, 0, w2, h2, 0, h, 'forestgreen'); drawShape(w, 0, w2, h2, w, h, 'seagreen'); drawShape(w4, 0, w2, h2, 0, h2, 'green', {x: 0, y: 0}); drawShape(w, h4, w2, h2, w2, 0, 'limegreen', {x: w, y: 0}); drawShape(w4, h, w2, h2, 0, h - h4, 'olive', {x: 0, y: h}); drawShape(w - w4, h, w2, h2, w, h2, 'olivedrab', {x: w, y: h}); drawText('THANK YOU SO MUCH,', 20, 'maroon', w2, h4); drawText('TO EVERYONE, MY', 20, 'purple', w2, h2); drawText('1000 F(OL)LOWERS!', 20, 'navy', w2, h - h4);//F(OL)LOWER - (OL) == FLOWER <3 } function addFlower(e, x, y) { if(flowers.length > 20) { return; } if(e) { e.preventDefault(); flowers.push(new Flower(e.pageX, e.pageY)); } else { flowers.push(new Flower(x, y)); } } function draw() { context.clearRect(0, 0, width, height); drawBackground(); for(var q = 0; q < flowers.length; q += 1) { if(flowers[q].d) { flowers[q].blow(); flowers.splice(q, 1); } if(flowers[q]) { flowers[q].grow(); flowers[q].draw(); } } for(var q = 0; q < fireworks.length; q += 1) { if(fireworks[q].d) { fireworks.splice(q, 1); } if(fireworks[q]) { fireworks[q].check(); fireworks[q].move(); fireworks[q].draw(); } } Q++; if(Q > 100) { Q = 0; addFlower(false, Math.floor(Math.random() * width), Math.floor(Math.random() * height)); } } function loop() { draw(); requestAnimationFrame(loop); } canvas.addEventListener('click', addFlower, false); loop(); //window.addEventListener('load', loop, false); }//window.onload end /**/

1000 f(ol)lowers