lib/plankton/plankton.d.ts

@@ -3809,6 +3809,55 @@ declare namespace lib_plankton.translate {
      */
     function stance(str: string): string;
 }
+declare namespace lib_plankton.zoo_page {
+    /**
+     */
+    export type type_location = {
+        name: string;
+        parameters: Record<string, any>;
+    };
+    /**
+     */
+    type type_handler = ((parameters: Record<string, any>, target_element: Element) => void);
+    /**
+     */
+    type type_nav_entry_definition = {
+        location: type_location;
+        label: string;
+        groups: Array<string>;
+    };
+    /**
+     */
+    export let _pool: Record<string, type_handler>;
+    /**
+     */
+    export function encode(location: type_location): string;
+    /**
+     * encodes a location in the URL and loads it
+     */
+    export function set(location: type_location): void;
+    /**
+     */
+    export function reload(): Promise<void>;
+    /**
+     */
+    export function register(location_name: string, handler: type_handler): void;
+    /**
+     */
+    export function nav_set_groups(groups: (null | Array<string>)): void;
+    /**
+     */
+    export function init(target_element: Element, { "pool": pool, "fallback": fallback, "nav_entries": nav_entries, "nav_initial_groups": nav_initial_groups, }?: {
+        pool?: Record<string, type_handler>;
+        fallback?: (null | type_location);
+        nav_entries?: Array<type_nav_entry_definition>;
+        nav_initial_groups?: (null | Array<string>);
+    }): void;
+    /**
+     */
+    export function start(): void;
+    export {};
+}
 declare namespace lib_plankton.zoo_widget {
     /**
      */
@@ -3994,55 +4043,6 @@ declare namespace lib_plankton.zoo_widget {
         load(target_element: HTMLElement): Promise<void>;
     }
 }
-declare namespace lib_plankton.zoo_page {
-    /**
-     */
-    export type type_location = {
-        name: string;
-        parameters: Record<string, any>;
-    };
-    /**
-     */
-    type type_handler = ((parameters: Record<string, any>, target_element: Element) => void);
-    /**
-     */
-    type type_nav_entry_definition = {
-        location: type_location;
-        label: string;
-        groups: Array<string>;
-    };
-    /**
-     */
-    export let _pool: Record<string, type_handler>;
-    /**
-     */
-    export function encode(location: type_location): string;
-    /**
-     * encodes a location in the URL and loads it
-     */
-    export function set(location: type_location): void;
-    /**
-     */
-    export function reload(): Promise<void>;
-    /**
-     */
-    export function register(location_name: string, handler: type_handler): void;
-    /**
-     */
-    export function nav_set_groups(groups: (null | Array<string>)): void;
-    /**
-     */
-    export function init(target_element: Element, { "pool": pool, "fallback": fallback, "nav_entries": nav_entries, "nav_initial_groups": nav_initial_groups, }?: {
-        pool?: Record<string, type_handler>;
-        fallback?: (null | type_location);
-        nav_entries?: Array<type_nav_entry_definition>;
-        nav_initial_groups?: (null | Array<string>);
-    }): void;
-    /**
-     */
-    export function start(): void;
-    export {};
-}
 declare namespace lib_plankton.zoo_input {
     /**
      * @author fenris

lib/plankton/plankton.js

@@ -9940,7 +9940,7 @@ var lib_plankton;
                     h = 0;
                 }
                 else if (q === r) {
-                    h = ((0 / 3) + lib_plankton.math.mod((g - b) / (c * 6), 1));
+                    h = ((0 / 3) + ((g - b) / (c * 6)));
                 }
                 else if (q === g) {
                     h = ((1 / 3) + ((b - r) / (c * 6)));
@@ -11738,6 +11738,190 @@ var lib_plankton;
     })(translate = lib_plankton.translate || (lib_plankton.translate = {}));
 })(lib_plankton || (lib_plankton = {}));
 /*
+This file is part of »bacterio-plankton:zoo-page«.
+
+Copyright 2016-2024 'Christian Fraß, Christian Neubauer, Martin Springwald GbR'
+<info@greenscale.de>
+
+»bacterio-plankton:zoo-page« is free software: you can redistribute it and/or modify
+it under the terms of the GNU Lesser General Public License as published by
+the Free Software Foundation, either version 3 of the License, or
+(at your option) any later version.
+
+»bacterio-plankton:zoo-page« is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Lesser General Public License for more details.
+
+You should have received a copy of the GNU Lesser General Public License
+along with »bacterio-plankton:zoo-page«. If not, see <http://www.gnu.org/licenses/>.
+ */
+var lib_plankton;
+(function (lib_plankton) {
+    var zoo_page;
+    (function (zoo_page) {
+        /**
+         */
+        zoo_page._pool = {};
+        /**
+         */
+        let _fallback = null;
+        /**
+         */
+        let _current = null;
+        /**
+         */
+        let _target_element = null;
+        /**
+         */
+        let _nav_entries;
+        /**
+         */
+        function encode(location) {
+            return ("#"
+                +
+                    ([location.name]
+                        .concat(Object.entries(location.parameters)
+                        .filter(([key, value]) => (value !== null))
+                        .map(([key, value]) => (key + "=" + value)))));
+        }
+        zoo_page.encode = encode;
+        /**
+         */
+        function decode(encoded) {
+            if (encoded === "") {
+                return null;
+            }
+            else {
+                if (!encoded.startsWith("#")) {
+                    return null;
+                }
+                else {
+                    const parts = encoded.slice(1).split(",");
+                    return {
+                        "name": parts[0],
+                        "parameters": Object.fromEntries(parts.slice(1)
+                            .map(part => {
+                            const parts_ = part.split("=");
+                            return [parts_[0], parts_[1]];
+                        })),
+                    };
+                }
+            }
+        }
+        /**
+         * renders a page to the main element
+         */
+        async function load(location) {
+            // _target_element.innerHTML = "[loading …]";
+            _target_element.innerHTML = "";
+            if (location === null) {
+                // do nothing
+            }
+            else {
+                if (!(location.name in zoo_page._pool)) {
+                    _target_element.innerHTML = "not found";
+                }
+                else {
+                    await zoo_page._pool[location.name](location.parameters, _target_element);
+                    _current = location;
+                }
+            }
+        }
+        /**
+         * retrieves the location from the set URL
+         */
+        function get() {
+            return decode(window.location.hash);
+        }
+        /**
+         * encodes a location in the URL and loads it
+         */
+        function set(location) {
+            window.location.hash = encode(location);
+        }
+        zoo_page.set = set;
+        /**
+         */
+        function reload() {
+            return load(get());
+        }
+        zoo_page.reload = reload;
+        /**
+         */
+        function register(location_name, handler) {
+            zoo_page._pool[location_name] = handler;
+        }
+        zoo_page.register = register;
+        /**
+         */
+        function nav_set_groups(groups) {
+            _nav_entries.forEach(nav_entry => {
+                const active = ((groups === null)
+                    ||
+                        groups.some(group => nav_entry.definition.groups.includes(group)));
+                nav_entry.element.classList.toggle("active", active);
+            });
+        }
+        zoo_page.nav_set_groups = nav_set_groups;
+        /**
+         */
+        function init(target_element, { "pool": pool = {}, "fallback": fallback = null, "nav_entries": nav_entries = [], "nav_initial_groups": nav_initial_groups = null, } = {}) {
+            _target_element = target_element;
+            _fallback = fallback;
+            Object.entries(pool).forEach(([location_name, handler]) => {
+                register(location_name, handler);
+            });
+            window.addEventListener("hashchange", () => {
+                const location_old = _current;
+                const location_new = (get() ?? _fallback);
+                if (((location_old === null)
+                    &&
+                        (location_new !== null))
+                    ||
+                        ((location_old !== null)
+                            &&
+                                (location_new !== null)
+                            &&
+                                (location_old.name !== location_new.name))) {
+                    load(location_new);
+                }
+                else {
+                    // do nothing
+                }
+            });
+            // nav
+            {
+                let ul_element = document.querySelector("nav > ul");
+                _nav_entries = nav_entries.map(nav_entry_definition => {
+                    let li_element = document.createElement("li");
+                    {
+                        let a_element = document.createElement("a");
+                        a_element.setAttribute("href", encode(nav_entry_definition.location));
+                        a_element.textContent = (nav_entry_definition.label ?? nav_entry_definition.location.name);
+                        li_element.appendChild(a_element);
+                    }
+                    ul_element.appendChild(li_element);
+                    return {
+                        "definition": nav_entry_definition,
+                        "element": li_element,
+                    };
+                });
+                nav_set_groups(nav_initial_groups);
+            }
+        }
+        zoo_page.init = init;
+        /**
+         */
+        function start() {
+            const location = (get() ?? _fallback);
+            set(location);
+            load(location);
+        }
+        zoo_page.start = start;
+    })(zoo_page = lib_plankton.zoo_page || (lib_plankton.zoo_page = {}));
+})(lib_plankton || (lib_plankton = {}));
+/*
 This file is part of »bacterio-plankton:zoo-widget«.
 
 Copyright 2016-2024 'Christian Fraß, Christian Neubauer, Martin Springwald GbR'
@@ -12257,190 +12441,6 @@ var lib_plankton;
     })(zoo_widget = lib_plankton.zoo_widget || (lib_plankton.zoo_widget = {}));
 })(lib_plankton || (lib_plankton = {}));
 /*
-This file is part of »bacterio-plankton:zoo-page«.
-
-Copyright 2016-2024 'Christian Fraß, Christian Neubauer, Martin Springwald GbR'
-<info@greenscale.de>
-
-»bacterio-plankton:zoo-page« is free software: you can redistribute it and/or modify
-it under the terms of the GNU Lesser General Public License as published by
-the Free Software Foundation, either version 3 of the License, or
-(at your option) any later version.
-
-»bacterio-plankton:zoo-page« is distributed in the hope that it will be useful,
-but WITHOUT ANY WARRANTY; without even the implied warranty of
-MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
-GNU Lesser General Public License for more details.
-
-You should have received a copy of the GNU Lesser General Public License
-along with »bacterio-plankton:zoo-page«. If not, see <http://www.gnu.org/licenses/>.
- */
-var lib_plankton;
-(function (lib_plankton) {
-    var zoo_page;
-    (function (zoo_page) {
-        /**
-         */
-        zoo_page._pool = {};
-        /**
-         */
-        let _fallback = null;
-        /**
-         */
-        let _current = null;
-        /**
-         */
-        let _target_element = null;
-        /**
-         */
-        let _nav_entries;
-        /**
-         */
-        function encode(location) {
-            return ("#"
-                +
-                    ([location.name]
-                        .concat(Object.entries(location.parameters)
-                        .filter(([key, value]) => (value !== null))
-                        .map(([key, value]) => (key + "=" + value)))));
-        }
-        zoo_page.encode = encode;
-        /**
-         */
-        function decode(encoded) {
-            if (encoded === "") {
-                return null;
-            }
-            else {
-                if (!encoded.startsWith("#")) {
-                    return null;
-                }
-                else {
-                    const parts = encoded.slice(1).split(",");
-                    return {
-                        "name": parts[0],
-                        "parameters": Object.fromEntries(parts.slice(1)
-                            .map(part => {
-                            const parts_ = part.split("=");
-                            return [parts_[0], parts_[1]];
-                        })),
-                    };
-                }
-            }
-        }
-        /**
-         * renders a page to the main element
-         */
-        async function load(location) {
-            // _target_element.innerHTML = "[loading …]";
-            _target_element.innerHTML = "";
-            if (location === null) {
-                // do nothing
-            }
-            else {
-                if (!(location.name in zoo_page._pool)) {
-                    _target_element.innerHTML = "not found";
-                }
-                else {
-                    await zoo_page._pool[location.name](location.parameters, _target_element);
-                    _current = location;
-                }
-            }
-        }
-        /**
-         * retrieves the location from the set URL
-         */
-        function get() {
-            return decode(window.location.hash);
-        }
-        /**
-         * encodes a location in the URL and loads it
-         */
-        function set(location) {
-            window.location.hash = encode(location);
-        }
-        zoo_page.set = set;
-        /**
-         */
-        function reload() {
-            return load(get());
-        }
-        zoo_page.reload = reload;
-        /**
-         */
-        function register(location_name, handler) {
-            zoo_page._pool[location_name] = handler;
-        }
-        zoo_page.register = register;
-        /**
-         */
-        function nav_set_groups(groups) {
-            _nav_entries.forEach(nav_entry => {
-                const active = ((groups === null)
-                    ||
-                        groups.some(group => nav_entry.definition.groups.includes(group)));
-                nav_entry.element.classList.toggle("active", active);
-            });
-        }
-        zoo_page.nav_set_groups = nav_set_groups;
-        /**
-         */
-        function init(target_element, { "pool": pool = {}, "fallback": fallback = null, "nav_entries": nav_entries = [], "nav_initial_groups": nav_initial_groups = null, } = {}) {
-            _target_element = target_element;
-            _fallback = fallback;
-            Object.entries(pool).forEach(([location_name, handler]) => {
-                register(location_name, handler);
-            });
-            window.addEventListener("hashchange", () => {
-                const location_old = _current;
-                const location_new = (get() ?? _fallback);
-                if (((location_old === null)
-                    &&
-                        (location_new !== null))
-                    ||
-                        ((location_old !== null)
-                            &&
-                                (location_new !== null)
-                            &&
-                                (location_old.name !== location_new.name))) {
-                    load(location_new);
-                }
-                else {
-                    // do nothing
-                }
-            });
-            // nav
-            {
-                let ul_element = document.querySelector("nav > ul");
-                _nav_entries = nav_entries.map(nav_entry_definition => {
-                    let li_element = document.createElement("li");
-                    {
-                        let a_element = document.createElement("a");
-                        a_element.setAttribute("href", encode(nav_entry_definition.location));
-                        a_element.textContent = (nav_entry_definition.label ?? nav_entry_definition.location.name);
-                        li_element.appendChild(a_element);
-                    }
-                    ul_element.appendChild(li_element);
-                    return {
-                        "definition": nav_entry_definition,
-                        "element": li_element,
-                    };
-                });
-                nav_set_groups(nav_initial_groups);
-            }
-        }
-        zoo_page.init = init;
-        /**
-         */
-        function start() {
-            const location = (get() ?? _fallback);
-            set(location);
-            load(location);
-        }
-        zoo_page.start = start;
-    })(zoo_page = lib_plankton.zoo_page || (lib_plankton.zoo_page = {}));
-})(lib_plankton || (lib_plankton = {}));
-/*
 This file is part of »bacterio-plankton:zoo-input«.
 
 Copyright 2016-2024 'Christian Fraß, Christian Neubauer, Martin Springwald GbR'

misc/conf-example.json

@@ -8,6 +8,6 @@
 	},
 	"misc": {
 		"oidc_redirect_uri_template": "http://localhost:8888/#oidc_finish,session_key={{session_key}}",
-		"use_central_europe_specific_datetime_inputs": true
+		"use_central_europe_specific_datetime_inputs": false
 	}
 }

source/base/widget.ts

@@ -0,0 +1,18 @@
+namespace _dali
+{
+	
+	/**
+	 * @todo outsource
+	 */
+	export abstract class class_widget
+	{
+		
+		/**
+		 */
+		public abstract load(
+			target_element : Element
+		) : Promise<void>;
+		
+	}
+	
+}

