feat: show kaboom as index page
This commit is contained in:
parent
6bd30e7e83
commit
72e6dd30ae
11 changed files with 207 additions and 3 deletions
2
.gitignore
vendored
2
.gitignore
vendored
|
@ -6,6 +6,8 @@ api.sock
|
|||
*swp
|
||||
*swo
|
||||
|
||||
# web
|
||||
node_modules/
|
||||
|
||||
# Byte-compiled / optimized / DLL files
|
||||
__pycache__/
|
||||
|
|
5
api.py
5
api.py
|
@ -1,10 +1,9 @@
|
|||
from flask import Flask
|
||||
|
||||
from flask import Flask, render_template
|
||||
app = Flask(__name__)
|
||||
|
||||
@app.route('/')
|
||||
def home():
|
||||
return '<h1>Hey yo!</h1>'
|
||||
return render_template('index.html')
|
||||
|
||||
if __name__ == '__main__':
|
||||
app.run(host='0.0.0.0')
|
||||
|
|
24
static/LICENSE
Normal file
24
static/LICENSE
Normal file
|
@ -0,0 +1,24 @@
|
|||
BSD 2-Clause License
|
||||
|
||||
Copyright (c) 2023, Ayo Ayco
|
||||
|
||||
Redistribution and use in source and binary forms, with or without
|
||||
modification, are permitted provided that the following conditions are met:
|
||||
|
||||
1. Redistributions of source code must retain the above copyright notice, this
|
||||
list of conditions and the following disclaimer.
|
||||
|
||||
2. Redistributions in binary form must reproduce the above copyright notice,
|
||||
this list of conditions and the following disclaimer in the documentation
|
||||
and/or other materials provided with the distribution.
|
||||
|
||||
THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS"
|
||||
AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE
|
||||
IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE
|
||||
DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT HOLDER OR CONTRIBUTORS BE LIABLE
|
||||
FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL
|
||||
DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR
|
||||
SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER
|
||||
CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY,
|
||||
OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
|
||||
OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
|
3
static/README.md
Normal file
3
static/README.md
Normal file
|
@ -0,0 +1,3 @@
|
|||
# A crazy invention by Kahel and Ayo
|
||||
|
||||

