Skip to content

Commit be57c18

Browse files
author
johnnyliao
committed
first commit
1 parent 97124ca commit be57c18

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

89 files changed

+585
-0
lines changed

js/ane.js

Lines changed: 37 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,37 @@
1+
// ane 背景 海葵
2+
var margin = 16, //间距
3+
aneWidth = 20; //宽度
4+
5+
var aneObj = function(){
6+
this.x = [];
7+
this.len = [];
8+
this.num = 50 //数量
9+
}
10+
11+
aneObj.prototype.initAne = function(){
12+
for (let i = 0; i < this.num; i++) {
13+
this.x[i] = i * margin + Math.random() * 20;
14+
this.len[i] = 200 + Math.random() * 50;
15+
}
16+
17+
}
18+
19+
20+
// 绘制
21+
aneObj.prototype.drawAne = function(){
22+
ctx2.save();
23+
ctx2.globalAlpha = 0.6;
24+
ctx2.strokeStyle = '#3b154e';//
25+
ctx2.lineWidth = 20;
26+
ctx2.lineCap = 'round';
27+
28+
for (let i = 0; i < this.num; i++) {
29+
ctx2.beginPath();
30+
ctx2.moveTo(this.x[i], imgHeight);
31+
ctx2.lineTo(this.x[i], imgHeight - this.len[i]);
32+
ctx2.stroke();
33+
// console.log(this.x[i], imgHeight - this.len[i]);
34+
}
35+
36+
ctx2.restore();
37+
}

js/baby.js

Lines changed: 93 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,93 @@
1+
//小鱼
2+
var babyObj = function(){
3+
this.x ;
4+
this.y;
5+
this.angle;
6+
// this.babyEye = new Image()
7+
this.babyBody = new Image()
8+
// this.babyTail = new Image()
9+
this.bodyCount = 0;
10+
this.bodyTimer = 0;
11+
12+
this.tailTime = 0;
13+
this.tailCount = 0
14+
15+
this.babyEyeTime=0;
16+
this.babyInterval = 1000;
17+
this.babyEyeCount = 0;
18+
}
19+
20+
babyObj.prototype.init = function(){
21+
this.x = parseInt(imgWidth) * 0.5 - 50;
22+
this.y = parseInt(imgHeight) * 0.5 + 50;
23+
this.angle = 0;
24+
// this.babyEye.src = './src/babyEye0.png'
25+
// this.babyBody.src = './src/babyFade0.png'
26+
// this.babyTail.src = './src/babyTail0.png'
27+
28+
}
29+
30+
31+
babyObj.prototype.draw = function(){
32+
33+
this.x = lerpDistance(mom.x, this.x, 0.98)
34+
this.y = lerpDistance(mom.y, this.y, 0.9)
35+
36+
var delataY =mom.y - this.y,
37+
deltaX = mom.x - this.x;
38+
39+
40+
41+
42+
this.bodyTimer += deltaTime;
43+
44+
if (this.bodyTimer > 300) {
45+
this.bodyTimer %= 300
46+
this.bodyCount += 1
47+
if (this.bodyCount > 19) {
48+
//game over
49+
this.bodyCount = 19
50+
}else{
51+
this.bodyCount %= 19
52+
}
53+
}
54+
55+
56+
57+
this.tailTime += deltaTime
58+
59+
//尾巴
60+
if(this.tailTime > 50){
61+
this.tailTime %= 50
62+
63+
this.tailCount = (this.tailCount+1) % 8;
64+
65+
}
66+
67+
this.babyEyeTime += deltaTime;
68+
if (this.babyEyeTime > this.babyInterval) {
69+
this.babyEyeCount = (this.babyEyeCount + 1) % 2;
70+
this.babyEyeTime %= this.babyInterval
71+
72+
if (this.babyEyeCount == 0) {
73+
this.babyInterval = Math.random() * 1500 + 2000 // 眨眼之后
74+
}else{
75+
this.babyInterval = 200
76+
}
77+
}
78+
79+
//获得反正切 + 一个Pi的角度
80+
var beta = Math.atan2(delataY, deltaX) + Math.PI;
81+
82+
//把角度调整, 使鱼能跟随鼠标旋转
83+
this.angle = lerpAngle(beta, this.angle, 0.6)
84+
ctx1.save();
85+
var count = this.bodyCount;
86+
ctx1.translate(this.x, this.y)
87+
ctx1.rotate(this.angle)
88+
ctx1.drawImage(bigTail[this.tailCount], -bigTail[this.tailCount].width*0.5 + 23, -bigTail[this.tailCount].height*0.5)
89+
ctx1.drawImage(babyBody[count], -babyBody[count].width*0.5, -babyBody[count].height*0.5)
90+
ctx1.drawImage(babyEye[this.babyEyeCount], -babyEye[this.babyEyeCount].width*0.5, -babyEye[this.babyEyeCount].height*0.5)
91+
ctx1.restore()
92+
93+
}

