[REFERENCE] Strategic Icons & Build Pictures

Strategic Icons & Build Pictures
Alpha Disclaimer: This information is based on PA Build 50000 and may change

This guide covers the two main components of Strategic Icons in Planetary Annihilation. These are the creation and addition of icons into the icon atlas (the list of icons available), and the assigning of strategic icons to the units themselves. This guide also covers unit build pictures.

The Icon Atlas
The icon atlas can be found in the following file: PA\media\ui\alpha\icon_atlas\icon_atlas.js. Inside, there is an array of names called self.strategicIcons, a portion of which is shown below:


This array is the list of strategic icon names in game, and each one maps to a corresponding icon file in the PA\media\ui\alpha\icon_atlas\img\strategic_icons\ directory, named "icon_si_<name>.png" (where <name> is the strategic icon name).

The default icons are 32x32 PNG files (any size image can be used, but will be scaled down to 32x32 before being used in game - e.g. there is no increase in quality for using higher resolution images), with White areas (RGB 255,255,255) being replaced with the primary team colour (and progressively darker towards black). This behaviour can be changed by modifying the shader responsible, PA\media\shaders\textured_unlit_bgra_colorized.fs (This is a more advanced modification, see the section on the Strategic Icon shader below).

Assigning Icons to Units
By default, units use the icon name that matches their own. For example, the Ant T1 Tank's name is tank_light_laser, and will therefore use the Strategic Icon of the same name.

There may be times when you wish to overwrite this default behaviour, such as having multiple units share an icon. To do this, you need to modify the "si_name" unit blueprint value (see [REFERENCE] Unit Blueprints) to the name you wish to use.

Advanced: The Strategic Icons shader
The code for the strategic icon shader is as follows:

Code:

#ifdef GL_ES
precision mediump float;
#endif

uniform sampler2D Texture;
uniform vec4 TeamColor_Primary;
uniform vec4 TeamColor_Secondary;
varying vec2 v_TexCoord;

void main() {
    vec4 texel = texture2D(Texture, v_TexCoord);
    vec3 final_color = mix(vec3(1.0, 1.0, 1.0), TeamColor_Primary.rgb, sqrt(texel.g));
    gl_FragColor =  vec4(texel.b * final_color, texel.a * TeamColor_Primary.a);
}

This shader is used to modify the appearance of the Strategic icon images to incorporate the player's primary colour. A typical strategic icon is shown below:


Strategic Icon for Energy Storage

How it works
What we need to output is gl_FragColor. This is an RGBA value (R,G,B,A) that gives the colour of each pixel of the strategic icon. The information we have access to is as follows:

• TeamColor_Primary - The primary team colour
• TeamColor_Secondary - The secondary team colour
• the texture, which is most conveniently encoded in texel:
  
  Code:

  vec4 texel = texture2D(Texture, v_TexCoord);

Texel is an RGBA value, put into a 4 vector (B,G,R,A), with R,G,B, and A all between 0 and 1 (not 0 and 255). The data for this is taken from the corresponding strategic icon PNG file, for the relevant strategic icon. Note that B and R are not in the positions in which you'd expect!

The shader then does the following:

1. The green channel is turned into the primary team colour via
   
   Code:

   final_color = mix(vec3(1.0, 1.0, 1.0), TeamColor_Primary.rgb, sqrt(texel.g)); 

   So a green channel of 0 means we get white, and a green channel of 1 means we get team colour as our "final_color".
   
   
2. The red channel is turned into luminosity, via
   
   Code:

   gl_FragColor =  vec4(texel.b * final_color, texel.a * TeamColor_Primary.a);

   This says that if the red channel is 0, we get black, and if the red channel is 1, we get final_color. Note that this is indeed the red channel, not the blue channel as texel.b would indicate, because r and b are switched here, as noted above. The alpha channel makes sure that wherever the PNG file is transparent, so is the icon.

In the end then, this means the red (which has red channel = 1, green channel = 0) gets turned into a white border, whereas the yellow (red = 1, green = 1) becomes team colour.

Build Pictures
Build pictures for units are used in two places: The build menu of fabrication units, as well as the pop-up unit information box. These images are stored in the PA\media\ui\alpha\live_game\img\build_bar\units\ folder, and are 60x60 PNG images.

With thanks to:
xedi - for writing the shader section and determining that higher resolution icons do not increase in-game icon quality.

correction these icons are 32x32 ^^

You're quite right, I had accidentally selected one of the older icons.

Edit: You can use any size images, however, but it will scale them to be the same size in-game.

how come we get those weird borders?

This may answer your question: viewtopic.php?p=752831#p752831

Is there anyway to change the scaling of the icons? I'm interested in making the strategic icons smaller if that's possible.

So the directory with icons now looks like this:

I wanted to update the icons used by PA Stats, but I can't use papa files.
Any info on how to get the png?

stable\media\ui\main\atlas\icon_atlas\img\strategic_icons

Is that what you are looking for?

Ha! thanks, yeah I was blind

Can the original post be updated please? These folders no longer exist in the current build as far as I can tell. And it keeps coming up in my searches for updated information.

New location is:
ui/main/atlas/icon_atlas/img/strategic_icons

Needs to be a client mod for the icons to work AFAIK.

Build pictures go here:
ui/main/game/live_game/img/build_bar/units

This is server side, AFAIK.

I hate this division of mods types. That needs to be removed entirely. >.<

So in order to make a new unit with full icon support I have to make two mods? That's completely absurd. >.<

I can kinda see having to make separate mods for galactic war and skirmish/main, but right now I'm just doing skirmish (instant sandbox.) I should not have to make two mods to add one unit to one mode of game play.

I thought that too - I can see the logic in having some parts client side and some server, but it would be nice if there was some way to package both? Not sure on the implications of that though.

Well I'd say a server mod could include all the elements of a client mod, at least that's how it should work. In FAF and the like, client mods were stuff that your opponent players didn't have to have, like user interface preference stuff, while server mods everyone had to have, new units and the like. But new units included the ui elements that went with the unit. That's how it should work here. Assuming it doesn't and I'm just missing something.

P.S. To whom it may concern, this needs to be updated with the paths Diaboy mentioned.

http://pawiki.net/wiki/Units_(Modding)

This is likely out-of-date following the changes to strategic icons in 112176