|
26
static/index.html
Normal file
26
static/index.html
Normal file
|
@ -0,0 +1,26 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Twists and Shapes and Turns</title>
|
||||
<style>
|
||||
html,
|
||||
body {
|
||||
background: black;
|
||||
color: white;
|
||||
}
|
||||
</style>
|
||||
<script src="./node_modules/matter-js/build/matter.min.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<h1>Hello Kahel!</h1>
|
||||
<button onclick="kaboom()">Kaboom!</button>
|
||||
<button onclick="addShape()">Add Shape!</button>
|
||||
<button onclick="clearTheWorld()">Clear the world!</button>
|
||||
<hr />
|
||||
<br />
|
||||
<div id="canvas"></div>
|
||||
<script src="index.js"></script>
|
||||
</body>
|
||||
</html>
|
80
static/index.js
Normal file
80
static/index.js
Normal file
|
@ -0,0 +1,80 @@
|
|||
// module aliases
|
||||
let { Engine, Render, Runner, Bodies, Composite } = Matter;
|
||||
|
||||
// create an engine
|
||||
let engine = Engine.create({
|
||||
timing: {
|
||||
timeScale: 0.3,
|
||||
},
|
||||
});
|
||||
|
||||
const width = window.innerWidth > 0 ? window.innerWidth : screen.width;
|
||||
const height = window.innerHeight > 0 ? window.innerHeight : screen.height;
|
||||
|
||||
// create runner
|
||||
let runner = Runner.create();
|
||||
let ground = Bodies.rectangle(width / 2, height - 300, width / 2, 60, {
|
||||
isStatic: true,
|
||||
});
|
||||
|
||||
// create a renderer
|
||||
let render = Render.create({
|
||||
element: document.getElementById("canvas"),
|
||||
engine: engine,
|
||||
options: {
|
||||
width: width - 18,
|
||||
height: height - 150,
|
||||
},
|
||||
});
|
||||
|
||||
generateWorld();
|
||||
|
||||
function clearTheWorld() {
|
||||
Composite.clear(engine.world);
|
||||
Composite.add(engine.world, ground);
|
||||
}
|
||||
|
||||
function kaboom() {
|
||||
let manyShapes = new Array(50)
|
||||
.fill()
|
||||
.map(() =>
|
||||
Bodies.polygon(
|
||||
Math.random() * 1 + width / 2,
|
||||
Math.random() * 450 + 1,
|
||||
Math.random() * 16 + 1,
|
||||
Math.random() * 80 + 1
|
||||
)
|
||||
);
|
||||
|
||||
// add all of the bodies to the world
|
||||
Composite.add(engine.world, manyShapes);
|
||||
|
||||
// run the engine
|
||||
Runner.run(runner, engine);
|
||||
}
|
||||
|
||||
function addShape() {
|
||||
// to be continued
|
||||
// let oneShape = Bodies.circle(80, 80, 80);
|
||||
let oneShape = Bodies.polygon(
|
||||
// Math.random() * (width / 2) + 1,
|
||||
width / 2,
|
||||
0,
|
||||
Math.random() * 12 + 1,
|
||||
Math.random() * 150 + 100
|
||||
);
|
||||
Composite.add(engine.world, oneShape);
|
||||
|
||||
// run the engine
|
||||
Runner.run(runner, engine);
|
||||
}
|
||||
|
||||
function generateWorld() {
|
||||
Composite.add(engine.world, ground);
|
||||
|
||||
// run the renderer
|
||||
Render.run(render);
|
||||
|
||||
// run the engine
|
||||
Runner.run(runner, engine);
|
||||
}
|
BIN
static/kaboom.gif
Normal file
BIN
static/kaboom.gif
Normal file
Binary file not shown.
After Width: | Height: | Size: 977 KiB |
28
static/package-lock.json
generated
Normal file
28
static/package-lock.json
generated
Normal file
|
@ -0,0 +1,28 @@
|
|||
{
|
||||
"name": "twists-and-shapes-and-turns",
|
||||
"version": "0.0.1",
|
||||
"lockfileVersion": 2,
|
||||
"requires": true,
|
||||
"packages": {
|
||||
"": {
|
||||
"name": "twists-and-shapes-and-turns",
|
||||
"version": "0.0.1",
|
||||
"license": "ISC",
|
||||
"dependencies": {
|
||||
"matter-js": "^0.18.0"
|
||||
}
|
||||
},
|
||||
"node_modules/matter-js": {
|
||||
"version": "0.18.0",
|
||||
"resolved": "https://registry.npmjs.org/matter-js/-/matter-js-0.18.0.tgz",
|
||||
"integrity": "sha512-/ZVem4WygUnbmo/iE4oHZpZS97btfBtYy5Iwn1396vUZU7YhgVEN8J4UWwfZwY1ZqoTYlPgjvSw9WXauuXL0mg=="
|
||||
}
|
||||
},
|
||||
"dependencies": {
|
||||
"matter-js": {
|
||||
"version": "0.18.0",
|
||||
"resolved": "https://registry.npmjs.org/matter-js/-/matter-js-0.18.0.tgz",
|
||||
"integrity": "sha512-/ZVem4WygUnbmo/iE4oHZpZS97btfBtYy5Iwn1396vUZU7YhgVEN8J4UWwfZwY1ZqoTYlPgjvSw9WXauuXL0mg=="
|
||||
}
|
||||
}
|
||||
}
|
16
static/package.json
Normal file
16
static/package.json
Normal file
|
@ -0,0 +1,16 @@
|
|||
{
|
||||
"name": "twists-and-shapes-and-turns",
|
||||
"version": "0.0.1",
|
||||
"description": "This is a game about crazy inventions",
|
||||
"main": "index.js",
|
||||
"scripts": {
|
||||
"start": "npx http-server .",
|
||||
"test": "echo \"Error: no test specified\" && exit 1",
|
||||
"deploy": "scp -r . ayo@ayco.io:~/kaboom/"
|
||||
},
|
||||
"author": "Ayo and Kahel",
|
||||
"license": "ISC",
|
||||
"dependencies": {
|
||||
"matter-js": "^0.18.0"
|
||||
}
|
||||
}
|
BIN
static/screenshot.png
Normal file
BIN
static/screenshot.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 238 KiB |
26
templates/index.html
Normal file
26
templates/index.html
Normal file
|
@ -0,0 +1,26 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Twists and Shapes and Turns</title>
|
||||
<style>
|
||||
html,
|
||||
body {
|
||||
background: black;
|
||||
color: white;
|
||||
}
|
||||
</style>
|
||||
<script src="./node_modules/matter-js/build/matter.min.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<h1>Hello Kahel!</h1>
|
||||
<button onclick="kaboom()">Kaboom!</button>
|
||||
<button onclick="addShape()">Add Shape!</button>
|
||||
<button onclick="clearTheWorld()">Clear the world!</button>
|
||||
<hr />
|
||||
<br />
|
||||
<div id="canvas"></div>
|
||||
<script src="index.js"></script>
|
||||
</body>
|
||||
</html>
|
Loading…
Reference in a new issue