diff --git a/docs/configuration/main.rst b/docs/configuration/main.rst index b6a08a90..2d449ffd 100644 --- a/docs/configuration/main.rst +++ b/docs/configuration/main.rst @@ -20,7 +20,7 @@ Main Options startDaysAhead integer optional v0.7.3 ``0`` If you set more than 0, events will be loaded starting `x` days from today. For example `1` - the component will show events starting from tomorrow, if a negative number is used, events previous will be shown. showDescription boolean optional v0.8.4 ``false`` Shows long description of event from Google Calendar. showNoEventsForToday boolean optional v0.8.6 ``false`` Shows `No events for today` if no events, instead of omit the entry. - sortByStartTime boolean optional v0.9.0 ``false`` Sort events by start time first instead of grouping them by calendar. + sortBy boolean optional ``start`` Sort events by start time. ``start|milestone|none`` disableEventLink boolean optional v0.10.0 ``false`` disables links in event title. disableLocationLink boolean optional v0.10.0 ``false`` disables links in event location. linkTarget string optional v0.11.0 ``_blank`` Allows custom target for links, default will open new tab. @@ -43,4 +43,5 @@ Main Options titleLength integer optional v7.4.0 Sets the maximum length of the event titles showAllDayEvents boolean optional ``true`` if set false will hide all events that are a full day offsetHeaderDate boolean optional ``false`` if set true the header date will match the startDaysAhead offset date + allDayBottom boolean optional ``false`` if set true all day events will show below other running events ========================= ========= =============== ========== ========================================================================================================================================================================================================================== diff --git a/src/defaults.ts b/src/defaults.ts index 5bd59a27..d2d56ab9 100644 --- a/src/defaults.ts +++ b/src/defaults.ts @@ -22,7 +22,8 @@ export default { startDaysAhead: 0, // shows the events starting on x days from today. Default 0. showLastCalendarWeek: false, // always shows last line/week in calendar mode, even if it's not the current month - sortByStartTime: true, // sort first by calendar, then by time + sortBy: "start", // sort first by start time or milestone + allDayBottom: false, // show all day events at the bottom of the day disableEventLink: false, // disables links to event calendar disableLocationLink: false, // disables links to event calendar disableCalMonthLink: false, // disables the link on the month name in calendar mode diff --git a/src/editor.ts b/src/editor.ts index 3ef59952..2549f6dd 100644 --- a/src/editor.ts +++ b/src/editor.ts @@ -210,6 +210,7 @@ export class AtomicCalendarReviveEditor extends ScopedRegistryHost(LitElement) i const linkTargets: string[] = ['_blank', '_self', '_parent', '_top']; const defaultModes: string[] = ['Event', 'Calendar']; + const sortBy: string[] = ['start', 'milestone', 'none']; this.options = { entities: { @@ -310,6 +311,14 @@ export class AtomicCalendarReviveEditor extends ScopedRegistryHost(LitElement) i label: localize('main.fields.linkTarget'), selected: linkTargets.indexOf(this._config.linkTarget || defaultConfig.linkTarget), }, + { + type: 'dropdown', + items: sortBy, + name: 'sortBy', + section: 'main', + label: localize('main.fields.sortBy'), + selected: sortBy.indexOf(this._config.sortBy || defaultConfig.sortBy), + }, { type: 'text', name: 'cardHeight', @@ -333,12 +342,6 @@ export class AtomicCalendarReviveEditor extends ScopedRegistryHost(LitElement) i name: 'showDeclined', label: localize('main.fields.showDeclined'), }, - { - type: 'switch', - name: 'sortByStartTime', - label: localize('main.fields.sortByStartTime'), - default: defaultConfig.sortByStartTime, - }, { type: 'switch', name: 'hideFinishedEvents', @@ -397,6 +400,12 @@ export class AtomicCalendarReviveEditor extends ScopedRegistryHost(LitElement) i label: localize('main.fields.offsetHeaderDate'), default: defaultConfig.offsetHeaderDate, }, + { + type: 'switch', + name: 'allDayBottom', + label: localize('main.fields.allDayBottom'), + default: defaultConfig.allDayBottom, + }, ], }, event: { diff --git a/src/functions/sort_events.ts b/src/functions/sort_events.ts new file mode 100644 index 00000000..efb1c0f3 --- /dev/null +++ b/src/functions/sort_events.ts @@ -0,0 +1,69 @@ +import dayjs from 'dayjs'; + +// Function to sort events +export default function sortEvents(events, config) { + const currentDateTime = dayjs(); // Current date and time + + events.sort((a, b) => { + const isRunningA = currentDateTime.isBetween(a.startDateTime, a.endDateTime); + const isRunningB = currentDateTime.isBetween(b.startDateTime, b.endDateTime); + + if (isRunningA && !isRunningB) { + return -1; + } else if (!isRunningA && isRunningB) { + return 1; + } else { + const timeDiffA = Math.min( + Math.abs(a.startDateTime.diff(currentDateTime)), + Math.abs(a.endDateTime.diff(currentDateTime)) + ); + + const timeDiffB = Math.min( + Math.abs(b.startDateTime.diff(currentDateTime)), + Math.abs(b.endDateTime.diff(currentDateTime)) + ); + + return timeDiffA - timeDiffB; + } + }); + + // Sort all-day events by entity and title + const allDayEvents = events.filter(event => event.isAllDay); + + allDayEvents.sort((a, b) => { + if (a.entity !== b.entity) { + return a.entity.localeCompare(b.entity); + } else { + return a.title.localeCompare(b.title); + } + }); + + // Combine sorted all-day and non-all-day events + const sortedEvents = [...events]; + sortedEvents.forEach((event, index) => { + const allDayIndex = allDayEvents.findIndex(adEvent => adEvent.id === event.id); + if (allDayIndex !== -1) { + sortedEvents.splice(index, 1); + sortedEvents.push(allDayEvents[allDayIndex]); + } + }); + + // Apply all-day sorting based on the 'config.allDayBottom' boolean + if (config.allDayBottom) { + sortedEvents.sort((a, b) => b.startDateTime.diff(a.startDateTime)); + } else { + sortedEvents.sort((a, b) => a.startDateTime.diff(b.startDateTime)); + } + + if (config.sortBy === "milestone") { + // Move finished events to the bottom when sorting by milestone + sortedEvents.sort((a, b) => { + if (a.isFinished !== b.isFinished) { + return a.isFinished ? 1 : -1; + } + return 0; + }); + } + + return sortedEvents; +} diff --git a/src/index.ts b/src/index.ts index d1dd3ddf..fa6238bf 100644 --- a/src/index.ts +++ b/src/index.ts @@ -608,8 +608,8 @@ export class AtomicCalendarRevive extends LitElement { style="${dayStyleOtherMonth}${dayStyleSat}${dayStyleSun}${dayStyleClicked} --cal-grid-color: ${this._config .calGridColor}; --cal-day-color: ${this._config.calDayColor}" > -
-
${day.date.date()}
+
+
${day.date.date()}
${handleCalendarIcons(day)}
diff --git a/src/lib/event.func.ts b/src/lib/event.func.ts index 4707d686..0cf67097 100644 --- a/src/lib/event.func.ts +++ b/src/lib/event.func.ts @@ -5,6 +5,7 @@ import { atomicCardConfig } from '../types/config'; import { EntityConfig } from '../types'; import CalendarDay from './calendar.class'; import EventClass from './event.class'; +import sortEvents from '../functions/sort_events'; dayjs.extend(customParseFormat); dayjs.extend(isBetween); @@ -199,37 +200,6 @@ export async function getAllEvents(start: dayjs.Dayjs, end: dayjs.Dayjs, config: return { failedEvents, events: processEvents(allEvents, config, mode) }; } -/** - * Sorts all day events into order of entities - * @param {Array} list of events - * @param {Array} all entities for card - * @return {Promise>} - */ -function sortEventsByEntity(events: EventClass[], entities: EntityConfig[]): any[] { - const allDayEvents = events.filter((event) => event.isAllDayEvent); - const otherEvents = events.filter((event) => !event.isAllDayEvent); - - allDayEvents.sort((event1, event2) => { - const entity1 = entities.find( - (entity) => entity.entity === event1.entity.entity_id - ); - const entity2 = entities.find( - (entity) => entity.entity === event2.entity.entity_id - ); - if (!entity1 || !entity2) { - return 0; - } - const index1 = entities.indexOf(entity1); - const index2 = entities.indexOf(entity2); - if (index1 === index2) { - return event1.title.localeCompare(event2.title); - } - return index1 - index2; - }); - - return [...allDayEvents, ...otherEvents]; -} - /** * converts all calendar events to CalendarEvent objects * @param {Array} list of raw caldav calendar events @@ -347,10 +317,8 @@ export function processEvents(allEvents: any[], config: atomicCardConfig, mode: newEvents = updatedEvents; } - // sort events by date starting with soonest - if (config.sortByStartTime) { - newEvents.sort((a: EventClass, b: EventClass) => (a.startDateTime.isBefore(b.startDateTime) ? -1 : 1)); - } + // sort events + newEvents = sortEvents(newEvents, config); // check if the maxEventCount is set, if it is we will remove any events // that go over this limit, unless softLimit is set, in which case we @@ -359,6 +327,5 @@ export function processEvents(allEvents: any[], config: atomicCardConfig, mode: (config.softLimit && newEvents.length > config.maxEventCount + config.softLimit))) { newEvents.length = config.maxEventCount; } - newEvents = sortEventsByEntity(newEvents, config.entities) return newEvents; } diff --git a/src/localize/languages/da.json b/src/localize/languages/da.json index abb796d2..20bcc0eb 100644 --- a/src/localize/languages/da.json +++ b/src/localize/languages/da.json @@ -37,7 +37,8 @@ "showLoader": "Vis animeret indlæsning", "showDate": "Vis dato på kort", "showDeclined": "Vis afviste aftaler", - "sortByStartTime": "Sorter på start tid", + "sortBy": "Sorter på", + "allDayBottom": "Vis heldagsbegivenheder nederst", "hideFinishedEvents": "Skjul overståede aftaler", "dateFormat": "Dato format", "hoursFormat": "Time format", diff --git a/src/localize/languages/de.json b/src/localize/languages/de.json index 69cad467..f927b4c5 100644 --- a/src/localize/languages/de.json +++ b/src/localize/languages/de.json @@ -36,7 +36,8 @@ "showLoader": "Ladeanimation anzeigen", "showDate": "Datum mitanzeigen", "showDeclined": "Abgelehnte Einträge anzeigen", - "sortByStartTime": "Nach Startzeit sortieren", + "sortBy": "Sortiere nach", + "allDayBottom": "Ganztägige Ereignisse unten anzeigen", "hideFinishedEvents": "Beendete Einträge ausblenden", "dateFormat": "Datumsformat", "hoursFormat": "Stundenformat", diff --git a/src/localize/languages/en.json b/src/localize/languages/en.json index 8b0d8bc2..6132550b 100644 --- a/src/localize/languages/en.json +++ b/src/localize/languages/en.json @@ -37,7 +37,8 @@ "showLoader": "Show loader animation", "showDate": "Show date on card", "showDeclined": "Show declined events", - "sortByStartTime": "Sort by start time", + "sortBy": "Sort by", + "allDayBottom": "Show all day events at the bottom", "hideFinishedEvents": "Hide finished events", "dateFormat": "Date format", "hoursFormat": "Hours format", diff --git a/src/localize/languages/et.json b/src/localize/languages/et.json index 3f8e0bac..1bb2a4f4 100644 --- a/src/localize/languages/et.json +++ b/src/localize/languages/et.json @@ -14,7 +14,7 @@ "common": { "previous": "Eelmine", "next": "Järgmine", - "week": "Nädal" + "week": "Nädal" } }, "errors": { @@ -36,7 +36,8 @@ "showLoader": "Kuva laadimisel animatsiooni", "showDate": "Kuva tänane kuupäev", "showDeclined": "Kuva summutatud sündmused", - "sortByStartTime": "Järjesta ajaliselt", + "sortBy": "Sorteerima", + "allDayBottom": "Kuva allosas kogu päeva sündmused", "hideFinishedEvents": "Peida lõppenud sündmused", "dateFormat": "Kuupäeva vorming", "hoursFormat": "Kellaaja vorming", diff --git a/src/localize/languages/fi.json b/src/localize/languages/fi.json index fa05337c..9c3e1c1a 100644 --- a/src/localize/languages/fi.json +++ b/src/localize/languages/fi.json @@ -37,7 +37,8 @@ "showLoader": "Näytä latausanimaatio", "showDate": "Näytä päivämäärä kortissa", "showDeclined": "Näytä hylätyt tapahtumat", - "sortByStartTime": "Lajittele alkamisajan mukaan", + "sortBy": "Järjestä", + "allDayBottom": "Näytä koko päivän tapahtumat alareunassa", "hideFinishedEvents": "Piilota valmiit tapahtumat", "dateFormat": "Päivämäärämuoto", "hoursFormat": "Tuntien muoto", diff --git a/src/localize/languages/fr.json b/src/localize/languages/fr.json index f983d77d..2e6277b9 100644 --- a/src/localize/languages/fr.json +++ b/src/localize/languages/fr.json @@ -14,7 +14,7 @@ "common": { "previous": "Précédent", "next": "Suivant", - "week": "Semaine" + "week": "Semaine" } }, "errors": { @@ -37,7 +37,8 @@ "showLoader": "Afficher l'animation de chargement", "showDate": "Afficher la date sur la carte", "showDeclined": "Afficher les événements déclinés", - "sortByStartTime": "Trier par date de début", + "sortBy": "Trier par", + "allDayBottom": "Afficher les événements de la journée en bas", "hideFinishedEvents": "Cacher les événements terminés", "dateFormat": "Format de date", "hoursFormat": "Format des heures", diff --git a/src/localize/languages/nb.json b/src/localize/languages/nb.json index 27ec3f9d..50365da0 100644 --- a/src/localize/languages/nb.json +++ b/src/localize/languages/nb.json @@ -37,7 +37,8 @@ "showLoader": "Vis animasjon ved innlasting", "showDate": "Vis dato på kort", "showDeclined": "Vis avviste hendelser", - "sortByStartTime": "Sortér på starttid", + "sortBy": "Sorter efter", + "allDayBottom": "Vis heldagshendelser nederst", "hideFinishedEvents": "Skjul avsluttede hendelser", "dateFormat": "Datoformat", "hoursFormat": "Timesformat", diff --git a/src/localize/languages/sl.json b/src/localize/languages/sl.json index 8dfe65fa..adbac866 100644 --- a/src/localize/languages/sl.json +++ b/src/localize/languages/sl.json @@ -37,7 +37,8 @@ "showLoader": "Pokaži animacijo nalagalnika", "showDate": "Prikaži datum na kartici", "showDeclined": "Prikaži zavrnjene dogodke", - "sortByStartTime": "Razvrsti po času začetka", + "sortBy": "Razvrsti po", + "allDayBottom": "Pokaži celodnevne dogodke na dnu", "hideFinishedEvents": "Skrij končane dogodke", "dateFormat": "Format datuma", "hoursFormat": "Format ur", diff --git a/src/localize/languages/sv.json b/src/localize/languages/sv.json index 56bc4217..cae43138 100644 --- a/src/localize/languages/sv.json +++ b/src/localize/languages/sv.json @@ -14,7 +14,7 @@ "common": { "previous": "Föregående", "next": "Nästa", - "week": "Vecka" + "week": "Vecka" } }, "errors": { @@ -36,7 +36,8 @@ "showLoader": "Visa animation för laddning", "showDate": "Visa datum på kortet", "showDeclined": "Visa nekade händelser", - "sortByStartTime": "Sortera efter starttid", + "sortBy": "Sortera efter", + "allDayBottom": "Visa heldagshändelser längst ner", "hideFinishedEvents": "Hide finished events Dölj avslutade händelser", "dateFormat": "Datumformat", "hoursFormat": "Timformat", diff --git a/src/style.ts b/src/style.ts index a798af9b..f5fa2788 100644 --- a/src/style.ts +++ b/src/style.ts @@ -299,17 +299,16 @@ export const styles: CSSResultGroup = css` margin: auto; } - .calDay.currentDay { + .currentDay { + position: relative; + width: 20px; height: 20px; background-color: var(--primary-color); + color: var(--text-primary-color) !important; + text-align: center; + line-height: 20px; border-radius: 50%; display: inline-block; - text-align: center; - white-space: nowrap; - width: max-content; - min-width: 20px; - line-height: 140%; - color: var(--text-primary-color) !important; } tr.cal {