Skip to content

Commit

Permalink
edit stat object refactor
Browse files Browse the repository at this point in the history
  • Loading branch information
@seiyria
seiyria committed Aug 22, 2024
1 parent 498fd59 commit c6b1d66
Show file tree
Hide file tree
Showing 9 changed files with 96 additions and 325 deletions.
37 changes: 37 additions & 0 deletions src/app/shared/components/edit-statobject/edit-statobject.component.html
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,37 @@
@let stats = statObject();

<div class="form-row split">
<div class="form-column">
<div class="form-row">
<app-input-stat [(stat)]="currentStat" [allowCore]="allowCore()"></app-input-stat>
</div>
</div>

<div class="form-column button-column">
<div class="form-row w-full flex justify-end">
<button class="btn btn-accent btn-sm" [disabled]="!currentStat() || doesObjectHaveCurrentStat()"
(click)="addStat(currentStat())">
<ng-icon name="heroPlus"></ng-icon>
</button>
</div>
</div>
</div>

@for(stat of statsInOrder(); track $index) {
<div class="form-row split">
<div class="form-column">
<div class="form-row">
<app-input-floating-label>{{ stat }}</app-input-floating-label>
<input [(ngModel)]="stats[stat]" type="number" placeholder="Choose value..." class="form-input" />
</div>
</div>

<div class="form-column">
<div class="form-row w-full flex justify-end">
<button class="ml-1 btn btn-error btn-sm" (click)="removeStat(stat)">
<ng-icon name="heroMinus"></ng-icon>
</button>
</div>
</div>
</div>
}
Empty file added src/app/shared/components/edit-statobject/edit-statobject.component.scss
View file
Empty file.
48 changes: 48 additions & 0 deletions src/app/shared/components/edit-statobject/edit-statobject.component.ts
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,48 @@
import { Component, computed, input, model, signal } from '@angular/core';
import { isNumber } from 'lodash';
import { StatType } from '../../../../interfaces';

@Component({
selector: 'app-edit-statobject',
templateUrl: './edit-statobject.component.html',
styleUrl: './edit-statobject.component.scss',
})
export class EditStatobjectComponent {
public statObject = model.required<Partial<Record<StatType, number>>>();
public allowCore = input<boolean>(true);

public currentStat = signal<StatType>('agi');

public statsInOrder = computed(() => {
const stats = this.statObject() ?? {};
return Object.keys(stats).sort() as StatType[];
});

public doesObjectHaveCurrentStat = computed(() => {
const current = this.currentStat();
return isNumber(this.statObject()?.[current]);
});

addStat(stat: StatType, value = 0) {
if (this.hasStat(stat)) return;

this.statObject.update((editing) => {
return {
...editing,
[stat]: value,
};
});
}

removeStat(stat: StatType) {
this.statObject.update((s) => {
delete s[stat];

return structuredClone(s);
});
}

hasStat(stat: StatType) {
return this.statObject()?.[stat];
}
}
3 changes: 3 additions & 0 deletions src/app/shared/shared.module.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -58,6 +58,7 @@ import { WebviewDirective } from './directives/';
import { CellIconComponent } from './components/cell-icon/cell-icon.component';
import { InputMacrotypeComponent } from './components/input-macrotype/input-macrotype.component';
import { InputBufftypeComponent } from './components/input-bufftype/input-bufftype.component';
import { EditStatobjectComponent } from './components/edit-statobject/edit-statobject.component';

@NgModule({
declarations: [
Expand Down Expand Up @@ -108,6 +109,7 @@ import { InputBufftypeComponent } from './components/input-bufftype/input-buffty
CellIconComponent,
InputMacrotypeComponent,
InputBufftypeComponent,
EditStatobjectComponent,
],
imports: [
CommonModule,
Expand Down Expand Up @@ -169,6 +171,7 @@ import { InputBufftypeComponent } from './components/input-bufftype/input-buffty
CellIconComponent,
InputMacrotypeComponent,
InputBufftypeComponent,
EditStatobjectComponent,
],
})
export class SharedModule {}
73 changes: 2 additions & 71 deletions src/app/tabs/items/items-editor/items-editor.component.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -487,43 +487,7 @@
class="form-input" />
</div>

<div class="form-row split">
<div class="form-column">
<div class="form-row">
<app-input-stat [(stat)]="currentNourishmentStat"></app-input-stat>
</div>
</div>

<div class="form-column button-column">
<div class="form-row w-full flex justify-end">
<button class="btn btn-accent btn-sm"
[disabled]="!currentNourishmentStat() || doesItemHaveCurrentNourishmentStat()"
(click)="addNourishmentStat(currentNourishmentStat())">
<ng-icon name="heroPlus"></ng-icon>
</button>
</div>
</div>
</div>

@for(stat of nourishmentStatsInOrder(); track $index) {
<div class="form-row split">
<div class="form-column">
<div class="form-row">
<app-input-floating-label>{{ stat }}</app-input-floating-label>
<input [(ngModel)]="editingData.useEffect!.extra!.statChanges![stat]" type="number"
placeholder="Choose value..." class="form-input" />
</div>
</div>

<div class="form-column">
<div class="form-row w-full flex justify-end">
<button class="ml-1 btn btn-error btn-sm" (click)="removeNourishmentStat(stat)">
<ng-icon name="heroMinus"></ng-icon>
</button>
</div>
</div>
</div>
}
<app-edit-statobject [(statObject)]="editingData.useEffect!.extra!.statChanges!"></app-edit-statobject>
}

