{% from "_formhelpers.html" import render_field %}
{% extends "base.html" %}

{% block title %}Homepage Configuration{% endblock %}

{% block menu_items %}
    <li><a href="{{url_for('homepage')}}">Homepage</a></li>
    <li><a href="{{url_for('view_gables_data')}}">View Gables Data</a></li>
    <li><a href="{{url_for('view_data')}}">View Other Data</a></li>
    <li><a href="{{url_for('about')}}">About Us</a></li>
    <li><a href="{{url_for('contact')}}">Contact Us</a></li>
    <li class="current_page_item"><a href="{{url_for('admin_home')}}">Admin</a></li>
{% endblock %}

{% block content %}
	<div id="wrapper1">
		<div class="container">
			<div class="content" style="padding: 30px 0px;">
                <a href="{{request.referrer}}"><< Cancel</a>

                <h2 style="text-align: center; margin-bottom: 25px;">Editing Homepage Locations</h2>

				<form method="post">
					{{ form.hidden_tag() }}

                    <h3 style="color: #008080;">Islands of Cocoplum</h3>
                    <div class="columns">
						<div class="column1">{{ render_field(form.cocoplum_hydrovu_id) }}</div>
						<div class="column2">
                            {{ render_field(form.cocoplum_boat_clearance_equation) }}
                            <br/>
                            {{ render_field(form.cocoplum_water_depth_equation) }}
                            <br/>
                        </div>
						<div class="column3">
							{{ render_field(form.cocoplum_depth_min) }}
                            {{ render_field(form.cocoplum_depth_max) }}
                            <br/>
                            {{ render_field(form.cocoplum_salinity_min) }}
                            {{ render_field(form.cocoplum_salinity_max) }}
                        </div>
					</div>
                    <br style="clear: both;"/>
                    <br/>

                    <h3 style="color: #008080;">Blue Road</h3>
                    <div class="columns">
						<div class="column1">{{ render_field(form.blueroad_hydrovu_id) }}</div>
						<div class="column2">
                            {{ render_field(form.blueroad_boat_clearance_equation) }}
                            <br/>
                            {{ render_field(form.blueroad_water_depth_equation) }}
                            <br/>
                        </div>
						<div class="column3">
							{{ render_field(form.blueroad_depth_min) }}
                            {{ render_field(form.blueroad_depth_max) }}
                            <br/>
                            {{ render_field(form.blueroad_salinity_min) }}
                            {{ render_field(form.blueroad_salinity_max) }}
                        </div>
					</div>

                    <br style="clear: both;"/>
                    <div><input class="button" type="submit" value="Save"></div>
				</form>

                <br/>
                <p>
                    Note: For the equations, use the letter "x" as the variable,
                    which represents the water depth for the location.<br/>
                    "x" should be in meters, and the equation should also return a result in meters.<br/>
                    Use +, -, *, and / for addition, subtraction, multiplication, and division, respectively.
                </p>
			</div>
		</div>
	</div>
{% endblock %}