{{ define "page" }}
	<link rel="stylesheet" type="text/css" href="/css/{{ .VERSION }}/datapoints.css">

	<script type="module" defer>
		import {UI} from "/js/{{ .VERSION }}/datapoint_edit.mjs"
		window._ui = new UI()
	</script>

	{{ block "page_label" . }}{{end}}

	<form id="form-trigger" action="/datapoint/update/{{ .Data.Datapoint.ID }}" method="post">
	<div id="widgets" class="widgets">
		<div class="label">Group</div>
		<div><input type="text" name="group" value="{{ .Data.Datapoint.Group }}"></div>

		<div class="label">Name</div>
		<div><input type="text" name="name" value="{{ .Data.Datapoint.Name }}"></div>
		
		<div class="label">Datatype</div>
		<div>
			<select name="datatype">
				<option {{ if eq .Data.Datapoint.Datatype "INT" }}selected{{end}}>INT</option>
				<option {{ if eq .Data.Datapoint.Datatype "STRING" }}selected{{end}}>STRING</option>
				<option {{ if eq .Data.Datapoint.Datatype "DATETIME" }}selected{{end}}>DATETIME</option>
			</select>
		</div>

		<div></div>
		<div class="action">
			{{ if eq .Data.Datapoint.ID 0 }}
			<button id="button-update">Create</button>
			{{ else }}
			<button id="button-update">Update</button>
			{{ end }}
		</div>
	</form>

{{ end }}