Add Clear All buttons

Resolves #983
wooferzfg · Apr 11, 2024 · 5f8e97f · 5f8e97f
1 parent 2850df0
commit 5f8e97f
Show file tree

Hide file tree

Showing 4 changed files with 41 additions and 4 deletions.
diff --git a/src/css/main.scss b/src/css/main.scss
@@ -522,6 +522,10 @@ button:hover:enabled {
         padding-top: 0;
         padding-bottom: 0;
       }
+
+      .extra-width-header {
+        width: 130px;
+      }
     }
 
     .zoom-map-background,

diff --git a/src/ui/detailed-locations-table.jsx b/src/ui/detailed-locations-table.jsx
@@ -149,6 +149,7 @@ class DetailedLocationsTable extends React.PureComponent {
 
   render() {
     const {
+      clearAllLocations,
       clearOpenedMenus,
       toggleRequiredBoss,
       disableLogic,
@@ -177,7 +178,23 @@ class DetailedLocationsTable extends React.PureComponent {
       DetailedLocationsTable.NUM_ROWS,
     );
 
-    let clearAllElement;
+    const clearAllLocationsFunc = () => clearAllLocations(openedLocation);
+
+    const clearAllElement = (
+      <td>
+        <div
+          className="detail-span"
+          onClick={clearAllLocationsFunc}
+          onKeyDown={KeyDownWrapper.onSpaceKey(clearAllLocationsFunc)}
+          role="button"
+          tabIndex="0"
+        >
+          ✓ Clear All
+        </div>
+      </td>
+    );
+
+    let requiredBossElement = null;
     if (
       Settings.getOptionValue(Permalink.OPTIONS.REQUIRED_BOSSES)
       && openedLocationIsDungeon
@@ -194,8 +211,8 @@ class DetailedLocationsTable extends React.PureComponent {
 
       const className = `detail-span ${isDisabled ? 'detail-disabled' : ''}`;
 
-      clearAllElement = (
-        <td>
+      requiredBossElement = (
+        <td className="extra-width-header">
           <div
             className={className}
             onClick={toggleRequiredBossFunc}
@@ -220,14 +237,17 @@ class DetailedLocationsTable extends React.PureComponent {
       <MapTable
         backgroundImage={backgroundImage}
         closeFunc={clearOpenedMenus}
-        headerCellsAfterClose={clearAllElement}
+        headerCellsAfterClose={
+          _.concat(clearAllElement, requiredBossElement)
+        }
         tableRows={locationRows}
       />
     );
   }
 }
 
 DetailedLocationsTable.propTypes = {
+  clearAllLocations: PropTypes.func.isRequired,
   clearOpenedMenus: PropTypes.func.isRequired,
   disableLogic: PropTypes.bool.isRequired,
   logic: PropTypes.instanceOf(LogicCalculation).isRequired,

diff --git a/src/ui/locations-table.jsx b/src/ui/locations-table.jsx
@@ -79,6 +79,7 @@ class LocationsTable extends React.PureComponent {
   chartContainer() {
     const {
       chartListOpen,
+      clearAllLocations,
       clearOpenedMenus,
       toggleRequiredBoss,
       decrementItem,
@@ -155,6 +156,7 @@ class LocationsTable extends React.PureComponent {
     } else if (!_.isNil(openedLocation)) {
       chartElement = (
         <DetailedLocationsTable
+          clearAllLocations={clearAllLocations}
           clearOpenedMenus={clearOpenedMenus}
           disableLogic={disableLogic}
           logic={logic}
@@ -280,6 +282,7 @@ LocationsTable.defaultProps = {
 LocationsTable.propTypes = {
   backgroundColor: PropTypes.string,
   chartListOpen: PropTypes.bool.isRequired,
+  clearAllLocations: PropTypes.func.isRequired,
   clearOpenedMenus: PropTypes.func.isRequired,
   decrementItem: PropTypes.func.isRequired,
   disableLogic: PropTypes.bool.isRequired,

diff --git a/src/ui/tracker.jsx b/src/ui/tracker.jsx
@@ -47,6 +47,7 @@ class Tracker extends React.PureComponent {
 
     this.initialize();
 
+    this.clearAllLocations = this.clearAllLocations.bind(this);
     this.clearOpenedMenus = this.clearOpenedMenus.bind(this);
     this.decrementItem = this.decrementItem.bind(this);
     this.incrementItem = this.incrementItem.bind(this);
@@ -180,6 +181,14 @@ class Tracker extends React.PureComponent {
     this.updateTrackerState(newTrackerState);
   }
 
+  clearAllLocations(zoneName) {
+    const { trackerState } = this.state;
+
+    const newTrackerState = trackerState.clearBannedLocations(zoneName);
+
+    this.updateTrackerState(newTrackerState);
+  }
+
   toggleRequiredBoss(dungeonName) {
     let { trackerState: newTrackerState } = this.state;
 
@@ -457,6 +466,7 @@ class Tracker extends React.PureComponent {
             <LocationsTable
               backgroundColor={extraLocationsBackground}
               chartListOpen={chartListOpen}
+              clearAllLocations={this.clearAllLocations}
               clearOpenedMenus={this.clearOpenedMenus}
               decrementItem={this.decrementItem}
               disableLogic={disableLogic}