closes #26

LandOfTheRair · Aug 15, 2024 · 23847ab · 23847ab
1 parent be3309e
commit 23847ab
Show file tree

Hide file tree

Showing 12 changed files with 124 additions and 141 deletions.
diff --git a/app/handlers/moddata.ts b/app/handlers/moddata.ts
@@ -1,9 +1,4 @@
-import { groupBy } from 'lodash';
 import {
-  IDroptable,
-  IDroptableMap,
-  IDroptableRegion,
-  IExportedModKit,
   IItemDefinition,
   IModKit,
   INPCDefinition,
@@ -45,32 +40,6 @@ function formatNPCs(npcs: INPCDefinition[]): INPCDefinition[] {
   });
 }
 
-function formatDroptables(droptables: IDroptable[]): {
-  regions: IDroptableRegion[];
-  maps: IDroptableMap[];
-} {
-  const globalDrops = droptables.filter((f) => f.isGlobal);
-  const regionDrops = groupBy(
-    droptables.filter((f) => f.regionName),
-    'regionName'
-  );
-  const mapDrops = groupBy(
-    droptables.filter((f) => f.mapName),
-    'mapName'
-  );
-
-  return {
-    maps: Object.keys(mapDrops).map((mapName) => ({
-      mapName,
-      drops: [...mapDrops[mapName], ...globalDrops],
-    })),
-    regions: Object.keys(regionDrops).map((regionName) => ({
-      regionName,
-      drops: [...regionDrops[regionName], ...globalDrops],
-    })),
-  };
-}
-
 function formatItems(items: IItemDefinition[]): IItemDefinition[] {
   return items.map((item: any) => {
     if (!item.sellValue) delete item.sellValue;
@@ -109,18 +78,18 @@ function stripIds(modData: IModKit) {
   });
 }
 
-export function formatMod(modData: IModKit): IExportedModKit {
+export function formatMod(modData: IModKit): IModKit {
   stripIds(modData);
 
-  const exported: IExportedModKit = {
+  const exported: IModKit = {
     meta: {
       ...structuredClone(modData.meta),
       _backup: structuredClone(modData),
     },
 
     npcs: formatNPCs(modData.npcs),
     items: formatItems(modData.items),
-    drops: formatDroptables(modData.drops),
+    drops: modData.drops,
     dialogs: modData.dialogs,
     maps: modData.maps,
     quests: modData.quests,

diff --git a/src/app/helpers/droptable.ts b/src/app/helpers/droptable.ts
@@ -4,10 +4,7 @@ import { id } from './id';
 export const defaultDroptable: () => IDroptable = () => ({
   _id: id(),
   isGlobal: false,
-  mapName: null as unknown as string,
-  maxChance: 0,
-  noLuckBonus: false,
-  regionName: null as unknown as string,
-  requireHoliday: null as unknown as string,
-  result: null as unknown as string,
+  mapName: undefined as unknown as string,
+  regionName: undefined as unknown as string,
+  drops: [],
 });
diff --git a/src/app/helpers/validators/item.ts b/src/app/helpers/validators/item.ts
@@ -61,7 +61,9 @@ export function checkItemUses(mod: IModKit): ValidationMessageGroup {
 
   // count item usages by type
   mod.drops.forEach((droptable) => {
-    addItemCount(droptable.result);
+    droptable.drops.forEach((drop) => {
+      addItemCount(drop.result);
+    });
   });
 
   mod.recipes.forEach((recipe) => {

diff --git a/src/app/services/electron.service.ts b/src/app/services/electron.service.ts
@@ -69,7 +69,7 @@ export class ElectronService {
     });
 
     // the mod has no backup, which means it was a clean export. it might need some reformatting to get it back in
-    window.api.receive('loadmod', (mod: IModKit) => {
+    window.api.receive('loadmod', () => {
       // this.modService.updateMod(mod);
     });
 

diff --git a/src/app/services/mod.service.ts b/src/app/services/mod.service.ts
@@ -214,7 +214,7 @@ export class ModService {
       if (droptable.mapName !== oldName) return;
 
       console.log(
-        `[Propagate Map] Updated droptable "${droptable.result}" Map: ${oldName} -> ${newName}`
+        `[Propagate Map] Updated droptable "${droptable.mapName}" Map: ${oldName} -> ${newName}`
       );
       droptable.mapName = newName;
     });
@@ -284,17 +284,19 @@ export class ModService {
     });
 
     mod.drops.forEach((droptable) => {
-      if (droptable.result !== oldName) return;
+      droptable.drops.forEach((drop) => {
+        if (drop.result !== oldName) return;
 
-      console.log(
-        `[Propagate Item] Updated droptable for "${
-          droptable.mapName ||
-          droptable.regionName ||
-          (droptable.isGlobal ? 'global' : '')
-        }" item: ${oldName} -> ${newName}`
-      );
+        console.log(
+          `[Propagate Item] Updated droptable for "${
+            droptable.mapName ||
+            droptable.regionName ||
+            (droptable.isGlobal ? 'global' : '')
+          }" item: ${oldName} -> ${newName}`
+        );
 
-      droptable.result = newName;
+        drop.result = newName;
+      });
     });
 
     mod.quests.forEach((quest) => {

diff --git a/src/app/shared/components/input-map/input-map.component.ts b/src/app/shared/components/input-map/input-map.component.ts
@@ -10,7 +10,7 @@ import { ModService } from '../../../services/mod.service';
 export class InputMapComponent {
   private modService = inject(ModService);
 
-  public map = model.required<string>();
+  public map = model.required<string | undefined>();
   public change = output<string>();
 
   public values = computed(() =>

diff --git a/src/app/shared/components/input-region/input-region.component.ts b/src/app/shared/components/input-region/input-region.component.ts
@@ -10,7 +10,7 @@ import { ModService } from '../../../services/mod.service';
 export class InputRegionComponent {
   private modService = inject(ModService);
 
-  public region = model.required<string>();
+  public region = model.required<string | undefined>();
   public change = output<string>();
 
   public values = computed(() =>

diff --git a/src/app/tabs/droptables/droptables-editor/droptables-editor.component.html b/src/app/tabs/droptables/droptables-editor/droptables-editor.component.html
@@ -11,10 +11,6 @@
 
 <div class="flex flex-row gap-2">
   <div class="form-column">
-    <div class="form-row">
-      <app-input-item [item]="currentItem()" (change)="update('result', $event)"
-        [defaultValue]="editingData.result"></app-input-item>
-    </div>
 
     <div class="form-row">
       <app-input-map [(map)]="editingData.mapName"
@@ -26,36 +22,77 @@
         (change)="update('mapName', undefined); update('isGlobal', false)"></app-input-region>
     </div>
 
-    <div class="form-row">
-      <app-input-floating-label>Chance to Drop (1/X)</app-input-floating-label>
-      <input [(ngModel)]="editingData.maxChance" (ngModelChange)="update('maxChance', $event)" type="number" min="0"
-        placeholder="Choose drop chance..." class="form-input" />
-    </div>
-  </div>
-
-  <div class="form-column">
-    <div class="form-row pl-1">
-      <label class="label cursor-pointer" floatUi="Whether or not to utilize LUK when trying to get this item.">
-        <input type="checkbox" [(ngModel)]="editingData.noLuckBonus" class="checkbox" />
-        <span class="label-text">Disallow LUK Bonus</span>
-      </label>
-    </div>
-
     <div class="form-row pl-1">
       <label class="label cursor-pointer" floatUi="Whether or not this item should actually drop on every map.">
         <input type="checkbox" [(ngModel)]="editingData.isGlobal"
           (ngModelChange)="update('regionName', undefined); update('mapName', undefined); update('isGlobal', $event)"
           class="checkbox" />
-        <span class="label-text">Is Global Drop</span>
+        <span class="label-text">Is Global Droptable</span>
       </label>
     </div>
 
-    <div class="form-row">
-      <app-input-holiday [(holiday)]="editingData.requireHoliday"></app-input-holiday>
+  </div>
+
+  <div class="form-column">
+    <div class="form-row split">
+      <div class="form-column">
+        <div class="form-row">
+          <app-input-item [(item)]="currentItem"></app-input-item>
+        </div>
+      </div>
+
+      <div class="form-column button-column">
+        <div class="form-row w-full flex justify-end">
+          <button class="btn btn-accent btn-sm" (click)="addItem(currentItem())"
+            [disabled]="!currentItem() || hasItem(currentItem())">
+            <ng-icon name="heroPlus"></ng-icon>
+          </button>
+        </div>
+      </div>
+    </div>
+
+    @for(drop of editingData.drops; track $index) {
+    <div class="form-row split">
+      <div class="form-column">
+        <div class="form-row">
+          {{ drop.result }}
+        </div>
+      </div>
+
+      <div class="form-column">
+        <div class="form-row">
+          <app-input-floating-label>Max Chance (1/X)</app-input-floating-label>
+          <input [(ngModel)]="drop.maxChance" min="1" type="number" placeholder="Choose chance..." class="form-input" />
+        </div>
+      </div>
+
+      <div class="form-column">
+        <div class="form-row pl-1">
+          <label class="label cursor-pointer" floatUi="Whether or not to utilize LUK when trying to get this item.">
+            <input type="checkbox" [(ngModel)]="drop.noLuckBonus" class="checkbox" />
+            <span class="label-text">Disallow LUK Bonus</span>
+          </label>
+        </div>
+      </div>
+
+      <div class="form-column">
+        <div class="form-row">
+          <app-input-holiday [(holiday)]="drop.requireHoliday"></app-input-holiday>
+        </div>
+      </div>
+
+      <div class="form-column button-column">
+        <div class="form-row w-full flex justify-end">
+          <button class="ml-1 btn btn-error btn-sm" (click)="removeItem(drop.result)">
+            <ng-icon name="heroMinus"></ng-icon>
+          </button>
+        </div>
+      </div>
     </div>
+    }
   </div>
 </div>
 
 <app-debug-view>
   {{ editingData | json }}
-</app-debug-view>
+</app-debug-view>
diff --git a/src/app/tabs/droptables/droptables-editor/droptables-editor.component.ts b/src/app/tabs/droptables/droptables-editor/droptables-editor.component.ts
@@ -1,5 +1,5 @@
 import { Component, computed, signal } from '@angular/core';
-import { IDroptable, IItemDefinition } from '../../../../interfaces';
+import { Holiday, IDroptable, IItemDefinition } from '../../../../interfaces';
 import { EditorBaseComponent } from '../../../shared/components/editor-base/editor-base.component';
 
 @Component({
@@ -13,9 +13,39 @@ export class DroptablesEditorComponent extends EditorBaseComponent<IDroptable> {
   public canSave = computed(() => {
     const data = this.editing();
     return (
-      (data.mapName || data.regionName || data.isGlobal) &&
-      data.maxChance > 0 &&
-      data.result
+      (data.isGlobal || data.mapName || data.regionName) &&
+      data.drops.length > 0
     );
   });
+
+  public addItem(item: IItemDefinition | undefined) {
+    if (!item) return;
+
+    this.editing.update((droptable) => ({
+      ...droptable,
+      drops: [
+        ...droptable.drops,
+        {
+          chance: 1,
+          maxChance: 100,
+          result: item.name,
+          noLuckBonus: true,
+          requireHoliday: undefined as unknown as Holiday,
+        },
+      ],
+    }));
+  }
+
+  public removeItem(item: string) {
+    this.editing.update((npc) => {
+      const newNpc = { ...npc };
+      newNpc.drops = newNpc.drops.filter((d) => d.result !== item);
+      return newNpc;
+    });
+  }
+
+  public hasItem(item: IItemDefinition | undefined) {
+    if (!item) return false;
+    return this.editing().drops.some((d) => d.result === item.name);
+  }
 }
diff --git a/src/app/tabs/droptables/droptables.component.ts b/src/app/tabs/droptables/droptables.component.ts
@@ -4,7 +4,6 @@ import { ColDef } from 'ag-grid-community';
 import { IDroptable, IModKit } from '../../../interfaces';
 import { defaultDroptable } from '../../helpers';
 import { CellButtonsComponent } from '../../shared/components/cell-buttons/cell-buttons.component';
-import { CellSpriteComponent } from '../../shared/components/cell-sprite/cell-sprite.component';
 import { EditorBaseTableComponent } from '../../shared/components/editor-base-table/editor-base-table.component';
 import { HeaderButtonsComponent } from '../../shared/components/header-buttons/header-buttons.component';
 
@@ -27,29 +26,6 @@ export class DroptablesComponent extends EditorBaseTableComponent<EditingType> {
   );
   public tableItems = computed(() => this.modService.mod().drops);
   public tableColumns: ColDef[] = [
-    {
-      field: 'sprite',
-      headerName: '',
-      resizable: false,
-      sortable: false,
-      width: 100,
-      cellRenderer: CellSpriteComponent,
-      cellRendererParams: { type: 'items', fromResult: true },
-    },
-    {
-      field: 'result',
-      headerName: 'Item',
-      flex: 1,
-      cellDataType: 'text',
-      filter: 'agTextColumnFilter',
-    },
-    {
-      field: 'maxChance',
-      flex: 1,
-      cellDataType: 'number',
-      filter: 'agNumberColumnFilter',
-      valueFormatter: (v) => `1/${v.value}`,
-    },
     {
       field: 'mapName',
       flex: 1,

diff --git a/src/interfaces/droptable.ts b/src/interfaces/droptable.ts
@@ -1,21 +1,10 @@
+import { Rollable } from './building-blocks';
 import { HasIdentification } from './identified';
 
 export interface IDroptable extends HasIdentification {
-  result: string;
-  maxChance: number;
-  noLuckBonus: boolean;
-  mapName: string;
-  regionName: string;
-  requireHoliday: string;
-  isGlobal: boolean;
-}
-
-export interface IDroptableMap {
-  mapName: string;
-  drops: IDroptable[];
-}
+  mapName?: string;
+  regionName?: string;
+  isGlobal?: boolean;
 
-export interface IDroptableRegion {
-  regionName: string;
-  drops: IDroptable[];
+  drops: Rollable[];
 }