From 1ffcea2d3afb62eb6451683dde67c7af9e1933cc Mon Sep 17 00:00:00 2001
From: Azgaar <maxganiev@yandex.com>
Date: Sun, 22 Sep 2024 14:59:53 +0200
Subject: [PATCH] AI Assistant widget (#1115)

* feat: add assistan widget

* feat: remove gtm

* feat: assistant - minify js, add option UI

* feat: assistant - ability to toggle assistant

* chore: update version to 1.102.00

* chore: resolve version conflict

* chore: cleanup

* chore: cleanup

* feat: ai widget - improve style

---------

Co-authored-by: Azgaar <azgaar.fmg@yandex.com>
---
 index.css              | 15 +++++++++++++++
 index.html             | 19 ++++++++++++++-----
 libs/openwidget.min.js |  1 +
 main.js                | 28 +++++++++++++++++++++++++++-
 modules/ui/options.js  |  7 +++++--
 versioning.js          |  3 ++-
 6 files changed, 64 insertions(+), 9 deletions(-)
 create mode 100644 libs/openwidget.min.js

diff --git a/index.css b/index.css
index dba16da2..8d90b329 100644
--- a/index.css
+++ b/index.css
@@ -2432,6 +2432,21 @@ svg.button {
   }
 }
 
+#chat-widget-minimized {
+  animation: fadeIn 1s ease-in;
+  transform: scale(0.65);
+  opacity: var(--bg-opacity);
+}
+
+@keyframes fadeIn {
+  from {
+    opacity: 0;
+  }
+  to {
+    opacity: var(--bg-opacity);
+  }
+}
+
 @media print {
   div,
   canvas {
diff --git a/index.html b/index.html
index e96b4e3c..493c58a1 100644
--- a/index.html
+++ b/index.html
@@ -138,7 +138,7 @@
       }
     </style>
 
-    <link rel="preload" href="index.css?v=1.104.0" as="style" onload="this.onload=null; this.rel='stylesheet'" />
+    <link rel="preload" href="index.css?v=1.105.0" as="style" onload="this.onload=null; this.rel='stylesheet'" />
     <link rel="preload" href="icons.css" as="style" onload="this.onload=null; this.rel='stylesheet'" />
     <link rel="preload" href="libs/jquery-ui.css" as="style" onload="this.onload=null; this.rel='stylesheet'" />
   </head>
@@ -1847,6 +1847,16 @@
               <td></td>
             </tr>
 
+            <tr data-tip="Toggle Azgaar Assistant (help bubble on the bottom right corner)">
+              <td></td>
+              <td>Azgaar assistant</td>
+              <td>
+                <select id="azgaarAssistant" data-stored="azgaarAssistant">
+                  <option value="show" selected>Show</option>
+                  <option value="hide">Hide</option>
+              </td>
+            </tr>
+
             <tr data-tip="Select speech synthesis voice to pronounce generated names">
               <td></td>
               <td>Speaker voice</td>
@@ -8370,10 +8380,9 @@
     <script src="modules/ui/layers.js?v=1.101.00"></script>
     <script src="modules/ui/measurers.js?v=1.99.00"></script>
     <script src="modules/ui/style-presets.js?v=1.100.00"></script>
-
-    <script src="modules/ui/general.js?v=1.104.3"></script>
-    <script src="modules/ui/options.js?v=1.104.3"></script>
-    <script src="main.js?v=1.104.0"></script>
+    <script src="modules/ui/general.js?v=1.100.00"></script>
+    <script src="modules/ui/options.js?v=1.105.0"></script>
+    <script src="main.js?v=1.105.0"></script>
 
     <script defer src="modules/relief-icons.js?v=1.99.05"></script>
     <script defer src="modules/ui/style.js?v=1.104.0"></script>
diff --git a/libs/openwidget.min.js b/libs/openwidget.min.js
new file mode 100644
index 00000000..89583d8f
--- /dev/null
+++ b/libs/openwidget.min.js
@@ -0,0 +1 @@
+window.__ow=window.__ow||{},window.__ow.organizationId="7bb02e70-bcef-4861-a4e6-d259b0d10e24",window.__ow.integration_name="manual_settings",window.__ow.product_name="openwidget",function(n,e,t){function o(n){return c._h?c._h.apply(null,n):c._q.push(n)}var c={_q:[],_h:null,_v:"2.0",on:function(){o(["on",t.call(arguments)])},once:function(){o(["once",t.call(arguments)])},off:function(){o(["off",t.call(arguments)])},get:function(){if(!c._h)throw Error("[OpenWidget] You can't use getters before load.");return o(["get",t.call(arguments)])},call:function(){o(["call",t.call(arguments)])},init:function(){var n=e.createElement("script");n.async=!0,n.type="text/javascript",n.src="https://cdn.openwidget.com/openwidget.js",e.head.appendChild(n)}};n.__ow.asyncInit||c.init(),n.OpenWidget=n.OpenWidget||c}(window,document,[].slice);
\ No newline at end of file
diff --git a/main.js b/main.js
index f2873ebb..fa5790bd 100644
--- a/main.js
+++ b/main.js
@@ -318,7 +318,8 @@ async function generateMapOnLoad() {
   applyLayersPreset(); // apply saved layers preset and reder layers
   drawLayers();
   fitMapToScreen();
-  focusOn(); // focus on point, cell or burg from MFCG based on url searchParams
+  focusOn(); // based on searchParams focus on point, cell or burg from MFCG
+  toggleAssistant();
 }
 
 // focus on coordinates, cell or burg provided in searchParams
@@ -368,6 +369,31 @@ function focusOn() {
   }
 }
 
