From 9e50f6ee0b27b93c756c00c3837414718e756e59 Mon Sep 17 00:00:00 2001
From: caschberg <9676154+caschberg@users.noreply.github.com>
Date: Mon, 5 Sep 2022 14:00:39 +0200
Subject: [PATCH] Make init async to ensure that all elements are present

---
 README.md    | 21 ++++++++++++++++-----
 src/index.js | 11 +++++++++--
 2 files changed, 25 insertions(+), 7 deletions(-)

diff --git a/README.md b/README.md
index 6167a58..2b13e4a 100644
--- a/README.md
+++ b/README.md
@@ -40,7 +40,8 @@ var cookify = new Cookify(
     trackingCallback,
     saveWithChange,
     saveByDefault,
-    cookieDefault
+    cookieDefault,
+    initCallback
 )
 ```
 
@@ -49,16 +50,26 @@ actionCallback -> function (default: () => {})\
 trackingCallback -> function (default: () => {})\
 saveWithChange -> boolean (default: false)\
 saveByDefault -> boolean (default: false)\
-cookieDefault -> string (default: necessary)
+cookieDefault -> string (default: necessary)\
+initCallback -> function (default: () => {})
 
-To explain the initialization better i will give a simple example with all variables and functions and how to use them. `dataName` is for the name that will show in the data storage for Cookify. The `actionCallback` is called after the user clicked on the following `data-c-action` fields. With that function you can close the cookie consent field as an example. Then you have the function `trackingCallback` for tracking user activity. This function needs a data variable where the data[0] stores all types and the viewed state and data[1] stores the actual date. `saveWithChange` can be set if you want to change the user selection when clicking on the input fields. The `saveByDefault` variable is for saving the selection when loading the first time. At least we have the `cookieDefault` variable where you can set the default cookie type name.
+To explain the initialization better i will give a simple example with all variables and functions and how to use them. `dataName` is for the name that will show in the data storage for Cookify. The `actionCallback` is called after the user clicked on the following `data-c-action` fields. With that function you can close the cookie consent field as an example. Then you have the function `trackingCallback` for tracking user activity. This function needs a data variable where the data[0] stores all types and the viewed state and data[1] stores the actual date. `saveWithChange` can be set if you want to change the user selection when clicking on the input fields. The `saveByDefault` variable is for saving the selection when loading the first time. Then we have the `cookieDefault` variable where you can set the default cookie type name. At last we have the `initCallback` function that can for example be used to determine if the consent dialog should be shown after Cookify did its initialization.
 
 ```javascript
 var cookify = new Cookify('cookie_consent', function () {
-    document.getElementById('element').style.display = none
+    document.getElementById('element').style.display = 'none'
   }, function (data) {
     console.log(data)
-  }, false, false, 'necessary')
+  }, false, false, 'necessary',
+    function(cookify) {
+        //show the cookie popup as long as the user has not seen it
+        if (cookify.getDataState(cookify.viewedName)) {
+            document.getElementById('element').style.display = 'none';
+        } else {
+            document.getElementById('element').style.display = 'block';
+        }
+    }
+)
 ```
 
 ### Query Names
diff --git a/src/index.js b/src/index.js
index 1dac02b..f00ef07 100644
--- a/src/index.js
+++ b/src/index.js
@@ -1,5 +1,5 @@
 export default class Cookify {
-    constructor(dataName = 'cookify', actionCallback = () => {}, trackingCallback = () => {}, saveWithChange = false, saveByDefault = false, cookieDefault = 'necessary') {
+    constructor(dataName = 'cookify', actionCallback = () => {}, trackingCallback = () => {}, saveWithChange = false, saveByDefault = false, cookieDefault = 'necessary', initCallback = () => {}) {
         this.dataName = dataName
         this.data = new Object
         this.query = 'data-c-'
@@ -9,8 +9,13 @@ export default class Cookify {
         this.cookieDefault = cookieDefault
         this.viewedName = 'viewed'
         this.actionCallback = actionCallback
+        this.initCallback = initCallback
 
-        this.init()
+        //only init after load so that we definitely have all elements on the page present
+        var self = this;
+        window.addEventListener('load', function(event) {
+            self.init()
+        });
     }
 
     init() {
@@ -19,6 +24,8 @@ export default class Cookify {
         this.initCheckboxes()
 
         this.initListeners()
+
+        this.initCallback(this)
     }
 
     /**