diff --git a/source/style/widget-menu.css b/source/style/widget-menu.css index d8b4b40..ab45279 100644 --- a/source/style/widget-menu.css +++ b/source/style/widget-menu.css @@ -35,8 +35,8 @@ .widget-menu-platform:not(.widget-menu-platform-collapsed) { position: fixed; - top: 32px; - right: 32px; + top: 50px; + right: 20px; z-index: 2; } @@ -49,8 +49,7 @@ .widget-menu-entry { - margin: 12px 16px; - padding: 8px; + margin: 8px; text-transform: capitalize; } @@ -60,9 +59,9 @@ color: hsl(var(--hue), 0%, 100%); } -.widget-menu-entry:hover::after +.widget-menu-entry:hover::before { - content: " «"; + content: "» "; /* background-color: hsl(var(--hue), 0%, 50%); color: hsl(var(--hue), 0%, 100%); diff --git a/source/widgets/weekview/logic.ts b/source/widgets/weekview/logic.ts index 1d20719..db14f2a 100644 --- a/source/widgets/weekview/logic.ts +++ b/source/widgets/weekview/logic.ts @@ -62,6 +62,12 @@ namespace _dali.widgets.weekview ); + /** + * [state] + */ + private vertical : boolean; + + /** * [state] */ @@ -105,6 +111,7 @@ namespace _dali.widgets.weekview { "action_select_day": action_select_day = ((date) => {}), "action_select_event": action_select_event = ((event_key) => {}), + "vertical": vertical = false, "initial_year": initial_year = null, "initial_week": initial_week = null, "initial_count": initial_count = 5, @@ -596,6 +603,13 @@ namespace _dali.widgets.weekview const context : Element = this.container; // structure { + type type_row_data = Array< + { + week : int; + day_pits : Array; + } + >; + /** * @todo als Variable? */ @@ -603,52 +617,67 @@ namespace _dali.widgets.weekview const now_pit : lib_plankton.pit.type_pit = lib_plankton.pit.now(); const today_begin_pit : lib_plankton.pit.type_pit = lib_plankton.pit.trunc_day(now_pit); const today_end_pit : lib_plankton.pit.type_pit = lib_plankton.pit.shift_day(today_begin_pit, 1); - const row_data : Array< - { - week : int; - data : Array< - { - pit : lib_plankton.pit.type_pit; - today : boolean; - } - >; - } - > = ( + const row_data_original : type_row_data = ( lib_plankton.list.sequence(this.count) .map( offset => { const week : int = (this.week + offset); return { "week": week, - "data": ( + "day_pits": ( lib_plankton.list.sequence(7) .map( - day => { - const day_pit : lib_plankton.pit.type_pit = lib_plankton.pit.from_ywd( - { - "year": this.year, - "week": week, - "day": (day + 1), - }, - { - "timezone_shift": timezone_shift, - } - ); - return { - "pit": day_pit, - "today": lib_plankton.pit.is_between( - day_pit, - today_begin_pit, - today_end_pit - ), - }; - } + day => lib_plankton.pit.from_ywd( + { + "year": this.year, + "week": week, + "day": (1 + day), + }, + { + "timezone_shift": timezone_shift, + } + ) ) ), }; } ) ); + const row_data_alternative : type_row_data = ( + lib_plankton.list.sequence(7) + .map( + day_of_week => { + return { + /*"day_of_week"*/"week": day_of_week, + /*"week_pits"*/"day_pits": ( + lib_plankton.list.sequence(this.count) + .map( + offset => { + const week : int = (this.week + offset); + return lib_plankton.pit.from_ywd( + { + "year": this.year, + "week": week, + "day": (1 + day_of_week), + }, + { + "timezone_shift": timezone_shift, + } + ); + } + ) + ) + }; + } + ) + ); + const row_data : type_row_data = ( + false + ? + row_data_original + : + row_data_alternative + ); context.querySelector(".weekview-table tbody").innerHTML = ( await _dali.helpers.promise_row( row_data @@ -660,62 +689,69 @@ namespace _dali.widgets.weekview "week": row.week.toFixed(0).padStart(2, "0"), "cells": ( await _dali.helpers.promise_row( - row.data + row.day_pits .map( - (cell) => async () => _dali.helpers.template_coin( - "widget-weekview", - "tableview-cell", - { - "extra_classes": ( - [""] - .concat(cell.today ? ["weekview-cell-today"] : []) - .join(" ") - ), - "title": lib_plankton.call.convey( - cell.pit, - [ - lib_plankton.pit.to_datetime_ce, - (x : lib_plankton.pit.type_datetime) => lib_plankton.string.coin( - "{{year}}-{{month}}-{{day}}", - { - "year": x.date.year.toFixed(0).padStart(4, "0"), - "month": x.date.month.toFixed(0).padStart(2, "0"), - "day": x.date.day.toFixed(0).padStart(2, "0"), - } - ), - ] - ), - "day": lib_plankton.call.convey( - cell.pit, - [ - lib_plankton.pit.to_datetime_ce, - (x : lib_plankton.pit.type_datetime) => lib_plankton.string.coin( - "{{day}}", - { - "year": x.date.year.toFixed(0).padStart(4, "0"), - "month": x.date.month.toFixed(0).padStart(2, "0"), - "day": x.date.day.toFixed(0).padStart(2, "0"), - } - ), - ] - ), - "rel": lib_plankton.call.convey( - cell.pit, - [ - lib_plankton.pit.to_datetime_ce, - (x : lib_plankton.pit.type_datetime) => lib_plankton.string.coin( - "{{year}}-{{month}}-{{day}}", - { - "year": x.date.year.toFixed(0).padStart(4, "0"), - "month": x.date.month.toFixed(0).padStart(2, "0"), - "day": x.date.day.toFixed(0).padStart(2, "0"), - } - ) - ] - ), - "entries": "" - } - ) + (day_pit) => async () => { + const is_today : boolean = lib_plankton.pit.is_between( + day_pit, + today_begin_pit, + today_end_pit + ); + return _dali.helpers.template_coin( + "widget-weekview", + "tableview-cell", + { + "extra_classes": ( + [""] + .concat(is_today ? ["weekview-cell-today"] : []) + .join(" ") + ), + "title": lib_plankton.call.convey( + day_pit, + [ + lib_plankton.pit.to_datetime_ce, + (x : lib_plankton.pit.type_datetime) => lib_plankton.string.coin( + "{{year}}-{{month}}-{{day}}", + { + "year": x.date.year.toFixed(0).padStart(4, "0"), + "month": x.date.month.toFixed(0).padStart(2, "0"), + "day": x.date.day.toFixed(0).padStart(2, "0"), + } + ), + ] + ), + "day": lib_plankton.call.convey( + day_pit, + [ + lib_plankton.pit.to_datetime_ce, + (x : lib_plankton.pit.type_datetime) => lib_plankton.string.coin( + "{{day}}", + { + "year": x.date.year.toFixed(0).padStart(4, "0"), + "month": x.date.month.toFixed(0).padStart(2, "0"), + "day": x.date.day.toFixed(0).padStart(2, "0"), + } + ), + ] + ), + "rel": lib_plankton.call.convey( + day_pit, + [ + lib_plankton.pit.to_datetime_ce, + (x : lib_plankton.pit.type_datetime) => lib_plankton.string.coin( + "{{year}}-{{month}}-{{day}}", + { + "year": x.date.year.toFixed(0).padStart(4, "0"), + "month": x.date.month.toFixed(0).padStart(2, "0"), + "day": x.date.day.toFixed(0).padStart(2, "0"), + } + ) + ] + ), + "entries": "" + } + ); + } ) ) ).join(""),