Add search functionality to Calendar view

This commit is contained in:
Henrik Giesel 2021-01-18 01:24:32 +01:00
parent f1c8879830
commit 7f671cf837
2 changed files with 9 additions and 0 deletions

View file

@ -1,4 +1,5 @@
<script lang="typescript"> <script lang="typescript">
import { createEventDispatcher } from "svelte";
import NoDataOverlay from "./NoDataOverlay.svelte"; import NoDataOverlay from "./NoDataOverlay.svelte";
import AxisTicks from "./AxisTicks.svelte"; import AxisTicks from "./AxisTicks.svelte";
import { defaultGraphBounds, RevlogRange } from "./graph-helpers"; import { defaultGraphBounds, RevlogRange } from "./graph-helpers";
@ -15,6 +16,8 @@
export let nightMode: boolean; export let nightMode: boolean;
let { calendarFirstDayOfWeek } = preferences; let { calendarFirstDayOfWeek } = preferences;
const dispatch = createEventDispatcher();
let graphData: GraphData | null = null; let graphData: GraphData | null = null;
let bounds = defaultGraphBounds(); let bounds = defaultGraphBounds();
@ -49,6 +52,7 @@
svg as SVGElement, svg as SVGElement,
bounds, bounds,
graphData, graphData,
dispatch,
targetYear, targetYear,
i18n, i18n,
nightMode, nightMode,

View file

@ -82,6 +82,7 @@ export function renderCalendar(
svgElem: SVGElement, svgElem: SVGElement,
bounds: GraphBounds, bounds: GraphBounds,
sourceData: GraphData, sourceData: GraphData,
dispatch: any,
targetYear: number, targetYear: number,
i18n: I18n, i18n: I18n,
nightMode: boolean, nightMode: boolean,
@ -113,6 +114,7 @@ export function renderCalendar(
maxCount = count; maxCount = count;
} }
} }
console.log('sourceData', sourceData, dayMap)
if (!maxCount) { if (!maxCount) {
setDataAvailable(svg, false); setDataAvailable(svg, false);
@ -205,6 +207,9 @@ export function renderCalendar(
showTooltip(tooltipText(d), x, y); showTooltip(tooltipText(d), x, y);
}) })
.on("mouseout", hideTooltip) .on("mouseout", hideTooltip)
.on("click", function (this: any, d: any) {
dispatch("search", { query: `"prop:rated=${d.day}"` });
})
.transition() .transition()
.duration(800) .duration(800)
.attr("fill", (d) => (d.count === 0 ? emptyColour : blues(d.count)!)); .attr("fill", (d) => (d.count === 0 ? emptyColour : blues(d.count)!));