js api: HQ info panel buttons

[aubergineagain]

Describe the feature you'd like

An API so scripts can add text/buttons to an info panel on the HQ. And open the panel on left click, close it on right click.

Describe why do you think it is needed

I'm currently working on adding standardized quick chat to all the AI bots.

Having looked through all of them, there are some common features that don't fit well with quick chat:

1. Setting research path
2. Setting personality / strategy

They currently use custom chat commands to change those things. Most players probably have no idea they even exist. There's sometimes chat commands to get the current settings, too - again how would players ever find out this info?

So I think we can solve both those problems with an info panel on the HQ - players can see what the current settings are, and simply click a button to change them. A js event will be sent allowing scripts to respond.

I also envisage this being useful for human players if a "personal assistant" mod is installed, for example it could automate some research tasks or whatever. Also useful for providing options to spectators, and so on.

The info panel would only be visible to owning player and allies - who incidentally can see the allied HQs on the minimap allowing easy access to them. It would not open for enemies.

Implementation suggestion

I envisage something vaguely like this:

1. Panel title bar (yellow text)
2. Section 1 heading (grey text)
3. Section 1 buttons (max 6 buttons)
4. Section 2 heading (grey text)
5. Section 2 buttons (max 6 buttons)

1. 
2. 
3. 
4. 
5. 

Defining the panel:

// Returns the custom info panel for an object, or undefined if none is supported.
// Initially for HQ only; support for other buildings/features may be added later.
const panel = getCustomInfoPanel(structureObject) // panelObj | undefined

if (panel === undefined) return;

panel.title = `FooBot v9001`; // yellow text

/* Set up first button section */

panel.section1 = _("Research Path"); // how to define locales?

panel.buttons1 = [
    ["R-Defense-Pillbox05", _("Defensive Research")], // icon, tooltip (\n for multiline)
    // ... up to 5 more
];

panel.mode1 = LATCH_ONE; // radio group (default as most common)
// others LATCH_MULTIPLE | LATCH_NONE (none = just normal push button)

panel.select1 = ["R-Defense-Pillbox05"];

panel.visible1 = true; // can toggle panel section on/off (false by default)

/* Set up second button section */

// Same approach with second section, but `2` in property names

The panel properties would be getter/setter so it's easy to inspect and alter state.

EDIT: The latch mode could be ditched and just let the mod handle stuff by changing the selection arrays. Would allow, for example, first 3 buttons to be radio group and second 3 to be single select. Much more flexible and less headaches on the back end hopefully.

Now some events:

function eventBeforeOpenCustomInfoPanel(structureObj, panelObj)
{
    // allows script to make any changes to
    // prior to being displayed
}

function eventCustomInfoPanelClick(structureObj, section, button, panelObj)
{
    // section = 1 or 2
    // button = eg. "R-Defense-Pillbox05"

    const selections = panelObj.select2; // get selected buttons in second section
}

Because panel buttons/etc can be updated at any time, it would also be easy for modders to add debug buttons while working on their code.

You could even use the buttons in the first section to switch between different second sections:

1. Research - second section shows research focus options
2. Personality - second section shows AI trait options
3. Gifts - second section shows gifts (power, trucks, etc)
4. Production - second section shows production toggles
5. Info - second section is push buttons that send info via chat when clicked
6. Attack - second section buttons represent enemy players to attack

On point 6 above, that's where using research items for icons falls apart. Maybe if the "icon" name (usually a research item) has a / in it it is treated as path/to/customIcon.png ? There's never any / in a research id so this would be a nice way of choosing to use custom icon (would be transparent and centered on standard button background so you don't need to do latched vs. unlatched icons.

[aubergineagain]

You could do it on power gens too, to indicate how many resources are assigned (rather than that weird console message).

Would need some way to denote 'no button' in the buttons arrays... maybe a null instead of a button tuple. That way a section could have 4 buttons, 2 on each row, centered.