Move position calculation of buttons to something cleaner.

This was SVN commit r15360.
This commit is contained in:
sanderd17 2014-06-15 09:56:54 +00:00
parent 5064f2728f
commit beaf3139c0
2 changed files with 68 additions and 186 deletions

View File

@ -13,7 +13,6 @@ var g_SelectionPanels = {};
// COMMAND
g_SelectionPanels.Command = {
"maxNumberOfItems": 6,
"rowLength": 4,
"setTooltip": function(data)
{
if (data.item.tooltip)
@ -32,6 +31,18 @@ g_SelectionPanels.Command = {
{
data.icon.sprite = "stretched:session/icons/" + data.item.icon;
},
"setPosition": function(data)
{
var size = data.button.size;
// count on square buttons, so size.bottom is the width too
var spacer = size.bottom + 1;
// relative to the center ( = 50%)
size.rleft = size.rright = 50;
// offset from the center calculation
size.left = (data.i - data.numberOfItems/2) * spacer;
size.right = size.left + size.bottom;
data.button.size = size;
},
};
// CONSTRUCTION
@ -296,7 +307,7 @@ g_SelectionPanels.Queue = {
{
if (data.template.icon)
data.icon.sprite = "stretched:session/portraits/" + data.template.icon;
}
},
};
// RESEARCH
@ -311,14 +322,15 @@ g_SelectionPanels.Research = {
},
"addData": function(data)
{
data.entType = data.item.pair ? [data.item.bottom, data.item.top] : [data.item];
data.entType = data.item.pair ? [data.item.top, data.item.bottom] : [data.item];
data.template = data.entType.map(GetTechnologyData);
// abort if no template found for any of the techs
if (!data.template.every(function(v) { return v; }))
return false;
data.positions = data.item.pair ? [data.i, data.i + data.rowLength] : [data.i];
data.positionsToHide = data.item.pair ? [] : [data.i + data.rowLength];
// index one row below
var shiftedIndex = data.i + data.rowLength;
data.positions = data.item.pair ? [data.i, shiftedIndex] : [shiftedIndex];
data.positionsToHide = data.item.pair ? [] : [data.i];
// add top buttons to the data
data.button = data.positions.map(function(p) {
@ -438,6 +450,12 @@ g_SelectionPanels.Research = {
// show the tech connector
data.pair.hidden = data.item.pair == null;
},
"setPosition": function(data)
{
for (var i in data.button)
setPanelObjectPosition(data.button[i], data.positions[i], data.rowLength);
setPanelObjectPosition(data.pair, data.i, data.rowLength);
},
};
// SELECTION

View File

@ -12,7 +12,6 @@ const GATE = "Gate";
const PACK = "Pack";
// Constants
const COMMANDS_PANEL_WIDTH = 228;
const UNIT_PANEL_BASE = -52; // QUEUE: The offset above the main panel (will often be negative)
const UNIT_PANEL_HEIGHT = 44; // QUEUE: The height needed for a row of buttons
@ -37,105 +36,20 @@ var g_unitPanels = ["Selection", "Queue", "Formation", "Garrison", "Training", "
// Indexes of resources to sell and buy on barter panel
var g_barterSell = 0;
// Lay out a row of centered buttons (does not work inside a loop like the other function)
function layoutButtonRowCentered(rowNumber, guiName, startIndex, endIndex, width)
function setPanelObjectPosition(object, index, rowLength, vMargin = 1, hMargin = 1)
{
var buttonSideLength = Engine.GetGUIObjectByName("unit"+guiName+"Button[0]").size.bottom;
var buttonSpacer = buttonSideLength+1;
var colNumber = 0;
// Collect buttons
var buttons = [];
var icons = [];
for (var i = startIndex; i < endIndex; i++)
{
var button = Engine.GetGUIObjectByName("unit"+guiName+"Button["+i+"]");
var icon = Engine.GetGUIObjectByName("unit"+guiName+"Icon["+i+"]");
if (button)
{
buttons.push(button);
icons.push(icon);
}
}
// Location of middle button
var middleIndex = Math.ceil(buttons.length/2);
// Determine whether even or odd number of buttons
var center = (buttons.length/2 == Math.ceil(buttons.length/2))? Math.ceil(width/2) : Math.ceil(width/2+buttonSpacer/2);
// Left Side
for (var i = middleIndex-1; i >= 0; i--)
{
if (buttons[i])
{
var icon = icons[i];
var size = buttons[i].size;
size.left = center - buttonSpacer*colNumber - buttonSideLength;
size.right = center - buttonSpacer*colNumber;
size.top = buttonSpacer*rowNumber;
size.bottom = buttonSpacer*rowNumber + buttonSideLength;
buttons[i].size = size;
colNumber++;
}
}
// Right Side
center += 1; // add spacing to center buttons
colNumber = 0; // reset to 0
for (var i = middleIndex; i < buttons.length; i++)
{
if (buttons[i])
{
var icon = icons[i];
var size = buttons[i].size;
size.left = center + buttonSpacer*colNumber;
size.right = center + buttonSpacer*colNumber + buttonSideLength;
size.top = buttonSpacer*rowNumber;
size.bottom = buttonSpacer*rowNumber + buttonSideLength;
buttons[i].size = size;
colNumber++;
}
}
}
// Lay out button rows
function layoutButtonRow(rowNumber, guiName, buttonSideWidth, buttonSpacer, startIndex, endIndex)
{
layoutRow("Button", rowNumber, guiName, buttonSideWidth, buttonSpacer, buttonSideWidth, buttonSpacer, startIndex, endIndex);
}
// Lay out rows
function layoutRow(objectName, rowNumber, guiName, objectSideWidth, objectSpacerWidth, objectSideHeight, objectSpacerHeight, startIndex, endIndex)
{
var colNumber = 0;
for (var i = startIndex; i < endIndex; i++)
{
var button = Engine.GetGUIObjectByName("unit"+guiName+objectName+"["+i+"]");
if (button)
{
var size = button.size;
size.left = objectSpacerWidth*colNumber;
size.right = objectSpacerWidth*colNumber + objectSideWidth;
size.top = objectSpacerHeight*rowNumber;
size.bottom = objectSpacerHeight*rowNumber + objectSideHeight;
button.size = size;
colNumber++;
}
}
}
// Set the visibility of the object
function setOverlay(object, value)
{
object.hidden = !value;
var size = object.size;
// horizontal position
var oWidth = size.right - size.left;
var hIndex = index % rowLength;
size.left = hIndex * (oWidth + vMargin);
size.right = size.left + oWidth;
// vertical position
var oHeight = size.bottom - size.top;
var vIndex = Math.floor(index / rowLength);
size.top = vIndex * (oHeight + hMargin);
size.bottom = size.top + oHeight;
object.size = size;
}
/**
@ -262,7 +176,7 @@ function setupUnitPanel(guiName, usedPanels, unitEntState, playerState, items, c
{
if (!g_SelectionPanels[guiName])
{
error("unknown guiName used");
error("unknown guiName used '" + guiName + "'");
return;
}
usedPanels[guiName] = 1;
@ -276,21 +190,24 @@ function setupUnitPanel(guiName, usedPanels, unitEntState, playerState, items, c
numberOfItems = Math.min(g_SelectionPanels[guiName].maxNumberOfItems, numberOfItems);
// TODO get this out of here
switch (guiName)
// Common code for garrison and 'unload all' button counts.
if (guiName == GARRISON || guiName == COMMAND)
{
case GARRISON:
case COMMAND:
// Common code for garrison and 'unload all' button counts.
for (var i = 0; i < selection.length; ++i)
{
var state = GetEntityState(selection[i]);
if (state.garrisonHolder)
garrisonGroups.add(state.garrisonHolder.entities)
}
break;
default:
break;
for (var i = 0; i < selection.length; ++i)
{
var state = GetEntityState(selection[i]);
if (state.garrisonHolder)
garrisonGroups.add(state.garrisonHolder.entities)
}
}
// Resize Queue panel if needed
if (guiName == QUEUE) // or garrison
{
var numRows = Math.ceil(numberOfItems / rowLength);
var panel = Engine.GetGUIObjectByName("unitQueuePanel");
var size = panel.size;
size.top = (UNIT_PANEL_BASE - ((numRows-1)*UNIT_PANEL_HEIGHT));
panel.size = size;
}
if (g_SelectionPanels[guiName].rowLength)
@ -313,19 +230,21 @@ function setupUnitPanel(guiName, usedPanels, unitEntState, playerState, items, c
// STANDARD DATA
// add standard data
var data = {
"i": i,
"item": item,
"selection": selection,
"playerState": playerState,
"unitEntState": unitEntState,
"callback": callback,
"item": item,
"i": i,
"rowLength": rowLength,
"numberOfItems": numberOfItems,
};
if (garrisonGroups)
data.garrisonGroups = garrisonGroups;
// add standard gui objects to the data
// depending on the actual XML, some of this may be undefined
data.button = Engine.GetGUIObjectByName("unit"+guiName+"Button["+i+"]");
data.affordableMask = Engine.GetGUIObjectByName("unit"+guiName+"Unaffordable["+i+"]");
data.icon = Engine.GetGUIObjectByName("unit"+guiName+"Icon["+i+"]");
@ -364,79 +283,24 @@ function setupUnitPanel(guiName, usedPanels, unitEntState, playerState, items, c
g_SelectionPanels[guiName][f](data);
}
// Special case: position
if (!g_SelectionPanels[guiName].setPosition)
setPanelObjectPosition(data.button, i, rowLength);
// TODO: we should require all entities to have icons, so this case never occurs
if (!data.icon.sprite)
data.icon.sprite = "bkFillBlack";
}
// TODO clean this up, and move most data to g_SelectionPanels.
// Position the buttons
var numRows = Math.ceil(numberOfItems / rowLength);
var buttonSideLength = Engine.GetGUIObjectByName("unit"+guiName+"Button[0]").size.bottom;
// We sort pairs upside down, so get the size from the topmost button.
if (guiName == RESEARCH)
buttonSideLength = Engine.GetGUIObjectByName("unit"+guiName+"Button["+(rowLength*numRows)+"]").size.bottom;
var buttonSpacer = buttonSideLength+1;
// Layout buttons
if (guiName == COMMAND)
{
layoutButtonRowCentered(0, guiName, 0, numberOfItems, COMMANDS_PANEL_WIDTH);
}
else if (guiName == RESEARCH)
{
// We support pairs so we need to add a row
numRows++;
// Layout rows from bottom to top
for (var i = 0, j = numRows; i < numRows; i++, j--)
{
layoutButtonRow(i, guiName, buttonSideLength, buttonSpacer, rowLength*(j-1), rowLength*j);
}
}
else
{
for (var i = 0; i < numRows; i++)
layoutButtonRow(i, guiName, buttonSideLength, buttonSpacer, rowLength*i, rowLength*(i+1) );
}
// Layout pair icons
if (guiName == RESEARCH)
{
var pairSize = Engine.GetGUIObjectByName("unit"+guiName+"Pair[0]").size;
var pairSideWidth = pairSize.right;
var pairSideHeight = pairSize.bottom;
var pairSpacerHeight = pairSideHeight + 1;
var pairSpacerWidth = pairSideWidth + 1;
layoutRow("Pair", 0, guiName, pairSideWidth, pairSpacerWidth, pairSideHeight, pairSpacerHeight, 0, rowLength);
}
// Resize Queue panel if needed
if (guiName == QUEUE) // or garrison
{
var panel = Engine.GetGUIObjectByName("unitQueuePanel");
var size = panel.size;
size.top = (UNIT_PANEL_BASE - ((numRows-1)*UNIT_PANEL_HEIGHT));
panel.size = size;
}
// Hide any buttons we're no longer using
for (var i = numberOfItems; i < g_unitPanelButtons[guiName]; ++i)
Engine.GetGUIObjectByName("unit"+guiName+"Button["+i+"]").hidden = true;
// Hide unused pair buttons and symbols
if (guiName == RESEARCH)
{
for (var i = numberOfItems; i < g_unitPanelButtons[guiName]; ++i)
{
Engine.GetGUIObjectByName("unit"+guiName+"Button["+(i+rowLength)+"]").hidden = true;
Engine.GetGUIObjectByName("unit"+guiName+"Pair["+i+"]").hidden = true;
}
}
if (g_SelectionPanels[guiName].hideItem)
g_SelectionPanels[guiName].hideItem(i, rowLength);
else
Engine.GetGUIObjectByName("unit"+guiName+"Button["+i+"]").hidden = true;
// remember the number of items
g_unitPanelButtons[guiName] = numberOfItems;
}