summaryrefslogtreecommitdiff
path: root/packages/client/src/directives/get-size.ts
diff options
context:
space:
mode:
Diffstat (limited to 'packages/client/src/directives/get-size.ts')
-rw-r--r--packages/client/src/directives/get-size.ts54
1 files changed, 0 insertions, 54 deletions
diff --git a/packages/client/src/directives/get-size.ts b/packages/client/src/directives/get-size.ts
deleted file mode 100644
index ff3bdd78ac..0000000000
--- a/packages/client/src/directives/get-size.ts
+++ /dev/null
@@ -1,54 +0,0 @@
-import { Directive } from 'vue';
-
-const mountings = new Map<Element, {
- resize: ResizeObserver;
- intersection?: IntersectionObserver;
- fn: (w: number, h: number) => void;
-}>();
-
-function calc(src: Element) {
- const info = mountings.get(src);
- const height = src.clientHeight;
- const width = src.clientWidth;
-
- if (!info) return;
-
- // アクティベート前などでsrcが描画されていない場合
- if (!height) {
- // IntersectionObserverで表示検出する
- if (!info.intersection) {
- info.intersection = new IntersectionObserver(entries => {
- if (entries.some(entry => entry.isIntersecting)) calc(src);
- });
- }
- info.intersection.observe(src);
- return;
- }
- if (info.intersection) {
- info.intersection.disconnect();
- delete info.intersection;
- }
-
- info.fn(width, height);
-}
-
-export default {
- mounted(src, binding, vn) {
- const resize = new ResizeObserver((entries, observer) => {
- calc(src);
- });
- resize.observe(src);
-
- mountings.set(src, { resize, fn: binding.value });
- calc(src);
- },
-
- unmounted(src, binding, vn) {
- binding.value(0, 0);
- const info = mountings.get(src);
- if (!info) return;
- info.resize.disconnect();
- if (info.intersection) info.intersection.disconnect();
- mountings.delete(src);
- },
-} as Directive<Element, (w: number, h: number) => void>;