From 7076343338ae3439f3c86f01144818abe8c31978 Mon Sep 17 00:00:00 2001 From: George Halkiadakis Date: Sun, 12 Mar 2023 07:16:23 +0200 Subject: add container helpers; constuct public directory-tree --- html/content/js/Plugins/tooltip.js | 45 ++++++++++++++++++++++++++++++++++++++ 1 file changed, 45 insertions(+) create mode 100644 html/content/js/Plugins/tooltip.js (limited to 'html/content/js/Plugins/tooltip.js') diff --git a/html/content/js/Plugins/tooltip.js b/html/content/js/Plugins/tooltip.js new file mode 100644 index 0000000..2326caf --- /dev/null +++ b/html/content/js/Plugins/tooltip.js @@ -0,0 +1,45 @@ +$$plugins.define('tooltip', ['throttle'], function (element, options, throttle) { + var openBtn = element.querySelector('.tooltip__btn'), + tooltipMain = element.querySelector('.tooltip__main'); + + openBtn.addEventListener('click', (event) => { + event.preventDefault(); + if (element.classList.contains('tooltip--open')) { + element.classList.remove('tooltip--open'); + } else { + $('.tooltip').not(element).removeClass('tooltip--open'); + element.classList.add('tooltip--open'); + } + }); + + document.addEventListener('click', function (event) { + if (element !== event.target && !element.contains(event.target) && element.classList.contains('tooltip--open')) { + element.classList.remove('tooltip--open'); + } + }); + + function tooltipPosition() { + element.classList.remove('tooltip--bottom'); + element.classList.remove('tooltip--right'); + element.classList.remove('tooltip--left'); + + if (element.getBoundingClientRect().top < window.innerHeight / 2) { + element.classList.add('tooltip--bottom'); + } else { + element.classList.remove('tooltip--bottom'); + } + + if (element.getBoundingClientRect().left < tooltipMain.offsetWidth / 2) { + element.classList.add('tooltip--right'); + } + + if (document.body.clientWidth - element.getBoundingClientRect().left < tooltipMain.offsetWidth / 2) { + element.classList.add('tooltip--left'); + } + } + + tooltipPosition(); + + window.addEventListener('scroll', throttle(tooltipPosition, 50)); + window.addEventListener('resize', throttle(tooltipPosition, 200)); +}); -- cgit v1.2.3