Skip to content

Yet another awesome browser extension for switching search engines, search everything (selection text / image / link / find in page) on any engine with a simple right click or a variety of menus and shortcuts. Build with React & Material-UI. (WIP).

License

Notifications You must be signed in to change notification settings

hoothin/SearchJumper

Folders and files

NameName
Last commit message
Last commit date

Latest commit

b638947 · Jan 26, 2025
Aug 4, 2024
Dec 30, 2023
Oct 6, 2024
Jan 1, 2025
May 20, 2022
Dec 24, 2023
May 20, 2022
Sep 7, 2024
May 20, 2022
May 20, 2022
Dec 5, 2024
Dec 15, 2023
Dec 15, 2023
Jan 26, 2025
May 20, 2022

Repository files navigation

i

react-version materialUI-version license FontAwesome support

  • Build with React.js
  • UI: Material-UI
  • Icons: FontAwesome

Just a personal work, maybe not suit you.

Install

Install via Chrome web store Install via Greasyfork Install via Firefox addons

Config page

🔗hoothin.github.io

🔗search.hoothin.com

You can also download the source code, double-click start.cmd to compile, then enter the config page through localhost:3000

亦可下載源碼到本地后雙擊 start.cmd ,透過 npm 編譯后訪問 localhost:3000 進入配置

Please help with localizing this extension[1][2] to the language you are familiar with!

Translation Contributors

Русский: RomanAleynikov

