Public/pics
2
2
Fork 2
Code Issues 6 Pull Requests Releases Wiki Activity

PhotosIndex: differentiate dual/single layouts by landscape/portrait

Browse Source
This commit is contained in:
Aaron van Geffen 2023-12-02 00:50:04 +01:00
parent f66a400100
commit d42c3c142c
2 changed files with 61 additions and 45 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
models/PhotoMosaic.php
View File

@ -33,17 +33,21 @@ class PhotoMosaic
'panorama' => [Image::TYPE_PANORAMA], 'panorama' => [Image::TYPE_PANORAMA],
// Big-small juxtapositions // Big-small juxtapositions
'portrait' => [Image::TYPE_PORTRAIT, Image::TYPE_LANDSCAPE, Image::TYPE_LANDSCAPE, 'sidePortrait' => [Image::TYPE_PORTRAIT, Image::TYPE_LANDSCAPE, Image::TYPE_LANDSCAPE,
Image::TYPE_LANDSCAPE, Image::TYPE_LANDSCAPE], Image::TYPE_LANDSCAPE, Image::TYPE_LANDSCAPE],
'landscape' => [Image::TYPE_LANDSCAPE, Image::TYPE_LANDSCAPE, Image::TYPE_LANDSCAPE], 'sideLandscape' => [Image::TYPE_LANDSCAPE, Image::TYPE_LANDSCAPE, Image::TYPE_LANDSCAPE],
// Single row of three // Single row of three
'landscapes' => [Image::TYPE_LANDSCAPE, Image::TYPE_LANDSCAPE, Image::TYPE_LANDSCAPE], 'threeLandscapes' => [Image::TYPE_LANDSCAPE, Image::TYPE_LANDSCAPE, Image::TYPE_LANDSCAPE],
'portraits' => [Image::TYPE_PORTRAIT, Image::TYPE_PORTRAIT, Image::TYPE_PORTRAIT], 'threePortraits' => [Image::TYPE_PORTRAIT, Image::TYPE_PORTRAIT, Image::TYPE_PORTRAIT],
// Dual layouts
'dualLandscapes' => [Image::TYPE_LANDSCAPE, Image::TYPE_LANDSCAPE],
'dualPortraits' => [Image::TYPE_PORTRAIT, Image::TYPE_PORTRAIT],
// Fallback layouts // Fallback layouts
'duo' => [Image::TYPE_LANDSCAPE, Image::TYPE_LANDSCAPE], 'singleLandscape' => [Image::TYPE_LANDSCAPE],
'single' => [Image::TYPE_LANDSCAPE | Image::TYPE_PORTRAIT], 'singlePortrait' => [Image::TYPE_PORTRAIT],
]; ];
return $layouts; return $layouts;

88
templates/PhotosIndex.php
View File

@ -137,7 +137,7 @@ class PhotosIndex extends Template
} }
} }
protected function portrait(array $photos, $altLayout) protected function sidePortrait(array $photos, $altLayout)
{ {
$image = array_shift($photos); $image = array_shift($photos);
@ -170,7 +170,7 @@ class PhotosIndex extends Template
</div>'; </div>';
} }
protected function landscape(array $photos, $altLayout) protected function sideLandscape(array $photos, $altLayout)
{ {
$image = array_shift($photos); $image = array_shift($photos);
@ -203,41 +203,7 @@ class PhotosIndex extends Template
</div>'; </div>';
} }
protected function duo(array $photos, $altLayout) protected function threeLandscapes(array $photos, $altLayout)
{
echo '
<div class="row g-5 mb-5 tile-duo">';
foreach ($photos as $image)
{
echo '
<div class="col-md-6">';
$this->photo($image, 'duo', static::DUO_WIDTH, static::DUO_HEIGHT, true);
echo '
</div>';
}
echo '
</div>';
}
protected function single(array $photos, $altLayout)
{
echo '
<div class="row g-5 mb-5 tile-single">
<div class="col-md-6">';
$image = array_shift($photos);
$this->photo($image, 'single', static::SINGLE_WIDTH, static::SINGLE_HEIGHT, 'top');
echo '
</div>
</div>';
}
protected function landscapes(array $photos, $altLayout)
{ {
echo ' echo '
<div class="row g-5 mb-5 tile-row-landscapes">'; <div class="row g-5 mb-5 tile-row-landscapes">';
@ -257,7 +223,7 @@ class PhotosIndex extends Template
</div>'; </div>';
} }
protected function portraits(array $photos, $altLayout) protected function threePortraits(array $photos, $altLayout)
{ {
echo ' echo '
<div class="row g-5 mb-5 tile-row-portraits">'; <div class="row g-5 mb-5 tile-row-portraits">';
@ -277,6 +243,52 @@ class PhotosIndex extends Template
</div>'; </div>';
} }
protected function dualLandscapes(array $photos, $altLayout)
{
echo '
<div class="row g-5 mb-5 tile-duo">';
foreach ($photos as $image)
{
echo '
<div class="col-md-6">';
$this->photo($image, 'duo', static::DUO_WIDTH, static::DUO_HEIGHT, true);
echo '
</div>';
}
echo '
</div>';
}
protected function dualPortraits(array $photos, $altLayout)
{
// Recycle the row layout so portraits don't appear too large
$this->threePortraits($photos, $altLayout);
}
protected function singleLandscape(array $photos, $altLayout)
{
echo '
<div class="row g-5 mb-5 tile-single">
<div class="col-md-6">';
$image = array_shift($photos);
$this->photo($image, 'single', static::SINGLE_WIDTH, static::SINGLE_HEIGHT, 'top');
echo '
</div>
</div>';
}
protected function singlePortrait(array $photos, $altLayout)
{
// Recycle the row layout so portraits don't appear too large
$this->threePortraits($photos, $altLayout);
}
public function setUrlSuffix($suffix) public function setUrlSuffix($suffix)
{ {
$this->url_suffix = $suffix; $this->url_suffix = $suffix;