@using System
@using Sandbox
@using Sandbox.UI
@namespace BrickJam.UI
@inherits Panel

<root>
	<div class="container">
		<label class="currency">$</label>
		<label>@DisplayMoney</label>
	</div>
</root>

@code {
	private float shown;

	private int Money => Player.Local?.Money ?? 0;
	private string DisplayMoney => $"{(int)(shown + 0.5f):n0}";

	public override void Tick()
	{
		shown = MathX.LerpTo( shown, Money, 10f * Time.Delta );
	}

	protected override int BuildHash() => HashCode.Combine( (int)(shown + 0.5f) );
}

<style>
	MoneyCounter {
		position: absolute;
		right: 0;
		top: 30px;
		padding: 5px 10px 0 40px;
		font-size: 50px;
		color: white;
		flex-direction: row-reverse;
		background: linear-gradient(to left, rgba(0,0,0,0.5) 0%, rgba(0,0,0,0.2) 75%, rgba(0,0,0,0) 100%);

		.container {
			flex-direction: row;
			text-shadow: 4px 4px 0px black;
		}

		.currency {
			padding-right: 5px;
			font-size: 32px;
			top: 8px;
			color: rgba(50, 205, 50, 1);
		}
	}
</style>