Update GUI style for single object selections (based on quantumstate's mockup)

This was SVN commit r11937.
This commit is contained in:
WhiteTreePaladin
2012-06-05 00:36:35 +00:00
parent 0296323c9d
commit d271ca89cf
4 changed files with 142 additions and 81 deletions
@@ -33,17 +33,15 @@ function displaySingle(entState, template)
getGUIObjectByName("rankIcon").sprite = getRankIconSprite(entState);
// Hitpoints
var hitpoints = "";
if (entState.hitpoints)
{
var unitHealthBar = getGUIObjectByName("healthBar");
var healthSize = unitHealthBar.size;
healthSize.rtop = 100-100*Math.max(0, Math.min(1, entState.hitpoints / entState.maxHitpoints));
healthSize.rright = 100*Math.max(0, Math.min(1, entState.hitpoints / entState.maxHitpoints));
unitHealthBar.size = healthSize;
hitpoints = "[font=\"serif-bold-13\"]Health [/font]" + entState.hitpoints + "/" + entState.maxHitpoints;
getGUIObjectByName("health").tooltip = hitpoints;
var hitpoints = entState.hitpoints + " / " + entState.maxHitpoints;
getGUIObjectByName("healthText").caption = hitpoints;
getGUIObjectByName("health").hidden = false;
}
else
@@ -72,7 +70,7 @@ function displaySingle(entState, template)
{
var experienceBar = getGUIObjectByName("experienceBar");
var experienceSize = experienceBar.size;
experienceSize.rtop = 100 - 100 * Math.max(0, Math.min(1, 1.0 * entState.promotion.curr / entState.promotion.req));
experienceSize.rright = 100 * Math.max(0, Math.min(1, 1.0 * +entState.promotion.curr / +entState.promotion.req));
experienceBar.size = experienceSize;
var experience = "[font=\"serif-bold-13\"]Experience [/font]" + Math.floor(entState.promotion.curr);
@@ -87,24 +85,23 @@ function displaySingle(entState, template)
}
// Resource stats
var resources = "";
var resourceType = "";
if (entState.resourceSupply)
{
resources = Math.ceil(+entState.resourceSupply.amount) + "/" + entState.resourceSupply.max;
resourceType = entState.resourceSupply.type["generic"];
var resources = Math.ceil(+entState.resourceSupply.amount) + " / " + entState.resourceSupply.max;
var resourceType = entState.resourceSupply.type["generic"];
if (resourceType == "treasure")
resourceType = entState.resourceSupply.type["specific"];
var unitResourceBar = getGUIObjectByName("resourceBar");
var resourceSize = unitResourceBar.size;
resourceSize.rtop = 100-100*Math.max(0, Math.min(1, +entState.resourceSupply.amount / entState.resourceSupply.max));
resourceSize.rright = 100 * Math.max(0, Math.min(1, +entState.resourceSupply.amount / +entState.resourceSupply.max));
unitResourceBar.size = resourceSize;
var unitResources = getGUIObjectByName("resources");
unitResources.tooltip = "[font=\"serif-bold-13\"]Resources: [/font]" + resources + " " + resourceType;
unitResources.tooltip = resourceType;
getGUIObjectByName("resourceText").caption = resources;
if (!entState.hitpoints)
unitResources.size = getGUIObjectByName("health").size;
@@ -143,10 +140,15 @@ function displaySingle(entState, template)
getGUIObjectByName("resourceCarryingText").hidden = true;
}
// Set Captions
// Set Player details
getGUIObjectByName("specific").caption = specificName;
getGUIObjectByName("specific").tooltip = genericName;
getGUIObjectByName("player").caption = playerName;
getGUIObjectByName("player").textcolor = playerColor;
getGUIObjectByName("player").tooltip = civName;
// TODO: Set this to the current player, not the selected unit's player
//getGUIObjectByName("civIcon").tooltip = civName;
// Icon image
if (template.icon)
@@ -159,12 +161,17 @@ function displaySingle(entState, template)
getGUIObjectByName("icon").sprite = "bkFillBlack";
}
// Tooltips
getGUIObjectByName("specific").tooltip = genericName;
getGUIObjectByName("player").tooltip = civName;
getGUIObjectByName("health").tooltip = hitpoints;
getGUIObjectByName("armourIcon").tooltip = "[font=\"serif-bold-16\"]Attack: [/font]" + damageTypesToText(entState.attack) +
"\n[font=\"serif-bold-16\"]Armor: [/font]" + damageTypesToText(entState.armour);
// Attack
var attackValues = damageValues(entState.attack);
getGUIObjectByName("attackHack").caption = attackValues[0];
getGUIObjectByName("attackPierce").caption = attackValues[1];
getGUIObjectByName("attackCrush").caption = attackValues[2];
// Armor
var armorValues = damageValues(entState.armour);
getGUIObjectByName("armorHack").caption = armorValues[0];
getGUIObjectByName("armorPierce").caption = armorValues[1];
getGUIObjectByName("armorCrush").caption = armorValues[2];
// Icon Tooltip
var iconTooltip = "";
@@ -28,7 +28,7 @@
<action on="Press">
this.hidden = !this.hidden;
</action>
</action>
<!-- ================================ ================================ -->
<!-- HOTKEYS (For some reason, they won't work properly unless outside menu) -->
@@ -194,7 +194,7 @@
<!-- ================================ ================================ -->
<!-- Notification Area -->
<!-- ================================ ================================ -->
<object name="notificationPanel" type="image" size="50%-300 100%-280 50%+300 100%-220" ghost="true">
<object name="notificationPanel" type="image" size="50%-300 100%-300 50%+300 100%-240" ghost="true">
<object name="notificationText" size="0 0 100% 100%" type="text" style="notificationPanel" ghost="true"/>
</object>
@@ -346,7 +346,7 @@
<!-- ================================ ================================ -->
<!-- Civ Icon -->
<!-- ================================ ================================ -->
<object size="50%-48 -26 50%+48 70" name="civIcon" type="image"/>
<object size="50%-48 -26 50%+48 70" name="civIcon" type="image" tooltip_style="sessionToolTipBold"/>
<!-- ================================ ================================ -->
<!-- Phase -->
@@ -602,7 +602,7 @@
</object>
<!-- ================================ ================================ -->
<!-- Details Panel -->
<!-- Details Panel (Middle) -->
<!-- ================================ ================================ -->
<object name="selectionDetails"
type="image"
@@ -613,62 +613,81 @@
<!-- Unit details for Single Unit -->
<object size="50%-112 0 50%+112 100%" name="detailsAreaSingle">
<!-- Big unit icon -->
<object z="30" size= "6 -30 126 90" type="image" name="iconBorder" tooltip_style="sessionToolTip">
<object size="2 2 100%-2 100%-2" type="image" name="icon" ghost="true"/>
<object size="100%-20 4 100%-4 20" name="rankIcon" type="image" sprite="" ghost="true"/>
<object type="image" sprite="glassSquareIcon" ghost="true"/>
<!-- Resource carrying icon/counter -->
<object size="0 40 48 88" type="image" name="resourceCarryingIcon"/>
<object size="0 80 48 100" type="text" name="resourceCarryingText" style="statsText"/>
<!-- Experience bar -->
<object size="2 100%-9 100%-2 100%-1" type="image" name="experience" tooltip="Experience" tooltip_style="sessionToolTip">
<object type="image" sprite="experienceBackground" ghost="true"/>
<object type="image" sprite="experienceForeground" ghost="true" name="experienceBar"/>
<object type="image" sprite="statsBarShader" ghost="true"/>
</object>
</object>
<!-- Player Name -->
<object size="0 0 100% 40" name="player" type="text" style="largeCenteredOutlinedText" tooltip_style="sessionToolTipBold"/>
<object size="126 -24 100% 0" name="player" type="text" style="largeLeftOutlinedText" tooltip_style="sessionToolTipBold"/>
<!-- Specific Name -->
<object size="126 4 100% 44" name="specific" type="text" style="LeftLabelText" tooltip_style="sessionToolTipBold"/>
<!-- Stats Bars -->
<object size= "126 48 100%-4 136" type="image" tooltip_style="sessionToolTip">
<!-- Health bar -->
<object size="0 0 100% 16" type="image" name="health" tooltip="Health" tooltip_style="sessionToolTip">
<object type="image" sprite="healthBackground" ghost="true"/>
<object type="image" sprite="healthForeground" ghost="true" name="healthBar"/>
<object type="image" sprite="statsBarShader" ghost="true"/>
<object size="0 0 100% 100%" name="healthText" type="text" style="largeCenteredOutlinedText" ghost="true"/>
</object>
<!-- Stamina bar -->
<object size="0 20 100% 36" type="image" name="stamina" tooltip="Stamina" tooltip_style="sessionToolTip">
<object type="image" sprite="staminaBackground" ghost="true"/>
<object type="image" sprite="staminaForeground" ghost="true" name="staminaBar"/>
<object type="image" sprite="statsBarShader" ghost="true"/>
</object>
<!-- Resource bar -->
<object size="0 20 100% 36" type="image" name="resources" tooltip="Resources" tooltip_style="sessionToolTip">
<object type="image" sprite="resourceBackground" ghost="true"/>
<object type="image" sprite="resourceForeground" ghost="true" name="resourceBar"/>
<object type="image" sprite="statsBarShader" ghost="true"/>
<object size="0 0 100% 100%" name="resourceText" type="text" style="largeCenteredOutlinedText" ghost="true"/>
</object>
</object>
<!-- Stats -->
<object size="8 36 50%-48 100%" name="statsArea" type="image">
<!-- Attack icon -->
<object hidden="true" size="0 0 48 48" type="image" name="attackIcon" sprite="stretched:session/icons/stances/aggressive.png" tooltip_style="sessionToolTip"/>
<!-- Armour icon "0 48 48 96"-->
<object size="0 0 48 48" type="image" name="armourIcon" sprite="stretched:session/icons/stances/defensive.png" tooltip_style="sessionToolTip"/>
<!-- Resource carrying icon/counter -->
<object size="0 40 48 88" type="image" name="resourceCarryingIcon"/>
<object size="0 80 48 100" type="text" name="resourceCarryingText" style="statsText"/>
<object size="10 94 100% 100%" name="statsArea" type="image">
<!-- Attack - icon and Hack Pierce Crush labels -->
<object size="0 0 100% 32">
<object size="0 -2 42 40" type="image" name="attackIcon" sprite="stretched:session/icons/stances/violent.png" tooltip_style="sessionToolTip"/>
<object size="42 0 92 50%" name="attackHackLabel" type="text" style="CenteredLabelText">Hack</object>
<object size="92 0 142 50%" name="attackPierceLabel" type="text" style="CenteredLabelText">Pierce</object>
<object size="142 0 192 50%" name="attackCrushLabel" type="text" style="CenteredLabelText">Crush</object>
<object size="42 50% 92 100%" name="attackHack" type="text" style="statsText"/>
<object size="92 50% 142 100%" name="attackPierce" type="text" style="statsText"/>
<object size="142 50% 192 100%" name="attackCrush" type="text" style="statsText"/>
</object>
<!-- Armour - icon and Hack Pierce Crush labels -->
<object size="0 38 100% 70">
<object size="0 -2 42 40" type="image" name="armorIcon" sprite="stretched:session/icons/stances/standground.png" tooltip_style="sessionToolTip"/>
<object size="42 0 92 50%" name="armorHackLabel" type="text" style="CenteredLabelText">Hack</object>
<object size="92 0 142 50%" name="armorPierceLabel" type="text" style="CenteredLabelText">Pierce</object>
<object size="142 0 192 50%" name="armorCrushLabel" type="text" style="CenteredLabelText">Crush</object>
<object size="42 50% 92 100%" name="armorHack" type="text" style="statsText"/>
<object size="92 50% 142 100%" name="armorPierce" type="text" style="statsText"/>
<object size="142 50% 192 100%" name="armorCrush" type="text" style="statsText"/>
</object>
</object>
<!-- Big unit icon -->
<object size= "50%-48 40 50%+48 136" type="image" name="iconBorder" tooltip_style="sessionToolTip">
<object size="2 2 100%-2 100%-2" type="image" name="icon" ghost="true"/>
<object size="100%-20 4 100%-4 20" name="rankIcon" type="image" sprite="" ghost="true"/>
<object type="image" sprite="glassSquareIcon" ghost="true"/>
</object>
<!-- Stats Bars -->
<object size= "50%+48 40 100% 136" type="image" tooltip_style="sessionToolTip">
<!-- Health bar -->
<object size="18 0 30 100%" type="image" name="health" tooltip="Health" tooltip_style="sessionToolTip">
<object type="image" sprite="healthBackground" ghost="true"/>
<object type="image" sprite="healthForeground" ghost="true" name="healthBar"/>
<object type="image" sprite="statsBarShader" ghost="true"/>
</object>
<!-- Stamina bar -->
<object size="32 0 44 100%" type="image" name="stamina" tooltip="Stamina" tooltip_style="sessionToolTip">
<object type="image" sprite="staminaBackground" ghost="true"/>
<object type="image" sprite="staminaForeground" ghost="true" name="staminaBar"/>
<object type="image" sprite="statsBarShader" ghost="true"/>
</object>
<!-- Resource bar -->
<object size="18 0 30 100%" type="image" name="resources" tooltip="Resources" tooltip_style="sessionToolTip">
<object type="image" sprite="resourceBackground" ghost="true"/>
<object type="image" sprite="resourceForeground" ghost="true" name="resourceBar"/>
<object type="image" sprite="statsBarShader" ghost="true"/>
</object>
<!-- Experience bar -->
<object size="46 0 58 100%" type="image" name="experience" tooltip="Experience" tooltip_style="sessionToolTip">
<object type="image" sprite="experienceBackground" ghost="true"/>
<object type="image" sprite="experienceForeground" ghost="true" name="experienceBar"/>
<object type="image" sprite="statsBarShader" ghost="true"/>
</object>
</object>
<!-- Specific Name -->
<object size="0 142 100% 162" name="specific" type="text" style="largeCenteredOutlinedText" tooltip_style="sessionToolTipBold"/>
</object>
<!-- Unit details for Multiple Units -->
@@ -5,21 +5,20 @@
<!-- ================================ ================================ -->
<!-- Text Styles -->
<!-- ================================ ================================ -->
<style name="PauseText"
<style name="PauseText"
font="serif-bold-24"
textcolor="white"
text_align="center"
text_valign="center"
/>
<style name="PauseMessageText"
<style name="PauseMessageText"
font="serif-bold-12"
textcolor="white"
text_align="center"
text_valign="center"
/>
<style name="leftAlignedText"
textcolor="white"
text_align="left"
@@ -38,7 +37,7 @@
text_valign="center"
/>
<style name="largeBoldCenteredText"
<style name="largeBoldCenteredText"
font="serif-bold-18"
textcolor="white"
text_align="center"
@@ -52,6 +51,13 @@
text_valign="center"
/>
<style name="largeLeftOutlinedText"
font="serif-bold-stroke-14"
textcolor="white"
text_align="left"
text_valign="center"
/>
<style name="iconButtonCount"
textcolor="255 255 255"
font="serif-9"
@@ -95,7 +101,7 @@
text_valign="center"
/>
<style name="statsText"
<style name="statsTextLabel"
textcolor="white"
font="serif-bold-stroke-14"
ghost="true"
@@ -103,6 +109,14 @@
text_valign="center"
/>
<style name="statsText"
textcolor="white"
font="serif-bold-stroke-14"
ghost="true"
text_align="center"
text_valign="center"
/>
<style name="settingsText"
font="serif-16"
textcolor="white"
@@ -102,6 +102,26 @@ function hasClass(entState, className)
return false;
}
// For the unit details panel
function damageValues(dmg)
{
if (dmg)
{
var dmgArray = [];
dmg.hack? dmgArray.push(dmg.hack) : dmgArray.push(0);
dmg.pierce? dmgArray.push(dmg.pierce) : dmgArray.push(0);
dmg.crush? dmgArray.push(dmg.crush) : dmgArray.push(0);
return dmgArray;
}
else
{
return [0, 0, 0];
}
}
// For the unit details panel
function damageTypesToTextStacked(dmg)
{
if (!dmg)
@@ -109,6 +129,7 @@ function damageTypesToTextStacked(dmg)
return dmg.hack + " Hack\n" + dmg.pierce + " Pierce\n" + dmg.crush + " Crush";
}
// For the training tooltip
function damageTypesToText(dmg)
{
if (!dmg)