From 71ce60e7684e1bc4a42e73c8584583785c38fccc Mon Sep 17 00:00:00 2001
From: molly-moen <molly@code.org>
Date: Fri, 10 Jun 2022 13:06:23 -0700
Subject: [PATCH] add show hide buckets

---
 README.md                 | 25 +++++++++++++++++++++++++
 src/neighborhood.js       | 16 ++++++++++++++++
 src/neighborhoodDrawer.js | 21 +++++++++++++++++----
 3 files changed, 58 insertions(+), 4 deletions(-)

diff --git a/README.md b/README.md
index faf3075..b599ccb 100644
--- a/README.md
+++ b/README.md
@@ -24,6 +24,31 @@ And spin up a development build of your new project:
 
     yarn build
 
+### Integrate with local Code Studio
+In this repo:
+
+```
+yarn link
+```
+
+In main repo's `apps/` directory:
+
+```
+yarn link @code-dot-org/maze
+```
+
+This will set up a symlink in main repo's apps/node_modules/ to point at your local changes.
+
+Run
+
+```
+yarn run build
+```
+
+in this repo, and then the main repo's `apps` build should pick the changes up next time it builds.
+
+If you are running `yarn start` for continuous builds in the main repo, it will pick up the changes once the build in this repo has completed.
+
 ### Publishing a new version
 
 In /maze: npm login with an authorized npm account. If necessary, create one under your own email, login with our shared dev account and add your new account to the org. After logging in, you may need to authorize your machine (follow the prompt given):
diff --git a/src/neighborhood.js b/src/neighborhood.js
index 0ee1878..70c7d22 100644
--- a/src/neighborhood.js
+++ b/src/neighborhood.js
@@ -146,6 +146,22 @@ module.exports = class Neighborhood extends Subtype {
     this.drawer.updateItemImage(row, col, true);
   }
 
+  setBucketVisibility(showBuckets) {
+    if (this.drawer.getBucketVisibility() != showBuckets) {
+      this.drawer.setBucketVisibility(showBuckets);
+      this.redrawBucketTiles();
+    }
+  }
+
+  redrawBucketTiles() {
+    this.maze_.map.forEachCell((cell, row, col) => {
+      // if the cell has a value > 0, it has a bucket. Only update tiles with a bucket.
+      if (cell.getCurrentValue() > 0) {
+        this.drawer.updateItemImage(row, col, true);
+      }
+    });
+  }
+
   reset() {
     this.drawer.resetTiles();
   }
diff --git a/src/neighborhoodDrawer.js b/src/neighborhoodDrawer.js
index 2bbcb96..8b3c529 100644
--- a/src/neighborhoodDrawer.js
+++ b/src/neighborhoodDrawer.js
@@ -199,6 +199,15 @@ module.exports = class NeighborhoodDrawer extends Drawer {
     this.squareSize = squareSize;
     this.neighborhood = neighborhood;
     this.skin_ = skin;
+    this.showBuckets = true;
+  }
+
+  setBucketVisibility(showBuckets) {
+    this.showBuckets = showBuckets;
+  }
+
+  getBucketVisibility() {
+    return this.showBuckets;
   }
 
   /**
@@ -223,8 +232,9 @@ module.exports = class NeighborhoodDrawer extends Drawer {
    */
   getAsset(prefix, row, col) {
     const cell = this.neighborhood.getCell(row, col);
-    // only cells with a value are handled by getAsset.
-    if (cell.getCurrentValue()) {
+    // If a cell has a value, it is a paint bucket. Return the paintCan asset
+    // if we currently are showing buckets.
+    if (cell.getCurrentValue() && this.showBuckets) {
       return this.skin_.paintCan;
     }
   }
@@ -254,6 +264,7 @@ module.exports = class NeighborhoodDrawer extends Drawer {
    * Calls resetTile for each tile in the grid, clearing all paint.
    */
   resetTiles() {
+    this.showBuckets = true;
     for (let row = 0; row < this.map_.ROWS; row++) {
       for (let col = 0; col < this.map_.COLS; col++) {
         this.resetTile(row, col);
@@ -495,8 +506,10 @@ module.exports = class NeighborhoodDrawer extends Drawer {
     // is a paint can square. Ensure it is shown/hidden appropriately
     // and with the correct value.
     if (cell.getOriginalValue() > 0) {
-      const newValue = cell.getCurrentValue() > 0 ? cell.getCurrentValue() : "";
-      // drawImage_ calls getAsset. If currentValue() is 0, getAsset will return
+      // The new value is the number of paint units to show on the screen. If we have > 0 units and we
+      // are showing buckets, return the value, otherwise return an empty string so we hide the bucket and value.
+      const newValue = cell.getCurrentValue() > 0 && this.showBuckets ? cell.getCurrentValue() : "";
+      // drawImage_ calls getAsset. If currentValue() is 0 or we want to hide buckets, getAsset will return
       // undefined and the paint can will be hidden. Otherwise we will get the paint can image.
       super.drawImage_("", row, col, this.squareSize);
       super.updateOrCreateText_(