<xf:if is="$language.isInsert()">
	<xf:title>{{ phrase('add_language') }}</xf:title>
<xf:else />
	<xf:title>{{ phrase('edit_language:') }} {$language.title}</xf:title>
</xf:if>

<xf:pageaction if="$language.isUpdate()">
	<xf:button href="{{ link('languages/delete', $language) }}" icon="delete" overlay="true" />
</xf:pageaction>

<xf:form action="{{ link('languages/save', $language) }}" ajax="true" class="block">
	<div class="block-container">

		<h2 class="block-tabHeader tabs hScroller" role="tablist"
			data-xf-init="tabs h-scroller"
			xdata-state="replace">

			<span class="hScroller-scroll">
				<!--[XF:tabs:start]-->
				<a class="tabs-tab is-active" role="tab" aria-controls="options">{{ phrase('options') }}</a>
				<a class="tabs-tab" role="tab" aria-controls="date-format">{{ phrase('date_format') }}</a>
				<a class="tabs-tab" role="tab" aria-controls="short-date-format">{{ phrase('short_date_format') }}</a>
				<xf:if is="$quickPhrases is not empty">
					<a class="tabs-tab" role="tab" aria-controls="phrases">{{ phrase('commonly_edited_phrases') }} </a>
				</xf:if>
				<!--[XF:tabs:end]-->
			</span>
		</h2>

		<ul class="tabPanes">
			<!--[XF:tab_panes:start]-->

			<li class="is-active" role="tabpanel" id="options" aria-expanded="true">
				<div class="block-body">

					<xf:textboxrow name="title" value="{$language}"
						label="{{ phrase('title') }}" />

					<xf:selectrow name="parent_id" value="{$language}"
						label="{{ phrase('parent_language') }}">
						<xf:option value="0">{{ phrase('(no_parent)') }}</xf:option>
						<xf:foreach loop="$languageTree.getFlattened(1)" value="$treeEntry">
							<xf:option value="{$treeEntry.record.language_id}"
								label="{{ repeat('--', $treeEntry.depth) }} {$treeEntry.record.title}" />
						</xf:foreach>
					</xf:selectrow>

					<xf:selectrow name="language_code" value="{$language}"
						label="{{ phrase('locale') }}">

						<xf:option value="">&nbsp;</xf:option>
						<xf:options source="$locales" />
					</xf:selectrow>

					<xf:radiorow name="text_direction" value="{$language}"
						label="{{ phrase('text_direction') }}">

						<xf:option value="LTR">{{ phrase('left_to_right') }}</xf:option>
						<xf:option value="RTL">{{ phrase('right_to_left') }}</xf:option>
					</xf:radiorow>

					<xf:checkboxrow>
						<xf:option name="user_selectable" selected="{$language.user_selectable}">
							{{ phrase('allow_user_selection') }}
						</xf:option>
					</xf:checkboxrow>

					<hr class="formRowSep" />

					<xf:textboxrow name="decimal_point" value="{$language}" size="5" class="input--autoSize"
						label="{{ phrase('decimal_point_character') }}" />

					<xf:textboxrow name="thousands_separator" value="{$language}" size="5" class="input--autoSize"
						label="{{ phrase('thousands_separator') }}" />

					<xf:textboxrow name="label_separator" value="{$language}" size="5" class="input--autoSize"
						label="{{ phrase('label_separator') }}"
						explain="{{ phrase('this_is_used_to_separate_labels_from_their_associated_values') }}" />

					<xf:textboxrow name="comma_separator" value="{$language}" size="5" class="input--autoSize"
						label="{{ phrase('comma_separator') }}"
						explain="{{ phrase('this_is_used_as_separator_in_lists_of_values') }}" />

					<xf:textboxrow name="ellipsis" value="{$language}" size="5" class="input--autoSize"
						label="{{ phrase('ellipsis_character') }}" />

					<xf:formrow label="{{ phrase('parentheses_characters') }}">

						<div class="inputGroup">
							<xf:textbox name="parenthesis_open" value="{$language.parenthesis_open}" size="5" class="input--autoSize"
								maxlength="{{ max_length($language, 'parenthesis_open') }}" />
							<span class="inputGroup-splitter"></span>
							<xf:textbox name="parenthesis_close" value="{$language.parenthesis_close}" size="5" class="input--autoSize"
								maxlength="{{ max_length($language, 'parenthesis_close') }}" />
						</div>
					</xf:formrow>

					<hr class="formRowSep" />

					<xf:radiorow name="currency_format" value="{$language}"
						label="{{ phrase('currency_format') }}">

						<xf:options source="$currencyFormats" />
						<xf:option value="" selected="!{$currencyFormats.{$language.currency_format}}" label="{{ phrase('other') }}">
							<xf:dependent>
								<xf:textbox name="currency_format_other" value="{{ {$currencyFormats.{$language.currency_format}} ? '' : $language.currency_format }}"
									size="15" maxlength="{{ max_length($language, 'currency_format') }}" />
								<p class="formRow-explain">{{ phrase('currency_format_explain') }}</p>
							</xf:dependent>
						</xf:option>
					</xf:radiorow>

				</div>
			</li>

			<li role="tabpanel" id="date-format" aria-expanded="false">
				<div class="block-body">

					<xf:selectrow name="week_start" value="{$language}"
						label="{{ phrase('week_start_day') }}">

						<xf:option value="0">{{ phrase('day_sunday') }}</xf:option>
						<xf:option value="1">{{ phrase('day_monday') }}</xf:option>
						<xf:option value="2">{{ phrase('day_tuesday') }}</xf:option>
						<xf:option value="3">{{ phrase('day_wednesday') }}</xf:option>
						<xf:option value="4">{{ phrase('day_thursday') }}</xf:option>
						<xf:option value="5">{{ phrase('day_friday') }}</xf:option>
						<xf:option value="6">{{ phrase('day_saturday') }}</xf:option>
					</xf:selectrow>

					<xf:radiorow name="date_format" value="{$language}"
						label="{{ phrase('date_format') }}">

						<xf:options source="$dateFormats" />
						<xf:option value="" selected="!{$dateFormats.{$language.date_format}}"
							label="{{ phrase('other') }}">
							<xf:dependent>
								<xf:textbox name="date_format_other" value="{{ {$dateFormats.{$language.date_format}} ? '' : $language.date_format }}"
									size="15" maxlength="{{ max_length($language, 'date_format') }}"
									dir="ltr" />
								<p class="formRow-explain">{{ phrase('use_php_date_format') }}</p>
							</xf:dependent>
						</xf:option>
					</xf:radiorow>

					<hr class="formRowSep" />

					<xf:radiorow name="time_format" value="{$language}"
						label="{{ phrase('time_format') }}">

						<xf:options source="$timeFormats" />
						<xf:option value="" selected="!{$timeFormats.{$language.time_format}}" label="{{ phrase('other') }}">
							<xf:dependent>
								<xf:textbox name="time_format_other" value="{{ {$timeFormats.{$language.time_format}} ? '' : $language.time_format }}"
									size="15" maxlength="{{ max_length($language, 'time_format') }}"
									dir="ltr" />
								<p class="formRow-explain">{{ phrase('use_php_time_format') }}</p>
							</xf:dependent>
						</xf:option>
					</xf:radiorow>

				</div>
			</li>

			<li role="tabpanel" id="short-date-format" aria-expanded="false">
				<div class="block-body">

					<xf:textboxrow name="quick_phrases[short_date_x_minutes]"
						value="{$quickPhrases.short_date_x_minutes.phrase_text}"
						label="{{ phrase('short_date_x_minutes_label') }}"
						explain="{{ phrase('short_date_x_minutes_explain') }}"  />

					<xf:textboxrow name="quick_phrases[short_date_x_hours]"
						value="{$quickPhrases.short_date_x_hours.phrase_text}"
						label="{{ phrase('short_date_x_hours_label') }}"
						explain="{{ phrase('short_date_x_hours_explain') }}"  />

					<xf:textboxrow name="quick_phrases[short_date_x_days]"
						value="{$quickPhrases.short_date_x_days.phrase_text}"
						label="{{ phrase('short_date_x_days_label') }}"
						explain="{{ phrase('short_date_x_days_explain') }}" />

					<xf:radiorow name="date_short_recent_format" value="{$language}"
						label="{{ phrase('date_short_recent_format') }}"
						explain="{{ phrase('date_short_recent_format_explain') }}">
						<xf:options source="$dateShortRecentFormats" />
						<xf:option value="" selected="!{$dateShortRecentFormats.{$language.date_short_recent_format}}" label="{{ phrase('other') }}">
							<xf:dependent>
								<xf:textbox name="date_short_recent_format_other" value="{{ {$dateShortRecentFormats.{$language.date_short_recent_format}} ? '' : $language.date_short_recent_format }}"
									size="15" maxlength="{{ max_length($language, 'date_short_recent_format') }}"
									dir="ltr" />
								<p class="formRow-explain">{{ phrase('use_php_date_format') }}</p>
							</xf:dependent>
						</xf:option>
					</xf:radiorow>

					<xf:radiorow name="date_short_format" value="{$language}"
						label="{{ phrase('date_short_format') }}"
						explain="{{ phrase('date_short_format_explain') }}">
						<xf:options source="$dateShortFormats" />
						<xf:option value="" selected="!{$dateShortFormats.{$language.date_short_format}}" label="{{ phrase('other') }}">
							<xf:dependent>
								<xf:textbox name="date_short_format_other" value="{{ {$dateShortFormats.{$language.date_short_format}} ? '' : $language.date_short_format }}"
									size="15" maxlength="{{ max_length($language, 'date_short_format') }}"
									dir="ltr" />
								<p class="formRow-explain">{{ phrase('use_php_date_format') }}</p>
							</xf:dependent>
						</xf:option>
					</xf:radiorow>

				</div>
			</li>

			<xf:if is="$quickPhrases is not empty">
				<li role="tabpanel" id="phrases" aria-expanded="false">
					<div class="block-body">

						<xf:textarearow name="quick_phrases[privacy_policy_text]"
							value="{$quickPhrases.privacy_policy_text.phrase_text}"
							label="{{ phrase('privacy_policy') }}"
							hint="{{ phrase('you_may_use_html') }}"
							autosize="true"
							class="input--fitHeight--short" />

						<xf:textarearow name="quick_phrases[terms_rules_text]"
							value="{$quickPhrases.terms_rules_text.phrase_text}"
							label="{{ phrase('terms_and_rules') }}"
							hint="{{ phrase('you_may_use_html') }}"
							autosize="true"
							class="input--fitHeight--short" />

						<xf:textarearow name="quick_phrases[extra_copyright]"
							value="{$quickPhrases.extra_copyright.phrase_text}"
							label="{{ phrase('extra_footer_copyright') }}"
							hint="{{ phrase('you_may_use_html') }}"
							autosize="true"
							class="input--fitHeight--short"/>

						<xf:textarearow name="quick_phrases[email_footer_html]"
							value="{$quickPhrases.email_footer_html.phrase_text}"
							label="{{ phrase('extra_email_footer_html') }}"
							hint="{{ phrase('you_may_use_html') }}"
							autosize="true"
							class="input--fitHeight--short"/>

						<xf:textarearow name="quick_phrases[email_footer_text]"
							value="{$quickPhrases.email_footer_text.phrase_text}"
							label="{{ phrase('extra_email_footer_plain_text') }}"
							autosize="true"
							class="input--fitHeight--short"/>

					</div>
				</li>
			</xf:if>

		</ul>

		<xf:submitrow sticky="true" icon="save" />
	</div>
</xf:form>