source/data/localization/deu.loc.json

@@ -18,7 +18,6 @@
 		"common.edit": "bearbeiten",
 		"common.show": "zeigen",
 		"common.hide": "ausblenden",
-		"common.cancel": "abbrechen",
 		"access_level.none": "nichts",
 		"access_level.view": "nur lesen",
 		"access_level.edit": "lesen und bearbeiten",
@@ -50,11 +49,6 @@
 		"widget.weekview.controls.week": "Woche",
 		"widget.weekview.controls.count": "Anzahl",
 		"widget.weekview.controls.apply": "Laden",
-		"widget.calendar_edit.actions.change": "ändern",
-		"widget.calendar_edit.actions.remove": "löschen",
-		"widget.event_edit.actions.add": "anlegen",
-		"widget.event_edit.actions.change": "ändern",
-		"widget.event_edit.actions.remove": "löschen",
 		"page.login.title": "Anmelden",
 		"page.login.internal.name": "Name",
 		"page.login.internal.password": "Kennwort",
@@ -76,9 +70,14 @@
 		"page.calendar_add.actions.do": "anlegen",
 		"page.calendar_edit.title.regular": "Kalendar bearbeiten",
 		"page.calendar_edit.title.read_only": "Kalendar-Details",
+		"page.calendar_edit.actions.change": "ändern",
+		"page.calendar_edit.actions.remove": "löschen",
 		"page.event_add.title": "Termin anlegen",
+		"page.event_add.actions.do": "anlegen",
 		"page.event_edit.title.regular": "Termin bearbeiten",
 		"page.event_edit.title.read_only": "Termin-Details",
+		"page.event_edit.actions.change": "ändern",
+		"page.event_edit.actions.remove": "löschen",
 		"page.overview.title": "Übersicht",
 		"page.overview.login_hint": "anmelden um nicht-öffentliche Termine zu sehen",
 		"page.overview.mode.week": "Wochen-Ansicht",

