-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
103 lines (94 loc) · 3.72 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
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<title>TangleJS: A Tiny Game Library</title>
<link rel="stylesheet" href="/fonts/kaushan/stylesheet.css" />
<link rel="stylesheet" href="res/home.css" />
</head>
<body>
<header>
<h1>TangleJS</h1>
<h2>A Tiny Game Library</h2>
</header>
<section id="main">
<p>
Tangle is my contribution to the growing pile of small, lightweight
HTML5 game libraries. It's mostly shared here as an educational effort,
in conjunction with the
<a href="http://www.facerix.com/code/search.php?tag=lmacl"
>Let's Make a Canvas Library</a
>
series on my blog, and in accordance with the principles outlined in
<a href="http://www.facerix.com/talks/utahjs">this presentation</a> I
gave at UtahJS in June 2012.
</p>
<h3>Introduction</h3>
<p>
Tangle is built upon the
<a href="https://github.com/amdjs/amdjs-api/wiki/AMD"
>Asynchronous Module Definition API</a
>, commonly referred to as AMD. This means that script dependencies are
taken care of more or less for free, and we don't need a separate
preloading step to bootstrap our JavaScript code for us (other than an
<a href="http://requirejs.org">AMD-compatible</a>
<a href="https://github.com/cujojs/curl">loader</a>, of course).
</p>
<p>
Tangle leverages some basic cross-browser functionality provided by
<a href="https://github.com/facerix/atto">Atto</a>, my minimal
JavaScript library. As some point I may copy those dependent portions of
Atto in here to make this library self-contained, but that isn't a
priority at this time (remember, this library is educational in nature,
not production-ready).
</p>
<p>
Beyond script module loading, this project aims to provide many of the
basic building blocks for making a game (or other interactive
experience) in HTML5: sprite sheets and animations, stage backgrounds
and viewports, music and sounds, state management, and so on. However,
unlike game frameworks such as
<a href="http://impactjs.com/">Impact.js</a> and
<a href="http://limejs.com">LimeJS</a>, there's no "one right way" to
use Tangle. As such, it's not as easy to get started as with those guys,
but instead you get a handful of discrete functional modules to make
your coding life easier, and the flexibility to use them however you
want.
</p>
<h3>Available Modules</h3>
<p>
Currently, the following modules are available and ready for use
(examples are hyperlinked where available):
</p>
<ul>
<li>
<a href="tut/part2.html">Asset Cache</a> (image/audio file preloader)
</li>
<li><a href="tut/part3.html">Game loop</a></li>
<li><a href="tut/part4.html">State Manager</a></li>
<li><a href="tut/part5.html">Input handler</a></li>
</ul>
<h3>Future Modules</h3>
<p>
As Tangle continues to evolve, modules will be added as occasion
permits. Currently, the following modules are in various stages of
planning or development:
</p>
<ul>
<li>Sprite</li>
<li>Collision detection</li>
<li>Physics engine</li>
<li>Map</li>
<li>Screen (viewport-sized subsection of a Map)</li>
<li>SoundEffect</li>
<li>Music</li>
<li>Font</li>
</ul>
<p>
It is likely that this module list will evolve over the course of the
blog series, so check back often.
</p>
</section>
<footer></footer>
</body>
</html>