js/background.js

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
//background
2+
function drawImage(){
3+
ctx2.drawImage(bgImg, 0, 0, imgWidth, imgHeight )
4+
}

js/collision.js

Lines changed: 19 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,19 @@
1+
//判断鱼鱼果实是否碰撞
2+
3+
function momFruitCol(){
4+
for (var i = 0; i < fruit.num; i++) {
5+
if (fruit.alive[i])
6+
if (calLength2(fruit.x[i], fruit.y[i], mom.x, mom.y) < 900){
7+
console.log('碰撞')
8+
//30 * 30 区域为可以碰撞区域
9+
fruit.alive[i] = false
10+
}
11+
}
12+
}
13+
14+
function calLenMomBaby(){
15+
var len = calLength2(mom.x, mom.y, baby.x, baby.y)
16+
if (len < 900) {
17+
baby.bodyCount = 0
18+
}
19+
}

js/commonFunctions.js

Lines changed: 114 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,114 @@
1+
window.requestAnimFrame = (function() {
2+
return window.requestAnimationFrame || window.webkitRequestAnimationFrame || window.mozRequestAnimationFrame || window.oRequestAnimationFrame || window.msRequestAnimationFrame ||
3+
function( /* function FrameRequestCallback */ callback, /* DOMElement Element */ element) {
4+
return window.setTimeout(callback, 1000 / 60);
5+
};
6+
})();
7+
8+
9+
function calLength2(x1, y1, x2, y2) {
10+
return Math.pow(x1 - x2, 2) + Math.pow(y1 - y2, 2);
11+
}
12+
13+
14+
function randomColor() {
15+
var col = [0, 1, 2];
16+
col[0] = Math.random() * 100 + 155;
17+
col[0] = col[0].toFixed();
18+
col[1] = Math.random() * 100 + 155;
19+
col[1] = col[1].toFixed();
20+
col[2] = Math.random() * 100 + 155;
21+
col[2] = col[2].toFixed();
22+
var num = Math.floor(Math.random() * 3);
23+
col[num] = 0;
24+
return "rgba(" + col[0] + "," + col[1] + "," + col[2] + ",";
25+
}
26+
27+
28+
function lerpAngle(a, b, t) {
29+
var d = b - a;
30+
if (d > Math.PI) d = d - 2 * Math.PI;
31+
if (d < -Math.PI) d = d + 2 * Math.PI;
32+
return a + d * t;
33+
}
34+
35+
function lerpDistance(aim, cur, ratio) {
36+
var delta = cur - aim;
37+
return aim + delta * ratio;
38+
}
39+
40+
function inOboundary(arrX, arrY, l, r, t, b) { //在l r t b范围内的检测
41+
return arrX > l && arrX < r && arrY > t && arrY < b;
42+
}
43+
44+
function rgbColor(r, g, b) {
45+
r = Math.round(r * 256);
46+
g = Math.round(g * 256);
47+
b = Math.round(b * 256);
48+
return "rgba(" + r + "," + g + "," + b + ",1)";
49+
}
50+
51+
function rgbNum(r, g, b) {
52+
r = Math.round(r * 256);
53+
g = Math.round(g * 256);
54+
b = Math.round(b * 256);
55+
return "rgba(" + r + "," + g + "," + b;
56+
}
57+
58+
function rnd(m) {
59+
var n = m || 1;
60+
return Math.random() * n;
61+
}
62+
63+
function rateRandom(m, n) {
64+
var sum = 0;
65+
for (var i = 1; i < (n - m); i++) {
66+
sum += i;
67+
68+
}
69+
70+
var ran = Math.random() * sum;
71+
72+
for (var i = 1; i < (n - m); i++) {
73+
ran -= i;
74+
if (ran < 0) {
75+
return i - 1 + m;
76+
}
77+
}
78+
}
79+
80+
function distance(x1, y1, x2, y2, l) {
81+
var x = Math.abs(x1 - x2);
82+
var y = Math.abs(y1 - y2);
83+
if (x < l && y < l) {
84+
return true;
85+
}
86+
return false;
87+
}
88+
89+
function AABBbox(object1, w1, h1, object2, w2, h2, overlap) {
90+
A1 = object1.x + overlap;
91+
B1 = object1.x + w1 - overlap;
92+
C1 = object1.y + overlap;
93+
D1 = object1.y + h1 - overlap;
94+
95+
A2 = object2.x + overlap;
96+
B2 = object2.x + w2 - overlap;
97+
C2 = object2.y + overlap;
98+
D2 = object2.y + h2 - overlap;
99+
100+
if (A1 > B2 || B1 < A2 || C1 > D2 || D1 < C2) return false;
101+
else return true;
102+
}
103+
104+
105+
function dis2(x, y, x0, y0) {
106+
var dx = x - x0;
107+
var dy = y - y0;
108+
return dx * dx + dy * dy;
109+
}
110+
111+
function rndi2(m, n) {
112+
var a = Math.random() * (n - m) + m;
113+
return Math.floor(a);
114+
}

