display event picture (#23)
This commit is contained in:
parent
a543a25a8a
commit
0edad986d3
|
@ -1,5 +1,6 @@
|
||||||
### [Unreleased]
|
### [Unreleased]
|
||||||
#### Added
|
#### Added
|
||||||
|
- Display event picture if available
|
||||||
#### Changed
|
#### Changed
|
||||||
#### Deprecated
|
#### Deprecated
|
||||||
#### Removed
|
#### Removed
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
import Formatter from './formatter.js'
|
import Formatter from './formatter.js'
|
||||||
import { createAnchorElement } from './html-creator.js'
|
import { createAnchorElement, createImageElement } from './html-creator.js'
|
||||||
|
|
||||||
export function clearEventsList(container) {
|
export function clearEventsList(container) {
|
||||||
const list = container.querySelector('ul')
|
const list = container.querySelector('ul')
|
||||||
|
@ -18,6 +18,19 @@ export function displayEvents({ events, document, container, maxEventsCount }) {
|
||||||
const list = container.querySelector('ul')
|
const list = container.querySelector('ul')
|
||||||
for (let i = 0; i < eventsCount; i++) {
|
for (let i = 0; i < eventsCount; i++) {
|
||||||
const li = document.createElement('li')
|
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({
|
const a = createAnchorElement({
|
||||||
document,
|
document,
|
||||||
|
|
|
@ -5,3 +5,10 @@ export function createAnchorElement({ document, text, url }) {
|
||||||
a.innerHTML = text
|
a.innerHTML = text
|
||||||
return a
|
return a
|
||||||
}
|
}
|
||||||
|
|
||||||
|
export function createImageElement({ document, alt, src }) {
|
||||||
|
const img = document.createElement('img')
|
||||||
|
img.setAttribute('alt', alt)
|
||||||
|
img.setAttribute('src', src)
|
||||||
|
return img
|
||||||
|
}
|
||||||
|
|
|
@ -40,6 +40,11 @@ final class GraphQlClient {
|
||||||
physicalAddress {
|
physicalAddress {
|
||||||
description,
|
description,
|
||||||
locality
|
locality
|
||||||
|
},
|
||||||
|
picture {
|
||||||
|
alt,
|
||||||
|
contentType,
|
||||||
|
url
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
total
|
total
|
||||||
|
@ -57,6 +62,17 @@ final class GraphQlClient {
|
||||||
self::checkData($data);
|
self::checkData($data);
|
||||||
|
|
||||||
$events = $data['data']['events']['elements'];
|
$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);
|
EventsCache::set(['url' => $url, 'query' => $query, 'limit' => $limit], $events);
|
||||||
return $events;
|
return $events;
|
||||||
}
|
}
|
||||||
|
@ -75,6 +91,11 @@ final class GraphQlClient {
|
||||||
physicalAddress {
|
physicalAddress {
|
||||||
description,
|
description,
|
||||||
locality
|
locality
|
||||||
|
},
|
||||||
|
picture {
|
||||||
|
alt,
|
||||||
|
contentType,
|
||||||
|
url
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
total
|
total
|
||||||
|
@ -95,6 +116,18 @@ final class GraphQlClient {
|
||||||
self::checkData($data);
|
self::checkData($data);
|
||||||
|
|
||||||
$events = $data['data']['group']['organizedEvents']['elements'];
|
$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);
|
EventsCache::set(['url' => $url, 'query' => $query, 'afterDatetime' => $afterDatetime, 'groupName' => $groupName, 'limit' => $limit], $events);
|
||||||
return $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;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -8,8 +8,11 @@ if (!defined('ABSPATH')) {
|
||||||
?>
|
?>
|
||||||
<div class="<?php echo esc_attr($classNamePrefix); ?>_events-list">
|
<div class="<?php echo esc_attr($classNamePrefix); ?>_events-list">
|
||||||
<ul style="list-style-type: none; padding-left: 0;">
|
<ul style="list-style-type: none; padding-left: 0;">
|
||||||
<?php foreach($events as $event) { ?>
|
<?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>
|
<a href="<?php echo esc_attr($event['url']); ?>"><?php echo esc_html_e($event['title']); ?></a>
|
||||||
<br>
|
<br>
|
||||||
<?php echo esc_html_e(Formatter::format_date($locale, $timeZone, $event['beginsOn'], $event['endsOn'], $isShortOffsetNameShown)); ?>
|
<?php echo esc_html_e(Formatter::format_date($locale, $timeZone, $event['beginsOn'], $event['endsOn'], $isShortOffsetNameShown)); ?>
|
||||||
|
|
Loading…
Reference in New Issue