{% INCLUDE 'overall_header.html' %}
<h1>{{ lang('ACP_RANDOMBANNER_TITLE') }}</h1>
<script>
	document.addEventListener('DOMContentLoaded', function () {
		var addButton = document.getElementById('add-randombanner-row');
		if (addButton)
		{
			addButton.addEventListener('click', add_randombanner_row);
		}
	});

	function add_randombanner_row()
	{
		var rows = document.querySelectorAll('.randombanner-row');
		if (!rows.length)
		{
			return;
		}

		var lastRow = rows[rows.length - 1];
		var newRow = lastRow.cloneNode(true);

		// Clear all text inputs in the cloned row
		var inputs = newRow.querySelectorAll('input[type="text"]');
		for (var i = 0; i < inputs.length; i++)
		{
			inputs[i].value = '';
		}

		// Reset the Link Target select back to its first option
		var selects = newRow.querySelectorAll('select');
		for (var j = 0; j < selects.length; j++)
		{
			selects[j].selectedIndex = 0;
		}

		// Insert the new row right after the last one, keeping the
		// existing <hr> separator that follows it in place
		lastRow.parentNode.insertBefore(newRow, lastRow.nextSibling);
	}
</script>
<form id="acp_randombanner" method="post" action="{{ U_ACTION }}">
	{% if ERROR_MSG %}
	<div class="errorbox">
		<p>{{ ERROR_MSG }}</p>
	</div>
	{% endif %}
	<fieldset>
		<legend>{{ lang('RANDOMBANNER_CONFIG_SET') }}</legend>
		<dl>
			<dt>
				<label for="randombanner_enable">{{ lang('RANDOMBANNER_ENABLE') }}</label>
			</dt>
			<dd>
				<label><input type="radio" class="radio" id="randombanner_enable" name="randombanner_enable" value="1" {% if RANDOMBANNER_ENABLE %}checked {% endif %}> {{ lang('YES') }}</label>  
				<label><input type="radio" class="radio" name="randombanner_enable" value="0" {% if not RANDOMBANNER_ENABLE %}checked {% endif %} > {{ lang('NO') }}</label> 
			</dd>
		</dl>
	</fieldset>
	<fieldset>
		<dl>
			<dt>
				<label for="randombanner_logo">{{ lang('RANDOMBANNER_LOGO') }}</label>
			</dt>
			<dd>
				<label><input type="radio" class="radio" id="randombanner_logo" name="randombanner_logo" value="1"{% if RANDOMBANNER_LOGO %}  checked {% endif %} > {{ lang('YES') }}</label>
				<label><input type="radio" class="radio" name="randombanner_logo" value="0"{% if not RANDOMBANNER_LOGO %} checked {% endif %} > {{ lang('NO') }}</label>
			</dd>
		</dl>
		<dl>
			<dt>
				<label for="randombanner_background">{{ lang('RANDOMBANNER_BACKGROUND') }}</label>
			</dt>
			<dd>
				<label><input type="radio" class="radio" id="randombanner_background" name="randombanner_background" value="1"{% if RANDOMBANNER_BACKGROUND %} checked {% endif %} > {{ lang('YES') }}</label> 
				<label><input type="radio" class="radio" name="randombanner_background" value="0"{% if not RANDOMBANNER_BACKGROUND %} checked {% endif %} > {{ lang('NO') }}</label>
			</dd>
		</dl>
		<dl>
			<dt><label for="randombanner_corner">{{ lang('RANDOMBANNER_CORNER') }}</label>
			</dt>
			<dd>
				<input name="randombanner_corner" type="number" min="0" required id="randombanner_corner" value="{{ RANDOMBANNER_CORNER }}" size="4" maxlength="4" > {{ lang('RANDOMBANNER_PX') }}
			</dd>
		</dl>
		<dl>
			<dt>
				<label for="randombanner_search">{{ lang('RANDOMBANNER_SEARCH') }}</label>
			</dt>
			<dd>
				<select name="randombanner_search" id="randombanner_search">
				<option value="1"{% if RANDOMBANNER_SEARCH eq '1' %} selected {% endif %}>{{ lang('RANDOMBANNER_SEARCH_HEADER_TOP_LEFT') }}</option>
				<option value="2"{% if RANDOMBANNER_SEARCH eq '2' %} selected {% endif %}>{{ lang('RANDOMBANNER_SEARCH_HEADER_TOP_RIGHT') }}</option>
				<option value="3"{% if RANDOMBANNER_SEARCH eq '3' %} selected {% endif %}>{{ lang('RANDOMBANNER_SEARCH_HEADER_BOTTOM_LEFT') }}</option>
				<option value="4"{% if RANDOMBANNER_SEARCH eq '4' %} selected {% endif %}>{{ lang('RANDOMBANNER_SEARCH_HEADER_BOTTOM_RIGHT') }}</option>
				<option value="7"{% if RANDOMBANNER_SEARCH eq '7' %} selected {% endif %}>{{ lang('RANDOMBANNER_SEARCH_HEADER_BOTTOM_MIDDLE') }}</option>
				<option value="5"{% if RANDOMBANNER_SEARCH eq '5' %} selected {% endif %}>{{ lang('RANDOMBANNER_SEARCH_NAVBAR') }}</option>
				<option value="6"{% if RANDOMBANNER_SEARCH eq '6' %} selected {% endif %}>{{ lang('RANDOMBANNER_SEARCH_REMOVE') }}</option>
				</select>
			</dd>
		</dl>
	</fieldset>
	<fieldset>
		<dl>
			<dt>
				<h1>{{ lang('RANDOMBANNER_INSTRUCTIONS') }}</h1>
				<br style="margin-bottom:4px;">
				<label>{{ lang('RANDOMBANNER_RANDOM') }}</label>
				<br style="margin-bottom:8px;">
				{{ lang('RANDOMBANNER_RANDOM_INFO') }}
				<br style="margin-bottom:8px;">
				<label>{{ lang('RANDOMBANNER_BANNER') }}</label>
				<br style="margin-bottom:8px;">
				{{ lang('RANDOMBANNER_BANNER_INFO') }}
				<br style="margin-bottom:8px;">
				<label>{{ lang('RANDOMBANNER_TITLE') }}</label>
				<br style="margin-bottom:8px;">
				{{ lang('RANDOMBANNER_TITLE_INFO') }}
				<br style="margin-bottom:8px;">
				<label>{{ lang('RANDOMBANNER_LINK') }}</label>
				<br style="margin-bottom:8px;">
				{{ lang('RANDOMBANNER_LINK_INFO') }}
				<br style="margin-bottom:8px;">
				<label>{{ lang('RANDOMBANNER_TARGET') }}</label>
				<br style="margin-bottom:8px;">
				{{ lang('RANDOMBANNER_TARGET_INFO') }}
				<br style="margin-bottom:8px;">
			</dt>
			<dd>
				{% for randombanner_images in loops.randombanner_images %}
				<p class="randombanner-row">
					<strong>{{ lang('RANDOMBANNER_BANNER') ~ lang('COLON') }}</strong><br>
					<input class="full" name="randombanner_image[]" type="text" value="{{ randombanner_images.RANDOMBANNER_IMAGE }}"><br>
					<strong>{{ lang('RANDOMBANNER_TITLE') ~ lang('COLON') }}</strong><br>
					<input class="full" name="randombanner_title[]" type="text" value="{{ randombanner_images.RANDOMBANNER_TITLE }}"><br>
					<strong>{{ lang('RANDOMBANNER_URL') ~ lang('COLON') }}</strong><br>
					<input class="full" name="randombanner_url[]" type="text" value="{{ randombanner_images.RANDOMBANNER_URL }}"><br>					<strong>{{ lang('RANDOMBANNER_TARGET') ~ lang('COLON') }}</strong><br>
					<select name="randombanner_target[]">
					<option value="0"{% if randombanner_images.RANDOMBANNER_TARGET eq '0' %} selected {% endif %}>{{ lang('RANDOMBANNER_NOTHING') }}</option>
					<option value="1"{% if randombanner_images.RANDOMBANNER_TARGET eq '1' %} selected {% endif %}>{{ lang('RANDOMBANNER_NEW') }}</option>
					<option value="2"{% if randombanner_images.RANDOMBANNER_TARGET eq '2' %} selected {% endif %}>{{ lang('RANDOMBANNER_SAME') }}</option>
					</select>
				</p>
				<hr>
				{% endfor %}
			<dd id="link1"><input id="add-randombanner-row" value="{{ lang('RANDOMBANNER_MORE_BANNERS') }}" type="button"></dd>
			</dd>
		</dl>
	</fieldset>
	<p class="submit-buttons">
		{{ S_FORM_TOKEN }}
		<input class="button1" type="submit" id="submit" name="submit" value="{{ lang('SUBMIT') }}" >&nbsp;
		<input class="button2" type="reset" id="reset" name="reset" value="{{ lang('RESET') }}" >
	</p>
</form>
{% INCLUDE 'overall_footer.html' %}