diff options
Diffstat (limited to 'main.js')
| -rw-r--r-- | main.js | 972 |
1 files changed, 0 insertions, 972 deletions
diff --git a/main.js b/main.js deleted file mode 100644 index 8bba38e..0000000 --- a/main.js +++ /dev/null @@ -1,972 +0,0 @@ -// ═══════════════════════════════════════════════════════════ -// SOURCES -// ═══════════════════════════════════════════════════════════ -const SOURCES = { - dictionary: { - bang: "!d", - count: 0, - enabled: true, - fetch: async (q) => { - const r = await fetch( - `https://api.dictionaryapi.dev/api/v2/entries/en/${encodeURIComponent(q)}`, - ); - if (!r.ok) return []; - const d = await r.json(); - return d.slice(0, 3).flatMap((e) => - e.meanings.slice(0, 2).map((m) => ({ - meta: { phonetic: e.phonetic }, - snippet: m.definitions[0]?.definition || "", - source: "dictionary", - title: `${e.word} [${m.partOfSpeech}]`, - url: e.sourceUrls?.[0] || "#", - })), - ); - }, - name: "DICTIONARY", - }, - github: { - bang: "!g", - count: 0, - enabled: true, - fetch: async (q) => { - const r = await fetch( - `https://api.github.com/search/repositories?q=${encodeURIComponent(q)}&per_page=8&sort=stars`, - ); - const d = await r.json(); - return (d.items || []).map((i) => ({ - meta: { forks: i.forks_count, lang: i.language, stars: i.stargazers_count }, - snippet: i.description || "NO DESCRIPTION", - source: "github", - title: i.full_name, - url: i.html_url, - })); - }, - name: "GITHUB", - }, - hackernews: { - bang: "!hn", - count: 0, - enabled: true, - fetch: async (q) => { - const r = await fetch( - `https://hn.algolia.com/api/v1/search?query=${encodeURIComponent(q)}&hitsPerPage=8`, - ); - const d = await r.json(); - return (d.hits || []) - .filter((h) => h.title) - .map((h) => ({ - meta: { comments: h.num_comments, points: h.points }, - snippet: `${h.points || 0} POINTS // ${h.author}`, - source: "hackernews", - title: h.title, - url: h.url || `https://news.ycombinator.com/item?id=${h.objectID}`, - })); - }, - name: "HACKERNEWS", - }, - news: { - bang: "!n", - count: 0, - enabled: true, - fetch: async (q) => { - // Combine HN, Reddit News, and Wiki Current Events logic - const p1 = fetch( - `https://hn.algolia.com/api/v1/search_by_date?query=${encodeURIComponent(q)}&tags=story&hitsPerPage=6`, - ) - .then((r) => r.json()) - .catch(() => ({ hits: [] })); - const p2 = fetch( - `https://www.reddit.com/r/worldnews+news+technology/search.json?q=${encodeURIComponent(q)}&restrict_sr=1&sort=new&limit=6`, - ) - .then((r) => r.json()) - .catch(() => ({ data: { children: [] } })); - - const [hn, rd] = await Promise.all([p1, p2]); - - const hnRes = (hn.hits || []).map((h) => ({ - meta: { date: h.created_at_i, lang: "HN" }, - snippet: `HACKERNEWS // ${h.points || 0} PTS // ${timeAgo(h.created_at_i * 1000)}`, - source: "news", - title: h.title, - url: h.url || `https://news.ycombinator.com/item?id=${h.objectID}`, - })); - - const rdRes = (rd.data?.children || []).map((c) => ({ - meta: { date: c.data.created_utc, lang: "RD" }, - snippet: `REDDIT r/${c.data.subreddit.toUpperCase()} // ${c.data.score} UPVOTES`, - source: "news", - title: c.data.title, - url: `https://reddit.com${c.data.permalink}`, - })); - - // Interleave/Sort by recency - return [...hnRes, ...rdRes].sort((a, b) => b.meta.date - a.meta.date); - }, - name: "AGGREGATE NEWS", - }, - npm: { - bang: "!npm", - count: 0, - enabled: true, - fetch: async (q) => { - const r = await fetch( - `https://registry.npmjs.org/-/v1/search?text=${encodeURIComponent(q)}&size=8`, - ); - const d = await r.json(); - return (d.objects || []).map((o) => ({ - meta: { version: o.package.version }, - snippet: o.package.description || "NO DESCRIPTION", - source: "npm", - title: o.package.name, - url: `https://npmjs.com/package/${o.package.name}`, - })); - }, - name: "NPM", - }, - openlibrary: { - bang: "!b", - count: 0, - enabled: true, - fetch: async (q) => { - const r = await fetch( - `https://openlibrary.org/search.json?q=${encodeURIComponent(q)}&limit=6`, - ); - const d = await r.json(); - return (d.docs || []).map((b) => ({ - meta: { year: b.first_publish_year }, - snippet: `BY ${(b.author_name || ["UNKNOWN"]).join(", ").toUpperCase()}`, - source: "openlibrary", - title: b.title, - url: `https://openlibrary.org${b.key}`, - })); - }, - name: "OPENLIBRARY", - }, - reddit: { - bang: "!r", - count: 0, - enabled: true, - fetch: async (q) => { - const r = await fetch( - `https://www.reddit.com/search.json?q=${encodeURIComponent(q)}&limit=8`, - ); - const d = await r.json(); - return (d.data?.children || []).map((c) => ({ - meta: { comments: c.data.num_comments, score: c.data.score }, - snippet: c.data.selftext?.substring(0, 200) || `r/${c.data.subreddit}`, - source: "reddit", - title: c.data.title, - url: `https://reddit.com${c.data.permalink}`, - })); - }, - name: "REDDIT", - }, - stackoverflow: { - bang: "!so", - count: 0, - enabled: true, - fetch: async (q) => { - const r = await fetch( - `https://api.stackexchange.com/2.3/search?order=desc&sort=relevance&intitle=${encodeURIComponent(q)}&site=stackoverflow&pagesize=8`, - ); - const d = await r.json(); - return (d.items || []).map((i) => ({ - meta: { answers: i.answer_count, score: i.score }, - snippet: `${i.answer_count} ANSWERS // ${i.view_count} VIEWS`, - source: "stackoverflow", - title: decodeHTML(i.title), - url: i.link, - })); - }, - name: "STACKOVERFLOW", - }, - wikipedia: { - bang: "!w", - count: 0, - enabled: true, - fetch: async (q) => { - const r = await fetch( - `https://en.wikipedia.org/w/api.php?action=query&list=search&srsearch=${encodeURIComponent(q)}&format=json&origin=*&srlimit=8`, - ); - const d = await r.json(); - return (d.query?.search || []).map((i) => ({ - meta: { words: i.wordcount }, - snippet: i.snippet.replace(/<[^>]*>/g, ""), - source: "wikipedia", - title: i.title, - url: `https://en.wikipedia.org/wiki/${encodeURIComponent(i.title)}`, - })); - }, - instant: async (q) => { - const s = await fetch( - `https://en.wikipedia.org/w/api.php?action=query&list=search&srsearch=${encodeURIComponent(q)}&format=json&origin=*&srlimit=1`, - ); - const sd = await s.json(); - if (!sd.query?.search?.length) return null; - const title = sd.query.search[0].title; - const r = await fetch( - `https://en.wikipedia.org/w/api.php?action=query&prop=extracts&exintro&explaintext&titles=${encodeURIComponent(title)}&format=json&origin=*`, - ); - const d = await r.json(); - const page = Object.values(d.query.pages)[0]; - return { - content: page.extract, - source: "WIKIPEDIA", - title: page.title, - url: `https://en.wikipedia.org/wiki/${encodeURIComponent(title)}`, - }; - }, - name: "WIKIPEDIA", - }, -}; - -const STOCK_EXCHANGES = { - AAPL: "NASDAQ", - ADA: "CRYPTO", - AMD: "NASDAQ", - AMZN: "NASDAQ", - BAC: "NYSE", - BTC: "CRYPTO", - DIS: "NYSE", - DOGE: "CRYPTO", - ETH: "CRYPTO", - EURUSD: "FX", - GBPUSD: "FX", - GOOG: "NASDAQ", - GOOGL: "NASDAQ", - INTC: "NASDAQ", - JNJ: "NYSE", - JPM: "NYSE", - KO: "NYSE", - META: "NASDAQ", - MSFT: "NASDAQ", - NFLX: "NASDAQ", - NVDA: "NASDAQ", - PYPL: "NASDAQ", - QQQ: "NASDAQ", - SOL: "CRYPTO", - SPY: "AMEX", - TSLA: "NASDAQ", - USDJPY: "FX", - V: "NYSE", - WMT: "NYSE", - XOM: "NYSE", - XRP: "CRYPTO", -}; - -function getSymbol(ticker) { - const t = ticker.toUpperCase(); - const ex = STOCK_EXCHANGES[t]; - if (ex === "CRYPTO") return `BINANCE:${t}USDT`; - if (ex === "FX") return `FX:${t}`; - if (ex) return `${ex}:${t}`; - return `NASDAQ:${t}`; -} - -// ═══════════════════════════════════════════════════════════ -// STATE -// ═══════════════════════════════════════════════════════════ -const state = { - calcExpr: "", - calcResult: "0", - hasSearched: false, - history: JSON.parse(localStorage.getItem("sh") || "[]"), - query: "", - results: [], - watchlist: JSON.parse(localStorage.getItem("sw") || '["TSLA", "AAPL", "BTC", "ETH"]'), -}; - -const $ = (id) => document.getElementById(id); -const searchInput = $("search-input"); -const resultsEl = $("results"); -const heroEl = $("hero"); -const mainEl = $("main-content"); -const statsBar = $("stats-bar"); - -// ═══════════════════════════════════════════════════════════ -// INIT -// ═══════════════════════════════════════════════════════════ -function init() { - renderSources(); - renderHistory(); - renderWatchlist(); - initTheme(); - updateClocks(); - setInterval(updateClocks, 1000); - setupCalc(); - setupListeners(); - setupWatchlistListeners(); -} - -function renderSources() { - $("sources-list").innerHTML = Object.entries(SOURCES) - .map( - ([k, s]) => ` - <div class="source-item ${s.enabled ? "active" : ""}" data-source="${k}" onclick="toggleSource('${k}')"> - ${s.name} <span class="source-count" id="c-${k}">${s.count}</span> - </div> - `, - ) - .join(""); -} - -function toggleSource(k) { - SOURCES[k].enabled = !SOURCES[k].enabled; - renderSources(); - if (state.query) search(state.query); -} - -function toggleWidget(id) { - $(id).classList.toggle("open"); -} - -// ═══════════════════════════════════════════════════════════ -// THEME -// ═══════════════════════════════════════════════════════════ -function initTheme() { - const t = localStorage.getItem("theme"); - if (t === "light") document.body.classList.add("light-mode"); -} - -function toggleTheme() { - document.body.classList.toggle("light-mode"); - const isLight = document.body.classList.contains("light-mode"); - localStorage.setItem("theme", isLight ? "light" : "dark"); -} - -// ═══════════════════════════════════════════════════════════ -// WATCHLIST -// ═══════════════════════════════════════════════════════════ -function renderWatchlist() { - const c = $("watchlist-container"); - if (!state.watchlist.length) { - c.innerHTML = '<div style="color:var(--gray);font-size:11px;padding:10px;">EMPTY</div>'; - return; - } - c.innerHTML = state.watchlist - .map((t) => { - const ex = STOCK_EXCHANGES[t] || "STOCK"; - return ` - <div class="watchlist-item-row" onclick="searchFor('$${t}')"> - <span>${t} <span style="color:var(--gray)">${ex}</span></span> - <span class="watchlist-del-btn" onclick="removeTicker(event, '${t}')">×</span> - </div>`; - }) - .join(""); -} - -function addTicker() { - const val = $("watchlist-input").value.toUpperCase().trim(); - if (val && !state.watchlist.includes(val)) { - state.watchlist.push(val); - localStorage.setItem("sw", JSON.stringify(state.watchlist)); - renderWatchlist(); - $("watchlist-input").value = ""; - } -} - -window.removeTicker = (e, t) => { - e.stopPropagation(); // Prevent search trigger - state.watchlist = state.watchlist.filter((i) => i !== t); - localStorage.setItem("sw", JSON.stringify(state.watchlist)); - renderWatchlist(); -}; - -function setupWatchlistListeners() { - $("watchlist-add-btn").onclick = addTicker; - $("watchlist-input").addEventListener("keydown", (e) => { - if (e.key === "Enter") addTicker(); - }); -} - -// ═══════════════════════════════════════════════════════════ -// SEARCH -// ═══════════════════════════════════════════════════════════ -async function search(query) { - if (!query.trim()) return goHome(); - - // Show results view - if (!state.hasSearched) { - state.hasSearched = true; - heroEl.classList.add("compact"); - mainEl.style.display = "grid"; - statsBar.classList.add("visible"); - } - - // Stock ticker - const stockMatch = query.match(/^\$([A-Za-z]{1,5})$/); - if (stockMatch) { - showStockWidget(stockMatch[1].toUpperCase()); - addHistory(query); - return; - } - - // Bangs - const bangMatch = query.match(/^!(\w+)\s*(.*)/); - if (bangMatch) { - const bang = "!" + bangMatch[1]; - const q = bangMatch[2]; - const src = Object.entries(SOURCES).find(([_, s]) => s.bang === bang); - if (src && q) { - Object.keys(SOURCES).forEach((k) => (SOURCES[k].enabled = k === src[0])); - renderSources(); - query = q; - } - } - - // Calc - if (query.startsWith("=")) { - showCalcResult(query.slice(1)); - return; - } - - state.query = query; - showLoading(); - addHistory(query); - - const start = performance.now(); - const enabled = Object.entries(SOURCES).filter(([_, s]) => s.enabled); - - fetchInstant(query); - - const promises = enabled.map(async ([k, s]) => { - try { - const r = await s.fetch(query); - SOURCES[k].count = r.length; - $(`c-${k}`).textContent = r.length; - return r; - } catch (e) { - return []; - } - }); - - const all = await Promise.all(promises); - state.results = all.flat(); - const elapsed = Math.round(performance.now() - start); - - $("stat-results").textContent = state.results.length; - $("stat-sources").textContent = enabled.length; - $("stat-time").textContent = elapsed + "MS"; - $("results-label").textContent = `${state.results.length} RESULTS`; - $("results-info").textContent = `${elapsed}MS // ${enabled.length} SOURCES`; - - renderResults(); -} - -function goHome() { - state.hasSearched = false; - heroEl.classList.remove("compact"); - mainEl.style.display = "none"; - statsBar.classList.remove("visible"); - searchInput.value = ""; -} - -// ═══════════════════════════════════════════════════════════ -// STOCK WIDGET -// ═══════════════════════════════════════════════════════════ -function showStockWidget(ticker) { - const symbol = getSymbol(ticker); - const widgetId = "tv_" + Math.random().toString(36).substr(2, 9); - const isLight = document.body.classList.contains("light-mode"); - - resultsEl.innerHTML = ` - <div class="stock-widget"> - <div class="stock-header"> - <div class="stock-info"> - <h2>${ticker}</h2> - <div class="ticker">${symbol}</div> - </div> - <div class="stock-actions-top"> - <button class="stock-btn" onclick="window.open('https://www.tradingview.com/symbols/${symbol}/','_blank')">TRADINGVIEW ↗</button> - <button class="stock-btn" onclick="copy('${symbol}')">COPY</button> - </div> - </div> - <div class="tradingview-widget-container" id="${widgetId}"></div> - </div> - `; - - $("results-label").textContent = `STOCK: ${ticker}`; - $("results-info").textContent = symbol; - - loadTradingView(widgetId, symbol, isLight); -} - -function loadTradingView(containerId, symbol, isLight) { - if (!window.TradingView) { - const s = document.createElement("script"); - s.src = "https://s3.tradingview.com/tv.js"; - s.onload = () => createChart(containerId, symbol, isLight); - document.head.appendChild(s); - } else { - createChart(containerId, symbol, isLight); - } -} - -function createChart(containerId, symbol, isLight) { - new TradingView.widget({ - allow_symbol_change: true, - backgroundColor: isLight ? "rgba(244, 244, 245, 1)" : "rgba(0,0,0,1)", - container_id: containerId, - enable_publishing: false, - gridColor: isLight ? "rgba(220, 220, 220, 1)" : "rgba(30,30,30,1)", - height: 500, - interval: "D", - locale: "en", - studies: ["Volume@tv-basicstudies"], - style: "1", - symbol: symbol, - theme: isLight ? "light" : "dark", - timezone: "Etc/UTC", - toolbar_bg: isLight ? "#f4f4f5" : "#000", - width: "100%", - }); -} - -async function fetchInstant(query) { - if (/^[a-zA-Z]+$/.test(query) && SOURCES.dictionary.enabled) { - try { - const r = await fetch( - `https://api.dictionaryapi.dev/api/v2/entries/en/${encodeURIComponent(query)}`, - ); - if (r.ok) { - const d = await r.json(); - if (d[0]) { - const meanings = d[0].meanings - .slice(0, 3) - .map((m) => `[${m.partOfSpeech.toUpperCase()}] ${m.definitions[0]?.definition}`) - .join("\n\n"); - showInstant({ - content: meanings, - source: "DICTIONARY", - title: d[0].word.toUpperCase() + (d[0].phonetic ? ` ${d[0].phonetic}` : ""), - }); - return; - } - } - } catch {} - } - if (SOURCES.wikipedia.enabled) { - const w = await SOURCES.wikipedia.instant?.(query); - if (w) showInstant(w); - } -} - -function showInstant(data) { - const el = document.createElement("div"); - el.className = "instant-box"; - el.innerHTML = ` - <div class="instant-label">INSTANT ANSWER</div> - <div class="instant-title">${esc(data.title)}</div> - <div class="instant-content">${esc(data.content) - .split("\n") - .map((p) => `<p>${p}</p>`) - .join("")}</div> - <div class="instant-meta"> - <span>SOURCE: ${esc(data.source)}</span> - ${data.url ? `<a href="${data.url}" target="_blank">VIEW FULL →</a>` : ""} - </div> - `; - resultsEl.innerHTML = ""; - resultsEl.appendChild(el); -} - -function renderResults() { - if (state.results.length === 0) { - resultsEl.innerHTML = `<div class="empty-state"><div class="empty-title">NO RESULTS</div><div class="empty-text">TRY DIFFERENT KEYWORDS OR ENABLE MORE SOURCES</div></div>`; - return; - } - - const instant = resultsEl.querySelector(".instant-box"); - resultsEl.innerHTML = ""; - if (instant) resultsEl.appendChild(instant); - - state.results.forEach((r, i) => { - const el = document.createElement("div"); - el.className = "result"; - el.innerHTML = ` - <div class="result-index">${String(i + 1).padStart(2, "0")}</div> - <div class="result-body"> - <div class="result-source">${r.source.toUpperCase()}</div> - <div class="result-title" onclick="window.open('${esc(r.url)}','_blank')">${esc(r.title)}</div> - <div class="result-url">${esc(r.url)}</div> - <div class="result-snippet">${highlight(esc(r.snippet), state.query)}</div> - ${ - r.meta - ? `<div class="result-meta"> - ${r.meta.stars !== undefined ? `<span>★ ${fmt(r.meta.stars)}</span>` : ""} - ${r.meta.forks !== undefined ? `<span>⑂ ${fmt(r.meta.forks)}</span>` : ""} - ${r.meta.score !== undefined ? `<span>↑ ${fmt(r.meta.score)}</span>` : ""} - ${r.meta.comments !== undefined ? `<span>◨ ${fmt(r.meta.comments)}</span>` : ""} - ${r.meta.words !== undefined ? `<span>◎ ${fmt(r.meta.words)}W</span>` : ""} - ${r.meta.lang ? `<span>${r.meta.lang.toUpperCase()}</span>` : ""} - ${r.meta.version ? `<span>V${r.meta.version}</span>` : ""} - </div>` - : "" - } - </div> - `; - resultsEl.appendChild(el); - }); -} - -function showLoading() { - resultsEl.innerHTML = Array(4) - .fill( - `<div class="loading-row"><span class="loading-text">FETCHING</span><div class="loading-bar"></div></div>`, - ) - .join(""); -} - -function showCalcResult(expr) { - try { - const result = Function('"use strict";return (' + expr.replace(/\^/g, "**") + ")")(); - resultsEl.innerHTML = `<div class="instant-box"><div class="instant-label">CALCULATOR</div><div class="instant-title" style="font-variant-numeric:tabular-nums">${esc(expr)} = ${result}</div></div>`; - } catch { - toast("INVALID EXPRESSION"); - } -} - -// ═══════════════════════════════════════════════════════════ -// CALCULATOR -// ═══════════════════════════════════════════════════════════ -function setupCalc() { - document.querySelectorAll(".calc-btn").forEach((btn) => { - btn.onclick = () => { - const v = btn.dataset.v; - if (v === "C") { - state.calcExpr = ""; - state.calcResult = "0"; - } else if (v === "=") { - try { - state.calcResult = Function( - '"use strict";return (' + state.calcExpr.replace(/\^/g, "**") + ")", - )(); - } catch { - state.calcResult = "ERR"; - } - } else { - state.calcExpr += v; - } - $("calc-expr").textContent = state.calcExpr; - $("calc-result").textContent = state.calcResult; - }; - }); -} - -// ═══════════════════════════════════════════════════════════ -// TOOLS -// ═══════════════════════════════════════════════════════════ -function toolUUID() { - const uuid = "xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx".replace(/[xy]/g, (c) => { - const r = (Math.random() * 16) | 0; - return (c === "x" ? r : (r & 0x3) | 0x8).toString(16); - }); - copy(uuid); - toast("UUID: " + uuid.substring(0, 13) + "..."); -} - -let timerInterval, - timerSec = 0; -function toolTimer() { - if (!state.hasSearched) { - state.hasSearched = true; - heroEl.classList.add("compact"); - mainEl.style.display = "grid"; - statsBar.classList.add("visible"); - } - resultsEl.innerHTML = `<div class="tool-modal"><div class="instant-label">TIMER</div><div class="instant-title" id="timer-display" style="font-variant-numeric:tabular-nums">00:00:00</div><div class="tool-btn-row" style="margin-top:20px"><button class="tool-action" onclick="startTimer()">START</button><button class="tool-action" onclick="stopTimer()">STOP</button><button class="tool-action" onclick="resetTimer()">RESET</button></div></div>`; - $("results-label").textContent = "TIMER"; -} -window.startTimer = () => { - if (timerInterval) return; - timerInterval = setInterval(() => { - timerSec++; - const h = String(Math.floor(timerSec / 3600)).padStart(2, "0"); - const m = String(Math.floor((timerSec % 3600) / 60)).padStart(2, "0"); - const s = String(timerSec % 60).padStart(2, "0"); - $("timer-display").textContent = `${h}:${m}:${s}`; - }, 1000); -}; -window.stopTimer = () => { - clearInterval(timerInterval); - timerInterval = null; -}; -window.resetTimer = () => { - stopTimer(); - timerSec = 0; - $("timer-display").textContent = "00:00:00"; -}; - -function toolBase64() { - if (!state.hasSearched) { - state.hasSearched = true; - heroEl.classList.add("compact"); - mainEl.style.display = "grid"; - statsBar.classList.add("visible"); - } - resultsEl.innerHTML = `<div class="tool-modal"><div class="instant-label">BASE64</div><textarea id="b64-input" placeholder="ENTER TEXT..."></textarea><div class="tool-btn-row"><button class="tool-action" onclick="$('b64-output').textContent=btoa($('b64-input').value)">ENCODE</button><button class="tool-action" onclick="try{$('b64-output').textContent=atob($('b64-input').value)}catch{$('b64-output').textContent='INVALID'}">DECODE</button></div><div class="tool-output" id="b64-output">OUTPUT</div></div>`; - $("results-label").textContent = "BASE64"; -} - -function toolJSON() { - if (!state.hasSearched) { - state.hasSearched = true; - heroEl.classList.add("compact"); - mainEl.style.display = "grid"; - statsBar.classList.add("visible"); - } - resultsEl.innerHTML = `<div class="tool-modal"><div class="instant-label">JSON</div><textarea id="json-input" placeholder="PASTE JSON..."></textarea><div class="tool-btn-row"><button class="tool-action" onclick="formatJSON()">FORMAT</button><button class="tool-action" onclick="minifyJSON()">MINIFY</button></div><pre class="tool-output" id="json-output" style="white-space:pre-wrap;max-height:300px;overflow:auto">OUTPUT</pre></div>`; - $("results-label").textContent = "JSON"; -} -window.formatJSON = () => { - try { - $("json-output").textContent = JSON.stringify(JSON.parse($("json-input").value), null, 2); - } catch (e) { - $("json-output").textContent = "INVALID: " + e.message; - } -}; -window.minifyJSON = () => { - try { - $("json-output").textContent = JSON.stringify(JSON.parse($("json-input").value)); - } catch (e) { - $("json-output").textContent = "INVALID: " + e.message; - } -}; - -function toolHash() { - if (!state.hasSearched) { - state.hasSearched = true; - heroEl.classList.add("compact"); - mainEl.style.display = "grid"; - statsBar.classList.add("visible"); - } - resultsEl.innerHTML = `<div class="tool-modal"><div class="instant-label">SHA-256 HASH</div><textarea id="hash-input" placeholder="ENTER TEXT..."></textarea><div class="tool-btn-row"><button class="tool-action" onclick="genHash()">GENERATE</button></div><div class="tool-output" id="hash-output">OUTPUT</div></div>`; - $("results-label").textContent = "HASH"; -} -window.genHash = async () => { - const data = new TextEncoder().encode($("hash-input").value); - const hash = await crypto.subtle.digest("SHA-256", data); - $("hash-output").textContent = Array.from(new Uint8Array(hash)) - .map((b) => b.toString(16).padStart(2, "0")) - .join(""); -}; - -function toolColor() { - if (!state.hasSearched) { - state.hasSearched = true; - heroEl.classList.add("compact"); - mainEl.style.display = "grid"; - statsBar.classList.add("visible"); - } - resultsEl.innerHTML = `<div class="tool-modal"><div class="instant-label">COLOR</div><input type="color" id="color-input" value="#ffffff" style="width:100%;height:100px;border:3px solid var(--fg);background:var(--bg);cursor:crosshair;"><div class="tool-output" id="color-output" style="margin-top:20px"></div></div>`; - const updateColor = () => { - const hex = $("color-input").value; - const r = parseInt(hex.slice(1, 3), 16); - const g = parseInt(hex.slice(3, 5), 16); - const b = parseInt(hex.slice(5, 7), 16); - $("color-output").innerHTML = - `HEX: ${hex}<br>RGB: ${r}, ${g}, ${b}<br>HSL: ${rgbToHsl(r, g, b)}`; - }; - $("color-input").oninput = updateColor; - updateColor(); - $("results-label").textContent = "COLOR"; -} -function rgbToHsl(r, g, b) { - r /= 255; - g /= 255; - b /= 255; - const max = Math.max(r, g, b), - min = Math.min(r, g, b); - let h, - s, - l = (max + min) / 2; - if (max === min) { - h = s = 0; - } else { - const d = max - min; - s = l > 0.5 ? d / (2 - max - min) : d / (max + min); - switch (max) { - case r: - h = ((g - b) / d + (g < b ? 6 : 0)) / 6; - break; - case g: - h = ((b - r) / d + 2) / 6; - break; - case b: - h = ((r - g) / d + 4) / 6; - break; - } - } - return `${Math.round(h * 360)}°, ${Math.round(s * 100)}%, ${Math.round(l * 100)}%`; -} - -function toolPassword() { - const chars = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789!@#$%^&*"; - let pass = ""; - for (let i = 0; i < 20; i++) pass += chars[Math.floor(Math.random() * chars.length)]; - copy(pass); - toast("PASSWORD: " + pass.substring(0, 10) + "..."); -} - -function toolLoremIpsum() { - const lorem = - "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris."; - copy(lorem); - toast("LOREM IPSUM COPIED"); -} - -// ═══════════════════════════════════════════════════════════ -// HISTORY -// ═══════════════════════════════════════════════════════════ -function addHistory(q) { - state.history = state.history.filter((h) => h.q !== q); - state.history.unshift({ q, t: Date.now() }); - state.history = state.history.slice(0, 20); - localStorage.setItem("sh", JSON.stringify(state.history)); - renderHistory(); -} - -function renderHistory() { - const list = $("history-list"); - if (!state.history.length) { - list.innerHTML = '<div style="color:var(--gray);font-size:11px;">NO HISTORY</div>'; - return; - } - list.innerHTML = state.history - .slice(0, 6) - .map( - (h) => - `<div class="history-item" onclick="searchFor('${esc(h.q)}')"><span>${esc(h.q)}</span><span class="history-time">${timeAgo(h.t)}</span></div>`, - ) - .join(""); -} - -// ═══════════════════════════════════════════════════════════ -// CLOCKS -// ═══════════════════════════════════════════════════════════ -function updateClocks() { - const now = new Date(); - $("clock").textContent = now.toLocaleTimeString("en-GB"); - const zones = [ - { label: "LOCAL", tz: Intl.DateTimeFormat().resolvedOptions().timeZone }, - { label: "UTC", tz: "UTC" }, - { label: "NYC", tz: "America/New_York" }, - { label: "TOKYO", tz: "Asia/Tokyo" }, - ]; - $("world-clocks").innerHTML = zones - .map( - (z) => - `<div class="clock"><div class="clock-time">${new Date().toLocaleTimeString("en-GB", { hour: "2-digit", minute: "2-digit", timeZone: z.tz })}</div><div class="clock-label">${z.label}</div></div>`, - ) - .join(""); -} - -// ═══════════════════════════════════════════════════════════ -// LISTENERS -// ═══════════════════════════════════════════════════════════ -function setupListeners() { - let debounce; - searchInput.addEventListener("input", (e) => { - clearTimeout(debounce); - debounce = setTimeout(() => search(e.target.value), 300); - }); - searchInput.addEventListener("keydown", (e) => { - if (e.key === "Enter") { - clearTimeout(debounce); - search(searchInput.value); - } - if (e.key === "Escape") goHome(); - }); - document.addEventListener("keydown", (e) => { - if ( - e.key === "/" && - document.activeElement !== searchInput && - document.activeElement !== $("watchlist-input") - ) { - e.preventDefault(); - searchInput.focus(); - } - if (e.key === "Escape") goHome(); - }); - $("clear-btn").onclick = goHome; - $("voice-btn").onclick = voiceSearch; -} - -function voiceSearch() { - if (!("webkitSpeechRecognition" in window || "SpeechRecognition" in window)) { - toast("VOICE NOT SUPPORTED"); - return; - } - const Sr = window.SpeechRecognition || window.webkitSpeechRecognition; - const r = new Sr(); - r.lang = "en-US"; - $("voice-btn").style.background = "#fff"; - $("voice-btn").style.color = "#000"; - r.onresult = (e) => { - searchInput.value = e.results[0][0].transcript; - search(searchInput.value); - }; - r.onend = () => { - $("voice-btn").style.background = ""; - $("voice-btn").style.color = ""; - }; - r.start(); -} - -// ═══════════════════════════════════════════════════════════ -// UTILITIES -// ═══════════════════════════════════════════════════════════ -function esc(s) { - if (!s) return ""; - return s.replace( - /[&<>"']/g, - (m) => ({ "'": "'", '"': """, "&": "&", "<": "<", ">": ">" })[m], - ); -} -function decodeHTML(s) { - const t = document.createElement("textarea"); - t.innerHTML = s; - return t.value; -} -function highlight(text, query) { - if (!query) return text; - const words = query.split(/\s+/).filter((w) => w.length > 2); - let result = text; - words.forEach((w) => { - result = result.replace(new RegExp(`(${w})`, "gi"), "<mark>$1</mark>"); - }); - return result; -} -function fmt(n) { - if (n >= 1000000) return (n / 1000000).toFixed(1) + "M"; - if (n >= 1000) return (n / 1000).toFixed(1) + "K"; - return n?.toString() || "0"; -} -function timeAgo(ts) { - const s = Math.floor((Date.now() - ts) / 1000); - if (s < 60) return "NOW"; - if (s < 3600) return Math.floor(s / 60) + "M"; - if (s < 86400) return Math.floor(s / 3600) + "H"; - return Math.floor(s / 86400) + "D"; -} -function copy(text) { - navigator.clipboard.writeText(text); - toast("COPIED"); -} -function toast(msg) { - const t = document.createElement("div"); - t.className = "toast"; - t.textContent = msg; - $("toast-container").appendChild(t); - setTimeout(() => t.remove(), 3000); -} -function searchFor(q) { - searchInput.value = q; - search(q); -} -function insertBang(bang) { - searchInput.value = bang + " "; - searchInput.focus(); -} - -init(); |