Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with
or
.
Download ZIP
tree: 1be80c89e8
Fetching contributors…

Cannot retrieve contributors at this time

79 lines (72 sloc) 6.771 kB
<!DOCTYPE html><head><title>Trolley</title><meta charset="utf-8"><link rel="stylesheet" href="css/bootstrap.min.css"><link rel="stylesheet" href="css/main.css"><link rel="stylesheet" href="http://twitter.github.com/bootstrap/assets/js/google-code-prettify/prettify.css"><script src="http://code.jquery.com/jquery.min.js"></script><script src="http://twitter.github.com/bootstrap/assets/js/google-code-prettify/prettify.js"></script><script src="https://raw.github.com/HBehrens/box2d.js/master/javascript/Box2D/box2d.min.js"></script><script src="https://raw.github.com/eirikb/trolley/master/trolley.min.js"></script><script src="main.js"></script><style></style></head><body><a href="http://github.com/eirikb/trolley"><img src="https://a248.e.akamai.net/camo.github.com/30f550e0d38ceb6ef5b81500c64d970b7fb0f028/687474703a2f2f73332e616d617a6f6e6177732e636f6d2f6769746875622f726962626f6e732f666f726b6d655f72696768745f6f72616e67655f6666373630302e706e67" alt="Fork me on GitHub" class="ribbon"></a><div class="container"><header class="page-header"><h1>Trolley - Box2D utility</h1></header><div class="row"><div class="span16"><p>Please see <a href="http://jsfiddle.net/pm2S4">this jsfiddle</a> for example starting point.
</p><p>All the examples on this page can be found <a href="https://github.com/eirikb/trolley/tree/gh-pages/examples">here</a>.
</p></div></div><div class="row"><h2>Simple</h2><div class="span6"><pre contenteditable class="prettyprint lang-js linenums"> trolley.init();
trolley.body(0, 0, true).box(15, 1).create();
trolley.body(5, 1).box(4, 2).create();
trolley.body(7, 3).box(2, 2).create();
trolley.body(5, 3).box(2, 2).create();
trolley.body(6, 8).box(2, 2).create();
</pre><span class="label">editable</span><button class="re-run btn btn-primary btn-mini">Re-run
<i class="icon-play icon-white"></i></button><p></p></div><div class="span6"><button class="btn well span5 play">Run example
<i class="icon-play"></i></button><canvas width="300px" height="200px"></canvas></div></div><hr><div class="row"><h2>Chaining</h2><div class="span6"><pre contenteditable class="prettyprint lang-js linenums"> trolley.init();
trolley.body(0, 0, true).box(15, 1).create();
trolley.body(1, 1).box(1, 3).create();
trolley.body(1, 10).box(2, 2, 2, 2).circle(2).circle(0, 4, 2).circle(4, 0, 2).circle(4, 4, 2).create();
</pre><span class="label">editable</span><button class="re-run btn btn-primary btn-mini">Re-run
<i class="icon-play icon-white"></i></button><p>How shapes inside a body can be chained together</p></div><div class="span6"><button class="btn well span5 play">Run example
<i class="icon-play"></i></button><canvas width="300px" height="200px"></canvas></div></div><hr><div class="row"><h2>Options</h2><div class="span6"><pre contenteditable class="prettyprint lang-js linenums"> trolley.init();
trolley.body(0, 0, true).box(15, 1).create();
for (var i = 1; i &lt; 8; i += 2) {
trolley.body(5, i).box(2, 2).create();
}
trolley.body(4.5, 15).box(2, 2, {
density: 100
}).create();
</pre><span class="label">editable</span><button class="re-run btn btn-primary btn-mini">Re-run
<i class="icon-play icon-white"></i></button><p>Setting Box2D options on bodies</p></div><div class="span6"><button class="btn well span5 play">Run example
<i class="icon-play"></i></button><canvas width="300px" height="200px"></canvas></div></div><hr><div class="row"><h2>Body options</h2><div class="span6"><pre contenteditable class="prettyprint lang-js linenums"> trolley.init();
trolley.body(0, 0, true).box(15, 1).create();
trolley.body(5, 1).box(2, 2).create();
trolley.body(4, 15, {
fixedRotation: true
}).box(2, 2, {
density: 100
}).create();
</pre><span class="label">editable</span><button class="re-run btn btn-primary btn-mini">Re-run
<i class="icon-play icon-white"></i></button><p>Options for body and shape</p></div><div class="span6"><button class="btn well span5 play">Run example
<i class="icon-play"></i></button><canvas width="300px" height="200px"></canvas></div></div><hr><div class="row"><h2>Joints</h2><div class="span6"><pre contenteditable class="prettyprint lang-js linenums"> trolley.init();
trolley.body(0, 8, true).box(15, 1).create();
var b1 = trolley.body(4, 5).circle(2).create();
var b2 = trolley.body(6, 12).circle(2).create();
trolley.joint().a(b1, 1, 1).b(b2, 1, 1);
</pre><span class="label">editable</span><button class="re-run btn btn-primary btn-mini">Re-run
<i class="icon-play icon-white"></i></button><p>First example of how joints can be solved</p></div><div class="span6"><button class="btn well span5 play">Run example
<i class="icon-play"></i></button><canvas width="300px" height="200px"></canvas></div></div><hr><div class="row"><h2>More joints</h2><div class="span6"><pre contenteditable class="prettyprint lang-js linenums"> trolley.init();
trolley.body(6, 10, true).box(18, 1).create();
var b1 = trolley.body(15, 20).circle(2).create();
var b2 = trolley.body(13, 10).circle(2).create();
var b3 = trolley.body(17, 10).circle(2).create();
trolley.joint().a(b1, 1, 1).b(b2, 1, 1);
trolley.joint().a(b1, 1, 1).b(b3, 1, 1);
</pre><span class="label">editable</span><button class="re-run btn btn-primary btn-mini">Re-run
<i class="icon-play icon-white"></i></button><p>Three balls linked together as a chain</p></div><div class="span6"><button class="btn well span5 play">Run example
<i class="icon-play"></i></button><canvas width="300px" height="200px"></canvas></div></div><hr><div class="row"><h2>JSON</h2><div class="span6"><pre contenteditable class="prettyprint lang-js linenums"> trolley.init();
trolley.build([{x: 0, y: 0, isStatic: true,
boxes: [{ width: 15, height: 1 }] },
{ x: 5, y: 1, boxes: [{ width: 4, height: 2 }] },
{ x: 7, y: 3, boxes: [{ width: 2, height: 2 }] },
{ x: 5, y: 3, boxes: [{ width: 2, height: 2 }] },
{ x: 6, y: 8, boxes: [{ width: 2, height: 2 }] },
{ x: 6, y: 12, circles: [{ size: 2}] }]
).create();
</pre><span class="label">editable</span><button class="re-run btn btn-primary btn-mini">Re-run
<i class="icon-play icon-white"></i></button><p>Creating a world from JSON</p></div><div class="span6"><button class="btn well span5 play">Run example
<i class="icon-play"></i></button><canvas width="300px" height="200px"></canvas></div></div><hr></div><script>var _gaq=_gaq || [];
_gaq.push(['_setAccount','UA-29703693-1']);
_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>
Jump to Line
Something went wrong with that request. Please try again.