From c1205029a688a4d8b2df4103c6ad8beca68ed224 Mon Sep 17 00:00:00 2001
From: Hoang Tran <99.hoangtran@gmail.com>
Date: Wed, 19 Oct 2022 23:25:08 -0700
Subject: [PATCH] demo p5js core logic (WIP)
---
client-p5js/index.html | 17 ++++++
client-p5js/main.js | 0
core/README.md | 1 +
core/index.js | 0
demo/index.html | 27 +++++++++
demo/index.js | 5 ++
demo/js/GameObject/GameObject.js | 42 ++++++++++++++
demo/js/sketch.js | 11 ++++
demo/js/utils/Vec2.js | 99 ++++++++++++++++++++++++++++++++
demo/js/utils/Vector.js | 96 +++++++++++++++++++++++++++++++
10 files changed, 298 insertions(+)
create mode 100644 client-p5js/index.html
create mode 100644 client-p5js/main.js
create mode 100644 core/README.md
create mode 100644 core/index.js
create mode 100644 demo/index.html
create mode 100644 demo/index.js
create mode 100644 demo/js/GameObject/GameObject.js
create mode 100644 demo/js/sketch.js
create mode 100644 demo/js/utils/Vec2.js
create mode 100644 demo/js/utils/Vector.js
diff --git a/client-p5js/index.html b/client-p5js/index.html
new file mode 100644
index 0000000..291083f
--- /dev/null
+++ b/client-p5js/index.html
@@ -0,0 +1,17 @@
+
+
+
+
+
+
+
+ LOL2D
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/client-p5js/main.js b/client-p5js/main.js
new file mode 100644
index 0000000..e69de29
diff --git a/core/README.md b/core/README.md
new file mode 100644
index 0000000..5aa6cf1
--- /dev/null
+++ b/core/README.md
@@ -0,0 +1 @@
+Core here
diff --git a/core/index.js b/core/index.js
new file mode 100644
index 0000000..e69de29
diff --git a/demo/index.html b/demo/index.html
new file mode 100644
index 0000000..6be8448
--- /dev/null
+++ b/demo/index.html
@@ -0,0 +1,27 @@
+
+
+
+
+
+
+
+ LOL2D
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/demo/index.js b/demo/index.js
new file mode 100644
index 0000000..ffbd4a8
--- /dev/null
+++ b/demo/index.js
@@ -0,0 +1,5 @@
+import * as F from "./js/sketch.js";
+
+for (let key in F) {
+ window[key] = F[key];
+}
diff --git a/demo/js/GameObject/GameObject.js b/demo/js/GameObject/GameObject.js
new file mode 100644
index 0000000..777b030
--- /dev/null
+++ b/demo/js/GameObject/GameObject.js
@@ -0,0 +1,42 @@
+import { Vec2 } from "../utils/Vec2.js";
+
+export class GameObject {
+ constructor(
+ game,
+ position = new Vec2(),
+ collisionRadius = 40,
+ pathingRadius = 40,
+ visionRadius = 0,
+ team = null
+ ) {
+ this.game = game;
+ this.position = position;
+ this.direction = new Vec2();
+ this.collisionRadius = collisionRadius;
+ this.pathingRadius = pathingRadius;
+ this.visionRadius = visionRadius;
+ this.team = team;
+
+ this.#toRemove = false;
+ }
+
+ onAdded() {}
+
+ update() {}
+
+ lateUpdate() {}
+
+ isToRemove() {
+ return this.#toRemove;
+ }
+
+ setToRemove() {
+ this.#toRemove = true;
+ }
+
+ onRemoved() {}
+
+ setPosition(x, y) {
+ this.position.set(x, y);
+ }
+}
diff --git a/demo/js/sketch.js b/demo/js/sketch.js
new file mode 100644
index 0000000..672b5dd
--- /dev/null
+++ b/demo/js/sketch.js
@@ -0,0 +1,11 @@
+import { GameObject } from "./GameObject/GameObject.js";
+
+export function setup() {
+ createCanvas(600, 500);
+
+ let a = new GameObject();
+}
+
+export function draw() {
+ background(30);
+}
diff --git a/demo/js/utils/Vec2.js b/demo/js/utils/Vec2.js
new file mode 100644
index 0000000..e30fbd6
--- /dev/null
+++ b/demo/js/utils/Vec2.js
@@ -0,0 +1,99 @@
+// https://gist.github.com/jjgrainger/808640fcb5764cf92c3cad960682c677
+
+export class Vec2 {
+ constructor(x = 0, y = 0) {
+ this.x = x;
+ this.y = y;
+ }
+
+ set(x, y) {
+ this.x = x;
+ this.y = y;
+ }
+
+ // return the angle of the vector in radians
+ getDirection() {
+ return Math.atan2(this.y, this.x);
+ }
+
+ // set the direction of the vector in radians
+ setDirection(angle) {
+ var magnitude = this.getMagnitude();
+ this.x = Math.cos(angle) * magnitude;
+ this.y = Math.sin(angle) * magnitude;
+ }
+
+ // get the magnitude of the vector
+ getMagnitude() {
+ // use pythagoras theorem to work out the magnitude of the vector
+ return Math.sqrt(this.x * this.x + this.y * this.y);
+ }
+
+ // set the magnitude of the vector
+ setMagnitude(magnitude) {
+ var direction = this.getDirection();
+ this.x = Math.cos(direction) * magnitude;
+ this.y = Math.sin(direction) * magnitude;
+ }
+
+ // add two vectors together and return a new one
+ add(v2) {
+ return new Vec2(this.x + v2.x, this.y + v2.y);
+ }
+
+ // add a vector to this one
+ addTo(v2) {
+ this.x += v2.x;
+ this.y += v2.y;
+ }
+
+ // subtract two vectors and reutn a new one
+ subtract(v2) {
+ return new Vec2(this.x - v2.x, this.y - v2.y);
+ }
+
+ // subtract a vector from this one
+ subtractFrom(v2) {
+ this.x -= v2.x;
+ this.y -= v2.y;
+ }
+
+ // multiply this vector by a scalar and return a new one
+ multiply(scalar) {
+ return new Vec2(this.x * scalar, this.y * scalar);
+ }
+
+ // multiply this vector by the scalar
+ multiplyBy(scalar) {
+ this.x *= scalar;
+ this.y *= scalar;
+ }
+
+ // scale this vector by scalar and return a new vector
+ divide(scalar) {
+ return new Vec2(this.x / scalar, this.y / scalar);
+ }
+
+ // scale this vector by scalar
+ divideBy(scalar) {
+ this.x /= scalar;
+ this.y /= scalar;
+ }
+
+ copy() {
+ return new Vec2(this.x, this.y);
+ }
+
+ // dot product of two vectors
+ dotProduct(v2) {
+ return this.x * v2.x + this.y * v2.y;
+ }
+
+ // normalize a given vector
+ normalize() {
+ return new Vec2(
+ this.x / Math.sqrt(this.x * this.x + this.y * this.y),
+ this.y / Math.sqrt(this.x * this.x + this.y * this.y)
+ );
+ }
+}
diff --git a/demo/js/utils/Vector.js b/demo/js/utils/Vector.js
new file mode 100644
index 0000000..49cf0a8
--- /dev/null
+++ b/demo/js/utils/Vector.js
@@ -0,0 +1,96 @@
+// https://radzion.com/blog/linear-algebra/vectors
+
+export const toDegrees = (radians) => (radians * 180) / Math.PI;
+export const toRadians = (degrees) => (degrees * Math.PI) / 180;
+
+export class Vector {
+ constructor(...components) {
+ this.components = components;
+ }
+
+ add({ components }) {
+ return new Vector(
+ ...components.map(
+ (component, index) => this.components[index] + component
+ )
+ );
+ }
+
+ subtract({ components }) {
+ return new Vector(
+ ...components.map(
+ (component, index) => this.components[index] - component
+ )
+ );
+ }
+
+ scaleBy(number) {
+ return new Vector(
+ ...this.components.map((component) => component * number)
+ );
+ }
+
+ length() {
+ return Math.hypot(...this.components);
+ }
+
+ dotProduct({ components }) {
+ return components.reduce(
+ (acc, component, index) => acc + component * this.components[index],
+ 0
+ );
+ }
+
+ normalize() {
+ return this.scaleBy(1 / this.length());
+ }
+
+ haveSameDirectionWith(other) {
+ const dotProduct = this.normalize().dotProduct(other.normalize());
+ return areEqual(dotProduct, 1);
+ }
+
+ haveOppositeDirectionTo(other) {
+ const dotProduct = this.normalize().dotProduct(other.normalize());
+ return areEqual(dotProduct, -1);
+ }
+
+ isPerpendicularTo(other) {
+ const dotProduct = this.normalize().dotProduct(other.normalize());
+ return areEqual(dotProduct, 0);
+ }
+
+ // 3D vectors only
+ crossProduct({ components }) {
+ return new Vector(
+ this.components[1] * components[2] - this.components[2] * components[1],
+ this.components[2] * components[0] - this.components[0] * components[2],
+ this.components[0] * components[1] - this.components[1] * components[0]
+ );
+ }
+
+ angleBetween(other) {
+ return toDegrees(
+ Math.acos(this.dotProduct(other) / (this.length() * other.length()))
+ );
+ }
+
+ negate() {
+ return this.scaleBy(-1);
+ }
+
+ projectOn(other) {
+ const normalized = other.normalize();
+ return normalized.scaleBy(this.dotProduct(normalized));
+ }
+
+ withLength(newLength) {
+ return this.normalize().scaleBy(newLength);
+ }
+
+ equalTo({ components }) {
+ return components.every((component, index) =>
+ areEqual(component, this.components[index])
+ );
+ }
+}