{% INCLUDE 'overall_header.html' %}
{% INCLUDECSS '@dark1_memberavatarstatus/mas_header.css' %}

<style>
	.mas-status-dot.mas-color {
		background-color: #{{ MAS_COLOR_OFFLINE }};
	}
	.mas-status-dot.mas-color:after {
		background-color: #{{ MAS_COLOR_OFFLINE }};
	}
	.mas-status-online .mas-status-dot.mas-color {
		background-color: #{{ MAS_COLOR_ONLINE }};
	}
	.mas-status-online .mas-status-dot.mas-color:after {
		background-color: #{{ MAS_COLOR_ONLINE }};
	}
</style>

<h1>{{ MAS_EXT_NAME }}</h1>
<div>{{ lang('ACP_MAS_BY') }}&nbsp;{{ MAS_EXT_DEV }}</div>
<hr class="acp-mas-hr" />
<h2>{{ MAS_EXT_MODE }}</h2>

<form id="acp_board" method="post" action="{{ U_ACTION }}">

	<fieldset>
		<legend>{{ lang('ACP_MAS_AV_SET') }}</legend>
		<dl>
			<dt>
				<label for="dark1_mas_avatar">{{ lang('ACP_MAS_AVATAR') ~ lang('COLON') }}</label>
				<br>
				<div>{{ lang('ACP_MAS_GN_AV_EXPLAIN') }}</div>
			</dt>
			<dd>
				<label><input type="radio" class="radio" name="dark1_mas_avatar" value="1" {% if MAS_AVATAR %}checked="checked"{% endif %} id="dark1_mas_av" /> {{ lang('YES') }}</label>
				<label><input type="radio" class="radio" name="dark1_mas_avatar" value="0" {% if not MAS_AVATAR %}checked="checked"{% endif %} /> {{ lang('NO') }}</label>
			</dd>
		</dl>
	</fieldset>

	<fieldset>
		<legend>{{ lang('ACP_MAS_OL_SET') }}</legend>
		<dl>
			<dt>
				<label for="dark1_mas_online">{{ lang('ACP_MAS_ONLINE') ~ lang('COLON') }}</label>
				<br>
				<div>{{ lang('ACP_MAS_GN_OL_EXPLAIN') }}</div>
			</dt>
			<dd>
				<label><input type="radio" class="radio" name="dark1_mas_online" value="1" {% if MAS_ONLINE %}checked="checked"{% endif %} id="dark1_mas_ol" /> {{ lang('YES') }}</label>
				<label><input type="radio" class="radio" name="dark1_mas_online" value="0" {% if not MAS_ONLINE %}checked="checked"{% endif %} /> {{ lang('NO') }}</label>
				<br ><br >
				<div style="font-weight: bold;">
					<span class="mas-status-online">
						<span>{{ lang('ONLINE') }}</span>
						<span class="mas-status-dot mas-color" title="{{ lang('ONLINE') }}"></span>
					</span>
					<span style="font-weight: normal;">&nbsp;&nbsp;{{ lang('ACP_MAS_AND') }}&nbsp;&nbsp;</span>
					<span>
						<span>{{ lang('OFFLINE') }}</span>
						<span class="mas-status-dot mas-color" title="{{ lang('OFFLINE') }}"></span>
					</span>
				</div>
			</dd>
		</dl>
		<dl>
			<dt>
				<label>{{ lang('ACP_MAS_COL_ON') ~ lang('COLON') }}</label>
				<br>
				<div>{{ lang('ACP_MAS_COL_ON_EXPLAIN') }}</div>
			</dt>
			<dd>
				<input name="dark1_mas_col_on" type="text" id="dark1_mas_col_on" value="{{ MAS_COLOR_ONLINE }}" size="6" maxlength="6" />
				{% if MAS_COLOR_OFFLINE %}&nbsp;<span style="background-color: #{{ MAS_COLOR_ONLINE }}">&nbsp; &nbsp;</span>{% endif %}
				<div id="color_palette_placeholder" data-orientation="h" data-height="12" data-width="15" data-target="#dark1_mas_col_on"></div>
			</dd>
		</dl>
		<dl>
			<dt>
				<label>{{ lang('ACP_MAS_COL_OFF') ~ lang('COLON') }}</label>
				<br>
				<div>{{ lang('ACP_MAS_COL_OFF_EXPLAIN') }}</div>
			</dt>
			<dd>
				<input name="dark1_mas_col_off" type="text" id="dark1_mas_col_off" value="{{ MAS_COLOR_OFFLINE }}" size="6" maxlength="6" />
				{% if MAS_COLOR_OFFLINE %}&nbsp;<span style="background-color: #{{ MAS_COLOR_OFFLINE }}">&nbsp; &nbsp;</span>{% endif %}
				<div id="color_palette_placeholder" data-orientation="h" data-height="12" data-width="15" data-target="#dark1_mas_col_off"></div>
			</dd>
		</dl>
	</fieldset>

	<fieldset>
		<legend>{{ lang('ACP_SUBMIT_CHANGES') }}</legend>
		<fieldset class="submit-buttons">
			<input class="button1" type="submit" id="submit" name="submit" value="{{ lang('SUBMIT') }}" />
			&nbsp;&nbsp;
			<input class="button2" type="reset" id="reset" name="reset" value="{{ lang('RESET') }}" />
			{{ S_FORM_TOKEN }}
		</fieldset>
	</fieldset>

</form>

{% INCLUDE 'overall_footer.html' %}