Remove GridRenderer dependency on Tone

MaxLaumeister · Dec 24, 2019 · 7078678 · 7078678
1 parent 16f6eba
commit 7078678
Show file tree

Hide file tree

Showing 3 changed files with 14 additions and 14 deletions.
diff --git a/src/Grid.js b/src/Grid.js
@@ -19,7 +19,7 @@ class Grid {
 
  update(mouseX, mouseY) {
  Util.assert(arguments.length === 2);
- this.renderer.update(this.data, mouseX, mouseY);
+ this.renderer.update(this.data, this.player.getPlayheadX(), mouseX, mouseY);
  }
 
  /**

diff --git a/src/GridRenderer.js b/src/GridRenderer.js
@@ -1,4 +1,3 @@
-/* global Tone */
 /* global SpriteSheet */
 /* global ParticleSystem */
 /* global Util */
@@ -31,18 +30,18 @@ class GridRenderer {
  return heatmap;
  }
 
- update(gridData, mouseX, mouseY) {
- Util.assert(arguments.length === 3);
+ update(gridData, playheadX, mouseX, mouseY) {
+ Util.assert(arguments.length === 4);
  this.particleSystem.update();
- this.draw(gridData, mouseX, mouseY);
+ this.draw(gridData, playheadX, mouseX, mouseY);
  }
 
  /**
  * Draw the current state of the app to the canvas element.
  * This is looped asynchronously via requestAnimationFrame.
  */
- draw(gridData, mouseX, mouseY) {
- Util.assert(arguments.length === 3);
+ draw(gridData, playheadX, mouseX, mouseY) {
+ Util.assert(arguments.length === 4);
  // Defaults
  this.ctx.globalAlpha = 1;
  this.ctx.filter = 'none';
@@ -56,12 +55,6 @@ class GridRenderer {
 
  const heatmap = this.getParticleHeatMap();
 
- const adjustedSeconds = Tone.Transport.seconds
- % (Tone.Transport.loopEnd - Tone.Transport.loopStart);
- const adjustedProgress = adjustedSeconds / (Tone.Transport.loopEnd - Tone.Transport.loopStart);
-
- const playheadx = Math.floor(adjustedProgress * this.gridWidth);
-
  const mousedOverTile = Util.pixelCoordsToTileCoords(mouseX, mouseY,
  this.gridWidth, this.gridHeight, this.canvas.width, this.canvas.height);
 
@@ -77,7 +70,7 @@ class GridRenderer {
  const on = gridData[Util.coordToIndex(gridx, gridy, this.gridWidth)] !== false;
 
  if (on) {
- if (gridx === playheadx) {
+ if (gridx === playheadX) {
  this.ctx.globalAlpha = 1;
  this.spriteSheet.drawSprite(2, this.ctx, x, y);
  // Create particles

diff --git a/src/NotePlayer.js b/src/NotePlayer.js
@@ -57,6 +57,13 @@ class NotePlayer {
  });
  }
 
+ getPlayheadX() {
+ const adjustedSeconds = Tone.Transport.seconds
+ % (Tone.Transport.loopEnd - Tone.Transport.loopStart);
+ const adjustedProgress = adjustedSeconds / (Tone.Transport.loopEnd - Tone.Transport.loopStart);
+ return Math.floor(adjustedProgress * this.gridWidth);
+ }
+
  scheduleNote(gridX, gridY, volume) {
  Util.assert(arguments.length === 3);
  // Cycle through the voices