<xf:title>{{ phrase('attachment_browser') }}</xf:title>

<xf:css>
	.attachment-tooltip-image
	{
		display: block;
	}
</xf:css>

<xf:form action="{{ link('attachments') }}" class="block" ajax="true"
	data-xf-init="select-plus"
	data-sp-checkbox="input[name='attachment_ids[]']"
	data-sp-container=".dataList-row">

	<div class="block-container">
		<xf:macro name="filter_macros::filter_bar"
			arg-route="attachments"
			arg-content="{{ null }}"
			arg-params="{$linkParams}"
			arg-displayValues="{$filterDisplay}"
			arg-phrases="{{ {
				'key:content_type':  phrase('content_type:'),
				'key:username': phrase('user_name:'),
				'key:start': phrase('start_date:'),
				'key:end': phrase('end_date:'),
				'key:order': phrase('sort_by:'),
				'val:file_size_desc': phrase('largest'),
				'val:file_size_asc': phrase('smallest'),
				'val:attach_date_desc': phrase('most_recent'),
				'val:attach_date_asc': phrase('least_recent')
			} }}"
			arg-menu="attachments/filter"
			arg-menuTitle="{{ phrase('filter') }}" />

		<xf:if is="$attachments is not empty">
			<div class="block-body">
				<xf:datalist>
					<xf:foreach loop="$attachments" value="$attachment">
						<xf:datarow>
							<xf:toggle name="attachment_ids[]" value="{$attachment.attachment_id}" />

							<xf:if is="$attachment.has_thumbnail">
								<xf:cell class="dataList-cell--attachment"
									href="{{ link('attachments/view', $attachment) }}"
									style="background-image: url({$attachment.thumbnail_url})"
									alt="{$attachment.filename}"
									data-xf-init="element-tooltip" data-element="| .tooltip-element">
									<span class="tooltip-element"><img src="{$attachment.thumbnail_url}" class="attachment-tooltip-image" /></span>
								</xf:cell>
							<xf:else />
								<xf:cell class="dataList-cell--attachment"
									href="{{ link('attachments/view', $attachment) }}">
									<xf:fa icon="fa-file fa-2x" />
								</xf:cell>
							</xf:if>

							<xf:cell href="{{ link('attachments/view', $attachment) }}" class="dataList-cell--main">
								<div class="dataList-mainRow">{$attachment.filename}</div>
								<div class="dataList-subRow">
									<ul class="listInline listInline--bullet">
										<li><xf:date time="{$attachment.Data.upload_date}" /></li>
										<li>{{ $attachment.Data.User.username ?: phrase('unknown_user') }}</li>
										<li>{$attachment.file_size|file_size}</li>
									</ul>
								</div>
							</xf:cell>

							<xf:cell
								href="{{ (!$attachment.unassociated && $attachment.getContainerLink()) ? $attachment.getContainerLink() : link('attachments/view', $attachment) }}"
								target="{{ !$attachment.unassociated ? '_blank' : '' }}"
								class="dataList-cell--action">
								<xf:if is="!$attachment.unassociated">
									{{ phrase('view_host_content') }}
									<span class="dataList-secondRow">{$attachment.getContentTypePhrase()|parens}</span>
								<xf:else />
									{{ phrase('unassociated') }}
								</xf:if>
							</xf:cell>

							<xf:delete href="{{ link('attachments/delete', $attachment, $linkParams) }}" />
						</xf:datarow>
					</xf:foreach>
				</xf:datalist>
			</div>
			<div class="block-footer block-footer--split">
				<span class="block-footer-counter">{{ display_totals($attachments, $total) }}</span>
				<span class="block-footer-select"><xf:checkbox standalone="true"><xf:option check-all="< .block-container" label="{{ phrase('select_all') }}" /></xf:checkbox></span>
				<span class="block-footer-controls">
					<xf:button type="submit" name="delete_attachments" icon="delete" />
				</span>
			</div>
		<xf:else />
			<div class="block-body block-row">{{ phrase('no_results_found') }}</div>
		</xf:if>
	</div>
	<xf:pagenav page="{$page}" perpage="{$perPage}" total="{$total}"
		link="attachments" params="{$linkParams}"
		wrapperclass="block-outer block-outer--after" />

</xf:form>