Commit d5b24dba authored by Carl Schwan's avatar Carl Schwan Committed by Jonathan Riddell

Use a carousel to display multiple screenshots

parent da371e3f
......@@ -169,16 +169,48 @@ EOT;
function printPage($app, $category)
{
//Print screenshot or dummy "no screenshot available" image
$thumbUrl = $app->defaultScreenshotThumbnailUrl();
$screenshotUrl = $app->defaultScreenshotUrl();
if ($screenshotUrl) {
print '<div class="d-flex justify-content-center mb-2"><a href="'.$screenshotUrl.'" data-toggle="lightbox">
<img class="img-fluid" src="'.$thumbUrl.'" alt="Screenshot '.$app->name().'" />
</a></div>';
$screenshots = $app->getScreenshots();
if (sizeof($screenshots) === 0) {
// no screenshot, display dummy "no screenshot available" image
?>
<div class="d-flex justify-content-center mb-2">
<img class="img-fluid" src="/images/screenshots/no_screenshot_available.png" alt="No screenshot available" />
</div>
<?php
} else if (sizeof($screenshots) === 1) {
$screenshot = $screenshots[0];
?>
<div class="d-flex justify-content-center mb-2">
<a href="<?php echo($screenshot['source-image']); ?>" data-toggle="lightbox">
<img class="img-fluid" src="<?php echo($screenshot['thumbnails']); ?>" alt="Screenshot <?php echo($app->name()); ?>" />
</a>
</div>
<?php
} else {
print '<div class="d-flex justify-content-center mb-2">
<img class="img-fluid" src="/images/screenshots/no_screenshot_available.png" alt="No screenshot available" />
</div>';
?>
<div id="carouselAppControls" class="carousel slide" data-ride="carousel">
<div class="carousel-inner">
<?php
foreach ($screenshots as $index => $screenshot) { ?>
<div class='carousel-item <?php echo($index === 0 ? 'active' : ''); ?>'>
<a href="<?php echo($screenshot['source-image']); ?>" data-toggle="lightbox">
<img src='<?php echo $screenshot['source-image'] ?>' class='w-100 d-block' alt='<?php (isset($screenshot['caption']) ? $screenshot['caption'] : ($app->name() . ' screenshot')); ?>'>
</a>
</div>
<?php
}
?>
</div>
<a class="carousel-control-prev" href="#carouselAppControls" role="button" data-slide="prev" onclick="return false;">
<span class="carousel-control-prev-icon" aria-hidden="true"></span>
<span class="sr-only">Previous</span>
</a>
<a class="carousel-control-next" href="#carouselAppControls" role="button" data-slide="next" onclick="return false;">
<span class="carousel-control-next-icon" aria-hidden="true"></span>
<span class="sr-only">Next</span>
</a>
</div>
<?php
}
if ($category == 'unmaintained') {
......
......@@ -392,43 +392,38 @@ class AppData2
return 'http://ebn.kde.org/sanitizer/reports/'.$this->ebnUrlBase().'/index.html';
}
function defaultScreenshotUrl() {
/**
* Get the screenshots.
* @return array Return an array of screenshots, if no screenshot is present return an empty array.
* Each items contains a thumbnails (optional), a caption (optional) and a source-image.
* @see https://www.freedesktop.org/software/appstream/docs/chap-Metadata.html#tag-screenshots
*/
function getScreenshots() {
// TODO: implement l10n
if (!array_key_exists('Screenshots', $this->data)) {
return NULL;
}
foreach($this->data['Screenshots'] as $screenshot) {
if ($screenshot['default'] == true && $screenshot['source-image']['lang'] == 'C') {
return $screenshot['source-image']['url'];
}
}
// No default found, use first available screenshot.
foreach($this->data['Screenshots'] as $screenshot) {
if ($screenshot['source-image']['lang'] == 'C') {
return $screenshot['source-image']['url'];
}
}
return NULL;
}
$screenshots = [];
function defaultScreenshotThumbnailUrl() {
// TODO: implement l10n
if (!array_key_exists('Screenshots', $this->data)) {
return $this->defaultScreenshotUrl();
return $screenshots;
}
$lang = 'C';
foreach($this->data['Screenshots'] as $screenshot) {
if ($screenshot['default'] == true && $screenshot['source-image']['lang'] == 'C') {
return '..'.$screenshot['thumbnails'][0]['url'];
}
}
// No default found, use first available screenshot.
foreach($this->data['Screenshots'] as $screenshot) {
if ($screenshot['source-image']['lang'] == 'C') {
return '..'.$screenshot['thumbnails'][0]['url'];
if ($screenshot['source-image']['lang'] === $lang) {
$screenshotRet = [
'thumbnails' => '../'.$screenshot['thumbnails'][0]['url'],
'source-image' => $screenshot['source-image']['url'],
'default' => isset($screenshot['default']) && $screenshot['default'] == true
];
if (isset($screenshot['caption'])) {
$screenshotRet['caption'] = $this->l10n($screenshot['caption']);
}
$screenshots[] = $screenshotRet;
}
}
// If we can't find a thumb, simply use the off-site real image and let
// the browser scale it.
return $this->defaultScreenshotUrl();
return $screenshots;
}
}
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment