[REFERENCE] Strategic Icons & Build Pictures

Discussion in 'Mod Discussions' started by Raevn, June 24, 2013.

  1. Raevn

    Raevn Moderator Alumni

    Messages:
    4,226
    Likes Received:
    4,324
    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:

    [​IMG]
    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.

    Attached Files:

    Quitch and moldez like this.
  2. tatsujb

    tatsujb Post Master General

    Messages:
    12,902
    Likes Received:
    5,385
    correction these icons are 32x32 ^^
  3. Raevn

    Raevn Moderator Alumni

    Messages:
    4,226
    Likes Received:
    4,324
    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.
  4. tatsujb

    tatsujb Post Master General

    Messages:
    12,902
    Likes Received:
    5,385
    how come we get those weird borders?
  5. Raevn

    Raevn Moderator Alumni

    Messages:
    4,226
    Likes Received:
    4,324
  6. tom9915

    tom9915 New Member

    Messages:
    2
    Likes Received:
    0
    Is there anyway to change the scaling of the icons? I'm interested in making the strategic icons smaller if that's possible.
  7. cola_colin

    cola_colin Moderator Alumni

    Messages:
    12,074
    Likes Received:
    16,221
    So the directory with icons now looks like this:
    [​IMG]
    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?
  8. liquius

    liquius Well-Known Member

    Messages:
    731
    Likes Received:
    482
    stable\media\ui\main\atlas\icon_atlas\img\strategic_icons

    Is that what you are looking for?
    cola_colin likes this.
  9. cola_colin

    cola_colin Moderator Alumni

    Messages:
    12,074
    Likes Received:
    16,221
    Ha! thanks, yeah I was blind :)
  10. bsergent

    bsergent Active Member

    Messages:
    236
    Likes Received:
    73
    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.
  11. Diaboy

    Diaboy Active Member

    Messages:
    110
    Likes Received:
    63
    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.
    bsergent likes this.
  12. bsergent

    bsergent Active Member

    Messages:
    236
    Likes Received:
    73
    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.
    Engineer1234 likes this.
  13. Diaboy

    Diaboy Active Member

    Messages:
    110
    Likes Received:
    63
    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.
  14. bsergent

    bsergent Active Member

    Messages:
    236
    Likes Received:
    73
    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)
  15. Quitch

    Quitch Post Master General

    Messages:
    5,850
    Likes Received:
    6,045
    This is likely out-of-date following the changes to strategic icons in 112176

Share This Page