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

@@ -2388,6 +2388,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 {

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>
@@ -1827,6 +1827,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>
@@ -8062,10 +8072,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.100.00"></script>
-    <script src="modules/ui/general.js?v=1.104.3"></script>
+    <script src="modules/ui/options.js?v=1.105.0"></script>
-    <script src="modules/ui/options.js?v=1.104.3"></script>
+    <script src="main.js?v=1.105.0"></script>
-    <script src="main.js?v=1.104.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>

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);

main.js

@@ -317,7 +317,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
@@ -367,6 +368,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,

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}) => {
+  theme.forEach(({name, value, h, s, l, alpha}) => {
-    sx.setProperty(name, getRGBA(h, s, l, alpha));
+    if (value !== undefined) sx.setProperty(name, value);
+    else sx.setProperty(name, getRGBA(h, s, l, alpha));
   });
 }
 

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>