Ticket #4366: 4366_barterUI_v1-2.patch

binaries/data/config/default.cfg

@@ -159 +159 @@
 session.devcommands.toggle = "Alt+D"  ; Toggle developer commands panel
 session.gui.toggle = "Alt+G"          ; Toggle visibility of session GUI
 menu.toggle = "F10"                   ; Toggle in-game menu
+barter.toggle = "Ctrl+B"              ; Toggle in-game barter/trade page
 timeelapsedcounter.toggle = "F12"     ; Toggle time elapsed counter
 session.showstatusbars = Tab          ; Toggle display of status bars
 session.highlightguarding = PgDn      ; Toggle highlight of guarding units

binaries/data/mods/public/gui/session/hotkeys/misc.xml

@@ -16 +16 @@
         <action on="Press">toggleMenu();</action>
     </object>
 
+    <object hotkey="barter.toggle">
+        <action on="Press">toggleTrade();</action>
+    </object>
+
     <object hotkey="silhouettes">
         <action on="Press">
             var newSetting = !Engine.Renderer_GetSilhouettesEnabled();

binaries/data/mods/public/gui/session/menu.js

@@ -28 +28 @@
 // Shown in the trade dialog.
 const g_IdleTraderTextColor = "orange";
 
+const BARTER_RESOURCE_AMOUNT_TO_SELL = 100;
+const BARTER_BUNCH_MULTIPLIER = 5;
+const BARTER_ACTIONS = ["Buy", "Sell"];
+var g_BarterSell;
+
 var g_IsMenuOpen = false;
 
 var g_IsDiplomacyOpen = false;
@@ -489 +494 @@
 
     g_IsTradeOpen = true;
 
-    var updateButtons = function()
+    let updateTradeButtons = function()
     {
         for (let res in button)
         {
@@ -510 +515 @@
 
     for (let i = 0; i < resCodes.length; ++i)
     {
+        let resCode = resCodes[i];
+
+        // Barter
+        let barterButton = {};
+        for (let action of BARTER_ACTIONS)
+            barterButton[action] = Engine.GetGUIObjectByName("barter" + action + "Button[" + i + "]");
+
+        if (!g_BarterSell)
+            g_BarterSell = g_ResourceData.GetCodes()[0];
+
+        let resource = getLocalizedResourceName(g_ResourceData.GetNames()[resCode], "withinSentence");
+        barterButton.Buy.tooltip = sprintf(translate("Buy %(resource)s"), { "resource": resource });
+        barterButton.Sell.tooltip = sprintf(translate("Sell %(resource)s"), { "resource": resource });
+
+        barterButton.Sell.onPress = function() {
+            g_BarterSell = resCode;
+        };
+
+        setPanelObjectPosition(Engine.GetGUIObjectByName("barterResource[" + i + "]"), i, i+1);
+
+        // Trade
         let tradeResource = Engine.GetGUIObjectByName("tradeResource["+i+"]");
         if (!tradeResource)
         {
@@ -519 +545 @@
 
         setPanelObjectPosition(tradeResource, i, i+1);
 
-        let resCode = resCodes[i];
-        proba[resCode] = proba[resCode] || 0;
-
         let icon = Engine.GetGUIObjectByName("tradeResourceIcon["+i+"]");
         icon.sprite = "stretched:session/icons/resources/" + resCode + ".png";
 
@@ -535 +558 @@
             "sel": Engine.GetGUIObjectByName("tradeResourceSelection["+i+"]")
         };
 
+        proba[resCode] = proba[resCode] || 0;
+
         let buttonResource = Engine.GetGUIObjectByName("tradeResourceButton["+i+"]");
         buttonResource.enabled = controlsPlayer(g_ViewedPlayer);
         buttonResource.onpress = (function(resource){
@@ -547 +572 @@
                     Engine.PostNetworkCommand({"type": "set-trading-goods", "tradingGoods": proba});
                 }
                 selec = resource;
-                updateButtons();
+                updateTradeButtons();
             };
         })(resCode);
 
@@ -557 +582 @@
                 proba[resource] += Math.min(STEP, proba[selec]);
                 proba[selec]    -= Math.min(STEP, proba[selec]);
                 Engine.PostNetworkCommand({"type": "set-trading-goods", "tradingGoods": proba});
-                updateButtons();
+                updateTradeButtons();
             };
         })(resCode);
 
