{# begin {templatelocation} #}
<script src="{site_url}/javascript/addons/character-counter/jquery.charactercounter.js" type="text/javascript"></script>
{!if msg}
<div class="uk-alert uk-alert-warning">{msg}</div>
{!endif}
<form class="uk-form uk-form-horizontal" action="{s_form_action}" method="post">
	<input type="hidden" name="mode" id="mode" value="{mode}">
{!if spamx_id}
	<input type="hidden" name="id" id="id" value="{spamx_id}">
{!endif}
	<div class="uk-form-row">
		<label class="uk-form-label">Type</label>
		<div class="uk-form-controls">
			<select id="spamx_type" name="spamx_type">
				<option value="Personal" {personal_selected}>{lang_blacklist}</option>
				<option value="HTTPHeader" {httpheader_selected}>{lang_http_header}</option>
				<option value="IP" {ip_selected}>{lang_ip_blacklist}</option>
				<option value="IPofUrl" {ipofurl_selected}>{lang_ipofurl}</option>
			</select>
		</div>
	</div>

	<div class="uk-form-row">
		<label id="spamx_label" for="spamx_item" class="uk-form-label">{lang_blacklist_prompt}</label>
		<div class="uk-form-controls">
			<input class="uk-form-width-large" maxsize="255" id="spamx_item" type="text" name="spamx_item" value="{item}">
			<div class="uk-form-help-block uk-margin-small-left">
				<span class="uk-text-muted uk-text-small">{$LANG_ADMIN[remaining_chars]}<span id="spamx_item-count" class="uk-text-muted uk-text-small"></span></span>
			</div>
		</div>
	</div>

	<div id="http_header_content" class="uk-form-row" style="display:none;">
		<label class="uk-form-label">{lang_content}</label>
		<div class="uk-form-controls">
			<input type="text" maxsize="255" id="spamx_content" name="spamx_content" class="uk-form-width-large" value="{http_header_content}">
			<div class="uk-form-help-block uk-margin-small-left">
				<span class="uk-text-muted uk-text-small">{$LANG_ADMIN[remaining_chars]}<span id="spamx_content-count" class="uk-text-muted uk-text-small"></span></span>
			</div>

		</div>
	</div>

	<div class="uk-margin">
		<button class="uk-button uk-button-primary" type="submit" name="submit" id="submit" value="{lang_submit}">{lang_submit}</button>
		<button class="uk-button" type="submit" name="cancel" id="cancel" value="{lang_cancel}">{lang_cancel}</button>
	</div>
</form>
<script  type="text/javascript">
$('#spamx_type').change(function() {
	var sxtype = $('#spamx_type').val();
	switch ( sxtype ) {
		case 'Personal' :
			$('#spamx_label').html("{lang_blacklist_prompt}");
			$('#http_header_content').hide();

			break;
		case 'HTTPHeader' :
			$('#spamx_label').html("{lang_http_header_prompt}");
			$('#http_header_content').show();
			break;
		case 'IP' :
			$('#spamx_label').html("{lang_ip_prompt}");
			$('#http_header_content').hide();

			break;
		case 'IPofUrl' :
			$('#spamx_label').html("{lang_ipofurl_prompt}");
			$('#http_header_content').hide();
			break;
	}
});
$(function(){
	$("#spamx_item").characterCounter({
		limit: '255',
		counterSelector: '#spamx_item-count'
	});
	$("#spamx_content").characterCounter({
		limit: '255',
		counterSelector: '#spamx_count-count'
	});
});
$( document ).ready(function() {
	$('#spamx_type').trigger('change');
});
</script>
{# end {templatelocation} #}