<hr class="my-4">
Expand Down Expand Up @@ -657,42 +621,9 @@
</div>
}

<div class="form-row split">
<div class="form-column">
<div class="form-row">
<app-input-stat [(stat)]="currentEncrustStat"></app-input-stat>
</div>
</div>

<div class="form-column button-column">
<div class="form-row w-full flex justify-end">
<button class="btn btn-accent btn-sm" [disabled]="!currentEncrustStat() || doesItemHaveCurrentEncrustStat()"
(click)="addEncrustStat(currentEncrustStat())">
<ng-icon name="heroPlus"></ng-icon>
</button>
</div>
</div>
</div>
<app-edit-statobject [(statObject)]="editingData.encrustGive!.stats"></app-edit-statobject>

@for(stat of encrustStatsInOrder(); track $index) {
<div class="form-row split">
<div class="form-column">
<div class="form-row">
<app-input-floating-label>{{ stat }}</app-input-floating-label>
<input [(ngModel)]="editingData.encrustGive!.stats[stat]" type="number" placeholder="Choose value..."
class="form-input" />
</div>
</div>

<div class="form-column">
<div class="form-row w-full flex justify-end">
<button class="ml-1 btn btn-error btn-sm" (click)="removeEncrustStat(stat)">
<ng-icon name="heroMinus"></ng-icon>
</button>
</div>
</div>
</div>
}
</div>
}
</div>
Expand Down
95 changes: 1 addition & 94 deletions src/app/tabs/items/items-editor/items-editor.component.ts
View file
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
import { Component, computed, OnInit, Signal, signal } from '@angular/core';
import { isNumber, sortBy } from 'lodash';
import { sortBy } from 'lodash';
import {
IItemDefinition,
ItemClassType,
Expand Down Expand Up @@ -83,8 +83,6 @@ export class ItemsEditorComponent

public currentItem = signal<IItemDefinition | undefined>(undefined);
public currentStat = signal<StatType>('agi');
public currentEncrustStat = signal<StatType>('agi');
public currentNourishmentStat = signal<StatType>('agi');
public currentTraitTab = signal<TraitSetting>('none');
public currentTrait = signal<string | undefined>(undefined);
public allStatEdits = signal<StatEdit[]>([]);
Expand Down Expand Up @@ -118,32 +116,10 @@ export class ItemsEditorComponent
return this.allStatEdits().find((s) => s.stat === current);
});

public doesItemHaveCurrentEncrustStat = computed(() => {
const current = this.currentEncrustStat();
return isNumber(this.editing().encrustGive?.stats[current]);
});

public doesItemHaveCurrentNourishmentStat = computed(() => {
const current = this.currentNourishmentStat();
return isNumber(this.editing().useEffect?.extra?.statChanges?.[current]);
});

public statsInOrder = computed(() => {
return sortBy(this.allStatEdits(), 'stat');
});

public encrustStatsInOrder = computed(() => {
const item = this.editing();
return Object.keys(item.encrustGive?.stats ?? {}).sort() as StatType[];
});

public nourishmentStatsInOrder = computed(() => {
const item = this.editing();
return Object.keys(
item.useEffect?.extra?.statChanges ?? {}
).sort() as StatType[];
});

public extraProps: Signal<(keyof IItemDefinition)[]> = computed(() => {
return (typePropSets[this.editing().itemClass]
?.filter((s) => s !== 'stats')
Expand Down Expand Up @@ -303,75 +279,6 @@ export class ItemsEditorComponent
return this.allStatEdits().find((s) => s.stat === stat);
}

public addEncrustStat(stat: StatType, value = 0) {
if (this.hasEncrustStat(stat)) return;

this.editing.update((s) => {
if (!s.encrustGive) return s;

return {
...s,
encrustGive: {
...s.encrustGive,
stats: {
...s.encrustGive.stats,
[stat]: value,
},
},
};
});
}

public removeEncrustStat(stat: StatType) {
this.editing.update((s) => {
if (!s.encrustGive) return s;

delete s.encrustGive.stats[stat];

return s;
});
}

private hasEncrustStat(stat: StatType) {
return this.editing().encrustGive?.stats?.[stat];
}

public addNourishmentStat(stat: StatType, value = 0) {
if (this.hasNourishmentStat(stat)) return;

this.editing.update((s) => {
if (!s.useEffect) return s;

return {
...s,
useEffect: {
...s.useEffect,
extra: {
...s.useEffect.extra,
statChanges: {
...(s.useEffect.extra?.statChanges ?? {}),
[stat]: value,
},
},
},
};
});
}

public removeNourishmentStat(stat: StatType) {
this.editing.update((s) => {
if (!s.encrustGive) return s;

delete s.encrustGive.stats[stat];

return s;
});
}

private hasNourishmentStat(stat: StatType) {
return this.editing().useEffect?.extra?.statChanges?.[stat];
}

private extractStats(item: IItemDefinition) {
this.extractSetStats(item.stats);

Expand Down
Loading

0 comments on commit c6b1d66

Please sign in to comment.