pics/templates/AlbumIndex.php

<?php
/*****************************************************************************
 * AlbumIndex.php
 * Contains the album index template.
 *
 * Kabuki CMS (C) 2013-2015, Aaron van Geffen
 *****************************************************************************/

class AlbumIndex extends Template
{
	protected $albums;
	protected $show_edit_buttons;
	protected $show_labels;
	protected $row_limit = 1000;

	const TILE_WIDTH = 400;
	const TILE_HEIGHT = 300;
	const TILE_RATIO = self::TILE_WIDTH / self::TILE_HEIGHT;

	public function __construct(array $albums, $show_edit_buttons = false, $show_labels = true)
	{
		$this->albums = $albums;
		$this->show_edit_buttons = $show_edit_buttons;
		$this->show_labels = $show_labels;
	}

	public function html_main()
	{
		echo '
			<div class="container album-index">
				<div class="row g-5">';

		foreach ($this->albums as $album)
			$this->renderAlbum($album);

		echo '
				</div>
			</div>';
	}

	private function renderAlbum(array $album)
	{
		echo '
					<div class="col-md-6 col-xl-4">
						<div class="polaroid landscape" style="aspect-ratio: 1.12">';

		if ($this->show_edit_buttons)
			echo '
							<a class="edit" href="#">Edit</a>';

		echo '
							<a href="', $album['link'], '">';

		if (isset($album['thumbnail']))
		{
			$thumbs = [];
			foreach ([1, 2] as $factor)
				$thumbs[$factor] = $album['thumbnail']->getThumbnailUrl(
					static::TILE_WIDTH * $factor, static::TILE_HEIGHT * $factor, true, true);

			foreach (['normal-photo', 'blur-photo'] as $className)
			{
				echo '
								<img alt="" src="', $thumbs[1], '"' . (isset($thumbs[2]) ?
									' srcset="' . $thumbs[2] . ' 2x"' : '') .
									' class="', $className, '"' .
									' alt="" style="aspect-ratio: ', self::TILE_RATIO, '">';
			}
		}
		else
		{
			echo '
								<img alt="" src="', BASEURL, '/images/nothumb.svg"',
									' class="placeholder-image"',
									' style="aspect-ratio: ', self::TILE_RATIO, '; object-fit: unset">';
		}

		if ($this->show_labels)
			echo '
								<h4>', $album['caption'], '</h4>';

		echo '
							</a>
						</div>
					</div>';
	}
}