<%if (previewToggleable) { %>
<div class="form-group mb-1 row">
    <div class="col-sm-11 offset-sm-1">
        <label class="DescartesUILabel">
            <input type="checkbox" class="form-check-input" name="showPreview" />
            <%=showPrintPreviewMessage%>
        </label>
    </div>
</div>
<% } %>
<%if (formatEditable) { %>
<div class="form-group mb-1 row">
    <label class="DescartesUILabel col-sm-4 col-form-label"><%=paperInput%></label>
    <div class="col-sm-8">
        <select name="paper" id="paper" class="DescartesUISelect form-control form-control-sm">
            <%_.each(papers,function(paper){%>
            <option value="<%=paper.value%>" <%= paper.value === defaultFormatCode ? 'selected' : '' %>><%=paper.text%></option>
            <%});%>
        </select>
    </div>
</div>
<% } %>
<%if (dpiEditable) { %>
<div class="form-group mb-1 row">
    <label class="DescartesUILabel col-sm-4 col-form-label"><%=dpiInput%></label>
    <div class="col-sm-8">
        <select name="dpi" id="dpi" class="DescartesUISelect form-control form-control-sm">
            <%_.each(resolutions,function(resolution){%>
                <option value="<%=resolution%>" <%= resolution === dpi ? 'selected' : '' %>><%=resolution%></option>
            <%});%>
        </select>
    </div>
</div>
<% } %>
<%if (projectionEditable) { %>
<div class="form-group mb-1 row">
	<label class="DescartesUILabel col-sm-4 col-form-label"><%=projectionInput%></label>  
	<div class="col-md-8 col-lg-8">
		<% if (projections.length === 1) {%>
			<label  class="DescartesUILabel col-form-label"><%=projections[0].value%></label>
		<%} else {%>
    		<select name="projectionSelect" id="projectionSelect" class="DescartesUISelect form-control">
            	<% for (var i = 0, len = projections.length; i < len; i++) { %>
    				<option value="<%=projections[i].code%>" 
    				<% if (selectedProjection === i) { %>
    				selected ><%=projections[i].value%></option>
    				<%} else {%>
    					><%=projections[i].value%></option>
        			<%}%>
    			<%}%>
			</select>
    	<% }%>
    </div>	    
</div>
<% } %>
<%if (marginEditable) { %>
<div class="form-group mb-1 row">
    <label class="DescartesUILabel col-sm-4 col-form-label mt-auto mb-auto"><%=marginsGroupInput%></label>
    <div class="col-sm-8">
        <div class="form-group mb-1 row col-sm-12">
            <div class="col-sm-7 mx-auto">
                <input type="number" step="any" min="0" required="true" class="DescartesUIInput form-control form-control-sm" name="marginTopInput" value="<%=marginTop%>"></input>
            </div>
        </div>
        <div class="form-group mb-1 row col-sm-12">
            <div class="col-sm-6 p-1">
                <input type="number" step="any" min="0" required="true" class="DescartesUIInput form-control form-control-sm" name="marginLeftInput" value="<%=marginLeft%>"></input>
            </div>
            <div class="col-sm-6 p-1">
                <input type="number" step="any" min="0" required="true" class="DescartesUIInput form-control form-control-sm" name="marginRightInput" value="<%=marginRight%>"></input>
            </div>
        </div>
        <div class="form-group mb-1 row col-sm-12">
            <div class="col-sm-7 mx-auto">
                <input type="number" step="any" min="0" required="true" class="DescartesUIInput form-control form-control-sm" name="marginBottomInput" value="<%=marginBottom%>"></input>
            </div>
        </div>
    </div>
</div>
<% } %>
<%if (legendToggleable) { %>
<div class="form-group mb-0 row">
    <div class="col-sm-11 offset-sm-1">
        <label class="DescartesUILabel">
            <input type="checkbox" class="form-check-input toggle-block" name="legend" <%= legendEnabled ? 'checked' : '' %>/>
            <%=printLegendLabel%>
        </label>
    </div>
</div>
<% } %>
<%if (projectionToggleable) { %>
<div class="form-group mb-0 row">
    <div class="col-sm-11 offset-sm-1">
        <label class="DescartesUILabel">
            <input type="checkbox" class="form-check-input toggle-block" name="projection" <%= projectionEnabled ? 'checked' : '' %>/>
            <%=printProjectionLabel%>
        </label>
    </div>
</div>
<% } %>
<%if (scaleBarToggleable) { %>
<div class="form-group mb-0 row">
    <div class="col-sm-11 offset-sm-1">
        <label class="DescartesUILabel">
            <input type="checkbox" class="form-check-input toggle-block" name="scaleBar" <%= scaleBarEnabled ? 'checked' : '' %>/>
            <%=printScaleLabel%>
        </label>
    </div>
</div>
<% } %>
<%if (northArrowToggleable) { %>
<div class="form-group mb-0 row">
    <div class="col-sm-11 offset-sm-1">
        <label class="DescartesUILabel">
            <input type="checkbox" class="form-check-input toggle-block" name="northArrow" <%= northArrowEnabled ? 'checked' : '' %>/>
            <%=printNorthLabel%>
        </label>
    </div>
</div>
<% } %>
<%if (titleToggleable) { %>
<div class="form-group mb-2 row">
    <%if (titleToggleable) { %>
    <div class="col-sm-4 offset-sm-1">
        <label class="DescartesUILabel">
                <input type="checkbox" class="form-check-input toggle-block" name="title" <%= titleEnabled ? 'checked' : '' %>/>
                <%=printTitleLabel%>
        </label>
    </div>
    <%if (titleEditable) { %>
    <div id="title-input" class="col-sm-6">
        <input type="text" class="form-control form-control-sm" name="title-text" value="<%= title %>"/>
    </div>
    <% } %>
    <% } %>
</div>
<% } %>
<%if (descriptionToggleable) { %>
<div class="form-group mb-2 row">
    <%if (descriptionToggleable) { %>
    <div class="col-sm-4 offset-sm-1">
        <label class="DescartesUILabel">
                <input type="checkbox" class="form-check-input toggle-block" name="description" <%= descriptionEnabled ? 'checked' : '' %>/>
                <%=printDescriptionLabel%>
        </label>
    </div>
    <%if (descriptionEditable) { %>
    <div id="description-input" class="col-sm-6">
        <textarea class="form-control form-control-sm" name="description-text" value="<%= description %>"><%= description %></textarea>
    </div>
    <% } %>
    <% } %>
</div>
<% } %>
<%if (dateToggleable) { %>
<div class="form-group mb-0 row">
    <div class="col-sm-11 offset-sm-1">
        <label class="DescartesUILabel">
            <input type="checkbox" class="form-check-input toggle-block" name="date" <%= dateEnabled ? 'checked' : '' %>/>
            <%=printDateLabel%>
        </label>
    </div>
</div>
<% } %>
<%if (qrCodeToggleable) { %>
<div class="form-group mb-0 row">
    <div class="col-sm-11 offset-sm-1">
        <label class="DescartesUILabel">
            <input type="checkbox" class="form-check-input toggle-block" name="qrCode" <%= qrCodeEnabled ? 'checked' : '' %>/>
            <%=printQRLabel%>
        </label>
    </div>
</div>
<% } %>
