misty.cafe/mistykey
1
0
Fork 0
Code Issues Pull requests 1 Projects Releases Packages Wiki Activity Actions

refactor(frontend): scripts -> utility

Browse source
This commit is contained in:
syuilo 2025-03-09 14:28:01 +09:00
parent f35eb0f6d9
commit be7e3b9a0c
464 changed files with 829 additions and 829 deletions
Download patch file Download diff file Expand all files Collapse all files

63
packages/frontend/src/scripts/use-chart-tooltip.ts
View file

@ -1,63 +0,0 @@
/*
* SPDX-FileCopyrightText: syuilo and misskey-project
* SPDX-License-Identifier: AGPL-3.0-only
*/
import { onUnmounted, onDeactivated, ref } from 'vue';
import * as os from '@/os.js';
import MkChartTooltip from '@/components/MkChartTooltip.vue';
export function useChartTooltip(opts: { position: 'top' | 'middle' } = { position: 'top' }) {
const tooltipShowing = ref(false);
const tooltipX = ref(0);
const tooltipY = ref(0);
const tooltipTitle = ref<string | null>(null);
const tooltipSeries = ref<{
backgroundColor: string;
borderColor: string;
text: string;
}[] | null>(null);
const { dispose: disposeTooltipComponent } = os.popup(MkChartTooltip, {
showing: tooltipShowing,
x: tooltipX,
y: tooltipY,
title: tooltipTitle,
series: tooltipSeries,
}, {});
onUnmounted(() => {
disposeTooltipComponent();
});
onDeactivated(() => {
tooltipShowing.value = false;
});
function handler(context) {
if (context.tooltip.opacity === 0) {
tooltipShowing.value = false;
return;
}
tooltipTitle.value = context.tooltip.title[0];
tooltipSeries.value = context.tooltip.body.map((b, i) => ({
backgroundColor: context.tooltip.labelColors[i].backgroundColor,
borderColor: context.tooltip.labelColors[i].borderColor,
text: b.lines[0],
}));
const rect = context.chart.canvas.getBoundingClientRect();
tooltipShowing.value = true;
tooltipX.value = rect.left + window.scrollX + context.tooltip.caretX;
if (opts.position === 'top') {
tooltipY.value = rect.top + window.scrollY;
} else if (opts.position === 'middle') {
tooltipY.value = rect.top + window.scrollY + context.tooltip.caretY;
}
}
return {
handler,
};
}