{% include 'ucp_header.html' %}

{% if not PROMPT %}
	{% include 'ucp_pm_message_header.html' %}
{% endif %}

{% if PROMPT %}
	<form id="viewfolder" method="post" action="{{ S_PM_ACTION }}" class="iz-form">
		<section class="iz-card iz-card--ucp iz-card--pm-export">
			<header class="iz-card__header">
				<h2 class="iz-card__title">{{ L_EXPORT_AS_CSV }}&nbsp;{{ L_OPTIONS }}</h2>
			</header>

			<div class="iz-card__body">
				<div class="iz-fieldgroup">

					<div class="iz-field">
						<label class="iz-field__label" for="delimiter">{{ L_DELIMITER }}{{ L_COLON }}</label>
						<div class="iz-field__control">
							<input type="text" class="iz-input" id="delimiter" name="delimiter" value="," />
						</div>
					</div>

					<div class="iz-field">
						<label class="iz-field__label" for="enclosure">{{ L_ENCLOSURE }}{{ L_COLON }}</label>
						<div class="iz-field__control">
							<input type="text" class="iz-input" id="enclosure" name="enclosure" value="&#034;" />
						</div>
					</div>

				</div>

				<div class="iz-space iz-space--sm"></div>

				<div class="iz-actions">
					<input type="hidden" name="export_option" value="CSV" />
					<button class="iz-btn iz-btn--primary" type="submit" name="submit_export" value="{{ L_EXPORT_FOLDER }}">
						{{ L_EXPORT_FOLDER }}
					</button>
					<button class="iz-btn iz-btn--ghost" type="reset" value="{{ L_RESET }}" name="reset">
						{{ L_RESET }}
					</button>
				</div>

				{{ S_FORM_TOKEN }}
			</div>
		</section>
	</form>

