1 |
|
2 | import {getRootRect} from "./dimensions";
|
3 | import throttle from "lodash.throttle";
|
4 | import {resizeHandler} from "./event-handlers";
|
5 |
|
6 | const NativeResizeObserver = window.ResizeObserver;
|
7 |
|
8 | class EventListenerResizeObserver {
|
9 | constructor(el, listener) {
|
10 | this.el = el;
|
11 | this.listener = listener;
|
12 | }
|
13 |
|
14 | observe() {
|
15 | this.el.addEventListener('resize', this.listener);
|
16 | }
|
17 |
|
18 | unobserve() {
|
19 | this.el.removeEventListener('resize', this.listener);
|
20 | }
|
21 | }
|
22 |
|
23 | class NativeWrapperResizeObserver {
|
24 | constructor(el, listener) {
|
25 | this.el = el;
|
26 | this.listener = listener;
|
27 | this.ro = new NativeResizeObserver(this.listener);
|
28 | }
|
29 |
|
30 | observe() {
|
31 | this.ro.observe(this.el);
|
32 | }
|
33 |
|
34 | unobserve() {
|
35 | this.ro.unobserve();
|
36 | }
|
37 | }
|
38 |
|
39 | class PollingResizeObserver {
|
40 | constructor(el, listener) {
|
41 | this.el = el;
|
42 | this.listener = listener;
|
43 | this.interval = null;
|
44 | this.lastHeight = null;
|
45 | }
|
46 |
|
47 | pollHeight() {
|
48 | let height = Math.trunc(getRootRect(this.el).height);
|
49 |
|
50 | if (this.lastHeight !== null && this.lastHeight !== height) {
|
51 | this.listener();
|
52 | }
|
53 |
|
54 | this.lastHeight = height;
|
55 | }
|
56 |
|
57 | observe() {
|
58 | this.interval = setInterval(this.pollHeight.bind(this), 200);
|
59 | }
|
60 |
|
61 | unobserve() {
|
62 | clearInterval(this.interval);
|
63 | }
|
64 | }
|
65 |
|
66 | export default function ResizeObserverFactory(ias, el) {
|
67 | let listener = throttle(resizeHandler, 200).bind(ias);
|
68 |
|
69 | if (el === window) {
|
70 | return new EventListenerResizeObserver(el, listener);
|
71 | }
|
72 |
|
73 | if (NativeResizeObserver) {
|
74 | return new NativeWrapperResizeObserver(el, listener);
|
75 | }
|
76 |
|
77 | if (console && console.warn) {
|
78 | console.warn('ResizeObserver not supported. Falling back on polling.');
|
79 | }
|
80 |
|
81 | return new PollingResizeObserver(el, listener);
|
82 | }
|