Features:

  • Fully open source without any privacy collection, spam or third-party libraries.

    完全開源,無任何隱私收集、廣告或者亂七八糟的第三方庫,所有數據均在本地,無任何服務器交互

  • Search for pictures, links, videos, audios, pages, etc. (long press the right mouse on the corresponding object)

    可以搜尋圖片、連結、視頻、音頻、頁面等(在相應對象上長按右鍵

  • Support word search on any page (need to long press the right mouse, you can also change to swipe to call out immediately in the settings)

    支援任意頁面劃詞搜尋(需要長按右鍵,亦可在設置中改為劃選立即調出)

  • Support search by site

    支援站內搜尋

  • Shortcut keys (single key or key combination) to start search (such as alt+g Google search, which can be customized at will)

    可隨意使用快捷鍵(單個按鍵或者組合按鍵)開啟搜尋(比如 alt+g 谷歌搜尋,可隨意自定義)

  • Right-click the category icon to open the sites in batches

    滑鼠右鍵單擊類別圖標批量打開同一類別

  • Hold shift + left click on category icon to open batches in new window

    按住 shift 左鍵單擊類別圖標在新窗口批量打開

  • Hold ctrl + left click on category icon to open in background TAB

    按住 ctrl 左鍵單擊類別圖標以後臺標籤頁批量打開

  • Hold alt + left-click a category icon to batch open multiple separate windows

    按住 alt 左鍵單擊類別圖標以多個單獨窗口批量打開

  • Hold ctrl + shift + left click on category icon to open batches in incognito window

    按住 ctrl + shift 左鍵單擊類別圖標在隱身窗口批量打開

  • Hold alt + shift + left click on category icon to open batches embedding

    按住 alt + shift 左鍵單擊類別圖標批量嵌入打開

  • shift + left click on site icon to open in new window

    按住 shift 左鍵單擊站點以新窗口打開結果頁

  • ctrl + (left click/shortcut/drag) on site icon to open in background TAB

    按住 ctrl (左鍵單擊/快捷鍵/拖拽)站點以後臺標籤頁打開結果頁

  • alt + (left click/shortcut/drag) on site icon to preview in small window

    按住 alt (左鍵單擊/快捷鍵/拖拽)站點以小窗口預覽結果

  • ctrl + shift + (left click/shortcut/drag) single site/press shortcut key to open in incognito window.

    按住 ctrl + shift (左鍵單擊/快捷鍵/拖拽)站點以隱身窗口打開

  • Call search bar for input words to filter sites by shortcut key when select no words, press enter to search quickly, ctrl + enter to search without lock.

    沒有選擇文字或者圖片時透過喚出快捷鍵可喚出站點搜尋框,搜尋站點后按下回車可鎖定站點並輸入搜尋詞,再次回車使用第一個結果搜尋,ctrl+回車無需鎖定即可快捷打開,適用於靜態書簽。

  • Can set the category to be displayed only on the specified site through the regular rule

    可以透過正則設置類別僅在指定站點顯示

  • Right click on cute face to hide the toolbar

    右鍵點擊 小萌臉 徹底隱藏工具欄

  • Left click on cute face to open the configuration page

    左鍵點擊 小萌臉 打開配置頁

  • Support open with shortcut key, right click on the logo to close

    可隨意拖拽 小萌臉,並隨意選擇位置放置,例如上中,下中,左上,右上,上左,上右等

  • Support configuration export and quick sharing

    支援配置導出與快捷分享

  • Support middle button to open links in the background

    支援中鍵後台打開連結

  • Support custom css

    支援自定義樣式

  • Support full character encoding

    支援全字符編碼

  • Support Post, in-page post and non-jump post

    支援 Post、頁內 post 以及無跳轉 post

  • Comprehensive customization

    全面的自定義功能,詳見最下方【搜尋參數】

  • No 3rd party dependencies

    無第三方依賴庫

  • Self-expand current category

    自展開當前類別並提前

  • No tamper with the original page

    不篡改原始頁面

  • Drag to search with current category

    拖拽搜尋當前分類(文字/圖片/鏈接),内圈為當前分類前6個站點,外圈為最近使用的10個站點,可透過編輯第一個(文字/圖片/鏈接)分類來自定義内容

Screenshots

config findInPage etc

Search params

param details 詳述
%s search keyword 🗒️ 搜尋關鍵詞
%S cached search keyword 🗒️ 最近一次的搜尋關鍵詞
%sl search keyword with lower case letters 🗒️ 小寫字母搜尋詞
%su search keyword with upper case letters 🗒️ 大寫字母搜尋詞
%u current website url 🗒️ 當前網站 url
%h current website host 🗒️ 當前網站 host
%t target src 🗒️ 指向對象的 src
%i base64 of target image 🗒️ 指向圖片的 base64
%s.replace replace keywords with regexp, like %sr.replace(/[^\d]/g, "").replace(/(\d)/g, "$1 ") means replace raw keywords to numbers and then join all numbers with space, support %s %sl %sr %su %t %u 🗒️ 用正則替換搜尋關鍵詞,例如 %sr.replace(/[^\d]/g, "").replace(/(\d)/g, "$1 ") 代表提取原始關鍵詞中所有數字,並以空格分隔,支援 %s %sl %sr %su %t %u
%p{params} post body, like %p{x=1&y=%s} 🗒️ post 參數體,例如 %p{x=1&y=%s}
%P{params} post without navigation 🗒️ post 但不跳轉
%input{tips} input something, like %input{love who?,you} 🗒️ 輸入占位,例如%input{請輸入您的三圍,90 55 90}
#p{params} post in page, like #p{#input=%u&sleep(500)&click(.submit)}, means: input current url to "#input", then wait for 500ms, then click ".submit". use \& \= instead of & = in content 🗒️ 頁内 post,可在頁面之内使用【css選擇器】填寫參數提交查詢,適用於不開放GET/POST接口的網站,例如 #p{#input=%u&sleep(500)&click(.submit)}, 代表在"#input"内輸入指定url,然後等待500毫秒,最後點擊".submit"。可在内容中使用 \& \= 來 表示 & =
["siteName1","siteName2"] batch open by site name you've created 🗒️ 透過你已經創建的站點名批量打開,例如 ["雅虎搜尋","谷歌搜尋"]
%element{} query element for innerText from selector or xpath, like %element{.mainTitle} 🗒️ 透過 css 選擇器或 xpath 抓取元素並返回文字内容,例如 %element{.mainTitle}
%element{}.prop() return prop value for queried element, like %element{.mainTitle}.prop(href) %element{.mainTitle}.prop(innerHTML) 🗒️ 獲取抓取到元素的屬性值,例如 %element{.mainTitle}.prop(href) %element{.mainTitle}.prop(innerHTML)
%element{}.replace() replace, same as above, like %element{.mainTitle}.prop(href).replace(/https/i,"") 🗒️ 正則替換,例如 %element{.mainTitle}.prop(href).replace(/https/i,"")

PopClip extension for SearchJumper

#popclip extension for SearchJumper
name: SearchJumper
icon: search filled S
url: https://search.hoothin.com/all#***

Select the above text, PopClip will offer an "Install Extension" action. Click it.

  • https://search.hoothin.com/all?kw=keywords&engine=someengine means search keywords with search engine named someengine and open in new tab.
  • https://search.hoothin.com/all?kw=keywords&engine=someengine&self=1 means search keywords with search engine named someengine and open in current tab.

Search engine examples 搜尋引擎規則範例

  • Open link in the text, display only when a link is detected 打開文字中的鏈接,僅當檢測到鏈接時顯示
{
  "name": "Open link in text",
  "url": "%sr.replace(/(点|。)/g,\".\").replace(/[^\\s\\w\\-_\\.~!\\*';:@&=\\+\\$,\\/\\?#\\[\\]%]/g,\"\").replace(/https:\\/\\/pan\\.baidu\\.com\\/s\\//,\"\").replace(/.*([\\s::]|^)(1[a-z_0-9]{22,})[\\s\\S]*?\\b([a-z0-9]{4}\\b|$).*/i,\"https://pan.baidu.com/s/$2?pwd=$3\").replace(/ /g,\"\").replace(/^/,\"http://\").replace(/^http:\\/\\/(https?:)/,\"$1\")",
  "kwFilter": "\\w\\S*\\.\\S*\\w|\\w.*[点。].*\\w|1[a-zA-Z0-9]{22,}"
}
  • Automatically send target text to other device like mobile phone 自動發送選中文字到手機
{
  "name": "Send to phone",
  "url": "https://s.hoothin.com/#p{wait(x-peer)&rclick(x-peer)&#textInput=%s&click(#textInput+div>button)}"
}
  • Split by line and paste into the current input box in order 按行分割後依次粘貼到當前輸入框
{
  "name": "⌨️ 按行輸入",
  "url": "#p{@=%s[]}"
}
  • Currency conversion / USD to RMB, show tips when the mouse is hovering
{
  "name": "💲USD to RMB",
  "url": "showTips:https://api.exchangerate.host/convert?from=USD&to=CNY&amount=1 \n{name}<br/><i>%sr USD = {json.result|*%sr.replace(/\\D/,'')} RMB</i>",
  "kwFilter": "\\d\\$|\\$\\d"
}
  • Currency conversion of various countries 各國貨幣轉換
{
  "name": "💲Currency convert",
  "url": "showTips:http://apilayer.net/api/convert?from=%input{From currency/US Dollar/Euro/Japanese Yen/China Yuan,USD/EUR/JPY/CNY}&to=%input{Target currency/US Dollar/Euro/Japanese Yen/China Yuan,USD/EUR/JPY/CNY}&amount=1&access_key=%template{apilayer key}\n{name}<br/><i>%sr {json.query.from} = {json.result|*%sr.replace(/\\D/,'')} {json.query.to}</i>"
}
  • Preview Japan AV 框選番號預覽AV such as ABW-345
{
  "name": "💞 AV預覽",
  "url": "showTips:https://www.javbus.com/%sr.replace(/^(\\w+?)[\\-_]?(\\d+)$/,\"$1-$2\") \n<span style='font-size:22px;line-height:1.2;'>{h3}</span>\n<p style=\"margin: 0; font-size: 18px; font-weight: normal;\">{.info>p:nth-child(2)}</p>\n<p style=\"margin: 0; font-size: 18px; font-weight: normal;\">{.info>p:nth-child(6)}</p>\n<p style=\"margin: 0;\">{.genre a|<mark style=\"white-space: nowrap;margin: 5px; font-size: 16px; border-radius: 5px; padding: 2px; box-shadow: 0px 0px 10px 0px #000;\">()</mark>}</p>\n<img src='https://www.javbus.com{a.bigImage>img|src}' referrerpolicy='no-referrer'/>",
  "kwFilter": "^[0-9a-zA-Z]+[\\-_]?\\d+$"
}
  • Show Romaji of japanese 顯示日語對應羅馬音/羅馬字
{
    "name": "🗻 Japanese romaji",
    "url": "showTips:https://translate.googleapis.com/translate_a/single%p{client=gtx&dt=t&dt=bd&dj=1&dt=ex&dt=ld&dt=md&dt=qca&dt=rw&dt=rm&dt=ss&dt=at&sl=ja&tl=zh_CN&q=%s}\n<h3 style='margin: 0;'>{name}</h3>\n{json.sentences.all.trans}\n<br>\n<font style='display: block;' color='antiquewhite'>{json.sentences.all.orig}</font>\n<font style='display: block;' color='yellow'>{json.sentences.-1.src_translit}</font>\n<span style=\"cursor:pointer;color:#f9690e;\" data-read=\"%sr.replace(/\"/g,\"&quot;\")\" data-lang=\"ja\" data-rate=\"1\" data-volume=\"1\">🔈Read</span>",
    "kwFilter": "[\\u3040-\\u309F\\u30A0-\\u30FF]"
}
  • Convert miles and kilometers 轉換英哩與公里
{
  "name": "📏 Mile to km",
  "url": "showTips:\n<i>%sr.replace(/(\\d+)(英里|英?哩|mi(le)?)/,\"$1\") mi = {%sr.replace(/(\\d+)(英里|英?哩|mi(le)?)/,\"$1\")*1.609344} km</i>",
  "kwFilter": "\\d+\\s*(英里|英?哩|mi(le)?\\b)"
}

Add search engines quickly 快速添加搜尋引擎

  • Add with shortcut key on current page 透過快捷鍵快速在當前頁面添加

Click search input box with ctrl + shift 按住 ctrl + shift 點擊當前頁面中的搜尋輸入框即可

  • Search on mycroftproject.com and add 在 mycroftproject 上搜尋別人編輯好的站點並點擊導入

Click the searchJumper face icon in sites list on mycroftproject 點擊 mycroftproject 上站點列表裏的搜尋醬圖標即可


Auto highlight rule examples 自動高亮詞規則範例

Highlight all text URL on any site 在任意網頁上高亮文字網址

{
    "*": {
        "words": [
            "/(https?:\\/\\/|www\\.)[^\\s\"'\\\\{}\\(\\)\\[\\]#]+\\.[^\\s\"'\\\\{}\\(\\)\\[\\]#]+/i$s{unset;border-radius:unset;border-bottom-width:5px;border-bottom-style:dotted;border-bottom-color:red;}$t{@popup}"
        ]
    }
}

Highlight all avID on t66y 在草榴上高亮番號

{
    "/^https://t66y\\.com/htm_data//i": {
        "sep": "#",
        "words": [
            "/([a-z]\\w+\\-?|\\d{5,}\\-)\\d{2,}/i$s{unset;border-radius:unset;border-bottom:5px dotted red;}$t{@popup(💞 AV预览)}$in{.tpc_content}"
        ]
    }
}
  • Effect on the site matched RegExp ^https://t66y\\.com/htm_data/ with case ignore

匹配到草榴網址的正則 ^https://t66y\\.com/htm_data/ 后生效,不區分大小寫

  • Split by "#" as there is space in the keyWords under

以#分隔,因爲下面的關鍵詞中有空格

  • Search words according to the regular pattern at first, then add style "background:unset;border-bottom:5px dotted red;" to the highlighted words, finally add the feature of hovering the mouse to pop up the search box

首先根據正則 "[0-9a-zA-Z]+\-\d+" 查找番號,然後為高亮詞添加 style "background:unset;border-bottom:5px dotted red;",最後添加鼠標懸浮彈出搜索彈框的特性

Hide user by target id on xxxx.com 在某個網站上根據給定的用戶名或者用戶 ID 屏蔽元素

{
    "@someUserID": "/12345|54321/l",
    "@someUserName": "/jack|adam|rose/i",
    "/^https://xxxx\\.com/yyyy//i": {
        "sep": "|",
        "words": [
            "@someUserID$p{0}",
            "@someUserName$p{0}"
        ]
    }
}
  • Effect on the site matched RegExp ^https://xxxx\\.com/yyyy/ with case ignore

網址匹配到正則 ^https://xxxx\\.com/yyyy/ 后生效,不區分大小寫

  • Split by "|"

以|分隔

  • Search links by @someUserID to hide (l after RegExp means link), and search words by @someUserName to hide.

查找設定在模板 @someUserID 中的用戶 ID (正則后的 l 代表篩選連結),然後隱藏連結中含有此 ID 的元素,同時查找設定在模板 @someUserName 中的用戶名並隱藏元素


Filter engines to search 篩選引擎並搜尋

  • Call by global shortcut key, Input keywords of site name to filter sites, support glob with "? *" 透過全局快捷鍵喚出,輸入站點名稱的關鍵詞來篩選,支援 “? *” 通配符
  • Enter to lock filter and input words to search by click icon or another press of enter 回車鎖定篩選,輸入文字并且點擊站點圖標或者再次回車來進行搜尋

i


Call SearchJumper by event 透過鼠標手勢調用搜尋醬

  • Search by site name 以站點名調用搜尋
// search by google
const siteName = 'Google search';
const searchJumperEvent = new CustomEvent('searchJumper', {
  detail: {
    action: 'search',
    name: siteName
  }
});
document.dispatchEvent(searchJumperEvent);
  • Show search bar 顯示搜尋條
const searchJumperEvent = new CustomEvent('searchJumper', {
  detail: {
    action: 'show'
  }
});
document.dispatchEvent(searchJumperEvent);
  • Show All-mode 顯示所有模式
const searchJumperEvent = new CustomEvent('searchJumper', {
  detail: {
    action: 'showAll'
  }
});
document.dispatchEvent(searchJumperEvent);
  • Search by second site of current type and open in new window 使用當前分組的第二個站點搜尋並在小窗打開結果
const siteOrder = 2;
let currentSite = document.querySelector(`.search-jumper-type:not(.search-jumper-hide)>a:nth-of-type(${siteOrder})`);
if (currentSite) {
  const searchJumperEvent = new CustomEvent('searchJumper', {
    detail: {
      action: 'search',
      name: currentSite.dataset.name,
      key: {altKey:true}
    }
  });
  document.dispatchEvent(searchJumperEvent);
}
  • Search by site of current type in background tab 使用當前分組的站點搜尋並在後臺標籤頁打開結果
const searchJumperEvent = new CustomEvent('searchJumper', {
  detail: {
    action: 'search',
    key: {ctrlKey:true}
  }
});
document.dispatchEvent(searchJumperEvent);
  • Search by second site of current type in incognito tab 使用當前分組的第二個站點搜尋並在隱身標籤頁打開結果
const siteOrder = 2;
const searchJumperEvent = new CustomEvent('searchJumper', {
  detail: {
    action: 'search',
    index: siteOrder,
    key: {ctrlKey:true, altKey:true}
  }
});
document.dispatchEvent(searchJumperEvent);

Download all video with lux 使用 LUX 下載全網視頻

bilibili

Step by step of One-click video download configuration
  • Download Lux
  • Download ffmpeg
  • Add site under group which "Effect on page" on your SearchJumper
  • Click "Call local application" under "Edit site"
  • Input command like "D:\Program Files\lux\lux.exe" %u, then submit.
  • Open and import the reg file.
  • Right click with ctrl key, click Lux.
一鍵視頻下載配置方法(B站為例)
  • 下載BBDown
  • 下載ffmpeg,解壓並且複制\bin\ffmpeg.exe
  • 將BBDown.exe 與 ffmpeg.exe 放置於同一文件夾,記錄該路徑,例如 D:\Program Files\BBDown
  • 在你的搜尋醬“當前網頁”分類新增站點
  • 點擊“編輯站點”最下方的“添加自定義本地應用調用”
  • 調用命令處填入"D:\Program Files\BBDown\BBDown.exe" %u -tv,點擊生成註冊表補丁
  • 此時會自動生成註冊表補丁,點擊導入,並且保存編輯站點
  • 在 bilibili 視頻播放頁面按住 ctrl 點擊右鍵,點擊BBDown即可下載
  • 其他視頻下載工具(例如lux、you-get、yt-dlp等)同理,可自行編輯。

Registry patch to call lux by SearchJumper 搜尋醬調用本地程式的注冊表補丁

Windows Registry Editor Version 5.00

[HKEY_CLASSES_ROOT\lux]
@="URL:lux Protocol"
"URL Protocol"=""

[HKEY_CLASSES_ROOT\lux\DefaultIcon]
@="cmd.exe,1"

[HKEY_CLASSES_ROOT\lux\shell]

[HKEY_CLASSES_ROOT\lux\shell\open]

[HKEY_CLASSES_ROOT\lux\shell\open\command]
@="cmd /c set m=%1 & call set m=%%m:lux://=%% & d: & cd \"D:\\Program Files\\lux\" & call lux.exe %%m%% & pause"

Modify path by yourself 自行修改補丁中的目錄,保存爲 lux.reg,雙擊導入注冊表。

Open the page of video and download with lux://%u 完畢之後即可新建站點使用 lux://%u 調用 lux 下載當前網頁視頻


Sync by webdav 透過 webdav 同步引擎配置與高亮規則

  • webdav 伺服器需要支援自設 cors
  • 也可以自己架設 webdav 伺服器,方法如下
    • 下載 webdav server
    • 創建配置文件 config.yml,內容如下:
address: 伺服器地址
port: 伺服器端口
cors:
  enabled: true
  credentials: true
  allowed_headers:
    - '*'
  allowed_hosts:
    - https://hoothin.github.io
  allowed_methods:
    - '*'
  exposed_headers:
    - Content-Length
    - Content-Range
users:
  - username: 用戶名
    password: 密碼
    scope: webdav 同步文件夾路徑
    modify: true

Batch open modes 多種批量打開方式

  • shift + click category icon i

  • alt + shift + click category icon i

  • alt + click category icon i

Star History

Star History Chart