display event picture (#23)

This commit is contained in:
Daniel Waxweiler 2024-08-04 18:31:29 +02:00 committed by GitHub
parent a543a25a8a
commit 0edad986d3
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
5 changed files with 84 additions and 3 deletions

View File

@ -1,5 +1,6 @@
### [Unreleased]
#### Added
- Display event picture if available
#### Changed
#### Deprecated
#### Removed

View File

@ -1,5 +1,5 @@
import Formatter from './formatter.js'
import { createAnchorElement } from './html-creator.js'
import { createAnchorElement, createImageElement } from './html-creator.js'
export function clearEventsList(container) {
const list = container.querySelector('ul')
@ -18,6 +18,19 @@ export function displayEvents({ events, document, container, maxEventsCount }) {
const list = container.querySelector('ul')
for (let i = 0; i < eventsCount; i++) {
const li = document.createElement('li')
li.style.lineHeight = '150%'
li.style.marginTop = '20px'
if (events[i].picture) {
const img = createImageElement({
document,
alt: events[i].picture.alt ? events[i].picture.alt : '',
src: events[i].picture.base64 ? events[i].picture.base64 : '',
})
img.style.display = 'block'
img.style.maxWidth = '100%'
li.appendChild(img)
}
const a = createAnchorElement({
document,

View File

@ -5,3 +5,10 @@ export function createAnchorElement({ document, text, url }) {
a.innerHTML = text
return a
}
export function createImageElement({ document, alt, src }) {
const img = document.createElement('img')
img.setAttribute('alt', alt)
img.setAttribute('src', src)
return img
}

View File

@ -40,6 +40,11 @@ final class GraphQlClient {
physicalAddress {
description,
locality
},
picture {
alt,
contentType,
url
}
},
total
@ -57,6 +62,17 @@ final class GraphQlClient {
self::checkData($data);
$events = $data['data']['events']['elements'];
foreach ($events as &$event) {
if ($event['picture']) {
$picture_response = self::download_image($event['picture']['url']);
if ($picture_response !== false) {
$picture_encoded = 'data:' . $event['picture']['contentType'] . ';base64,' . base64_encode($picture_response);
$event['picture']['base64'] = $picture_encoded;
}
}
unset($event);
}
EventsCache::set(['url' => $url, 'query' => $query, 'limit' => $limit], $events);
return $events;
}
@ -75,6 +91,11 @@ final class GraphQlClient {
physicalAddress {
description,
locality
},
picture {
alt,
contentType,
url
}
},
total
@ -95,6 +116,18 @@ final class GraphQlClient {
self::checkData($data);
$events = $data['data']['group']['organizedEvents']['elements'];
foreach ($events as &$event) {
if ($event['picture']) {
$picture_response = self::download_image($event['picture']['url']);
if ($picture_response !== false) {
$picture_encoded = 'data:' . $event['picture']['contentType'] . ';base64,' . base64_encode($picture_response);
$event['picture']['base64'] = $picture_encoded;
}
}
unset($event);
}
EventsCache::set(['url' => $url, 'query' => $query, 'afterDatetime' => $afterDatetime, 'groupName' => $groupName, 'limit' => $limit], $events);
return $events;
}
@ -110,4 +143,28 @@ final class GraphQlClient {
}
}
}
private static function download_image($url) {
// Initialize curl handle
$ch = curl_init($url);
// Set curl options
curl_setopt($ch, CURLOPT_RETURNTRANSFER, 1);
curl_setopt($ch, CURLOPT_FOLLOWLOCATION, 1);
curl_setopt($ch, CURLOPT_TIMEOUT, 60); // Set timeout to 60 seconds (adjust as needed)
// Execute the request
$image_data = curl_exec($ch);
// Check for errors
if (curl_errno($ch)) {
print_r(curl_error($ch));
throw new \Error('Error: ' . curl_error($ch));
}
// Close curl handle
curl_close($ch);
return $image_data;
}
}

View File

@ -9,7 +9,10 @@ if (!defined('ABSPATH')) {
<div class="<?php echo esc_attr($classNamePrefix); ?>_events-list">
<ul style="list-style-type: none; padding-left: 0;">
<?php foreach ($events as $event) { ?>
<li style="margin-top: 10px;">
<li style="line-height: 150%; margin-top: 20px;">
<?php if (isset($event['picture'])) { ?>
<img alt="<?php echo esc_attr($event['picture']['alt']); ?>" src="<?php echo esc_attr($event['picture']['base64']); ?>" style="display: block; max-width: 100%;">
<?php } ?>
<a href="<?php echo esc_attr($event['url']); ?>"><?php echo esc_html_e($event['title']); ?></a>
<br>
<?php echo esc_html_e(Formatter::format_date($locale, $timeZone, $event['beginsOn'], $event['endsOn'], $isShortOffsetNameShown)); ?>