3D buttons (still needs a little work)

OpenRA.Game/Chrome.cs

@@ -136,6 +136,8 @@ public Chrome(Renderer r, Manifest m)
 		}
 
 		public Widget rootWidget;
+		public Widget selectedWidget;
+
 		List<string> visibleTabs = new List<string>();
 
 		public void Tick(World world)
@@ -1045,6 +1047,12 @@ void HandleBuildPalette( World world, string item, bool isLmb )
 		int2 lastMousePos;
 		public bool HandleInput(World world, MouseInput mi)
 		{
+			if (selectedWidget != null)
+			{
+				selectedWidget.HandleInput(mi);
+				return true;
+			}
+
 			if (rootWidget.HandleInput(mi))
 				return true;
 
@@ -1065,6 +1073,9 @@ public bool HandleInput(World world, MouseInput mi)
 
 		public bool HitTest(int2 mousePos)
 		{
+			if (selectedWidget != null)
+				return true;
+
 			return rootWidget.GetEventBounds().Contains(mousePos.X, mousePos.Y) 
 				|| buttons.Any(a => a.First.Contains(mousePos.ToPoint()));
 		}

OpenRA.Game/Chrome/ButtonWidget.cs

@@ -7,6 +7,37 @@ namespace OpenRA.Widgets
 	class ButtonWidget : Widget
 	{
 		public readonly string Text = "";
+		public bool Depressed = false;
+		public int VisualHeight = 1;
+		public override bool HandleInput(MouseInput mi)
+		{
+			if (Game.chrome.selectedWidget == this)
+				Depressed = (GetEventBounds().Contains(mi.Location.X,mi.Location.Y)) ? true : false;
+
+			// Relinquish focus
+			if (Game.chrome.selectedWidget == this && mi.Event == MouseInputEvent.Up)
+			{
+				Game.chrome.selectedWidget = null;
+				Depressed = false;
+			}
+
+			// Are we able to handle this event?
+			if (!Visible || !GetEventBounds().Contains(mi.Location.X,mi.Location.Y))
+				return base.HandleInput(mi);
+
+			// Give button focus only while the mouse is down
+			// This is a bit of a hack: it will become cleaner soonish
+			// It will also steal events from any potential children
+			// We also want to play a click sound
+			if (mi.Event == MouseInputEvent.Down)
+			{
+				Game.chrome.selectedWidget = this;
+				Depressed = true;
+				return true;
+			}
+
+			return base.HandleInput(mi);
+		}
 
 		public override void Draw()
 		{
@@ -16,7 +47,8 @@ public override void Draw()
 				return;
 			}
 
-			string collection = "dialog2";
+			string collection = (Depressed) ? "dialog3" : "dialog2";
+			int2 stateOffset = (Depressed) ? new int2(VisualHeight,VisualHeight) : new int2(0,0);
 			Game.chrome.renderer.Device.EnableScissor(Bounds.Left, Bounds.Top, Bounds.Width, Bounds.Height);
 
 			string[] images = { "border-t", "border-b", "border-l", "border-r", "corner-tl", "corner-tr", "corner-bl", "corner-br", "background" };
@@ -45,7 +77,7 @@ public override void Draw()
 			Game.chrome.rgbaRenderer.DrawSprite(ss[7], new float2(Bounds.Right - ss[7].size.X, Bounds.Bottom - ss[7].size.Y), "chrome");
 			Game.chrome.rgbaRenderer.Flush();
 
-			Game.chrome.renderer.BoldFont.DrawText(Game.chrome.rgbaRenderer, Text, new int2(Bounds.X+Bounds.Width/2, Bounds.Y+Bounds.Height/2) - new int2(Game.chrome.renderer.BoldFont.Measure(Text).X / 2, Game.chrome.renderer.BoldFont.Measure(Text).Y/2), Color.White);
+			Game.chrome.renderer.BoldFont.DrawText(Game.chrome.rgbaRenderer, Text, new int2(Bounds.X+Bounds.Width/2, Bounds.Y+Bounds.Height/2) - new int2(Game.chrome.renderer.BoldFont.Measure(Text).X / 2, Game.chrome.renderer.BoldFont.Measure(Text).Y/2) + stateOffset, Color.White);
 
 			Game.chrome.renderer.Device.DisableScissor();
 

OpenRA.Game/Chrome/Widget.cs

@@ -87,9 +87,9 @@ public virtual bool HandleInput(MouseInput mi)
 
 			// Mousedown
 			// todo: route the other events too!
-			if (InputHandler.Value != null && mi.Event == MouseInputEvent.Down)
+			if (InputHandler.Value != null && mi.Event == MouseInputEvent.Up)
 				return InputHandler.Value.OnClick(this, mi);
-			
+
 			return false;
 		}
 

mods/cnc/chrome.xml

@@ -142,6 +142,17 @@
 		<image name="corner-tr" x="82" y="0" width="1" height="1" />
 		<image name="corner-bl" x="0" y="82" width="1" height="1" />
 		<image name="corner-br" x="82" y="82" width="1" height="1" />
+	</collection>
+		<collection name="dialog3" src="dialog3.png">
+		<image name="background" x="1" y="1" width="126" height="126" />
+		<image name="border-r" x="127" y="1" width="1" height="126" />
+		<image name="border-l" x="0" y="1" width="1" height="126" />
+		<image name="border-b" x="1" y="127" width="126" height="1" />
+		<image name="border-t" x="1" y="0" width="126" height="1" />
+		<image name="corner-tl" x="0" y="0" width="1" height="1" />
+		<image name="corner-tr" x="82" y="0" width="1" height="1" />
+		<image name="corner-bl" x="0" y="82" width="1" height="1" />
+		<image name="corner-br" x="82" y="82" width="1" height="1" />
 	</collection>
 	<collection name="spawnpoints" src="spawnpoints.png">
 		<image name="unowned" x="16" y="0" width="16" height="16" />

mods/ra/chrome.xml

@@ -132,6 +132,17 @@
 		<image name="corner-br" x="252" y="252" width="4" height="4" />
 		<image name="background" x="4" y="4" width="248" height="248" />
 	</collection>
+	<collection name="dialog3" src="widget-panel.png">
+		<image name="border-t" x="4" y="0" width="248" height="4" />
+		<image name="border-b" x="4" y="252" width="248" height="4" />
+		<image name="border-l" x="0" y="4" width="4" height="248" />
+		<image name="border-r" x="252" y="4" width="4" height="248" />
+		<image name="corner-tl" x="0" y="0" width="4" height="4" />
+		<image name="corner-tr" x="252" y="0" width="4" height="4" />
+		<image name="corner-bl" x="0" y="252" width="4" height="4" />
+		<image name="corner-br" x="252" y="252" width="4" height="4" />
+		<image name="background" x="4" y="4" width="248" height="248" />
+	</collection>
 	<collection name="dialog" src="dialog.png">
 		<image name="background" x="0" y="0" width="624" height="384" />
 		<image name="border-r" x="624" y="0" width="14" height="200" />