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

<xf:js src="xf/embed.js" min="1" />
<xf:page option="jsState.{$providerJs}" value="{{ true }}" />

<div class="block">
	<div class="block-container">
		<div class="block-body">
			<xf:if is="$oembed.title">
				<xf:formrow label="{{ phrase('title') }}" explain="{$oembed.BbCodeMediaSite.site_title}: {$oembed.media_id}">
					{$oembed.title}
				</xf:formrow>
			<xf:else />
				<xf:formrow label="{{ phrase('title') }}">{$oembed.BbCodeMediaSite.site_title}: {$oembed.media_id}</xf:formrow>
			</xf:if>
			<xf:formrow label="{{ phrase('media') }}">
				<div>{$html|raw}</div>
				<a href="{$oembed.url}" target="_blank">{$oembed.url}</a>
			</xf:formrow>
			<xf:formrow label="{{ phrase('hits') }}">{$oembed.views|number}</xf:formrow>
			<xf:formrow label="{{ phrase('first_requested') }}"><xf:date time="{$oembed.first_request_date}" /></xf:formrow>
			<xf:formrow label="{{ phrase('last_requested') }}"><xf:date time="{$oembed.last_request_date}" /></xf:formrow>

			<xf:if is="{$xf.options.oEmbedRequestReferrer.enabled} AND $oembed.Referrers is not empty">
				<xf:datalist class="dataList--separatedTop" data-xf-init="responsive-data-list">
					<xf:datarow rowtype="header">
						<xf:cell>{{ phrase('referrer') }}</xf:cell>
						<xf:cell>{{ phrase('hits') }}</xf:cell>
						<xf:cell>{{ phrase('first_seen') }}</xf:cell>
						<xf:cell>{{ phrase('last_seen') }}</xf:cell>
					</xf:datarow>
					<xf:foreach loop="$oembed.Referrers" value="$referrer">
						<xf:datarow rowclass="dataList-row--noHover">
							<xf:cell dir="auto"><a href="{$referrer.referrer_url}" target="_blank">{$referrer.referrer_url}</a></xf:cell>
							<xf:cell>{$referrer.hits|number}</xf:cell>
							<xf:cell><xf:date time="{$referrer.first_date}" /></xf:cell>
							<xf:cell><xf:date time="{$referrer.last_date}" /></xf:cell>
						</xf:datarow>
					</xf:foreach>
				</xf:datalist>
			</xf:if>
		</div>
	</div>
</div>