{{ define "title" }}
	Network.Connect
{{ end }}

{{ define "main" }}
	<div class="alert alert-warning" role="alert">
        <button type="button" class="close" data-dismiss="alert" aria-label="Close">
            <span aria-hidden="true">&times;</span>
        </button>
    	<div>
            Template of connection:
            <br>
            proto://addr.domen:port
        </div>
    </div>
	<form class="text-center" method="POST" action="/network/connect">
		<div class="form-group">
			<input type="submit" name="check" value="Check connections" class="btn btn-info w-100">
		</div>
	</form>
	<form class="text-center" method="POST" action="/network/connect">
		<div class="form-group">
			<input type="text" class="form-control bg-dark text-light" name="hostname" placeholder="Hostname">
		</div>
		<div class="form-group">
			<input type="password" class="form-control bg-dark text-light" name="password" placeholder="Password">
		</div>
		<div class="form-group">
			<input type="submit" name="append" value="Append connection" class="btn btn-success w-100">
		</div>
	</form>
	{{ range .Connects }}
		<div class="form-group row">
			<div class="col-md-9 w-75">
				<button type="button" class="btn btn-secondary divtext w-100" disabled>
					<div class="text-truncate">{{ index . 0 }}</div>
				</button>
			</div>
			<div class="col-md-3 w-25">
				<form class="text-center" method="POST" action="/network/connect">
					<input type="hidden" name="hostname" value="{{ index . 0 }}">
					<input type="submit" name="delete" value="Delete" class="btn btn-danger text-truncate w-100">
				</form>
			</div>
		</div>
	{{ end }}
{{ end }}