summaryrefslogtreecommitdiff
path: root/src
diff options
context:
space:
mode:
Diffstat (limited to 'src')
-rw-r--r--src/index.html5
-rw-r--r--src/index.js22
2 files changed, 19 insertions, 8 deletions
diff --git a/src/index.html b/src/index.html
index aa49141..da667a9 100644
--- a/src/index.html
+++ b/src/index.html
@@ -3,7 +3,7 @@
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
- <title>Document</title>
+ <title>Throw</title>
<script type="module" src="index.js"></script>
<style>
html,
@@ -14,8 +14,9 @@
div#throwable {
position: fixed;
transform: translate(-50%, -50%);
- background-color: red;
border-radius: 50%;
+ background-color: black;
+ background-size: cover;
}
</style>
</head>
diff --git a/src/index.js b/src/index.js
index 1275360..e07ac8a 100644
--- a/src/index.js
+++ b/src/index.js
@@ -1,5 +1,13 @@
import RAPIER from "./rapier.es.js";
+const objElement = document.querySelector("div#throwable");
+
+const queryParams = new URLSearchParams(window.location.search);
+const image = queryParams.get("image");
+if (image !== null) {
+ objElement.style.backgroundImage = `url(${decodeURI(image)})`;
+}
+
RAPIER.init().then(() => {
const CLICK_IMPULSE_MULTIPLIER = 300_000;
const GRAVITY = { x: 0.0, y: 2000 };
@@ -36,7 +44,6 @@ RAPIER.init().then(() => {
obj,
);
- const objElement = document.querySelector("div#throwable");
const objSize = {
x: OBJ_BASE_SIZE.x,
y: OBJ_BASE_SIZE.y,
@@ -81,12 +88,15 @@ RAPIER.init().then(() => {
y: clickPosition.y - objPosition.y,
};
const distance = Math.sqrt(direction.x ** 2 + direction.y ** 2);
- obj.setLinvel({x: 0, y: 0});
+ obj.setLinvel({ x: 0, y: 0 });
if (distance > 0) {
- obj.applyImpulse({
- x: (direction.x * CLICK_IMPULSE_MULTIPLIER) / distance,
- y: (direction.y * CLICK_IMPULSE_MULTIPLIER) / distance,
- });
+ obj.applyImpulse(
+ {
+ x: (direction.x * CLICK_IMPULSE_MULTIPLIER) / distance,
+ y: (direction.y * CLICK_IMPULSE_MULTIPLIER) / distance,
+ },
+ true,
+ );
}
});