{% include 'overall_header.html' %}

<header class="iz-pagehead">
	{% if TOPIC_TITLE %}
		<h1 class="iz-pagehead__title">
			{% EVENT posting_topic_title_before %}<a class="iz-link" href="{{ U_VIEW_TOPIC }}">{{ TOPIC_TITLE }}</a>{% EVENT posting_topic_title_after %}
		</h1>
	{% else %}
		<h1 class="iz-pagehead__title">
			<a class="iz-link" href="{{ U_VIEW_FORUM }}">{{ FORUM_NAME }}</a>
		</h1>
	{% endif %}
</header>

{% if S_FORUM_RULES %}
	<div class="iz-alert iz-alert--info" role="note" data-iz-dismissable>
		<div class="iz-alert__content">
			{% if U_FORUM_RULES %}
				<a class="iz-link" href="{{ U_FORUM_RULES }}">{{ L_FORUM_RULES }}</a>
			{% else %}
				<strong>{{ L_FORUM_RULES }}{{ L_COLON }}</strong>&nbsp;{{ FORUM_RULES }}
			{% endif %}
		</div>

		<button type="button" class="iz-alert__close" aria-label="{{ L_CLOSE }}">
			{{ L_CLOSE }}
		</button>
	</div>
{% endif %}

<form id="postform" class="iz-form" method="post" action="{{ S_POST_ACTION }}"{{ S_FORM_ENCTYPE }}>

	{% if S_DRAFT_LOADED %}
		<div class="iz-alert iz-alert--success" role="status">
			<h2 class="iz-h4">{{ L_INFORMATION }}</h2>
			<p>{{ L_DRAFT_LOADED }}</p>
		</div>
	{% endif %}

	{% if S_SHOW_DRAFTS %}{% include 'drafts.html' %}{% endif %}

	{% if S_POST_REVIEW %}{% include 'posting_review.html' %}{% endif %}

	{% if S_DISPLAY_PREVIEW %}{% include 'posting_preview.html' %}{% endif %}

	<section id="postingbox" class="iz-card iz-card--post">
		<header class="iz-card__header">
			<h2 class="iz-card__title">{{ L_POST_A }}</h2>
		</header>

		<div class="iz-card__body">
			{% set EXTRA_POSTING_OPTIONS = 1 %}
			{% include 'posting_editor.html' %}
		</div>

		{{ S_FORM_TOKEN }}

		<!--
			These includes were previously rendered outside the editor due to Bootstrap tabs/panels.
			With the modernized posting_editor.html, attachments/polls/etc. are included within the
			disclosure panels there. Keep the event hook for extensions, but avoid duplicating UI.
		-->
		{% EVENT posting_layout_include_panel_body %}
	</section>

</form>

{% if S_DISPLAY_REVIEW %}
	<section class="iz-card iz-card--review">
		<div class="iz-card__body">
			{% include 'posting_topic_review.html' %}
		</div>
	</section>
{% endif %}

<script>
(function () {
	'use strict';

	// Optional: allow closing forum rules notice without Bootstrap.
	var closers = document.querySelectorAll('[data-iz-dismissable] .iz-alert__close');
	if (!closers.length) return;

	for (var i = 0; i < closers.length; i++) {
		closers[i].addEventListener('click', function (e) {
			var alert = e.target.closest('[data-iz-dismissable]');
			if (alert) alert.parentNode.removeChild(alert);
		});
	}
})();
</script>

{% include 'overall_footer.html' %}