Merge pull request #14 from tagconcierge/feature/body-event-on-librar…

…y-loaded Feature/body event on library loaded
tagconcierge · May 14, 2024 · 377633a · 377633a
2 parents 638d6df + 3fc705c
commit 377633a
Show file tree

Hide file tree

Showing 4 changed files with 40 additions and 15 deletions.
diff --git a/.github/workflows/main.yaml b/.github/workflows/main.yaml
@@ -0,0 +1,22 @@
+name: app-build
+on:
+  push:
+    branches:
+      - main
+      - develop
+jobs:
+  build:
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v4
+      - uses: actions/setup-node@v4
+        with:
+          node-version: 21
+      - run: yarn && yarn build
+      - name: get-npm-version
+        id: package-version
+        uses: martinbeentjes/[email protected]
+      - uses: actions/upload-artifact@v4
+        with:
+          name: consent-banner-${{ steps.package-version.outputs.current-version}}
+          path: dist/consent-banner-js/${{ steps.package-version.outputs.current-version}}
diff --git a/docker-compose.yml b/docker-compose.yml
@@ -1,6 +1,6 @@
 services:
   dev:
-    image: node
+    image: node:21
     entrypoint:
     command: npm run serve
     volumes:

diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@tagconcierge/consent-banner",
-  "version": "1.1.1",
+  "version": "1.2.0",
   "description": "A zero-dependency, lightweight (~3kB), consent platform agnostic, cookie banner for any website.",
   "main": "src/app.js",
   "keywords": ["consent banner", "consent mode", "gtm consent", "cookie banner"],

diff --git a/src/app.js b/src/app.js
@@ -55,6 +55,10 @@ function addEventListener(elements, event, callback) {
   }
 }
 
+function dispatchBodyEvent(eventName) {
+  document.body.dispatchEvent(new CustomEvent('consent-banner.' + eventName));
+}
+
 // State Management
 function isConsentStateProvided(consentState) {
   return null !== consentState;
@@ -255,7 +259,7 @@ function consentBannerJsMain(config) {
     updateSettings(settings, config, consentState);
     saveConsentState(consentState);
     hideMain(main);
-    document.body.dispatchEvent(new CustomEvent('consent-banner.hidden'));
+    dispatchBodyEvent('hidden');
   });
 
   addEventListener(modal.querySelector('[href="#accept"]'), 'click', function(ev) {
@@ -269,7 +273,7 @@ function consentBannerJsMain(config) {
     updateSettings(settings, config, consentState);
     saveConsentState(consentState);
     hideMain(main);
-    document.body.dispatchEvent(new CustomEvent('consent-banner.hidden'));
+    dispatchBodyEvent('hidden');
   });
 
   addEventListener(settings.querySelector('[href="#close"]'), 'click', function(ev) {
@@ -284,7 +288,7 @@ function consentBannerJsMain(config) {
     ev.preventDefault();
     hideModal(main);
     showSettings(main);
-    document.body.dispatchEvent(new CustomEvent('consent-banner.shown'));
+    dispatchBodyEvent('shown');
   });
 
   addEventListener(modal.querySelector('[href="#reject"]'),'click', function(ev) {
@@ -298,7 +302,7 @@ function consentBannerJsMain(config) {
     saveConsentState(consentState);
     updateSettings(settings, config, consentState);
     hideMain(main);
-    document.body.dispatchEvent(new CustomEvent('consent-banner.hidden'));
+    dispatchBodyEvent('hidden');
   });
 
   addEventListener(settings.querySelector('[href="#reject"]'), 'click', function(ev) {
@@ -312,7 +316,7 @@ function consentBannerJsMain(config) {
     saveConsentState(consentState);
     updateSettings(settings, config, consentState);
     hideMain(main);
-    document.body.dispatchEvent(new CustomEvent('consent-banner.hidden'));
+    dispatchBodyEvent('hidden');
   });
 
 
@@ -329,21 +333,21 @@ function consentBannerJsMain(config) {
     saveConsentState(consentState);
     updateSettings(settings, config, consentState);
     hideMain(main);
-    document.body.dispatchEvent(new CustomEvent('consent-banner.hidden'));
+    dispatchBodyEvent('hidden');
   });
 
   addEventListener(body.querySelector('[href$="#consent-banner-settings"]'), 'click', function(ev) {
     ev.preventDefault();
     showSettings(main);
     hideModal(main);
-    document.body.dispatchEvent(new CustomEvent('consent-banner.shown'));
+    dispatchBodyEvent('shown');
   });
 
   addEventListener(body, 'consent-banner.show-settings', function(ev) {
     ev.preventDefault();
     showSettings(main);
     hideModal(main);
-    document.body.dispatchEvent(new CustomEvent('consent-banner.shown'));
+    dispatchBodyEvent('shown');
   });
 
   body.appendChild(main);
@@ -372,7 +376,7 @@ function consentBannerJsMain(config) {
         'margin-left': '20px'
       });
       showModal(main);
-      document.body.dispatchEvent(new CustomEvent('consent-banner.shown'));
+      dispatchBodyEvent('shown');
     }
 
     if ('modal' === config.display.mode) {
@@ -386,12 +390,12 @@ function consentBannerJsMain(config) {
         display: 'block'
       });
       showModal(main);
-      document.body.dispatchEvent(new CustomEvent('consent-banner.shown'));
+      dispatchBodyEvent('shown');
     }
 
     if ('settings' === config.display.mode) {
       showSettings(main);
-      document.body.dispatchEvent(new CustomEvent('consent-banner.shown'));
+      dispatchBodyEvent('shown');
     }
   }
 
@@ -403,5 +407,4 @@ window.cookiesBannerJs = function(overrideLoadConsentState, overrideSaveConsentS
   ready(consentBannerJsMain.bind(null, config));
 }
 
-
-
+dispatchBodyEvent('ready');