{% extends 'base.html' %}
{% block title %}Site customization{% endblock %}
{% block content %}
	<div class="container-fluid">
		<h1>Customizations</h1>
		<p>You can customize portions of {{ site_title }} to suit your organization's needs.</p>

		<div class="panel panel-default">
			<div class="panel-body">
                <h3 class="customization-section-title" id="email_addresses">Email addresses</h3>
				<form method="POST" action="{% url 'customize' 'email_addresses' %}#email_addresses" class="form-horizontal">
					{% csrf_token %}
					<div class="form-group">
						<label class="control-label col-md-2" for="feedback_email_address">Feedback</label>
						<div class="col-md-3">
							<input type="email" id="feedback_email_address" name="feedback_email_address" class="form-control" value="{{ feedback_email_address }}" placeholder="feedback@example.org">
						</div>
						<div class="col-md-7 form-control-static light-grey">
							User feedback from the <a href="{% url 'feedback' %}">Feedback page</a> is sent to this email address.
						</div>
					</div>
					<div class="form-group">
						<label class="control-label col-md-2" for="safety_email_address">Safety</label>
						<div class="col-md-3">
							<input type="email" id="safety_email_address" name="safety_email_address" class="form-control" value="{{ safety_email_address }}" placeholder="safety@example.org">
						</div>
						<div class="col-md-7 form-control-static light-grey">
							<a href="{% url 'safety' %}">Safety suggestions and observations</a> are sent to this email address.
						</div>
					</div>
					<div class="form-group">
						<label class="control-label col-md-2" for="abuse_email_address">Abuse</label>
						<div class="col-md-3">
							<input type="email" id="abuse_email_address" name="abuse_email_address" class="form-control" value="{{ abuse_email_address }}" placeholder="abuse@example.org">
						</div>
						<div class="col-md-7 form-control-static light-grey">
							Alerts about user activities that could constitute 'abuse' are sent to this email address. Examples include missed reservations and unauthorized tool access.
						</div>
					</div>
					<div class="form-group">
						<label class="control-label col-md-2" for="user_office_email_address">User office</label>
						<div class="col-md-3">
							<input type="email" id="user_office_email_address" name="user_office_email_address" class="form-control" value="{{ user_office_email_address }}" placeholder="information@example.org">
						</div>
						<div class="col-md-7 form-control-static light-grey">
							The main point of contact for users to obtain {{ facility_name }} information. Automated emails sent from {{ site_title }} are typically 'from' this address.
						</div>
					</div>
					<div class="form-group">
						<div class="col-md-3">
							<input type="submit" value="Save email addresses" class="btn btn-success">
						</div>
					</div>
				</form>
			</div>
		</div>

		<div class="panel panel-default">
			<div class="panel-body">
                <h3 class="customization-section-title" id="application_settings">Application settings</h3>
				<form method="POST" action="{% url 'customize' 'application_settings' %}#application_settings" class="form-horizontal">
					{% csrf_token %}
					<div class="form-group">
                        <label class="control-label col-md-2">Area login/logout</label>
						<div class="col-md-10">
							<div class="checkbox">
								<label><input type="checkbox" name="self_log_in" {% if self_log_in %}checked{% endif %} value="enabled">Allow users to log themselves into access controlled areas from the landing page</label><br/>
								<label><input type="checkbox" name="self_log_out" {% if self_log_out %}checked{% endif %} value="enabled">Allow users to log themselves out of access controlled areas from the landing page</label><br/>
								<label><input type="checkbox" name="calendar_login_logout" {% if calendar_login_logout %}checked{% endif %} value="enabled">Show access controlled area login/logout button on calendar view (requires login and/or logout feature enabled above)</label>
							</div>
						</div>
					</div>
					<div class="form-group">
						<label class="control-label col-md-2" for="facility_name">Facility name</label>
						<div class="col-md-5">
							<input type="text" id="facility_name" name="facility_name" class="form-control" value="{{ facility_name }}">
						</div>
						<div class="col-md-5 form-control-static light-grey">
							The name of the facility to use in all templates.
						</div>
					</div>
					<div class="form-group">
						<label class="control-label col-md-2" for="site_title">Site title</label>
						<div class="col-md-5">
							<input type="text" id="site_title" name="site_title" class="form-control" value="{{ site_title }}">
						</div>
						<div class="col-md-5 form-control-static light-grey">
							The name of the site to use in all templates/headers.
						</div>
					</div>
                    <div class="form-group">
						<label class="control-label col-md-2" for="project_selection_template">Project selection template</label>
						<div class="col-md-5">
                            <textarea oninput="auto_size_textarea(this);" id="project_selection_template" name="project_selection_template" class="form-control">{{ project_selection_template }}</textarea>
						</div>
						<div class="col-md-5 form-control-static light-grey">
							The django template used for rendering project selection when enabling tools and making reservations. The context variable <b>project</b> is provided.
						</div>
					</div>
					<div class="form-group">
						<div class="col-md-3">
							<input type="submit" value="Save settings" class="btn btn-success">
						</div>
					</div>
				</form>
			</div>
		</div>

		<div class="panel panel-default">
			<div class="panel-body">
                <h3 class="customization-section-title" id="calendar_settings">Calendar settings</h3>
				<form method="POST" action="{% url 'customize' 'calendar_settings' %}#calendar_settings" class="form-horizontal">
					{% csrf_token %}
					<div class="form-group">
                        <label class="control-label col-md-2" >Default view</label>
						<div class="col-md-10">
							<div class="radio">
								<label><input type="radio" id="calendar_view" name="calendar_view" {% if not calendar_view or calendar_view == 'agendaWeek' %}checked{% endif %} value="agendaWeek"> Week view</label>
								<label><input type="radio" id="calendar_view" name="calendar_view" {% if calendar_view == 'month' %}checked{% endif %} value="month"> Month view</label>
								<label><input type="radio" id="calendar_view" name="calendar_view" {% if calendar_view == 'agendaDay' %}checked{% endif %} value="agendaDay"> Day view</label>
							</div>
						</div>
					</div>
					<div class="form-group">
                        <label class="control-label col-md-2" >First day of the week</label>
                        <div class="col-md-10">
                            <div class="radio">
                                <label><input type="radio" id="calendar_first_day_of_week" name="calendar_first_day_of_week" {% if not calendar_first_day_of_week or calendar_first_day_of_week == '1' %}checked{% endif %} value="1"> Monday</label>
                                <label><input type="radio" id="calendar_first_day_of_week" name="calendar_first_day_of_week" {% if calendar_first_day_of_week == '0' %}checked{% endif %} value="0"> Sunday</label>
                            </div>
                        </div>
					</div>
					<div class="form-group">
						<label class="control-label col-md-2" for="calendar_start_of_the_day">Start of the day</label>
						<div class="col-md-3">
							<input type="text" id="calendar_start_of_the_day" name="calendar_start_of_the_day" class="form-control" value="{{ calendar_start_of_the_day }}" placeholder="07:00:00">
						</div>
						<div class="col-md-7 form-control-static light-grey">
							The time the day starts in the calendar view (24h format).
						</div>
					</div>
                    <div class="form-group">
						<label class="control-label col-md-2" for="calendar_outage_recurrence_limit">Outage recurrence limit</label>
						<div class="col-md-3">
                            <div class="input-group">
							    <input type="number" id="calendar_outage_recurrence_limit" name="calendar_outage_recurrence_limit" class="form-control" value="{{ calendar_outage_recurrence_limit }}">
                                <span class="input-group-addon">days</span>
                            </div>
						</div>
						<div class="col-md-7 form-control-static light-grey">
							The maximum number of days a recurring scheduled outage can be set in advance.
						</div>
					</div>
					<div class="form-group">
						<div class="col-md-12" style="margin-top: 15px">
							The following settings allow to customize the date format in the different calendar views. See <a href="https://fullcalendar.io/docs/v1/formatDate" target="_blank">FullCalendar documentation</a> for more information on the syntax.
						</div>
					</div>
					<div class="form-group">
						<label class="control-label col-md-2" for="calendar_day_column_format">Day column format</label>
						<div class="col-md-3">
							<input type="text" id="calendar_day_column_format" name="calendar_day_column_format" class="form-control" value="{{ calendar_day_column_format }}"  placeholder="dddd MM/DD/YYYY">
						</div>
						<div class="col-md-7 form-control-static light-grey">
							The column date format for the day view.
						</div>
					</div>
					<div class="form-group">
						<label class="control-label col-md-2" for="calendar_week_column_format">Week column format</label>
						<div class="col-md-3">
							<input type="text" id="calendar_week_column_format" name="calendar_week_column_format" class="form-control" value="{{ calendar_week_column_format }}"  placeholder="ddd M/DD">
						</div>
						<div class="col-md-7 form-control-static light-grey">
							The column date format for the week view.
						</div>
					</div>
					<div class="form-group">
						<label class="control-label col-md-2" for="calendar_month_column_format">Month column format</label>
						<div class="col-md-3">
							<input type="text" id="calendar_month_column_format" name="calendar_month_column_format" class="form-control" value="{{ calendar_month_column_format }}"  placeholder="ddd">
						</div>
						<div class="col-md-7 form-control-static light-grey">
							The column date format for the month view.
						</div>
					</div>
					<div class="form-group">
                        <label class="control-label col-md-2">Current time indicator</label>
						<div class="col-md-10">
							<div class="checkbox">
								<label><input type="checkbox" name="calendar_now_indicator" {% if calendar_now_indicator %}checked{% endif %} value="enabled">Show current time indicator on the calendar</label><br/>
							</div>
						</div>
					</div>
					<div class="form-group">
                        <label class="control-label col-md-2">Areas</label>
						<div class="col-md-10">
							<div class="checkbox">
								<label><input type="checkbox" name="calendar_display_not_qualified_areas" {% if calendar_display_not_qualified_areas %}checked{% endif %} value="enabled">Also show areas (for reservations) that the user doesn't have access too (they will be grayed out)</label><br/>
							</div>
						</div>
					</div>
					<div class="form-group">
                        <label class="control-label col-md-2" >Overview options:</label>
						<div class="col-md-10">
							<div class="checkbox">
								<label style="padding-right: 20px;"><input type="checkbox" id="calendar_all_tools" name="calendar_all_tools" {% if calendar_all_tools  %}checked{% endif %} value="enabled"> Enable all tools option</label>
								<label style="padding-right: 20px;"><input type="checkbox" id="calendar_all_areas" name="calendar_all_areas" {% if calendar_all_areas %}checked{% endif %} value="enabled"> Enable all areas option</label>
								<label style="padding-right: 20px;"><input type="checkbox" id="calendar_all_areastools" name="calendar_all_areastools" {% if calendar_all_areastools %}checked{% endif %} value="enabled"> Enable all tools & areas option</label>
							</div>
						</div>
					</div>
					<div class="form-group">
						<div class="col-md-3">
							<input type="submit" value="Save settings" class="btn btn-success">
						</div>
					</div>
				</form>
			</div>
		</div>

        <div class="panel panel-default">
			<div class="panel-body">
                <h3 class="customization-section-title" id="dashboard_settings">Status dashboard settings</h3>
				<form method="POST" action="{% url 'customize' 'dashboard_settings' %}#dashboard_settings" class="form-horizontal">
					{% csrf_token %}
                    <div class="form-group">
                        <label class="control-label col-md-2">Qualified areas</label>
						<div class="col-md-10">
							<div class="checkbox">
								<label><input type="checkbox" name="dashboard_display_not_qualified_areas" {% if dashboard_display_not_qualified_areas %}checked{% endif %} value="enabled">Show areas the user doesn't have access to</label><br/>
							</div>
						</div>
                    </div>
                    <div class="form-group">
                        <label class="control-label col-md-2">Staff status</label>
                        <div class="col-md-10">
                            <div class="checkbox">
                                <label><input type="checkbox" name="dashboard_staff_status_staff_only" {% if dashboard_staff_status_staff_only %}checked{% endif %} value="enabled">Only show staff status to staff members</label><br/>
                                <label><input type="checkbox" name="dashboard_staff_status_weekdays_only" {% if dashboard_staff_status_weekdays_only %}checked{% endif %} value="enabled">Only show weekdays (no weekend)</label><br/>
                            </div>
                        </div>
                     </div>
                    <div class="form-group">
                        <label class="control-label col-md-2" >First day of the week</label>
                        <div class="col-md-10">
                            <div class="radio">
                                <label><input type="radio" id="dashboard_staff_status_first_day_of_week" name="dashboard_staff_status_first_day_of_week" {% if not dashboard_staff_status_first_day_of_week or dashboard_staff_status_first_day_of_week == '1' %}checked{% endif %} value="1"> Monday</label>
                                <label><input type="radio" id="dashboard_staff_status_first_day_of_week" name="dashboard_staff_status_first_day_of_week" {% if dashboard_staff_status_first_day_of_week == '0' %}checked{% endif %} value="0"> Sunday</label>
                            </div>
                        </div>
					</div>
                    <div class="form-group">
                        <label class="control-label col-md-2" for="dashboard_staff_status_date_format">Staff status date format</label>
                        <div class="col-md-3">
                            <input type="text" id="dashboard_staff_status_date_format" name="dashboard_staff_status_date_format" class="form-control" value="{{ dashboard_staff_status_date_format }}">
                        </div>
                        <div class="col-md-7 form-control-static light-grey">
                            The date format to use in the status dashboard staff tab. See <a href="https://docs.djangoproject.com/en/2.2/ref/templates/builtins/#date" target="_blank">Django date formats</a> for details.
                        </div>
					</div>
                    <div class="form-group">
						<div class="col-md-3">
							<input type="submit" value="Save settings" class="btn btn-success">
						</div>
					</div>
                </form>
            </div>
        </div>

        <div class="panel panel-default">
			<div class="panel-body">
                <h3 class="customization-section-title" id="interlock_settings">Interlock settings</h3>
				<form method="POST" action="{% url 'customize' 'interlock_settings' %}#interlock_settings" class="form-horizontal">
					{% csrf_token %}
                    <div class="form-group">
						<label class="control-label col-md-2" for="tool_interlock_failure_message">Tool failure message</label>
						<div class="col-md-5">
							<textarea oninput="auto_size_textarea(this);" id="tool_interlock_failure_message" name="tool_interlock_failure_message" class="form-control">{{ tool_interlock_failure_message }}</textarea>
						</div>
						<div class="col-md-5 form-control-static light-grey">
							The message to display when a tool interlock command fails.
						</div>
					</div>
                    <div class="form-group">
						<label class="control-label col-md-2" for="door_interlock_failure_message">Door failure message</label>
						<div class="col-md-5">
							<textarea oninput="auto_size_textarea(this);" id="door_interlock_failure_message" name="door_interlock_failure_message" class="form-control">{{ door_interlock_failure_message }}</textarea>
						</div>
						<div class="col-md-5 form-control-static light-grey">
							The message to display when a door interlock command fails.
						</div>
					</div>
                    <div class="form-group">
                        <label class="control-label col-md-2">Bypass on error</label>
						<div class="col-md-10">
							<div class="checkbox">
								<label><input type="checkbox" name="allow_bypass_interlock_on_failure" {% if allow_bypass_interlock_on_failure %}checked{% endif %} value="enabled">Check this box to offer users the option to bypass lock/unlock command when there is an interlock error.</label><br/>
							</div>
						</div>
					</div>
                    <div class="form-group">
						<div class="col-md-3">
							<input type="submit" value="Save settings" class="btn btn-success">
						</div>
					</div>
                </form>
            </div>
        </div>

        <div class="panel panel-default">
			<div class="panel-body">
                <h3 class="customization-section-title" id="requests_settings">User requests settings</h3>
				<form method="POST" action="{% url 'customize' 'requests_settings' %}#requests_settings" class="form-horizontal">
					{% csrf_token %}
                    <div class="form-group">
						<label class="control-label col-md-2" for="buddy_requests_title">Buddy request tab title</label>
						<div class="col-md-5">
							<input type="text" id="buddy_requests_title" name="buddy_requests_title" class="form-control" value="{{ buddy_requests_title }}"/>
						</div>
						<div class="col-md-5 form-control-static light-grey">
							The title for the buddy request tab of the user requests page.
						</div>
					</div>
                    <div class="form-group">
						<label class="control-label col-md-2" for="buddy_board_description">Buddy board description</label>
						<div class="col-md-5">
							<textarea oninput="auto_size_textarea(this);" id="buddy_board_description" name="buddy_board_description" class="form-control">{{ buddy_board_description }}</textarea>
						</div>
						<div class="col-md-5 form-control-static light-grey">
							The description/instructions to display on the buddy board page.
						</div>
					</div>
                    <div class="form-group">
						<label class="control-label col-md-2" for="access_requests_title">Access request tab title</label>
						<div class="col-md-5">
							<input type="text" id="access_requests_title" name="access_requests_title" class="form-control" value="{{ access_requests_title }}"/>
						</div>
						<div class="col-md-5 form-control-static light-grey">
							The title for the access request tab of the user requests page.
						</div>
					</div>
                    <div class="form-group">
						<label class="control-label col-md-2" for="access_requests_description">Access requests description</label>
						<div class="col-md-5">
							<textarea oninput="auto_size_textarea(this);" id="access_requests_description" name="access_requests_description" class="form-control">{{ access_requests_description }}</textarea>
						</div>
						<div class="col-md-5 form-control-static light-grey">
							The description/instructions to display on the access requests page.
						</div>
					</div>
                    <div class="form-group">
						<label class="control-label col-md-2" for="access_requests_minimum_users">Access requests minimum users</label>
						<div class="col-md-5">
                            <div class="input-group">
							    <input type="number" step="1" min="0" id="access_requests_minimum_users" name="access_requests_minimum_users" class="form-control text-right" value="{{ access_requests_minimum_users }}"/>
                                <span class="input-group-addon">users</span>
                            </div>
						</div>
						<div class="col-md-5 form-control-static light-grey">
							The minimum number of users (creator included) needed for an access request to be valid.
						</div>
					</div>
                    <div class="form-group">
						<label class="control-label col-md-2" for="access_requests_display_max">Access requests display maximum</label>
						<div class="col-md-5">
                            <div class="input-group">
							    <input type="number" step="1" min="0" id="access_requests_display_max" name="access_requests_display_max" class="form-control text-right" value="{{ access_requests_display_max }}"/>
                                <span class="input-group-addon">requests</span>
                            </div>
						</div>
						<div class="col-md-5 form-control-static light-grey">
							The maximum number of requests to display in each section (approved, denied, expired). Leave blank for all.
						</div>
					</div>
                    <div class="form-group">
						<label class="control-label col-md-2" for="weekend_access_notification_emails">Weekend access notification email(s)</label>
						<div class="col-md-5">
							<input type="text" id="weekend_access_notification_emails" name="weekend_access_notification_emails" class="form-control" value="{{ weekend_access_notification_emails }}" placeholder="weekend_access@example.org"/>
						</div>
						<div class="col-md-5 form-control-static light-grey">
							The email(s) to notify for weekend access. A comma-separated list can be used.
						</div>
					</div>
                    <div class="form-group">
						<label class="control-label col-md-2" for="weekend_access_notification_cutoff_hour">Weekend access notification cutoff</label>
                        <div class="col-md-2">
                            <select id="weekend_access_notification_cutoff_day" name="weekend_access_notification_cutoff_day" class="form-control">
                                <option value=""></option>
                                <option value="1" {% if weekend_access_notification_cutoff_day == '1' %}selected{% endif %}>Tuesday</option>
                                <option value="2" {% if weekend_access_notification_cutoff_day == '2' %}selected{% endif %}>Wednesday</option>
                                <option value="3" {% if weekend_access_notification_cutoff_day == '3' %}selected{% endif %}>Thursday</option>
                                <option value="4" {% if weekend_access_notification_cutoff_day == '4' %}selected{% endif %}>Friday</option>
                                <option value="5" {% if weekend_access_notification_cutoff_day == '5' %}selected{% endif %}>Saturday</option>
                            </select>
						</div>
                        <div class="col-md-1 form-control-static text-center">
                            at
                        </div>
						<div class="col-md-2">
                            <div class="input-group">
                                <input type="number" step="1" min="0" max="24" id="weekend_access_notification_cutoff_hour" name="weekend_access_notification_cutoff_hour" class="form-control text-right" value="{{ weekend_access_notification_cutoff_hour }}"/>
                                <span class="input-group-addon">:00 hrs</span>
                            </div>
						</div>
						<div class="col-md-5 form-control-static light-grey">
							The cutoff day and hour after which an email is sent if there is no approved weekend access for the week (in 24hrs format). If left blank the "no weekend access" will NOT be sent.
						</div>
					</div>
                    <div class="form-group">
						<div class="col-md-3">
							<input type="submit" value="Save settings" class="btn btn-success">
						</div>
					</div>
                </form>
            </div>
        </div>

		<div class="panel panel-default">
			<div class="panel-body">
                <h3 class="customization-section-title" id="login_banner_id">Login banner</h3>
				<p>The login banner is an informational message displayed underneath the username and password text boxes on the login page. You can customize this to convey rules for {{ site_title }} users at your organization.</p>
				{% include 'customizations/customizations_upload.html' with element=login_banner name='login banner' %}
			</div>
		</div>

		<div class="panel panel-default">
			<div class="panel-body">
                <h3 class="customization-section-title" id="safety_introduction_id">Introduction for &quot;<a href="{% url 'safety' %}" target="_blank">Safety suggestions and observations</a>&quot; page</h3>
				<p>What would you like everyone to know about safety policy and procedures? This introduction will be presented at the top of the safety page. You can use HTML to modify the look of the text.</p>
                {% include 'customizations/customizations_upload.html' with element=safety_introduction name='safety introduction' %}
			</div>
		</div>

		<div class="panel panel-default">
			<div class="panel-body">
                <h3 class="customization-section-title" id="facility_rules_tutorial_id">&quot;<a href="{% url 'facility_rules' %}" target="_blank">{{ facility_name }} rules tutorial</a>&quot; page</h3>
				<p>
					The facility rules tutorial is an opportunity to provide new users with a tutorial to your lab operating procedures and rules.
					<br>The HTML you upload is rendered with the Django template engine. You can use JavaScript (including jQuery) within the page.
					<br>
				</p>
                <ul>
                    <li>The form should include <b>{% templatetag openblock %} csrf_token {% templatetag closeblock %}</b> inside the form tags.</li>
                    <li>Completion of the HTML form should be POSTed to <b>"{% templatetag openblock %} url 'facility_rules' {% templatetag closeblock %}"</b> (exactly as is).</li>
                </ul>
				<p>
					Upon completion, the user's "training required" attribute is set to false, and they are able to make reservations and control tools.
				</p>
                {% include 'customizations/customizations_upload.html' with element=facility_rules_tutorial name='facility rules tutorial' hide_content=True %}
			</div>
		</div>

		<div class="panel panel-default">
			<div class="panel-body">
                <h3 class="customization-section-title" id="authorization_failed_id">&quot;<a href="{% url 'authorization_failed' %}" target="_blank">{{ facility_name }} failed login</a>&quot; message</h3>
				<p>
					This message is displayed after authentication when either no matching username could be found in the database or if that user has been deactivated.
					<br>The HTML you upload is rendered with the Django template engine. You can use JavaScript (including jQuery) within the message.
				</p>
                {% include 'customizations/customizations_upload.html' with element=authorization_failed name='authorization failed' button_name='Upload failed login page' %}
			</div>
		</div>

		<div class="panel panel-default">
			<div class="panel-body">
                <h3 class="customization-section-title" id="jumbotron_watermark_id">&quot;<a href="{% url 'jumbotron' %}" target="_blank">Jumbotron</a>&quot; watermark</h3>
				<p>This image is displayed as background for the Jumbotron. It is set as a full background screen, so your image needs to take that into account.
					<br>The image you upload should be a valid image file (recommended size is 1500x1000).
				</p>
                {% include 'customizations/customizations_upload.html' with element=jumbotron_watermark name='jumbotron watermark' extension='png' %}
			</div>
		</div>

		<div class="panel panel-default">
			<div class="panel-body">
                <h3 class="customization-section-title" id="access_request_notification_email_id">Access request notification email</h3>
                <p>This email is sent to the person who created the request when an access request is created or updated. The other users present on the request as well as the facility managers are cc'ed.</p>
                <p>The following context variables are provided when the email is rendered:</p>
				<ul>
                    <li><b>template_color</b> - the color: green if approved, red if denied, blue otherwise</li>
					<li><b>access_request</b> - the user's access request that was created or updated</li>
					<li><b>status</b> - the status of the request: received, updated, approved or denied</li>
					<li><b>access_requests_url</b> - the URL to the access requests page</li>
				</ul>
                {% include 'customizations/customizations_upload.html' with element=access_request_notification_email name='access request notification email' %}
			</div>
		</div>

		<div class="panel panel-default">
			<div class="panel-body">
                <h3 class="customization-section-title" id="cancellation_email_id">Cancellation email</h3>
				<p>This email is sent to a user when a staff member cancels the user's reservation. The following context variables are provided when the email is rendered:</p>
				<ul>
					<li><b>reservation</b> - the user's reservation that was cancelled</li>
					<li><b>staff_member</b> - the user object of the staff member who cancelled the reservation</li>
					<li><b>reason</b> - the reason the staff member provided for cancelling the reservation</li>
				</ul>
                {% include 'customizations/customizations_upload.html' with element=cancellation_email name='cancellation email' %}
			</div>
		</div>

        <div class="panel panel-default">
			<div class="panel-body">
                <h3 class="customization-section-title" id="counter_threshold_reached_email_id">Counter threshold reached email</h3>
				<p>
					This email is sent to the counter's warning email when the value of an counter reaches the warning threshold.
					The following context variables are provided when the email is rendered:
				</p>
				<ul>
					<li><b>counter</b> - the counter which value reached the warning threshold</li>
				</ul>
                {% include 'customizations/customizations_upload.html' with element=counter_threshold_reached_email name='counter threshold reached email' %}
			</div>
		</div>

		<div class="panel panel-default">
			<div class="panel-body">
                <h3 class="customization-section-title" id="feedback_email_id">Feedback email</h3>
				<p>
					This email is sent when a user <a href="{% url 'feedback' %}" target="_blank">submits feedback</a>. The feedback email address (at the top of this page) must also be configured for users to be able to do this.
					The following context variables are provided when the email is rendered:
				</p>
				<ul>
					<li><b>contents</b> - the user's feedback</li>
					<li><b>user</b> - the user object of the user who submitted the feedback</li>
				</ul>
                {% include 'customizations/customizations_upload.html' with element=feedback_email name='feedback email' %}
			</div>
		</div>

		<div class="panel panel-default">
			<div class="panel-body">
                <h3 class="customization-section-title" id="generic_email_id">Generic email</h3>
				<p>A generic email that can be sent to qualified tool users, members of an account, or members of a project. Send these using the <a href="{% url 'email_broadcast' %}">email broadcast page</a>. The following context variables are provided when the email is rendered:</p>
				<ul>
					<li><b>title</b> - the user specified title of the email</li>
					<li><b>greeting</b> - a greeting to the recipients of the email</li>
					<li><b>contents</b> - the body of the email</li>
					<li><b>template_color</b> - the color to emphasize</li>
				</ul>
                {% include 'customizations/customizations_upload.html' with element=generic_email name='generic email' %}
			</div>
		</div>

		<div class="panel panel-default">
			<div class="panel-body">
                <h3 class="customization-section-title" id="missed_reservation_email_id">Missed reservation email</h3>
				<p>
					This email is sent when a user misses a reservation. If a tool is not used for an amount
					of time after the user's reservation has begun, it is marked as missed and removed from the calendar.
					The following context variables are provided when the email is rendered:
				</p>
				<ul>
					<li><b>reservation</b> - the reservation that the user missed</li>
				</ul>
                {% include 'customizations/customizations_upload.html' with element=missed_reservation_email name='missed reservation email' %}
			</div>
		</div>

		<div class="panel panel-default">
			<div class="panel-body">
                <h3 class="customization-section-title" id="facility_rules_tutorial_email_id">Facility rules tutorial email</h3>
				<p>
					This email is sent when a user completes the facility rules tutorial. It can contain a free-response answer (quiz question).
					If you do not upload a template then no notification email is sent to staff when a user completes the training tutorial.
					The following context variables are provided when the email is rendered:
				</p>
				<ul>
					<li><b>user</b> - the user's model instance</li>
					<li><b>making_reservations_rule_summary</b> - a free-response answer provided by the user. Normally, this is provided by the user to summarize their understanding of the {{ facility_name }} rules and proceedures.</li>
				</ul>
                {% include 'customizations/customizations_upload.html' with element=facility_rules_tutorial_email name='facility rules tutorial email' %}
			</div>
		</div>

		<div class="panel panel-default">
			<div class="panel-body">
                <h3 class="customization-section-title" id="new_task_email_id">New task email</h3>
				<p>
					This email is sent when a new maintenance task is created for a tool.
					The following context variables are provided when the email is rendered:
				</p>
				<ul>
					<li><b>user</b> - the user who created the task</li>
					<li><b>task</b> - the task information</li>
					<li><b>tool</b> - the tool that the task is associated with</li>
					<li><b>tool_control_absolute_url</b> - the URL of the tool control page for the tool</li>
					<li><b>template_color</b> - an HTML color code indicating the severity of the problem. Orange for warning, red for shutdown.</li>
				</ul>
                {% include 'customizations/customizations_upload.html' with element=new_task_email name='new task email' %}
			</div>
		</div>

		<div class="panel panel-default">
			<div class="panel-body">
                <h3 class="customization-section-title" id="out_of_time_reservation_email_id">Out of time reservation email</h3>
				<p>
					This email is sent when a user is still logged in an area but his reservation expired. A grace period can be set when configuring the area.
					The following context variables are provided when the email is rendered:
				</p>
				<ul>
					<li><b>reservation</b> - the reservation that the user is out of time on</li>
				</ul>
                {% include 'customizations/customizations_upload.html' with element=out_of_time_reservation_email name='out of time reservation email' %}
			</div>
		</div>

		<div class="panel panel-default">
			<div class="panel-body">
                <h3 class="customization-section-title" id="reorder_supplies_reminder_email_id">Reorder supplies reminder email</h3>
				<p>
					This email is sent to the item's reminder email when the quantity of an item falls below the reminder threshold and should be reordered.
					The following context variables are provided when the email is rendered:
				</p>
				<ul>
					<li><b>item</b> - the item which quantity fell below the reminder threshold</li>
				</ul>
                {% include 'customizations/customizations_upload.html' with element=reorder_supplies_reminder_email name='reorder supplies reminder email' %}
			</div>
		</div>

        <div class="panel panel-default">
			<div class="panel-body">
                <h3 class="customization-section-title" id="reservation_ending_reminder_email_id">Reservation ending reminder email</h3>
				<p>
					This email is sent to a user that is logged in an area 30 and 15 minutes before their area reservation ends.
					The following context variables are provided when the email is rendered:
				</p>
				<ul>
					<li><b>reservation</b> - the user's reservation ending</li>
				</ul>
                {% include 'customizations/customizations_upload.html' with element=reservation_ending_reminder_email name='reservation ending reminder email' %}
			</div>
		</div>

		<div class="panel panel-default">
			<div class="panel-body">
                <h3 class="customization-section-title" id="reservation_reminder_email_id">Reservation reminder email</h3>
				<p>
					This email is sent to a user two hours before their tool/area reservation begins.
					The reservation warning email must also exist for this email to be sent.
					The following context variables are provided when the email is rendered:
				</p>
				<ul>
					<li><b>reservation</b> - the user's upcoming reservation</li>
				</ul>
                {% include 'customizations/customizations_upload.html' with element=reservation_reminder_email name='reservation reminder email' %}
			</div>
		</div>

		<div class="panel panel-default">
			<div class="panel-body">
                <h3 class="customization-section-title" id="reservation_warning_email_id">Reservation warning email</h3>
				<p>
					This email is sent to a user two hours before their tool/area reservation begins and maintenance may interfere with the upcoming reservation.
					The reservation reminder email must also exist for this email to be sent.
					The following context variables are provided when the email is rendered:
				</p>
				<ul>
					<li><b>reservation</b> - the user's upcoming reservation</li>
					<li><b>fatal_error</b> - boolean value that, when true, indicates that it will be impossible for the user to use the tool/access the area during their reservation (due to maintenance, outages or a missing required dependency)</li>
					<li><b>template_color</b> - an HTML color code indicating the severity of the problem. Orange for warning, red for shutdown.</li>
				</ul>
                {% include 'customizations/customizations_upload.html' with element=reservation_warning_email name='reservation warning email' %}
			</div>
		</div>

		<div class="panel panel-default">
			<div class="panel-body">
                <h3 class="customization-section-title" id="safety_issue_email_id">Safety issue email</h3>
				<p>
					This email is sent when a new maintenance task is created for a tool.
					The following context variables are provided when the email is rendered:
				</p>
				<ul>
					<li><b>issue</b> - the issue information</li>
					<li><b>issue_absolute_url</b> - the URL for the detailed view of the issue</li>
				</ul>
                {% include 'customizations/customizations_upload.html' with element=safety_issue_email name='safety issue email' %}
			</div>
		</div>

		<div class="panel panel-default">
			<div class="panel-body">
                <h3 class="customization-section-title" id="staff_charge_reminder_email_id">Staff charge reminder email</h3>
				<p>
					This email is periodically sent to remind staff that they are charging a user for staff time.
					The following context variables are provided when the email is rendered:
				</p>
				<ul>
					<li><b>staff_charge</b> - the staff charge that is in progress</li>
				</ul>
                {% include 'customizations/customizations_upload.html' with element=staff_charge_reminder_email name='staff charge reminder email' %}
			</div>
		</div>

		<div class="panel panel-default">
			<div class="panel-body">
                <h3 class="customization-section-title" id="task_status_notification_id">Task status notification email</h3>
				<p>
					This email is sent when a tool task has be updated and set to a particular state.
					The following context variables are provided when the email is rendered:
				</p>
				<ul>
					<li><b>template_color</b> - the color to emphasize</li>
					<li><b>title</b> - a title indicating that the message is a task status notification</li>
					<li><b>task</b> - the task that was updated</li>
					<li><b>status_message</b> - the current status message for the task</li>
					<li><b>notification_message</b> - the notification message that is configured (via the admin site) for the status</li>
					<li><b>tool_control_absolute_url</b> - the URL of the tool control page for the task</li>
				</ul>
                {% include 'customizations/customizations_upload.html' with element=task_status_notification name='task status notification' %}
			</div>
		</div>

		<div class="panel panel-default">
			<div class="panel-body">
                <h3 class="customization-section-title" id="unauthorized_tool_access_email_id">Unauthorized tool access email</h3>
                <p>
					This email is sent when a user tries to access a tool:
				</p>
                <ul>
                    <li>without being logged in to the area in which the tool resides (type 'area').</li>
                    <li>without having a current area reservation (type 'reservation')</li>
                </ul>
                <p>
					The following context variables are provided when the email is rendered:
				</p>
				<ul>
					<li><b>operator</b> - the person who attempted to use the tool</li>
					<li><b>tool</b> - the tool that the user was denied access to</li>
					<li><b>type</b> - the type of abuse ('area' or 'reservation')</li>
				</ul>
                {% include 'customizations/customizations_upload.html' with element=unauthorized_tool_access_email name='unauthorized tool access email' %}
			</div>
		</div>

		<div class="panel panel-default">
			<div class="panel-body">
                <h3 class="customization-section-title" id="usage_reminder_email_id">Usage reminder email</h3>
				<p>
					This email is periodically sent to remind a user that they have a tool enabled.
					The following context variables are provided when the email is rendered:
				</p>
				<ul>
					<li><b>user</b> - the user who is using a tool or logged in to an area</li>
				</ul>
                {% include 'customizations/customizations_upload.html' with element=usage_reminder_email name='usage reminder email' %}
			</div>
		</div>

		<div class="panel panel-default">
			<div class="panel-body">
                <h3 class="customization-section-title" id="reservation_created_user_email_id">User reservation created email</h3>
				<p>
					This email is sent to a user when the user creates a reservation and has opted to receive ics calendar notification in his preferences.
					<br>This is optional, the email will still be sent with only the calendar attachment if this is left blank.
				    <br><br>The following context variables are provided when the email is rendered:
				</p>
				<ul>
					<li><b>reservation</b> - the user's reservation that was created</li>
				</ul>
                {% include 'customizations/customizations_upload.html' with element=reservation_created_user_email name='reservation created user email' %}
			</div>
		</div>

		<div class="panel panel-default">
			<div class="panel-body">
                <h3 class="customization-section-title" id="reservation_cancelled_user_email_id">User reservation cancelled email</h3>
				<p>
					This email is sent to a user when the user cancels his own reservation and has opted to receive ics calendar notification in his preferences.
					<br>This is optional, the email will still be sent with only the calendar attachment if this is left blank.
				    <br><br>The following context variables are provided when the email is rendered:
				</p>
				<ul>
					<li><b>reservation</b> - the user's reservation that was cancelled</li>
				</ul>
                {% include 'customizations/customizations_upload.html' with element=reservation_cancelled_user_email name='reservation cancelled user email' %}
			</div>
		</div>

        <div class="panel panel-default">
            <div class="panel-body">
                <h3 class="customization-section-title" id="weekend_access_email_id">Weekend access notification email</h3>
                <p>
                    This email is sent to the <a href="?#weekend_access_notification_emails">weekend access notification email(s)</a> as well as the facility manager(s) when:
                </p>
                <ul>
                    <li>
                        there is at least one approved access request that includes weekend time during the current week.
                        (The email is sent when the first weekend access request is approved).
                    </li>
                    <li>
                        there are no approved access requests that include weekend time during the current week.
                        (the email is sent on the <a href="?#weekend_access_notification_cutoff_day">cutoff day</a> at the <a href="?#weekend_access_notification_cutoff_hour">cutoff hour</a> provided in the user requests settings above).
                    </li>
                </ul>
                <p>
                    The following context variables are provided when the email is rendered:
				</p>
				<ul>
					<li><b>weekend_access</b> - true/false, whether there are approved weekend access requests for the current week.</li>
				</ul>
                {% include 'customizations/customizations_upload.html' with element=weekend_access_email name='weekend access email' %}
            </div>
        </div>

		<div class="panel panel-default">
			<div class="panel-body">
                <h3 class="customization-section-title" id="rate">Tool Rates</h3>
				<p>
					You can upload a json file to display tool rates. An example of a valid rates file can be found on <a target="_blank" href="https://github.com/usnistgov/NEMO/raw/master/resources/splash_pad_rates.json">Github</a>.
					<br><br>It should be a JSON array of elements, and the following key/values are supported for each element:
				</p>
				<ul>
					<li><b>item_id</b> - the id of the tool or supply</li>
					<li><b>table_id</b> - the type of rate, one of "inventory_rate" (for supplies), "primetime_eq_hourly_rate" (for tool), "training_individual_hourly_rate" (for individual training rate), "training_group_hourly_rate" (for group training rate)</li>
					<li><b>rate_class</b> - the class, one of "full cost" or "cost shared"</li>
					<li><b>rate</b> - the rate amount</li>
    				<li>item - the name of the item (optional)</li>
				</ul>
                {% include 'customizations/customizations_upload.html' with element=rates name='rates' extension="json" %}
			</div>
		</div>
	</div>

	<script type="application/javascript">
        auto_size_textarea(document.getElementById('project_selection_template'));
        auto_size_textarea(document.getElementById('tool_interlock_failure_message'));
        auto_size_textarea(document.getElementById('door_interlock_failure_message'));
        auto_size_textarea(document.getElementById('buddy_board_description'));
        auto_size_textarea(document.getElementById('access_requests_description'));
		function check_delete_file_before_submit(name) {
			let has_file = $('input[name='+name+']')[0].files.length !== 0;
			if (!has_file) {
			    return confirm("Submitting without a new file will delete any previous content. \nAre you sure you want to continue?");
			} else {
			    return true;
			}
        }
	</script>
{% endblock %}
