<xf:page option="jsState.fbSdk" value="{{ true }}" />

<xf:if is="$type == 'video'">
	<xf:set var="$fbClass" value="fb-video" />
	<xf:set var="$fbHref" value="https://www.facebook.com/video.php?v={$id}" />
<xf:elseif is="$type == 'watch'" />
	<xf:set var="$fbClass" value="fb-post" />
	<xf:set var="$fbHref" value="https://fb.watch/{$id}" />	
<xf:else />
	<xf:set var="$fbClass" value="fb-post" />
	<xf:set var="$fbHref" value="https://www.facebook.com/{$idPlain}" />
</xf:if>

<div class="bbMediaJustifier" data-media-site-id="{$siteId}" data-media-key="{$idSlash}">
	<div class="{$fbClass}"
		 data-href="{$fbHref}"
		 data-width=""
		 data-show-text="true"
		 data-show-captions="true">
		<div class="fb-xfbml-parse-ignore">
			<a href="{$fbHref}" rel="external" target="_blank">
				<xf:fa icon="fab fa-facebook" /> {$fbHref}
			</a>
		</div>
	</div>
</div>

<xf:comment>
	// data attributes available:
	data-autoplay="false"
	data-allowfullscreen="false"
	data-show-text="false"
	data-show-captions="false"
</xf:comment>