releasebird-javascript-sdk 1.0.13 → 1.0.15

package/src/RbirdSessionManager.js

@@ -32,55 +32,67 @@ export default class RbirdSessionManager {
     init(apiKey) {
         this.apiKey = apiKey;
         this.identify = this.getState()?.identify;
-        const http = new XMLHttpRequest();
-        http.open("GET", `${API}/ewidget`);
-        http.setRequestHeader("Content-Type", "application/json;charset=UTF-8");
-        http.setRequestHeader("apiKey", apiKey);
-        http.onerror = function () {
-            //handle error
-        };
-        const self = this;
-        http.onreadystatechange = function (e) {
-            if (http.readyState === XMLHttpRequest.DONE) {
-                if (http.status === 200 || http.status === 201) {
-                    try {
-                        self.widgetSettings = JSON.parse(http.responseText);
-                        Rbird.setStyles(
-                            self.widgetSettings.backgroundColor,
-                            self.widgetSettings.textColor,
-                            self.widgetSettings.launcherColor,
-                            self.widgetSettings.launcherPosition,
-                            self.widgetSettings.spaceLeftRight,
-                            self.widgetSettings.spaceBottom
-                        );
-                        RbirdWebsiteWidget.getInstance().renderWebsiteWidget();
-                        RbirdWebsiteWidget.getInstance().styleWidget();
-                    } catch (e) {
+
+        return new Promise((resolve, reject) => {
+            const http = new XMLHttpRequest();
+            http.open("GET", `${API}/ewidget`);
+            http.setRequestHeader("Content-Type", "application/json;charset=UTF-8");
+            http.setRequestHeader("apiKey", apiKey);
+
+            http.onerror = function () {
+                reject(new Error("Network error"));
+            };
+
+            const self = this;
+            http.onreadystatechange = async function (e) {
+                if (http.readyState === XMLHttpRequest.DONE) {
+                    if (http.status === 200 || http.status === 201) {
+                        try {
+                            self.widgetSettings = JSON.parse(http.responseText);
+                            Rbird.setStyles(
+                                self.widgetSettings.backgroundColor,
+                                self.widgetSettings.textColor,
+                                self.widgetSettings.launcherColor,
+                                self.widgetSettings.launcherPosition,
+                                self.widgetSettings.spaceLeftRight,
+                                self.widgetSettings.spaceBottom
+                            );
+                            await RbirdWebsiteWidget.getInstance().renderWebsiteWidget();
+                            RbirdWebsiteWidget.getInstance().styleWidget();
+                            resolve(self.widgetSettings);  // Erfolgreich -> Promise resolved
+                        } catch (e) {
+                            reject(new Error("Error parsing widget settings"));
+                        }
+                    } else {
+                        reject(new Error(`Request failed with status ${http.status}`));
                     }
                 }
-                //reject();
-            }
-        };
-        http.send();
-        let anonymous = window.localStorage.getItem("Rbird_I");
-        if (!anonymous) {
-            const i = this.generateRandomString();
-            window.localStorage.setItem('Rbird_I', i);
-            this.anonymousIdentifier = i;
-        } else {
-            this.anonymousIdentifier = anonymous;
-        }
-        this.anonymousIdentifier = this.anonymousIdentifier.replace("\"", "");
-        setInterval(() => {
-            let state = this.getState();
-            if (state?.identify && state?.identify?.properties['external_user_id']) {
-                const http = new XMLHttpRequest();
-                http.open("POST", `${API}/ewidget/ping`);
-                http.setRequestHeader("Content-Type", "application/json;charset=UTF-8");
-                http.setRequestHeader("apiKey", apiKey);
-                http.send(JSON.stringify(state.identify));
+            };
+
+            http.send();
+
+            let anonymous = window.localStorage.getItem("Rbird_I");
+            if (!anonymous) {
+                const i = this.generateRandomString();
+                window.localStorage.setItem('Rbird_I', i);
+                this.anonymousIdentifier = i;
+            } else {
+                this.anonymousIdentifier = anonymous;
             }
-        }, 30000);
+            this.anonymousIdentifier = this.anonymousIdentifier.replace("\"", "");
+
+            // Intervall bleibt unverändert
+            setInterval(() => {
+                let state = this.getState();
+                if (state?.identify && state?.identify?.properties['external_user_id']) {
+                    const http = new XMLHttpRequest();
+                    http.open("POST", `${API}/ewidget/ping`);
+                    http.setRequestHeader("Content-Type", "application/json;charset=UTF-8");
+                    http.setRequestHeader("apiKey", apiKey);
+                    http.send(JSON.stringify(state.identify));
+                }
+            }, 30000);
+        });
     }
 
     getState() {

package/src/RbirdWebsiteWidget.js

@@ -32,6 +32,8 @@ export default class RbirdWebsiteWidget {
 
     hideWidgetButton;
 
+    noButton;
+
     static getInstance() {
         if (!this.instance) {
             this.instance = new RbirdWebsiteWidget();
@@ -45,33 +47,50 @@ export default class RbirdWebsiteWidget {
     }
 
     renderWebsiteWidget() {
-        if (this.websiteWidgetVisible) {
-            return;
-        }
-        this.websiteWidgetVisible = true;
+        return new Promise((resolve, reject) => {
+            // Überprüfen, ob das Widget bereits sichtbar ist
+            if (this.websiteWidgetVisible) {
+                resolve();  // Wenn das Widget bereits sichtbar ist, wird das Promise sofort aufgelöst
+                return;
+            }
 
-        let elem = document.createElement("div");
-        elem.onclick = () => {
-            this.openWebsiteWidget();
-        };
-        document.body.appendChild(elem);
-        this.websiteWidget = elem;
-
-        if (RbirdSessionManager.getInstance().widgetSettings?.allowClose) {
-            this.hideWidgetButton = document.createElement("div");
-            this.hideWidgetButton.className = "hideWidgetButton";
-            this.hideWidgetButton.innerHTML = hideWidgetImage;
-            this.hideWidgetButton.onclick = () => this.handleHideWidgetButton();
-            this.hideWidgetButton.style.display = "block";
-            document.body.appendChild(this.hideWidgetButton);
-        }
+            this.websiteWidgetVisible = true;
+
+            try {
+                // Widget-Element erstellen und zum DOM hinzufügen
+                let elem = document.createElement("div");
+                elem.onclick = () => {
+                    this.openWebsiteWidget();
+                };
+                document.body.appendChild(elem);
+                this.websiteWidget = elem;
+
+                // Überprüfen, ob das Schließen des Widgets erlaubt ist
+                if (RbirdSessionManager.getInstance().widgetSettings?.allowClose && !this.noButton) {
+                    this.hideWidgetButton = document.createElement("div");
+                    this.hideWidgetButton.className = "hideWidgetButton";
+                    this.hideWidgetButton.innerHTML = hideWidgetImage;
+                    this.hideWidgetButton.onclick = () => this.handleHideWidgetButton();
+                    this.hideWidgetButton.style.display = "block";
+                    document.body.appendChild(this.hideWidgetButton);
+                }
+
+                // Badge erstellen und zum DOM hinzufügen
+                this.countBadge = document.createElement("span");
+                this.countBadge.className = "rbird_badge";
+                this.countBadge.style.display = "none";
+                document.body.appendChild(this.countBadge);
 
-        this.countBadge = document.createElement("span");
-        this.countBadge.className = "rbird_badge";
-        this.countBadge.style.display = "none";
-        document.body.appendChild(this.countBadge);
+                // Stil des Widgets anpassen
+                this.styleWidget();
 
-        this.styleWidget();
+                // Erfolgreich aufgelöst, nachdem das Widget hinzugefügt und gestylt wurde
+                resolve();
+            } catch (error) {
+                // Falls ein Fehler während der Widget-Erstellung oder des DOM-Manipulationsprozesses auftritt, wird das Promise abgelehnt
+                reject(new Error("Error rendering the website widget: " + error.message));
+            }
+        });
     }
 
     isOpen() {
@@ -172,7 +191,7 @@ export default class RbirdWebsiteWidget {
             if (this.countBadge) {
                 this.countBadge.innerText = "0";
                 this.countBadge.style.display = "none";
-                if (!this.isOpen() && this.hideWidgetButton) {
+                if (!this.isOpen() && this.hideWidgetButton && !this.noButton) {
                     this.hideWidgetButton.style.display = "block";
                 }
             }
@@ -187,9 +206,9 @@ export default class RbirdWebsiteWidget {
     }
 
     showButton(showButton) {
-       if (showButton) {
+       if (showButton && !this.noButton) {
            this.websiteWidget.style.display = 'block';
-           if (this.hideWidgetButton) {
+           if (this.hideWidgetButton && !this.noButton) {
                this.hideWidgetButton.style.display = "block";
            }
        } else {
@@ -206,13 +225,15 @@ export default class RbirdWebsiteWidget {
                 type: 'close',
             }, '*');
         }
-        if (this.hideWidgetButton && this.countBadge.style.display === "none") {
+        if (this.hideWidgetButton && this.countBadge.style.display === "none" && !this.noButton) {
             this.hideWidgetButton.style.display = "block";
         }
         RbirdUtils.removeClass(this.widgetContent, "cta__modal--visible");
 
         this.initButton();
-        this.websiteWidget.style.display = 'block';
+        if (!this.noButton) {
+            this.websiteWidget.style.display = 'block';
+        }
 
         this.websiteWidget.onclick = () => this.openWebsiteWidget();
         this.unregisterListeners();

package/src/index.js

@@ -62,11 +62,14 @@ class Rbird {
                 console.warn("Rbird already initialized.");
                 return;
             }
-            RbirdSessionManager.getInstance().init(apiKey);
-            instance.initialized = true;
-            if (showButton != null) {
-                RbirdWebsiteWidget.getInstance().showButton(showButton);
-            }
+            RbirdWebsiteWidget.getInstance().noButton = !showButton;
+            RbirdSessionManager.getInstance().init(apiKey).then(() => {
+                instance.initialized = true;
+                if (showButton != null) {
+                    RbirdWebsiteWidget.getInstance().showButton(showButton);
+                }
+            })
+
         } catch (e) {
             console.error(e);
         }