+let isAssistantLoaded = false;
+function toggleAssistant() {
+  const assistantContainer = byId("chat-widget-container");
+  const showAssistant = byId("azgaarAssistant").value === "show";
+
+  if (showAssistant) {
+    if (isAssistantLoaded) {
+      assistantContainer.style.display = "block";
+    } else {
+      import("./libs/openwidget.min.js").then(() => {
+        isAssistantLoaded = true;
+        setTimeout(() => {
+          const bubble = byId("chat-widget-minimized");
+          if (bubble) {
+            bubble.dataset.tip = "Click to open the Assistant";
+            bubble.on("mouseover", showDataTip);
+          }
+        }, 5000);
+      });
+    }
+  } else if (isAssistantLoaded) {
+    assistantContainer.style.display = "none";
+  }
+}
+
 // find burg for MFCG and focus on it
 function findBurgForMFCG(params) {
   const cells = pack.cells,
diff --git a/modules/ui/options.js b/modules/ui/options.js
index a6640aed..1ac4c8ad 100644
--- a/modules/ui/options.js
+++ b/modules/ui/options.js
@@ -148,6 +148,7 @@ optionsContent.addEventListener("change", event => {
   else if (id === "yearInput") changeYear();
   else if (id === "eraInput") changeEra();
   else if (id === "stateLabelsModeInput") options.stateLabelsMode = value;
+  else if (id === "azgaarAssistant") toggleAssistant();
 });
 
 optionsContent.addEventListener("click", event => {
@@ -446,6 +447,7 @@ function changeDialogsTheme(themeColor, transparency) {
   };
 
   const theme = [
+    {name: "--bg-opacity", value: alpha},
     {name: "--bg-main", h, s, l, alpha},
     {name: "--bg-lighter", h, s, l: l + 0.02, alpha},
     {name: "--bg-light", h, s: s - 0.02, l: l + 0.06, alpha},
@@ -458,8 +460,9 @@ function changeDialogsTheme(themeColor, transparency) {
   ];
 
   const sx = document.documentElement.style;
-  theme.forEach(({name, h, s, l, alpha}) => {
-    sx.setProperty(name, getRGBA(h, s, l, alpha));
+  theme.forEach(({name, value, h, s, l, alpha}) => {
+    if (value !== undefined) sx.setProperty(name, value);
+    else sx.setProperty(name, getRGBA(h, s, l, alpha));
   });
 }
 
diff --git a/versioning.js b/versioning.js
index bf3deac2..afa76381 100644
--- a/versioning.js
+++ b/versioning.js
@@ -12,7 +12,7 @@
  *
  * Example: 1.102.2 -> Major version 1, Minor version 102, Patch version 2
  */
-const VERSION = "1.104.15";
+const VERSION = "1.105.0";
 if (parseMapVersion(VERSION) !== VERSION) alert("versioning.js: Invalid format or parsing function");
 
 {
@@ -36,6 +36,7 @@ if (parseMapVersion(VERSION) !== VERSION) alert("versioning.js: Invalid format o
 
       <ul>
         <strong>Latest changes:</strong>
+        <li>Azgaar Bot to answer questions and provide help</li>
         <li>Labels: ability to set letter spacing</li>
         <li>Zones update</li>
         <li>Notes Editor: on-demand AI text generation</li>