canvas多关卡轨道射击类小游戏代码
代码语言:html
所属分类:游戏
代码描述:canvas多关卡轨道射击类小游戏代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html>
<html lang="en" >
<head>
<meta charset="UTF-8">
<style>
* {
margin: 0;
box-sizing: border-box;
overflow: hidden;
}
body {
background: #3F2E88;
width: 100%;
height: 100vh;
display: flex;
justify-content: center;
align-items: center;
}
body canvas {
box-shadow: 0.2em 0.2em 2em #0008;
border: none;
outline: none;
}
</style>
</head>
<body >
<canvas id="canvas"></canvas>
<script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/processing.min.js"></script>
<script >
var sketchProc = function(processingInstance) {
with (processingInstance) {
size(600, 600);
frameRate(60);
smooth();
{
noStroke();
angleMode = "degrees";
//textFont(createFont("ink free", 0));
textFont(createFont("Verdana", 0));
var lag = false;
var game;
var cannon;
} //Defaults
{
//Key|Button stuff
var clicked = false;
var hover = false;
var keys = [];
keyPressed = function () {
keys[keyCode] = true;
};
keyReleased = function () {
keys[keyCode] = false;
};
mouseClicked = function () {
clicked = true;
};
} //Keys/Mouse
{
var Button = function(config) {
this.x = config.pos.x || 0;
this.y = config.pos.y || 0;
this.radius = config.radius || 80;
this.radiusBase = this.radius;
this.content = config.content || "Home";
this.page = config.page || "home";
this.level = config.level || 0;
this.amplitude = this.radius * 0.1;
this.colorLight = config.colorLight || color(255, 161, 25);
this.colorDark = config.colorDark || color(244, 106, 7);
this.colorLightAlpha = color(red(this.colorLight), green(this.colorLight), blue(this.colorLight), 100);
this.colorDarkAlpha = color(red(this.colorDark), green(this.colorDark), blue(this.colorDark), 100);
this.colorHover = color(red(this.colorLight), green(this.colorLight), blue(this.colorLight), 60);
this.colorHoverOuter = color(red(this.colorLight), green(this.colorLight), blue(this.colorLight), 40);
this.textColor = config.textColor || color(0, 0, 0, 200);
this.textSize = config.textSize || 20;
this.angleBase = floor(random(-30, 30));
this.angle = this.angleBase;
this.hover = false;
this.scale = 1;
};
Button.prototype.update = function() {
this.scale = abs(sin(radians(frameCount*1.1)) * 0.1) + 1;
};
Button.prototype.display = function () {
textSize(this.textSize);
strokeWeight(1);
noStroke();
//circles
if (dist(mouseX, mouseY, this.x, this.y) <= this.radius / 2) { //hover
this.hover = true;
if(clicked) {
game.page = this.page;
if(this.page === "level") {
game.page = "next";
game.level = this.level;
}
else {
game.reset();
}
}
this.drawPlanet();
}
else { //not hover
this.hover = false;
this.drawPlanet();
}
};
Button.prototype.drawPlanet = function() {
this.angle++;
if(this.hover === true) {
this.angle++;
pushMatrix();
translate(this.x, this.y);
scale(this.scale);
fill(this.colorHover);
ellipse(0, 0, this.radius*1.2, this.radius*1.2);
fill(this.colorHoverOuter);
ellipse(0, 0, this.radius*1.4, this.radius*1.4);
fill(this.colorLight);
rotate(radians(-frameCount*2));
ellipse(0, -this.radius*1.2/2, 5, 5);
ellipse(0, this.radius*1.2/2, 5, 5);
ellipse(-this.radius*1.2/2, 0, 5, 5);
ellipse(this.radius*1.2/2, 0, 5, 5);
rotate(radians(frameCount*4));
fill(this.colorDark);
ellipse(0, -this.radius*1.4/2, 5, 5);
ellipse(0, this.radius*1.4/2, 5, 5);
ellipse(-this.radius*1.4/2, 0, 5, 5);
ellipse(this.radius*1.4/2, 0, 5, 5);
popMatrix();
}
noStroke();
fill(this.color);
pushMatrix();
translate(this.x, this.y);
scale(this.scale);
rotate(radians(this.angle));
//right
fill(this.colorLight);
arc(0, 0, this.radius, this.radius, radians(90), radians(270));
fill(this.colorDark);
arc(0, 0, this.radius, this.radius, radians(-89), radians(90));
noFill();
strokeWeight(8 * (this.radius/this.radiusBase));
strokeCap(ROUND);
stroke(this.colorDarkAlpha);
line(-this.radius*0.05, -this.radius*0.4, this.radius*0.2, -this.radius*0.4);
line(-this.radius*0.3, -this.radius*0.2, this.radius*0.2, -this.radius*0.2);
line(-this.radius*0.1, 0, this.radius*0.2, 0);
line(-this.radius*0.2, this.radius*0.2, this.radius*0.2, this.radius*0.2);
line(-this.radius*0.1, this.radius*0.4, this.radius*0.2, this.radius*0.4);
stroke(this.colorLightAlpha);
line(-this.radius*0.05, -this.radius*0.3, this.radius*0.1, -this.radius*0.3);
line(-this.radius*0.3, -this.radius*0.1, this.radius*0.2, -this.radius*0.1);
line(-this.radius*0.1, this.radius*0.1, this.radius*0.3, this.radius*0.1);
line(-this.radius*0.3, this.radius*0.3, this.radius*0.2, this.radius*0.3);
stroke(this.colorLight);
strokeWeight(4 * (this.radius/this.radiusBase));
ellipse(0, 0, this.radius*0.95, this.radius*0.95);
popMatrix();
textAlign(CENTER, CENTER);
fill(this.textColor);
text(this.content, this.x, this.y);
};
Button.prototype.run = function() {
this.update();
this.display();
};
} //Buttons
{
var colors = [
color(255, 255, 255),
color(104, 200, 38),
color(1, 168, 210),
color(244, 105, 4),
color(117, 39, 149)
];
} //Colors
{
var Star = function(config) {
this.pos = config.pos || new PVector(random(0, width), random(0, height));
this.size = config.size || 10;
this.velocity = config.velocity || new PVector(0, 0);
this.color = colors[floor(random(0, colors.length))];
this.r = red(this.color);
this.b = blue(this.color);
this.g = green(this.color);
this.backColor = color(this.r, this.g, this.b, random(50, 100));
};
Star.prototype.update = function() {
this.pos.add(this.velocity);
};
Star.prototype.display = function() {
noFill();
stroke(this.backColor);
strokeWeight(this.size*0.5);
strokeCap(ROUND);
pushMatrix();
translate(this.pos.x, this.pos.y);
line(0, -this.size/2, 0, this.size/2);
line(-this.size/2, 0, this.size/2, 0);
popMatrix();
};
Star.prototype.run = function() {
this.update();
this.display();
};
} //Star
{
var Barrier = function(config) {
this.pos = config.pos || new PVector(0, 0);
this.w = config.w || 100;
this.h = config.h || 20;
this.color = config.color || color(255, 0, 0);
this.color2 = config.color2 || color(255, 255, 0);
this.theta = config.theta || random(0.7, 1.2);
this.amplitude = config.amplitude || random(0.3, 0.5);
};
Barrier.prototype.update = function() {
this.pos.y += sin(radians(frameCount * this.theta)) * this.amplitude;
};
Barrier.prototype.display = function() {
noStroke();
fill(red(this.color), green(this.color), blue(this.color), 200);
rect(this.pos.x, this.pos.y, this.w, this.h, 5);
fill(0, 0, 0, 40);
rect(this.pos.x, this.pos.y + this.h/2, this.w, this.h/2, 5);
};
Barrier.prototype.run = function() {
this.update();
this.display();
};
Barrier.prototype.collision = function (missile) {
if (missile.pos.x + missile.size / 2 > this.pos.x &&
missile.pos.y + missile.size / 2 > this.pos.y &&
missile.pos.x - missile.size / 2 < this.pos.x + this.w &&
missile.pos.y - missile.size / 2 < this.pos.y + this.h) {
game.addExplosion({
pos: new PVector(missile.pos.x, missile.pos.y),
backColor: this.color,
w: 40,
h: 40
});
return true;
}
return false;
};
} //Barrier
{
var Oscillator = function(config) {
this.origin = config.origin || new PVector(width/2, height/2);
this.angle = config.angle || new PVector(0, 0);
this.velocity = config.velocity || new PVector(random(-2, 2), random(-2, 2));
this.amplitude = config.amplitude || new PVector(random(this.origin.x*0.3, this.origin.x*0.5), random(this.origin.y*0.3, this.origin.y*0.5));
this.radius = this.amplitude.mag()*0.25;
this.color = config.color || colors[floor(random(1, colors.length))];
this.r = red(this.color);
this.g = green(this.color);
this.b = blue(this.color);
this.pos = config.pos || new PVector(0, 0);
this.w = config.w || this.radius;
this.h = config.h || this.radius;
this.thetaX = 0.0;
this.thetaY = 0.0;
this.amplitude2 = config.amplitude2 || 5.0;
this.dx = 0.0;
this.dy = 0.0;
this.thetaChangeX = random(3, 12);
this.thetaChangeY = random(3, 12);
};
Oscillator.prototype.oscillate = function() {
this.thetaX += this.thetaChangeX;
this.thetaY += this.thetaChangeY;
this.dx = sin(radians(this.thetaX)) * this.amplitude2;
this.dy = sin(radians(this.thetaY)) * this.amplitude2;
this.w = this.dx + this.radius;
this.h = this.dy + this.radius;
this.amplitude.mult(1.001);
this.amplitude.limit(300);
this.angle.add(this.velocity);
};
Oscillator.prototype.display = function() {
this.pos.x = sin(radians(this.angle.x)) * this.amplitude.x;
this.pos.y = sin(radians(this.angle.y)) * this.amplitude.y;
var v = new PVector(this.pos.x, this.pos.y);
var opacity = map(v.mag(), 0, this.origin.x, 70, 255);
this.pos.add(this.origin);
pushMatrix();
stroke(200, 200, 200, 30);
strokeWeight(1);
line(this.origin.x, this.origin.y, this.pos.x, this.pos.y);
noStroke();
fill(this.r, this.g, this.b, opacity);
ellipse(this.pos.x, this.pos.y, this.w, this.h);
fill(0, 0, 0, 20);
arc(this.pos.x, this.pos.y, this.w, this.h, 0, radians(180));
popMatrix();
};
Oscillator.prototype.run = function() {
this.oscillate();
this.display();
};
Oscillator.prototype.collision = function(obj) {
var dx = this.pos.x - obj.pos.x;
var dy = this.pos.y - obj.pos.y;
var distance = Math.sqrt(dx * dx + dy * dy);
if (distance < this.radius/2 + obj.size/2) {
game.addExplosion({
pos: this.pos,
backColor: this.color,
w: 40,
h: 40
});
return true;
}
return false;
};
var OscillatorSystem = function(config) {
this.oscillators = [];
this.num = config.num || 1;
for(var i = 0; i < this.num; i++) {
this.oscillators.push(new Oscillator({}));
}
};
OscillatorSystem.prototype.run = function() {
for(var i = 0; i < this.oscillators.length; i++) {
this.oscillators[i].run();
}
};
OscillatorSystem.prototype.add = function(n) {
for(var i = 0; i < n; i++) {
this.oscillators.push(new Oscillator({}));
}
};
} //Oscillator
{
var Wave = function(config) {
this.xSpacing = config.xSpacing || 16;
this.theta = config.theta || 0.0;
this.amplitude = config.amplitude || 25.0;
this.baseHeight = config.baseHeight || height * 0.8;
this.radius = config.radius || 25;
this.points = config.points || new Array(width + this.xSpacing);
this.colors = [
color(104, 200, 38, 150),
color(1, 168, 210, 150),
color(244, 105, 4, 150),
color(117, 39, 149, 150)
];
};
Wave.prototype.init = function() {
this.points = new Array(width + this.xSpacing);
var x = this.theta;
var c;
for (var i = 0; i < this.points.length; i++) {
c = this.colors[floor(random(0, this.colors.length))];
this.points[i] = {
y: sin(radians(x)) * this.amplitude,
color: c,
shade: color(red(c), green(c), blue(c), 50)
};
x += 1;
}
};
Wave.prototype.update = function() {
this.theta += 2;
var x = this.theta;
for (var i = 0; i < this.points.length; i++) {
this.points[i].y = sin(radians(x)) * this.amplitude;
x += 1;
}
};
Wave.prototype.display = function() {
noStroke();
for(var x = 0; x < this.points.length; x+= this.xSpacing * 2) {
fill(this.points[x].shade);
rect(x - this.radius/4, this.baseHeight + this.points[x].y + this.radius/2, this.radius/2, height);
fill(this.points[x].color);
ellipse(x, this.baseHeight + this.points[x].y, this.radius, this.radius);
fill(0, 0, 0, 40);
arc(x, this.baseHeight + this.points[x].y, this.radius, this.radius, 0, radians(180));
}
};
Wave.prototype.run = function() {
this.update();
this.display();
};
} //Wave
{
var Spiral = function(config) {
this.pos = config.pos || new PVector(width/2, height/2);
this.basePos = new PVector(this.pos.x, this.pos.y);
this.speed = config.speed || random(3, 6);
this.radius = config.radius || random(20, 40);
this.xAmp = 0;
this.yAmp = 0;
this.xAmpSpeed = random(0.0007, 0.001);
this.yAmpSpeed = random(0.0007, 0.001);
this.dir = config.dir || random() < 0.5 ? 1 : -1;
this.index = 0;
this.colors = [
color(104, 200, 38),
color(1, 168, 210),
color(244, 105, 4),
color(117, 39, 149)
];
this.color = config.color || this.colors[floor(random(this.colors.length))];
this.r = red(this.color);
this.g = green(this.color);
this.b = blue(this.color);
};
Spiral.prototype.update = function() {
this.index+= this.speed;
this.pos = new PVector(sin(radians(this.index*this.dir)) * width * this.xAmp + this.basePos.x, -cos(radians(this.index*this.dir)) * height * this.yAmp + this.basePos.y);
this.xAmp+= this.xAmpSpeed;
this.yAmp+= this.yAmpSpeed;
};
Spiral.prototype.display = function() {
noStroke();
fill(this.r, this.g, this.b, 200);
ellipse(this.pos.x, this.pos.y, this.radius, this.radius);
fill(0, 0, 0, 20);
arc(this.pos.x, this.pos.y, this.radius, this.radius, 0, radians(180));
};
Spiral.prototype.collision = function(obj) {
var dx = this.pos.x - obj.pos.x;
var dy = this.pos.y - obj.pos.y;
var distance = Math.sqrt(dx * dx + dy * dy);
if (distance < this.radius/2 + obj.size/2) {
game.addExplosion({
pos: this.pos,
backColor: this.color,
w: 40,
h: 40
});
return true;
}
return false;
};
Spiral.prototype.run = function() {
this.update();
this.display();
};
var SpiralSystem = function(config) {
this.spirals = [];
this.trails = [];
};
SpiralSystem.prototype.update = function() {
for(var i = this.trails.length-1; i >= 0; i--) {
if(this.trails[i].timeToLive-- <= 0) {
this.trails.splice(i, 1);
}
}
};
SpiralSystem.prototype.display = function() {
noStroke();
for(var i = this.trails.length-1; i >= 0; i--) {
var trail = this.trails[i];
fill(trail.r, trail.g, trail.b, trail.timeToLive);
ellipse(trail.pos.x, trail.pos.y, trail.radius, trail.radius);
}
};
SpiralSystem.prototype.add = function(n) {
for(var i = 0; i < n; i++) {
this.spirals.push(new Spiral({
pos: new PVector(random(width*0.3, width*0.7), random(height*0.3, height*0.5))
}));
}
};
SpiralSystem.prototype.run = function() {
var n = 0;
for(var i = this.spirals.length-1; i >= 0; i--) {
var spiral = this.spirals[i];
if(spiral.pos.x + spiral.radius * 5 < 0 || spiral.pos.x - spiral.radius * 5 > width || spiral.pos.y - spiral.radius * 5 > height || spiral.pos.y + spiral.radius * 5 < 0) {
this.spirals.splice(i, 1);
n++;
}
else {
this.trails.push(
{
timeToLive: floor(random(50, 70)),
radius: random(spiral.radius*0.2, spiral.radius*0.4),
pos: new PVector(spiral.pos.x, spiral.pos.y),
r: spiral.r,
g: spiral.g,
b: spiral.b
});
spiral.run();
}
}
this.add(n);
this.update();
this.display();
};
} //Spiral
{
var Enemy = function(config) {
this.pos = config.pos || new PVector(width/2, height/2);
this.radius = config.radius || 30;
this.dir = config.dir || new PVector(0, 0);
this.acceleration = config.acceleration || new PVector(0, 0);
this.angle = config.angle || 0;
this.rotate = config.rotate || 5;
this.color = config.color || color(253, 163, 25, 200);
this.color2 = config.color2 || color(246, 104, 4, 200);
};
Enemy.prototype.update = function() {
this.angle+=this.rotate;
this.pos.add(this.acceleration);
};
Enemy.prototype.display = function() {
noFill();
strokeWeight(this.radius*0.2);
strokeCap(ROUND);
pushMatrix();
translate(this.pos.x, this.pos.y);
rotate(radians(this.angle));
stroke(this.color);
line(0, -this.radius/3, 0, this.radius/3);
stroke(this.color2);
line(-this.radius/3, 0, this.radius/3, 0);
popMatrix();
};
Enemy.prototype.run = function() {
this.update();
this.display();
};
Enemy.prototype.collision = function(missile) {
if (missile.pos.x + missile.size / 2 > this.pos.x &&
missile.pos.y + missile.size / 2 > this.pos.y &&
missile.pos.x - missile.size / 2 < this.pos.x + this.radius/2 &&
missile.pos.y - missile.size / 2 < this.pos.y + this.radius/2) {
game.addExplosion({
pos: new PVector(this.pos.x + this.radius / 2, this.pos.y + this.radius / 2),
w: 40,
h: 40,
backColor: this.color
});
return true;
}
return false;
};
} //Enemy
{
var Boss = function(config) {
this.pos = config.pos || new PVector(width/2, height/2);
this.basePos = new PVector(this.pos.x, this.pos.y);
this.radius = config.radius || 80;
this.baseRadius = this.radius;
this.color = config.color || color(253, 163, 25, 200);
this.colorInner = config.colorInner || color(246, 104, 4);
this.colorHover = color(red(this.color), green(this.color), blue(this.color), 60);
this.colorHoverOuter = color(red(this.color), green(this.color), blue(this.color), 40);
this.enemies = [];
this.angle = 0;
this.amplitude = 10;
this.rotate = config.rotate || 5;
this.lives = config.lives || 10;
this.forceField = config.forceField || 10;
this.oscillators = config.oscillators || 0;
this.enemyFrequency = config.enemyFrequency || 0.04;
};
Boss.prototype.update = function() {
this.pos.y = this.basePos.y + (sin(radians(frameCount*1.5)) * this.amplitude);
this.angle+=this.rotate;
//add new enemy
if(this.forceField <= 0) {
this.enemyFrequency = 0.05;
}
if(random() < this.enemyFrequency) {
var xDir = random() < 0.5 ? 1 : -1;
var yDir = random() < 0.5 ? 1 : -1;
this.enemies.push(
new Enemy({
pos: new PVector(this.pos.x, this.pos.y),
acceleration: new PVector(random(1, 3) * xDir, random(1, 3) * yDir)
})
);
}
for(var i = 0; i < this.enemies.length; i++) {
this.enemies[i].run();
}
};
Boss.prototype.display = function() {
if(this.lives > 0) {
//Force Field
if(this.forceField > 0) {
pushMatrix();
translate(this.pos.x, this.pos.y);
noFill();
stroke(this.colorHover);
ellipse(0, 0, this.radius*1.2, this.radius*1.2);
stroke(this.colorHoverOuter);
ellipse(0, 0, this.radius*1.4, this.radius*1.4);
noStroke();
fill(this.colorInner);
rotate(radians(-frameCount*2));
ellipse(0, -this.radius*1.2/2, 5, 5);
ellipse(0, this.radius*1.2/2, 5, 5);
ellipse(-this.radius*1.2/2, 0, 5, 5);
ellipse(this.radius*1.2/2, 0, 5, 5);
rotate(radians(frameCount*4));
fill(this.color);
ellipse(0, -this.radius*1.4/2, 5, 5);
ellipse(0, this.radius*1.4/2, 5, 5);
ellipse(-this.radius*1.4/2, 0, 5, 5);
ellipse(this.radius*1.4/2, 0, 5, 5);
popMatrix();
}
pushMatrix();
translate(this.pos.x, this.pos.y);
noStroke();
fill(this.color);
//right
fill(255, 161, 25);
arc(0, 0, this.radius, this.radius, radians(90), radians(270));
fill(244, 106, 7);
arc(0, 0, this.radius, this.radius, radians(-89), radians(90));
noFill();
strokeWeight(8);
strokeCap(ROUND);
stroke(244, 106, 7, 100);
line(-this.radius*0.05, -this.radius*0.4, this.radius*0.2, -this.radius*0.4);
line(-this.radius*0.3, -this.radius*0.2, this.radius*0.2, -this.radius*0.2);
line(-this.radius*0.1, 0, this.radius*0.2, 0);
line(-this.radius*0.2, this.radius*0.2, this.radius*0.2, this.radius*0.2);
line(-this.radius*0.1, this.radius*0.4, this.radius*0.2, this.radius*0.4);
stroke(255, 161, 25, 100);
line(-this.radius*0.05, -this.radius*0.3, this.radius*0.1, -this.radius*0.3);
line(-this.radius*0.3, -this.radius*0.1, this.radius*0.2, -this.radius*0.1);
line(-this.radius*0.1, this.radius*0.1, this.radius*0.3, this.radius*0.1);
line(-this.radius*0.3, this.radius*0.3, this.radius*0.2, this.radius*0.3);
stroke(255, 161, 25);
strokeWeight(4);
ellipse(0, 0, this.radius*0.95, this.radius*0.95);
popMatrix();
pushMatrix();
translate(this.pos.x, this.pos.y);
fill(0, 0, 0, 100);
textSize(20);
textAlign(CENTER, CENTER);
text(this.lives, 0, 0);
popMatrix();
}
};
Boss.prototype.run = function() {
this.update();
this.display();
};
Boss.prototype.collision = function (missile) {
var dx = this.pos.x - missile.pos.x;
var dy = this.pos.y - missile.pos.y;
var distance = Math.sqrt(dx * dx + dy * dy);
if (distance < this.radius/2 + missile.size) {
if(this.forceField <= 0) {
this.lives--;
}
return true;
}
return false;
};
} //Boss
{
var Alien = function(config) {
this.index = config.index || 0;
this.pos = new PVector(sin(radians(this.index)) * width * 0.46 + width/2, -cos(radians(this.index)) * height * 0.46 + height/2);
this.w = config.w || random(20, 50);
this.h = config.h || random(20, 50);
this.thetaX = 0.0;
this.thetaY = 0.0;
this.amplitude = config.amplitude || 5.0;
this.dx = 0.0;
this.dy = 0.0;
this.base = random(30, 50);
this.thetaChangeX = random(3, 12);
this.thetaChangeY = random(3, 12);
this.color = config.color || colors[floor(random(1, colors.length))];
this.color = color(red(this.color), green(this.color), blue(this.color), random(100, 200));
this.attack = false;
this.timeToAttack = config.timeToAttack || floor(random(100, 1000));
this.dead = false;
this.attackPos = new PVector(0, 0);
this.velocity = config.velocity || new PVector(0, 0);
this.target = config.direction || new PVector(width/2, height/2);
this.topspeed = 2;
};
Alien.prototype.setDirection = function() {
this.acceleration = PVector.sub(this.attackPos, this.target);
this.acceleration.normalize();
this.acceleration.mult(2);
};
Alien.prototype.update = function() {
this.thetaX += this.thetaChangeX;
this.thetaY += this.thetaChangeY;
this.dx = sin(radians(this.thetaX)) * this.amplitude;
this.dy = sin(radians(this.thetaY)) * this.amplitude;
this.w = this.dx + this.base;
this.h = this.dy + this.base;
if(this.attack === true && this.dead === false) {
this.velocity.add(this.acceleration);
this.velocity.limit(this.topspeed);
this.attackPos.sub(this.velocity);
}
};
Alien.prototype.display = function() {
noStroke();
if(this.attack === false) {
fill(this.color);
}
else {
fill(41, 40, 41);
}
ellipse(this.pos.x, this.pos.y, this.w, this.h);
fill(0, 0, 0, 20);
arc(this.pos.x, this.pos.y, this.w, this.h, 0, radians(180));
if(this.attack === true && this.dead === false) {
fill(this.color);
ellipse(this.attackPos.x, this.attackPos.y, this.w, this.h);
fill(0, 0, 0, 20);
arc(this.attackPos.x, this.attackPos.y, this.w, this.h, 0, radians(180));
}
};
Alien.prototype.run = function() {
this.update();
this.display();
};
Alien.prototype.collision = function (missile) {
if (missile.pos.x + missile.size / 2 > this.attackPos.x &&
missile.pos.y + missile.size / 2 > this.attackPos.y &&
missile.pos.x - missile.size / 2 < this.attackPos.x + this.w &&
missile.pos.y - missile.size / 2 < this.attackPos.y + this.h) {
game.addExplosion({
pos: this.attackPos,
backColor: this.color,
w: 40,
h:40
});
return true;
}
return false;
};
var AlienArmy = function(config) {
this.killed = 0;
this.diameter = config.diameter || width * 0.95;
this.color = config.color || color(random(100, 160), random(100, 160), random(100, 160), random(100, 150));
this.aliens = [];
for(var i = 0; i < 360; i+= 10) {
this.aliens.push(
new Alien({
index: i
}));
}
this.angle = config.angle || 0;
this.speed = config.speed || 0.5;
};
AlienArmy.prototype.update = function() {
for(var i = 0; i < this.aliens.length; i++) {
var alien = this.aliens[i];
alien.index+= 0.2;
alien.pos = new PVector(sin(radians(alien.index)) * width * 0.46 + width/2, -cos(radians(alien.index)) * height * 0.46 + height/2);
if(alien.attack === false && alien.timeToAttack <= 0) {
alien.attack = true;
alien.attackPos = new PVector(alien.pos.x, alien.pos.y);
alien.setDirection();
}
else {
alien.timeToAttack-= this.speed;
}
}
};
AlienArmy.prototype.display = function() {
for(var i = 0; i < this.aliens.length; i++) {
this.aliens[i].run();
}
};
AlienArmy.prototype.run = function() {
this.update();
this.display();
};
} //Alien
{
var Blob = function(config) {
this.pos = config.pos || new PVector(random(width*0.1, width*0.9), -height*0.25);
this.radius = config.radius || random(15, 30);
this.amplitude = config.amplitude || 0.2;
this.color = config.color || colors[floor(random(1, colors.length - 1))];
this.color = color(red(this.color), green(this.color), blue(this.color), random(100, 200));
this.velocity = config.velocity || new PVector(0, 0);
this.target = config.target || new PVector(width/2, height/2);
this.topspeed = config.topspeed || 3;
this.t = PVector.sub(this.target, this.pos);
this.acceleration = new PVector(this.t.x, this.t.y);
this.acceleration.normalize();
this.acceleration.mult(this.topspeed);
};
Blob.prototype.applyForce = function (force) {
this.acceleration.add(force);
};
Blob.prototype.update = function() {
this.pos.add(this.acceleration);
};
Blob.prototype.display = function() {
noStroke();
fill(this.color);
ellipse(this.pos.x, this.pos.y, this.radius, this.radius);
fill(0, 0, 0, 20);
arc(this.pos.x, this.pos.y, this.radius, this.radius, 0, radians(180));
};
Blob.prototype.run = function() {
this.update();
this.display();
};
Blob.prototype.collision = function (obj) {
var dx = this.pos.x - obj.pos.x;
var dy = this.pos.y - obj.pos.y;
var distance = Math.sqrt(dx * dx + dy * dy);
if (distance < this.radius/2 + obj.size/2) {
game.addExplosion({
pos: this.pos,
backColor: this.color,
w: 40,
h: 40
});
return true;
}
return false;
};
var Blobs = function(config) {
this.topspeed = config.topspeed || 3;
this.blobsArray = [];
this.trails = [];
this.pos = config.pos || new PVector(width/2, height/2);
this.radius = config.radius || 40;
this.frequency = lag === true ? 3 : 2;
};
Blobs.prototype.addBlob = function(cannon) {
this.blobsArray.push(
new Blob({
target: new PVector(cannon.pos.x, cannon.pos.y),
topspeed: this.topspeed,
})
);
};
Blobs.prototype.update = function() {
for(var i = this.blobsArray.length - 1; i >= 0; i--) {
var blob = this.blobsArray[i];
//if(blob.pos.y >= blob.target.y) {
if(blob.pos.y >= height * 1.1) {
this.blobsArray.sp.........完整代码请登录后点击上方下载按钮下载查看
网友评论0