debian-mirror-gitlab/app/assets/javascripts/popovers/index.js

52 lines
1.3 KiB
JavaScript
Raw Normal View History

2021-01-29 00:20:46 +05:30
import { toArray } from 'lodash';
2021-03-11 19:13:27 +05:30
import Vue from 'vue';
2021-01-29 00:20:46 +05:30
import PopoversComponent from './components/popovers.vue';
let app;
const APP_ELEMENT_ID = 'gl-popovers-app';
const getPopoversApp = () => {
if (!app) {
const container = document.createElement('div');
container.setAttribute('id', APP_ELEMENT_ID);
document.body.appendChild(container);
const Popovers = Vue.extend(PopoversComponent);
2022-04-04 11:22:00 +05:30
app = new Popovers({ name: 'PopoversRoot' });
2021-01-29 00:20:46 +05:30
app.$mount(`#${APP_ELEMENT_ID}`);
}
return app;
};
const isPopover = (node, selector) => node.matches && node.matches(selector);
const handlePopoverEvent = (rootTarget, e, selector) => {
for (let { target } = e; target && target !== rootTarget; target = target.parentNode) {
if (isPopover(target, selector)) {
getPopoversApp().addPopovers([target]);
break;
}
}
};
export const initPopovers = () => {
2021-03-08 18:12:59 +05:30
['mouseenter', 'focus', 'click'].forEach((event) => {
2021-01-29 00:20:46 +05:30
document.addEventListener(
event,
2021-03-08 18:12:59 +05:30
(e) => handlePopoverEvent(document, e, '[data-toggle="popover"]'),
2021-01-29 00:20:46 +05:30
true,
);
});
return getPopoversApp();
};
2021-03-08 18:12:59 +05:30
export const dispose = (elements) => toArray(elements).forEach(getPopoversApp().dispose);
2021-01-29 00:20:46 +05:30
export const destroy = () => {
getPopoversApp().$destroy();
app = null;
};