diff options
| author | syuilo <Syuilotan@yahoo.co.jp> | 2022-12-27 14:36:33 +0900 |
|---|---|---|
| committer | syuilo <Syuilotan@yahoo.co.jp> | 2022-12-27 14:36:33 +0900 |
| commit | 9384f5399da39e53855beb8e7f8ded1aa56bf72e (patch) | |
| tree | ce5959571a981b9c4047da3c7b3fd080aa44222c /packages/client/src/widgets/activity.chart.vue | |
| parent | wip: retention for dashboard (diff) | |
| download | misskey-9384f5399da39e53855beb8e7f8ded1aa56bf72e.tar.gz misskey-9384f5399da39e53855beb8e7f8ded1aa56bf72e.tar.bz2 misskey-9384f5399da39e53855beb8e7f8ded1aa56bf72e.zip | |
rename: client -> frontend
Diffstat (limited to 'packages/client/src/widgets/activity.chart.vue')
| -rw-r--r-- | packages/client/src/widgets/activity.chart.vue | 92 |
1 files changed, 0 insertions, 92 deletions
diff --git a/packages/client/src/widgets/activity.chart.vue b/packages/client/src/widgets/activity.chart.vue deleted file mode 100644 index b61e419f94..0000000000 --- a/packages/client/src/widgets/activity.chart.vue +++ /dev/null @@ -1,92 +0,0 @@ -<template> -<svg :viewBox="`0 0 ${ viewBoxX } ${ viewBoxY }`" @mousedown.prevent="onMousedown"> - <polyline - :points="pointsNote" - fill="none" - stroke-width="1" - stroke="#41ddde"/> - <polyline - :points="pointsReply" - fill="none" - stroke-width="1" - stroke="#f7796c"/> - <polyline - :points="pointsRenote" - fill="none" - stroke-width="1" - stroke="#a1de41"/> - <polyline - :points="pointsTotal" - fill="none" - stroke-width="1" - stroke="#555" - stroke-dasharray="2 2"/> -</svg> -</template> - -<script lang="ts" setup> -const props = defineProps<{ - activity: any[] -}>(); - -let viewBoxX: number = $ref(147); -let viewBoxY: number = $ref(60); -let zoom: number = $ref(1); -let pos: number = $ref(0); -let pointsNote: any = $ref(null); -let pointsReply: any = $ref(null); -let pointsRenote: any = $ref(null); -let pointsTotal: any = $ref(null); - -function dragListen(fn) { - window.addEventListener('mousemove', fn); - window.addEventListener('mouseleave', dragClear.bind(null, fn)); - window.addEventListener('mouseup', dragClear.bind(null, fn)); -} - -function dragClear(fn) { - window.removeEventListener('mousemove', fn); - window.removeEventListener('mouseleave', dragClear); - window.removeEventListener('mouseup', dragClear); -} - -function onMousedown(ev) { - const clickX = ev.clientX; - const clickY = ev.clientY; - const baseZoom = zoom; - const basePos = pos; - - // 動かした時 - dragListen(me => { - let moveLeft = me.clientX - clickX; - let moveTop = me.clientY - clickY; - - zoom = Math.max(1, baseZoom + (-moveTop / 20)); - pos = Math.min(0, basePos + moveLeft); - if (pos < -(((props.activity.length - 1) * zoom) - viewBoxX)) pos = -(((props.activity.length - 1) * zoom) - viewBoxX); - - render(); - }); -} - -function render() { - const peak = Math.max(...props.activity.map(d => d.total)); - if (peak !== 0) { - const activity = props.activity.slice().reverse(); - pointsNote = activity.map((d, i) => `${(i * zoom) + pos},${(1 - (d.notes / peak)) * viewBoxY}`).join(' '); - pointsReply = activity.map((d, i) => `${(i * zoom) + pos},${(1 - (d.replies / peak)) * viewBoxY}`).join(' '); - pointsRenote = activity.map((d, i) => `${(i * zoom) + pos},${(1 - (d.renotes / peak)) * viewBoxY}`).join(' '); - pointsTotal = activity.map((d, i) => `${(i * zoom) + pos},${(1 - (d.total / peak)) * viewBoxY}`).join(' '); - } -} -</script> - -<style lang="scss" scoped> -svg { - display: block; - padding: 16px; - width: 100%; - box-sizing: border-box; - cursor: all-scroll; -} -</style> |