source/data/localization/eng.loc.json

@@ -18,7 +18,6 @@
 		"common.edit": "edit",
 		"common.show": "show",
 		"common.hide": "hide",
-		"common.cancel": "cancel",
 		"access_level.none": "none",
 		"access_level.view": "read only",
 		"access_level.edit": "read and write",
@@ -50,11 +49,6 @@
 		"widget.weekview.controls.week": "Week",
 		"widget.weekview.controls.count": "Count",
 		"widget.weekview.controls.apply": "Load",
-		"widget.calendar_edit.actions.change": "change",
-		"widget.calendar_edit.actions.remove": "delete",
-		"widget.event_edit.actions.add": "add",
-		"widget.event_edit.actions.change": "change",
-		"widget.event_edit.actions.remove": "delete",
 		"page.login.title": "Login",
 		"page.login.internal.name": "name",
 		"page.login.internal.password": "password",
@@ -75,10 +69,15 @@
 		"page.calendar_add.title": "Add calendar",
 		"page.calendar_add.actions.do": "anlegen",
 		"page.event_add.title": "Add event",
+		"page.event_add.actions.do": "add",
 		"page.calendar_edit.title.regular": "Edit calendar",
 		"page.calendar_edit.title.read_only": "Calendar details",
+		"page.calendar_edit.actions.change": "change",
+		"page.calendar_edit.actions.remove": "delete",
 		"page.event_edit.title.regular": "Edit event",
 		"page.event_edit.title.read_only": "Event details",
+		"page.event_edit.actions.change": "change",
+		"page.event_edit.actions.remove": "delete",
 		"page.overview.title": "Overview",
 		"page.overview.login_hint": "log in to view non-public events",
 		"page.overview.mode.week": "week view",

source/index.html.tpl

@@ -31,10 +31,6 @@ document.addEventListener(
 				</ul>
 			</nav>
 		</header>
-		<div id="overlay">
-			<div id="overlay_content">
-			</div>
-		</div>
 		<main>
 		</main>
 	</body>

source/main.ts

@@ -109,7 +109,6 @@ namespace _dali
 			}
 		);
 		await update();
-		await _dali.overlay.initialize();
 		lib_plankton.call.loop(
 			() => {
 				update();

source/overlay.ts

@@ -1,75 +0,0 @@
-namespace _dali.overlay
-{
-	
-	/**
-	 */
-	function get_container_element(
-	) : HTMLElement
-	{
-		return document.querySelector("#overlay");
-	}
-	
-	
-	/**
-	 */
-	export function get_content_element(
-	) : HTMLElement
-	{
-		return document.querySelector("#overlay_content");
-	}
-	
-	
-	/**
-	 */
-	export function clear(
-	) : void
-	{
-		get_content_element().innerHTML = "";
-	}
-	
-	
-	/**
-	 */
-	export function toggle(
-		{
-			"mode": mode = null,
-		}
-		:
-		{
-			mode ?: (null | boolean);
-		}
-		=
-		{
-		}
-	) : void
-	{
-		get_container_element().classList.toggle("overlay_active", mode ?? undefined);
-	}
-	
-	
-	/**
-	 */
-	export function initialize(
-	) : Promise<void>
-	{
-		clear();
-		const container_element : HTMLElement = get_container_element();
-		/*
-		container_element.addEventListener(
-			"click",
-			(event) => {
-				if (event.target == container_element)
-				{
-					toggle({"mode": false});
-				}
-				else
-				{
-					// do nothing
-				}
-			}
-		);
-		 */
-		return Promise.resolve<void>(undefined);
-	}
-		
-}

source/pages/calendar_edit/logic.ts

@@ -16,51 +16,170 @@ namespace _dali.pages
 					"label": lib_plankton.translate.get("page.calendar_edit.title.regular")
 				}
 			);
+			const form : lib_plankton.zoo_form.class_form<
+				{
+					name : string;
+					hue : float;
+					access : {
+						public : boolean;
+						default_level : _dali.type.enum_access_level;
+						attributed : lib_plankton.map.type_map<
+							_dali.type.user_id,
+							_dali.type.enum_access_level
+						>;
+					};
+				},
+				{
+					name : string;
+					hue : float;
+					access : {
+						public : boolean;
+						default_level : _dali.type.enum_access_level;
+						attributed : lib_plankton.map.type_map<
+							_dali.type.user_id,
+							_dali.type.enum_access_level
+						>;
+					};
+				}
+			> = new lib_plankton.zoo_form.class_form<
+				{
+					name : string;
+					hue : float;
+					access : {
+						public : boolean;
+						default_level : _dali.type.enum_access_level;
+						attributed : lib_plankton.map.type_map<
+							_dali.type.user_id,
+							_dali.type.enum_access_level
+						>;
+					};
+				},
+				{
+					name : string;
+					hue : float;
+					access : {
+						public : boolean;
+						default_level : _dali.type.enum_access_level;
+						attributed : lib_plankton.map.type_map<
+							_dali.type.user_id,
+							_dali.type.enum_access_level
+						>;
+					};
+				}
+			>(
+				(value) => value,
+				(raw) => raw,
+				new lib_plankton.zoo_input.class_input_group<any>(
+					[
+						{
+							"name": "name",
+							"input": new lib_plankton.zoo_input.class_input_text(),
+							"label": lib_plankton.translate.get("calendar.name")
+						},
+						{
+							"name": "hue",
+							"input": new lib_plankton.zoo_input.class_input_hue(
+							),
+							"label": lib_plankton.translate.get("calendar.hue"),
+						},
+						{
+							"name": "access",
+							"input": new lib_plankton.zoo_input.class_input_group(
+								[
+									{
+										"name": "public",
+										"input": new lib_plankton.zoo_input.class_input_checkbox(),
+										"label": lib_plankton.translate.get("calendar.access.public"),
+									},
+									{
+										"name": "default_level",
+										"input": _dali.helpers.input_access_level(),
+										"label": lib_plankton.translate.get("calendar.access.default_level"),
+									},
+									{
+										"name": "attributed",
+										"input": await _dali.helpers.input_attributed_access(),
+										"label": lib_plankton.translate.get("calendar.access.attributed"),
+									},
+								]
+							),
+							"label": lib_plankton.translate.get("calendar.access.access"),
+						},
+					]
+				),
+				(
+					read_only
+					?
+					[
+					]
+					:
+					[
+						{
+							"label": lib_plankton.translate.get("page.calendar_edit.actions.change"),
+							"procedure": async (get_value, get_representation) => {
+								const data : any = await get_value();
+								try {
+									await _dali.backend.calendar_change(
+										calendar_id,
+										data
+									);
+									lib_plankton.zoo_page.set(
+										{
+											"name": "overview",
+											"parameters": {}
+										}
+									);
+								}
+								catch (error) {
+									// do nothing
+									/*
+									lib_plankton.zoo_page.set(
+										{
+											"name": "event_add",
+											"parameters": {
+											}
+										}
+									);
+									 */
+								}
+							}
+						},
+						{
+							"label": lib_plankton.translate.get("page.calendar_edit.actions.remove"),
+							"procedure": async (get_value, get_representation) => {
+								try {
+									await _dali.backend.calendar_remove(
+										calendar_id
+									);
+									lib_plankton.zoo_page.set(
+										{
+											"name": "overview",
+											"parameters": {}
+										}
+									);
+								}
+								catch (error) {
+									// do nothing
+									/*
+									lib_plankton.zoo_page.set(
+										{
+											"name": "event_add",
+											"parameters": {
+											}
+										}
+									);
+									 */
+								}
+							}
+						},
+					]
+				)
+			);
+			await form.setup(document.querySelector("#calendar_edit_form"));
 			const calendar_object : _dali.type.calendar_object = await _dali.backend.calendar_get(
 				calendar_id
 			);
-			const widget = new _dali.widgets.calendar_edit.class_widget_calendar_edit(
+			await form.input_write(calendar_object);
-				{
-					"read_only": read_only,
-					"action_change": (data) => {
-						_dali.backend.calendar_change(
-							calendar_id,
-							data
-						)
-						.then(
-							() => {
-								lib_plankton.zoo_page.set(
-									{
-										"name": "overview",
-										"parameters": {}
-									}
-								);
-							}
-						);
-					},
-					"action_remove": (data) => {
-						_dali.backend.calendar_remove(
-							calendar_id
-						)
-						.then(
-							() => {
-								lib_plankton.zoo_page.set(
-									{
-										"name": "overview",
-										"parameters": {}
-									}
-								);
-							}
-						);
-					},
-					"initial_value": {
-						"name": calendar_object.name,
-						"hue": calendar_object.hue,
-						"access": calendar_object.access,
-					},
-				}
-			);
-			await widget.load(document.querySelector("#calendar_edit_form"));
 			return Promise.resolve<void>(undefined);
 		}
 	);

