zeitbild/frontend-dali
0
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

[mod] widget:listview:bessere Darstellung und Bedienung

Browse source
This commit is contained in:
Fenris Wolf 2024-10-20 17:26:35 +02:00
parent 34ec6125c5
commit 18fcdd881e
5 changed files with 77 additions and 44 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
source/data/localization/deu.loc.json
View file

@ -13,6 +13,7 @@
"common.weekday.friday": "Fr",
"common.weekday.saturday": "Sa",
"common.weekday.sunday": "So",
"common.open": "öffnen",
"access_level.none": "nichts",
"access_level.view": "nur lesen",
"access_level.edit": "lesen und bearbeiten",

1
source/data/localization/eng.loc.json
View file

@ -13,6 +13,7 @@
"common.weekday.friday": "Fri",
"common.weekday.saturday": "Sat",
"common.weekday.sunday": "Sun",
"common.open": "open",
"access_level.none": "none",
"access_level.view": "read only",
"access_level.edit": "read and write",

4
source/style/widgets.css
View file

@ -67,6 +67,10 @@
content: "] ";
}
.listview-entry-field-empty {
display: none;
}
.listview-entry-field:not(:last-child)
{
margin-bottom: 16px;

93
source/widgets/listview/logic.ts
View file

@ -133,27 +133,49 @@ namespace _zeitbild.frontend_web.widgets.listview
"widget-listview",
"entry",
{
"name": entry.event_object.name,
"calendar": entry.calendar_name,
"when": _zeitbild.frontend_web.helpers.timespan_format(entry.event_object.begin, entry.event_object.end),
"label_location": lib_plankton.translate.get("event.location"),
"location": (
"name_value": entry.event_object.name,
"calendar_value": entry.calendar_name,
"when_value": _zeitbild.frontend_web.helpers.timespan_format(entry.event_object.begin, entry.event_object.end),
"location_label": lib_plankton.translate.get("event.location"),
"location_extra_classes": (
(entry.event_object.location === null)
?
"listview-entry-field-empty"
:
""
),
"location_value": (
(entry.event_object.location === null)
?
"?"
:
entry.event_object.location
),
"label_link": lib_plankton.translate.get("event.link"),
"link": (
"link_label": lib_plankton.translate.get("event.link"),
"link_extra_classes": (
(entry.event_object.link === null)
?
"listview-entry-field-empty"
:
""
),
"link_value": (
(entry.event_object.link === null)
?
"?"
:
entry.event_object.link
),
"label_description": lib_plankton.translate.get("event.description"),
"description": (
"link_action": lib_plankton.translate.get("common.open"),
"description_label": lib_plankton.translate.get("event.description"),
"description_extra_classes": (
(entry.event_object.description === null)
?
"listview-entry-field-empty"
:
""
),
"description_value": (
(entry.event_object.description === null)
?
"?"
@ -208,30 +230,35 @@ namespace _zeitbild.frontend_web.widgets.listview
(element) => {
element.addEventListener(
"click",
() => {
const rel : string = element.getAttribute("rel");
const parts : Array<string> = rel.split("/");
const calendar_id : _zeitbild.frontend_web.type.calendar_id = parseInt(parts[0]);
const event_id : (null | _zeitbild.frontend_web.type.local_resource_event_id) = (
parts[1] === "-"
?
null
:
parseInt(parts[1])
);
const access_level : _zeitbild.frontend_web.type.enum_access_level = (() => {
switch (parts[2]) {
case "none": return _zeitbild.frontend_web.type.enum_access_level.none;
case "view": return _zeitbild.frontend_web.type.enum_access_level.view;
case "edit": return _zeitbild.frontend_web.type.enum_access_level.edit;
case "admin": return _zeitbild.frontend_web.type.enum_access_level.admin;
}
}) ();
this.action_select_event(
calendar_id,
access_level,
event_id,
);
(event) => {
if (! (event.target === element)) {
// do nothing
}
else {
const rel : string = element.getAttribute("rel");
const parts : Array<string> = rel.split("/");
const calendar_id : _zeitbild.frontend_web.type.calendar_id = parseInt(parts[0]);
const event_id : (null | _zeitbild.frontend_web.type.local_resource_event_id) = (
parts[1] === "-"
?
null
:
parseInt(parts[1])
);
const access_level : _zeitbild.frontend_web.type.enum_access_level = (() => {
switch (parts[2]) {
case "none": return _zeitbild.frontend_web.type.enum_access_level.none;
case "view": return _zeitbild.frontend_web.type.enum_access_level.view;
case "edit": return _zeitbild.frontend_web.type.enum_access_level.edit;
case "admin": return _zeitbild.frontend_web.type.enum_access_level.admin;
}
}) ();
this.action_select_event(
calendar_id,
access_level,
event_id,
);
}
}
);
}

22
source/widgets/listview/templates/entry.html.tpl
View file

@ -1,20 +1,20 @@
<li class="listview-entry" style="background-color: {{color}}" rel="{{rel}}">
<span class="listview-entry-name">{{name}}</span> (<span class="listview-entry-calendar">{{calendar}}</span>)
<span class="listview-entry-name">{{name_value}}</span> (<span class="listview-entry-calendar">{{calendar_value}}</span>)
<div class="listview-entry-field listview-entry-when">
<span class="listview-entry-value">{{when}}</span>
<span class="listview-entry-value">{{when_value}}</span>
</div>
<div class="listview-entry-field listview-entry-location">
<span class="listview-entry-label">{{label_location}}</span>
<span class="listview-entry-value">{{location}}</span>
<div class="listview-entry-field listview-entry-location {{location_extra_classes}}">
<span class="listview-entry-label">{{location_label}}</span>
<span class="listview-entry-value">{{location_value}}</span>
</div>
<div class="listview-entry-field listview-entry-link">
<span class="listview-entry-label">{{label_link}}</span>
<a class="listview-entry-value" href="{{link}}" target="_blank">{{link}}</a>
<div class="listview-entry-field listview-entry-link {{link_extra_classes}}">
<span class="listview-entry-label">{{link_label}}</span>
<a class="listview-entry-value" href="{{link_value}}" target="_blank">{{link_action}}</a>
</div>
<!--
<div class="listview-entry-field listview-entry-description">
<span class="listview-entry-label">{{label_description}}</span>
<span class="listview-entry-value">{{description}}</span>
<div class="listview-entry-field listview-entry-description {{description_extra_classes}}">
<span class="listview-entry-label">{{description_label}}</span>
<span class="listview-entry-value">{{description_value}}</span>
</div>
<div class="listview-entry-raw">{{raw}}</div>
-->