Feat: Initial configuration for cookie consent

lmc-eu · Oct 19, 2021 · 38a4221 · 38a4221
1 parent 19ff586
commit 38a4221
Show file tree

Hide file tree

Showing 7 changed files with 84 additions and 85 deletions.
diff --git a/demo/autoload.html b/demo/autoload.html
@@ -0,0 +1,18 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <title>Cookie Consent Demo</title>
+  <meta name="viewport" content="width=device-width, initial-scale=1" />
+
+  <link href="https://fonts.googleapis.com/css2?family=Inter&display=swap" rel="stylesheet" />
+  <link rel="stylesheet" href="../dist/cookieconsent.css">
+</head>
+<body>
+
+<h1>LMC Cookie Consent Manager Demo</h1>
+
+<script defer src="../dist/index.js"></script>
+
+</body>
+</html>
diff --git a/demo/index.html → demo/bootstrap.html b/demo/index.html → demo/bootstrap.html
@@ -6,19 +6,16 @@
   <meta name="viewport" content="width=device-width, initial-scale=1" />
 
   <link href="https://fonts.googleapis.com/css2?family=Inter&display=swap" rel="stylesheet" />
+  <link rel="stylesheet" href="../dist/cookieconsent.css">
 </head>
 <body>
 
-<h1>Cookie Consent Demo</h1>
+<h1>LMC Cookie Consent Manager Demo</h1>
 
-<!-- TODO remove once it's part of bundle. -->
-<script src="../node_modules/vanilla-cookieconsent/dist/cookieconsent.js"></script>
-
-<script src="../dist/cookieconsent.js"></script>
+<script defer src="../dist/bootstrap.js"></script>
 <script>
-  lmcCookieConsent({
-    current_lang : 'en',
-    theme_css : '../dist/cookieconsent.css', // relative to HTML
+  window.addEventListener('load', function(){
+    initLmcCookieConsentManager();
   });
 </script>
 

diff --git a/scripts/build.js b/scripts/build.js
@@ -1,36 +1,32 @@
 const { build } = require('esbuild')
 
 build({
-  entryPoints: ['src/index.js'],
+  entryPoints: ['src/autoload.js'],
   bundle: true,
-  minify: true,
-  sourcemap: true,
   target: 'es2017',
-  outfile: 'dist/index.min.js',
+  outfile: 'dist/autoload.js',
 }).catch((error) => {
   console.error(error)
   process.exit(1)
 })
 
 build({
-  entryPoints: ['src/index.js'],
+  entryPoints: ['src/bootstrap.js'],
   bundle: true,
-  minify: false,
-  sourcemap: true,
   target: 'es2017',
-  outfile: 'dist/index.js',
+  outfile: 'dist/bootstrap.js',
 }).catch((error) => {
   console.error(error)
   process.exit(1)
 })
 
 build({
-  entryPoints: ['src/LmcCookieConsent.js'],
+  entryPoints: ['src/LmcCookieConsentManager.js'],
   bundle: true,
   minify: false,
   sourcemap: false,
   target: 'es2019',
-  outfile: 'dist/LmcCookieConsent.js',
+  outfile: 'dist/LmcCookieConsentManager.js',
 }).catch((error) => {
   console.error(error)
   process.exit(1)

diff --git a/src/LmcCookieConsentManager.js b/src/LmcCookieConsentManager.js
@@ -0,0 +1,39 @@
+import 'vanilla-cookieconsent';
+
+import { config as configEn } from './languages/en';
+
+const defaultOptions = { currentLang: 'en', themeCss: '', config: {}}
+
+const LmcCookieConsentManager = (options = defaultOptions) => {
+  const {
+    currentLang,
+    themeCss,
+    config,
+  } = options;
+
+  const cookieconsent = window.initCookieConsent();
+
+  cookieconsent.run({
+    current_lang: currentLang,
+    theme_css: themeCss,
+    cookie_name: 'lmc_ccm',
+    cookie_expiration : 365,
+    gui_options: {
+      consent_modal : {
+          layout : 'bar',                 // box/cloud/bar
+          position : 'bottom center',     // bottom/middle/top + left/right/center
+          transition: 'slide'             // zoom/slide
+      },
+    },
+    onAccept: () => {
+      alert('Cookie Consent Accepted');
+    },
+    languages: {
+      en: configEn,
+    },
+    // override default config if necessary
+    ...config,
+  });
+};
+
+export default LmcCookieConsentManager;
diff --git a/src/autoload.js b/src/autoload.js
@@ -0,0 +1,5 @@
+import LmcCookieConsent from './LmcCookieConsentManager';
+
+window.addEventListener('load', function(){
+  LmcCookieConsentManager();
+});
diff --git a/src/bootstrap.js b/src/bootstrap.js
@@ -0,0 +1,11 @@
+import LmcCookieConsentManager from './LmcCookieConsentManager';
+
+(function() {
+  const init = 'initLmcCookieConsentManager';
+  /**
+   * Make LmcCookieConsent object accessible globally
+   */
+  if(typeof window[init] !== 'function'){
+      window[init] = LmcCookieConsentManager
+  }
+})();
diff --git a/src/cookieconsent.js b/src/cookieconsent.js