fun with matter.js

alessandro-gentilini · Dec 1, 2024 · 99c4270 · 99c4270
1 parent 9181c5d
commit 99c4270
Show file tree

Hide file tree

Showing 2 changed files with 11,487 additions and 0 deletions.
diff --git a/geo/matter-js/first_light.html b/geo/matter-js/first_light.html
@@ -0,0 +1,107 @@
+<!DOCTYPE html>
+
+<html lang="en">
+
+<head>
+
+    <!--meta charset="UTF-8">
+
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+
+    <title>Matter.js Example</title>
+
+    <style>
+
+        body {
+
+            margin: 0;
+
+            overflow: hidden;
+
+        }
+
+        canvas {
+
+            display: block;
+
+        }
+
+    </style-->
+
+</head>
+
+<body>
+
+    <script src="matter.js"></script>
+
+    <script>
+
+// module aliases
+
+var Engine = Matter.Engine,
+
+    Render = Matter.Render,
+
+    Runner = Matter.Runner,
+
+    Bodies = Matter.Bodies,
+
+    Composite = Matter.Composite;
+
+
+
+// create an engine
+
+var engine = Engine.create();
+
+
+
+// create a renderer
+
+var render = Render.create({
+
+    element: document.body,
+
+    engine: engine
+
+});
+
+
+
+// create two boxes and a ground
+
+var boxA = Bodies.rectangle(400, 200, 80, 80);
+
+var boxB = Bodies.rectangle(450, 50, 80, 80);
+
+var ground = Bodies.rectangle(400, 610, 810, 60, { isStatic: true });
+
+
+
+// add all of the bodies to the world
+
+Composite.add(engine.world, [boxA, boxB, ground]);
+
+
+
+// run the renderer
+
+Render.run(render);
+
+
+
+// create runner
+
+var runner = Runner.create();
+
+
+
+// run the engine
+
+Runner.run(runner, engine);
+
+    </script>
+
+</body>
+
+</html>