-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
101 lines (82 loc) · 3.17 KB
/
index.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
<html>
<head></head>
<body>
<h1>BLIP</h1>
<div id="game"></div>
<div id="highscore">Highscore : 0</div>
<script type="text/javascript" src="https://rawgithub.com/craftyjs/Crafty/release/dist/crafty-min.js"></script>
<script>
Crafty.init(500,600, document.getElementById('game'))
Crafty.viewport.bounds = {min:{x:0, y:0}, max:{x:500, y:500}};;
Crafty.background('#CF6766');
var endTime;
var highscore = 0;
Crafty.defineScene("end", function() {
if (endTime > highscore){
highscore = endTime;
document.getElementById('highscore').innerHTML = "ighscore : " + highscore;
}
Crafty.e("2D, Canvas, Text").attr({ x: 220, y: 275 , z: 2, w: 50, h:50})
.text(" " + endTime + " ")
.textFont({ size: '40px', weight: 'bold' })
.textColor('white');
Crafty.e("2D, Canvas, Text, Mouse").attr({ x: 190, y: 330 , z: 2, w: 50, h:50})
.text("Again?")
.textFont({ size: '40px', weight: 'bold' })
.textColor('white')
.bind('Click', function(MouseEvent){
Crafty.enterScene("main");
});
Crafty.e("2D, Canvas, Color").attr({ x: 100, y: 200 , z:1, w: 300, h:200})
.color('#30415D');
});
Crafty.defineScene("main", function() {
var startTime = Math.floor(Crafty.frame()/35);
Crafty.e("2D, Canvas, Color").attr({ x: 0, y: 0 , z:1, w: 500, h:50})
.color('#30415D');
// Banner Text
Crafty.e("2D, Canvas, Text").attr({ x: 50, y: 0 , z: 2, w: 500, h:50})
.text(function(){return Math.floor(Crafty.frame()/35) - startTime})
.dynamicTextGeneration(true)
.textFont({ size: '40px', weight: 'bold' })
.textColor('white');
Crafty.e('LeftWall, 2D, Canvas, Color')
.attr({x: -100, y: 500, w: 100, h: 100});
Crafty.e('RightWall, 2D, Canvas, Color')
.attr({x: 500, y: 500, w: 100, h: 100});
Crafty.e('BottomWall, 2D, Canvas, Color')
.attr({x: 0, y: 630, w: 500, h: 10})
var speed = 1;
for(var i=0; i<10; i++){
var faller = Crafty.e("Faller, 2D, Canvas, Color, Collision, Motion")
.attr({x: (Math.floor(Math.random() * 470)), y: (i * -150), z:0, w: 30, h: 30})
.color('#8EAEBD')
.onHit('BottomWall', function(){
this.attr({x: (Math.floor(Math.random() * 470)), y:0});
this.dy += .05;
});
faller.ay = 15;
}
// to stop at some point
// clearInterval(spawner);
var mover = Crafty.e('2D, Canvas, Collision, Color, Twoway,')
.attr({x: 200, y: 525, w: 30, h: 30})
.color('#031424')
.twoway(500)
.onHit('LeftWall', function(){
this.attr({x: 0});
})
.onHit('RightWall', function(){
this.attr({x: 470});
})
.onHit('Faller', function(){
endTime = Math.floor(Crafty.frame()/35) - startTime;
Crafty.enterScene("end");
})
mover.bind();
})
// Banner
Crafty.enterScene("main");
</script>
</body>
</html>