@@ -567 +592 @@
                 proba[selec]    += Math.min(STEP, proba[resource]);
                 proba[resource] -= Math.min(STEP, proba[resource]);
                 Engine.PostNetworkCommand({"type": "set-trading-goods", "tradingGoods": proba});
-                updateButtons();
+                updateTradeButtons();
             };
         })(resCode);
     }
-    updateButtons();
+    updateTradeButtons();
 
     let traderNumber = Engine.GuiInterfaceCall("GetTraderNumber", g_ViewedPlayer);
-    Engine.GetGUIObjectByName("landTraders").caption = getIdleLandTradersText(traderNumber);
-    Engine.GetGUIObjectByName("shipTraders").caption = getIdleShipTradersText(traderNumber);
+    Engine.GetGUIObjectByName("traders").caption = getIdleLandTradersText(traderNumber) + "\n\n" + getIdleShipTradersText(traderNumber);
     Engine.GetGUIObjectByName("tradeDialogPanel").hidden = false;
 }
 
+function updateBarterButtons()
+{
+    let resCodes = g_ResourceData.GetCodes();
+    if (!g_BarterSell)
+        g_BarterSell = resCodes[0];
+
+    let canBarter = Engine.GuiInterfaceCall("PlayerCanBarter", g_ViewedPlayer);
+    Engine.GetGUIObjectByName("barterNoMarketsMessage").hidden = canBarter;
+    Engine.GetGUIObjectByName("barterResources").hidden = !canBarter;
+    if (!canBarter)
+        return;
+
+    for (let i = 0; i < resCodes.length; ++i)
+    {
+        let resCode = resCodes[i];
+        let barterButton = {};
+        let barterIcon = {};
+        let barterAmount = {};
+        for (let action of BARTER_ACTIONS)
+        {
+            barterButton[action] = Engine.GetGUIObjectByName("barter" + action + "Button[" + i + "]");
+            barterIcon[action] = Engine.GetGUIObjectByName("barter" + action + "Icon[" + i + "]");
+            barterAmount[action] = Engine.GetGUIObjectByName("barter" + action + "Amount[" + i + "]");
+        }
+        let selectionIcon = Engine.GetGUIObjectByName("barterSellSelection[" + i + "]");
+
+        let amountToSell = BARTER_RESOURCE_AMOUNT_TO_SELL;
+        if (Engine.HotkeyIsPressed("session.massbarter"))
+            amountToSell *= BARTER_BUNCH_MULTIPLIER;
+
+        let isSelected = resCode == g_BarterSell;
+        let grayscale = isSelected ? "color: 0 0 0 100:grayscale:" : "";
+
+        // Do we have enough of this resource to sell?
+        let neededRes = {};
+        neededRes[resCode] = amountToSell;
+        let canSellCurrent = Engine.GuiInterfaceCall("GetNeededResources", {
+            "cost": neededRes,
+            "player": g_ViewedPlayer
+        }) ? "color: 255 0 0 80:" : "";
+
+        // Let's see if we have enough resources to barter.
+        neededRes = {};
+        neededRes[g_BarterSell] = amountToSell;
+        let canBuyAny = Engine.GuiInterfaceCall("GetNeededResources", {
+            "cost": neededRes,
+            "player": g_ViewedPlayer
+        }) ? "color: 255 0 0 80:" : "";
+
+        barterIcon.Sell.sprite = canSellCurrent + "stretched:" + grayscale + "session/icons/resources/" + resCode + ".png";
+        barterIcon.Buy.sprite = canBuyAny + "stretched:" + grayscale + "session/icons/resources/" + resCode + ".png";
+
+        barterAmount.Sell.caption = "-" + amountToSell;
+        let prices = Engine.GuiInterfaceCall("GetBarterPrices");
+        barterAmount.Buy.caption = "+" + Math.round(prices.sell[g_BarterSell] / prices.buy[resCode] * amountToSell);
+
+        barterButton.Buy.onPress = function() { 
+            Engine.PostNetworkCommand({
+                "type": "barter",
+                "sell": g_BarterSell,
+                "buy": resCode,
+                "amount": amountToSell
+            });
+        };
+
+        barterButton.Buy.hidden = isSelected;
+        barterButton.Buy.enabled = controlsPlayer(g_ViewedPlayer);
+        barterButton.Sell.hidden = false;
+        selectionIcon.hidden = !isSelected;
+    }
+};
+
 function getIdleLandTradersText(traderNumber)
 {
     let active = traderNumber.landTrader.trading;

binaries/data/mods/public/gui/session/selection_panels.js

@@ -33 +33 @@
 
 let g_SelectionPanels = {};
 
-let g_BarterSell;
-
 g_SelectionPanels.Alert = {
     "getMaxNumberOfItems": function()
     {
@@ -110 +108 @@
     },
     "setupButton": function(data)
     {
+        // If more than four resources, don't display icons here at all
+        if (g_ResourceData.GetCodes().length > this.rowLength)
+            return;
+
         // data.item is the resource name in this case
         let button = {};
         let icon = {};
         let amount = {};
-        for (let a of BARTER_ACTIONS)
+        for (let action of BARTER_ACTIONS)
         {
-            button[a] = Engine.GetGUIObjectByName("unitBarter" + a + "Button[" + data.i + "]");
-            icon[a] = Engine.GetGUIObjectByName("unitBarter" + a + "Icon[" + data.i + "]");
-            amount[a] = Engine.GetGUIObjectByName("unitBarter" + a + "Amount[" + data.i + "]");
+            button[action] = Engine.GetGUIObjectByName("unitBarter" + action + "Button[" + data.i + "]");
+            icon[action] = Engine.GetGUIObjectByName("unitBarter" + action + "Icon[" + data.i + "]");
+            amount[action] = Engine.GetGUIObjectByName("unitBarter" + action + "Amount[" + data.i + "]");
         }
         let selectionIcon = Engine.GetGUIObjectByName("unitBarterSellSelection[" + data.i + "]");
 
@@ -161 +163 @@
         let isSelected = data.item == g_BarterSell;
         let grayscale = isSelected ? "color: 0 0 0 100:grayscale:" : "";
 
-        // do we have enough of this resource to sell?
+        // Do we have enough of this resource to sell?
         let neededRes = {};
         neededRes[data.item] = amountToSell;
         let canSellCurrent = Engine.GuiInterfaceCall("GetNeededResources", {
             "cost": neededRes,
             "player": data.player
-        }) ? "color:255 0 0 80:" : "";
+        }) ? "color: 255 0 0 80:" : "";
 
         // Let's see if we have enough resources to barter.
         neededRes = {};
@@ -175 +177 @@
         let canBuyAny = Engine.GuiInterfaceCall("GetNeededResources", {
             "cost": neededRes,
             "player": data.player
-        }) ? "color:255 0 0 80:" : "";
+        }) ? "color: 255 0 0 80:" : "";
 
         icon.Sell.sprite = canSellCurrent + "stretched:" + grayscale + "session/icons/resources/" + data.item + ".png";
         icon.Buy.sprite = canBuyAny + "stretched:" + grayscale + "session/icons/resources/" + data.item + ".png";
