@page
@model IndexModel
@{
    Model.token = Request.Cookies["Auth"];
}

@if (string.IsNullOrEmpty(Model.token))
{
    <form asp-page-handler="SetToken" method="post">
    <div class="card" id="login_card">
        <div class="card-header">
            Login with Token
        </div>
        <div class="card-body">
            <p class="card-text">Enter your authorization token below:</p>
            <input asp-for="token" id="token" />
        </div>
        <div class="card-footer">
            <button class="btn btn-default">Submit</button>
        </div>
    </div>
</form>
}
else
{
    <div class="card-deck" style="display: none;">

    <input id="json_data" type="hidden" value="" />
    <div class="card" style="width: 18rem;">
        <div class="card-body">
            <h5 class="card-title" id="vehicle_name">Vehicle Name</h5>
            <h6 class="card-subtitle mb-2 text-muted" id="vehicle_vin"></h6>
            <p class="card-text">Current Battery Status: <a id="battery_level"></a>%</p>
            <p class="card-text">Range: <a id="battery_range"></a> <a id="range_units"></a></p>
        </div>
        <div class="card-footer">
            <a href="#" class="card-link" target="_blank" rel="noopener noreferrer" id="locate_vehicle_btn">Locate
                Vehicle</a>
            <a href="/?handler=Command&command=@Tesla.BasicCommands.Flash" class="card-link">Flash</a>
            <a href="/?handler=Command&command=@Tesla.BasicCommands.Honk" class="card-link">Honk</a>
            <a href="/?handler=Command&command=door_lock" class="card-link" id="lock_unlock_btn">Lock</a>

        </div>
    </div>

    <div class="card" style="width: 18rem;">
        <div class="card-header">
            Climate
        </div>
        <div class="card-body">
            <p class="card-text">Climate Status: <a id="climate_status"></a></p>
            <p class="card-text">Outside Temp: <a id="outside_temp"></a> <a class="temp_units"></a></p>
            <p class="card-text">Inside Temp: <a id="inside_temp"></a> <a class="temp_units"></a></p>
            <p class="card-text">Climate Set Temp: <input asp-for="climateTemp" type="number" id="climate_setting" />
            </p>
        </div>
        <div class="card-footer">
            <a href="/?handler=Command&command=@Tesla.BasicCommands.ClimateOn" class="card-link">Start Climate</a>

        </div>
    </div>

    <div class="card" id="charge_state_card" style="width: 18rem; display: none;">
        <div class="card-header">
            Charge Status
        </div>
        <div class="card-body">
            <p class="card-text">Connected Cable: <a id="connected_cable"></a></p>
            <p class="card-text">Current power: <a id="current_current"></a> kW</p>
            <p id="till_full" class="card-text" style="display: none;">Time till full: <a id="time_to_full"></a></p>
        </div>

        <div class="card-footer">
            <small class="text-muted" id="connection_ind"></small>
            <a asp-page-handler="Command" id="charge_ctrl_btn" class="card-link">Stop Charging</a>
            <a asp-page-handler="Command" id="toggle_charge_port" class="card-link">Unlock Charge Port</a>

        </div>
    </div>



</div>

}