{% extends "base.html" %}
{% block content %}
<div class="starter-template">
	{% if msg %}
		<div class="alert alert-danger" role="alert">{{msg}}</div>
	{% endif %}
	<legend>{{h1}}</legend>
	<div class="alert alert-info">Setting changes will take effect immediately and does not require restart.</div>
	<div class="alert alert-warning">Resolution and color changes would not effect existing plates.</div>
	<form action="" method="post" class="edit-page">

		<h3>Projector</h3>
		<div class="row">
			<div class="col-md-3">
				<label for="ProjectorWidth">Projector Resolution Width</label>
				<input value="{{conf.ProjectorWidth}}" name="ProjectorWidth" id="ProjectorWidth" type="number" required>
			</div>
			<div class="col-md-3">
				<label for="ProjectorHeight">Projector Resolution Height</label>
				<input value="{{conf.ProjectorHeight}}" name="ProjectorHeight" id="ProjectorHeight" type="number" required>
				<br>
			</div>
			<div class="col-md-3">
				<label for="XYRes">X/Y Resolution <span class="label label-default">Micron</span>{{helpModal("xy-resolution")}}</label>
				<input value="{{conf.XYRes}}" name="XYRes" id="XYRes" step="0.001" type="number" min="1" required>
			</div>
			<div class="col-md-3">
				<label for="ZRes">Z Resolution <span class="label label-default">Micron</span>{{helpModal("z-resolution")}}</label>
				<input value="{{conf.ZRes}}" name="ZRes" id="ZRes" step="0.001" type="number" min="1" required>
			</div>
		</div>

		<h3>Rendering Details</h3>
		<div class="row">
			<div class="col-md-6">
				<label for="AutoCenter">Auto Center{{helpModal("auto-center")}}</label>
				<select name="AutoCenter" id="AutoCenter">
					<option value="0" {% if conf.AutoCenter==0 %}selected{% endif %}>Center Pieces</option>
					<option value="1" {% if conf.AutoCenter==1 %}selected{% endif %}>Center Origin</option>
					<option value="2" {% if conf.AutoCenter==2 %}selected{% endif %}>Disable</option>
				</select>
			</div>
			<div class="col-md-6">
				<label for="Color">Color {{helpModal("color")}}</label>
				{% if conf.Color %}
					<input value="{{conf.Color}}" name="Color" id="Color" type="color">
				{% else %}
					<input value="#ffffff" name="Color" id="Color" type="color">
				{% endif %}
			</div>
		</div>

		<h3>Pixel Dimming{{helpModal("dimming")}}</h3>
		<div class="row">
			<div class="col-md-3">
				<label for="PixelDiming">Dimming Type</label>
				<select name="PixelDiming" id="PixelDiming">
					<option value="0" {% if conf.PixelDiming==0 %}selected{% endif %}>Off</option>
					<option value="1" {% if conf.PixelDiming==1 %}selected{% endif %}>Checkerboard</option>
					<option value="2" {% if conf.PixelDiming==2 %}selected{% endif %}>Homogeneous</option>
				</select>
			</div>
			<div class="col-md-3">
				<label for="DimAmount">Dimming Amount Percentage</label>
				<input value="{{conf.DimAmount}}" name="DimAmount" id="DimAmount" step="0.1" min="0" max="100" type="number">
			</div>
			<div class="col-md-3">
				<label for="DimWall">Wall Around Dimming</label>
				<input value="{{conf.DimWall}}" name="DimWall" id="DimWall" step="1" type="number">
			</div>
			<div class="col-md-3">
				<label for="DimSkip">Skip Dimming for Early Layers</label>
				<input value="{{conf.DimSkip}}" name="DimSkip" id="DimSkip" step="1" type="number">
			</div>
		</div>

		<br>
		<button type="submit" class="btn btn-success">Submit</button>
	</form>
	<br>
	<br>
</div>
{% endblock %}