This repository has been archived by the owner on Feb 6, 2021. It is now read-only.
-
Notifications
You must be signed in to change notification settings - Fork 0
/
flappyball.html
120 lines (110 loc) · 3.6 KB
/
flappyball.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
<html>
<head>
<script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.5.11/p5.js"></script>
<script>
var rectangles = [];
var atTop = 0;
var Rectangle = function() {
this.h = (height/2 -(Math.random()*100)) || 5;
this.w = 30;
this.x = width;
if(!(atTop < 0.5)){
this.y = 0;
}
else {
this.y = height - this.h;
}
}
Rectangle.prototype.drawRectangle = function(){
fill(255, 150, 0);
rect(this.x, this.y, this.w, this.h);
}
Rectangle.prototype.move = function(){
var speed = 3;
this.x -= speed;
}
Rectangle.prototype.resetX = function(){
this.x = width;
}
var Player = function(){
this.x = 25;
this.y = height/2;
this.w = 30;
this.h = 30;
this.velocity = 0;
}
Player.prototype.pong = function(){
this.velocity -= 12;
}
Player.prototype.drawPlayer = function(){
fill(255, 0, 100);
ellipse(this.x, this.y, this.w, this.h);
}
Player.prototype.drop = function(){
var g = 0.5;
this.velocity += g;
this.y += this.velocity;
}
function setup(){
createCanvas(600, 400);
p1 = new Player();
}
function draw(){
background(100);
if(p1.y > height || p1.y < 0){
noLoop();
}
else {
if(playerTouchedRectangle()){
noLoop();
}
else {
p1.drop();
//p1.y = 20;
}
}
p1.drawPlayer();
updateRectangles();
}
function playerTouchedRectangle(){
for(var i =0; i < rectangles.length; i++){
var r = rectangles[i];
if(!r.y && p1.y <= r.h && p1.x >= r.x){
return true;
}
if(r.y && r.x <= p1.x && p1.y >= r.y){
return true;
}
}
return false;
}
function updateRectangles(){
if(rectangles[0]) {
//if(rectangles[rectangles.length -1].x < 0){
if(rectangles[0].x < -rectangles[0].w){
rectangles.splice(rectangles.lenght -1, 1);
}
if(rectangles[rectangles.length - 1].x < width - 100){
atTop = random();
rectangles.push(new Rectangle);
}
rectangles.forEach(function(r){
r.drawRectangle();
r.move();
});
}
else {
atTop = random();
rectangles.push(new Rectangle);
}
}
function keyTyped(){
if(key == " "){
p1.pong();
}
}
</script>
</head>
<body>
</body>
</html>