Compare commits

...

3 Commits

Author SHA1 Message Date
Jürgen Mummert 8c9ea29170 Fix organization listing SQL for MariaDB tags 2026-02-22 16:49:55 +01:00
Jürgen Mummert 8c5921d02a Add list_default_organisationen template: UUID-based logos, improved tag filter 2026-02-22 16:20:07 +01:00
Jürgen Mummert c4a7150f41 Add conditional reset button for event filters 2026-02-22 13:03:58 +01:00
3 changed files with 559 additions and 0 deletions
@@ -31,6 +31,8 @@
</div> </div>
</div> </div>
<button type="button" id="eventfilter-reset" class="eventfilter-reset" hidden>Filter zurücksetzen</button>
<p id="eventfilter-status" class="visually-hidden" aria-live="polite"></p> <p id="eventfilter-status" class="visually-hidden" aria-live="polite"></p>
</div> </div>
@@ -75,8 +77,13 @@
outline: 2px solid currentColor; outline: 2px solid currentColor;
outline-offset: 2px; outline-offset: 2px;
} }
#eventfilters .eventfilter-reset[hidden] {
display: none;
}
</style> </style>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/slim-select@3/dist/slimselect.css">
<script src="https://cdn.jsdelivr.net/npm/slim-select@3/dist/slimselect.min.js"></script> <script src="https://cdn.jsdelivr.net/npm/slim-select@3/dist/slimselect.min.js"></script>
<script type="module"> <script type="module">
@@ -102,6 +109,7 @@
const tagWidget = tagSelect?.closest('.widget-select'); const tagWidget = tagSelect?.closest('.widget-select');
const locationWidget = locationSelect?.closest('.widget-select'); const locationWidget = locationSelect?.closest('.widget-select');
const orgWidget = orgSelect?.closest('.widget-select'); const orgWidget = orgSelect?.closest('.widget-select');
const resetButton = filters.querySelector('#eventfilter-reset');
const status = filters.querySelector('#eventfilter-status'); const status = filters.querySelector('#eventfilter-status');
const animationMs = 220; const animationMs = 220;
@@ -189,6 +197,10 @@
tagWidget?.classList.toggle('active', hasActiveTag); tagWidget?.classList.toggle('active', hasActiveTag);
locationWidget?.classList.toggle('active', hasActiveLocation); locationWidget?.classList.toggle('active', hasActiveLocation);
orgWidget?.classList.toggle('active', hasActiveOrg); orgWidget?.classList.toggle('active', hasActiveOrg);
if (resetButton) {
resetButton.hidden = !(hasActiveTag || hasActiveLocation || hasActiveOrg);
}
}; };
const parseIdList = (rawValue) => (rawValue ?? '') const parseIdList = (rawValue) => (rawValue ?? '')
@@ -312,5 +324,13 @@
); );
}); });
resetButton?.addEventListener('click', () => {
setSelectValue(tagSelect, tagSlim, 'all');
setSelectValue(locationSelect, locationSlim, 'all');
setSelectValue(orgSelect, orgSlim, 'all');
applyFilter({ type: 'all', value: 'all' });
});
applyFilter(currentFilter); applyFilter(currentFilter);
</script> </script>
@@ -0,0 +1,281 @@
<?php
declare(strict_types=1);
namespace MummertMedia\EventManagerBundle\EventListener;
use Contao\CoreBundle\DependencyInjection\Attribute\AsHook;
use Contao\StringUtil;
use Contao\Template;
use Doctrine\DBAL\ArrayParameterType;
use Doctrine\DBAL\Connection;
use Doctrine\DBAL\ParameterType;
#[AsHook('parseTemplate', method: 'onParseTemplate')]
class OrganizationListingTemplateDataListener
{
public function __construct(
private readonly Connection $connection,
) {
}
public function onParseTemplate(Template $template): void
{
if ('list_default_organisationen' !== (string) $template->getName()) {
return;
}
$tbody = $template->tbody;
if (!\is_array($tbody) || [] === $tbody) {
return;
}
$rowToOrganizationIdMap = [];
foreach ($tbody as $rowIndex => $row) {
if (!\is_array($row)) {
continue;
}
$organizationId = $this->extractOrganizationId($row);
if ($organizationId > 0) {
$rowToOrganizationIdMap[(int) $rowIndex] = $organizationId;
}
}
if ([] === $rowToOrganizationIdMap) {
return;
}
$organizationTagMap = $this->fetchOrganizationTagMap(array_values(array_unique(array_values($rowToOrganizationIdMap))));
$organizationLogoUuidMap = $this->fetchOrganizationLogoUuidMap(array_values(array_unique(array_values($rowToOrganizationIdMap))));
foreach ($rowToOrganizationIdMap as $rowIndex => $organizationId) {
$tagData = $organizationTagMap[$organizationId] ?? ['labels' => [], 'slugs' => []];
$logoUuid = $organizationLogoUuidMap[$organizationId] ?? '';
if (!isset($tbody[$rowIndex]) || !\is_array($tbody[$rowIndex])) {
continue;
}
$tbody[$rowIndex]['tag_labels']['content'] = implode(', ', $tagData['labels']);
$tbody[$rowIndex]['tag_slugs']['content'] = implode(',', $tagData['slugs']);
$tbody[$rowIndex]['tags']['content'] = implode(', ', $tagData['labels']);
if ('' !== $logoUuid) {
$tbody[$rowIndex]['logo_uuid']['content'] = $logoUuid;
}
}
$template->tbody = $tbody;
}
/** @param array<string, mixed> $row */
private function extractOrganizationId(array $row): int
{
foreach (['id', 'organization_id', 'org_id'] as $fieldName) {
$value = $this->extractRowFieldContent($row, $fieldName);
if ('' !== $value && ctype_digit($value)) {
return (int) $value;
}
}
$urlCandidates = [];
foreach ($row as $column) {
if (!\is_array($column)) {
continue;
}
if (isset($column['url']) && \is_scalar($column['url'])) {
$urlCandidates[] = (string) $column['url'];
}
if (isset($column['href']) && \is_scalar($column['href'])) {
$urlCandidates[] = (string) $column['href'];
}
}
foreach ($urlCandidates as $url) {
$organizationId = $this->extractIdFromUrl($url);
if ($organizationId > 0) {
return $organizationId;
}
}
return 0;
}
/** @param array<string, mixed> $row */
private function extractRowFieldContent(array $row, string $fieldName): string
{
if (!isset($row[$fieldName]) || !\is_array($row[$fieldName])) {
return '';
}
$field = $row[$fieldName];
if (!isset($field['content']) || !\is_scalar($field['content'])) {
return '';
}
return trim((string) $field['content']);
}
private function extractIdFromUrl(string $url): int
{
$parts = parse_url($url);
if (!\is_array($parts) || !isset($parts['query'])) {
return 0;
}
parse_str((string) $parts['query'], $query);
foreach (['show', 'id'] as $queryKey) {
if (!isset($query[$queryKey])) {
continue;
}
$value = $query[$queryKey];
if (\is_scalar($value) && ctype_digit((string) $value)) {
return (int) $value;
}
}
return 0;
}
/** @param list<int> $organizationIds
* @return array<int, array{labels: list<string>, slugs: list<string>}>
*/
private function fetchOrganizationTagMap(array $organizationIds): array
{
if ([] === $organizationIds) {
return [];
}
$rows = $this->connection->executeQuery(
'SELECT r.pid AS organization_id, r.tag_id, t.tag AS label FROM tl_tags_rel r INNER JOIN tl_tags t ON t.id = r.tag_id WHERE r.ptable = ? AND r.field = ? AND r.pid IN (?) ORDER BY r.pid ASC, r.tag_id ASC',
['tl_organization', 'tags', $organizationIds],
[ParameterType::STRING, ParameterType::STRING, ArrayParameterType::INTEGER],
)->fetchAllAssociative();
$map = [];
$seen = [];
foreach ($rows as $row) {
$organizationId = (int) ($row['organization_id'] ?? 0);
$tagId = (int) ($row['tag_id'] ?? 0);
$label = trim((string) ($row['label'] ?? ''));
if ($organizationId <= 0 || $tagId <= 0 || '' === $label) {
continue;
}
if (isset($seen[$organizationId][$tagId])) {
continue;
}
$seen[$organizationId][$tagId] = true;
$map[$organizationId]['labels'][] = $label;
$slug = $this->slugify($label);
if ('' !== $slug) {
$map[$organizationId]['slugs'][] = $slug;
}
}
foreach ($map as $organizationId => $tagData) {
$map[$organizationId]['labels'] = array_values(array_unique($tagData['labels'] ?? []));
$map[$organizationId]['slugs'] = array_values(array_unique($tagData['slugs'] ?? []));
}
return $map;
}
/** @param list<int> $organizationIds
* @return array<int, string>
*/
private function fetchOrganizationLogoUuidMap(array $organizationIds): array
{
if ([] === $organizationIds) {
return [];
}
$rows = $this->connection->executeQuery(
'SELECT o.id AS organization_id, o.logo AS logo_uuid FROM tl_organization o WHERE o.id IN (?)',
[$organizationIds],
[ArrayParameterType::INTEGER],
)->fetchAllAssociative();
$map = [];
foreach ($rows as $row) {
$organizationId = (int) ($row['organization_id'] ?? 0);
$logoUuid = $this->normalizeUuid($row['logo_uuid'] ?? null);
if ($organizationId <= 0 || '' === $logoUuid) {
continue;
}
$map[$organizationId] = $logoUuid;
}
return $map;
}
private function normalizeUuid(mixed $value): string
{
if (null === $value) {
return '';
}
if (\is_resource($value)) {
$value = stream_get_contents($value) ?: '';
}
$trimmed = trim((string) $value);
if ('' === $trimmed) {
return '';
}
if (preg_match('/^[0-9a-fA-F-]{36}$/', $trimmed)) {
return strtolower($trimmed);
}
if (16 === strlen($trimmed)) {
return StringUtil::binToUuid($trimmed);
}
return '';
}
private function slugify(string $value): string
{
$value = trim(mb_strtolower($value));
if ('' === $value) {
return '';
}
$value = strtr($value, [
'ä' => 'ae',
'ö' => 'oe',
'ü' => 'ue',
'ß' => 'ss',
]);
$value = preg_replace('/[^a-z0-9]+/u', '-', $value) ?? '';
$value = trim($value, '-');
return $value;
}
}
@@ -0,0 +1,258 @@
{% extends '@Contao/block_searchable.html.twig' %}
{% set wrapperAttributes = attrs()
.addClass(['ce_table', 'listing'])
.mergeWith(wrapperAttributes|default)
%}
{% block content %}
{% set legacyTagLabels = {
'10': 'Sport',
'11': 'Kultur',
'12': 'Politik',
'13': 'Soziales',
'14': 'Freizeit',
'15': 'Bildung',
'16': 'Religion',
'17': 'Natur',
'18': 'Gesellschaft'
} %}
{% if searchable %}
<div class="list_search">
<form method="get">
<div class="formbody">
<input type="hidden" name="order_by" value="{{ order_by }}">
<input type="hidden" name="sort" value="{{ sort }}">
{% if per_page %}
<input type="hidden" name="per_page" value="{{ per_page }}">
{% endif %}
<div class="widget widget-select">
<label for="ctrl_search" class="invisible">{{ fields_label }}</label>
<select name="search" id="ctrl_search" class="select">
{{ search_fields|raw }}
</select>
</div>
<div class="widget widget-text">
<label for="ctrl_for" class="invisible">{{ keywords_label }}</label>
<input type="text" name="for" id="ctrl_for" class="text" value="{{ for }}">
</div>
<div class="widget widget-submit">
<button type="submit" class="submit">{{ search_label }}</button>
</div>
</div>
</form>
</div>
{% endif %}
{% if per_page %}
<div class="list_per_page">
<form method="get">
<div class="formbody">
<input type="hidden" name="order_by" value="{{ order_by }}">
<input type="hidden" name="sort" value="{{ sort }}">
<input type="hidden" name="search" value="{{ search }}">
<input type="hidden" name="for" value="{{ for }}">
<div class="widget widget-select">
<label for="ctrl_per_page" class="invisible">{{ per_page_label }}</label>
<select name="per_page" id="ctrl_per_page" class="select">
<option value="10"{% if 10 == per_page %} selected{% endif %}>10</option>
<option value="20"{% if 20 == per_page %} selected{% endif %}>20</option>
<option value="30"{% if 30 == per_page %} selected{% endif %}>30</option>
<option value="50"{% if 50 == per_page %} selected{% endif %}>50</option>
<option value="100"{% if 100 == per_page %} selected{% endif %}>100</option>
<option value="250"{% if 250 == per_page %} selected{% endif %}>250</option>
<option value="500"{% if 500 == per_page %} selected{% endif %}>500</option>
</select>
</div>
<div class="widget widget-submit">
<button type="submit" class="submit">{{ per_page_label }}</button>
</div>
</div>
</form>
</div>
{% endif %}
{% if searchable and for and not tbody|default %}
{{ no_results }}
{% else %}
{% set tagOptions = {} %}
{% for row in tbody|default([]) %}
{% set tagsRaw = row.tag_labels.content|default(row.tags.content|default(''))|striptags %}
{% set tagsPrepared = tagsRaw|replace({'&nbsp;': '', '&amp;nbsp;': '', ' ': '', ';': ',', '|': ',', '/': ',', ', ': ',', ' ,': ','}) %}
{% set tagParts = tagsPrepared is not empty ? tagsPrepared|split(',') : [] %}
{% for part in tagParts %}
{% set tagValue = part|striptags|replace({'&nbsp;': '', '&amp;nbsp;': '', ' ': ''})|trim %}
{% if legacyTagLabels[tagValue] is defined %}
{% set tagLabel = legacyTagLabels[tagValue] %}
{% elseif tagValue matches '/^\\d+$/' %}
{% set tagLabel = '' %}
{% elseif tagValue matches '/^[\\p{L}\\p{N}\\s._,&+\\-\\/]+$/u' %}
{% set tagLabel = tagValue %}
{% else %}
{% set tagLabel = '' %}
{% endif %}
{% if tagLabel is not empty %}
{% set tagSlug = tagLabel|lower|replace({'ä': 'ae', 'ö': 'oe', 'ü': 'ue', 'ß': 'ss', ' ': '-', '/': '-', '&': '-', '+': '-', '.': '', ',': '', '(': '', ')': '', '"': '', "'": ''}) %}
{% if tagSlug is not empty and tagOptions[tagSlug] is not defined %}
{% set tagOptions = tagOptions|merge({ (tagSlug): tagLabel }) %}
{% endif %}
{% endif %}
{% endfor %}
{% endfor %}
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/slim-select@3/dist/slimselect.min.css">
<div id="orgfilters" class="controls filters">
<label for="org-tag-filter" class="visually-hidden">Nach Typ filtern</label>
<select id="org-tag-filter" class="select" data-placeholder="Typ wählen">
<option value="">Alle</option>
{% for slug, label in tagOptions %}
<option value="{{ slug }}">{{ label }}</option>
{% endfor %}
</select>
<button type="button" id="org-filter-reset" class="submit" style="display:none;">Filter zurücksetzen</button>
</div>
<div id="org">
<div id="org-list">
{% for row in tbody|default([]) %}
{% set tagSlugsRaw = row.tag_slugs.content|default('')|trim %}
{% set tagsRaw = row.tag_labels.content|default(row.tags.content|default(''))|striptags %}
{% set tagsPrepared = tagsRaw|replace({'&nbsp;': '', '&amp;nbsp;': '', ' ': '', ';': ',', '|': ',', '/': ',', ', ': ',', ' ,': ','}) %}
{% set tagParts = tagsPrepared is not empty ? tagsPrepared|split(',') : [] %}
{% set tagClasses = [] %}
{% set tagSlugs = [] %}
{% if tagSlugsRaw is not empty %}
{% for slug in tagSlugsRaw|split(',') %}
{% set cleanedSlug = slug|trim %}
{% if cleanedSlug is not empty %}
{% set tagSlugs = tagSlugs|merge([cleanedSlug]) %}
{% set tagClasses = tagClasses|merge(['tag-' ~ cleanedSlug]) %}
{% endif %}
{% endfor %}
{% endif %}
{% for part in tagParts if tagSlugsRaw is empty %}
{% set tagValue = part|striptags|replace({'&nbsp;': '', '&amp;nbsp;': '', ' ': ''})|trim %}
{% if legacyTagLabels[tagValue] is defined %}
{% set tagLabel = legacyTagLabels[tagValue] %}
{% elseif tagValue matches '/^\\d+$/' %}
{% set tagLabel = '' %}
{% elseif tagValue matches '/^[\\p{L}\\p{N}\\s._,&+\\-\\/]+$/u' %}
{% set tagLabel = tagValue %}
{% else %}
{% set tagLabel = '' %}
{% endif %}
{% if tagLabel is not empty %}
{% set tagSlug = tagLabel|lower|replace({'ä': 'ae', 'ö': 'oe', 'ü': 'ue', 'ß': 'ss', ' ': '-', '/': '-', '&': '-', '+': '-', '.': '', ',': '', '(': '', ')': '', '"': '', "'": ''}) %}
{% if tagSlug is not empty %}
{% set tagClasses = tagClasses|merge(['tag-' ~ tagSlug]) %}
{% set tagSlugs = tagSlugs|merge([tagSlug]) %}
{% endif %}
{% endif %}
{% endfor %}
{% set title = row.title.content|default('') %}
{% set logoUuid = row.logo_uuid.content|default('')|trim %}
{% set lastCol = row|last %}
<div class="org-item{% if tagClasses|length %} {{ tagClasses|join(' ') }}{% endif %}"{% if tagSlugs|length %} data-tags="{{ tagSlugs|join(',') }}"{% endif %}>
<div class="wrapper">
{% if logoUuid is not empty %}
<div class="logo">{{ ('{{figure::' ~ logoUuid ~ '}}')|insert_tag_raw }}</div>
{% endif %}
{% if title is not empty %}
<div class="title">{{ title|sanitize_html }}</div>
{% endif %}
{% if details and lastCol and lastCol.url|default %}
<a class="details" href="{{ lastCol.url }}" title="{{ title|striptags }} - Details"></a>
{% endif %}
</div>
</div>
{% endfor %}
</div>
</div>
{% endif %}
{% if pagination is defined %}
{{ pagination|raw }}
{% endif %}
<script src="https://cdn.jsdelivr.net/npm/slim-select@3/dist/slimselect.min.js"></script>
<script>
(function () {
const selectElement = document.querySelector('#org-tag-filter');
const resetButton = document.querySelector('#org-filter-reset');
const items = Array.from(document.querySelectorAll('#org-list .org-item'));
if (!selectElement || !items.length || typeof SlimSelect === 'undefined') {
return;
}
const slim = new SlimSelect({
select: selectElement,
settings: {
allowDeselect: true,
showSearch: false,
placeholderText: 'Alle'
}
});
const applyFilter = function (selectedTag) {
const activeTag = selectedTag || '';
if (!activeTag) {
items.forEach(function (item) {
item.style.removeProperty('display');
});
if (resetButton) {
resetButton.style.display = 'none';
}
return;
}
items.forEach(function (item) {
const itemTags = (item.getAttribute('data-tags') || '').split(',').filter(Boolean);
item.style.display = itemTags.includes(activeTag) ? '' : 'none';
});
if (resetButton) {
resetButton.style.display = activeTag ? '' : 'none';
}
};
selectElement.addEventListener('change', function () {
applyFilter(selectElement.value || '');
});
if (resetButton) {
resetButton.addEventListener('click', function () {
slim.setSelected('');
applyFilter('');
});
}
if (selectElement.value) {
applyFilter(selectElement.value);
}
})();
</script>
{% endblock %}