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
|
*swp
|
||||||
*swo
|
*swo
|
||||||
|
|
||||||
|
# web
|
||||||
|
node_modules/
|
||||||
|
|
||||||
# Byte-compiled / optimized / DLL files
|
# Byte-compiled / optimized / DLL files
|
||||||
__pycache__/
|
__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 = Flask(__name__)
|
||||||
|
|
||||||
@app.route('/')
|
@app.route('/')
|
||||||
def home():
|
def home():
|
||||||
return '<h1>Hey yo!</h1>'
|
return render_template('index.html')
|
||||||
|
|
||||||
if __name__ == '__main__':
|
if __name__ == '__main__':
|
||||||
app.run(host='0.0.0.0')
|
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