{% extends 'layouts/base.html' %}

{% block title %} {{cloudName}} {% endblock title %}

{% block stylesheets %}
<link rel="stylesheet" href="/static/assets/css/style.css">
<link rel="stylesheet" href="/static/assets/css/dataTables.min.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<!-- <link href="https://cdn.datatables.net/1.10.20/css/jquery.dataTables.min.css" rel="stylesheet"> -->
<style>
    #colo {
        color: brown;
    }

    /* CSS link color (red) */
    #colo:hover {
        color: blue;
    }

    /* CSS link hover (green) */


    .sticky-header {
        position: sticky;
        top: 0;
        z-index: 999;
        /* Adjust this value if necessary */
        background-color: #fff;
        /* Set the desired background color for the sticky header */
        /* Add any additional styling for the sticky header */
    }
</style>

{% endblock stylesheets %}

{% block content %}
<div class="header bg-primary pb-6">
    <div class="container-fluid">
        <div class="header-body">
            <div class="row align-items-center py-4">
                <div class="col-lg-6 col-7">


                </div>
                <div class="col-lg-6 col-7 text-right">
                    <nav aria-label="breadcrumb" class="d-none d-md-inline-block">
                        <h3>Session time: <span id="session-time"></span></h3>
                    </nav>
                </div>
            </div>
            <!-- Card stats -->
        </div>
    </div>
</div>

<div class="container-fluid mt--6">
    <div class="row">
        <div class="col-xl-12">
            <div class="card">
                <div class="card-header border-0">
                    <div class="row align-items-center">
                        <div class="col">
                            <h3 class="mb-0">Agent Creation Form </h3>
                            <div class="row">
                                
                                <br>
                                <div class="card-body">
                                    <form action="/createAgent" method="post">
                                        <div class="pl-lg-4">
                                            <div class="row">
                                                <div class="col-lg-6">
                                                    <div class="form-group">
                                                        <label class="form-control-label" for="input-username">Enter the Cloudname <span class="text-danger">*</span></label>
                                                        <input type="text" id="input-username" class="form-control" placeholder="CloudName" name="clientCloudName" required>
                                                    </div>
                                                    <div class="form-group">
                                                        <label class="form-control-label" for="input-username">Enter the Primary Paracloud FQDN <span class="text-danger">*</span></label>
                                                        <input type="text" id="input-username" class="form-control" placeholder="Primary FQDN" name="primaryFqdn" required>
                                                    </div>
                                                    <div class="form-group">
                                                        <label class="form-control-label" for="input-username">Additional - Secondary FQDN</label>
                                                        <input type="text" id="input-username" class="form-control" placeholder="Secondary FQDN" name="secondaryFqdn">
                                                    </div>
                                                    <div class="form-group">
                                                        <label class="form-control-label" for="input-username">What is the Agent Type <span class="text-danger">*</span></label>
                                                        <select class="form-control" id="dropdown2" name="agentType" required>
                                                            <option value="" disabled selected>Select an option</option>
                                                            <option value="Mac">Mac</option>
                                                            <option value="Windows">Windows</option>
                                                            <option value="Linux">Linux</option>
                                                        </select>
                                                    </div>
                                                    <div class="form-group">
                                                        <label class="form-control-label" for="input-username">What type of Login method required <span class="text-danger">*</span></label>
                                                        <select class="form-control" id="dropdown2" name="logintype" required>
                                                            <option value="" disabled selected>Select an option</option>
                                                            <option value="Silent">Silent</option>
                                                            <option value="Non-Silent">Non-Silent</option>
                                                        </select>
                                                    </div>
                                                    <div class="form-group">
                                                        <label class="form-control-label" for="input-username">Would you like to Enable Proxy <span class="text-danger">*</span></label>
                                                        <select class="form-control" id="dropdown2" name="proxytype" required>
                                                            <option value="" disabled selected>Select an option</option>
                                                            <option value="Enabled">Enabled</option>
                                                            <option value="Disabled">Disabled</option>
                                                        </select>
                                                    </div>
                                                    <div class="form-group">
                                                        <label class="form-control-label" for="input-username">IP override settings <span class="text-danger">*</span></label>
                                                        <select class="form-control" id="dropdown2" name="IpSettings" required>
                                                            <option value="" disabled selected>Select an option</option>
                                                            <option value="True">True</option>
                                                            <option value="False">False</option>
                                                        </select>
                                                    </div>
                                                </div>
                                                
                                                <div class="col-lg-6">
                                                    <div class="form-group">
                                                        <label class="form-control-label" for="input-username">Agent Version <span class="text-danger">*</span></label>
                                                        <input type="text" id="input-username" class="form-control" placeholder="Agent Version" name="agentversion" required>
                                                    </div>
                                                    <div class="form-group">
                                                        <label class="form-control-label" for="input-username">Option for Bruteforce</label>
                                                        <input type="text" id="input-username" class="form-control" placeholder="Username" name="bruteforce">
                                                    </div>
                                                    <div class="form-group">
                                                        <label class="form-control-label" for="input-username">Would you like to Hide Agent from Control Panel</label>
                                                        <input type="text" id="input-username" class="form-control" placeholder="Username" name="cloudname">
                                                    </div>
                                                    <div class="form-group">
                                                        <label class="form-control-label" for="input-username">Browser Preferences</label>
                                                        <input type="text" id="input-username" class="form-control" placeholder="Username" name="cloudname">
                                                    </div>
                                                    <div class="form-group">
                                                        <label class="form-control-label" for="input-username">Sleep time to wait and get authcode field if AAD enabled</label>
                                                        <input type="text" id="input-username" class="form-control" placeholder="Username" name="cloudname">
                                                    </div>
                                                    <div class="form-group">
                                                        <label class="form-control-label" for="input-username">Time interval to launch Blusync Agent if not running</label>
                                                        <input type="text" id="input-username" class="form-control" placeholder="Username" name="cloudname">
                                                    </div>
                                                    <div class="form-group">
                                                        <label class="form-control-label" for="input-username">Is this a fresh install or an agent update <span class="text-danger">*</span></label>
                                                        <select class="form-control" id="dropdown2" name="installType" required>
                                                            <option value="" disabled selected>Select an option</option>
                                                            <option value="new">New</option>
                                                            <option value="old">Old</option>
                                                        </select>
                                                    </div>
                                                </div>
                                                
                                            </div>
                                        </div>
                                        <div class="col-md-4">
                                            <button type="submit" class="btn btn-primary">Save</button>
                                        </div>
                                    </form>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>


{% endblock content %}


{% block javascripts %}
<script>
    function updateSessionTime() {
        var start = new Date('{{ session.logged_in_at }}' * 1000);  // Convert Unix timestamp to JavaScript date
        var now = new Date();
        var elapsed = now - start;
        var hours = Math.floor(elapsed / (1000 * 60 * 60));
        var minutes = Math.floor((elapsed / (1000 * 60)) % 60);
        var seconds = Math.floor((elapsed / 1000) % 60);
        var sessionTime = hours + ':' + minutes.toString().padStart(2, '0') + ':' + seconds.toString().padStart(2, '0');
        document.getElementById('session-time').textContent = sessionTime;
    }
    setInterval(updateSessionTime, 1000);  // Update session time every second
  </script>
  
{% endblock javascripts %}