Merge branch 'master' of github.com:HackTricks-wiki/hacktricks-cloud

theme/ai.js

@@ -5,17 +5,33 @@
 
 (() => {
   const KEY = 'htSummerDiscountsDismissed';
-  const IMG = '/images/discount.jpeg';
+  const IMG = '/ima * HackTricks AI Chat Widget v1.17 – enhanced resizable sidebar
+ * ---------------------------------------------------
+ * ❶ Markdown rendering + sanitised (same as before)
+ * ❷ ENHANCED: improved drag‑to‑resize panel with better UXdiscount.jpeg';
   const TXT = 'Click here for HT Summer Discounts, Last Days!';
   const URL = 'https://training.hacktricks.xyz';
 
-  # Stop if user already dismissed
+  // Stop if user already dismissed
   if (localStorage.getItem(KEY) === 'true') return;
 
-  # Quick helper
+  // Quick helper
-  const $ = (tag, css = '') => Object.assign(document.createElement(tag), { style: css });
+  const $ = (tag, css = '') => Object.assign(document.cr    p.innerHTML = `
+      <div id="ht-ai-header">
+        <strong>HackTricks AI Chat</strong>
+        <span style="font-size:11px;opacity:0.6;margin-left:8px;">↔ Drag edge to resize</span>
+        <div class="ht-actions">
+          <button id="ht-ai-reset" title="Reset">↺</button>
+          <span id="ht-ai-close" title="Close">✖</span>
+        </div>
+      </div>
+      <div id="ht-ai-chat"></div>
+      <div id="ht-ai-input">
+        <textarea id="ht-ai-question" placeholder="Type your question…"></textarea>
+        <button id="ht-ai-send">Send</button>
+      </div>`;tag), { style: css });
 
-  # --- Overlay (blur + dim) ---
+  // --- Overlay (blur + dim) ---
   const overlay = $('div', `
     position: fixed; inset: 0;
     background: rgba(0,0,0,.4);
@@ -24,7 +40,7 @@
     z-index: 10000;
   `);
 
-  # --- Modal ---
+  // --- Modal ---
   const modal = $('div', `
     max-width: 90vw; width: 480px;
     background: #fff; border-radius: 12px; overflow: hidden;
@@ -33,10 +49,10 @@
     display: flex; flex-direction: column; align-items: stretch;
   `);
 
-  # --- Title bar (link + close) ---
+  // --- Title bar (link + close) ---
   const titleBar = $('div', `
     position: relative;
-    padding: 1rem 2.5rem 1rem 1rem; # room for the close button
+    padding: 1rem 2.5rem 1rem 1rem; // room for the close button
     text-align: center;
     background: #222; color: #fff;
     font-size: 1.3rem; font-weight: 700;
@@ -53,7 +69,7 @@
   link.textContent = TXT;
   titleBar.appendChild(link);
 
-  # Close "X" (no persistence)
+  // Close "X" (no persistence)
   const closeBtn = $('button', `
     position: absolute; top: .25rem; right: .5rem;
     background: transparent; border: none;
@@ -65,11 +81,11 @@
   closeBtn.onclick = () => overlay.remove();
   titleBar.appendChild(closeBtn);
 
-  # --- Image ---
+  // --- Image ---
   const img = $('img');
   img.src = IMG; img.alt = TXT; img.style.width = '100%';
 
-  # --- Checkbox row ---
+  // --- Checkbox row ---
   const label = $('label', `
     display: flex; align-items: center; justify-content: center; gap: .6rem;
     padding: 1rem; font-size: 1rem; color: #222; cursor: pointer;
@@ -83,7 +99,7 @@
   };
   label.append(cb, document.createTextNode("Don't show again"));
 
-  # --- Assemble & inject ---
+  // --- Assemble & inject ---
   modal.append(titleBar, img, label);
   overlay.appendChild(modal);
 
@@ -93,28 +109,28 @@
     document.body.appendChild(overlay);
   }
 })();
-
 */
 
 
-
-
 /**
  * HackTricks AI Chat Widget v1.16 – resizable sidebar
  * ---------------------------------------------------
  * ❶ Markdown rendering + sanitised (same as before)
  * ❷ NEW: drag‑to‑resize panel, width persists via localStorage
  */
+
+
+
 (function () {
-  const LOG = "[HackTricks‑AI]";
+  const LOG = "[HackTricks-AI]";
   /* ---------------- User‑tunable constants ---------------- */
   const MAX_CONTEXT  = 3000;   // highlighted‑text char limit
   const MAX_QUESTION = 500;    // question char limit
   const MIN_W        = 250;    // ← resize limits →
-  const MAX_W        = 600;
+  const MAX_W        = 800;
   const DEF_W        = 350;    // default width (if nothing saved)
   const TOOLTIP_TEXT =
-    "💡 Highlight any text on the page,\nthen click to ask HackTricks AI about it";
+    "💡 Highlight any text on the page,\nthen click to ask HackTricks AI about it";
 
   const API_BASE  = "https://www.hacktricks.ai/api/assistants/threads";
   const BRAND_RED = "#b31328";
@@ -345,8 +361,9 @@
 #ht-ai-panel{position:fixed;top:0;right:0;height:100%;max-width:90vw;background:#000;color:#fff;display:flex;flex-direction:column;transform:translateX(100%);transition:transform .3s ease;z-index:100000;font-family:system-ui,-apple-system,Segoe UI,Roboto,"Helvetica Neue",Arial,sans-serif}
 #ht-ai-panel.open{transform:translateX(0)}
 @media(max-width:768px){#ht-ai-panel{display:none}}
-#ht-ai-header{display:flex;justify-content:space-between;align-items:center;padding:12px 16px;border-bottom:1px solid #333}
+#ht-ai-header{display:flex;justify-content:space-between;align-items:center;padding:12px 16px;border-bottom:1px solid #333;flex-wrap:wrap}
-#ht-ai-header .ht-actions{display:flex;gap:8px;align-items:center}
+#ht-ai-header strong{flex-shrink:0}
+#ht-ai-header .ht-actions{display:flex;gap:8px;align-items:center;margin-left:auto}
 #ht-ai-close,#ht-ai-reset{cursor:pointer;font-size:18px;background:none;border:none;color:#fff;padding:0}
 #ht-ai-close:hover,#ht-ai-reset:hover{opacity:.7}
 #ht-ai-chat{flex:1;overflow-y:auto;padding:16px;display:flex;flex-direction:column;gap:12px;font-size:14px}
@@ -367,8 +384,10 @@
 ::selection{background:#ffeb3b;color:#000}
 ::-moz-selection{background:#ffeb3b;color:#000}
 /* NEW: resizer handle */
-#ht-ai-resizer{position:absolute;left:0;top:0;width:6px;height:100%;cursor:ew-resize;background:transparent}
+#ht-ai-resizer{position:absolute;left:0;top:0;width:8px;height:100%;cursor:ew-resize;background:rgba(255,255,255,.08);border-right:1px solid rgba(255,255,255,.15);transition:background .2s ease}
-#ht-ai-resizer:hover{background:rgba(255,255,255,.05)}`;
+#ht-ai-resizer:hover{background:rgba(255,255,255,.15);border-right:1px solid rgba(255,255,255,.3)}
+#ht-ai-resizer:active{background:rgba(255,255,255,.25)}
+#ht-ai-resizer::before{content:'';position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:2px;height:20px;background:rgba(255,255,255,.4);border-radius:1px}`;
     const s = document.createElement("style");
     s.id = "ht-ai-style";
     s.textContent = css;
@@ -432,24 +451,43 @@
 
     const onMove = (e) => {
       if (!dragging) return;
-      const dx = startX - e.clientX;           // dragging leftwards ⇒ +dx
+      e.preventDefault();
+      const clientX = e.clientX || (e.touches && e.touches[0].clientX);
+      const dx = startX - clientX;           // dragging leftwards ⇒ +dx
       let newW = startW + dx;
       newW = Math.min(Math.max(newW, MIN_W), MAX_W);
       panel.style.width = newW + "px";
     };
+
     const onUp = () => {
       if (!dragging) return;
       dragging = false;
+      handle.style.background = "";
+      document.body.style.userSelect = "";
+      document.body.style.cursor = "";
       localStorage.setItem("htAiWidth", parseInt(panel.style.width, 10));
       document.removeEventListener("mousemove", onMove);
       document.removeEventListener("mouseup", onUp);
+      document.removeEventListener("touchmove", onMove);
+      document.removeEventListener("touchend", onUp);
     };
-    handle.addEventListener("mousedown", (e) => {
+
+    const onStart = (e) => {
+      e.preventDefault();
       dragging = true;
-      startX = e.clientX;
+      startX = e.clientX || (e.touches && e.touches[0].clientX);
       startW = parseInt(window.getComputedStyle(panel).width, 10);
+      handle.style.background = "rgba(255,255,255,.25)";
+      document.body.style.userSelect = "none";
+      document.body.style.cursor = "ew-resize";
+      
       document.addEventListener("mousemove", onMove);
       document.addEventListener("mouseup", onUp);
-    });
+      document.addEventListener("touchmove", onMove, { passive: false });
+      document.addEventListener("touchend", onUp);
+    };
+
+    handle.addEventListener("mousedown", onStart);
+    handle.addEventListener("touchstart", onStart, { passive: false });
   }
 })();