(cache) sleepnova's blog: Chrome 小字典

2009年7月6日星期一

Chrome 小字典

由於苦於在 Google Chrome 下沒有 Google 工具列的翻譯工具，常常要開回 Firefox 切來切去又很麻煩，於是乾脆自己動手寫了一個小字典 add-on for Google Chrome，雖然功能還很陽春，不過本著軟體常常放、大家放的精神，就先放出來給大家試用看看，畢竟比完全沒有還要好一點，看有什麼可以改進的地方，歡迎大家指教。

使用方法如下，在書籤上新增一個網頁，名稱隨便填，然後網址的地方把下面文字方塊裡的文字貼入，就大功告成了。

當你想要使用字典功能的時候，就點一下那個書籤，啟動之後右上角會跳出一個 banner，代表字典在運行，之後只要把滑鼠移到需要翻譯的字上面，就會自動查詢。

把這裡面的東西貼到書籤網址:

javascript: function translate(word){ var glf = document.getElementById("glf"); glf.contentWindow.gtrans(word); }; function findAndReplace(searchText, replacement, searchNode) { var regex = typeof searchText === 'string' ? new RegExp(searchText, 'g') : searchText, childNodes = (searchNode || document.body).childNodes, cnLength = childNodes.length, excludes = 'html,head,style,title,link,meta,script,object,textarea,iframe'; while (cnLength--) { var currentNode = childNodes[cnLength]; if (currentNode.nodeType === 1 && (excludes + ',').indexOf(currentNode.nodeName.toLowerCase() + ',') === -1) { arguments.callee(searchText, replacement, currentNode); } if (currentNode.nodeType !== 3 || !regex.test(currentNode.data) ) { continue; } var parent = currentNode.parentNode, frag = (function(){ var html = currentNode.data.replace(regex, replacement), wrap = document.createElement('div'), frag = document.createDocumentFragment(); wrap.innerHTML = html; while (wrap.firstChild) { frag.appendChild(wrap.firstChild); } return frag; })(); parent.insertBefore(frag, currentNode); parent.removeChild(currentNode); } }; function inject(){ findAndReplace('\\b[^ ]+\\b', function(term){ return '<span onmouseover="translate(this)">' + term + '</span>'; }); }; function init() { var div = document.createElement('div'); div.id = 'glfdiv'; div.style.borderWidth='thin'; div.style.borderStyle='outset'; div.style.position='fixed'; div.style.top='10px'; div.style.right='10px'; div.style.backgroundColor = 'white'; div.innerHTML = 'loading...'; document.body.appendChild(div); var glf = document.createElement('iframe'); glf.id = 'glf'; glf.style.display='none'; document.body.appendChild(glf); var doc = glf.contentDocument; doc.open(); doc.write('<head><title>Sample html</title><script type="text/javascript" src="http://www.google.com/jsapi"></script><script type="text/javascript">google.load("language", "1");function gtrans(word) {if(word.title) return; word.title = "translating..."; var text = word.innerHTML; google.language.detect(text, function(result) { if (!result.error && result.language) { google.language.translate(text, result.language, "zh-tw", function(result) {if (result.translation) { word.title = text + ": " + result.translation;}});}});};</script></head><body><div id="branding" style="background-color:white;color:black;padding:0px 1px;text-align:right;">Chrome%E5%B0%8F%E5%AD%97%E5%85%B8</div><script>google.language.getBranding("branding");google.setOnLoadCallback(parent.callback);</script></body>'); doc.close(); callback = function(){ div.innerHTML = doc.getElementById('branding').outerHTML;div.onclick = function(){div.style.display='none'};}; inject(); }; init();

一個小問題稍微提一下，如果遇到字一直沒出來就稍微動一下滑鼠。

18 意見:

Aguai 提到...: 會不會太神了！！！
拜讀中; 2009年7月6日上午3:41
頑皮豹提到...: 沒什麼啦, 說穿了也不值錢, 拿人家的東西東拼西湊而已!; 2009年7月6日下午1:05
Steve 提到...: 只要不是侵權，能夠替大家解決問題，我想就讓人很感動了!!
有些人光說自己行，不願幫人。唉，搞不懂現代人真的心胸這麼窄嗎?

大大，謝謝您的分享!!; 2009年7月7日上午12:16
頑皮豹提到...: powered by Google banner 的部分做了一些修正,顯示有問題的人可以更新一下。; 2009年7月7日上午12:32
Ｊｏｅｌ提到...: 先感謝你做了這麼棒的工具
然後想問一下右上角的powered by Google banner該如何關掉?
一個白框在那裡會擋到一些網頁的登入登出連結
(包括這個網頁的囧); 2009年7月7日上午10:26
頑皮豹提到...: 我現在修改成點一下就會消失，不知道這樣可以嗎?
請更新試試看吧 :); 2009年7月8日上午1:31
Ｊｏｅｌ提到...: 喔喔喔
就是這樣！！！
太棒了XD
感謝大大地修正m(_ _)m; 2009年7月8日上午1:45
頑皮豹提到...: 謝謝你給的建議，很高興能幫到你 :); 2009年7月8日上午3:27
Andrew 提到...: 超誇張
我以台灣的竹科工程師為榮
技術和共享精神都是一流的！
我是Chromium忠實用戶
就把字典標籤命名成頑皮豹紀念你囉，ㄏㄏ; 2009年7月9日下午2:57
Larry 提到...: good and thanks.; 2009年8月2日下午11:15
Kai 提到...: 很棒, 謝謝; 2009年8月12日上午2:44
yuho 提到...: 感謝!! :); 2009年8月16日上午1:24
Jason 提到...: 真是實用, 不過原本的翻譯功能隊單一字彙有多重解釋時會一並顯示, 目前只有一個. 請問有參數可以改嗎?; 2009年8月16日下午4:58
moonmoon 提到...: 實在太感謝了，感激得五體投地; 2009年8月20日下午7:49
Kala Kuo 提到...: 挺實用的，感激！！; 2009年12月12日上午8:42
俊傑提到...: 太棒了....
用起來跟FX的GOOGLE TOOLBAR簡直一模一樣阿
CHROME官方的Google Dictionary (by Google) ...簡直跟樂色一樣阿...翻譯亂七八糟的
你太厲害啦~~~謝謝你囉~~; 2010年1月28日上午2:25
wAcA 提到...: 啊!真謝謝你,我還以為真的要用IE才能翻譯~?; 2010年3月1日上午5:21
頑皮豹提到...: 新版在這邊
https://chrome.google.com/extensions/detail/aoeeonklbdfakjbbbgfjkennocjdcogh

介紹:
http://sleepnova.blogspot.com/2010/03/chrome-extension.html; 2010年3月15日上午2:31

張貼意見

sleepnova's blog

2009年7月6日星期一

Chrome 小字典

18 意見:

Promote JS

網誌存檔

Tag

著作人

Links

追蹤者