diff options
Diffstat (limited to 'site/js')
-rw-r--r-- | site/js/burger-manu-click-handler.js | 39 | ||||
-rw-r--r-- | site/js/form-insertions.js | 8 | ||||
-rw-r--r-- | site/js/google-analytics-message.js | 12 | ||||
-rw-r--r-- | site/js/rive-animations.js | 40 | ||||
-rw-r--r-- | site/js/scroll-detector-for-header.js | 27 |
5 files changed, 121 insertions, 5 deletions
diff --git a/site/js/burger-manu-click-handler.js b/site/js/burger-manu-click-handler.js new file mode 100644 index 0000000..6030c0b --- /dev/null +++ b/site/js/burger-manu-click-handler.js @@ -0,0 +1,39 @@ +document.addEventListener('click', (e) => { + const burgerMenuIcon = document.getElementById('burgerMenu') + const closeBurgerMenuIcon = document.getElementById('closeIcon') + const bottomPartBurgerMenu = document.getElementById('bottomPartOfBurgerMenu') + const navigation = document.getElementById('navigation') + + function openBurgerMenu() { + burgerMenuIcon.classList.remove('visible') + burgerMenuIcon.classList.add('not__visible') + + closeBurgerMenuIcon.classList.remove('not__visible') + closeBurgerMenuIcon.classList.add('visible') + + bottomPartBurgerMenu.classList.remove('not__visible') + bottomPartBurgerMenu.classList.add('visible') + + navigation.classList.add('background__white') + } + + function closeBurgerMenu() { + burgerMenuIcon.classList.remove('not__visible') + burgerMenuIcon.classList.add('visible') + + closeBurgerMenuIcon.classList.remove('visible') + closeBurgerMenuIcon.classList.add('not__visible') + + bottomPartBurgerMenu.classList.remove('visible') + bottomPartBurgerMenu.classList.add('not__visible') + + } + + if (e.target?.id === 'burgerMenu') { + openBurgerMenu() + } + if (e.target?.id === 'closeIcon' || + e.target?.id === 'bottomPartOfBurgerMenu') { + closeBurgerMenu() + } +}) diff --git a/site/js/form-insertions.js b/site/js/form-insertions.js new file mode 100644 index 0000000..634a941 --- /dev/null +++ b/site/js/form-insertions.js @@ -0,0 +1,8 @@ +document.addEventListener('DOMContentLoaded', function (event) { + hbspt.forms.create({ + region: 'na1', + portalId: '4129050', + formId: 'c333bcc3-f03f-4b20-84f6-f6067567cfa8', + target: '#form-div' + }) +}) diff --git a/site/js/google-analytics-message.js b/site/js/google-analytics-message.js index d5ecb91..5c3e1fa 100644 --- a/site/js/google-analytics-message.js +++ b/site/js/google-analytics-message.js @@ -28,8 +28,8 @@ if (isGoogleAnalyticsAllowedValueExist) { // display a message with a question toggleGoogleAnalyticsMessage('show') - const googleAnalyticsMessageAccept = document.getElementById('google-analytics-message-accept') - const googleAnalyticsMessageDecline = document.getElementById('google-analytics-message-decline') + const googleAnalyticsMessageAccept = document.querySelector('#google-analytics-accept') + const googleAnalyticsMessageDecline = document.querySelectorAll('#google-analytics-decline') // register a click on the "Accept" button googleAnalyticsMessageAccept.addEventListener('click', function () { @@ -38,9 +38,11 @@ if (isGoogleAnalyticsAllowedValueExist) { }) // register a click on the "Decline" button - googleAnalyticsMessageDecline.addEventListener('click', function () { - document.cookie = 'isGoogleAnalyticsAllowed=no' - toggleGoogleAnalyticsMessage('hide') + googleAnalyticsMessageDecline.forEach(el => { + el.addEventListener('click', function () { + document.cookie = 'isGoogleAnalyticsAllowed=no' + toggleGoogleAnalyticsMessage('hide') + }) }) }
\ No newline at end of file diff --git a/site/js/rive-animations.js b/site/js/rive-animations.js new file mode 100644 index 0000000..3d281d3 --- /dev/null +++ b/site/js/rive-animations.js @@ -0,0 +1,40 @@ +document.addEventListener('DOMContentLoaded', function (event) { + const canvas = document.getElementById('canvas') + if(event?.target?.body?.clientWidth > 575) { + const r = new rive.Rive({ + src: '/img/banner-bubbles.riv', + canvas: document.getElementById('canvas'), + autoplay: true, + stateMachines: 'State Machine 1', + onLoad: () => { + r.resizeDrawingSurfaceToCanvas() + }, + }) + + canvas.classList.add('canvas-present') + } + + addEventListener('resize', (e) => { + if (!e?.currentTarget?.innerWidth) return + + if (Number(e?.currentTarget?.innerWidth) > 575) { + if(canvas.classList.contains('canvas-present')) { + return + } + + canvas.classList.remove('not_visible') + canvas.classList.add('canvas-present') + const r = new rive.Rive({ + src: '/img/banner-bubbles.riv', + canvas: document.getElementById('canvas'), + autoplay: true, + stateMachines: 'State Machine 1', + onLoad: () => { + r.resizeDrawingSurfaceToCanvas() + }, + }) + } else { + canvas.classList.add('not_visible') + } + }) +}) diff --git a/site/js/scroll-detector-for-header.js b/site/js/scroll-detector-for-header.js new file mode 100644 index 0000000..db7958f --- /dev/null +++ b/site/js/scroll-detector-for-header.js @@ -0,0 +1,27 @@ +document.addEventListener('DOMContentLoaded', function () { + resolveHeadersClasses() + + document.addEventListener('scroll', () => { + resolveHeadersClasses() + }) +}) + +function resolveHeadersClasses() { + const header = document.getElementById('navigation') + const background = 'background__white' + const shadow = 'bottom-shadow' + + if(!header) return + + if(window?.scrollY && window.scrollY > 0) { + if(header.classList.contains(background)) return + + header.classList.add(background) + header.classList.add(shadow) + } else { + if(!header.classList.contains(background)) return + + header.classList.remove(background) + header.classList.remove(shadow) + } +}
\ No newline at end of file |