{{define "title"}}Statping | Setup{{end}}
{{define "description"}}Setup your Statping instance to monitor your websites and servers using MySQL, Postgres or SQLite.{{end}}
{{define "content"}}
<div class="container col-md-7 col-sm-12 mt-md-5 bg-light">
    <div class="col-6 offset-3 mt-2 mb-5">
        <img width="100%" src="/banner.png">
    </div>
    <div class="col-12">
    {{ if .Error }}
        <div class="alert alert-danger" role="alert">
            {{ .Error }}
        </div>
    {{ end }}
        <form method="POST" id="setup_form" action="/setup">
            <div class="row">
                <div class="col-6">
                    <div class="form-group">
                        <label for="inputState">Database Connection</label>
                        <select id="database_type" name="db_connection" class="form-control">
                            <option selected value="postgres">Postgres</option>
                            <option value="sqlite">Sqlite</option>
                            <option value="mysql">MySQL</option>
                        </select>
                    </div>
                    <div class="form-group" id="db_host">
                        <label for="db_host_in">Host</label>
                        <input type="text" name="db_host" id="db_host_in" class="form-control" value="{{.DbHost}}" placeholder="localhost">
                    </div>
                    <div class="form-group" id="db_port">
                        <label for="db_port_in">Database Port</label>
                        <input type="text" name="db_port" id="db_port_in" class="form-control" value="{{.DbPort}}" placeholder="localhost">
                    </div>
                    <div class="form-group" id="db_user">
                        <label for="db_user_in">Username</label>
                        <input type="text" name="db_user" id="db_user_in" class="form-control" value="{{.DbUser}}" placeholder="root">
                    </div>
                    <div class="form-group" id="db_password">
                        <label for="db_password">Password</label>
                        <input type="password" name="db_password" class="form-control" value="{{.DbPass}}" id="db_password" placeholder="password123">
                    </div>
                    <div class="form-group" id="db_database">
                        <label for="db_database">Database</label>
                        <input type="text" name="db_database" class="form-control" value="{{.DbData}}" id="db_database" placeholder="Database name">
                    </div>

                </div>

                <div class="col-6">

                    <div class="form-group">
                        <label for="project">Project Name</label>
                        <input type="text" name="project" class="form-control" value="{{.Project}}" id="project" placeholder="Great Uptime" required>
                    </div>

                    <div class="form-group">
                        <label for="description">Project Description</label>
                        <input type="text" name="description" class="form-control" value="{{.Description}}" id="description" placeholder="Great Uptime">
                    </div>

                    <div class="form-group">
                        <label for="domain_input">Domain URL</label>
                        <input type="text" name="domain" class="form-control" value="{{.Domain}}" id="domain_input" required>
                    </div>

                    <div class="form-group">
                        <label for="username">Admin Username</label>
                        <input type="text" name="username" class="form-control" value="{{.Username}}" id="username" value="admin" placeholder="admin" required>
                    </div>

                    <div class="form-group">
                        <label for="email">Admin Email Address</label>
                        <input type="email" name="email" class="form-control" value="{{.Email}}" id="email" placeholder="info@admin.com" required>
                    </div>

                    <div class="form-group">
                        <label for="password">Admin Password</label>
                        <input type="password" name="password" class="form-control" value="{{.Password}}" id="password" placeholder="password" required>
                    </div>

                    <div class="form-group">
              <span class="switch">
                <input type="checkbox" name="sample_data" class="switch" id="switch-normal" checked>
                <label for="switch-normal">Load Sample Data</label>
              </span>
                    </div>

                </div>
                <button id="setup_button" type="submit" class="btn btn-primary btn-block disable_click">Save Settings</button>
            </div>
        </form>
    </div>
</div>
{{end}}
{{define "extra_scripts"}}
<script src="/js/setup.js"></script>
{{end}}