foster/liabru-matter-js
0
0
Fork 0
mirror of https://github.com/liabru/matter-js.git synced 2025-02-07 19:06:26 -05:00
Code Issues Wiki Activity

improved demo and examples

Browse source
This commit is contained in:
liabru 2016-11-28 01:13:22 +00:00
parent 1a40f2754c
commit ace1a9f6aa
43 changed files with 318 additions and 284 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
.eslintrc
View file

@ -29,7 +29,6 @@
"require": false, "require": false,
"PIXI": false, "PIXI": false,
"$": false, "$": false,
"Example": false,
"Image": false, "Image": false,
"navigator": false, "navigator": false,
"setTimeout": false, "setTimeout": false,

17
examples/airFriction.js
View file

@ -4,7 +4,6 @@ Example.airFriction = function() {
var Engine = Matter.Engine, var Engine = Matter.Engine,
Render = Matter.Render, Render = Matter.Render,
Runner = Matter.Runner, Runner = Matter.Runner,
Composite = Matter.Composite,
MouseConstraint = Matter.MouseConstraint, MouseConstraint = Matter.MouseConstraint,
Mouse = Matter.Mouse, Mouse = Matter.Mouse,
World = Matter.World, World = Matter.World,
@ -19,8 +18,8 @@ Example.airFriction = function() {
element: document.body, element: document.body,
engine: engine, engine: engine,
options: { options: {
width: Math.min(document.body.clientWidth, 1024), width: Math.min(document.documentElement.clientWidth, 800),
height: Math.min(document.body.clientHeight, 1024), height: Math.min(document.documentElement.clientHeight, 600),
showVelocity: true showVelocity: true
} }
}); });
@ -38,8 +37,11 @@ Example.airFriction = function() {
Bodies.rectangle(400, 100, 60, 60, { frictionAir: 0.05 }), Bodies.rectangle(400, 100, 60, 60, { frictionAir: 0.05 }),
Bodies.rectangle(600, 100, 60, 60, { frictionAir: 0.1 }), Bodies.rectangle(600, 100, 60, 60, { frictionAir: 0.1 }),
// floor // walls
Bodies.rectangle(400, 600, 800, 50, { isStatic: true }) Bodies.rectangle(400, 0, 800, 50, { isStatic: true }),
Bodies.rectangle(400, 600, 800, 50, { isStatic: true }),
Bodies.rectangle(800, 300, 50, 600, { isStatic: true }),
Bodies.rectangle(0, 300, 50, 600, { isStatic: true })
]); ]);
// add mouse control // add mouse control
@ -60,7 +62,10 @@ Example.airFriction = function() {
render.mouse = mouse; render.mouse = mouse;
// fit the render viewport to the scene // fit the render viewport to the scene
Render.lookAt(render, Composite.allBodies(world)); Render.lookAt(render, {
min: { x: 0, y: 0 },
max: { x: 800, y: 600 }
});
// context for MatterTools.Demo // context for MatterTools.Demo
return { return {

11
examples/attractors.js
View file

@ -9,7 +9,6 @@ Example.attractors = function() {
var Engine = Matter.Engine, var Engine = Matter.Engine,
Render = Matter.Render, Render = Matter.Render,
Runner = Matter.Runner, Runner = Matter.Runner,
Composite = Matter.Composite,
Body = Matter.Body, Body = Matter.Body,
Common = Matter.Common, Common = Matter.Common,
MouseConstraint = Matter.MouseConstraint, MouseConstraint = Matter.MouseConstraint,
@ -26,8 +25,8 @@ Example.attractors = function() {
element: document.body, element: document.body,
engine: engine, engine: engine,
options: { options: {
width: Math.min(document.body.clientWidth, 1024), width: Math.min(document.documentElement.clientWidth, 800),
height: Math.min(document.body.clientHeight, 1024) height: Math.min(document.documentElement.clientHeight, 600)
} }
}); });
@ -84,6 +83,12 @@ Example.attractors = function() {
// keep the mouse in sync with rendering // keep the mouse in sync with rendering
render.mouse = mouse; render.mouse = mouse;
// fit the render viewport to the scene
Render.lookAt(render, {
min: { x: 0, y: 0 },
max: { x: 800, y: 600 }
});
// context for MatterTools.Demo // context for MatterTools.Demo
return { return {
engine: engine, engine: engine,

4
examples/avalanche.js
View file

@ -25,8 +25,8 @@ Example.avalanche = function() {
element: document.body, element: document.body,
engine: engine, engine: engine,
options: { options: {
width: Math.min(document.body.clientWidth, 1024), width: Math.min(document.documentElement.clientWidth, 800),
height: Math.min(document.body.clientHeight, 1024), height: Math.min(document.documentElement.clientHeight, 600),
showAngleIndicator: true showAngleIndicator: true
} }
}); });

35
examples/ballPool.js
View file

@ -1,6 +1,10 @@
var Example = Example || {}; var Example = Example || {};
Example.ballPool = function() { Example.ballPool = function() {
Matter.use(
'matter-wrap'
);
var Engine = Matter.Engine, var Engine = Matter.Engine,
Render = Matter.Render, Render = Matter.Render,
Runner = Matter.Runner, Runner = Matter.Runner,
@ -21,8 +25,8 @@ Example.ballPool = function() {
element: document.body, element: document.body,
engine: engine, engine: engine,
options: { options: {
width: Math.min(document.body.clientWidth, 1024), width: Math.min(document.documentElement.clientWidth, 800),
height: Math.min(document.body.clientHeight, 1024), height: Math.min(document.documentElement.clientHeight, 600),
showAngleIndicator: true showAngleIndicator: true
} }
}); });
@ -35,20 +39,18 @@ Example.ballPool = function() {
// add bodies // add bodies
World.add(world, [ World.add(world, [
Bodies.rectangle(400, 600, 800, 50.5, { isStatic: true }), Bodies.rectangle(400, 600, 1200, 50.5, { isStatic: true })
Bodies.rectangle(800, 300, 50, 600, { isStatic: true }),
Bodies.rectangle(0, 300, 50, 600, { isStatic: true })
]); ]);
var stack = Composites.stack(100, 50, 10, 8, 10, 10, function(x, y) { var stack = Composites.stack(100, 0, 10, 8, 10, 10, function(x, y) {
return Bodies.circle(x, y, Common.random(15, 30), { restitution: 0.6, friction: 0.1 }); return Bodies.circle(x, y, Common.random(15, 30), { restitution: 0.6, friction: 0.1 });
}); });
World.add(world, [ World.add(world, [
stack, stack,
Bodies.polygon(200, 560, 3, 60), Bodies.polygon(200, 460, 3, 60),
Bodies.polygon(400, 560, 5, 60), Bodies.polygon(400, 460, 5, 60),
Bodies.rectangle(600, 560, 80, 80) Bodies.rectangle(600, 460, 80, 80)
]); ]);
// add mouse control // add mouse control
@ -69,7 +71,20 @@ Example.ballPool = function() {
render.mouse = mouse; render.mouse = mouse;
// fit the render viewport to the scene // fit the render viewport to the scene
Render.lookAt(render, Composite.allBodies(world)); Render.lookAt(render, {
min: { x: 0, y: 0 },
max: { x: 800, y: 600 }
});
// wrapping using matter-wrap plugin
var allBodies = Composite.allBodies(world);
for (var i = 0; i < allBodies.length; i += 1) {
allBodies[i].wrap = {
min: { x: render.bounds.min.x - 100, y: render.bounds.min.y },
max: { x: render.bounds.max.x + 100, y: render.bounds.max.y }
};
}
// context for MatterTools.Demo // context for MatterTools.Demo
return { return {

10
examples/bridge.js
View file

@ -5,7 +5,6 @@ Example.bridge = function() {
Render = Matter.Render, Render = Matter.Render,
Runner = Matter.Runner, Runner = Matter.Runner,
Body = Matter.Body, Body = Matter.Body,
Composite = Matter.Composite,
Composites = Matter.Composites, Composites = Matter.Composites,
Common = Matter.Common, Common = Matter.Common,
Constraint = Matter.Constraint, Constraint = Matter.Constraint,
@ -23,8 +22,8 @@ Example.bridge = function() {
element: document.body, element: document.body,
engine: engine, engine: engine,
options: { options: {
width: Math.min(document.body.clientWidth, 1024), width: Math.min(document.documentElement.clientWidth, 800),
height: Math.min(document.body.clientHeight, 1024), height: Math.min(document.documentElement.clientHeight, 600),
showAngleIndicator: true showAngleIndicator: true
} }
}); });
@ -75,7 +74,10 @@ Example.bridge = function() {
render.mouse = mouse; render.mouse = mouse;
// fit the render viewport to the scene // fit the render viewport to the scene
Render.lookAt(render, Composite.allBodies(world)); Render.lookAt(render, {
min: { x: 0, y: 0 },
max: { x: 800, y: 600 }
});
// context for MatterTools.Demo // context for MatterTools.Demo
return { return {

16
examples/broadphase.js
View file

@ -4,11 +4,8 @@ Example.broadphase = function() {
var Engine = Matter.Engine, var Engine = Matter.Engine,
Render = Matter.Render, Render = Matter.Render,
Runner = Matter.Runner, Runner = Matter.Runner,
Body = Matter.Body,
Composite = Matter.Composite,
Composites = Matter.Composites, Composites = Matter.Composites,
Common = Matter.Common, Common = Matter.Common,
Constraint = Matter.Constraint,
MouseConstraint = Matter.MouseConstraint, MouseConstraint = Matter.MouseConstraint,
Mouse = Matter.Mouse, Mouse = Matter.Mouse,
World = Matter.World, World = Matter.World,
@ -23,8 +20,8 @@ Example.broadphase = function() {
element: document.body, element: document.body,
engine: engine, engine: engine,
options: { options: {
width: Math.min(document.body.clientWidth, 1024), width: Math.min(document.documentElement.clientWidth, 800),
height: Math.min(document.body.clientHeight, 1024), height: Math.min(document.documentElement.clientHeight, 600),
showAngleIndicator: true, showAngleIndicator: true,
showBroadphase: true showBroadphase: true
} }
@ -38,7 +35,9 @@ Example.broadphase = function() {
// add bodies // add bodies
World.add(world, [ World.add(world, [
Bodies.rectangle(400, 600, 800, 50.5, { isStatic: true }), // walls
Bodies.rectangle(400, 0, 800, 50, { isStatic: true }),
Bodies.rectangle(400, 600, 800, 50, { isStatic: true }),
Bodies.rectangle(800, 300, 50, 600, { isStatic: true }), Bodies.rectangle(800, 300, 50, 600, { isStatic: true }),
Bodies.rectangle(0, 300, 50, 600, { isStatic: true }) Bodies.rectangle(0, 300, 50, 600, { isStatic: true })
]); ]);
@ -79,7 +78,10 @@ Example.broadphase = function() {
render.mouse = mouse; render.mouse = mouse;
// fit the render viewport to the scene // fit the render viewport to the scene
Render.lookAt(render, Composite.allBodies(world)); Render.lookAt(render, {
min: { x: 0, y: 0 },
max: { x: 800, y: 600 }
});
// context for MatterTools.Demo // context for MatterTools.Demo
return { return {

17
examples/car.js
View file

@ -4,11 +4,7 @@ Example.car = function() {
var Engine = Matter.Engine, var Engine = Matter.Engine,
Render = Matter.Render, Render = Matter.Render,
Runner = Matter.Runner, Runner = Matter.Runner,
Body = Matter.Body,
Composite = Matter.Composite,
Composites = Matter.Composites, Composites = Matter.Composites,
Common = Matter.Common,
Constraint = Matter.Constraint,
MouseConstraint = Matter.MouseConstraint, MouseConstraint = Matter.MouseConstraint,
Mouse = Matter.Mouse, Mouse = Matter.Mouse,
World = Matter.World, World = Matter.World,
@ -23,8 +19,8 @@ Example.car = function() {
element: document.body, element: document.body,
engine: engine, engine: engine,
options: { options: {
width: Math.min(document.body.clientWidth, 1024), width: Math.min(document.documentElement.clientWidth, 800),
height: Math.min(document.body.clientHeight, 1024), height: Math.min(document.documentElement.clientHeight, 600),
showAngleIndicator: true, showAngleIndicator: true,
showCollisions: true showCollisions: true
} }
@ -38,7 +34,9 @@ Example.car = function() {
// add bodies // add bodies
World.add(world, [ World.add(world, [
Bodies.rectangle(400, 600, 800, 50.5, { isStatic: true }), // walls
Bodies.rectangle(400, 0, 800, 50, { isStatic: true }),
Bodies.rectangle(400, 600, 800, 50, { isStatic: true }),
Bodies.rectangle(800, 300, 50, 600, { isStatic: true }), Bodies.rectangle(800, 300, 50, 600, { isStatic: true }),
Bodies.rectangle(0, 300, 50, 600, { isStatic: true }) Bodies.rectangle(0, 300, 50, 600, { isStatic: true })
]); ]);
@ -73,7 +71,10 @@ Example.car = function() {
render.mouse = mouse; render.mouse = mouse;
// fit the render viewport to the scene // fit the render viewport to the scene
Render.lookAt(render, Composite.allBodies(world)); Render.lookAt(render, {
min: { x: 0, y: 0 },
max: { x: 800, y: 600 }
});
// context for MatterTools.Demo // context for MatterTools.Demo
return { return {

12
examples/catapult.js
View file

@ -4,10 +4,7 @@ Example.catapult = function() {
var Engine = Matter.Engine, var Engine = Matter.Engine,
Render = Matter.Render, Render = Matter.Render,
Runner = Matter.Runner, Runner = Matter.Runner,
Body = Matter.Body,
Composite = Matter.Composite,
Composites = Matter.Composites, Composites = Matter.Composites,
Common = Matter.Common,
Constraint = Matter.Constraint, Constraint = Matter.Constraint,
MouseConstraint = Matter.MouseConstraint, MouseConstraint = Matter.MouseConstraint,
Mouse = Matter.Mouse, Mouse = Matter.Mouse,
@ -23,8 +20,8 @@ Example.catapult = function() {
element: document.body, element: document.body,
engine: engine, engine: engine,
options: { options: {
width: Math.min(document.body.clientWidth, 1024), width: Math.min(document.documentElement.clientWidth, 800),
height: Math.min(document.body.clientHeight, 1024), height: Math.min(document.documentElement.clientHeight, 600),
showAngleIndicator: true, showAngleIndicator: true,
showCollisions: true, showCollisions: true,
showVelocity: true showVelocity: true
@ -72,7 +69,10 @@ Example.catapult = function() {
render.mouse = mouse; render.mouse = mouse;
// fit the render viewport to the scene // fit the render viewport to the scene
Render.lookAt(render, Composite.allBodies(world)); Render.lookAt(render, {
min: { x: 0, y: 0 },
max: { x: 800, y: 600 }
});
// context for MatterTools.Demo // context for MatterTools.Demo
return { return {

5
examples/chains.js
View file

@ -7,7 +7,6 @@ Example.chains = function() {
Body = Matter.Body, Body = Matter.Body,
Composite = Matter.Composite, Composite = Matter.Composite,
Composites = Matter.Composites, Composites = Matter.Composites,
Common = Matter.Common,
Constraint = Matter.Constraint, Constraint = Matter.Constraint,
MouseConstraint = Matter.MouseConstraint, MouseConstraint = Matter.MouseConstraint,
Mouse = Matter.Mouse, Mouse = Matter.Mouse,
@ -23,8 +22,8 @@ Example.chains = function() {
element: document.body, element: document.body,
engine: engine, engine: engine,
options: { options: {
width: Math.min(document.body.clientWidth, 1024), width: Math.min(document.documentElement.clientWidth, 800),
height: Math.min(document.body.clientHeight, 1024), height: Math.min(document.documentElement.clientHeight, 600),
showAngleIndicator: true, showAngleIndicator: true,
showCollisions: true, showCollisions: true,
showVelocity: true showVelocity: true

21
examples/circleStack.js
View file

@ -4,11 +4,7 @@ Example.circleStack = function() {
var Engine = Matter.Engine, var Engine = Matter.Engine,
Render = Matter.Render, Render = Matter.Render,
Runner = Matter.Runner, Runner = Matter.Runner,
Body = Matter.Body,
Composite = Matter.Composite,
Composites = Matter.Composites, Composites = Matter.Composites,
Common = Matter.Common,
Constraint = Matter.Constraint,
MouseConstraint = Matter.MouseConstraint, MouseConstraint = Matter.MouseConstraint,
Mouse = Matter.Mouse, Mouse = Matter.Mouse,
World = Matter.World, World = Matter.World,
@ -23,8 +19,8 @@ Example.circleStack = function() {
element: document.body, element: document.body,
engine: engine, engine: engine,
options: { options: {
width: Math.min(document.body.clientWidth, 1024), width: Math.min(document.documentElement.clientWidth, 800),
height: Math.min(document.body.clientHeight, 1024), height: Math.min(document.documentElement.clientHeight, 600),
showAngleIndicator: true showAngleIndicator: true
} }
}); });
@ -41,7 +37,11 @@ Example.circleStack = function() {
}); });
World.add(world, [ World.add(world, [
Bodies.rectangle(400, 600, 800, 50.5, { isStatic: true }), // walls
Bodies.rectangle(400, 0, 800, 50, { isStatic: true }),
Bodies.rectangle(400, 600, 800, 50, { isStatic: true }),
Bodies.rectangle(800, 300, 50, 600, { isStatic: true }),
Bodies.rectangle(0, 300, 50, 600, { isStatic: true }),
stack stack
]); ]);
@ -63,8 +63,11 @@ Example.circleStack = function() {
render.mouse = mouse; render.mouse = mouse;
// fit the render viewport to the scene // fit the render viewport to the scene
Render.lookAt(render, Composite.allBodies(world)); Render.lookAt(render, {
min: { x: 0, y: 0 },
max: { x: 800, y: 600 }
});
// context for MatterTools.Demo // context for MatterTools.Demo
return { return {
engine: engine, engine: engine,

12
examples/cloth.js
View file

@ -5,10 +5,7 @@ Example.cloth = function() {
Render = Matter.Render, Render = Matter.Render,
Runner = Matter.Runner, Runner = Matter.Runner,
Body = Matter.Body, Body = Matter.Body,
Composite = Matter.Composite,
Composites = Matter.Composites, Composites = Matter.Composites,
Common = Matter.Common,
Constraint = Matter.Constraint,
MouseConstraint = Matter.MouseConstraint, MouseConstraint = Matter.MouseConstraint,
Mouse = Matter.Mouse, Mouse = Matter.Mouse,
World = Matter.World, World = Matter.World,
@ -23,8 +20,8 @@ Example.cloth = function() {
element: document.body, element: document.body,
engine: engine, engine: engine,
options: { options: {
width: Math.min(document.body.clientWidth, 1024), width: Math.min(document.documentElement.clientWidth, 800),
height: Math.min(document.body.clientHeight, 1024) height: Math.min(document.documentElement.clientHeight, 600)
} }
}); });
@ -46,7 +43,8 @@ Example.cloth = function() {
World.add(world, [ World.add(world, [
cloth, cloth,
Bodies.circle(300, 500, 80, { isStatic: true }), Bodies.circle(300, 500, 80, { isStatic: true }),
Bodies.rectangle(500, 480, 80, 80, { isStatic: true }) Bodies.rectangle(500, 480, 80, 80, { isStatic: true }),
Bodies.rectangle(400, 609, 800, 50, { isStatic: true })
]); ]);
// add mouse control // add mouse control
@ -66,7 +64,7 @@ Example.cloth = function() {
// fit the render viewport to the scene // fit the render viewport to the scene
Render.lookAt(render, { Render.lookAt(render, {
min: { x: 0, y: 0 }, min: { x: 0, y: 0 },
max: { x: 800, y: 700 } max: { x: 800, y: 600 }
}); });
// context for MatterTools.Demo // context for MatterTools.Demo

13
examples/collisionFiltering.js
View file

@ -21,8 +21,8 @@ Example.collisionFiltering = function() {
element: document.body, element: document.body,
engine: engine, engine: engine,
options: { options: {
width: Math.min(document.body.clientWidth, 1024), width: Math.min(document.documentElement.clientWidth, 800),
height: Math.min(document.body.clientHeight, 1024), height: Math.min(document.documentElement.clientHeight, 600),
wireframes: false, wireframes: false,
background: '#111' background: '#111'
} }
@ -45,7 +45,7 @@ Example.collisionFiltering = function() {
greenColor = '#C7F464'; greenColor = '#C7F464';
// add floor // add floor
World.add(world, Bodies.rectangle(400, 800, 900, 50, { World.add(world, Bodies.rectangle(400, 600, 900, 50, {
isStatic: true, isStatic: true,
render: { render: {
fillStyle: 'transparent' fillStyle: 'transparent'
@ -54,7 +54,7 @@ Example.collisionFiltering = function() {
// create a stack with varying body categories (but these bodies can all collide with each other) // create a stack with varying body categories (but these bodies can all collide with each other)
World.add(world, World.add(world,
Composites.stack(275, 150, 5, 10, 10, 10, function(x, y, column, row) { Composites.stack(275, 100, 5, 9, 10, 10, function(x, y, column, row) {
var category = redCategory, var category = redCategory,
color = redColor; color = redColor;
@ -138,7 +138,10 @@ Example.collisionFiltering = function() {
mouseConstraint.collisionFilter.mask = defaultCategory | blueCategory | greenCategory; mouseConstraint.collisionFilter.mask = defaultCategory | blueCategory | greenCategory;
// fit the render viewport to the scene // fit the render viewport to the scene
Render.lookAt(render, Composite.allBodies(world)); Render.lookAt(render, {
min: { x: 0, y: 0 },
max: { x: 800, y: 600 }
});
// context for MatterTools.Demo // context for MatterTools.Demo
return { return {

16
examples/compositeManipulation.js
View file

@ -4,12 +4,9 @@ Example.compositeManipulation = function() {
var Engine = Matter.Engine, var Engine = Matter.Engine,
Render = Matter.Render, Render = Matter.Render,
Runner = Matter.Runner, Runner = Matter.Runner,
Body = Matter.Body,
Events = Matter.Events, Events = Matter.Events,
Composite = Matter.Composite, Composite = Matter.Composite,
Composites = Matter.Composites, Composites = Matter.Composites,
Common = Matter.Common,
Constraint = Matter.Constraint,
MouseConstraint = Matter.MouseConstraint, MouseConstraint = Matter.MouseConstraint,
Mouse = Matter.Mouse, Mouse = Matter.Mouse,
World = Matter.World, World = Matter.World,
@ -24,8 +21,8 @@ Example.compositeManipulation = function() {
element: document.body, element: document.body,
engine: engine, engine: engine,
options: { options: {
width: Math.min(document.body.clientWidth, 1024), width: Math.min(document.documentElement.clientWidth, 800),
height: Math.min(document.body.clientHeight, 1024), height: Math.min(document.documentElement.clientHeight, 600),
showAngleIndicator: true showAngleIndicator: true
} }
}); });
@ -38,7 +35,9 @@ Example.compositeManipulation = function() {
// add bodies // add bodies
World.add(world, [ World.add(world, [
Bodies.rectangle(400, 600, 800, 50.5, { isStatic: true }), // walls
Bodies.rectangle(400, 0, 800, 50, { isStatic: true }),
Bodies.rectangle(400, 600, 800, 50, { isStatic: true }),
Bodies.rectangle(800, 300, 50, 600, { isStatic: true }), Bodies.rectangle(800, 300, 50, 600, { isStatic: true }),
Bodies.rectangle(0, 300, 50, 600, { isStatic: true }) Bodies.rectangle(0, 300, 50, 600, { isStatic: true })
]); ]);
@ -90,7 +89,10 @@ Example.compositeManipulation = function() {
render.mouse = mouse; render.mouse = mouse;
// fit the render viewport to the scene // fit the render viewport to the scene
Render.lookAt(render, Composite.allBodies(world)); Render.lookAt(render, {
min: { x: 0, y: 0 },
max: { x: 800, y: 600 }
});
// context for MatterTools.Demo // context for MatterTools.Demo
return { return {

13
examples/compound.js
View file

@ -5,10 +5,6 @@ Example.compound = function() {
Render = Matter.Render, Render = Matter.Render,
Runner = Matter.Runner, Runner = Matter.Runner,
Body = Matter.Body, Body = Matter.Body,
Events = Matter.Events,
Composite = Matter.Composite,
Composites = Matter.Composites,
Common = Matter.Common,
Constraint = Matter.Constraint, Constraint = Matter.Constraint,
MouseConstraint = Matter.MouseConstraint, MouseConstraint = Matter.MouseConstraint,
Mouse = Matter.Mouse, Mouse = Matter.Mouse,
@ -24,8 +20,8 @@ Example.compound = function() {
element: document.body, element: document.body,
engine: engine, engine: engine,
options: { options: {
width: Math.min(document.body.clientWidth, 1024), width: Math.min(document.documentElement.clientWidth, 800),
height: Math.min(document.body.clientHeight, 1024), height: Math.min(document.documentElement.clientHeight, 600),
showAxes: true, showAxes: true,
showPositions: true, showPositions: true,
showConvexHulls: true showConvexHulls: true
@ -93,7 +89,10 @@ Example.compound = function() {
render.mouse = mouse; render.mouse = mouse;
// fit the render viewport to the scene // fit the render viewport to the scene
Render.lookAt(render, Composite.allBodies(world)); Render.lookAt(render, {
min: { x: 0, y: 0 },
max: { x: 800, y: 600 }
});
// context for MatterTools.Demo // context for MatterTools.Demo
return { return {

19
examples/compoundStack.js
View file

@ -5,11 +5,7 @@ Example.compoundStack = function() {
Render = Matter.Render, Render = Matter.Render,
Runner = Matter.Runner, Runner = Matter.Runner,
Body = Matter.Body, Body = Matter.Body,
Events = Matter.Events,
Composite = Matter.Composite,
Composites = Matter.Composites, Composites = Matter.Composites,
Common = Matter.Common,
Constraint = Matter.Constraint,
MouseConstraint = Matter.MouseConstraint, MouseConstraint = Matter.MouseConstraint,
Mouse = Matter.Mouse, Mouse = Matter.Mouse,
World = Matter.World, World = Matter.World,
@ -24,8 +20,8 @@ Example.compoundStack = function() {
element: document.body, element: document.body,
engine: engine, engine: engine,
options: { options: {
width: Math.min(document.body.clientWidth, 1024), width: Math.min(document.documentElement.clientWidth, 800),
height: Math.min(document.body.clientHeight, 1024), height: Math.min(document.documentElement.clientHeight, 600),
showAngleIndicator: true showAngleIndicator: true
} }
}); });
@ -50,7 +46,11 @@ Example.compoundStack = function() {
World.add(world, [ World.add(world, [
stack, stack,
Bodies.rectangle(400, 620, 800, 50, { isStatic: true }) // walls
Bodies.rectangle(400, 0, 800, 50, { isStatic: true }),
Bodies.rectangle(800, 300, 50, 600, { isStatic: true }),
Bodies.rectangle(0, 300, 50, 600, { isStatic: true }),
Bodies.rectangle(400, 609, 800, 50, { isStatic: true })
]); ]);
// add mouse control // add mouse control
@ -71,7 +71,10 @@ Example.compoundStack = function() {
render.mouse = mouse; render.mouse = mouse;
// fit the render viewport to the scene // fit the render viewport to the scene
Render.lookAt(render, Composite.allBodies(world)); Render.lookAt(render, {
min: { x: 0, y: 0 },
max: { x: 800, y: 600 }
});
// context for MatterTools.Demo // context for MatterTools.Demo
return { return {

17
examples/concave.js
View file

@ -4,12 +4,8 @@ Example.concave = function() {
var Engine = Matter.Engine, var Engine = Matter.Engine,
Render = Matter.Render, Render = Matter.Render,
Runner = Matter.Runner, Runner = Matter.Runner,
Body = Matter.Body,
Events = Matter.Events,
Composite = Matter.Composite,
Composites = Matter.Composites, Composites = Matter.Composites,
Common = Matter.Common, Common = Matter.Common,
Constraint = Matter.Constraint,
MouseConstraint = Matter.MouseConstraint, MouseConstraint = Matter.MouseConstraint,
Mouse = Matter.Mouse, Mouse = Matter.Mouse,
World = Matter.World, World = Matter.World,
@ -25,8 +21,8 @@ Example.concave = function() {
element: document.body, element: document.body,
engine: engine, engine: engine,
options: { options: {
width: Math.min(document.body.clientWidth, 1024), width: Math.min(document.documentElement.clientWidth, 800),
height: Math.min(document.body.clientHeight, 1024) height: Math.min(document.documentElement.clientHeight, 600)
} }
}); });
@ -38,7 +34,9 @@ Example.concave = function() {
// add bodies // add bodies
World.add(world, [ World.add(world, [
Bodies.rectangle(400, 600, 800, 50.5, { isStatic: true }), // walls
Bodies.rectangle(400, 0, 800, 50, { isStatic: true }),
Bodies.rectangle(400, 600, 800, 50, { isStatic: true }),
Bodies.rectangle(800, 300, 50, 600, { isStatic: true }), Bodies.rectangle(800, 300, 50, 600, { isStatic: true }),
Bodies.rectangle(0, 300, 50, 600, { isStatic: true }) Bodies.rectangle(0, 300, 50, 600, { isStatic: true })
]); ]);
@ -78,7 +76,10 @@ Example.concave = function() {
render.mouse = mouse; render.mouse = mouse;
// fit the render viewport to the scene // fit the render viewport to the scene
Render.lookAt(render, Composite.allBodies(world)); Render.lookAt(render, {
min: { x: 0, y: 0 },
max: { x: 800, y: 600 }
});
// context for MatterTools.Demo // context for MatterTools.Demo
return { return {

12
examples/events.js
View file

@ -9,11 +9,9 @@ Example.events = function() {
Composite = Matter.Composite, Composite = Matter.Composite,
Composites = Matter.Composites, Composites = Matter.Composites,
Common = Matter.Common, Common = Matter.Common,
Constraint = Matter.Constraint,
MouseConstraint = Matter.MouseConstraint, MouseConstraint = Matter.MouseConstraint,
Mouse = Matter.Mouse, Mouse = Matter.Mouse,
World = Matter.World, World = Matter.World,
Vertices = Matter.Vertices,
Bodies = Matter.Bodies; Bodies = Matter.Bodies;
// create engine // create engine
@ -25,8 +23,9 @@ Example.events = function() {
element: document.body, element: document.body,
engine: engine, engine: engine,
options: { options: {
width: Math.min(document.body.clientWidth, 1024), width: Math.min(document.documentElement.clientWidth, 800),
height: Math.min(document.body.clientHeight, 1024) height: Math.min(document.documentElement.clientHeight, 600),
wireframes: false
} }
}); });
@ -160,7 +159,10 @@ Example.events = function() {
}); });
// fit the render viewport to the scene // fit the render viewport to the scene
Render.lookAt(render, Composite.allBodies(world)); Render.lookAt(render, {
min: { x: 0, y: 0 },
max: { x: 800, y: 600 }
});
// context for MatterTools.Demo // context for MatterTools.Demo
return { return {

18
examples/friction.js
View file

@ -4,16 +4,9 @@ Example.friction = function() {
var Engine = Matter.Engine, var Engine = Matter.Engine,
Render = Matter.Render, Render = Matter.Render,
Runner = Matter.Runner, Runner = Matter.Runner,
Body = Matter.Body,
Events = Matter.Events,
Composite = Matter.Composite,
Composites = Matter.Composites,
Common = Matter.Common,
Constraint = Matter.Constraint,
MouseConstraint = Matter.MouseConstraint, MouseConstraint = Matter.MouseConstraint,
Mouse = Matter.Mouse, Mouse = Matter.Mouse,
World = Matter.World, World = Matter.World,
Vertices = Matter.Vertices,
Bodies = Matter.Bodies; Bodies = Matter.Bodies;
// create engine // create engine
@ -25,8 +18,8 @@ Example.friction = function() {
element: document.body, element: document.body,
engine: engine, engine: engine,
options: { options: {
width: Math.min(document.body.clientWidth, 1024), width: Math.min(document.documentElement.clientWidth, 800),
height: Math.min(document.body.clientHeight, 1024), height: Math.min(document.documentElement.clientHeight, 600),
showVelocity: true showVelocity: true
} }
}); });
@ -39,6 +32,8 @@ Example.friction = function() {
// add bodies // add bodies
World.add(world, [ World.add(world, [
// walls
Bodies.rectangle(400, 0, 800, 50, { isStatic: true }),
Bodies.rectangle(400, 600, 800, 50, { isStatic: true }), Bodies.rectangle(400, 600, 800, 50, { isStatic: true }),
Bodies.rectangle(800, 300, 50, 600, { isStatic: true }), Bodies.rectangle(800, 300, 50, 600, { isStatic: true }),
Bodies.rectangle(0, 300, 50, 600, { isStatic: true }) Bodies.rectangle(0, 300, 50, 600, { isStatic: true })
@ -77,7 +72,10 @@ Example.friction = function() {
render.mouse = mouse; render.mouse = mouse;
// fit the render viewport to the scene // fit the render viewport to the scene
Render.lookAt(render, Composite.allBodies(world)); Render.lookAt(render, {
min: { x: 0, y: 0 },
max: { x: 800, y: 600 }
});
// context for MatterTools.Demo // context for MatterTools.Demo
return { return {

14
examples/gravity.js
View file

@ -4,16 +4,11 @@ Example.gravity = function() {
var Engine = Matter.Engine, var Engine = Matter.Engine,
Render = Matter.Render, Render = Matter.Render,
Runner = Matter.Runner, Runner = Matter.Runner,
Body = Matter.Body,
Events = Matter.Events,
Composite = Matter.Composite,
Composites = Matter.Composites, Composites = Matter.Composites,
Common = Matter.Common, Common = Matter.Common,
Constraint = Matter.Constraint,
MouseConstraint = Matter.MouseConstraint, MouseConstraint = Matter.MouseConstraint,
Mouse = Matter.Mouse, Mouse = Matter.Mouse,
World = Matter.World, World = Matter.World,
Vertices = Matter.Vertices,
Bodies = Matter.Bodies; Bodies = Matter.Bodies;
// create engine // create engine
@ -25,8 +20,8 @@ Example.gravity = function() {
element: document.body, element: document.body,
engine: engine, engine: engine,
options: { options: {
width: Math.min(document.body.clientWidth, 1024), width: Math.min(document.documentElement.clientWidth, 800),
height: Math.min(document.body.clientHeight, 1024), height: Math.min(document.documentElement.clientHeight, 600),
showVelocity: true, showVelocity: true,
showAngleIndicator: true showAngleIndicator: true
} }
@ -84,7 +79,10 @@ Example.gravity = function() {
render.mouse = mouse; render.mouse = mouse;
// fit the render viewport to the scene // fit the render viewport to the scene
Render.lookAt(render, Composite.allBodies(world)); Render.lookAt(render, {
min: { x: 0, y: 0 },
max: { x: 800, y: 600 }
});
// context for MatterTools.Demo // context for MatterTools.Demo
return { return {

15
examples/gyro.js
View file

@ -4,16 +4,11 @@ Example.gyro = function() {
var Engine = Matter.Engine, var Engine = Matter.Engine,
Render = Matter.Render, Render = Matter.Render,
Runner = Matter.Runner, Runner = Matter.Runner,
Body = Matter.Body,
Events = Matter.Events,
Composite = Matter.Composite,
Composites = Matter.Composites, Composites = Matter.Composites,
Common = Matter.Common, Common = Matter.Common,
Constraint = Matter.Constraint,
MouseConstraint = Matter.MouseConstraint, MouseConstraint = Matter.MouseConstraint,
Mouse = Matter.Mouse, Mouse = Matter.Mouse,
World = Matter.World, World = Matter.World,
Vertices = Matter.Vertices,
Bodies = Matter.Bodies; Bodies = Matter.Bodies;
// create engine // create engine
@ -25,8 +20,9 @@ Example.gyro = function() {
element: document.body, element: document.body,
engine: engine, engine: engine,
options: { options: {
width: Math.min(document.body.clientWidth, 1024), width: Math.min(document.documentElement.clientWidth, 800),
height: Math.min(document.body.clientHeight, 1024) height: Math.min(document.documentElement.clientHeight, 600),
showAngleIndicator: true
} }
}); });
@ -112,7 +108,10 @@ Example.gyro = function() {
render.mouse = mouse; render.mouse = mouse;
// fit the render viewport to the scene // fit the render viewport to the scene
Render.lookAt(render, Composite.allBodies(world)); Render.lookAt(render, {
min: { x: 0, y: 0 },
max: { x: 800, y: 600 }
});
// context for MatterTools.Demo // context for MatterTools.Demo
return { return {

16
examples/manipulation.js
View file

@ -6,14 +6,9 @@ Example.manipulation = function() {
Runner = Matter.Runner, Runner = Matter.Runner,
Body = Matter.Body, Body = Matter.Body,
Events = Matter.Events, Events = Matter.Events,
Composite = Matter.Composite,
Composites = Matter.Composites,
Common = Matter.Common,
Constraint = Matter.Constraint,
MouseConstraint = Matter.MouseConstraint, MouseConstraint = Matter.MouseConstraint,
Mouse = Matter.Mouse, Mouse = Matter.Mouse,
World = Matter.World, World = Matter.World,
Vertices = Matter.Vertices,
Bodies = Matter.Bodies; Bodies = Matter.Bodies;
// create engine // create engine
@ -25,8 +20,8 @@ Example.manipulation = function() {
element: document.body, element: document.body,
engine: engine, engine: engine,
options: { options: {
width: Math.min(document.body.clientWidth, 1024), width: Math.min(document.documentElement.clientWidth, 800),
height: Math.min(document.body.clientHeight, 1024), height: Math.min(document.documentElement.clientHeight, 600),
showAxes: true, showAxes: true,
showCollisions: true, showCollisions: true,
showConvexHulls: true showConvexHulls: true
@ -57,6 +52,8 @@ Example.manipulation = function() {
World.add(world, [bodyA, bodyB, bodyC, bodyD, bodyE, bodyF, bodyG, compound]); World.add(world, [bodyA, bodyB, bodyC, bodyD, bodyE, bodyF, bodyG, compound]);
World.add(world, [ World.add(world, [
// walls
Bodies.rectangle(400, 0, 800, 50, { isStatic: true }),
Bodies.rectangle(400, 600, 800, 50, { isStatic: true }), Bodies.rectangle(400, 600, 800, 50, { isStatic: true }),
Bodies.rectangle(800, 300, 50, 600, { isStatic: true }), Bodies.rectangle(800, 300, 50, 600, { isStatic: true }),
Bodies.rectangle(0, 300, 50, 600, { isStatic: true }) Bodies.rectangle(0, 300, 50, 600, { isStatic: true })
@ -125,7 +122,10 @@ Example.manipulation = function() {
render.mouse = mouse; render.mouse = mouse;
// fit the render viewport to the scene // fit the render viewport to the scene
Render.lookAt(render, Composite.allBodies(world)); Render.lookAt(render, {
min: { x: 0, y: 0 },
max: { x: 800, y: 600 }
});
// context for MatterTools.Demo // context for MatterTools.Demo
return { return {

16
examples/mixed.js
View file

@ -4,16 +4,11 @@ Example.mixed = function() {
var Engine = Matter.Engine, var Engine = Matter.Engine,
Render = Matter.Render, Render = Matter.Render,
Runner = Matter.Runner, Runner = Matter.Runner,
Body = Matter.Body,
Events = Matter.Events,
Composite = Matter.Composite,
Composites = Matter.Composites, Composites = Matter.Composites,
Common = Matter.Common, Common = Matter.Common,
Constraint = Matter.Constraint,
MouseConstraint = Matter.MouseConstraint, MouseConstraint = Matter.MouseConstraint,
Mouse = Matter.Mouse, Mouse = Matter.Mouse,
World = Matter.World, World = Matter.World,
Vertices = Matter.Vertices,
Bodies = Matter.Bodies; Bodies = Matter.Bodies;
// create engine // create engine
@ -25,8 +20,8 @@ Example.mixed = function() {
element: document.body, element: document.body,
engine: engine, engine: engine,
options: { options: {
width: Math.min(document.body.clientWidth, 1024), width: Math.min(document.documentElement.clientWidth, 800),
height: Math.min(document.body.clientHeight, 1024), height: Math.min(document.documentElement.clientHeight, 600),
showAngleIndicator: true showAngleIndicator: true
} }
}); });
@ -68,6 +63,8 @@ Example.mixed = function() {
World.add(world, stack); World.add(world, stack);
World.add(world, [ World.add(world, [
// walls
Bodies.rectangle(400, 0, 800, 50, { isStatic: true }),
Bodies.rectangle(400, 600, 800, 50, { isStatic: true }), Bodies.rectangle(400, 600, 800, 50, { isStatic: true }),
Bodies.rectangle(800, 300, 50, 600, { isStatic: true }), Bodies.rectangle(800, 300, 50, 600, { isStatic: true }),
Bodies.rectangle(0, 300, 50, 600, { isStatic: true }) Bodies.rectangle(0, 300, 50, 600, { isStatic: true })
@ -91,7 +88,10 @@ Example.mixed = function() {
render.mouse = mouse; render.mouse = mouse;
// fit the render viewport to the scene // fit the render viewport to the scene
Render.lookAt(render, Composite.allBodies(world)); Render.lookAt(render, {
min: { x: 0, y: 0 },
max: { x: 800, y: 600 }
});
// context for MatterTools.Demo // context for MatterTools.Demo
return { return {

14
examples/newtonsCradle.js
View file

@ -5,14 +5,10 @@ Example.newtonsCradle = function() {
Render = Matter.Render, Render = Matter.Render,
Runner = Matter.Runner, Runner = Matter.Runner,
Body = Matter.Body, Body = Matter.Body,
Composite = Matter.Composite,
Composites = Matter.Composites, Composites = Matter.Composites,
Common = Matter.Common,
Constraint = Matter.Constraint,
MouseConstraint = Matter.MouseConstraint, MouseConstraint = Matter.MouseConstraint,
Mouse = Matter.Mouse, Mouse = Matter.Mouse,
World = Matter.World, World = Matter.World;
Bodies = Matter.Bodies;
// create engine // create engine
var engine = Engine.create(), var engine = Engine.create(),
@ -23,8 +19,8 @@ Example.newtonsCradle = function() {
element: document.body, element: document.body,
engine: engine, engine: engine,
options: { options: {
width: Math.min(document.body.clientWidth, 1024), width: Math.min(document.documentElement.clientWidth, 800),
height: Math.min(document.body.clientHeight, 1024), height: Math.min(document.documentElement.clientHeight, 600),
showVelocity: true showVelocity: true
} }
}); });
@ -63,8 +59,8 @@ Example.newtonsCradle = function() {
// fit the render viewport to the scene // fit the render viewport to the scene
Render.lookAt(render, { Render.lookAt(render, {
min: { x: 0, y: 0 }, min: { x: 0, y: 50 },
max: { x: 800, y: 700 } max: { x: 800, y: 600 }
}); });
// context for MatterTools.Demo // context for MatterTools.Demo

19
examples/pyramid.js
View file

@ -4,11 +4,7 @@ Example.pyramid = function() {
var Engine = Matter.Engine, var Engine = Matter.Engine,
Render = Matter.Render, Render = Matter.Render,
Runner = Matter.Runner, Runner = Matter.Runner,
Body = Matter.Body,
Composite = Matter.Composite,
Composites = Matter.Composites, Composites = Matter.Composites,
Common = Matter.Common,
Constraint = Matter.Constraint,
MouseConstraint = Matter.MouseConstraint, MouseConstraint = Matter.MouseConstraint,
Mouse = Matter.Mouse, Mouse = Matter.Mouse,
World = Matter.World, World = Matter.World,
@ -23,8 +19,8 @@ Example.pyramid = function() {
element: document.body, element: document.body,
engine: engine, engine: engine,
options: { options: {
width: Math.min(document.body.clientWidth, 1024), width: Math.min(document.documentElement.clientWidth, 800),
height: Math.min(document.body.clientHeight, 1024), height: Math.min(document.documentElement.clientHeight, 600),
showAngleIndicator: true showAngleIndicator: true
} }
}); });
@ -42,7 +38,11 @@ Example.pyramid = function() {
World.add(world, [ World.add(world, [
stack, stack,
Bodies.rectangle(400, 620, 800, 50, { isStatic: true }) // walls
Bodies.rectangle(400, 0, 800, 50, { isStatic: true }),
Bodies.rectangle(800, 300, 50, 600, { isStatic: true }),
Bodies.rectangle(0, 300, 50, 600, { isStatic: true }),
Bodies.rectangle(400, 605, 800, 50, { isStatic: true })
]); ]);
// add mouse control // add mouse control
@ -63,7 +63,10 @@ Example.pyramid = function() {
render.mouse = mouse; render.mouse = mouse;
// fit the render viewport to the scene // fit the render viewport to the scene
Render.lookAt(render, Composite.allBodies(world)); Render.lookAt(render, {
min: { x: 0, y: 0 },
max: { x: 800, y: 600 }
});
// context for MatterTools.Demo // context for MatterTools.Demo
return { return {

15
examples/raycasting.js
View file

@ -4,12 +4,10 @@ Example.raycasting = function() {
var Engine = Matter.Engine, var Engine = Matter.Engine,
Render = Matter.Render, Render = Matter.Render,
Runner = Matter.Runner, Runner = Matter.Runner,
Body = Matter.Body,
Composite = Matter.Composite, Composite = Matter.Composite,
Composites = Matter.Composites, Composites = Matter.Composites,
Common = Matter.Common, Common = Matter.Common,
Query = Matter.Query, Query = Matter.Query,
Constraint = Matter.Constraint,
MouseConstraint = Matter.MouseConstraint, MouseConstraint = Matter.MouseConstraint,
Mouse = Matter.Mouse, Mouse = Matter.Mouse,
Events = Matter.Events, Events = Matter.Events,
@ -26,8 +24,8 @@ Example.raycasting = function() {
element: document.body, element: document.body,
engine: engine, engine: engine,
options: { options: {
width: Math.min(document.body.clientWidth, 1024), width: Math.min(document.documentElement.clientWidth, 800),
height: Math.min(document.body.clientHeight, 1024), height: Math.min(document.documentElement.clientHeight, 600),
showAngleIndicator: true showAngleIndicator: true
} }
}); });
@ -62,7 +60,9 @@ Example.raycasting = function() {
World.add(world, [ World.add(world, [
stack, stack,
concave, concave,
Bodies.rectangle(400, 600, 800, 50.5, { isStatic: true }), // walls
Bodies.rectangle(400, 0, 800, 50, { isStatic: true }),
Bodies.rectangle(400, 600, 800, 50, { isStatic: true }),
Bodies.rectangle(800, 300, 50, 600, { isStatic: true }), Bodies.rectangle(800, 300, 50, 600, { isStatic: true }),
Bodies.rectangle(0, 300, 50, 600, { isStatic: true }) Bodies.rectangle(0, 300, 50, 600, { isStatic: true })
]); ]);
@ -118,7 +118,10 @@ Example.raycasting = function() {
render.mouse = mouse; render.mouse = mouse;
// fit the render viewport to the scene // fit the render viewport to the scene
Render.lookAt(render, Composite.allBodies(world)); Render.lookAt(render, {
min: { x: 0, y: 0 },
max: { x: 800, y: 600 }
});
// context for MatterTools.Demo // context for MatterTools.Demo
return { return {

20
examples/restitution.js
View file

@ -4,11 +4,6 @@ Example.restitution = function() {
var Engine = Matter.Engine, var Engine = Matter.Engine,
Render = Matter.Render, Render = Matter.Render,
Runner = Matter.Runner, Runner = Matter.Runner,
Body = Matter.Body,
Composite = Matter.Composite,
Composites = Matter.Composites,
Common = Matter.Common,
Constraint = Matter.Constraint,
MouseConstraint = Matter.MouseConstraint, MouseConstraint = Matter.MouseConstraint,
Mouse = Matter.Mouse, Mouse = Matter.Mouse,
World = Matter.World, World = Matter.World,
@ -23,8 +18,8 @@ Example.restitution = function() {
element: document.body, element: document.body,
engine: engine, engine: engine,
options: { options: {
width: Math.min(document.body.clientWidth, 1024), width: Math.min(document.documentElement.clientWidth, 800),
height: Math.min(document.body.clientHeight, 1024), height: Math.min(document.documentElement.clientHeight, 600),
showAngleIndicator: true, showAngleIndicator: true,
showCollisions: true, showCollisions: true,
showVelocity: true showVelocity: true
@ -47,7 +42,11 @@ Example.restitution = function() {
Bodies.rectangle(100 + space * 2, 150, 50, 50, { restitution: rest, angle: -Math.PI * 0.25 }), Bodies.rectangle(100 + space * 2, 150, 50, 50, { restitution: rest, angle: -Math.PI * 0.25 }),
Bodies.circle(100 + space * 3, 150, 25, { restitution: rest }), Bodies.circle(100 + space * 3, 150, 25, { restitution: rest }),
Bodies.rectangle(100 + space * 5, 150, 180, 20, { restitution: rest, angle: -Math.PI * 0.5 }), Bodies.rectangle(100 + space * 5, 150, 180, 20, { restitution: rest, angle: -Math.PI * 0.5 }),
Bodies.rectangle(400, 620, 800, 50, { isStatic: true }) // walls
Bodies.rectangle(400, 0, 800, 50, { isStatic: true }),
Bodies.rectangle(400, 600, 800, 50, { isStatic: true }),
Bodies.rectangle(800, 300, 50, 600, { isStatic: true }),
Bodies.rectangle(0, 300, 50, 600, { isStatic: true })
]); ]);
// add mouse control // add mouse control
@ -68,7 +67,10 @@ Example.restitution = function() {
render.mouse = mouse; render.mouse = mouse;
// fit the render viewport to the scene // fit the render viewport to the scene
Render.lookAt(render, Composite.allBodies(world)); Render.lookAt(render, {
min: { x: 0, y: 0 },
max: { x: 800, y: 600 }
});
// context for MatterTools.Demo // context for MatterTools.Demo
return { return {

16
examples/rounded.js
View file

@ -4,9 +4,6 @@ Example.rounded = function() {
var Engine = Matter.Engine, var Engine = Matter.Engine,
Render = Matter.Render, Render = Matter.Render,
Runner = Matter.Runner, Runner = Matter.Runner,
Composite = Matter.Composite,
Composites = Matter.Composites,
Common = Matter.Common,
MouseConstraint = Matter.MouseConstraint, MouseConstraint = Matter.MouseConstraint,
Mouse = Matter.Mouse, Mouse = Matter.Mouse,
World = Matter.World, World = Matter.World,
@ -21,8 +18,8 @@ Example.rounded = function() {
element: document.body, element: document.body,
engine: engine, engine: engine,
options: { options: {
width: Math.min(document.body.clientWidth, 1024), width: Math.min(document.documentElement.clientWidth, 800),
height: Math.min(document.body.clientHeight, 1024), height: Math.min(document.documentElement.clientHeight, 600),
showAxes: true showAxes: true
} }
}); });
@ -35,7 +32,9 @@ Example.rounded = function() {
// add bodies // add bodies
World.add(world, [ World.add(world, [
Bodies.rectangle(400, 600, 800, 50.5, { isStatic: true }), // walls
Bodies.rectangle(400, 0, 800, 50, { isStatic: true }),
Bodies.rectangle(400, 600, 800, 50, { isStatic: true }),
Bodies.rectangle(800, 300, 50, 600, { isStatic: true }), Bodies.rectangle(800, 300, 50, 600, { isStatic: true }),
Bodies.rectangle(0, 300, 50, 600, { isStatic: true }) Bodies.rectangle(0, 300, 50, 600, { isStatic: true })
]); ]);
@ -92,7 +91,10 @@ Example.rounded = function() {
render.mouse = mouse; render.mouse = mouse;
// fit the render viewport to the scene // fit the render viewport to the scene
Render.lookAt(render, Composite.allBodies(world)); Render.lookAt(render, {
min: { x: 0, y: 0 },
max: { x: 800, y: 600 }
});
// context for MatterTools.Demo // context for MatterTools.Demo
return { return {

14
examples/sensors.js
View file

@ -4,12 +4,7 @@ Example.sensors = function() {
var Engine = Matter.Engine, var Engine = Matter.Engine,
Render = Matter.Render, Render = Matter.Render,
Runner = Matter.Runner, Runner = Matter.Runner,
Body = Matter.Body,
Composite = Matter.Composite,
Composites = Matter.Composites,
Common = Matter.Common,
Events = Matter.Events, Events = Matter.Events,
Constraint = Matter.Constraint,
MouseConstraint = Matter.MouseConstraint, MouseConstraint = Matter.MouseConstraint,
Mouse = Matter.Mouse, Mouse = Matter.Mouse,
World = Matter.World, World = Matter.World,
@ -24,8 +19,8 @@ Example.sensors = function() {
element: document.body, element: document.body,
engine: engine, engine: engine,
options: { options: {
width: Math.min(document.body.clientWidth, 1024), width: Math.min(document.documentElement.clientWidth, 800),
height: Math.min(document.body.clientHeight, 1024), height: Math.min(document.documentElement.clientHeight, 600),
wireframes: false, wireframes: false,
background: '#111' background: '#111'
} }
@ -115,7 +110,10 @@ Example.sensors = function() {
render.mouse = mouse; render.mouse = mouse;
// fit the render viewport to the scene // fit the render viewport to the scene
Render.lookAt(render, Composite.allBodies(world)); Render.lookAt(render, {
min: { x: 0, y: 0 },
max: { x: 800, y: 600 }
});
// context for MatterTools.Demo // context for MatterTools.Demo
return { return {

14
examples/sleeping.js
View file

@ -4,7 +4,6 @@ Example.sleeping = function() {
var Engine = Matter.Engine, var Engine = Matter.Engine,
Render = Matter.Render, Render = Matter.Render,
Runner = Matter.Runner, Runner = Matter.Runner,
Composite = Matter.Composite,
Composites = Matter.Composites, Composites = Matter.Composites,
Common = Matter.Common, Common = Matter.Common,
Events = Matter.Events, Events = Matter.Events,
@ -24,8 +23,8 @@ Example.sleeping = function() {
element: document.body, element: document.body,
engine: engine, engine: engine,
options: { options: {
width: Math.min(document.body.clientWidth, 1024), width: Math.min(document.documentElement.clientWidth, 800),
height: Math.min(document.body.clientHeight, 1024), height: Math.min(document.documentElement.clientHeight, 600),
showAngleIndicator: true showAngleIndicator: true
} }
}); });
@ -38,7 +37,9 @@ Example.sleeping = function() {
// add bodies // add bodies
World.add(world, [ World.add(world, [
Bodies.rectangle(400, 600, 800, 50.5, { isStatic: true }), // walls
Bodies.rectangle(400, 0, 800, 50, { isStatic: true }),
Bodies.rectangle(400, 600, 800, 50, { isStatic: true }),
Bodies.rectangle(800, 300, 50, 600, { isStatic: true }), Bodies.rectangle(800, 300, 50, 600, { isStatic: true }),
Bodies.rectangle(0, 300, 50, 600, { isStatic: true }) Bodies.rectangle(0, 300, 50, 600, { isStatic: true })
]); ]);
@ -86,7 +87,10 @@ Example.sleeping = function() {
render.mouse = mouse; render.mouse = mouse;
// fit the render viewport to the scene // fit the render viewport to the scene
Render.lookAt(render, Composite.allBodies(world)); Render.lookAt(render, {
min: { x: 0, y: 0 },
max: { x: 800, y: 600 }
});
// context for MatterTools.Demo // context for MatterTools.Demo
return { return {

7
examples/slingshot.js
View file

@ -4,11 +4,8 @@ Example.slingshot = function() {
var Engine = Matter.Engine, var Engine = Matter.Engine,
Render = Matter.Render, Render = Matter.Render,
Runner = Matter.Runner, Runner = Matter.Runner,
Body = Matter.Body,
Composite = Matter.Composite,
Composites = Matter.Composites, Composites = Matter.Composites,
Events = Matter.Events, Events = Matter.Events,
Common = Matter.Common,
Constraint = Matter.Constraint, Constraint = Matter.Constraint,
MouseConstraint = Matter.MouseConstraint, MouseConstraint = Matter.MouseConstraint,
Mouse = Matter.Mouse, Mouse = Matter.Mouse,
@ -24,8 +21,8 @@ Example.slingshot = function() {
element: document.body, element: document.body,
engine: engine, engine: engine,
options: { options: {
width: Math.min(document.body.clientWidth, 1024), width: Math.min(document.documentElement.clientWidth, 800),
height: Math.min(document.body.clientHeight, 1024), height: Math.min(document.documentElement.clientHeight, 600),
showAngleIndicator: true showAngleIndicator: true
} }
}); });

19
examples/softBody.js
View file

@ -4,11 +4,7 @@ Example.softBody = function() {
var Engine = Matter.Engine, var Engine = Matter.Engine,
Render = Matter.Render, Render = Matter.Render,
Runner = Matter.Runner, Runner = Matter.Runner,
Body = Matter.Body,
Composite = Matter.Composite,
Composites = Matter.Composites, Composites = Matter.Composites,
Common = Matter.Common,
Constraint = Matter.Constraint,
MouseConstraint = Matter.MouseConstraint, MouseConstraint = Matter.MouseConstraint,
Mouse = Matter.Mouse, Mouse = Matter.Mouse,
World = Matter.World, World = Matter.World,
@ -23,8 +19,8 @@ Example.softBody = function() {
element: document.body, element: document.body,
engine: engine, engine: engine,
options: { options: {
width: Math.min(document.body.clientWidth, 1024), width: Math.min(document.documentElement.clientWidth, 800),
height: Math.min(document.body.clientHeight, 1024), height: Math.min(document.documentElement.clientHeight, 600),
showAngleIndicator: false showAngleIndicator: false
} }
}); });
@ -46,7 +42,11 @@ Example.softBody = function() {
Composites.softBody(250, 100, 5, 5, 0, 0, true, 18, particleOptions), Composites.softBody(250, 100, 5, 5, 0, 0, true, 18, particleOptions),
Composites.softBody(400, 300, 8, 3, 0, 0, true, 15, particleOptions), Composites.softBody(400, 300, 8, 3, 0, 0, true, 15, particleOptions),
Composites.softBody(250, 400, 4, 4, 0, 0, true, 15, particleOptions), Composites.softBody(250, 400, 4, 4, 0, 0, true, 15, particleOptions),
Bodies.rectangle(400, 620, 800, 50, { isStatic: true }) // walls
Bodies.rectangle(400, 0, 800, 50, { isStatic: true }),
Bodies.rectangle(400, 600, 800, 50, { isStatic: true }),
Bodies.rectangle(800, 300, 50, 600, { isStatic: true }),
Bodies.rectangle(0, 300, 50, 600, { isStatic: true })
]); ]);
// add mouse control // add mouse control
@ -67,7 +67,10 @@ Example.softBody = function() {
render.mouse = mouse; render.mouse = mouse;
// fit the render viewport to the scene // fit the render viewport to the scene
Render.lookAt(render, Composite.allBodies(world)); Render.lookAt(render, {
min: { x: 0, y: 0 },
max: { x: 800, y: 600 }
});
// context for MatterTools.Demo // context for MatterTools.Demo
return { return {

5
examples/sprites.js
View file

@ -4,7 +4,6 @@ Example.sprites = function() {
var Engine = Matter.Engine, var Engine = Matter.Engine,
Render = Matter.Render, Render = Matter.Render,
Runner = Matter.Runner, Runner = Matter.Runner,
Composite = Matter.Composite,
Composites = Matter.Composites, Composites = Matter.Composites,
Common = Matter.Common, Common = Matter.Common,
MouseConstraint = Matter.MouseConstraint, MouseConstraint = Matter.MouseConstraint,
@ -21,8 +20,8 @@ Example.sprites = function() {
element: document.body, element: document.body,
engine: engine, engine: engine,
options: { options: {
width: Math.min(document.body.clientWidth, 1024), width: Math.min(document.documentElement.clientWidth, 800),
height: Math.min(document.body.clientHeight, 1024), height: Math.min(document.documentElement.clientHeight, 600),
background: '#0f0f13', background: '#0f0f13',
showAngleIndicator: false, showAngleIndicator: false,
wireframes: false wireframes: false

21
examples/stack.js
View file

@ -4,16 +4,10 @@ Example.stack = function() {
var Engine = Matter.Engine, var Engine = Matter.Engine,
Render = Matter.Render, Render = Matter.Render,
Runner = Matter.Runner, Runner = Matter.Runner,
Body = Matter.Body,
Events = Matter.Events,
Composite = Matter.Composite,
Composites = Matter.Composites, Composites = Matter.Composites,
Common = Matter.Common,
Constraint = Matter.Constraint,
MouseConstraint = Matter.MouseConstraint, MouseConstraint = Matter.MouseConstraint,
Mouse = Matter.Mouse, Mouse = Matter.Mouse,
World = Matter.World, World = Matter.World,
Vertices = Matter.Vertices,
Bodies = Matter.Bodies; Bodies = Matter.Bodies;
// create engine // create engine
@ -25,8 +19,8 @@ Example.stack = function() {
element: document.body, element: document.body,
engine: engine, engine: engine,
options: { options: {
width: Math.min(document.body.clientWidth, 1024), width: Math.min(document.documentElement.clientWidth, 800),
height: Math.min(document.body.clientHeight, 1024), height: Math.min(document.documentElement.clientHeight, 600),
showAngleIndicator: true showAngleIndicator: true
} }
}); });
@ -44,7 +38,11 @@ Example.stack = function() {
World.add(world, [ World.add(world, [
stack, stack,
Bodies.rectangle(400, 600, 800, 50.5, { isStatic: true }) // walls
Bodies.rectangle(400, 0, 800, 50, { isStatic: true }),
Bodies.rectangle(800, 300, 50, 600, { isStatic: true }),
Bodies.rectangle(0, 300, 50, 600, { isStatic: true }),
Bodies.rectangle(400, 606, 800, 50.5, { isStatic: true })
]); ]);
// add mouse control // add mouse control
@ -65,7 +63,10 @@ Example.stack = function() {
render.mouse = mouse; render.mouse = mouse;
// fit the render viewport to the scene // fit the render viewport to the scene
Render.lookAt(render, Composite.allBodies(world)); Render.lookAt(render, {
min: { x: 0, y: 0 },
max: { x: 800, y: 600 }
});
// context for MatterTools.Demo // context for MatterTools.Demo
return { return {

17
examples/staticFriction.js
View file

@ -5,10 +5,7 @@ Example.staticFriction = function() {
Render = Matter.Render, Render = Matter.Render,
Runner = Matter.Runner, Runner = Matter.Runner,
Body = Matter.Body, Body = Matter.Body,
Composite = Matter.Composite,
Composites = Matter.Composites, Composites = Matter.Composites,
Common = Matter.Common,
Constraint = Matter.Constraint,
Events = Matter.Events, Events = Matter.Events,
MouseConstraint = Matter.MouseConstraint, MouseConstraint = Matter.MouseConstraint,
Mouse = Matter.Mouse, Mouse = Matter.Mouse,
@ -24,8 +21,8 @@ Example.staticFriction = function() {
element: document.body, element: document.body,
engine: engine, engine: engine,
options: { options: {
width: Math.min(document.body.clientWidth, 1024), width: Math.min(document.documentElement.clientWidth, 800),
height: Math.min(document.body.clientHeight, 1024), height: Math.min(document.documentElement.clientHeight, 600),
showVelocity: true showVelocity: true
} }
}); });
@ -49,7 +46,15 @@ Example.staticFriction = function() {
}); });
}); });
World.add(world, [body, stack]); World.add(world, [
body,
stack,
// walls
Bodies.rectangle(400, 0, 800, 50, { isStatic: true }),
Bodies.rectangle(400, 600, 800, 50, { isStatic: true }),
Bodies.rectangle(800, 300, 50, 600, { isStatic: true }),
Bodies.rectangle(0, 300, 50, 600, { isStatic: true })
]);
Events.on(engine, 'beforeUpdate', function(event) { Events.on(engine, 'beforeUpdate', function(event) {
counter += 0.014; counter += 0.014;

15
examples/stress.js
View file

@ -4,16 +4,10 @@ Example.stress = function() {
var Engine = Matter.Engine, var Engine = Matter.Engine,
Render = Matter.Render, Render = Matter.Render,
Runner = Matter.Runner, Runner = Matter.Runner,
Body = Matter.Body,
Events = Matter.Events,
Composite = Matter.Composite,
Composites = Matter.Composites, Composites = Matter.Composites,
Common = Matter.Common,
Constraint = Matter.Constraint,
MouseConstraint = Matter.MouseConstraint, MouseConstraint = Matter.MouseConstraint,
Mouse = Matter.Mouse, Mouse = Matter.Mouse,
World = Matter.World, World = Matter.World,
Vertices = Matter.Vertices,
Bodies = Matter.Bodies; Bodies = Matter.Bodies;
// create engine // create engine
@ -25,8 +19,8 @@ Example.stress = function() {
element: document.body, element: document.body,
engine: engine, engine: engine,
options: { options: {
width: Math.min(document.body.clientWidth, 1024), width: Math.min(document.documentElement.clientWidth, 800),
height: Math.min(document.body.clientHeight, 1024) height: Math.min(document.documentElement.clientHeight, 600)
} }
}); });
@ -67,7 +61,10 @@ Example.stress = function() {
render.mouse = mouse; render.mouse = mouse;
// fit the render viewport to the scene // fit the render viewport to the scene
Render.lookAt(render, Composite.allBodies(world)); Render.lookAt(render, {
min: { x: 0, y: 0 },
max: { x: 800, y: 600 }
});
// context for MatterTools.Demo // context for MatterTools.Demo
return { return {

17
examples/stress2.js
View file

@ -1,17 +1,13 @@
var Example = Example || {};
Example.stress2 = function() { Example.stress2 = function() {
var Engine = Matter.Engine, var Engine = Matter.Engine,
Render = Matter.Render, Render = Matter.Render,
Runner = Matter.Runner, Runner = Matter.Runner,
Body = Matter.Body,
Events = Matter.Events,
Composite = Matter.Composite,
Composites = Matter.Composites, Composites = Matter.Composites,
Common = Matter.Common,
Constraint = Matter.Constraint,
MouseConstraint = Matter.MouseConstraint, MouseConstraint = Matter.MouseConstraint,
Mouse = Matter.Mouse, Mouse = Matter.Mouse,
World = Matter.World, World = Matter.World,
Vertices = Matter.Vertices,
Bodies = Matter.Bodies; Bodies = Matter.Bodies;
// create engine // create engine
@ -23,8 +19,8 @@ Example.stress2 = function() {
element: document.body, element: document.body,
engine: engine, engine: engine,
options: { options: {
width: Math.min(document.body.clientWidth, 1024), width: Math.min(document.documentElement.clientWidth, 800),
height: Math.min(document.body.clientHeight, 1024) height: Math.min(document.documentElement.clientHeight, 600)
} }
}); });
@ -65,7 +61,10 @@ Example.stress2 = function() {
render.mouse = mouse; render.mouse = mouse;
// fit the render viewport to the scene // fit the render viewport to the scene
Render.lookAt(render, Composite.allBodies(world)); Render.lookAt(render, {
min: { x: 0, y: 0 },
max: { x: 800, y: 600 }
});
// context for MatterTools.Demo // context for MatterTools.Demo
return { return {

14
examples/svg.js
View file

@ -4,12 +4,7 @@ Example.svg = function() {
var Engine = Matter.Engine, var Engine = Matter.Engine,
Render = Matter.Render, Render = Matter.Render,
Runner = Matter.Runner, Runner = Matter.Runner,
Body = Matter.Body,
Events = Matter.Events,
Composite = Matter.Composite,
Composites = Matter.Composites,
Common = Matter.Common, Common = Matter.Common,
Constraint = Matter.Constraint,
MouseConstraint = Matter.MouseConstraint, MouseConstraint = Matter.MouseConstraint,
Mouse = Matter.Mouse, Mouse = Matter.Mouse,
World = Matter.World, World = Matter.World,
@ -26,8 +21,8 @@ Example.svg = function() {
element: document.body, element: document.body,
engine: engine, engine: engine,
options: { options: {
width: Math.min(document.body.clientWidth, 1024), width: Math.min(document.documentElement.clientWidth, 800),
height: Math.min(document.body.clientHeight, 1024) height: Math.min(document.documentElement.clientHeight, 600)
} }
}); });
@ -107,7 +102,10 @@ Example.svg = function() {
render.mouse = mouse; render.mouse = mouse;
// fit the render viewport to the scene // fit the render viewport to the scene
Render.lookAt(render, Composite.allBodies(world)); Render.lookAt(render, {
min: { x: 0, y: 0 },
max: { x: 800, y: 600 }
});
// context for MatterTools.Demo // context for MatterTools.Demo
return { return {

9
examples/terrain.js
View file

@ -4,16 +4,11 @@ Example.terrain = function() {
var Engine = Matter.Engine, var Engine = Matter.Engine,
Render = Matter.Render, Render = Matter.Render,
Runner = Matter.Runner, Runner = Matter.Runner,
Body = Matter.Body,
Events = Matter.Events,
Composite = Matter.Composite,
Composites = Matter.Composites, Composites = Matter.Composites,
Common = Matter.Common, Common = Matter.Common,
Constraint = Matter.Constraint,
MouseConstraint = Matter.MouseConstraint, MouseConstraint = Matter.MouseConstraint,
Mouse = Matter.Mouse, Mouse = Matter.Mouse,
World = Matter.World, World = Matter.World,
Vertices = Matter.Vertices,
Query = Matter.Query, Query = Matter.Query,
Svg = Matter.Svg, Svg = Matter.Svg,
Bodies = Matter.Bodies; Bodies = Matter.Bodies;
@ -27,8 +22,8 @@ Example.terrain = function() {
element: document.body, element: document.body,
engine: engine, engine: engine,
options: { options: {
width: Math.min(document.body.clientWidth, 1024), width: Math.min(document.documentElement.clientWidth, 800),
height: Math.min(document.body.clientHeight, 1024) height: Math.min(document.documentElement.clientHeight, 600)
} }
}); });

8
examples/timescale.js
View file

@ -9,13 +9,9 @@ Example.timescale = function() {
Composite = Matter.Composite, Composite = Matter.Composite,
Composites = Matter.Composites, Composites = Matter.Composites,
Common = Matter.Common, Common = Matter.Common,
Constraint = Matter.Constraint,
MouseConstraint = Matter.MouseConstraint, MouseConstraint = Matter.MouseConstraint,
Mouse = Matter.Mouse, Mouse = Matter.Mouse,
World = Matter.World, World = Matter.World,
Vertices = Matter.Vertices,
Query = Matter.Query,
Svg = Matter.Svg,
Bodies = Matter.Bodies; Bodies = Matter.Bodies;
// create engine // create engine
@ -27,8 +23,8 @@ Example.timescale = function() {
element: document.body, element: document.body,
engine: engine, engine: engine,
options: { options: {
width: Math.min(document.body.clientWidth, 1024), width: Math.min(document.documentElement.clientWidth, 800),
height: Math.min(document.body.clientHeight, 1024), height: Math.min(document.documentElement.clientHeight, 600),
showAngleIndicator: true showAngleIndicator: true
} }
}); });

10
examples/views.js
View file

@ -4,16 +4,12 @@ Example.views = function() {
var Engine = Matter.Engine, var Engine = Matter.Engine,
Render = Matter.Render, Render = Matter.Render,
Runner = Matter.Runner, Runner = Matter.Runner,
Body = Matter.Body,
Events = Matter.Events, Events = Matter.Events,
Composite = Matter.Composite,
Composites = Matter.Composites, Composites = Matter.Composites,
Common = Matter.Common, Common = Matter.Common,
Constraint = Matter.Constraint,
MouseConstraint = Matter.MouseConstraint, MouseConstraint = Matter.MouseConstraint,
Mouse = Matter.Mouse, Mouse = Matter.Mouse,
World = Matter.World, World = Matter.World,
Vertices = Matter.Vertices,
Vector = Matter.Vector, Vector = Matter.Vector,
Bounds = Matter.Bounds, Bounds = Matter.Bounds,
Bodies = Matter.Bodies; Bodies = Matter.Bodies;
@ -27,8 +23,8 @@ Example.views = function() {
element: document.body, element: document.body,
engine: engine, engine: engine,
options: { options: {
width: Math.min(document.body.clientWidth, 1024), width: Math.min(document.documentElement.clientWidth, 800),
height: Math.min(document.body.clientHeight, 1024), height: Math.min(document.documentElement.clientHeight, 600),
hasBounds: true, hasBounds: true,
showAngleIndicator: true showAngleIndicator: true
} }
@ -77,6 +73,8 @@ Example.views = function() {
World.add(world, [ World.add(world, [
stack, stack,
// walls
Bodies.rectangle(400, 0, 800, 50, { isStatic: true }),
Bodies.rectangle(400, 600, 800, 50, { isStatic: true }), Bodies.rectangle(400, 600, 800, 50, { isStatic: true }),
Bodies.rectangle(800, 300, 50, 600, { isStatic: true }), Bodies.rectangle(800, 300, 50, 600, { isStatic: true }),
Bodies.rectangle(0, 300, 50, 600, { isStatic: true }) Bodies.rectangle(0, 300, 50, 600, { isStatic: true })

1
examples/wrapPlugin.js
View file

@ -1,7 +1,6 @@
(function() { (function() {
var Body = Matter.Body, var Body = Matter.Body,
Common = Matter.Common,
Composite = Matter.Composite; Composite = Matter.Composite;
var MatterWrap = { var MatterWrap = {

17
examples/wreckingBall.js
View file

@ -4,9 +4,7 @@ Example.wreckingBall = function() {
var Engine = Matter.Engine, var Engine = Matter.Engine,
Render = Matter.Render, Render = Matter.Render,
Runner = Matter.Runner, Runner = Matter.Runner,
Composite = Matter.Composite,
Composites = Matter.Composites, Composites = Matter.Composites,
Common = Matter.Common,
MouseConstraint = Matter.MouseConstraint, MouseConstraint = Matter.MouseConstraint,
Mouse = Matter.Mouse, Mouse = Matter.Mouse,
World = Matter.World, World = Matter.World,
@ -22,8 +20,8 @@ Example.wreckingBall = function() {
element: document.body, element: document.body,
engine: engine, engine: engine,
options: { options: {
width: Math.min(document.body.clientWidth, 1024), width: Math.min(document.documentElement.clientWidth, 800),
height: Math.min(document.body.clientHeight, 1024), height: Math.min(document.documentElement.clientHeight, 600),
showAngleIndicator: true showAngleIndicator: true
} }
}); });
@ -44,7 +42,11 @@ Example.wreckingBall = function() {
World.add(world, [ World.add(world, [
stack, stack,
Bodies.rectangle(400, 600, 800, 50.5, { isStatic: true }) // walls
Bodies.rectangle(400, 0, 800, 50, { isStatic: true }),
Bodies.rectangle(400, 600, 800, 50, { isStatic: true }),
Bodies.rectangle(800, 300, 50, 600, { isStatic: true }),
Bodies.rectangle(0, 300, 50, 600, { isStatic: true })
]); ]);
var ball = Bodies.circle(100, 400, 50, { density: 0.04, frictionAir: 0.005}); var ball = Bodies.circle(100, 400, 50, { density: 0.04, frictionAir: 0.005});
@ -73,7 +75,10 @@ Example.wreckingBall = function() {
render.mouse = mouse; render.mouse = mouse;
// fit the render viewport to the scene // fit the render viewport to the scene
Render.lookAt(render, Composite.allBodies(world)); Render.lookAt(render, {
min: { x: 0, y: 0 },
max: { x: 800, y: 600 }
});
// context for MatterTools.Demo // context for MatterTools.Demo
return { return {