|
|
@ -11,14 +11,16 @@ export class HUDBaseToolbar extends BaseHUDPart {
|
|
|
|
/**
|
|
|
|
/**
|
|
|
|
* @param {GameRoot} root
|
|
|
|
* @param {GameRoot} root
|
|
|
|
* @param {object} param0
|
|
|
|
* @param {object} param0
|
|
|
|
* @param {Array<typeof MetaBuilding>} param0.supportedBuildings
|
|
|
|
* @param {Array<typeof MetaBuilding>} param0.primaryBuildings
|
|
|
|
|
|
|
|
* @param {Array<typeof MetaBuilding>=} param0.secondaryBuildings
|
|
|
|
* @param {function} param0.visibilityCondition
|
|
|
|
* @param {function} param0.visibilityCondition
|
|
|
|
* @param {string} param0.htmlElementId
|
|
|
|
* @param {string} param0.htmlElementId
|
|
|
|
*/
|
|
|
|
*/
|
|
|
|
constructor(root, { supportedBuildings, visibilityCondition, htmlElementId }) {
|
|
|
|
constructor(root, { primaryBuildings, secondaryBuildings = [], visibilityCondition, htmlElementId }) {
|
|
|
|
super(root);
|
|
|
|
super(root);
|
|
|
|
|
|
|
|
|
|
|
|
this.supportedBuildings = supportedBuildings;
|
|
|
|
this.primaryBuildings = primaryBuildings;
|
|
|
|
|
|
|
|
this.secondaryBuildings = secondaryBuildings;
|
|
|
|
this.visibilityCondition = visibilityCondition;
|
|
|
|
this.visibilityCondition = visibilityCondition;
|
|
|
|
this.htmlElementId = htmlElementId;
|
|
|
|
this.htmlElementId = htmlElementId;
|
|
|
|
|
|
|
|
|
|
|
@ -40,17 +42,40 @@ export class HUDBaseToolbar extends BaseHUDPart {
|
|
|
|
this.element = makeDiv(parent, this.htmlElementId, ["ingame_buildingsToolbar"], "");
|
|
|
|
this.element = makeDiv(parent, this.htmlElementId, ["ingame_buildingsToolbar"], "");
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
/**
|
|
|
|
|
|
|
|
* Returns all buildings
|
|
|
|
|
|
|
|
* @returns {Array<typeof MetaBuilding>}
|
|
|
|
|
|
|
|
*/
|
|
|
|
|
|
|
|
get allBuildings() {
|
|
|
|
|
|
|
|
return [...this.primaryBuildings, ...this.secondaryBuildings];
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
initialize() {
|
|
|
|
initialize() {
|
|
|
|
const actionMapper = this.root.keyMapper;
|
|
|
|
const actionMapper = this.root.keyMapper;
|
|
|
|
|
|
|
|
let rowSecondary;
|
|
|
|
|
|
|
|
if (this.secondaryBuildings.length > 0) {
|
|
|
|
|
|
|
|
rowSecondary = makeDiv(this.element, null, ["buildings", "secondary"]);
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
this.secondaryDomAttach = new DynamicDomAttach(this.root, rowSecondary, {
|
|
|
|
|
|
|
|
attachClass: "visible",
|
|
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
const items = makeDiv(this.element, null, ["buildings"]);
|
|
|
|
const rowPrimary = makeDiv(this.element, null, ["buildings", "primary"]);
|
|
|
|
|
|
|
|
|
|
|
|
for (let i = 0; i < this.supportedBuildings.length; ++i) {
|
|
|
|
const allBuildings = this.allBuildings;
|
|
|
|
const metaBuilding = gMetaBuildingRegistry.findByClass(this.supportedBuildings[i]);
|
|
|
|
|
|
|
|
|
|
|
|
for (let i = 0; i < allBuildings.length; ++i) {
|
|
|
|
|
|
|
|
const metaBuilding = gMetaBuildingRegistry.findByClass(allBuildings[i]);
|
|
|
|
const binding = actionMapper.getBinding(KEYMAPPINGS.buildings[metaBuilding.getId()]);
|
|
|
|
const binding = actionMapper.getBinding(KEYMAPPINGS.buildings[metaBuilding.getId()]);
|
|
|
|
|
|
|
|
|
|
|
|
const itemContainer = makeDiv(items, null, ["building"]);
|
|
|
|
const itemContainer = makeDiv(
|
|
|
|
|
|
|
|
this.primaryBuildings.includes(allBuildings[i]) ? rowPrimary : rowSecondary,
|
|
|
|
|
|
|
|
null,
|
|
|
|
|
|
|
|
["building"]
|
|
|
|
|
|
|
|
);
|
|
|
|
itemContainer.setAttribute("data-icon", "building_icons/" + metaBuilding.getId() + ".png");
|
|
|
|
itemContainer.setAttribute("data-icon", "building_icons/" + metaBuilding.getId() + ".png");
|
|
|
|
|
|
|
|
itemContainer.setAttribute("data-id", metaBuilding.getId());
|
|
|
|
|
|
|
|
|
|
|
|
binding.add(() => this.selectBuildingForPlacement(metaBuilding));
|
|
|
|
binding.add(() => this.selectBuildingForPlacement(metaBuilding));
|
|
|
|
|
|
|
|
|
|
|
@ -88,14 +113,29 @@ export class HUDBaseToolbar extends BaseHUDPart {
|
|
|
|
this.domAttach.update(visible);
|
|
|
|
this.domAttach.update(visible);
|
|
|
|
|
|
|
|
|
|
|
|
if (visible) {
|
|
|
|
if (visible) {
|
|
|
|
|
|
|
|
let recomputeSecondaryToolbarVisibility = false;
|
|
|
|
for (const buildingId in this.buildingHandles) {
|
|
|
|
for (const buildingId in this.buildingHandles) {
|
|
|
|
const handle = this.buildingHandles[buildingId];
|
|
|
|
const handle = this.buildingHandles[buildingId];
|
|
|
|
const newStatus = handle.metaBuilding.getIsUnlocked(this.root);
|
|
|
|
const newStatus = handle.metaBuilding.getIsUnlocked(this.root);
|
|
|
|
if (handle.unlocked !== newStatus) {
|
|
|
|
if (handle.unlocked !== newStatus) {
|
|
|
|
handle.unlocked = newStatus;
|
|
|
|
handle.unlocked = newStatus;
|
|
|
|
handle.element.classList.toggle("unlocked", newStatus);
|
|
|
|
handle.element.classList.toggle("unlocked", newStatus);
|
|
|
|
|
|
|
|
recomputeSecondaryToolbarVisibility = true;
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
if (recomputeSecondaryToolbarVisibility && this.secondaryDomAttach) {
|
|
|
|
|
|
|
|
let anyUnlocked = false;
|
|
|
|
|
|
|
|
for (let i = 0; i < this.secondaryBuildings.length; ++i) {
|
|
|
|
|
|
|
|
const metaClass = gMetaBuildingRegistry.findByClass(this.secondaryBuildings[i]);
|
|
|
|
|
|
|
|
if (metaClass.getIsUnlocked(this.root)) {
|
|
|
|
|
|
|
|
anyUnlocked = true;
|
|
|
|
|
|
|
|
break;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
this.secondaryDomAttach.update(anyUnlocked);
|
|
|
|
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
@ -110,9 +150,9 @@ export class HUDBaseToolbar extends BaseHUDPart {
|
|
|
|
|
|
|
|
|
|
|
|
let newBuildingFound = false;
|
|
|
|
let newBuildingFound = false;
|
|
|
|
let newIndex = this.lastSelectedIndex;
|
|
|
|
let newIndex = this.lastSelectedIndex;
|
|
|
|
for (let i = 0; i < this.supportedBuildings.length; ++i, ++newIndex) {
|
|
|
|
for (let i = 0; i < this.primaryBuildings.length; ++i, ++newIndex) {
|
|
|
|
newIndex %= this.supportedBuildings.length;
|
|
|
|
newIndex %= this.primaryBuildings.length;
|
|
|
|
const metaBuilding = gMetaBuildingRegistry.findByClass(this.supportedBuildings[newIndex]);
|
|
|
|
const metaBuilding = gMetaBuildingRegistry.findByClass(this.primaryBuildings[newIndex]);
|
|
|
|
const handle = this.buildingHandles[metaBuilding.id];
|
|
|
|
const handle = this.buildingHandles[metaBuilding.id];
|
|
|
|
if (!handle.selected && handle.unlocked) {
|
|
|
|
if (!handle.selected && handle.unlocked) {
|
|
|
|
newBuildingFound = true;
|
|
|
|
newBuildingFound = true;
|
|
|
@ -122,7 +162,7 @@ export class HUDBaseToolbar extends BaseHUDPart {
|
|
|
|
if (!newBuildingFound) {
|
|
|
|
if (!newBuildingFound) {
|
|
|
|
return;
|
|
|
|
return;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
const metaBuildingClass = this.supportedBuildings[newIndex];
|
|
|
|
const metaBuildingClass = this.primaryBuildings[newIndex];
|
|
|
|
const metaBuilding = gMetaBuildingRegistry.findByClass(metaBuildingClass);
|
|
|
|
const metaBuilding = gMetaBuildingRegistry.findByClass(metaBuildingClass);
|
|
|
|
this.selectBuildingForPlacement(metaBuilding);
|
|
|
|
this.selectBuildingForPlacement(metaBuilding);
|
|
|
|
}
|
|
|
|
}
|
|
|
|