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

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

	<section>

		<div id="home-slideshow">
			<koken:pulse jsvar="pulse" link_to="advance" fallbacktext="This area displays a featured content slideshow. Assign content as featured in the Library." />
		</div>

		<div id="home-slideshow-text" style="display:none;">
			<koken:if true="settings.index_show_title"><a id="home-slideshow-title-link" href="#"><h4 id="home-slideshow-title">&nbsp;</h4></a></koken:if><koken:if true="settings.index_show_caption">&nbsp;&nbsp;<span id="home-slideshow-caption">&nbsp;</span></koken:if>
		</div>

		<script>
			pulse.on( 'start', function() {
				$('#home-slideshow').addClass('pulseloading');
			});
			pulse.on( 'dataloaded', function() {
				$('#home-slideshow').removeClass('pulseloading');
			});
			pulse.on( 'transitionstart', function(e) {
				$('#home-slideshow-text').show();
				$('#home-slideshow-title').html(e.data.title || e.data.filename);
				$('#home-slideshow-caption').html(e.data.caption);
				$('#home-slideshow-title-link').attr("href", e.data.url).attr("title", e.data.title || e.data.filename);
			});
		</script>

	</section>

</koken:if>

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

	<koken:load source="featured_albums">

		<section>

			<koken:if true="settings.index_show_slideshow">
				<hr>
			</koken:if>

			<ol class="thumbs">
				<koken:loop>
					<li>
						<koken:link title="View {{ album.title }}">
							<koken:if data="settings.albums_crop" equals="uniform">
								<koken:img size="{{ settings.albums_crop_size }}" lazy="true" />
							</koken:if>
							<koken:if data="settings.albums_crop" equals="proportional">
								<koken:img lazy="true" />
							</koken:if>
						</koken:link>
						<koken:link title="View {{ album.title }}">
							<h4>{{ album.title }}</h4>
						</koken:link>
						<p>
							{{ album.summary }}
						</p>
					</li>
				</koken:loop>
			</ol>

		</section>

	<koken:else>

		<section>

			<koken:note>This area displays featured albums. Assign albums as featured in the Library or turn this section off in theme settings.</koken:note>

		</section>

	</koken:load>

</koken:if>

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

	<koken:load source="featured_essays">

		<section>

			<hr>

			<ol class="thumbs">
				<koken:loop>
					<li>
						<koken:link title="View {{ essay.title }}">
							<koken:featured_image>
								<koken:if data="settings.albums_crop" equals="uniform">
									<koken:img size="{{ settings.albums_crop_size }}" lazy="true" />
								</koken:if>
								<koken:if data="settings.albums_crop" equals="proportional">
									<koken:img lazy="true" />
								</koken:if>
							</koken:featured_image>
						</koken:link>
						<koken:link title="View {{ essay.title }}">
							<h4>{{ essay.title }}</h4>
						</koken:link>
						<p>
							{{ essay.excerpt }}
						</p>
					</li>
				</koken:loop>
			</ol>

		</section>

	<koken:else>

		<section>

			<koken:note>This area displays featured essays. Assign essays as featured in Text or turn this section off in theme settings.</koken:note>

		</section>

	</koken:load>

</koken:if>

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