js/fruit.js

Lines changed: 88 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,88 @@
1+
// var length = 20;
2+
3+
function fruitObj (){
4+
this.x = [];
5+
this.y = [];
6+
this.num = 20;
7+
this.alive = [];
8+
this.l = [];
9+
this.spd = [];
10+
this.fruitType =[]
11+
this.orange = new Image();
12+
this.blue = new Image()
13+
14+
}
15+
16+
fruitObj.prototype.init = function (){
17+
18+
for (var i = 0; i < this.num; i++) {
19+
this.x[i] = 0
20+
this.y[i] = ane.len[i]
21+
this.spd[i] = 0
22+
this.alive[i] = false
23+
this.born(i)
24+
}
25+
26+
this.orange.src = './src/fruit.png';
27+
this.blue.src = './src/blue.png';
28+
}
29+
30+
fruitObj.prototype.born = function(i){
31+
var aneID = Math.floor(Math.random() * ane.num)
32+
this.x[i] = ane.x[aneID];
33+
this.y[i] = imgHeight - ane.len[aneID]
34+
//生长速度
35+
this.l[i] = 0
36+
this.spd[i] = Math.random() * 0.017 + 0.003; //[0.003, 0.02]
37+
//blue || orange
38+
this.fruitType[i] = (Math.random() < 0.2 ? "blue": "orange")
39+
this.alive[i] = true
40+
}
41+
42+
fruitObj.prototype.draw = function(){
43+
for (var i = 0; i < this.num; i++) {
44+
var pic = this.fruitType[i] == "blue" ? this.blue : this.orange;
45+
46+
if (this.l[i] <= 10) {
47+
this.l[i] += this.spd[i] * deltaTime
48+
}else{
49+
this.y[i] -= this.spd[i] * 7 * deltaTime;
50+
}
51+
// console.log(this.l[i])
52+
//width height
53+
ctx2.drawImage(pic, this.x[i] - this.l[i] * 0.5, this.y[i] - this.l[i] * 0.5, this.l[i], this.l[i])
54+
// ctx2.drawImage(blue, this.x[i], this.y[i], 10,10 )
55+
56+
if(this.y[i] <= 10){
57+
this.alive[i] = false
58+
}
59+
}
60+
61+
62+
}
63+
64+
65+
// fruitAlive()
66+
function fruitAlive(){
67+
// console.log(fruit)
68+
var aliveNum = 0;
69+
for (let i = 0; i < fruit.num; i++) {
70+
if(fruit.alive[i]){
71+
aliveNum++;
72+
}
73+
}
74+
75+
if (aliveNum < 15 ) {
76+
sendFruit()
77+
return
78+
}
79+
}
80+
81+
function sendFruit(){
82+
for (let i = 0; i < fruit.num; i++) {
83+
if (!fruit.alive[i]){
84+
fruit.born(i)
85+
console.log(i)
86+
}
87+
}
88+
}

0 commit comments

Comments
 (0)