preliminary implementation of dynamic event chains

src/app/helpers/event.ts

@@ -0,0 +1,31 @@
+import {
+  DynamicEventRarity,
+  DynamicEventSuccessTypeType,
+  IDynamicEventMeta,
+} from '../../interfaces';
+import { id } from './id';
+
+export const defaultEvent: () => IDynamicEventMeta = () => ({
+  _id: id(),
+  cooldown: 0,
+  description: '',
+  duration: 0,
+  endMessage: '',
+  name: '',
+  rarity: DynamicEventRarity.Common,
+  startMessage: '',
+  conflicts: [],
+  extraData: {},
+  map: undefined as unknown as string,
+  npc: undefined as unknown as string,
+
+  requiresPreviousEvent: false,
+  spawnEventOnFailure: undefined as unknown as string,
+  spawnEventOnSuccess: undefined as unknown as string,
+
+  successMetrics: {
+    count: 0,
+    killNPCs: [],
+    type: undefined as unknown as DynamicEventSuccessTypeType,
+  },
+});

src/app/helpers/exporter.ts

@@ -22,6 +22,7 @@ export function formatMod(modData: IModKit): IModKit {
     stems: modData.stems,
     traitTrees: modData.traitTrees,
     achievements: modData.achievements,
+    events: modData.events,
   };
 
   return exported;

src/app/helpers/index.ts

@@ -3,6 +3,7 @@ export * from './constants';
 export * from './core';
 export * from './dialog';
 export * from './droptable';
+export * from './event';
 export * from './exporter';
 export * from './id';
 export * from './importer';

src/app/home/home.component.html

@@ -219,6 +219,10 @@
         <app-achievements class="h-full"></app-achievements>
         }
 
+        @case (12) {
+        <app-events class="h-full"></app-events>
+        }
+
         }
       </div>
     </div>

src/app/home/home.component.ts

@@ -108,6 +108,10 @@ export class HomeComponent implements OnInit {
       name: 'Achievements',
       count: computed(() => this.modService.mod().achievements.length),
     },
+    {
+      name: 'Events',
+      count: computed(() => this.modService.mod().events.length),
+    },
   ];
 
   constructor() {}

src/app/home/home.module.ts

@@ -15,6 +15,8 @@ import { DependenciesComponent } from '../dependencies/dependencies.component';
 import { PinpointComponent } from '../pinpoint/pinpoint.component';
 import { QueryComponent } from '../query/query.component';
 import { SharedModule } from '../shared/shared.module';
+import { EventsEditorComponent } from '../tabs/achievements copy/events-editor/events-editor.component';
+import { EventsComponent } from '../tabs/achievements copy/events.component';
 import { AchievementsEditorComponent } from '../tabs/achievements/achievements-editor/achievements-editor.component';
 import { AchievementsComponent } from '../tabs/achievements/achievements.component';
 import { CoresEditorComponent } from '../tabs/cores/cores-editor/cores-editor.component';
@@ -72,6 +74,8 @@ import { HomeComponent } from './home.component';
     AnalysisComponent,
     QueryComponent,
     DependenciesComponent,
+    EventsComponent,
+    EventsEditorComponent,
   ],
   imports: [
     CommonModule,

src/app/services/mod.service.ts

@@ -48,6 +48,7 @@ export function defaultModKit(): IModKit {
     stems: [],
     traitTrees: [],
     achievements: [],
+    events: [],
   };
 }
 

src/app/shared/components/input-event/input-event.component.html

@@ -0,0 +1,25 @@
+<div class="relative">
+  <ng-select class="form-control" [items]="values()" [(ngModel)]="event" groupBy="category"
+    placeholder="Select event..." (change)="change.emit($event?.value)" [compareWith]="itemCompare" [searchFn]="search">
+
+    <ng-template ng-label-tmp let-item="item">
+      <div class="relative">
+        <div class="text-white">
+          {{ item.value }}
+        </div>
+      </div>
+    </ng-template>
+
+    <ng-template ng-option-tmp let-item="item">
+      <div class="relative">
+        <div class="text-white">
+          {{ item.value }}
+        </div>
+
+        <p class="text-white text-sm italic whitespace-break-spaces">{{ item.desc }}</p>
+      </div>
+    </ng-template>
+  </ng-select>
+
+  <app-input-floating-label>{{ label() }}</app-input-floating-label>
+</div>

src/app/shared/components/input-event/input-event.component.ts

@@ -0,0 +1,72 @@
+import {
+  Component,
+  computed,
+  inject,
+  input,
+  model,
+  OnInit,
+  output,
+} from '@angular/core';
+import { sortBy } from 'lodash';
+import { IDynamicEventMeta } from '../../../../interfaces';
+import { ModService } from '../../../services/mod.service';
+
+@Component({
+  selector: 'app-input-event',
+  templateUrl: './input-event.component.html',
+  styleUrl: './input-event.component.scss',
+})
+export class InputEventComponent implements OnInit {
+  private modService = inject(ModService);
+
+  public event = model<IDynamicEventMeta | undefined>();
+  public defaultValue = input<string>();
+  public label = input<string>('Event');
+  public change = output<string>();
+
+  public values = computed(() => {
+    const mod = this.modService.mod();
+    const activeDependencies = this.modService.activeDependencies();
+
+    const myModEvents = mod.events.map((i) => ({
+      category: `${mod.meta.name} (Current)`,
+      data: i,
+      value: i.name,
+      desc: i.description,
+      index: 0,
+    }));
+
+    const depEvents = activeDependencies
+      .map((dep, idx) =>
+        dep.events.map((i) => ({
+          category: dep.meta.name,
+          data: i,
+          value: i.name,
+          desc: i.description,
+          index: idx + 1,
+        }))
+      )
+      .flat();
+
+    return [...sortBy([...myModEvents, ...depEvents], ['index', 'value'])];
+  });
+
+  ngOnInit() {
+    const defaultItem = this.defaultValue();
+    if (defaultItem) {
+      const foundItem = this.values().find((i) => i.value === defaultItem);
+      this.event.set(foundItem as unknown as IDynamicEventMeta);
+    }
+  }
+
+  public itemCompare(
+    itemA: { value: string; desc: string },
+    itemB: { value: string; desc: string }
+  ): boolean {
+    return itemA.value === itemB.value;
+  }
+
+  public search(term: string, item: { value: string }) {
+    return item.value.toLowerCase().includes(term.toLowerCase());
+  }
+}

