add chatbot

Author: karstenkoehler

config.json

@@ -3,7 +3,7 @@
   "baseUrl": "https://techradar.aoe.com",
   "editUrl": "https://github.dev/AOEpeople/techradar/blob/main/radar/{release}/{id}.md",
   "logoFile": "logo.svg",
-  "jsFile": "",
+  "jsFile": "js/init.js",
   "toggles": {
     "showChart": true,
     "showTagFilter": true,

nginx/conf.d/default.conf

@@ -10,7 +10,7 @@ server {
         root        /usr/share/nginx/html;
         index       index.html index.htm;
 
-        add_header  Content-Security-Policy "frame-ancestors 'self'; default-src 'self' 'unsafe-inline'; script-src 'self' 'unsafe-inline' cookie-cdn.cookiepro.com; connect-src 'self' cookie-cdn.cookiepro.com privacyportal.cookiepro.com; img-src *";
+        add_header  Content-Security-Policy "frame-ancestors 'self'; default-src 'self' 'unsafe-inline'; img-src *";
         add_header  Strict-Transport-Security "max-age=31536000";
         add_header  Cache-Control "max-age=86400";
         add_header  X-Content-Type-Options nosniff;
@@ -23,6 +23,5 @@ server {
     }
 
     error_page  404              /404.html;
-
 }
 

public/js/init.js

@@ -0,0 +1,23 @@
+(function () {
+    const chatbotElement = document.createElement("div");
+    chatbotElement.id = "chatbot";
+    chatbotElement.style =
+        "position: fixed; bottom: 0; right: 0; z-index: 9999; margin-right: 0; margin-bottom: 20px";
+    document.body.append(chatbotElement);
+
+    // initially load chatbot script
+    const chatbot = document.createElement("script");
+    chatbot.src = "/chatbot/chatbot.umd.js";
+    chatbot.type = "text/javascript";
+    chatbot.onload = function() {
+        Chatbot.init({height: 700, width: 400, botName: "TechScout"})
+        Chatbot.show();
+    }
+    document.head.append(chatbot);
+
+    // load chatbot styles
+    const chatbotStyles = document.createElement("link");
+    chatbotStyles.rel = "stylesheet";
+    chatbotStyles.href = "/chatbot/style.css";
+    document.head.append(chatbotStyles);
+})();