input.html

{% import "_includes/forms" as forms %}

{% set singleType = types|length == 1 ? types[0] : null %}
{% set type = singleType ? singleType : ( value.type is defined and value.type ? value.type : null) %}

<div id="{{ name }}" class="fruit-field fruitlinkit">

	{# Type #}
	{% if singleType %}

		<input type="hidden" id="{{ name }}Type" name="{{ name }}[type]" value="{{ type }}" />

	{% else %}

		<div class="fruitlinkit-type">
		{{ forms.selectField({
			id: name~'-Type',
			class: name~'-Type',
			name: name~'[type]',
			options: types,
			value: type ? type
		}) }}
		</div>

	{% endif %}

	{# Options #}
	<div class="fruitlinkit-options{{ type == '' ? ' hidden' }}">

		{% if types.email is defined %}
		<div class="fruitlinkit-option fruitlinkit-email{{ type != 'email' ? ' hidden' }}">
			{{ forms.textField({
				id: name~'Email',
				class: name~'Email',
				name: name~'[email]',
				placeholder: 'Email Address',
				value: type == 'email' ? value.value
			}) }}
		</div>
		{% endif %}

		{% if types.tel is defined %}
		<div class="fruitlinkit-option fruitlinkit-tel{{ type != 'tel' ? ' hidden' }}">
			{{ forms.textField({
				id: name~'Tel',
				class: name~'Tel',
				name: name~'[tel]',
				placeholder: 'Telephone Number',
				value: type == 'tel' ? value.value
			}) }}
		</div>
		{% endif %}

		{% if types.custom is defined %}
		<div class="fruitlinkit-option fruitlinkit-custom{{ type != 'custom' ? ' hidden' }}">
			{{ forms.textField({
				id: name~'Custom',
				class: name~'Custom',
				name: name~'[custom]',
				placeholder: 'Custom URL',
				value: type == 'custom' ? value.value
			}) }}
		</div>
		{% endif %}

		{% if types.entry is defined %}
		<div class="fruitlinkit-option fruitlinkit-entry{{ type != 'entry' ? ' hidden' }}">
			{{ forms.elementSelectField({
				id: name~'Entry',
				class: name~'Entry',
				name: name~'[entry]',
			}|merge(elementSelectSettings.entry)) }}
		</div>
		{% endif %}

		{% if types.asset is defined %}
		<div class="fruitlinkit-option fruitlinkit-asset{{ type != 'asset' ? ' hidden' }}">
			{{ forms.elementSelectField({
				id: name~'Asset',
				class: name~'Asset',
				name: name~'[asset]',
			}|merge(elementSelectSettings.asset)) }}
		</div>
		{% endif %}

		{% if types.category is defined %}
		<div class="fruitlinkit-option fruitlinkit-category{{ type != 'category' ? ' hidden' }}">
			{{ forms.elementSelectField({
				id: name~'Category',
				class: name~'Category',
				name: name~'[category]',
			}|merge(elementSelectSettings.category)) }}
		</div>
		{% endif %}

		{% if types.product is defined %}
		<div class="fruitlinkit-option fruitlinkit-product{{ type != 'product' ? ' hidden' }}">
			{{ forms.elementSelectField({
				id: name~'Product',
				class: name~'Product',
				name: name~'[product]',
			}|merge(elementSelectSettings.product)) }}
		</div>
		{% endif %}

		{# Custom types #}
		{% for key, val in types if key not in ['','email','custom','tel','entry','asset','category','product'] %}
		{% if elementSelectSettings[key] is defined %}
		<div class="fruitlinkit-option fruitlinkit-{{ key }}{{ type != key ? ' hidden' }}">
			{{ forms.elementSelectField({
				id: name~key,
				class: name~key,
				name: name~'['~key~']',
			}|merge(elementSelectSettings[key])) }}
		</div>
		{% endif %}
		{% endfor %}
	</div>

	{# Text & Target #}
	{% if settings.allowCustomText or settings.allowTarget %}
	<div class="fruitlinkit-settings{{ type == '' ? ' hidden' }}">

		{% if settings.allowCustomText %}

			<div class="fruit-field-column fruitlinkit-text">
				{{ forms.textField({
					id: name~'CustomText',
					class: name~'CustomText',
					name: name~'[customText]',
					placeholder: settings.defaultText == '' ? 'Custom Link Text' : settings.defaultText,
					value: value.customText is defined and value.customText ? value.customText
				}) }}
			</div>

		{% endif %}

		{% if settings.allowTarget %}

			<div class="fruit-field-column fruitlinkit-target">
				{{ forms.checkboxField({
					id: name~'Target',
					class: name~'Target',
					name: name~'[target]',
					value: '_blank',
					label: 'Open link in new window?',
					checked: value.target is defined and value.target == '_blank' ? true : null
				}) }}
			</div>

		{% endif %}

	</div>
	{% endif %}

</div>