[mod] page:events:rudimentäre Kontrollen

This commit is contained in:
Fenris Wolf 2024-09-30 14:04:23 +02:00
parent d2bf18eb64
commit f0af1abacb
7 changed files with 175 additions and 103 deletions

View file

@ -42,6 +42,10 @@
"page.event_edit.title.regular": "Termin ändern",
"page.event_edit.title.read_only": "Termin-Details",
"page.event_edit.actions.change": "ändern",
"page.event_edit.actions.remove": "löschen"
"page.event_edit.actions.remove": "löschen",
"page.events.controls.year": "Jahr",
"page.events.controls.week": "Woche",
"page.events.controls.count": "Anzahl",
"page.events.controls.apply": "Laden"
}
}

View file

@ -42,6 +42,10 @@
"page.event_edit.title.regular": "Change event",
"page.event_edit.title.read_only": "Event details",
"page.event_edit.actions.change": "change",
"page.event_edit.actions.remove": "delete"
"page.event_edit.actions.remove": "delete",
"page.events.controls.year": "Year",
"page.events.controls.week": "Week",
"page.events.controls.count": "Count",
"page.events.controls.apply": "Load"
}
}

View file

@ -162,7 +162,7 @@ namespace _zeitbild.frontend_web.pages
{
"name": "description",
"input": new lib_plankton.zoo_input.class_input_soft<string>(
new lib_plankton.zoo_input.class_input_text(
new lib_plankton.zoo_input.class_input_textarea(
)
),
"label": lib_plankton.translate.get("event.description")

View file

@ -98,7 +98,7 @@ namespace _zeitbild.frontend_web.pages
{
"name": "description",
"input": new lib_plankton.zoo_input.class_input_soft<string>(
new lib_plankton.zoo_input.class_input_text(
new lib_plankton.zoo_input.class_input_textarea(
)
),
"label": lib_plankton.translate.get("event.description")

View file

@ -6,114 +6,155 @@ namespace _zeitbild.frontend_web.pages
lib_plankton.zoo_page.register(
"events",
async (parameters, target_element) => {
target_element.innerHTML = "";
const content : string = await _zeitbild.frontend_web.view.calendar_view_table_html(
const load = async function (year, week, count) {
// controls
{
"calendar_ids": null,
// TODO
"from": {
"year": 2024,
"week": 37
},
// TODO
"to": {
"year": 2024,
"week": 43
},
"timezone_shift": /*conf.timezone_shift*/0,
(target_element.querySelector("#events_control_year > input") as HTMLInputElement).value = year.toFixed(0);
(target_element.querySelector("#events_control_week > input") as HTMLInputElement).value = week.toFixed(0);
(target_element.querySelector("#events_control_count > input") as HTMLInputElement).value = count.toFixed(0);
}
);
target_element.innerHTML = content;
target_element.querySelectorAll(".calendar-cell-regular").forEach(
(element) => {
element.addEventListener(
"click",
(event) => {
if (! (element === event.target)) {
// do nothing
}
else {
const rel : string = element.getAttribute("rel");
const parts : Array<string> = rel.split("-");
const year : int = parseInt(parts[0]);
const month : int = parseInt(parts[1]);
const day : int = parseInt(parts[2]);
lib_plankton.zoo_page.set(
{
"name": "event_add",
"parameters": {
"calendar_id": null,
"year": year,
"month": month,
"day": day,
// table
{
target_element.querySelector("#events_table").innerHTML = await _zeitbild.frontend_web.view.calendar_view_table_html(
{
"calendar_ids": null,
// TODO
"from": {
"year": year,
"week": week
},
// TODO
"to": {
"year": year,
"week": (week + count)
},
"timezone_shift": /*conf.timezone_shift*/0,
}
);
target_element.querySelectorAll(".calendar-cell-regular").forEach(
(element) => {
element.addEventListener(
"click",
(event) => {
if (! (element === event.target)) {
// do nothing
}
else {
const rel : string = element.getAttribute("rel");
const parts : Array<string> = rel.split("-");
const year : int = parseInt(parts[0]);
const month : int = parseInt(parts[1]);
const day : int = parseInt(parts[2]);
lib_plankton.zoo_page.set(
{
"name": "event_add",
"parameters": {
"calendar_id": null,
"year": year,
"month": month,
"day": day,
}
}
);
}
}
);
}
);
target_element.querySelectorAll(".calendar-event_entry").forEach(
(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;
}
}) ();
switch (access_level) {
case _zeitbild.frontend_web.type.enum_access_level.none: {
throw (new Error("this event should not be visible"));
break;
}
case _zeitbild.frontend_web.type.enum_access_level.view: {
lib_plankton.zoo_page.set(
{
"name": "event_edit",
"parameters": {
"read_only": "yes",
"calendar_id": calendar_id,
"event_id": event_id,
}
}
);
break;
}
case _zeitbild.frontend_web.type.enum_access_level.edit:
case _zeitbild.frontend_web.type.enum_access_level.admin: {
lib_plankton.zoo_page.set(
{
"name": "event_edit",
"parameters": {
"read_only": "no",
"calendar_id": calendar_id,
"event_id": event_id,
}
}
);
break;
}
}
);
}
}
);
}
);
target_element.querySelectorAll(".calendar-event_entry").forEach(
(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;
}
}) ();
switch (access_level) {
case _zeitbild.frontend_web.type.enum_access_level.none: {
throw (new Error("this event should not be visible"));
break;
}
case _zeitbild.frontend_web.type.enum_access_level.view: {
lib_plankton.zoo_page.set(
{
"name": "event_edit",
"parameters": {
"read_only": "yes",
"calendar_id": calendar_id,
"event_id": event_id,
}
}
);
break;
}
case _zeitbild.frontend_web.type.enum_access_level.edit:
case _zeitbild.frontend_web.type.enum_access_level.admin: {
lib_plankton.zoo_page.set(
{
"name": "event_edit",
"parameters": {
"read_only": "no",
"calendar_id": calendar_id,
"event_id": event_id,
}
}
);
break;
}
}
}
);
}
};
target_element.innerHTML = "";
target_element.innerHTML = await _zeitbild.frontend_web.helpers.template_coin(
"events",
{
"label_control_year": lib_plankton.translate.get("page.events.controls.year"),
"label_control_week": lib_plankton.translate.get("page.events.controls.week"),
"label_control_count": lib_plankton.translate.get("page.events.controls.count"),
"label_control_apply": lib_plankton.translate.get("page.events.controls.apply"),
}
);
// controls
{
target_element.querySelector("#events_control_apply").addEventListener(
"click",
(event) => {
event.preventDefault();
const year : int = parseInt((target_element.querySelector("#events_control_year > input") as HTMLInputElement).value);
const week : int = parseInt((target_element.querySelector("#events_control_week > input") as HTMLInputElement).value);
const count : int = parseInt((target_element.querySelector("#events_control_count > input") as HTMLInputElement).value);
load(year, week, count);
}
);
}
// table
{
const ywd_now : lib_plankton.pit.type_ywd = lib_plankton.pit.to_ywd(lib_plankton.pit.now());
let year : int = ywd_now.year;
let week : int = Math.max(0, (ywd_now.week - 1));
let count : int = 5;
load(year, week, count);
}
return Promise.resolve<void>(undefined);
},
);

View file

@ -159,3 +159,7 @@ a:hover {
.plankton_input_group {
margin-left: 48px;
}
#events_controls {
margin-bottom: 8px;
}

View file

@ -0,0 +1,19 @@
<div id="events">
<div id="events_controls">
<label id="events_control_year">
<span>{{label_control_year}}</span>
<input type="number"/>
</label>
<label id="events_control_week">
<span>{{label_control_week}}</span>
<input type="number"/>
</label>
<label id="events_control_count">
<span>{{label_control_count}}</span>
<input type="count"/>
</label>
<input type="submit" id="events_control_apply" value="{{label_control_apply}}"/>
</div>
<div id="events_table">
</div>
</div>