{% else %}

	{% if NUM_REMOVED %}
		<div class="iz-alert iz-alert--info" role="status">
			{{ RULE_REMOVED_MESSAGES }}
		</div>
		<div class="iz-space iz-space--sm"></div>
	{% endif %}

	{% if NUM_NOT_MOVED %}
		<div class="iz-alert iz-alert--info" role="status">
			{{ NOT_MOVED_MESSAGES }}<br />{{ RELEASE_MESSAGE_INFO }}
		</div>
		<div class="iz-space iz-space--sm"></div>
	{% endif %}

	{% if messagerow %}
		<section class="iz-card iz-card--nested" aria-label="{{ L_MESSAGE }}">
			<header class="iz-card__header">
				<h3 class="iz-card__title">{{ L_MESSAGE }}</h3>
			</header>

			<div class="iz-card__body">
				<div class="iz-tablewrap" role="region" aria-label="{{ L_MESSAGE }}">
					<table class="iz-table iz-table--pm-folder">
						<thead>
							<tr>
								<th scope="col">
									{% if S_SHOW_RECIPIENTS %}
										{{ L_MESSAGE_TO }}&nbsp;&#47;&nbsp;{{ L_SUBJECT }}
									{% else %}
										{{ L_SUBJECT }}&nbsp;&#47;&nbsp;{{ L_FROM }}
									{% endif %}
								</th>
								<th scope="col" class="iz-only-desktop">
									{% if S_SHOW_RECIPIENTS %}
										{{ L_SENT_AT }}&nbsp;{{ L_DATES }}
									{% else %}
										{{ L_DATES }}
									{% endif %}
								</th>
								<th scope="col" class="iz-table__check iz-only-desktop">{{ L_MARK }}</th>
							</tr>
						</thead>

						<tbody>
							{% for messagerow in messagerow %}
								<tr>
									<td>
										{% if messagerow.S_PM_DELETED %}
											<a class="iz-link" href="{{ messagerow.U_REMOVE_PM }}">{{ L_DELETE_MESSAGE }}</a><br />
											<div class="iz-alert iz-alert--danger" role="status">
												{{ L_MESSAGE_REMOVED_FROM_OUTBOX }}
											</div>
										{% else %}
											<a class="iz-link{% if messagerow.S_PM_UNREAD %} iz-link--strong{% endif %}"
											   href="{{ messagerow.U_VIEW_PM }}">
												{{ messagerow.SUBJECT }}
											</a>
										{% endif %}

										<div class="iz-meta iz-meta--small">
											{% if S_SHOW_RECIPIENTS %}
												<span class="iz-meta__item">{{ L_BY }}&nbsp;{{ messagerow.RECIPIENTS }}</span>
											{% else %}
												<span class="iz-meta__item">{{ L_BY }}&nbsp;{{ messagerow.MESSAGE_AUTHOR_FULL }}</span>
											{% endif %}

											{% if messagerow.S_PM_REPORTED %}
												<span class="iz-sep">•</span>
												<a class="iz-link" href="{{ messagerow.U_MCP_REPORT }}">{{ L_REPORT }}</a>
											{% endif %}

											{% if messagerow.ATTACH_ICON_IMG %}
												<span class="iz-sep">•</span>
												<span class="iz-meta__item">{{ L_ATTACH_FORUM }}</span>
											{% endif %}
										</div>

										{% if messagerow.S_AUTHOR_DELETED %}
											<div class="iz-meta iz-meta--small">{{ L_PM_FROM_REMOVED_AUTHOR }}</div>
										{% endif %}

										{% if S_UNREAD %}
											<div class="iz-meta iz-meta--small">
												{% if messagerow.FOLDER %}
													<a class="iz-link" href="{{ messagerow.U_FOLDER }}">{{ messagerow.FOLDER }}</a>
												{% else %}
													{{ L_UNKNOWN_FOLDER }}
												{% endif %}
											</div>
										{% endif %}

										<!-- Mobile date + checkbox -->
										<div class="iz-only-mobile iz-row iz-row--between iz-row--wrap iz-row--gap-sm">
											<div class="iz-meta iz-meta--small">
												{{ messagerow.SENT_TIME }}
											</div>
											<div class="iz-choice iz-choice--check">
												<input id="{{ messagerow.MESSAGE_ID }}" name="marked_msg_id[]" value="{{ messagerow.MESSAGE_ID }}" type="checkbox" />
												<label for="{{ messagerow.MESSAGE_ID }}">
													<span class="iz-visually-hidden">{{ L_MARK }}</span>
												</label>
											</div>
										</div>
									</td>

									<td class="iz-only-desktop">
										{{ messagerow.SENT_TIME }}
									</td>

									<td class="iz-table__check iz-only-desktop">
										<div class="iz-choice iz-choice--check">
											<input id="{{ messagerow.MESSAGE_ID }}" name="marked_msg_id[]" value="{{ messagerow.MESSAGE_ID }}" type="checkbox" />
											<label for="{{ messagerow.MESSAGE_ID }}">
												<span class="iz-visually-hidden">{{ L_MARK }}</span>
											</label>
										</div>
									</td>
								</tr>
							{% endfor %}
						</tbody>
					</table>
				</div>
			</div>
		</section>

	{% else %}
		{% if S_COMPOSE_PM_VIEW and S_NO_AUTH_SEND_MESSAGE %}
			<p class="iz-prose">
				<strong>{% if S_USER_NEW %}{{ L_USER_NEW_PERMISSION_DISALLOWED }}{% else %}{{ L_NO_AUTH_SEND_MESSAGE }}{% endif %}</strong>
			</p>
		{% else %}
			<div class="iz-alert iz-alert--info" role="status">
				<strong>{{ L_INFORMATION }}{{ L_COLON }}&nbsp;</strong>{{ L_NO_MESSAGES }}
			</div>
		{% endif %}
	{% endif %}


	{% if FOLDER_CUR_MESSAGES != 0 %}
		<div class="iz-space iz-space--md"></div>

		<div class="iz-toolbar iz-toolbar--ucp-actions" aria-label="{{ L_OPTIONS }}">
			<div class="iz-toolbar__left">
				<div class="iz-actions">
					<button type="button" class="iz-btn iz-btn--ghost iz-btn--sm"
						onclick="marklist('viewfolder', 'marked_msg', true); return false;">
						{{ L_MARK_ALL }}
					</button>
					<button type="button" class="iz-btn iz-btn--ghost iz-btn--sm"
						onclick="marklist('viewfolder', 'marked_msg', false); return false;">
						{{ L_UNMARK_ALL }}
					</button>
				</div>
			</div>

			<div class="iz-toolbar__right">
				<nav class="iz-pager" aria-label="{{ L_PAGINATION }}">
					<div class="iz-pager__meta">{{ TOTAL_MESSAGES }}</div>
					<div class="iz-pager__nav">
						{% if pagination %}
							{% include 'pagination.html' %}
						{% else %}
							<span class="iz-pager__current" aria-current="page">{{ PAGE_NUMBER }}</span>
						{% endif %}
					</div>
				</nav>
			</div>
		</div>

		<div class="iz-space iz-space--sm"></div>

		<details class="iz-disclosure">
			<summary class="iz-disclosure__summary">{{ L_OPTIONS }}</summary>

			<div class="iz-disclosure__body">

				<div class="iz-fieldgroup">

					<div class="iz-field">
						<label class="iz-field__label" for="export_option">{{ L_EXPORT_AS_CSV }}</label>
						<div class="iz-field__control">
							<select class="iz-select" name="export_option" id="export_option">
								<option value="CSV">{{ L_EXPORT_AS_CSV }}</option>
								<option value="CSV_EXCEL">{{ L_EXPORT_AS_CSV_EXCEL }}</option>
								<option value="XML">{{ L_EXPORT_AS_XML }}</option>
							</select>
						</div>
						<div class="iz-field__actions">
							<button type="submit" name="submit_export" class="iz-btn iz-btn--ghost iz-btn--sm">
								{{ L_GO }}
							</button>
						</div>
					</div>

					<div class="iz-field">
						<label class="iz-field__label" for="mark_option">{{ L_MARKED_MESSAGES }}</label>
						<div class="iz-field__control">
							<select class="iz-select" name="mark_option" id="mark_option">
								{{ S_MARK_OPTIONS }}
								{{ S_MOVE_MARKED_OPTIONS }}
							</select>
						</div>
						<div class="iz-field__actions">
							<button type="submit" name="submit_mark" class="iz-btn iz-btn--primary iz-btn--sm">
								{{ L_GO }}
							</button>
						</div>
					</div>

				</div>

			</div>
		</details>

		<div class="iz-space iz-space--sm"></div>

	{% endif %}


	<!-- Display options + hidden folder id + footer token -->
	{% include 'display_options.html' %}
	<input type="hidden" name="cur_folder_id" value="{{ CUR_FOLDER_ID }}" />

	{% include 'ucp_pm_message_footer.html' %}

{% endif %}

{% include 'ucp_footer.html' %}