<koken:include file="layouts/header.html" />

<koken:load>

<koken:head>
	<meta property="og:site_name" content="{{ site.title }}" />
	<meta property="og:title" content="{{ content.title|content.filename strip_html="true" }}" />
	<meta property="og:description" content="{{ content.caption strip_html="true" }}" />
	<meta property="og:type" content="website" />
	<meta property="og:image" content="{{ content.presets.medium_large.url }}" />
	<meta property="og:image:width" content="{{ content.presets.medium_large.width }}" />
	<meta property="og:image:height" content="{{ content.presets.medium_large.height }}" />
	<meta property="og:url" content="{{ content.url }}" />
	<koken:content_image>
		<koken:not empty="profile.twitter">
			<meta name="twitter:card" content="photo" />
			<meta name="twitter:site" content="@{{ profile.twitter }}" />
			<meta name="twitter:creator" content="@{{ profile.twitter }}" />
		</koken:not>
	</koken:content_image>
</koken:head>

<ul id="nav-content">
	<li>
		<koken:previous>
			<koken:link title="Previous" bind_to_key="left">&larr;&nbsp;Prev</koken:link>
		<koken:else>
			&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
		</koken:previous>
	</li>
	<li>
		<koken:link lightbox="true" title="Lightbox" bind_to_key="l">Lightbox</koken:link>
	</li>
	<li>
		<koken:next>
			<koken:link title="Next" bind_to_key="right">Next&nbsp;&rarr;</koken:link>
		<koken:else>
			&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
		</koken:next>
	</li>
</ul>

<div class="main-content">

	<koken:content_video>

		<koken:video />

	</koken:content_video>

	<koken:content_image>

		<koken:img lazy="true" class="img-content" />

	</koken:content_image>

</div>

<div class="text-content">

	<koken:if true="settings.show_content_exif">
		<koken:exif>
			<ol id="exif_meta">
				<koken:not empty="exif.aperture">
					<li>
						{{ exif.aperture }}
					</li>
				</koken:not>
				<koken:not empty="exif.exposure">
					<li>
						{{ exif.exposure }}
					</li>
				</koken:not>
				<koken:not empty="exif.focal_length">
					<li>
						{{ exif.focal_length }}
					</li>
				</koken:not>
				<koken:not empty="exif.iso_speed_ratings">
					<li>
						{{ exif.iso_speed_ratings }}
					</li>
	    		</koken:not>
			</ol>
		</koken:exif>
	</koken:if>

	<koken:if true="settings.show_content_title">
		<h2>{{ content.title | content.filename }}</h2>
	</koken:if>

	<koken:if true="settings.show_content_caption">
		<div id="caption-content">
			{{ content.caption paragraphs="true" }}
		</div>
	</koken:if>

	<koken:max_download>
		<p>
			<koken:link title="Download {{ max_download.width }}x{{ max_download.height }} image" class="cap_link">
				Download
			</koken:link>
		</p>
	</koken:max_download>

	<koken:if true="{{ settings.show_content_source }}">

		<koken:not empty="{{ content.source.title }}">

			<section>

				<a href="{{ content.source.url }}" onclick="return !window.open(this.href);" title="View at {{ content.source.title }}">View at {{ content.source.title }}</a>

			</section>

		</koken:not>

	</koken:if>

</div>

<koken:if true="settings.social_bttns_show_one">

	<koken:if true="content.public">

		<koken:include file="layouts/share-links.html" />

	</koken:if>

</koken:if>

<koken:include file="layouts/like-tweet.html" />

<koken:parent>

	<p class="parent-album">From the {{ labels.album.singular case="lower" }}
	<br>
	<koken:link>{{ album.title }}</koken:link></p>

</koken:parent>

<koken:if true="settings.show_disc_content">

	<div id="kdiscuss">

		<koken:discussion>

			{{ discussion }}

		</koken:discussion>

	</div>

</koken:if>

</koken:load>

<koken:include file="layouts/footer.html" />