embeddedaichatux 1.0.3 → 1.0.5

package/EmbeddedChat.js

@@ -7,44 +7,62 @@ class EmbeddedChat {
         this.containerDiv = containerDiv;
         this.chatId = chatId;
         this.options = options || {};
-        this.avatarImage = this.options.avatarImage || '/img/avatar.jpg';
         this.isPreview = this.options.isPreview || false;
         this.previewParam = this.isPreview ? "?isPreview=true" : "";
-        this.serverUrl = this.options.serverUrl || 'https://embedgpt.chat';
+        this.serverUrl = this.options.serverUrl || 'https://embedgpt.chat/';
         this.positionStyle = this.containerDiv.dataset.position === 'in-place' ? 'width:100%; height:600px' : 'position: fixed; right: 0; bottom: 0; width: 300px; height: 600px';
         this.init();
     }
 
     init() {
+        const cleanedServerUrl = this.serverUrl.endsWith('/') ? this.serverUrl.slice(0, -1) : this.serverUrl;
+        const baseIframeUrl = `${cleanedServerUrl}/ChatUX/${this.chatId}`;
+        const previewQueryString = this.isPreview ? "?isPreview=true" : "";
+        const minimizedQueryString = this.isPreview ? "&isMinimized=true" : "?isMinimized=true";
+
+        const minimizedPositionStyle = 'position: fixed; right: 0; bottom: 0; width: 300px; height: 70px;';
+
         const iframeHtml = `
-      <iframe id="embedded-chat" style="${this.positionStyle}; display: none; border:none; overflow:hidden;" frameborder="0" sandbox="allow-same-origin allow-scripts allow-popups allow-forms" src="${this.serverUrl}/ChatUX/${this.chatId}${this.previewParam}"></iframe>
-      <div id="embedded-chat-minimized" class="container" style="display: none;; color:#43636e;width:100%; position: fixed; right: 0; bottom: 0; width: 300px; height: 50px; padding-top: 10px;padding-left: 100px;">
-        <img title="Chat" src="${this.avatarImage}" style="height:40px; border-radius: 50%;" />
-        <button id="embedded-chat-now" class="btn btn-primary">Chat Now</button>
-      </div>
+      <iframe id="embedded-chat" style="${this.positionStyle}; display: none; border:none; overflow:hidden;" frameborder="0" sandbox="allow-same-origin allow-scripts allow-popups allow-forms" src="${baseIframeUrl}${previewQueryString}"></iframe>
+      <iframe id="embedded-chat-minimized" style="${minimizedPositionStyle}; display: none; border:none; overflow:hidden;" frameborder="0" sandbox="allow-same-origin allow-scripts allow-popups allow-forms" src="${baseIframeUrl}${previewQueryString}${minimizedQueryString}"></iframe>
     `;
 
         this.containerDiv.innerHTML = iframeHtml;
         this.iframe = this.containerDiv.querySelector("#embedded-chat");
-        this.minimizedDiv = this.containerDiv.querySelector("#embedded-chat-minimized");
-        this.chatNowButton = this.containerDiv.querySelector("#embedded-chat-now");
-
-        this.chatNowButton.addEventListener("click", () => {
-            this.iframe.style.display = "block";
-            this.minimizedDiv.style.display = "none";
-        });
+        this.minimizedIframe = this.containerDiv.querySelector("#embedded-chat-minimized");
 
         window.addEventListener("message", (e) => {
-            if (e.data === "minimize") {
-                this.iframe.style.display = "none";
-                this.minimizedDiv.style.display = "block";
-            } else if (e.data === "show") {
-                this.iframe.style.display = "block";
-                this.minimizedDiv.style.display = "none";
+            // Check if the data is an object and has a message property
+            if (typeof e.data === "object" && e.data.message) {
+                if (e.data.message === "minimize") {
+                    this.iframe.style.display = "none";
+                    this.minimizedIframe.style.display = "block";
+                } else if (e.data.message === "show" || e.data.message === "maximize") {
+                    this.iframe.style.display = "block";
+                    this.minimizedIframe.style.display = "none";
+                    // Check if the data has a scale property
+                    if (e.data.scale) {
+                        // Resize the iframe according to the scale factor
+                        this.iframe.style.transform = `scale(${e.data.scale})`;
+                        this.iframe.style.transformOrigin = "bottom right";
+                    }
+                }
+            }
+            // For backward compatibility, handle the case when the data is a string
+            else if (typeof e.data === "string") {
+                if (e.data === "minimize") {
+                    this.iframe.style.display = "none";
+                    this.minimizedIframe.style.display = "block";
+                } else if (e.data === "show" || e.data === "maximize") {
+                    this.iframe.style.display = "block";
+                    this.minimizedIframe.style.display = "none";
+                }
             }
         });
     }
 
+
+
     createChatContainer() {
         const chatContainer = document.createElement('div');
         chatContainer.className = 'embedded-chat-container';

package/README.md

@@ -4,4 +4,11 @@ A lightweight and customizable embedded chat UI component that seamlessly integr
 
 ## Installation
 
-npm install aichatembedded
+To update
+1. Modify the version in package.json
+1. NPM login
+1. npm publish
+
+NPM: https://www.npmjs.com/settings/aichatepicenter/packages 
+
+

package/bin/Debug/net7.0/package.json

@@ -1,6 +1,6 @@
 {
   "name": "embeddedaichatux",
-  "version": "1.0.2",
+  "version": "1.0.5",
   "description": "A lightweight and customizable embedded AI chat UI component that seamlessly integrates into web applications, offering minimized and expanded views, with iframe-based content rendering.",
   "main": "EmbeddedChat.js",
   "scripts": {

package/obj/Debug/net7.0/AIChat.npm.csproj.FileListAbsolute.txt

@@ -1,7 +1,6 @@
 C:\Git\AIChat\AIChat.npm\bin\Debug\net7.0\appsettings.Development.json
 C:\Git\AIChat\AIChat.npm\bin\Debug\net7.0\appsettings.json
 C:\Git\AIChat\AIChat.npm\bin\Debug\net7.0\package.json
-C:\Git\AIChat\AIChat.npm\bin\Debug\net7.0\AIChat.npm.staticwebassets.runtime.json
 C:\Git\AIChat\AIChat.npm\bin\Debug\net7.0\AIChat.npm.exe
 C:\Git\AIChat\AIChat.npm\bin\Debug\net7.0\AIChat.npm.deps.json
 C:\Git\AIChat\AIChat.npm\bin\Debug\net7.0\AIChat.npm.runtimeconfig.json

package/obj/Debug/net7.0/staticwebassets.build.json

@@ -1,19 +1,11 @@
 {
   "Version": 1,
-  "Hash": "tgwDmMv0sNqFpS/YhU/JuTb1QFLHbsjUk/iZBXYCB2Y=",
+  "Hash": "XERhvELNAMUvgNoh15s4mBH/fub4TdCl8jFj3CODgig=",
   "Source": "AIChat.npm",
   "BasePath": "_content/AIChat.npm",
   "Mode": "Default",
   "ManifestType": "Build",
   "ReferencedProjectsConfiguration": [],
-  "DiscoveryPatterns": [
-    {
-      "Name": "AIChat.npm\\wwwroot",
-      "Source": "AIChat.npm",
-      "ContentRoot": "C:\\Git\\AIChat\\AIChat.npm\\wwwroot\\",
-      "BasePath": "_content/AIChat.npm",
-      "Pattern": "**"
-    }
-  ],
+  "DiscoveryPatterns": [],
   "Assets": []
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "embeddedaichatux",
-  "version": "1.0.3",
+  "version": "1.0.5",
   "description": "A lightweight and customizable embedded AI chat UI component that seamlessly integrates into web applications, offering minimized and expanded views, with iframe-based content rendering.",
   "main": "EmbeddedChat.js",
   "scripts": {

package/bin/Debug/net7.0/AIChat.npm.staticwebassets.runtime.json

@@ -1 +0,0 @@
-{"ContentRoots":["C:\\Git\\AIChat\\AIChat.npm\\wwwroot\\"],"Root":{"Children":null,"Asset":null,"Patterns":[{"ContentRootIndex":0,"Pattern":"**","Depth":0}]}}

package/obj/Debug/net7.0/staticwebassets.development.json

@@ -1 +0,0 @@
-{"ContentRoots":["C:\\Git\\AIChat\\AIChat.npm\\wwwroot\\"],"Root":{"Children":null,"Asset":null,"Patterns":[{"ContentRootIndex":0,"Pattern":"**","Depth":0}]}}