fix: slash command does not work (#207)

src-tauri/src/scripts/cmd.js

@@ -1,6 +1,6 @@
 // *** Core Script - CMD ***
 
-$(function() {
+function init() {
   const styleDom = document.createElement('style');
   styleDom.innerHTML = `form {
     position: relative;
@@ -94,6 +94,7 @@ $(function() {
     new MutationObserver(function (mutationsList) {
       for (const mutation of mutationsList) {
         if (mutation.target.getAttribute('id') === '__next') {
+          initDom();
           cmdTip();
         }
         if (mutation.target.getAttribute('class') === 'chat-model-cmd-list') {
@@ -117,7 +118,7 @@ $(function() {
       subtree: true,
     });
   }, 300);
-});
+}
 
 async function cmdTip() {
   initDom();
@@ -143,9 +144,9 @@ async function cmdTip() {
       modelDom.innerHTML = `<div>${v.map(itemDom).join('')}</div>`;
       window.__CHAT_MODEL_CMD_PROMPT__ = v[0]?.prompt.trim();
       window.__CHAT_MODEL_CMD__ = v[0]?.cmd.trim();
-      window.__list = modelDom.querySelectorAll('.cmd-item');
-      window.__index = 0;
-      window.__list[window.__index].classList.add('selected');
+      window.__cmd_list = modelDom.querySelectorAll('.cmd-item');
+      window.__cmd_index = 0;
+      window.__cmd_list[window.__cmd_index].classList.add('selected');
     };
     const setPrompt = (v = '') => {
       if (v.trim()) {
@@ -162,28 +163,28 @@ async function cmdTip() {
       }
 
       // ------------------ Keyboard scrolling (ArrowUp | ArrowDown) --------------------------
-      if (event.keyCode === 38 &&  window.__index > 0) { // ArrowUp
-        window.__list[window.__index].classList.remove('selected');
-        window.__index = window.__index - 1;
-        window.__list[window.__index].classList.add('selected');
-        window.__CHAT_MODEL_CMD_PROMPT__ = decodeURIComponent(window.__list[window.__index].getAttribute('data-prompt'));
-        searchInput.value = `/${window.__list[window.__index].getAttribute('data-cmd')}`;
+      if (event.keyCode === 38 &&  window.__cmd_index > 0) { // ArrowUp
+        window.__cmd_list[window.__cmd_index].classList.remove('selected');
+        window.__cmd_index = window.__cmd_index - 1;
+        window.__cmd_list[window.__cmd_index].classList.add('selected');
+        window.__CHAT_MODEL_CMD_PROMPT__ = decodeURIComponent(window.__cmd_list[window.__cmd_index].getAttribute('data-prompt'));
+        searchInput.value = `/${window.__cmd_list[window.__cmd_index].getAttribute('data-cmd')}`;
         event.preventDefault();
       }
 
-      if (event.keyCode === 40 && window.__index < window.__list.length - 1) { // ArrowDown
-        window.__list[window.__index].classList.remove('selected');
-        window.__index = window.__index + 1;
-        window.__list[window.__index].classList.add('selected');
-        window.__CHAT_MODEL_CMD_PROMPT__ = decodeURIComponent(window.__list[window.__index].getAttribute('data-prompt'));
-        searchInput.value = `/${window.__list[window.__index].getAttribute('data-cmd')}`;
+      if (event.keyCode === 40 && window.__cmd_index < window.__cmd_list.length - 1) { // ArrowDown
+        window.__cmd_list[window.__cmd_index].classList.remove('selected');
+        window.__cmd_index = window.__cmd_index + 1;
+        window.__cmd_list[window.__cmd_index].classList.add('selected');
+        window.__CHAT_MODEL_CMD_PROMPT__ = decodeURIComponent(window.__cmd_list[window.__cmd_index].getAttribute('data-prompt'));
+        searchInput.value = `/${window.__cmd_list[window.__cmd_index].getAttribute('data-cmd')}`;
         event.preventDefault();
       }
 
       const containerHeight = modelDom.offsetHeight;
-      const itemHeight = window.__list[0].offsetHeight + 1;
+      const itemHeight = window.__cmd_list[0].offsetHeight + 1;
 
-      const itemTop = window.__list[window.__index].offsetTop;
+      const itemTop = window.__cmd_list[window.__cmd_index].offsetTop;
       const itemBottom = itemTop + itemHeight;
       if (itemTop < modelDom.scrollTop || itemBottom > modelDom.scrollTop + containerHeight) {
         modelDom.scrollTop = itemTop;
@@ -239,8 +240,8 @@ async function cmdTip() {
         event.preventDefault();
       }
     }
-    searchInput.removeEventListener('keydown', cmdKeydown);
-    searchInput.addEventListener('keydown', cmdKeydown);
+    searchInput.removeEventListener('keydown', cmdKeydown, { capture: true });
+    searchInput.addEventListener('keydown', cmdKeydown, { capture: true });
 
     function cmdInput() {
       if (searchInput.value === '') {
@@ -277,8 +278,19 @@ function initDom() {
   const modelDom = document.querySelector('.chat-model-cmd-list');
   if (modelDom) {
     modelDom.innerHTML = '';
-    delete window.__CHAT_MODEL_CMD_PROMPT__;
-    delete window.__CHAT_MODEL_CMD__;
-    delete window.__CHAT_MODEL_STATUS__;
   }
+  delete window.__CHAT_MODEL_CMD_PROMPT__;
+  delete window.__CHAT_MODEL_CMD__;
+  delete window.__CHAT_MODEL_STATUS__;
+  delete window.__cmd_list;
+  delete window.__cmd_index;
 }
+
+if (
+  document.readyState === "complete" ||
+  document.readyState === "interactive"
+) {
+  init();
+} else {
+  document.addEventListener("DOMContentLoaded", init);
+}

src-tauri/src/scripts/core.js

@@ -40,7 +40,7 @@ window.uid = uid;
 window.invoke = invoke;
 window.transformCallback = transformCallback;
 
-$(async function () {
+async function init() {
   if (__TAURI_METADATA__.__currentWindow.label === 'tray') {
     document.getElementsByTagName('html')[0].style['font-size'] = '70%';
   }
@@ -91,4 +91,13 @@ $(async function () {
   window.__sync_prompts = async function() {
     await invoke('sync_prompts', { time: Date.now() });
   }
-});
+}
+
+if (
+  document.readyState === "complete" ||
+  document.readyState === "interactive"
+) {
+  init();
+} else {
+  document.addEventListener("DOMContentLoaded", init);
+}

src-tauri/src/scripts/dalle2.js

@@ -1,6 +1,6 @@
 // *** Core Script - DALL·E 2 ***
 
-$(function () {
+function init() {
   document.addEventListener("click", (e) => {
     const origin = e.target.closest("a");
     if (!origin || !origin.target) return;
@@ -28,4 +28,13 @@ $(function () {
       searchInput.value = query;
     }
   }, 200)
-})
+}
+
+if (
+  document.readyState === "complete" ||
+  document.readyState === "interactive"
+) {
+  init();
+} else {
+  document.addEventListener("DOMContentLoaded", init);
+}

src-tauri/src/scripts/export.js

@@ -1,6 +1,6 @@
 // *** Core Script - Export ***
 
-$(async function () {
+async function init() {
   const buttonOuterHTMLFallback = `<button class="btn flex justify-center gap-2 btn-neutral" id="download-png-button">Try Again</button>`;
   if (window.innerWidth < 767) return;
   const chatConf = await invoke('get_chat_conf') || {};
@@ -24,7 +24,7 @@ $(async function () {
       removeButtons();
     }
   }, 1000);
-})
+}
 
 const Format = {
   PNG: "png",
@@ -271,3 +271,12 @@ function setIcon(type) {
     md: `<svg class="chatappico md" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1380" width="200" height="200"><path d="M128 128h768a42.666667 42.666667 0 0 1 42.666667 42.666667v682.666666a42.666667 42.666667 0 0 1-42.666667 42.666667H128a42.666667 42.666667 0 0 1-42.666667-42.666667V170.666667a42.666667 42.666667 0 0 1 42.666667-42.666667z m170.666667 533.333333v-170.666666l85.333333 85.333333 85.333333-85.333333v170.666666h85.333334v-298.666666h-85.333334l-85.333333 85.333333-85.333333-85.333333H213.333333v298.666666h85.333334z m469.333333-128v-170.666666h-85.333333v170.666666h-85.333334l128 128 128-128h-85.333333z" p-id="1381" fill="currentColor"></path></svg>`
   }[type];
 }
+
+if (
+  document.readyState === "complete" ||
+  document.readyState === "interactive"
+) {
+  init();
+} else {
+  document.addEventListener("DOMContentLoaded", init);
+}

src-tauri/src/scripts/popup.core.js

@@ -1,6 +1,6 @@
 // *** Core Script - DALL·E 2 Core ***
 
-$(async function () {
+async function init() {
   const chatConf = await invoke('get_chat_conf') || {};
   if (!chatConf.popup_search) return;
   if (!window.FloatingUIDOM) return;
@@ -72,4 +72,13 @@ $(async function () {
       });
     }
   });
-})
+}
+
+if (
+  document.readyState === "complete" ||
+  document.readyState === "interactive"
+) {
+  init();
+} else {
+  document.addEventListener("DOMContentLoaded", init);
+}