From 54455094ef735249067460dc24cdf359751755fa Mon Sep 17 00:00:00 2001
From: TheJoeCoder <joe@radialbog9.uk>
Date: Mon, 5 Aug 2024 12:46:46 +0100
Subject: [PATCH] Prep for changing velocities
---
static/js/background_anim.js | 31 +++++++++++++++++++++++++++----
1 file changed, 27 insertions(+), 4 deletions(-)
diff --git a/static/js/background_anim.js b/static/js/background_anim.js
index b6237bc..2a6061b 100644
--- a/static/js/background_anim.js
+++ b/static/js/background_anim.js
@@ -2,7 +2,8 @@
const FPS = 60;
const DOTS_NUM_VALUES = [100, 75];
-const VELOCITY_MAX_VALUES = [25, 15];
+const INITIAL_VELOCITY_MAX_VALUES = [25, 15];
+const VELOCITY_MAX_VALUES = [40, 30];
const RADIUS_MIN_VALUES = [2, 0.5];
const RADIUS_MAX_VALUES = [6, 2];
const LINE_DISTANCE_MAX_VALUES = [120, 55];
@@ -18,7 +19,8 @@ const LINE_COLOUR = "#777";
// Sort-of constants (change with window size)
let DOTS_NUM = 100;
-let VELOCITY_MAX = 25;
+let INITIAL_VELOCITY_MAX = 25;
+let VELOCITY_MAX = 40;
let RADIUS_MIN = 1;
let RADIUS_MAX = 4;
@@ -33,7 +35,9 @@ class Dot {
this._y = y;
this._radius = radius;
this._vx = vx;
+ this._initial_vx = vx;
this._vy = vy;
+ this._initial_vy = vy;
}
get x() {
@@ -60,12 +64,18 @@ class Dot {
set vx(value) {
this._vx = value;
}
+ get initial_vx() {
+ return this._initial_vx
+ }
get vy() {
return this._vy;
}
set vy(value) {
this._vy = value;
}
+ get initial_vy() {
+ return this._initial_vy;
+ }
}
const randInt = (min, max) => {
@@ -100,6 +110,7 @@ const setDisplayParameters = () => {
// Set properties
DOTS_NUM = DOTS_NUM_VALUES[index];
+ INITIAL_VELOCITY_MAX = INITIAL_VELOCITY_MAX_VALUES[index];
VELOCITY_MAX = VELOCITY_MAX_VALUES[index];
RADIUS_MIN = RADIUS_MIN_VALUES[index];
RADIUS_MAX = RADIUS_MAX_VALUES[index];
@@ -119,8 +130,8 @@ for (let i = 0; i < DOTS_NUM; i++) {
Math.random() * canvas.width, // position x
Math.random() * canvas.height, // position y
randInt(RADIUS_MIN, RADIUS_MAX), // radius
- randInt(-VELOCITY_MAX, VELOCITY_MAX), // velocity x
- randInt(-VELOCITY_MAX, VELOCITY_MAX) // velocity y
+ randInt(-INITIAL_VELOCITY_MAX, INITIAL_VELOCITY_MAX), // velocity x
+ randInt(-INITIAL_VELOCITY_MAX, INITIAL_VELOCITY_MAX) // velocity y
));
}
@@ -196,6 +207,18 @@ const physics = () => {
dot.x += dot.vx / FPS;
dot.y += dot.vy / FPS;
+ // Clamp velocities to maximum
+ dot.vx = clamp(dot.vx, -VELOCITY_MAX, VELOCITY_MAX);
+ dot.vy = clamp(dot.vy, -VELOCITY_MAX, VELOCITY_MAX);
+
+ // Stop velocity from going below initial velocity
+ if(dot.vx < dot.initial_vx) {
+ dot.vx = dot.initial_vx;
+ }
+ if(dot.vy < dot.initial_vy) {
+ dot.vy = dot.initial_vy;
+ }
+
// Invert velocities if off-screen and not already inverted
if ((dot.x < 0 && dot.vx < 0) || (dot.x > canvas.width && dot.vx > 0)) {
dot.vx = -dot.vx;
--
GitLab