{% if MCHAT_PAGE in ['custom', 'archive'] %}
	{% INCLUDE 'overall_header.html' %}
{% endif %}

{% EVENT dmzx_mchat_overall_header_after %}

{% EVENT dmzx_mchat_header_before %}

{% if MCHAT_PAGE == 'custom' %}
   	<h2>{{ lang('MCHAT_CUSTOM_PAGE') }}</h2>
{% elseif MCHAT_PAGE == 'archive' %}
	<h2>{{ lang('MCHAT_ARCHIVE_PAGE') }}</h2>
{% endif %}

{% EVENT dmzx_mchat_header_after %}

{% INCLUDE '@dmzx_mchat/mchat_script_data.html' %}

{% if MCHAT_PAGE == 'archive' and (loops.pagination|length or MCHAT_TOTAL_MESSAGES) %}
<div class="action-bar bar-top">
	{% EVENT dmzx_mchat_action_bar_top_before %}
	<div class="pagination">
		{{ MCHAT_TOTAL_MESSAGES }}
		{% if loops.pagination|length %}
			{% INCLUDE 'pagination.html' %}
		{% else %}
			&bull; {{ PAGE_NUMBER }}
		{% endif %}
	</div>
	{% EVENT dmzx_mchat_action_bar_top_after %}
</div>
{% endif %}

{% EVENT dmzx_mchat_before %}

{% if MCHAT_IS_COLLAPSIBLE %}
	<a class="category{% if S_MCHAT_HIDDEN %} hidden-category{% endif %} mchat-category"></a>
{% endif %}

<div class="forabg mchat-wrapper">
	<a id="mChat"></a>
	<div class="inner">
		<ul class="topiclist">
			<li class="header">
				{% INCLUDE '@dmzx_mchat/mchat_header.html' %}
				{% if MCHAT_IS_COLLAPSIBLE %}
					<a href="{{ U_MCHAT_COLLAPSE_URL }}"
						class="collapse-btn collapse-{{ S_MCHAT_HIDDEN ? 'show' : 'hide' }} mchat-collapse"
						data-hidden="{{ S_MCHAT_HIDDEN }}"
						data-ajax="phpbb_collapse"
						data-overlay="true"
						title="{{ lang('MCHAT_COLLAPSE_TITLE') }}"></a>
				{% endif %}
			</li>
		</ul>

		{% EVENT dmzx_mchat_body_before %}

		<div id="mchat-body"{% if MCHAT_IS_COLLAPSIBLE %} class="collapsible"{% endif %}>
			{% if not MCHAT_SOUND_DISABLED %}
				<audio id="mchat-sound-add" class="hidden" src="{{ EXT_URL }}sounds/add.mp3" preload="auto"></audio>
				<audio id="mchat-sound-edit" class="hidden" src="{{ EXT_URL }}sounds/edit.mp3" preload="auto"></audio>
				<audio id="mchat-sound-del" class="hidden" src="{{ EXT_URL }}sounds/del.mp3" preload="auto"></audio>
				<audio id="mchat-sound-error" class="hidden" src="{{ EXT_URL }}sounds/error.mp3" preload="auto"></audio>
			{% endif %}

			<div id="mchat-confirm" class="hidden">
				<h3>{{ lang('CONFIRM') }}</h3>
				<div class="mchat-confirm-fields">
					<p></p>
					<textarea></textarea>
				</div>
				<fieldset class="submit-buttons">
					<input type="button" name="confirm" value="{{ lang('MCHAT_OK') }}" class="button2" />&nbsp;
					<input type="button" name="cancel" value="{{ lang('CANCEL') }}" class="button2" />
				</fieldset>
			</div>

			<div id="mchat-main"{% if MCHAT_MESSAGE_TOP %} class="mchat-messages-top"{% endif %}>
				{% if MCHAT_STATIC_MESS and MCHAT_PAGE != 'archive' %}
					<ul class="topiclist forums">
						<li class="row mchat-static">{{ MCHAT_STATIC_MESS }}</li>
					</ul>
				{% endif %}

				{% EVENT dmzx_mchat_messages_container_before %}

				<ul id="mchat-messages" class="topiclist forums">
					{% if loops.mchatrow|length %}
						{% INCLUDE '@dmzx_mchat/mchat_messages.html' %}
					{% else %}
						<li class="row mchat-static mchat-no-messages">{{ lang('MCHAT_NOMESSAGE') }}</li>
					{% endif %}
				</ul>

				{% EVENT dmzx_mchat_messages_container_after %}
			</div>

			{% INCLUDE '@dmzx_mchat/mchat_panel.html' %}
		</div>

		{% EVENT dmzx_mchat_body_after %}
	</div>
</div>

{% EVENT dmzx_mchat_after %}

{% if MCHAT_PAGE == 'archive' %}
<div class="action-bar bottom">
	{% EVENT dmzx_mchat_action_bar_bottom_before %}
	<div class="pagination">
		{{ MCHAT_TOTAL_MESSAGES }}
		{% if loops.pagination|length %}
			{% INCLUDE 'pagination.html' %}
		{% else %}
			&bull; {{ PAGE_NUMBER }}
		{% endif %}
	</div>
	{% EVENT dmzx_mchat_action_bar_top_after %}
</div>
{% endif %}

{% if MCHAT_PAGE == 'custom' and MCHAT_WHOIS_REFRESH %}
<div class="stat-block mchat-list">
	<h3>{{ lang('MCHAT_WHO_IS_CHATTING') }}</h3>
	<div class="container-mchat-list">
	{% INCLUDE '@dmzx_mchat/mchat_whois.html' %}
	<div id="mchat-refresh" class="mchat-refresh">
		<span id="mchat-refresh-explain">{{ lang('MCHAT_WHO_IS_REFRESH_EXPLAIN', MCHAT_WHOIS_REFRESH / 1000) }}</span>
		<span id="mchat-refresh-pending" class="hidden">{{ lang('MCHAT_REFRESHING') }}</span>
	</div>
	<div id="mchat-legend" class="mchat-legend">
		<em>{{ lang('LEGEND') ~ lang('COLON') }} {{ LEGEND }}</em>
	</div>
	</div>
{% endif %}

{% if MCHAT_PAGE in ['archive'] and LEGEND %}
<div class="stat-block mchat-list">
	<h3>{L_LEGEND}</h3>
	<div class="container-mchat-list">
	<div id="mchat-legend" class="mchat-legend">
		<em>{{ lang('LEGEND') ~ lang('COLON') }} {{ LEGEND }}</em>
	</div>
	</div>
</div>
{% endif %}

{% EVENT dmzx_mchat_overall_footer_before %}

{% if MCHAT_PAGE in ['custom', 'archive'] %}
	{% INCLUDE 'overall_footer.html' %}
{% endif %}