-
Notifications
You must be signed in to change notification settings - Fork 1
/
Copy pathindex.html
142 lines (114 loc) · 3.75 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
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
<!DOCTYPE html>
<!--[if lt IE 7]> <html lang="en" class="no-js ie6 no-mq"> <![endif]-->
<!--[if IE 7 ]> <html lang="en" class="no-js ie7 no-mq"> <![endif]-->
<!--[if IE 8 ]> <html lang="en" class="no-js ie8 no-mq"> <![endif]-->
<!--[if IE 9 ]> <html lang="en" class="no-js ie9"> <![endif]-->
<!--[if (gt IE 9)|!(IE)]><!--> <html lang="en" class="no-js"> <!--<![endif]-->
<head>
<meta charset='utf-8'>
<meta content='IE=edge,chrome=1' http-equiv='X-UA-Compatible'>
<meta content='width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no' name='viewport'>
<title>Friendly Birds</title>
<script src="js/vendor/modernizr-latest.js" type="text/javascript"></script>
<style type="text/css">
body,html {
margin: 0;
padding: 0;
}
</style>
<style>
@import url(http://fonts.googleapis.com/css?family=Ubuntu+Mono);
body, html{
height: 100%;
font-size: 100%;
font-family:'Ubuntu Mono', monospace;
padding: 0;
margin: 0;
}
body{
padding: 15px;
}
h1,h2,h3{
color:#F22987;
margin: 0;
padding: 0;
font-size: 1.25rem;
margin-bottom: 10px;
}
a{
color:#F22987
}
a:hover{color:#9271D9}
body {
margin: 0;
background: #fff;
color: 262621;
}
dd{
margin: 0;
padding: 0;
color: #786E69;
max-width: 50em;
}
dd:not(:last-child){
margin-bottom: 1em
}
dd > a{
color: inherit;
}
.lab-content{
max-width: 400px;
}
@media (max-width:640px){
#stage{
margin: 0 -15px;
}
}
</style>
</head>
<body>
<script src="js/vendor/require.js" data-main="js/bootstrap"></script>
<div class='lab-content'>
<h1> Friendly Birds - a not so Angry birds clone </h1>
<p>
This was my journey into Angry Birds. I focused on the following components:
<ul>
<li>Camera System for PIXI</li>
<li>Minimap View on the scene</li>
<li>Box2D Integration in PIXI (there is some code from Phaser's Box2D)</li>
<li>Fluid Integration (Liquid Fun), the build of box2d already contains liquid fun (see <a href='https://github.com/google/liquidfun/releases'>here</a> </li>
<li>Polygon Rendering in PIXI (this wasn't possible then)</li>
<li>Custom Water Shader for the particles</li>
<li>Raycasting in Box2D</li>
<li>Building a Slingshot with Trajectory projection</li>
</ul>
<strong>👻Attention. This is old code. Very manual. Require JS, no npm versioning. 👻</strong>
<br>
<a href='https://github.com/georgiee/lab-friendly-birds' target='_blank'>Source on github</a>
</p>
<br>
</div>
<a href='http://www.kaleadis.de/lab/'>back to lab</a>
<br><br>
<div id='stage'>
</div>
Assets by <a href='http://kenney.nl/'>Kenny</a>
<br>
Some code snippets taken from <a href='https://github.com/photonstorm/phaser'>Phaser</a>
<br>
Based on <a href='https://github.com/GoodBoyDigital/pixi.js'>PIXI</a><br>
<br>
<br>
<script src="js/vendor/require.js" data-main="js/bootstrap"></script>
<a href='http://www.kaleadis.de'>Home</a>
<script type="text/javascript">
var _gaq = _gaq || [];
_gaq.push(['_setAccount', 'UA-5010378-5']);
_gaq.push(['_trackPageview']);
(function() {
var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
})();
</script>
</body>