source/pages/event_add/logic.ts

@@ -0,0 +1,235 @@
+namespace _dali.pages
+{
+	
+	/**
+	 */
+	lib_plankton.zoo_page.register(
+		"event_add",
+		async (parameters, target_element) => {
+			const calendar_id : (null | int) = (
+				("calendar_id" in parameters)
+				?
+				parseInt(parameters["calendar_id"])
+				:
+				null
+			);
+			const year : (null | int) = (
+				("year" in parameters)
+				?
+				parseInt(parameters["year"])
+				:
+				null
+			);
+			const month : (null | int) = (
+				("month" in parameters)
+				?
+				parseInt(parameters["month"])
+				:
+				null
+			);
+			const day : (null | int) = (
+				("day" in parameters)
+				?
+				parseInt(parameters["day"])
+				:
+				null
+			);
+			const date : lib_plankton.pit.type_date = (
+				(
+					(year !== null)
+					&&
+					(month !== null)
+					&&
+					(day !== null)
+				)
+				?
+				{
+					"year": year,
+					"month": month,
+					"day": day,
+				}
+				:
+				lib_plankton.pit.to_datetime(lib_plankton.pit.now()).date
+			);
+			target_element.innerHTML = "";
+			target_element.innerHTML = await _dali.helpers.template_coin(
+				"event_add",
+				"default",
+				{
+					"label": lib_plankton.translate.get("page.event_add.title")
+				}
+			);
+			const form : lib_plankton.zoo_form.class_form<
+				{
+					calendar_id : _dali.type.calendar_id;
+					event_object : _dali.type.event_object;
+				},
+				{
+					calendar_id : string;
+					name : string;
+					begin : lib_plankton.pit.type_datetime;
+					end : (null | lib_plankton.pit.type_datetime);
+					location : (null | string);
+					link : (null | string);
+					description : (null | string);
+				}
+			> = new lib_plankton.zoo_form.class_form<
+				{
+					calendar_id : _dali.type.calendar_id;
+					event_object : _dali.type.event_object;
+				},
+				{
+					calendar_id : string;
+					name : string;
+					begin : lib_plankton.pit.type_datetime;
+					end : (null | lib_plankton.pit.type_datetime);
+					location : (null | string);
+					link : (null | string);
+					description : (null | string);
+				}
+			>(
+				(value) => ({
+					"calendar_id": value.calendar_id.toFixed(0),
+					"name": value.event_object.name,
+					"begin": value.event_object.begin,
+					"end": value.event_object.end,
+					"location": value.event_object.location,
+					"link": value.event_object.link,
+					"description": value.event_object.description,
+				}),
+				(representation) => ({
+					"calendar_id": parseInt(representation.calendar_id),
+					"event_object": {
+						"name": representation.name,
+						"begin": representation.begin,
+						"end": representation.end,
+						"location": representation.location,
+						"link": representation.link,
+						"description": representation.description,
+					}
+				}),
+				new lib_plankton.zoo_input.class_input_group<any>(
+					[
+						{
+							"name": "calendar_id",
+							"input": new lib_plankton.zoo_input.class_input_selection(
+								(
+									(await _dali.backend.calendar_list())
+									.filter(
+										(entry) => (
+											(entry.access_level === _dali.type.enum_access_level.edit)
+											||
+											(entry.access_level === _dali.type.enum_access_level.admin)
+										)
+									)
+									.map(
+										(entry) => ({
+											"value": entry.id.toFixed(0),
+											"label": entry.name,
+										})
+									)
+								)
+							),
+							"label": lib_plankton.translate.get("calendar.calendar")
+						},
+						{
+							"name": "name",
+							"input": new lib_plankton.zoo_input.class_input_text(
+							),
+							"label": lib_plankton.translate.get("event.name")
+						},
+						{
+							"name": "begin",
+							"input": _dali.helpers.datetime_input(),
+							"label": lib_plankton.translate.get("event.begin")
+						},
+						{
+							"name": "end",
+							"input": new lib_plankton.zoo_input.class_input_soft<lib_plankton.pit.type_datetime>(
+								_dali.helpers.datetime_input()
+							),
+							"label": lib_plankton.translate.get("event.end")
+						},
+						{
+							"name": "location",
+							"input": new lib_plankton.zoo_input.class_input_soft<string>(
+								new lib_plankton.zoo_input.class_input_text(
+								)
+							),
+							"label": lib_plankton.translate.get("event.location")
+						},
+						{
+							"name": "link",
+							"input": new lib_plankton.zoo_input.class_input_soft<string>(
+								new lib_plankton.zoo_input.class_input_text(
+								)
+							),
+							"label": lib_plankton.translate.get("event.link")
+						},
+						{
+							"name": "description",
+							"input": new lib_plankton.zoo_input.class_input_soft<string>(
+								new lib_plankton.zoo_input.class_input_textarea(
+								)
+							),
+							"label": lib_plankton.translate.get("event.description")
+						},
+					]
+				),
+				[
+					{
+						"label": lib_plankton.translate.get("page.event_add.actions.do"),
+						"target": "submit",
+						"procedure": async (get_value, get_representation) => {
+							const value : any = await get_value();
+							try {
+								await _dali.backend.calendar_event_add(
+									value.calendar_id,
+									value.event_object
+								);
+								lib_plankton.zoo_page.set(
+									{
+										"name": "overview",
+										"parameters": {}
+									}
+								);
+							}
+							catch (error) {
+								// do nothing
+								/*
+								lib_plankton.zoo_page.set(
+									{
+										"name": "event_add",
+										"parameters": {
+										}
+									}
+								);
+								 */
+							}
+						}
+					},
+				]
+			);
+			await form.setup(document.querySelector("#event_add_form"));
+			await form.input_write(
+				{
+					"calendar_id": (calendar_id ?? 0),
+					"event_object": {
+						"name": "",
+						"begin": {
+							"timezone_shift": 0,
+							"date": date,
+							"time": null
+						},
+						"end": null,
+						"location": null,
+						"link": null,
+						"description": null,
+					}
+				}
+			);
+			return Promise.resolve<void>(undefined);
+		}
+	);
+	
+}

source/pages/event_add/templates/default.html.tpl

@@ -0,0 +1,5 @@
+<div id="event_add">
+	<h2>{{label}}</h2>
+	<div id="event_add_form">
+	</div>
+</div>

source/pages/event_edit/logic.ts

