diff --git a/README.md b/README.md index f32bac6..f30768b 100644 --- a/README.md +++ b/README.md @@ -14,6 +14,7 @@ - [Solid Shapes](http://brm.io/matter-js-demo#mixedSolid) - [Newton's Cradle](http://brm.io/matter-js-demo#newtonsCradle) - [Wrecking Ball](http://brm.io/matter-js-demo#wreckingBall) +- [Slingshot Game](http://brm.io/matter-js-demo#slingshot) - [Rounded Corners (Chamfering)](http://brm.io/matter-js-demo#rounded) - [Views](http://brm.io/matter-js-demo/#views) - [Time Scaling](http://brm.io/matter-js-demo/#timescale) diff --git a/demo/dev.html b/demo/dev.html index 8cd6986..e2a54c0 100644 --- a/demo/dev.html +++ b/demo/dev.html @@ -26,13 +26,14 @@

Matter.js Demo (Dev. Build)

-

Mobile Demo · Project page · GitHub

+

Mobile Demo · Project page · GitHub · @liabru

+ diff --git a/demo/js/Demo.js b/demo/js/Demo.js index 36ef2ba..eed58f3 100644 --- a/demo/js/Demo.js +++ b/demo/js/Demo.js @@ -120,6 +120,60 @@ var renderOptions = _engine.render.options; }; + Demo.slingshot = function() { + var _world = _engine.world; + + Demo.reset(); + _world.bodies = []; + + var ground = Bodies.rectangle(395, 600, 815, 50, { isStatic: true, render: { visible: false } }), + rockOptions = { density: 0.004, render: { sprite: { texture: './img/rock.png' } } }, + rock = Bodies.polygon(170, 450, 8, 20, rockOptions), + anchor = { x: 170, y: 450 }, + elastic = Constraint.create({ + pointA: anchor, + bodyB: rock, + stiffness: 0.05, + render: { + lineWidth: 5, + strokeStyle: '#dfa417' + } + }); + + var pyramid = Composites.pyramid(500, 300, 9, 10, 0, 0, function(x, y, column, row) { + var texture = column % 2 === 0 ? './img/block.png' : './img/block-2.png'; + return Bodies.rectangle(x, y, 25, 40, { render: { sprite: { texture: texture } } }); + }); + + var ground2 = Bodies.rectangle(610, 250, 200, 20, { + isStatic: true, + render: { + fillStyle: '#edc51e', + strokeStyle: '#b5a91c' + } + }); + + var pyramid2 = Composites.pyramid(550, 0, 5, 10, 0, 0, function(x, y, column, row) { + var texture = column % 2 === 0 ? './img/block.png' : './img/block-2.png'; + return Bodies.rectangle(x, y, 25, 40, { render: { sprite: { texture: texture } } }); + }); + + World.add(_engine.world, [ground, pyramid, ground2, pyramid2, rock, elastic]); + + Events.on(_engine, 'tick', function(event) { + if (_engine.input.mouse.button === -1 && (rock.position.x > 190 || rock.position.y < 430)) { + rock = Bodies.polygon(170, 450, 7, 20, rockOptions); + World.add(_engine.world, rock); + elastic.bodyB = rock; + } + }); + + var renderOptions = _engine.render.options; + renderOptions.wireframes = false; + renderOptions.showAngleIndicator = false; + renderOptions.background = './img/background.png'; + }; + Demo.rounded = function() { var _world = _engine.world;