🚚 Moves ClickOutside into directives directory

This commit is contained in:
Alicia Sykes 2022-03-30 21:54:01 +01:00
parent dda5325528
commit 83ce9b8e5c
2 changed files with 42 additions and 1 deletions

View File

@ -0,0 +1,41 @@
/**
* A Vue directive to trigger an event when the user
* clicks anywhere other than the specified elements
* Used to close context menus popup modals and tips
* Dashy: Licensed under MIT - (C) Alicia Sykes 2022
*/
const instances = []; // List of click event instances
/* Trigger action when click anywhere, except target elem */
function onDocumentClick(event, elem, action) {
const { target } = event;
if (elem !== target && !elem.contains(target)) {
action(event);
}
}
export default {
/* Add event listeners */
bind(element, binding) {
const elem = element;
elem.dataset.outsideClickIndex = instances.length;
const action = binding.value;
const click = (event) => {
onDocumentClick(event, elem, action);
};
document.addEventListener('click', click);
document.addEventListener('touchstart', click);
instances.push(click);
},
/* Remove event listeners */
unbind(elem) {
if (!elem.dataset) return;
const index = elem.dataset.outsideClickIndex;
const handler = instances[index];
document.removeEventListener('click', handler);
instances.splice(index, 1);
},
};

View File

@ -16,9 +16,9 @@ import Dashy from '@/App.vue'; // Main Dashy Vue app
import router from '@/router'; // Router, for navigation import router from '@/router'; // Router, for navigation
import store from '@/store'; // Store, for local state management import store from '@/store'; // Store, for local state management
import serviceWorker from '@/utils/InitServiceWorker'; // Service worker initialization import serviceWorker from '@/utils/InitServiceWorker'; // Service worker initialization
import clickOutside from '@/utils/ClickOutside'; // Directive for closing popups, modals, etc
import { messages } from '@/utils/languages'; // Language texts import { messages } from '@/utils/languages'; // Language texts
import ErrorReporting from '@/utils/ErrorReporting'; // Error reporting initializer (off) import ErrorReporting from '@/utils/ErrorReporting'; // Error reporting initializer (off)
import clickOutside from '@/directives/ClickOutside'; // Directive for closing popups, modals, etc
import { toastedOptions, tooltipOptions, language as defaultLanguage } from '@/utils/defaults'; import { toastedOptions, tooltipOptions, language as defaultLanguage } from '@/utils/defaults';
import { initKeycloakAuth, isKeycloakEnabled } from '@/utils/KeycloakAuth'; import { initKeycloakAuth, isKeycloakEnabled } from '@/utils/KeycloakAuth';