{% block content %}
    <div class="wrap">
    	<h1>DynamicSync Settings</h1>


	    <h2 class="nav-tab-wrapper">
	      <a class="nav-tab nav-tab-active" href="">Settings</a>
	    </h2>
	    <form action="{{ action_url }}" method="POST" class="frmDynamicSyncForm">
	    	<input type="hidden" name="id" value="{{ ds.id }}" />
	    	<div class="dynamicsync_setting_field">
				<div class="dynamicsync_setting_field_label">Your DynamicSync API Key:</div>
				<div class="dynamicsync_setting_field_field">
					<input type="text" name="dsApiKey" id="dsApiKey" class="dynamicsync_textfield long" value="{{ ds.api_key }}"/>
				</div>
			</div>
			<h2>Event Calendar:</h2>
			<div class="dynamicsync_setting_field">
				<div class="dynamicsync_setting_field_label">Registration Form URL:</div>
				<div class="dynamicsync_setting_field_field">
					<input type="text" name="dsRegFormUrl" id="dsRegFormUrl" class="dynamicsync_textfield long" value="{{ ds.regFormUrl }}"/>
				</div>
			</div>
			<div class="dynamicsync_setting_field hidden">
				<div class="dynamicsync_setting_field_label">Thank You URL:</div>
				<div class="dynamicsync_setting_field_field">
					<input type="text" name="thankYouUrl" id="thankYouUrl" class="dynamicsync_textfield long" value="{{ ds.regFormUrl }}" style="max-width: 480px; width: 100%;"/>
				</div>
			</div>
			<span class="dynamicsync_heading">Event Data to Send To Registration Form</span>
			
			<div class="dynamicsync_setting_field">
				<div class="dynamicsync_setting_field_label">Event ID:</div>
				<div class="dynamicsync_setting_field_field">
					<input type="text" name="eventIdField" id="eventIdField" value="{{ ds.eventIdField }}" class="dynamicsync_textfield"/>
				</div>
			</div>
			<div class="dynamicsync_setting_field">
				<div class="dynamicsync_setting_field_label">Event Date ID:</div>
				<div class="dynamicsync_setting_field_field">
					<input type="text" name="eventDateIdField" id="eventDateIdField" value="{{ ds.eventDateIdField }}" class="dynamicsync_textfield" />
				</div>
			</div>
			<div class="dynamicsync_setting_field">
				<div class="dynamicsync_setting_field_label">Event Name:</div>
				<div class="dynamicsync_setting_field_field">
					<input type="text" name="eventNameField" id="eventNameField" value="{{ ds.eventNameField }}" class="dynamicsync_textfield" />
				</div>
			</div>
			<div class="dynamicsync_setting_field">
				<div class="dynamicsync_setting_field_label">Event Date:</div>
				<div class="dynamicsync_setting_field_field">
					<input type="text" name="eventDateField" id="eventDateField" value="{{ ds.eventDateField }}" class="dynamicsync_textfield" />
				</div>
			</div>
			

			<span class="dynamicsync_heading">Custom CSS ( DO NOT include <em>&lt;style&gt;&lt;/style&gt;</em> tags)</span>
			<div class="dynamicsync_nested_section_level1">
				<textarea name="customCSSField" id="customCSSField" rows="15" cols="100" style="font-family: monospace;" onkeydown="return catchTab(this,event)">{{ ds.customCSSField }}</textarea>
			</div>

			<input class="button button-primary" type="submit">
		</form>

    </div>
{% endblock %}