Added more code to handle loadouts

This commit is contained in:
Pax1601
2023-09-24 20:03:21 +02:00
parent 28afef8847
commit 099cbfdf75
17 changed files with 340 additions and 248 deletions

View File

@@ -0,0 +1,41 @@
import { LoadoutBlueprint, UnitBlueprint } from "interfaces";
import { UnitEditor } from "./uniteditor";
import { LoadoutEditor } from "./loadouteditor";
export class AirUnitEditor extends UnitEditor {
#loadoutEditor: LoadoutEditor | null = null;
constructor(scrollDiv: HTMLElement, contentDiv1: HTMLElement, contentDiv2: HTMLElement) {
super(scrollDiv, contentDiv1, contentDiv2);
this.#loadoutEditor = new LoadoutEditor(this.contentDiv2);
}
setContent(blueprint: UnitBlueprint) {
this.contentDiv1.replaceChildren();
this.addStringInput("Name", blueprint.name);
this.addStringInput("Label", blueprint.label);
this.addStringInput("Short label", blueprint.shortLabel);
this.addDropdownInput("Coalition", blueprint.coalition, ["", "blue", "red"]);
this.addDropdownInput("Era", blueprint.era, ["WW2", "Early Cold War", "Mid Cold War", "Late Cold War", "Modern"]);
this.addStringInput("Filename", blueprint.filename?? "");
this.addStringInput("Cost", String(blueprint.cost)?? "", "number");
this.addLoadoutList(blueprint.loadouts?? []);
}
addLoadoutList(loadouts: LoadoutBlueprint[]) {
var loadoutsEl = document.createElement("div");
loadoutsEl.classList.add("dc-scroll-container", "dc-loadout-container")
loadouts.forEach((loadout: LoadoutBlueprint) => {
var div = document.createElement("div");
loadoutsEl.appendChild(div);
div.textContent = loadout.name;
div.onclick = () => {
this.#loadoutEditor?.setLoadout(loadout);
this.#loadoutEditor?.show();
};
});
this.contentDiv1.appendChild(loadoutsEl);
}
}

View File

