Merge pull request #40 from GleapSDK/tooltipsnew

Tooltips

demo/index.html

@@ -326,7 +326,12 @@ <h2 class="sub-headline">
     }
 
   </script>
-
+  <script>
+    window.intercomSettings = {
+      api_base: "https://api-iam.intercom.io",
+      app_id: "vm8dcoo6"
+    };
+  </script>
 </body>
 
 </html>

demo/main.js

@@ -35,4 +35,4 @@ Gleap.on("tool-execution", (tool) => {
 
 Gleap.setTicketAttribute("notes", "This is a test value.");*/
 
-Gleap.initialize("ogWhNhuiZcGWrva5nlDS8l7a78OfaLlV");
+Gleap.initialize("Vx0SXWPHGU7Af54CabNL07k6HRELKTxu");

package.json

@@ -1,6 +1,6 @@
 {
   "name": "gleap",
-  "version": "13.5.16",
+  "version": "13.6.0",
   "main": "build/cjs/index.js",
   "module": "build/esm/index.mjs",
   "exports": {
@@ -70,7 +70,8 @@
     }
   },
   "dependencies": {
+    "@floating-ui/dom": "^1.6.3",
     "pick-dom-element": "^0.2.3",
     "unique-selector": "^0.5.0"
   }
-}
+}

src/Gleap.js

@@ -1183,6 +1183,50 @@ if (typeof window !== "undefined") {
   }
 }
 
+const handleGleapLink = (href) => {
+  try {
+    // gleap://article/123
+    const urlParts = href.split('/');
+    const type = urlParts[2];
+    if (type === 'article') {
+      const identifier = urlParts[3];
+      Gleap.openHelpCenterArticle(identifier);
+    }
+
+    if (type === 'collection') {
+      const identifier = urlParts[3];
+      Gleap.openHelpCenterCollection(identifier);
+    }
+
+    if (type === 'survey') {
+      const identifier = urlParts[3];
+      Gleap.showSurvey(identifier);
+    }
+
+    if (type === 'bot') {
+      const identifier = urlParts[3];
+      Gleap.startBot(identifier);
+    }
+
+    if (type === 'news') {
+      const identifier = urlParts[3];
+      Gleap.openNews(identifier);
+    }
+
+    if (type === 'checklist') {
+      const identifier = urlParts[3];
+      Gleap.startChecklist(identifier);
+    }
+
+    if (type === 'tour') {
+      const identifier = urlParts[3];
+      Gleap.startProductTour(identifier);
+    }
+  } catch (e) {
+    console.error("Failed to handle Gleap link: ", href);
+  }
+}
+
 export {
   GleapNetworkIntercepter,
   GleapAudioManager,
@@ -1206,5 +1250,6 @@ export {
   GleapFrameManager,
   GleapMetaDataManager,
   GleapTagManager,
+  handleGleapLink,
 };
 export default Gleap;

src/GleapAdminManager.js

@@ -106,6 +106,13 @@ export default class GleapAdminManager {
             self.configData = data.data;
             self.initAdminHelper();
           }
+
+          if (data.name === "smartlink-search-result") {
+            this.sendMessageToTourBuilder({
+              name: "smartlink-search-result",
+              data: data.data,
+            });
+          }
         }
 
         if (data.type === "tourbuilder") {
@@ -116,6 +123,13 @@ export default class GleapAdminManager {
             });
           }
 
+          if (data.name === "smartlink-search") {
+            this.sendMessage({
+              name: "smartlink-search",
+              data: data.data,
+            });
+          }
+
           if (data.name === "save") {
             this.sendMessage({
               name: "save",
@@ -141,7 +155,7 @@ export default class GleapAdminManager {
             }
           }
         }
-      } catch (exp) {}
+      } catch (exp) { }
     });
 
     this.sendMessage({
@@ -226,7 +240,7 @@ export default class GleapAdminManager {
     var elem = document.createElement("div");
     elem.className =
       "gleap-admin-frame-container";
-    elem.innerHTML = `<iframe src="https://app.gleap.io/producttourbuilder" class="gleap-admin-frame" scrolling="no" title="Gleap Admin Window" allow="autoplay; encrypted-media; fullscreen;" frameborder="0"></iframe>`;
+    elem.innerHTML = `<iframe src="https://app.gleap.io/${this?.configData?.type === 'tooltips' ? 'tooltipbuilder' : 'producttourbuilder'}" class="gleap-admin-frame" scrolling="no" title="Gleap Admin Window" allow="autoplay; encrypted-media; fullscreen;" frameborder="0"></iframe>`;
     document.body.appendChild(elem);
 
     this.gleapFrameContainer = elem;

src/GleapClickListener.js

@@ -1,4 +1,4 @@
-import { GleapConsoleLogManager, GleapFrameManager } from "./Gleap";
+import { GleapConsoleLogManager, GleapFrameManager, handleGleapLink } from "./Gleap";
 import { getDOMElementDescription } from "./GleapHelper";
 
 export default class GleapClickListener {
@@ -11,14 +11,21 @@ export default class GleapClickListener {
   }
 
   start() {
-    document.addEventListener("click", (event) => {
-      if (!event.target) {
+    document.addEventListener("click", (e) => {
+      if (!e.target) {
         return;
       }
 
+      if (e.target.tagName === 'A' && e.target.protocol === 'gleap:') {
+        e.preventDefault();
+
+        const href = e.target.href;
+        handleGleapLink(href);
+      }
+
       if (!GleapFrameManager.getInstance().isOpened()) {
         GleapConsoleLogManager.getInstance().addLog(
-          getDOMElementDescription(event.target),
+          getDOMElementDescription(e.target),
           "CLICK"
         );
       }

src/GleapSession.js

@@ -1,5 +1,6 @@
 import { GleapEventManager, GleapTranslationManager, GleapFrameManager, GleapNotificationManager, GleapStreamedEvent, GleapBannerManager } from "./Gleap";
 import { eraseGleapCookie, getGleapCookie, loadFromGleapCache, saveToGleapCache, setGleapCookie } from "./GleapHelper";
+import GleapTooltipManager from "./GleapTooltipManager";
 
 export default class GleapSession {
   apiUrl = "https://api.gleap.io";
@@ -201,6 +202,9 @@ export default class GleapSession {
 
             // Initially track.
             GleapStreamedEvent.getInstance().restart();
+
+            // Load tooltips.
+            GleapTooltipManager.getInstance().load();
           } catch (exp) { }
         } else {
           if (http.status !== 429) {
@@ -341,6 +345,8 @@ export default class GleapSession {
                 // Initially track.
                 GleapStreamedEvent.getInstance().restart();
 
+                // Load tooltips.
+                GleapTooltipManager.getInstance().load();
                 resolve(sessionData);
               } catch (exp) {
                 reject(exp);