diff --git a/build/index.js b/build/index.js index d5d0f57..355c9e1 100644 --- a/build/index.js +++ b/build/index.js @@ -19,7 +19,7 @@ let pendulum = new Pendulum(); /** * The pendulum count (of real pendulums). */ -let pendulumCount = Math.max(3, parseInt(urlParameter.get("count") ?? randomIntInRange(5, 10).toFixed())); +let pendulumCount = Math.max(2, parseInt(urlParameter.get("count") ?? randomIntInRange(5, 10).toFixed())) + 1; /** * The animation speed. */ @@ -84,8 +84,12 @@ function generateRandomPendulumTree() { } // 3: connect the remaining two nodes connect(list[0], list[1]); + // make graph directed + makeDirected(nodes[0]); + // the root pendulum is just a dummy (container) + nodes[0].isDummy = true; + // assign the root pendulum pendulum = nodes[0]; - makeDirected(pendulum); function connect(a, b) { nodes[a].children.push(nodes[b]); nodes[b].children.push(nodes[a]); diff --git a/build/pendulum.js b/build/pendulum.js index 419ee38..d0a8dd5 100644 --- a/build/pendulum.js +++ b/build/pendulum.js @@ -1,6 +1,10 @@ "use strict"; console.log("pendulum.ts loaded"); class Pendulum { + /** + * Whether this is just a dummy. (invisible container for children) + */ + isDummy; /** * The length. */ @@ -51,6 +55,7 @@ class Pendulum { * Spinner - Fast rotation speed * Cleaner - Same color as background */ + this.isDummy = isDummy; this.length = { base: randomIntInRange(100, 250), amplitude: randomInRange(10, 25), @@ -84,7 +89,7 @@ class Pendulum { const x = parentX + this.getCurrentValue(this.length) * Math.cos(angle * Math.PI / 180); const y = parentY + this.getCurrentValue(this.length) * Math.sin(angle * Math.PI / 180); const currentColor = this.updateColor(deltaTime); - if (this.lastPosition) { + if (!this.isDummy && this.lastPosition) { context.beginPath(); context.strokeStyle = currentColor; context.lineWidth = Math.max(this.getCurrentValue(this.width), 1); diff --git a/src/index.ts b/src/index.ts index bc32a38..c854dc0 100644 --- a/src/index.ts +++ b/src/index.ts @@ -23,7 +23,7 @@ let pendulum: Pendulum = new Pendulum(); /** * The pendulum count (of real pendulums). */ -let pendulumCount: number = Math.max(3, parseInt(urlParameter.get("count") ?? randomIntInRange(5, 10).toFixed())); +let pendulumCount: number = Math.max(2, parseInt(urlParameter.get("count") ?? randomIntInRange(5, 10).toFixed())) + 1; /** * The animation speed. @@ -95,9 +95,15 @@ function generateRandomPendulumTree(): void { } // 3: connect the remaining two nodes connect(list[0], list[1]); - pendulum = nodes[0]; - makeDirected(pendulum); + // make graph directed + makeDirected(nodes[0]); + + // the root pendulum is just a dummy (container) + nodes[0].isDummy = true; + + // assign the root pendulum + pendulum = nodes[0]; function connect(a: number, b: number) { nodes[a].children.push(nodes[b]); diff --git a/src/pendulum.ts b/src/pendulum.ts index d582ed1..560f6a8 100644 --- a/src/pendulum.ts +++ b/src/pendulum.ts @@ -1,6 +1,11 @@ console.log("pendulum.ts loaded"); class Pendulum { + /** + * Whether this is just a dummy. (invisible container for children) + */ + public isDummy: boolean; + /** * The length. */ @@ -65,6 +70,7 @@ class Pendulum { * Spinner - Fast rotation speed * Cleaner - Same color as background */ + this.isDummy = isDummy; this.length = { base: randomIntInRange(100, 250), amplitude: randomInRange(10, 25), @@ -100,7 +106,7 @@ class Pendulum { const x = parentX + this.getCurrentValue(this.length) * Math.cos(angle * Math.PI / 180); const y = parentY + this.getCurrentValue(this.length) * Math.sin(angle * Math.PI / 180); const currentColor = this.updateColor(deltaTime); - if (this.lastPosition) { + if (!this.isDummy && this.lastPosition) { context.beginPath(); context.strokeStyle = currentColor; context.lineWidth = Math.max(this.getCurrentValue(this.width), 1);