@alan-ai/alan-sdk-web 1.8.93 → 1.8.94

package/dist/alan_lib.js

@@ -98913,7 +98913,7 @@
   function broadcastThemeToIframes() {
     let theme;
     try {
-      theme = uiState?.currentTheme;
+      theme = uiState?.currentTheme || window["alanCurrentTheme"];
     } catch (error) {
       theme = window["alanCurrentTheme"];
     }
@@ -100397,7 +100397,7 @@
         color:  ${textChatOptions?.notifications?.color || `#ffffff`};
         border-radius: 50%;
         z-index: ${uiState.btn.zIndex + 1};
-        display: flex;
+        display: ${window._alanBtnState?.textChat?.notifications?.enabled ? "flex" : "none"};
         flex-direction: column;
         align-items: center;
         justify-content: center;
@@ -102611,9 +102611,49 @@ code.hljs {
 
   // alan_btn/src/autosync.ts
   var html2canvas = require_html2canvas();
+  var SEND_PAGE_STATE_THROTTLE_MS = 2e3;
   var popstateListenerWasAdded = false;
-  var prevPageContent = "";
+  var requestCounter = 0;
+  var lastSendPageStateTime = 0;
+  var pendingSync = false;
+  var pendingSyncTimeout = null;
   var ALAN_BTN_PAGE_SYNC_EVENT = "alan-btn__page-sync";
+  var prevPageState = {
+    contentHash: "",
+    scrollX: 0,
+    scrollY: 0,
+    viewportWidth: 0,
+    viewportHeight: 0
+  };
+  function generateContentHash(content) {
+    let hash = 0;
+    for (let i = 0; i < content.length; i++) {
+      const char = content.charCodeAt(i);
+      hash = (hash << 5) - hash + char;
+      hash = hash & hash;
+    }
+    return hash.toString();
+  }
+  function hasPageStateChanged(pageContent, forceUpdate) {
+    if (forceUpdate)
+      return true;
+    const currentScrollX = window.pageXOffset || document.documentElement.scrollLeft;
+    const currentScrollY = window.pageYOffset || document.documentElement.scrollTop;
+    const currentViewportWidth = window.innerWidth || document.documentElement.clientWidth;
+    const currentViewportHeight = window.innerHeight || document.documentElement.clientHeight;
+    const currentContentHash = generateContentHash(pageContent);
+    const hasChanged = prevPageState.contentHash !== currentContentHash || Math.abs(prevPageState.scrollX - currentScrollX) > 10 || Math.abs(prevPageState.scrollY - currentScrollY) > 10 || prevPageState.viewportWidth !== currentViewportWidth || prevPageState.viewportHeight !== currentViewportHeight;
+    if (hasChanged) {
+      prevPageState = {
+        contentHash: currentContentHash,
+        scrollX: currentScrollX,
+        scrollY: currentScrollY,
+        viewportWidth: currentViewportWidth,
+        viewportHeight: currentViewportHeight
+      };
+    }
+    return hasChanged;
+  }
   function manageSyncPageStateListeners(isEnabled) {
     if (isEnabled) {
       if (popstateListenerWasAdded !== true) {
@@ -102625,47 +102665,118 @@ code.hljs {
       window.removeEventListener(ALAN_BTN_PAGE_SYNC_EVENT, listenForPageChanges);
     }
   }
+  async function attemptPageStateSync(onSendCb, forceUpdate = false) {
+    const currentTime = performance.now();
+    const timeSinceLastCall = currentTime - lastSendPageStateTime;
+    if (timeSinceLastCall < SEND_PAGE_STATE_THROTTLE_MS && !forceUpdate) {
+      const delayMs = SEND_PAGE_STATE_THROTTLE_MS - timeSinceLastCall + 50;
+      if (pendingSyncTimeout) {
+        clearTimeout(pendingSyncTimeout);
+      }
+      pendingSync = true;
+      pendingSyncTimeout = setTimeout(() => {
+        pendingSync = false;
+        pendingSyncTimeout = null;
+        sendPageState(onSendCb, true);
+      }, delayMs);
+      return;
+    }
+    if (pendingSyncTimeout) {
+      clearTimeout(pendingSyncTimeout);
+      pendingSyncTimeout = null;
+      pendingSync = false;
+    }
+    await sendPageState(onSendCb, forceUpdate);
+  }
   function syncPageState(onSendCb, forceUpdate) {
-    sendPageState(onSendCb, forceUpdate);
+    attemptPageStateSync(onSendCb, forceUpdate);
   }
   function listenForPageChanges() {
     sendPageState();
   }
-  async function captureScreenshot() {
-    const canvas = await html2canvas(document.body, {
-      logging: false,
-      scale: 1
-    });
-    return canvas.toDataURL("image/png");
+  async function captureScreenshot(requestId) {
+    if (!document.body) {
+      throw new Error("Document body not available");
+    }
+    const bodyRect = document.body.getBoundingClientRect();
+    const maxWidth = 1280;
+    const maxHeight = 1024;
+    const scale = Math.min(maxWidth / bodyRect.width, maxHeight / bodyRect.height, 1);
+    try {
+      const canvas = await html2canvas(document.body, {
+        logging: false,
+        scale,
+        useCORS: false,
+        allowTaint: false,
+        backgroundColor: "#ffffff",
+        removeContainer: true,
+        ignoreElements: (element) => {
+          if (!element || !element.tagName)
+            return false;
+          if (element.classList) {
+            if (element.classList.contains("hidden"))
+              return true;
+          }
+          return false;
+        }
+      });
+      await new Promise((resolve) => setTimeout(resolve, 0));
+      const dataURL = canvas.toDataURL("image/jpeg", 0.8);
+      canvas.width = 0;
+      canvas.height = 0;
+      return dataURL;
+    } catch (error) {
+      throw error;
+    }
   }
   async function sendPageState(onSendCb, forceUpdate) {
-    var page = document.createElement("html");
-    page.innerHTML = document.getElementsByTagName("html")[0].innerHTML;
-    var scripts = page.getElementsByTagName("script");
-    var styles = page.getElementsByTagName("style");
-    var alanBtnEl = page.getElementsByClassName("alanBtn-root");
-    var debugChatEl = page.getElementsByClassName("alanStudio-debug-chat");
-    var elementsToRemove = [...scripts, ...styles, ...alanBtnEl, ...debugChatEl];
-    for (var i = 0; i < elementsToRemove.length; i++) {
-      elementsToRemove[i].remove();
-    }
-    const pageContent = page.outerHTML;
-    if (onSendCb) {
-      onSendCb();
-    }
-    if (prevPageContent === pageContent && !forceUpdate) {
-      return;
-    }
-    prevPageContent = pageContent;
-    if (window.tutorProject) {
-      let params = {
+    lastSendPageStateTime = performance.now();
+    const currentRequestId = ++requestCounter;
+    try {
+      if (!document.getElementsByTagName("html")[0]) {
+        throw new Error("HTML document not available");
+      }
+      const page = document.createElement("html");
+      page.innerHTML = document.getElementsByTagName("html")[0].innerHTML;
+      const scripts = page.getElementsByTagName("script");
+      const styles = page.getElementsByTagName("style");
+      const alanBtnEl = page.getElementsByClassName("alanBtn-root");
+      const debugChatEl = page.getElementsByClassName("alanStudio-debug-chat");
+      const elementsToRemove = [...scripts, ...styles, ...alanBtnEl, ...debugChatEl];
+      for (let i = 0; i < elementsToRemove.length; i++) {
+        if (elementsToRemove[i] && elementsToRemove[i].remove) {
+          elementsToRemove[i].remove();
+        }
+      }
+      const pageContent = page.outerHTML;
+      if (onSendCb) {
+        onSendCb();
+      }
+      const hasChanged = hasPageStateChanged(pageContent, forceUpdate);
+      if (!hasChanged) {
+        return;
+      }
+      if (!window.tutorProject) {
+        return;
+      }
+      const params = {
         html: pageContent,
-        url: window.location.href
+        url: window.location.href,
+        scrollPosition: {
+          x: prevPageState.scrollX,
+          y: prevPageState.scrollY
+        },
+        viewport: {
+          width: prevPageState.viewportWidth,
+          height: prevPageState.viewportHeight
+        }
       };
       if (window._alanBtnState?.pageState?.screenshot?.enabled) {
-        params.screenshot = await captureScreenshot();
+        params.screenshot = await captureScreenshot(currentRequestId);
       }
       window.tutorProject.call("syncPageState", params);
+    } catch (error) {
+      throw error;
     }
   }
 
@@ -109370,6 +109481,19 @@ code.hljs {
       return null;
     }
   }
+  function applyThemeToHtmlContent(htmlContent2, theme) {
+    if (!theme || theme !== "light" && theme !== "dark") {
+      return htmlContent2;
+    }
+    const parser2 = new DOMParser();
+    const doc2 = parser2.parseFromString(htmlContent2, "text/html");
+    const htmlElement = doc2.documentElement;
+    if (htmlElement) {
+      const themeClass = theme === "light" ? "light-theme" : "dark-theme";
+      htmlElement.classList.add(themeClass);
+    }
+    return doc2.documentElement.outerHTML;
+  }
   function extractScriptContents(html) {
     const scriptContents = [];
     const parser2 = new DOMParser();
@@ -109405,7 +109529,8 @@ code.hljs {
     projectId,
     environment,
     requestIds,
-    headContent
+    headContent,
+    data: data2
   }) {
     const chatConteiner = chatEl.cloneNode(true);
     const images = Array.from(chatConteiner.querySelectorAll("img"));
@@ -109425,6 +109550,7 @@ code.hljs {
           continue;
         }
         let initHtmlContent = await response.text();
+        initHtmlContent = applyThemeToHtmlContent(initHtmlContent, data2?.theme);
         let { htmlContent: htmlContent2 } = await inlineExternalResources(initHtmlContent);
         const initIframeFn2 = extractFunctionWithRegex(htmlContent2, "initIframe");
         if (initIframeFn2) {
@@ -109878,6 +110004,8 @@ code.hljs {
         };
     <\/script>
         `;
+    const txtMessages = data2?.textChatMessages ? JSON.stringify(data2?.textChatMessages, null, 2) : '"no-provided"';
+    const socketMessages = data2?.socketMessages ? JSON.stringify(data2?.socketMessages, null, 2) : '"no-provided"';
     const newHtmlContent = `
     <!DOCTYPE html>
     <html lang="en">
@@ -109890,6 +110018,15 @@ code.hljs {
         <script src="${LIBS_PREFIX}/alan_markdown.js" type="text/javascript"><\/script>
         <script src="${LIBS_PREFIX}/highlight.min.js?v=2" type="text/javascript"><\/script>
         ${headContent ? headContent : ""}
+
+        <script>
+        console.info('Alan lib v: ${window.alanLib?.version || "-"}, exporter v: 1.0.1');
+        function showAlanDebugInfo() {
+            console.info('Messages in chat:', ${txtMessages});
+            console.info('Messages in socket:', ${socketMessages});
+        }
+        <\/script>
+
         <style>
         * {
             box-sizing: border-box;
@@ -110164,7 +110301,7 @@ code.hljs {
         }
     } 
         
-    window.alanCurrentTheme = '${uiState.currentTheme}';
+    window.alanCurrentTheme = '${data2?.theme || "null"}';
     
     <\/script>
 
@@ -110611,7 +110748,8 @@ code.hljs {
 
   // alan_btn/alan_btn.ts
   (function(ns) {
-    uiState.lib.version = "alan-version.1.8.93".replace("alan-version.", "");
+    uiState.lib.version = "alan-version.1.8.94".replace("alan-version.", "");
+    window.alanLib = { version: "alan-version.1.8.93".replace("alan-version.", "") };
     if (window.alanBtn) {
       console.warn("Alan: the Alan Button source code has already added (v." + uiState.lib.version + ")");
     }
@@ -110854,6 +110992,8 @@ code.hljs {
           alanAudio.off("command", onCommandCbInMicBtn);
           alanAudio.off("afterText", onAfterTextCbInMicBtn);
           document.removeEventListener("click", alanBtnClickEventListener);
+          document.removeEventListener("click", performLikeOrDislike);
+          document.removeEventListener("click", onCopyClick);
           rootEl.innerHTML = "";
           btnInstance = null;
           if (!isTutorMode()) {
@@ -110978,6 +111118,11 @@ code.hljs {
           screenshot: {
             enabled: false
           }
+        },
+        textChat: {
+          notifications: {
+            enabled: false
+          }
         }
       };
       if (isTutorMode()) {
@@ -112301,6 +112446,7 @@ code.hljs {
         console.log("Alan: options received");
         console.timeEnd("Alan: receiving options time");
         saveOptions(data2);
+        window._alanBtnState.textChat.notifications.enabled = data2?.web?.chatOptions?.textChat?.notifications?.enabled;
         window._alanBtnState.pageState.screenshot.enabled = data2?.web?.pageState?.screenshot?.enabled;
         uiState.textChat.autocomplete.enabled = data2?.web?.chatOptions?.textChat?.textarea?.autocomplete?.enabled;
         uiState.textChat.maxCharactersCount = data2?.web?.chatOptions?.textChat?.textarea?.maxCharactersCount ? +data2?.web?.chatOptions?.textChat?.textarea?.maxCharactersCount : 2e4;
@@ -112960,7 +113106,7 @@ ${curDialogId}`);
         return `${buildImagesContent(msg)}${buildMsgTextContent(msg)}${buildLinksContent(msg)}${buildCommandsBlock(msg, uiState?.textChat?.options)}${buildMsgIncommingLoader(msg)}${addGraphIcon(msg)}`;
       }
       initMathJax(textChatMessages.length, (i2) => getMsgElForMathJax(i2));
-      document.addEventListener("click", (e) => {
+      function onCopyClick(e) {
         let clickedEl = e.target;
         clickedEl = clickedEl.closest(".alan-btn__chat-response__copy-btn");
         if (clickedEl) {
@@ -113000,7 +113146,8 @@ ${LEARN_MORE_LABEL}
           }
           enableTextareaInTheChat();
         }
-      }, false);
+      }
+      document.addEventListener("click", onCopyClick, false);
       window.addEventListener("click", (0, import_lodash2.debounce)((e) => {
         if (isTutorMode())
           return;
@@ -113210,7 +113357,7 @@ ${LEARN_MORE_LABEL}
                 innerEl.insertAdjacentHTML("beforeend", buildCommandsBlock(msg, uiState?.textChat?.options));
                 innerEl.insertAdjacentHTML("beforeend", buildMsgIncommingLoader(updatedMsg));
                 innerEl.insertAdjacentHTML("beforeend", addGraphIcon(updatedMsg));
-                const newSuggestions = msg?.suggestions;
+                const newSuggestions = updatedMsg?.suggestions;
                 if (newSuggestions?.length > 0) {
                   if (innerEl.nextElementSibling?.classList.contains("alan-btn__chat-suggestions")) {
                     innerEl.nextElementSibling.remove();
@@ -114310,18 +114457,8 @@ ${LEARN_MORE_LABEL}
         ];
         const styles = head.querySelectorAll(styleSelectors.join(", "));
         const combinedStylesHTML = Array.from(styles).map((style) => style.outerHTML).join("\n");
-        const txtMessages = JSON.stringify(textChatMessages, null, 2);
-        const socketMessages = JSON.stringify(uiState.socketMessages, null, 2);
         const customHeadContent = `
             ${combinedStylesHTML}
-
-            <script>
-            function showAlanDebugLogs() {
-                console.info('Alan lib v: ${uiState.lib.version}');
-                console.info('Messages in chat:', ${txtMessages});
-                console.info('Messages in socket:', ${socketMessages});
-            }
-            <\/script>
             `;
         const initChat = document.querySelector("#chatMessagesWrapper");
         if (!initChat)
@@ -114343,7 +114480,12 @@ ${LEARN_MORE_LABEL}
             projectId,
             environment: getEnvironment(),
             requestIds: textChatMessages?.length > 0 ? textChatMessages.filter((m) => m.type === "response" /* Response */).map((m) => getMsgReqId(m)) : [],
-            headContent: customHeadContent
+            headContent: customHeadContent,
+            data: {
+              textChatMessages,
+              socketMessages: uiState.socketMessages,
+              theme: uiState.currentTheme
+            }
           });
           if (saveChatStateBtnImg) {
             saveChatStateBtnImg.classList.remove("saving");
@@ -114386,7 +114528,7 @@ ${LEARN_MORE_LABEL}
       function showChatNotifications() {
         if (unreadChatMsgCount > 0) {
           chatNotificationsBubble.innerHTML = unreadChatMsgCount > 99 ? `99+` : `${unreadChatMsgCount}`;
-          chatNotificationsBubble.style.display = "flex";
+          chatNotificationsBubble.classList.remove("super-hidden");
         }
       }
       function manageUnmuteAlanIcon(iconEl, unmuted) {
@@ -114445,7 +114587,7 @@ ${LEARN_MORE_LABEL}
       }
       function hideChatNotifications() {
         unreadChatMsgCount = 0;
-        chatNotificationsBubble.style.display = "none";
+        chatNotificationsBubble.classList.add("super-hidden");
         for (let i2 = 0; i2 < textChatMessages.length; i2++) {
           textChatMessages[i2].read = true;
         }