@@ -1,10 +1,16 @@
const SHOW_CONTROL_TIPS = "Show control tips"
import { OlympusPlugin } from "interfaces";
import { AirUnitEditor } from "./airuniteditor";
import { OlympusApp } from "olympusapp";
export class DatabaseManagerPlugin implements OlympusPlugin {
#app: OlympusApp | null = null;
#element: HTMLElement;
#app: any;
#scrollDiv: HTMLElement;
#contentDiv: HTMLElement;
#contentDiv1: HTMLElement;
#contentDiv2: HTMLElement;
#aircraftEditor: AirUnitEditor;
constructor() {
this.#element = document.createElement("div");
@@ -17,9 +23,15 @@ export class DatabaseManagerPlugin implements OlympusPlugin {
this.#scrollDiv.classList.add("dc-scroll-container");
this.#element.appendChild(this.#scrollDiv);
this.#contentDiv = document.createElement("div");
this.#contentDiv.classList.add("dc-content-container");
this.#element.appendChild(this.#contentDiv);
this.#contentDiv1 = document.createElement("div");
this.#contentDiv1.classList.add("dc-content-container");
this.#element.appendChild(this.#contentDiv1);
this.#contentDiv2 = document.createElement("div");
this.#contentDiv2.classList.add("dc-content-container");
this.#element.appendChild(this.#contentDiv2);
this.#aircraftEditor = new AirUnitEditor(this.#scrollDiv, this.#contentDiv1, this.#contentDiv2);
}
getName() {
@@ -29,15 +41,11 @@ export class DatabaseManagerPlugin implements OlympusPlugin {
initialize(app: any) {
this.#app = app;
var aircraftDatabase = this.#app.getAircraftDatabase();
var blueprints: {[key: string]: UnitBlueprint} = aircraftDatabase.getBlueprints();
for (let key in blueprints) {
var div = document.createElement("div");
this.#scrollDiv.appendChild(div);
div.textContent = key;
div.onclick = () => this.#setContent(blueprints[key]);
}
var aircraftDatabase = this.#app?.getAircraftDatabase();
if (aircraftDatabase != null) {
this.#aircraftEditor.setDatabase(aircraftDatabase);
this.#aircraftEditor.show();
}
return true;
}
@@ -49,23 +57,4 @@ export class DatabaseManagerPlugin implements OlympusPlugin {
toggle(bool?: boolean) {
this.getElement().classList.toggle("hide", bool);
}
#setContent(blueprint: UnitBlueprint) {
this.#contentDiv.replaceChildren();
for (var key in blueprint) {
if (typeof blueprint[key as keyof UnitBlueprint] === "string")
{
var dt = document.createElement("dt");
var dd = document.createElement("dd");
dt.innerText = key;
var input = document.createElement("input");
input.value = blueprint[key as keyof UnitBlueprint] as string;
input.textContent = blueprint[key as keyof UnitBlueprint] as string;
dd.appendChild(input);
this.#contentDiv.appendChild(dt);
this.#contentDiv.appendChild(dd);
}
}
}
}

View File

@@ -0,0 +1,45 @@
import { LoadoutBlueprint, LoadoutItemBlueprint } from "interfaces";
export class LoadoutEditor {
#contentDiv: HTMLElement;
#loadout: LoadoutBlueprint | null = null;
constructor(contentDiv: HTMLElement) {
this.#contentDiv = contentDiv;
}
setLoadout(loadout: LoadoutBlueprint) {
this.#loadout = loadout;
}
show() {
this.#contentDiv.replaceChildren();
if (this.#loadout) {
this.addStringInput("Name", this.#loadout.name);
this.addStringInput("Code", this.#loadout.code);
var itemsEl = document.createElement("div");
itemsEl.classList.add("dc-scroll-container", "dc-items-container");
this.#loadout.items.forEach((item: LoadoutItemBlueprint) => {
var div = document.createElement("div");
itemsEl.appendChild(div);
div.textContent = item.name;
})
this.#contentDiv.appendChild(itemsEl);
}
}
addStringInput(key: string, value: string, type?: string) {
var dt = document.createElement("dt");
var dd = document.createElement("dd");
dt.innerText = key;
var input = document.createElement("input");
input.value = value;
input.textContent = value;
input.type = type?? "text";
dd.appendChild(input);
this.#contentDiv.appendChild(dt);
this.#contentDiv.appendChild(dd);
}
}

View File

@@ -0,0 +1,65 @@
import { LoadoutBlueprint, UnitBlueprint } from "interfaces";
import { UnitDatabase } from "unit/databases/unitdatabase";
export abstract class UnitEditor {
database: UnitDatabase | null = null;
scrollDiv: HTMLElement;
contentDiv1: HTMLElement;
contentDiv2: HTMLElement;
constructor(scrollDiv: HTMLElement, contentDiv1: HTMLElement, contentDiv2: HTMLElement) {
this.scrollDiv = scrollDiv;
this.contentDiv1 = contentDiv1;
this.contentDiv2 = contentDiv2;
}
setDatabase(database: any) {
this.database = database;
}
show() {
if (this.database !== null) {
var blueprints: {[key: string]: UnitBlueprint} = this.database.getBlueprints();
for (let key in blueprints) {
var div = document.createElement("div");
this.scrollDiv.appendChild(div);
div.textContent = key;
div.onclick = () => this.setContent(blueprints[key]);
}
}
}
addStringInput(key: string, value: string, type?: string) {
var dt = document.createElement("dt");
var dd = document.createElement("dd");
dt.innerText = key;
var input = document.createElement("input");
input.value = value;
input.textContent = value;
input.type = type?? "text";
dd.appendChild(input);
this.contentDiv1.appendChild(dt);
this.contentDiv1.appendChild(dd);
}
addDropdownInput(key: string, value: string, options: string[]) {
var dt = document.createElement("dt");
var dd = document.createElement("dd");
dt.innerText = key;
var select = document.createElement("select");
options.forEach((option: string) => {
var el = document.createElement("option");
el.value = option;
el.innerText = option;
select.appendChild(el);
});
select.value = value;
dd.appendChild(select);
this.contentDiv1.appendChild(dt);
this.contentDiv1.appendChild(dd);
}
abstract setContent(blueprint: UnitBlueprint): void;
}