src/app/shared/components/input-eventrarity/input-eventrarity.component.html

@@ -0,0 +1,6 @@
+<div class="relative">
+  <ng-select class="form-control" [items]="values" [(ngModel)]="rarity" [clearable]="false"
+    placeholder="Select event rarity..." (change)="change.emit($event)"></ng-select>
+
+  <app-input-floating-label>Event Rarity</app-input-floating-label>
+</div>

src/app/shared/components/input-eventrarity/input-eventrarity.component.ts

@@ -0,0 +1,17 @@
+import { Component, model, output } from '@angular/core';
+import {
+  DynamicEventRarity,
+  DynamicEventRarityType,
+} from '../../../../interfaces';
+
+@Component({
+  selector: 'app-input-eventrarity',
+  templateUrl: './input-eventrarity.component.html',
+  styleUrl: './input-eventrarity.component.scss',
+})
+export class InputEventRarityComponent {
+  public rarity = model.required<DynamicEventRarityType | undefined>();
+  public change = output<DynamicEventRarityType>();
+
+  public values = [...Object.values(DynamicEventRarity).sort()];
+}

src/app/shared/components/input-eventsuccesstype/input-eventsuccesstype.component.html

@@ -0,0 +1,6 @@
+<div class="relative">
+  <ng-select class="form-control" [items]="values" [(ngModel)]="successType" placeholder="Select success type..."
+    (change)="change.emit($event?.value)"></ng-select>
+
+  <app-input-floating-label>{{ label() }}</app-input-floating-label>
+</div>

src/app/shared/components/input-eventsuccesstype/input-eventsuccesstype.component.ts

@@ -0,0 +1,15 @@
+import { Component, input, model, output } from '@angular/core';
+import { DynamicEventSuccessType } from '../../../../interfaces';
+
+@Component({
+  selector: 'app-input-eventsuccesstype',
+  templateUrl: './input-eventsuccesstype.component.html',
+  styleUrl: './input-eventsuccesstype.component.scss',
+})
+export class InputEventSuccessTypeComponent {
+  public successType = model.required<string | undefined>();
+  public label = input<string>('Success Type');
+  public change = output<string>();
+
+  public values = [...Object.values(DynamicEventSuccessType)];
+}

src/app/shared/components/input-map/input-map.component.html

@@ -2,5 +2,5 @@
   <ng-select class="form-control" [items]="values()" [(ngModel)]="map" placeholder="Select map..."
     (change)="change.emit($event)"></ng-select>
 
-  <app-input-floating-label>Map</app-input-floating-label>
+  <app-input-floating-label>{{ label() }}</app-input-floating-label>
 </div>

src/app/shared/components/input-map/input-map.component.ts

@@ -20,6 +20,7 @@ export class InputMapComponent implements OnInit {
 
   public map = model.required<string | undefined>();
   public defaultValue = input<string>();
+  public label = input<string>('Map');
   public change = output<string>();
 
   public values = computed(() =>

src/app/shared/shared.module.ts

@@ -32,8 +32,10 @@ import { InputChallengeratingComponent } from './components/input-challengeratin
 import { InputClassComponent } from './components/input-class/input-class.component';
 import { InputDamageclassComponent } from './components/input-damageclass/input-damageclass.component';
 import { InputEffectComponent } from './components/input-effect/input-effect.component';
+import { InputEventComponent } from './components/input-event/input-event.component';
+import { InputEventRarityComponent } from './components/input-eventrarity/input-eventrarity.component';
+import { InputEventSuccessTypeComponent } from './components/input-eventsuccesstype/input-eventsuccesstype.component';
 import { InputFloatingLabelComponent } from './components/input-floating-label/input-floating-label.component';
-import { InputGameeventComponent } from './components/input-gameevent/input-gameevent.component';
 import { InputHolidayComponent } from './components/input-holiday/input-holiday.component';
 import { InputHostilityComponent } from './components/input-hostility/input-hostility.component';
 import { InputIconComponent } from './components/input-icon/input-icon.component';
@@ -115,11 +117,13 @@ import { WebviewDirective } from './directives/';
     InputMacrotypeComponent,
     InputBufftypeComponent,
     EditStatobjectComponent,
-    InputGameeventComponent,
     InputSpawnerComponent,
     InputAnalysisReportComponent,
     InputStemComponent,
     InputAchievementTypeComponent,
+    InputEventRarityComponent,
+    InputEventComponent,
+    InputEventSuccessTypeComponent,
   ],
   imports: [
     CommonModule,
@@ -182,11 +186,13 @@ import { WebviewDirective } from './directives/';
     InputMacrotypeComponent,
     InputBufftypeComponent,
     EditStatobjectComponent,
-    InputGameeventComponent,
     InputSpawnerComponent,
     InputAnalysisReportComponent,
     InputStemComponent,
     InputAchievementTypeComponent,
+    InputEventRarityComponent,
+    InputEventComponent,
+    InputEventSuccessTypeComponent,
   ],
 })
 export class SharedModule {}