jeffemmett
/
rspace-online
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Merge branch 'dev'

This commit is contained in:
Jeff Emmett 2026-03-23 10:48:37 -07:00
parent 1f34c89d4c 460c68ddbf
commit 7f75552da2
1 changed files with 31 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

46
modules/rcal/components/folk-calendar-view.ts
View File

@ -1146,6 +1146,9 @@ class FolkCalendarView extends HTMLElement {
const isToday = ds === todayStr;
const isExpanded = ds === this.expandedDay;
const dayEvents = this.getEventsForDate(ds);
// For dots/labels in day cells, only show events that START on this day.
// Multi-day events on intermediate days are shown via span bars instead.
const cellEvents = dayEvents.filter(e => e.start_time.slice(0, 10) === ds);
const dayReminders = this.getRemindersForDate(ds);
const lunar = this.lunarData[ds];
@ -1155,18 +1158,18 @@ class FolkCalendarView extends HTMLElement {
${this.showLunar && lunar ? `<span class="moon">${this.getMoonEmoji(lunar.phase)}</span>` : ""}
${dayReminders.length > 0 ? `<span class="reminder-badge" title="${dayReminders.length} reminder${dayReminders.length > 1 ? "s" : ""}">🔔${dayReminders.length > 1 ? dayReminders.length : ""}</span>` : ""}
</div>
${dayEvents.length > 0 || dayReminders.length > 0 ? `
${cellEvents.length > 0 || dayReminders.length > 0 ? `
<div class="dots">
${dayEvents.slice(0, 5).map(e => {
${cellEvents.slice(0, 5).map(e => {
const es = this.getEventStyles(e);
return es.isTentative
? `<span class="dot dot--tentative" style="border-color:${e.source_color || "#6366f1"}"></span>`
: `<span class="dot" style="background:${e.source_color || "#6366f1"}"></span>`;
}).join("")}
${dayReminders.slice(0, 3).map(r => `<span class="dot dot--reminder" style="background:${r.sourceColor || "#f59e0b"}" title="${this.esc(r.title)}"></span>`).join("")}
${dayEvents.length > 5 ? `<span style="font-size:8px;color:var(--rs-text-muted)">+${dayEvents.length - 5}</span>` : ""}
${cellEvents.length > 5 ? `<span style="font-size:8px;color:var(--rs-text-muted)">+${cellEvents.length - 5}</span>` : ""}
</div>
${dayEvents.slice(0, 2).map(e => {
${cellEvents.slice(0, 2).map(e => {
const evColor = e.source_color || "#6366f1";
const es = this.getEventStyles(e);
const city = this.getSpatialLabel(e.location_breadcrumb, 5);
@ -2372,8 +2375,9 @@ class FolkCalendarView extends HTMLElement {
});
// Scroll/trackpad gestures on calendar pane
// - Pinch-to-zoom (ctrlKey wheel) → zoom in/out granularity
// - Two-finger scroll/pan (plain wheel) → navigate timeline
// - Pinch-to-zoom (ctrlKey wheel) → zoom in/out temporal granularity
// - Two-finger horizontal pan (deltaX) → navigate dates
// - Two-finger vertical scroll (deltaY) → pass through to page scroll
const calPane = $("calendar-pane");
if (calPane) {
calPane.addEventListener("wheel", (e: WheelEvent) => {
@ -2381,10 +2385,9 @@ class FolkCalendarView extends HTMLElement {
const mapPanel = this.shadow.getElementById("map-panel");
if (mapPanel && mapPanel.contains(e.target as Node)) return;
e.preventDefault();
if (e.ctrlKey) {
// Pinch-to-zoom on trackpad (or Ctrl+scroll with mouse)
e.preventDefault();
if (this._wheelTimer) clearTimeout(this._wheelTimer);
this._wheelTimer = setTimeout(() => {
if (e.deltaY > 0) {
@ -2394,18 +2397,20 @@ class FolkCalendarView extends HTMLElement {
}
this._wheelTimer = null;
}, 120);
} else {
// Two-finger scroll / mouse wheel → navigate timeline
} else if (Math.abs(e.deltaX) > Math.abs(e.deltaY) && Math.abs(e.deltaX) > 10) {
// Two-finger horizontal pan → navigate dates
e.preventDefault();
if (this._wheelTimer) clearTimeout(this._wheelTimer);
this._wheelTimer = setTimeout(() => {
if (e.deltaY > 0) {
this.navigate(1); // scroll down → next period
} else if (e.deltaY < 0) {
this.navigate(-1); // scroll up → previous period
if (e.deltaX > 0) {
this.navigate(1); // pan right → next period
} else if (e.deltaX < 0) {
this.navigate(-1); // pan left → previous period
}
this._wheelTimer = null;
}, 120);
}
// Vertical scroll (deltaY without ctrlKey) → no preventDefault, page scrolls naturally
}, { passive: false });
// Pan/swipe + pinch-to-zoom on calendar pane
@ -2495,8 +2500,19 @@ class FolkCalendarView extends HTMLElement {
this.leafletMap = L.map(this.mapContainer, {
center, zoom, zoomControl: false,
scrollWheelZoom: false, // Disable: plain scroll should pass to page
});
// Only zoom map on Ctrl+scroll (pinch-to-zoom on trackpad)
this.mapContainer.addEventListener("wheel", (ev: WheelEvent) => {
if (ev.ctrlKey) {
ev.preventDefault();
if (ev.deltaY < 0) this.leafletMap.zoomIn();
else if (ev.deltaY > 0) this.leafletMap.zoomOut();
}
// Plain scroll passes through to page
}, { passive: false });
this.applyMapTileLayer();
// Watch for theme changes
@ -2702,7 +2718,7 @@ class FolkCalendarView extends HTMLElement {
/* ── Main Layout ── */
.main-layout { position: relative; min-height: 400px; }
.main-layout--docked { display: grid; grid-template-columns: 1fr 6px 400px; gap: 0; min-height: 500px; }
.calendar-pane { overflow: auto; min-width: 0; touch-action: pan-y; user-select: none; }
.calendar-pane { overflow: auto; min-width: 0; touch-action: pan-y pinch-zoom; user-select: none; }
/* ── Resize Handle ── */
.resize-handle { width: 6px; cursor: col-resize; background: transparent; position: relative; z-index: 10; transition: background 0.15s; }