@@ -0,0 +1,195 @@
+namespace _dali.pages
+{
+	
+	/**
+	 */
+	lib_plankton.zoo_page.register(
+		"event_edit",
+		async (parameters, target_element) => {
+			const read_only : boolean = ((parameters["read_only"] ?? "yes") === "yes");
+			const calendar_id : int = parseInt(parameters["calendar_id"]);
+			const event_id : int = parseInt(parameters["event_id"]);
+			target_element.innerHTML = "";
+			target_element.innerHTML = await _dali.helpers.template_coin(
+				"event_edit",
+				"default",
+				{
+					"label": (
+						read_only
+						?
+						lib_plankton.translate.get("page.event_edit.title.read_only")
+						:
+						lib_plankton.translate.get("page.event_edit.title.regular")
+					)
+				}
+			);
+			const form : lib_plankton.zoo_form.class_form<
+				_dali.type.event_object,
+				{
+					name : string;
+					begin : lib_plankton.pit.type_datetime;
+					end : (null | lib_plankton.pit.type_datetime);
+					location : (null | string);
+					link : (null | string);
+					description : (null | string);
+				}
+			> = new lib_plankton.zoo_form.class_form<
+				_dali.type.event_object,
+				{
+					name : string;
+					begin : lib_plankton.pit.type_datetime;
+					end : (null | lib_plankton.pit.type_datetime);
+					location : (null | string);
+					link : (null | string);
+					description : (null | string);
+				}
+			>(
+				(value) => ({
+					"name": value.name,
+					"begin": value.begin,
+					"end": value.end,
+					"location": value.location,
+					"link": value.link,
+					"description": value.description,
+				}),
+				(representation) => ({
+					"name": representation.name,
+					"begin": representation.begin,
+					"end": representation.end,
+					"location": representation.location,
+					"link": representation.link,
+					"description": representation.description,
+				}),
+				new lib_plankton.zoo_input.class_input_group<any>(
+					[
+						{
+							"name": "name",
+							"input": new lib_plankton.zoo_input.class_input_text(
+							),
+							"label": lib_plankton.translate.get("event.name")
+						},
+						{
+							"name": "begin",
+							"input": _dali.helpers.datetime_input(),
+							"label": lib_plankton.translate.get("event.begin")
+						},
+						{
+							"name": "end",
+							"input": new lib_plankton.zoo_input.class_input_soft<lib_plankton.pit.type_datetime>(
+								_dali.helpers.datetime_input()
+							),
+							"label": lib_plankton.translate.get("event.end")
+						},
+						{
+							"name": "location",
+							"input": new lib_plankton.zoo_input.class_input_soft<string>(
+								new lib_plankton.zoo_input.class_input_text(
+								)
+							),
+							"label": lib_plankton.translate.get("event.location")
+						},
+						{
+							"name": "link",
+							"input": new lib_plankton.zoo_input.class_input_soft<string>(
+								new lib_plankton.zoo_input.class_input_text(
+								)
+							),
+							"label": lib_plankton.translate.get("event.link")
+						},
+						{
+							"name": "description",
+							"input": new lib_plankton.zoo_input.class_input_soft<string>(
+								new lib_plankton.zoo_input.class_input_textarea(
+								)
+							),
+							"label": lib_plankton.translate.get("event.description")
+						},
+					]
+				),
+				(
+					read_only
+					?
+					[
+					]
+					:
+					[
+						{
+							"label": lib_plankton.translate.get("page.event_edit.actions.change"),
+							"target": "submit",
+							"procedure": async (get_value, get_representation) => {
+								const value : any = await get_value();
+								try {
+									await _dali.backend.calendar_event_change(
+										calendar_id,
+										event_id,
+										value
+									);
+									lib_plankton.zoo_page.set(
+										{
+											"name": "overview",
+											"parameters": {}
+										}
+									);
+								}
+								catch (error) {
+									lib_plankton.log.warning("page_event_edit_error", {"error": String(error)});
+									// do nothing
+									/*
+									lib_plankton.zoo_page.set(
+										{
+											"name": "event_add",
+											"parameters": {
+											}
+										}
+									);
+									 */
+								}
+							}
+						},
+						{
+							"label": lib_plankton.translate.get("page.event_edit.actions.remove"),
+							"target": "submit",
+							"procedure": async (get_value, get_representation) => {
+								try {
+									await _dali.backend.calendar_event_remove(
+										calendar_id,
+										event_id
+									);
+									lib_plankton.zoo_page.set(
+										{
+											"name": "overview",
+											"parameters": {}
+										}
+									);
+								}
+								catch (error) {
+									lib_plankton.log.warning("page_event_edit_error", {"error": String(error)});
+									// do nothing
+									/*
+									lib_plankton.zoo_page.set(
+										{
+											"name": "event_add",
+											"parameters": {
+											}
+										}
+									);
+									 */
+								}
+							}
+						},
+					]
+				)
+			);
+			await form.setup(document.querySelector("#event_edit_form"));
+			const event_object : _dali.type.event_object = await _dali.backend.calendar_event_get(
+				calendar_id,
+				event_id
+			);
+			await form.input_write(
+				event_object
+			);
+			return Promise.resolve<void>(undefined);
+		}
+	);
+	
+}

source/pages/event_edit/templates/default.html.tpl

@@ -0,0 +1,5 @@
+<div id="event_edit">
+	<h2>{{label}}</h2>
+	<div id="event_edit_form">
+	</div>
+</div>

source/pages/overview/logic.ts

@@ -17,13 +17,6 @@ namespace _dali.pages.overview
 				target_element.querySelector("#overview").classList.toggle("overview-compact", compact);
 			};
 			