@@ -1217 +1219 @@
  */
 let g_PanelsOrder = [
     // LEFT PANE
-    "Barter", // Must always be visible on markets
+    "Barter", // Must always be visible on markets, if less than five resources
     "Garrison", // More important than Formation, as you want to see the garrisoned units in ships
     "Alert",
     "Formation",

binaries/data/mods/public/gui/session/selection_panels_helpers.js

@@ -1 @@
-const BARTER_RESOURCE_AMOUNT_TO_SELL = 100;
-const BARTER_BUNCH_MULTIPLIER = 5;
-const BARTER_ACTIONS = ["Sell", "Buy"];
 const GATE_ACTIONS = ["lock", "unlock"];
 
 const UPGRADING_NOT_STARTED = -2;

binaries/data/mods/public/gui/session/session.js

@@ -768 +768 @@
     updateBuildingPlacementPreview();
     updateTimeNotifications();
     updateIdleWorkerButton();
+    updateBarterButtons();
 
     if (g_ViewedPlayer > 0)
     {

binaries/data/mods/public/gui/session/top_panel/button_trade.xml

@@ -7 +7 @@
 >
     <!-- TODO make the button less ugly -->
     <object size="0 0 100% 100%" name="tradeButtonImage" type="image" sprite="stretched:session/icons/economics.png" ghost="true"/>
-    <translatableAttribute id="tooltip">Trade</translatableAttribute>
+    <translatableAttribute id="tooltip">Barter &amp; Trade</translatableAttribute>
     <action on="Press">
         toggleTrade();
     </action>

binaries/data/mods/public/gui/session/trade_window.xml

@@ -1 +1 @@
 <?xml version="1.0" encoding="utf-8"?>
 <object name="tradeDialogPanel"
-    size="50%-134 50%-130 50%+134 50%+100"
+    size="50%-80 50%-280 50%+80 50%+136"
     type="image"
     hidden="true"
     sprite="ModernDialog"
+    z="100"
 >
     <object type="text" style="TitleText" size="50%-96 -16 50%+96 16">
-        <translatableAttribute id="caption">Trade</translatableAttribute>
+        <translatableAttribute id="caption">Barter &amp; Trade Goods</translatableAttribute>
     </object>
 
-    <!-- Trading goods -->
-    <object name="tradeGoods" size="20 50 100%-20 82">
-        <object name="tradeHeader" size="0 0 180 100%" type="text" style="ModernLabelText" text_align="left" ghost="true">
-            <translatableAttribute id="caption">Trading goods selection:</translatableAttribute>
+
+    <!-- Barter Goods -->
+    <object size="24 24 100%-24 33%">
+
+        <object name="barterHeader" size="8 0 100% 32" type="text" style="ModernLeftLabelText">
+            <translatableAttribute id="caption">Barter</translatableAttribute>
         </object>
+        <object size="0 28 100% 29" type="image" sprite="ModernGoldLine"/>
+
+        <object size="0 38 100% 122">
+
+            <object size="0 0 60 41" type="text" style="ModernRightLabelText">
+                <translatableAttribute id="caption">Sell:</translatableAttribute>
+            </object>
+
+            <object size="0 100%-41 60 100%" type="text" style="ModernRightLabelText">
+                <translatableAttribute id="caption">Buy:</translatableAttribute>
+            </object>
+
+            <object size="72 0 100% 100%" type="text" style="ModernLabelText" name="barterNoMarketsMessage">
+                <translatableAttribute id="caption">No Markets Available</translatableAttribute>
+            </object>
+
+            <object name="barterResources" size="72 0 100% 100%">
+                <repeat count="8">
+                    <object name="barterResource[n]" size="0 0 58 100%">
+
+                        <!-- Sell -->
+                        <object name="barterSellButton[n]" style="iconButton" type="button" size="0 0 41 41" tooltip_style="sessionToolTipBottomBold" hidden="true">
+                            <object name="barterSellIcon[n]" type="image" ghost="true" size="3 3 100%-3 100%-3"/>
+                            <object name="barterSellAmount[n]" ghost="true" style="resourceText" type="text" size="0 0 100% 50%"/>
+                            <object name="barterSellSelection[n]" hidden="true" type="image" ghost="true" size="3 3 100%-3 100%-3" sprite="stretched:session/icons/corners.png"/>
+                        </object>
+
+                        <!-- Buy -->
+                        <object name="barterBuyButton[n]" style="iconButton" type="button" size="0 100%-41 41 100%" tooltip_style="sessionToolTipBottomBold" hidden="true">
+                            <object name="barterBuyIcon[n]" type="image" ghost="true" size="3 3 100%-3 100%-3"/>
+                            <object name="barterBuyAmount[n]" ghost="true" style="resourceText" type="text" size="0 0 100% 50%"/>
+                        </object>
 
-        <object size="180 0 100% 100%" name="tradeResources">
-            <repeat count="8">
-                <object name="tradeResource[n]" size="0 0 58 32">
-                    <object name="tradeResourceButton[n]" size="4 0 36 100%" type="button" style="StoneButton">
-                        <object name="tradeResourceIcon[n]" type="image" ghost="true"/>
-                        <object name="tradeResourceSelection[n]" type="image" sprite="stretched:session/icons/corners.png" ghost="true"/>
-                        <object name="tradeResourceText[n]" type="text" style="ModernLabelText" ghost="true"/>
-                    </object>
-                    <object name="tradeArrowUp[n]" size="36 0 52 50%" type="button" style="iconButton">
-                        <object type="image" ghost="true" sprite="StoneArrowUp"/>
                     </object>
-                    <object name="tradeArrowDn[n]" size="36 50% 52 100%" type="button" style="iconButton">
-                        <object type="image" ghost="true" sprite="StoneArrowDn"/>
+                </repeat>
+            </object>
+
+        </object>
+    </object>
+
+    <!-- Trading goods -->
+    <object size="24 33%+32 100%-24 100%-64">
+
+        <object name="tradeHeader" size="8 0 100% 32" type="text" style="ModernLeftLabelText">
+            <translatableAttribute id="caption">Trade</translatableAttribute>
+        </object>
+        <object size="0 28 100% 29" type="image" sprite="ModernGoldLine"/>
+
+        <object name="tradeGoods" size="0 38 100% 70">
+
+            <object size="0 0 60 100%" type="text" style="ModernRightLabelText">
+                <translatableAttribute id="caption">Goods:</translatableAttribute>
+            </object>
+
+            <object size="72 0 100% 100%" name="tradeResources">
+                <repeat count="8">
+                    <object name="tradeResource[n]" size="0 0 58 32">
+
+                        <object name="tradeResourceButton[n]" size="4 0 36 100%" type="button" style="StoneButton">
+                            <object name="tradeResourceIcon[n]" type="image" ghost="true"/>
+                            <object name="tradeResourceSelection[n]" type="image" sprite="stretched:session/icons/corners.png" ghost="true"/>
+                            <object name="tradeResourceText[n]" type="text" style="ModernLabelText" ghost="true"/>
+                        </object>
+                        <object name="tradeArrowUp[n]" size="36 0 52 50%" type="button" style="iconButton">
+                            <object type="image" ghost="true" sprite="StoneArrowUp"/>
+                        </object>
+                        <object name="tradeArrowDn[n]" size="36 50% 52 100%" type="button" style="iconButton">
+                            <object type="image" ghost="true" sprite="StoneArrowDn"/>
+                        </object>
+
                     </object>
-                </object>
-            </repeat>
+                </repeat>
+            </object>
+
             <object name="tradeHelp" size="100%-24 4 100% 28" enabled="false" type="button" style="StoneButton" tooltip_style="sessionToolTipBold">
                 <object size="20% 15% 80% 75%" type="image" ghost="true" sprite="iconInfoWhite"/>
             </object>
+
         </object>
-    </object>
 
-    <object name="tradeStatistics" size="20 90 100%-20 168">
-        <object name="landTraders" size="0 0 100% 50%" type="text" style="ModernLabelText" text_align="left" ghost="true" />
-        <object name="shipTraders" size="0 50% 100% 100%" type="text" style="ModernLabelText" text_align="left" ghost="true" />
+        <object name="traders" size="8 88 100% 100%" type="text" style="ModernLeftTabLabelText"/>
+
     </object>
 
     <object size="50%-64 100%-50 50%+64 100%-22" type="button" style="StoneButton">

binaries/data/mods/public/gui/session/unit_actions.js

@@ -1260 +1260 @@
                 return false;
 
             return {
-                "tooltip": translate("Select trading goods"),
+                "tooltip": translate("Barter & Trade"),
                 "icon": "economics.png"
             };
         },

binaries/data/mods/public/simulation/components/GuiInterface.js

@@ -150 +150 @@
     ret.alliedVictory = cmpEndGameManager.GetAlliedVictory();
 
     // Add bartering prices
-    let cmpBarter = Engine.QueryInterface(SYSTEM_ENTITY, IID_Barter);
-    ret.barterPrices = cmpBarter.GetPrices();
+    ret.barterPrices = this.GetBarterPrices();
 
     // Add Resource Codes, untranslated names and AI Analysis
     ret.resources = {
@@ -565 +564 @@
         };
 
     if (!cmpFoundation && cmpIdentity && cmpIdentity.HasClass("BarterMarket"))
-    {
-        let cmpBarter = Engine.QueryInterface(SYSTEM_ENTITY, IID_Barter);
-        ret.barterMarket = { "prices": cmpBarter.GetPrices() };
-    }
+        ret.barterMarket = { "prices": this.GetBarterPrices() };
 
     let cmpHeal = Engine.QueryInterface(ent, IID_Heal);
     if (cmpHeal)
@@ -1954 +1950 @@
     return QueryPlayerIDInterface(player).GetTradingGoods();
 };
 
+GuiInterface.prototype.GetBarterPrices = function()
+{
+    return Engine.QueryInterface(SYSTEM_ENTITY, IID_Barter).GetPrices();
+};
+
+GuiInterface.prototype.PlayerCanBarter = function(player)
+{
+    let playerEnt = Engine.QueryInterface(SYSTEM_ENTITY, IID_PlayerManager).GetPlayerByID(player);
+    return Engine.QueryInterface(SYSTEM_ENTITY, IID_Barter).PlayerHasMarket(playerEnt);
+};
+
 GuiInterface.prototype.OnGlobalEntityRenamed = function(msg)
 {
     this.renamedEntities.push(msg);
@@ -2018 +2025 @@
 
     "GetTraderNumber": 1,
     "GetTradingGoods": 1,
+    "GetBarterPrices": 1,
+    "PlayerCanBarter": 1,
 };
 
 GuiInterface.prototype.ScriptCall = function(player, name, args)