-			/**
-			 * @todo geschickter bauen (MVC, MVVM, …)
-			 */
-			const update = () => {
-				lib_plankton.zoo_page.reload();
-			};
-			
 			// exec
 			target_element.innerHTML = await _dali.helpers.template_coin(
 				"overview",
@@ -34,7 +27,7 @@ namespace _dali.pages.overview
 			
 			// mode switcher
 			{
-				const widget_mode_switcher : lib_plankton.zoo_widget.interface_widget = new _dali.widgets.mode_switcher.class_widget_mode_switcher(
+				const widget_mode_switcher : _dali.class_widget = new _dali.widgets.mode_switcher.class_widget_mode_switcher(
 					[
 						{
 							"mode": _dali.type.enum_view_mode.week,
@@ -92,7 +85,6 @@ namespace _dali.pages.overview
 					data,
 					{
 						"action_open": (entry) => {
-							let read_only : boolean;
 							switch (entry.access_level)
 							{
 								case _dali.type.enum_access_level.none:
@@ -103,60 +95,31 @@ namespace _dali.pages.overview
 								case _dali.type.enum_access_level.edit:
 								case _dali.type.enum_access_level.view:
 								{
-									read_only = true;
+									lib_plankton.zoo_page.set(
+										{
+											"name": "calendar_edit",
+											"parameters": {
+												"read_only": "yes",
+												"calendar_id": entry.id,
+											}
+										}
+									);
 									break;
 								}
 								case _dali.type.enum_access_level.admin:
 								{
-									read_only = false;
+									lib_plankton.zoo_page.set(
+										{
+											"name": "calendar_edit",
+											"parameters": {
+												"read_only": "no",
+												"calendar_id": entry.id,
+											}
+										}
+									);
 									break;
 								}			
 							}
-							(async () => {
-								const calendar_id : _dali.type.calendar_id = entry.id;
-								const calendar_object : _dali.type.calendar_object = await _dali.backend.calendar_get(
-									calendar_id
-								);
-								const widget = new _dali.widgets.calendar_edit.class_widget_calendar_edit(
-									{
-										"read_only": read_only,
-										"action_cancel": () => {
-											_dali.overlay.toggle({"mode": false});
-										},
-										"action_change": (data) => {
-											_dali.backend.calendar_change(
-												calendar_id,
-												data
-											)
-											.then(
-												() => {
-													update();
-													_dali.overlay.toggle({"mode": false});
-												}
-											);
-										},
-										"action_remove": (data) => {
-											_dali.backend.calendar_remove(
-												calendar_id
-											)
-											.then(
-												() => {
-													update();
-													_dali.overlay.toggle({"mode": false});
-												}
-											);
-										},
-										"initial_value": {
-											"name": calendar_object.name,
-											"hue": calendar_object.hue,
-											"access": calendar_object.access,
-										},
-									}
-								);
-								_dali.overlay.clear();
-								_dali.overlay.toggle({"mode": true});
-								await widget.load(_dali.overlay.get_content_element());
-							}) ();
 						},
 						"action_toggle_visibility": (entry) => {
 							widget_weekview.toggle_visibility(entry.id);
@@ -176,7 +139,6 @@ namespace _dali.pages.overview
 					}
 				);
 				const action_select_event = (calendar_id, access_level, event_id) => {
-					let read_only : boolean;
 					switch (access_level)
 					{
 						case _dali.type.enum_access_level.none:
@@ -186,90 +148,34 @@ namespace _dali.pages.overview
 						}
 						case _dali.type.enum_access_level.view:
 						{
-							read_only = true;
+							lib_plankton.zoo_page.set(
+								{
+									"name": "event_edit",
+									"parameters": {
+										"read_only": "yes",
+										"calendar_id": calendar_id,
+										"event_id": event_id,
+									}
+								}
+							);
 							break;
 						}
 						case _dali.type.enum_access_level.edit:
 						case _dali.type.enum_access_level.admin:
 						{
-							read_only = false;
+							lib_plankton.zoo_page.set(
+								{
+									"name": "event_edit",
+									"parameters": {
+										"read_only": "no",
+										"calendar_id": calendar_id,
+										"event_id": event_id,
+									}
+								}
+							);
 							break;
 						}
 					}
-					(async () => {
-						const event_object : _dali.type.event_object = await _dali.backend.calendar_event_get(
-							calendar_id,
-							event_id
-						);
-						const widget = new _dali.widgets.event_edit.class_widget_event_edit(
-							{
-								"calendar_id": calendar_id,
-								"event_name": event_object.name,
-								"event_begin": event_object.begin,
-								"event_end": event_object.end,
-								"event_location": event_object.location,
-								"event_link": event_object.link,
-								"event_description": event_object.description,
-							},
-							{
-								"read_only": read_only,
-								"action_cancel": () => {
-									_dali.overlay.toggle({"mode": false});
-								},
-								"action_change": (data) => {
-									_dali.backend.calendar_event_change(
-										calendar_id,
-										event_id,
-										{
-											"name": data.event_name,
-											"begin": data.event_begin,
-											"end": data.event_end,
-											"location": data.event_location,
-											"link": data.event_link,
-											"description": data.event_description,
-										}
-									)
-									.then(
-										() => {
-											update();
-											_dali.overlay.toggle({"mode": false});
-										}
-									)
-									.catch(
-										(reason) => {
-											lib_plankton.log.warning(
-												"dali.overview.event_change.error",
-												{"details": String(reason)}
-											);
-										}
-									);
-								},
-								"action_remove": () => {
-									_dali.backend.calendar_event_remove(
-										calendar_id,
-										event_id
-									)
-									.then(
-										() => {
-											update();
-											_dali.overlay.toggle({"mode": false});
-										}
-									)
-									.catch(
-										(reason) => {
-											lib_plankton.log.warning(
-												"dali.overview.event_remove_error",
-												{"details": String(reason)}
-											);
-										}
-									);
-								},
-							}
-						);
-						_dali.overlay.clear();
-						_dali.overlay.toggle({"mode": true});
-						await widget.load(_dali.overlay.get_content_element());
-					}) ();
 				};
 				// listview
 				{
@@ -304,76 +210,17 @@ namespace _dali.pages.overview
 							{
 								"action_select_event": action_select_event,
 								"action_select_day": (date) => {
-									(async () => {
+									lib_plankton.zoo_page.set(
-										const widget = new _dali.widgets.event_edit.class_widget_event_edit(
+										{
-											{
+											"name": "event_add",
+											"parameters": {
 												"calendar_id": null,
-												"event_name": "",
+												"year": date.year,
-												"event_begin": lib_plankton.call.convey(
+												"month": date.month,
-													date,
+												"day": date.day,
-													[
-														x => ({
-															"timezone_shift": 0,
-															"date": date,
-															"time": {"hour": 12, "minute": 0, "second": 0}
-														}),
-														lib_plankton.pit.from_datetime,
-														x => lib_plankton.pit.shift_hour(x, 0),
-														lib_plankton.pit.to_datetime,
-													]
-												),
-												"event_end": lib_plankton.call.convey(
-													date,
-													[
-														x => ({
-															"timezone_shift": 0,
-															"date": date,
-															"time": {"hour": 12, "minute": 0, "second": 0}
-														}),
-														lib_plankton.pit.from_datetime,
-														x => lib_plankton.pit.shift_hour(x, +1),
-														lib_plankton.pit.to_datetime,
-													]
-												),
-												"event_location": null,
-												"event_link": null,
-												"event_description": null,
-											},
-											{
-												"read_only": false,
-												"action_cancel": () => {
-													_dali.overlay.toggle({"mode": false});
-												},
-												"action_add": (data) => {
-													_dali.backend.calendar_event_add(
-														data.calendar_id,
-														{
-															"name": data.event_name,
-															"begin": data.event_begin,
-															"end": data.event_end,
-															"location": data.event_location,
-															"link": data.event_link,
-															"description": data.event_description,
-														}
-													)
-													.then(
-														() => {
-															update();
-															_dali.overlay.toggle({"mode": false});
-														}
-													)
-													.catch(
-														(reason) => {
-															// todo
-														}
-													);
-												},
 											}
-										);
+										}
-										_dali.overlay.clear();
+									);
-										_dali.overlay.toggle({"mode": true});
-										await widget.load(_dali.overlay.get_content_element());
-									}) ();
 								},
 							}
 						)

source/resources/backend.ts

@@ -547,7 +547,6 @@ namespace _dali.backend
 	
 	
 	/**
-	 * @todo Möglichkeit den Kalender zu ändern
 	 */
 	export async function calendar_event_change(
 		calendar_id : _dali.type.calendar_id,

source/style/main.css

@@ -20,39 +20,6 @@ header
 	margin-bottom: 16px;
 }
 
-#overlay
-{
-	position: fixed;
-	width: 100%;
-	height: 100%;
-	top: 0;
-	left: 0;
-	right: 0;
-	bottom: 0;
-	background-color: rgba(0, 0, 0, 0.75);
-	z-index: 2;
-}
-
-#overlay_content
-{
-	position: absolute;
-	top: 50%;
-	left: 50%;
-	
-	transform: translate(-50%,-50%);
-	-ms-transform: translate(-50%,-50%);
-	
-	padding: 32px;
-	
-	background-color: hsl(0, 0%, 12.5%);
-	color: hsl(0, 0%, 100%);
-}
-
-#overlay:not(.overlay_active)
-{
-	display: none;
-}
-
 nav > ul
 {
 	list-style-type: none;

source/widgets/calendar_edit/logic.ts

@@ -1,217 +0,0 @@
-namespace _dali.widgets.calendar_edit
-{
-	
-	/**
-	 */
-	export type type_value = {
-		name : string;
-		hue : float;
-		access : {
-			public : boolean;
-			default_level : _dali.type.enum_access_level;
-			attributed : lib_plankton.map.type_map<
-				_dali.type.user_id,
-				_dali.type.enum_access_level
-			>;
-		};
-	};
-	
-	
-	/**
-	 */
-	export class class_widget_calendar_edit
-		implements lib_plankton.zoo_widget.interface_widget
-	{
-		
-		/**
-		 */
-		private read_only : boolean;
-		
-		
-		/**
-		 */
-		private action_cancel ?: (null | (() => void));
-		
-		
-		/**
-		 */
-		private action_change ?: (null | ((value : type_value) => void));
-		
-		
-		/**
-		 */
-		private action_remove ?: (null | ((value : type_value) => void));
-		
-		
-		/**
-		 */
-		private initial_value : (null | type_value);
-		
-		
-		/**
-		 */
-		public constructor(
-			{
-				"read_only": read_only = false,
-				"action_cancel": action_cancel = null,
-				"action_change": action_change = null,
-				"action_remove": action_remove = null,
-				"initial_value": initial_value = null,
-			}
-			:
-			{
-				read_only ?: boolean;
-				action_cancel ?: (null | (() => void));
-				action_change ?: (null | ((value : type_value) => void));
-				action_remove ?: (null | ((value : type_value) => void));
-				initial_value ?: (null | type_value);
-			}
-			=
-			{
-			}
-		)
-		{
-			this.read_only = read_only;
-			this.action_cancel = action_cancel;
-			this.action_change = action_change;
-			this.action_remove = action_remove;
-			this.initial_value = initial_value;
-		}
-		
-		
-		/**
-		 * [implementation]
-		 */
-		public async load(
-			target_element : HTMLElement
-		) : Promise<void>
-		{
-			const form : lib_plankton.zoo_form.class_form<
-				type_value,
-				type_value
-			> = new lib_plankton.zoo_form.class_form<
-				type_value,
-				type_value
-			>(
-				(value) => value,
-				(raw) => raw,
-				new lib_plankton.zoo_input.class_input_group<any>(
-					[
-						{
-							"name": "name",
-							"input": new lib_plankton.zoo_input.class_input_text(),
-							"label": lib_plankton.translate.get("calendar.name")
-						},
-						{
-							"name": "hue",
-							"input": new lib_plankton.zoo_input.class_input_hue(
-							),
-							"label": lib_plankton.translate.get("calendar.hue"),
-						},
-						{
-							"name": "access",
-							"input": new lib_plankton.zoo_input.class_input_group(
-								[
-									{
-										"name": "public",
-										"input": new lib_plankton.zoo_input.class_input_checkbox(),
-										"label": lib_plankton.translate.get("calendar.access.public"),
-									},
-									{
-										"name": "default_level",
-										"input": _dali.helpers.input_access_level(),
-										"label": lib_plankton.translate.get("calendar.access.default_level"),
-									},
-									{
-										"name": "attributed",
-										"input": await _dali.helpers.input_attributed_access(),
-										"label": lib_plankton.translate.get("calendar.access.attributed"),
-									},
-								]
-							),
-							"label": lib_plankton.translate.get("calendar.access.access"),
-						},
-					]
-				),
-				(
-					[]
-					// cancel
-					.concat(
-						(! (this.action_cancel === null))
-						?
-						[
-							{
-								"label": lib_plankton.translate.get("common.cancel"),
-								"procedure": async () => {
-									this.action_cancel();
-								}
-							},
-						]
-						:
-						[]
-					)
-					// change
-					.concat(
-						((! this.read_only) && (! (this.action_change === null)))
-						?
-						[
-							{
-								"label": lib_plankton.translate.get("widget.calendar_edit.actions.change"),
-								"procedure": async (get_value, get_representation) => {
-									const value : type_value = await get_value();
-									this.action_change(value);
-								}
-							},
-						]
-						:
-						[]
-					)
-					// remove
-					.concat(
-						((! this.read_only) && (! (this.action_change === null)))
-						?
-						[
-							{
-								"label": lib_plankton.translate.get("widget.calendar_edit.actions.remove"),
-								"procedure": async (get_value, get_representation) => {
-									const value : type_value = await get_value();
-									this.action_remove(value);
-								}
-							},
-						]
-						:
-						[]
-					)
-				)
-			);
-			await form.setup(target_element);
-			await form.input_write(
-				(! (this.initial_value === null))
-				?
-				this.initial_value
-				:
-				{
-					"name": "",
-					"hue": lib_plankton.random.generate_unit(),
-					"access": {
-						"public": false,
-						"default_level": _dali.type.enum_access_level.view,
-						"attributed": lib_plankton.map.hashmap.implementation_map<
-							_dali.type.user_id,
-							_dali.type.enum_access_level
-						>(
-							lib_plankton.map.hashmap.make<
-								_dali.type.user_id,
-								_dali.type.enum_access_level
-							>(
-								user_id => user_id.toFixed(0),
-							)
-						),
-					},
-				}
-			);
-		}
-		
-	}
-	
-}

source/widgets/event_edit/logic.ts

@@ -1,282 +0,0 @@
-namespace _dali.widgets.event_edit
-{
-	
-	/**
-	 */
-	export type type_value = {
-		calendar_id : (null | _dali.type.calendar_id);
-		event_name : string;
-		event_begin : lib_plankton.pit.type_datetime;
-		event_end : (null | lib_plankton.pit.type_datetime);
-		event_location : (null | string);
-		event_link : (null | string);
-		event_description : (null | string);
-	};
-	
-	
-	/**
-	 */
-	export type type_representation = {
-		calendar_id : string;
-		event_name : string;
-		event_begin : lib_plankton.pit.type_datetime;
-		event_end : (null | lib_plankton.pit.type_datetime);
-		event_location : (null | string);
-		event_link : (null | string);
-		event_description : (null | string);
-	};
-	
-	
-	/**
-	 */
-	export class class_widget_event_edit
-		implements lib_plankton.zoo_widget.interface_widget
-	{
-		
-		/**
-		 */
-		private read_only : boolean;
-		
-		
-		/**
-		 */
-		private action_cancel ?: (null | (() => void));
-		
-		
-		/**
-		 */
-		private action_add ?: (null | ((value : type_value) => void));
-		
-		
-		/**
-		 */
-		private action_change ?: (null | ((value : type_value) => void));
-		
-		
-		/**
-		 */
-		private action_remove ?: (null | ((value : type_value) => void));
-		
-		
-		/**
-		 */
-		private initial_value : type_value;
-		
-		
-		/**
-		 */
-		public constructor(
-			initial_value : type_value,
-			{
-				"read_only": read_only = false,
-				"action_cancel": action_cancel = null,
-				"action_add": action_add = null,
-				"action_change": action_change = null,
-				"action_remove": action_remove = null,
-			}
-			:
-			{
-				read_only ?: boolean;
-				action_cancel ?: (null | (() => void));
-				action_add ?: (null | ((value : type_value) => void));
-				action_change ?: (null | ((value : type_value) => void));
-				action_remove ?: (null | ((value : type_value) => void));
-			}
-			=
-			{
-			}
-		)
-		{
-			this.read_only = read_only;
-			this.action_cancel = action_cancel;
-			this.action_add = action_add;
-			this.action_change = action_change;
-			this.action_remove = action_remove;
-			this.initial_value = initial_value;
-		}
-		
-		
-		/**
-		 * [implementation]
-		 */
-		public async load(
-			target_element : HTMLElement
-		) : Promise<void>
-		{
-			const available_calendars : Array<
-				{
-					id : int;
-					name : string;
-					hue : float;
-					access_level : _dali.type.enum_access_level;
-				}
-			> = (
-				(await _dali.backend.calendar_list())
-				.filter(
-					(entry) => (
-						(entry.access_level === _dali.type.enum_access_level.edit)
-						||
-						(entry.access_level === _dali.type.enum_access_level.admin)
-					)
-				)
-			);
-			const form : lib_plankton.zoo_form.class_form<
-				type_value,
-				type_representation
-			> = new lib_plankton.zoo_form.class_form<
-				type_value,
-				type_representation
-			>(
-				(value) => ({
-					"calendar_id": (value.calendar_id ?? available_calendars[0].id).toFixed(0),
-					"event_name": value.event_name,
-					"event_begin": value.event_begin,
-					"event_end": value.event_end,
-					"event_location": value.event_location,
-					"event_link": value.event_link,
-					"event_description": value.event_description,
-				}),
-				(representation) => ({
-					"calendar_id": parseInt(representation.calendar_id),
-					"event_name": representation.event_name,
-					"event_begin": representation.event_begin,
-					"event_end": representation.event_end,
-					"event_location": representation.event_location,
-					"event_link": representation.event_link,
-					"event_description": representation.event_description,
-				}),
-				new lib_plankton.zoo_input.class_input_group<any>(
-					[
-						{
-							"name": "calendar_id",
-							"input": new lib_plankton.zoo_input.class_input_selection(
-								(
-									available_calendars
-									.map(
-										(entry) => ({
-											"value": entry.id.toFixed(0),
-											"label": entry.name,
-										})
-									)
-								)
-							),
-							"label": lib_plankton.translate.get("calendar.calendar")
-						},
-						{
-							"name": "event_name",
-							"input": new lib_plankton.zoo_input.class_input_text(
-							),
-							"label": lib_plankton.translate.get("event.name")
-						},
-						{
-							"name": "event_begin",
-							"input": _dali.helpers.datetime_input(),
-							"label": lib_plankton.translate.get("event.begin")
-						},
-						{
-							"name": "event_end",
-							"input": new lib_plankton.zoo_input.class_input_soft<lib_plankton.pit.type_datetime>(
-								_dali.helpers.datetime_input()
-							),
-							"label": lib_plankton.translate.get("event.end")
-						},
-						{
-							"name": "event_location",
-							"input": new lib_plankton.zoo_input.class_input_soft<string>(
-								new lib_plankton.zoo_input.class_input_text(
-								)
-							),
-							"label": lib_plankton.translate.get("event.location")
-						},
-						{
-							"name": "event_link",
-							"input": new lib_plankton.zoo_input.class_input_soft<string>(
-								new lib_plankton.zoo_input.class_input_text(
-								)
-							),
-							"label": lib_plankton.translate.get("event.link")
-						},
-						{
-							"name": "event_description",
-							"input": new lib_plankton.zoo_input.class_input_soft<string>(
-								new lib_plankton.zoo_input.class_input_textarea(
-								)
-							),
-							"label": lib_plankton.translate.get("event.description")
-						},
-					]
-				),
-				(
-					[]
-					// cancel
-					.concat(
-						(! (this.action_cancel === null))
-						?
-						[
-							{
-								"label": lib_plankton.translate.get("common.cancel"),
-								"procedure": async () => {
-									this.action_cancel();
-								}
-							},
-						]
-						:
-						[]
-					)
-					// add
-					.concat(
-						((! this.read_only) && (! (this.action_add === null)))
-						?
-						[
-							{
-								"label": lib_plankton.translate.get("widget.event_edit.actions.add"),
-								"procedure": async (get_value, get_representation) => {
-									const value : type_value = await get_value();
-									this.action_add(value);
-								}
-							},
-						]
-						:
-						[]
-					)
-					// change
-					.concat(
-						((! this.read_only) && (! (this.action_change === null)))
-						?
-						[
-							{
-								"label": lib_plankton.translate.get("widget.event_edit.actions.change"),
-								"procedure": async (get_value, get_representation) => {
-									const value : type_value = await get_value();
-									this.action_change(value);
-								}
-							},
-						]
-						:
-						[]
-					)
-					// remove
-					.concat(
-						((! this.read_only) && (! (this.action_change === null)))
-						?
-						[
-							{
-								"label": lib_plankton.translate.get("widget.event_edit.actions.remove"),
-								"procedure": async (get_value, get_representation) => {
-									const value : type_value = await get_value();
-									this.action_remove(value);
-								}
-							},
-						]
-						:
-						[]
-					)
-				)
-			);
-			await form.setup(target_element);
-			await form.input_write(this.initial_value);
-		}
-		
-	}
-	
-}

source/widgets/listview/logic.ts

@@ -28,7 +28,7 @@ namespace _dali.widgets.listview
 	
 	/**
 	 */
-	export class class_widget_listview implements lib_plankton.zoo_widget.interface_widget
+	export class class_widget_listview extends _dali.class_widget
 	{
 		
 		/**
@@ -94,6 +94,7 @@ namespace _dali.widgets.listview
 				},
 				options
 			);
+			super();
 			this.get_entries = get_entries;
 			this.container = null;
 			this.action_select_event = options.action_select_event;

source/widgets/mode_switcher/logic.ts

@@ -11,7 +11,7 @@ namespace _dali.widgets.mode_switcher
 	
 	/**
 	 */
-	export class class_widget_mode_switcher implements lib_plankton.zoo_widget.interface_widget
+	export class class_widget_mode_switcher extends _dali.class_widget
 	{
 		
 		/**
@@ -47,6 +47,7 @@ namespace _dali.widgets.mode_switcher
 			}
 		)
 		{
+			super();
 			this.options = options;
 			this.initial_selection = initial_selection;
 			this.action_change = action_change;

source/widgets/sources/logic.ts

@@ -13,7 +13,7 @@ namespace _dali.widgets.sources
 	
 	/**
 	 */
-	export class class_widget_sources implements lib_plankton.zoo_widget.interface_widget
+	export class class_widget_sources extends _dali.class_widget
 	{
 		
 		/**
@@ -53,6 +53,7 @@ namespace _dali.widgets.sources
 				},
 				options
 			);
+			super();
 			this.keys = [];
 			this.data = {};
 			entries.forEach(

source/widgets/weekview/logic.ts

@@ -28,7 +28,7 @@ namespace _dali.widgets.weekview
 	
 	/**
 	 */
-	export class class_widget_weekview implements lib_plankton.zoo_widget.interface_widget
+	export class class_widget_weekview extends _dali.class_widget
 	{
 		
 		/**
@@ -96,6 +96,7 @@ namespace _dali.widgets.weekview
 				},
 				options
 			);
+			super();
 			this.get_entries = get_entries;
 			this.container = null;
 			this.action_select_day = options.action_select_day;
@@ -833,26 +834,6 @@ namespace _dali.widgets.weekview
 		}
 		
 		
-		/**
-		 */
-		private react_on_control_change(
-			dom_context : Element
-		) : void
-		{
-			const year : int = parseInt((dom_context.querySelector(".weekview-control-year > input") as HTMLInputElement).value);
-			const week : int = parseInt((dom_context.querySelector(".weekview-control-week > input") as HTMLInputElement).value);
-			const count : int = parseInt((dom_context.querySelector(".weekview-control-count > input") as HTMLInputElement).value);
-			this.update(
-				year,
-				week,
-				count,
-				{
-					"update_controls": false,
-				}
-			);
-		}
-		
-		
 		/**
 		 */
 		public toggle_visibility(
@@ -906,28 +887,19 @@ namespace _dali.widgets.weekview
 					"click",
 					(event) => {
 						event.preventDefault();
-						this.react_on_control_change(target_element);
+						const year : int = parseInt((target_element.querySelector(".weekview-control-year > input") as HTMLInputElement).value);
+						const week : int = parseInt((target_element.querySelector(".weekview-control-week > input") as HTMLInputElement).value);
+						const count : int = parseInt((target_element.querySelector(".weekview-control-count > input") as HTMLInputElement).value);
+						this.update(
+							year,
+							week,
+							count,
+							{
+								"update_controls": false,
+							}
+						);
 					}
 				);
-				if (false)
-				{
-					[
-						"year",
-						"week",
-						"count",
-					].forEach(
-						(name) => {
-							const selector : string = (".weekview-control-" + name + " > input");
-							(target_element.querySelector(selector) as HTMLInputElement).addEventListener(
-								"change",
-								(event) => {
-									event.preventDefault();
-									this.react_on_control_change(target_element);
-								}
-							);
-						}
-					);
-				}
 			}
 			// table
 			{

tools/makefile

@@ -36,11 +36,11 @@ templates: \
 		templates-widgets-listview \
 		templates-widgets-weekview \
 		templates-widgets-mode_switcher \
-		templates-widgets-calendar_edit \
-		templates-widgets-event_edit \
 		templates-pages-caldav \
 		templates-pages-calendar_add \
 		templates-pages-calendar_edit \
+		templates-pages-event_add \
+		templates-pages-event_edit \
 		templates-pages-overview \
 		templates-pages-login
 
@@ -72,20 +72,6 @@ templates-widgets-mode_switcher: \
 	@ ${cmd_mkdir} ${dir_build}/templates/widget-mode_switcher
 	@ ${cmd_cp} -r -u -v ${dir_source}/widgets/mode_switcher/templates/* ${dir_build}/templates/widget-mode_switcher/
 
-.PHONY: templates-widgets-calendar_edit
-templates-widgets-calendar_edit: \
-		$(wildcard ${dir_source}/widgets/calendar_edit/templates/*)
-	@ ${cmd_log} "templates:widgets:calendar_edit …"
-	@ ${cmd_mkdir} ${dir_build}/templates/widget-calendar_edit
-	# @ ${cmd_cp} -r -u -v ${dir_source}/widgets/calendar_edit/templates/* ${dir_build}/templates/widget-calendar_edit/
-
-.PHONY: templates-widgets-event_edit
-templates-widgets-event_edit: \
-		$(wildcard ${dir_source}/pages/event_edit/templates/*)
-	@ ${cmd_log} "templates:widgets:event_edit …"
-	@ ${cmd_mkdir} ${dir_build}/templates/widget-event_edit
-	# @ ${cmd_cp} -r -u -v ${dir_source}/pages/event_edit/templates/* ${dir_build}/templates/widget-uevent_edit/
-
 .PHONY: templates-pages-caldav
 templates-pages-caldav: \
 		$(wildcard ${dir_source}/pages/caldav/templates/*)
@@ -107,6 +93,20 @@ templates-pages-calendar_edit: \
 	@ ${cmd_mkdir} ${dir_build}/templates/calendar_edit
 	@ ${cmd_cp} -r -u -v ${dir_source}/pages/calendar_edit/templates/* ${dir_build}/templates/calendar_edit/
 
+.PHONY: templates-pages-event_add
+templates-pages-event_add: \
+		$(wildcard ${dir_source}/pages/event_add/templates/*)
+	@ ${cmd_log} "templates:event_add …"
+	@ ${cmd_mkdir} ${dir_build}/templates/event_add
+	@ ${cmd_cp} -r -u -v ${dir_source}/pages/event_add/templates/* ${dir_build}/templates/event_add/
+
+.PHONY: templates-pages-event_edit
+templates-pages-event_edit: \
+		$(wildcard ${dir_source}/pages/event_edit/templates/*)
+	@ ${cmd_log} "templates:event_edit …"
+	@ ${cmd_mkdir} ${dir_build}/templates/event_edit
+	@ ${cmd_cp} -r -u -v ${dir_source}/pages/event_edit/templates/* ${dir_build}/templates/event_edit/
+
 .PHONY: templates-pages-overview
 templates-pages-overview: \
 		$(wildcard ${dir_source}/pages/overview/templates/*)
@@ -134,6 +134,7 @@ logic: ${dir_build}/logic.js
 ${dir_temp}/logic-unlinked.js: \
 		${dir_lib}/plankton/plankton.d.ts \
 		${dir_source}/base/helpers.ts \
+		${dir_source}/base/widget.ts \
 		${dir_source}/base/types.ts \
 		${dir_source}/base/functions.ts \
 		${dir_source}/resources/conf.ts \
@@ -142,15 +143,14 @@ ${dir_temp}/logic-unlinked.js: \
 		${dir_source}/widgets/listview/logic.ts \
 		${dir_source}/widgets/weekview/logic.ts \
 		${dir_source}/widgets/mode_switcher/logic.ts \
-		${dir_source}/widgets/calendar_edit/logic.ts \
-		${dir_source}/widgets/event_edit/logic.ts \
-		${dir_source}/overlay.ts \
 		${dir_source}/pages/login/logic.ts \
 		${dir_source}/pages/logout/logic.ts \
 		${dir_source}/pages/caldav/logic.ts \
 		${dir_source}/pages/oidc_finish/logic.ts \
 		${dir_source}/pages/calendar_add/logic.ts \
 		${dir_source}/pages/calendar_edit/logic.ts \
+		${dir_source}/pages/event_add/logic.ts \
+		${dir_source}/pages/event_edit/logic.ts \
 		${dir_source}/pages/overview/logic.ts \
 		${dir_source}/main.ts
 	@ ${cmd_log} "logic | compile …"

tools/update-plankton

@@ -23,7 +23,6 @@ modules="${modules} url"
 modules="${modules} pit"
 modules="${modules} www_form"
 modules="${modules} translate"
-modules="${modules} zoo-widget"
 modules="${modules} zoo-page"
 modules="${modules} zoo-form"
 modules="${modules} zoo-input"