图标改为方形,更好的点击体验;优化操作逻辑,样式微调

This commit is contained in:
example 2019-02-27 19:00:28 +08:00
parent c36d0b3820
commit 0734d17565
10 changed files with 111 additions and 94 deletions

View File

@ -4,10 +4,10 @@
### translate.js ### translate.js
![translate.jpg](translate/translate.jpg) ![translate.png](translate/translate.png)
特色: 特色:
* 划词翻译调用“金山词霸、有道词典有道翻译、Google Translate谷歌翻译、沪江小D、搜狗翻译、必应词典必应翻译、Microsoft Translator必应在线翻译、海词词典、百度翻译、Oxford Learner's Dictionaries、Oxford Dictionaries、Merriam-Webster、汉典、PDF 划词翻译”网页翻译 * 划词翻译调用“金山词霸、有道词典有道翻译、Google Translate谷歌翻译、沪江小D、搜狗翻译、必应词典必应翻译、Microsoft Translator必应在线翻译、海词词典、百度翻译、Oxford Learner's Dictionaries、Oxford Dictionaries、Merriam-Webster、汉典、PDF 划词翻译、Google Search、Bing Search必应搜索、百度搜索、Wikipedia Search维基百科搜索”网页翻译
* 支持顺序自定义 * 支持顺序自定义
* 支持隐藏图标 * 支持隐藏图标
* 支持显示更多图标 * 支持显示更多图标
@ -15,19 +15,18 @@
### translate-dictionary.js ### translate-dictionary.js
![translate-dictionary.jpg](translate/translate-dictionary.jpg) ![translate-dictionary.png](translate/translate-dictionary.png)
特色: 特色:
* 划词翻译调用“有道词典有道翻译、金山词霸、Bing 词典必应词典、剑桥高阶、沪江小D、谷歌翻译” * 划词翻译调用“有道词典有道翻译、金山词霸、Bing 词典必应词典、剑桥高阶、沪江小D、谷歌翻译”
* 支持发音 * 支持发音
* 支持显示当前翻译引擎 * 支持显示当前翻译引擎
* 支持面板拖动 * 支持面板拖动
* 支持面板自动调整位置
### translate.js *and* translate-dictionary.js ### PDF 划词翻译PDF.js viewer
![translate-bundle.jpg](translate/translate-bundle.jpg) ![translate-pdf.png](translate/translate-pdf.png)
![translate-pdf.jpg](translate/translate-pdf.jpg)
同时安装: 同时安装:
@ -54,5 +53,5 @@ Tampermonkey 是一款免费的浏览器扩展和最为流行的用户脚本管
脚本名 | 用途 脚本名 | 用途
-|- -|-
translate.js|划词翻译调用“金山词霸、有道词典有道翻译、Google Translate谷歌翻译、沪江小D、搜狗翻译、必应词典必应翻译、Microsoft Translator必应在线翻译、海词词典、百度翻译、Oxford Learner's Dictionaries、Oxford Dictionaries、Merriam-Webster、汉典、PDF 划词翻译”网页翻译 translate.js|划词翻译调用“金山词霸、有道词典有道翻译、Google Translate谷歌翻译、沪江小D、搜狗翻译、必应词典必应翻译、Microsoft Translator必应在线翻译、海词词典、百度翻译、Oxford Learner's Dictionaries、Oxford Dictionaries、Merriam-Webster、汉典、PDF 划词翻译、Google Search、Bing Search必应搜索、百度搜索、Wikipedia Search维基百科搜索”网页翻译
translate-dictionary.js|划词翻译调用“有道词典有道翻译、金山词霸、Bing 词典必应词典、剑桥高阶、沪江小D、谷歌翻译” translate-dictionary.js|划词翻译调用“有道词典有道翻译、金山词霸、Bing 词典必应词典、剑桥高阶、沪江小D、谷歌翻译”

Binary file not shown.

Before

Width:  |  Height:  |  Size: 177 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 162 KiB

View File

@ -1,7 +1,7 @@
// ==UserScript== // ==UserScript==
// @name 划词翻译:多词典查询 // @name 划词翻译:多词典查询
// @namespace http://tampermonkey.net/ // @namespace http://tampermonkey.net/
// @version 3.1 // @version 3.2
// @description 划词翻译调用“有道词典有道翻译、金山词霸、Bing 词典必应词典、剑桥高阶、沪江小D、谷歌翻译” // @description 划词翻译调用“有道词典有道翻译、金山词霸、Bing 词典必应词典、剑桥高阶、沪江小D、谷歌翻译”
// @author https://github.com/barrer // @author https://github.com/barrer
// @match http://*/* // @match http://*/*
@ -29,11 +29,13 @@
*{word-wrap:break-word!important;word-break:break-word!important} *{word-wrap:break-word!important;word-break:break-word!important}
a{color:#36f;text-decoration:none;cursor:pointer} a{color:#36f;text-decoration:none;cursor:pointer}
a:hover{text-decoration:underline} a:hover{text-decoration:underline}
img{cursor:pointer;display:inline-block;width:22px;height:22px;border:1px solid #dfe1e5;border-radius:22px;background-color:rgba(255,255,255,1);padding:2px;margin:0;margin-right:5px;box-sizing:content-box;vertical-align:middle} img{cursor:pointer;display:inline-block;width:22px;height:22px;border:1px solid #dfe1e5;background-color:rgba(255,255,255,1);padding:2px;margin:0;margin-right:5px;box-sizing:content-box;vertical-align:middle}
img:last-of-type{margin-right:auto} img:last-of-type{margin-right:auto}
img:hover{border:1px solid #c6c6c6;-webkit-box-shadow:1px 1px 3px rgba(0,0,0,0.1);box-shadow:1px 1px 3px rgba(0,0,0,0.1)} img:hover{border:1px solid #c6c6c6;-webkit-box-shadow:1px 1px 3px rgba(0,0,0,0.1);box-shadow:1px 1px 3px rgba(0,0,0,0.1)}
img[activate]{border:1px solid transparent;-webkit-box-shadow:0 0 0 1px #f90;box-shadow:0 0 0 1px #f90} img[activate]{border:1px solid #f90}
tr-icon{display:none;position:absolute;padding:2px;margin:0;cursor:move;box-sizing:content-box;font-size:13px;text-align:left;border:0;color:black;z-index:2147483647;background:#fff;border-radius:2px;-webkit-box-shadow:0 3px 8px 0 rgba(0,0,0,0.2),0 0 0 1px rgba(0,0,0,0.08);box-shadow:0 3px 8px 0 rgba(0,0,0,0.2),0 0 0 1px rgba(0,0,0,0.08)} img[activate]:hover{border:1px solid #f90;-webkit-box-shadow:unset;box-shadow:unset}
tr-icon{display:none;position:absolute;padding:0;margin:0;cursor:move;box-sizing:content-box;font-size:13px;text-align:left;border:0;color:black;z-index:2147483647;background:transparent}
tr-icon[activate]{background:#fff;-webkit-box-shadow:0 3px 8px 0 rgba(0,0,0,0.2),0 0 0 0 rgba(0,0,0,0.08);box-shadow:0 3px 8px 0 rgba(0,0,0,0.2),0 0 0 0 rgba(0,0,0,0.08)}
tr-audio{display:block;margin-bottom:5px} tr-audio{display:block;margin-bottom:5px}
tr-audio a{margin-right:1em;font-size:80%} tr-audio a{margin-right:1em;font-size:80%}
tr-audio a:last-of-type{margin-right:auto} tr-audio a:last-of-type{margin-right:auto}
@ -103,7 +105,7 @@
.cambridge .pos-body{margin-left:1em} .cambridge .pos-body{margin-left:1em}
.iciba strong{font-size:1em;font-weight:normal} .iciba strong{font-size:1em;font-weight:normal}
.iciba p{padding:0;margin:0} .iciba p{padding:0;margin:0}
.iciba .icIBahyI-footer{display:none} .iciba .icIBahyI-footer,.iciba .icIBahyI-suggest{display:none}
.iciba .icIBahyI-prons{color:#777} .iciba .icIBahyI-prons{color:#777}
.iciba .icIBahyI-eg{margin-right:1em} .iciba .icIBahyI-eg{margin-right:1em}
`; `;
@ -318,6 +320,7 @@
if (engineId == obj.id) { if (engineId == obj.id) {
return; // 已经是当前翻译引擎 return; // 已经是当前翻译引擎
} }
icon.setAttribute('activate', 'activate'); // 标注面板展开
contentList.innerHTML = ''; // 清空翻译内容列表 contentList.innerHTML = ''; // 清空翻译内容列表
displayContent(); // 立马显示翻译面板 displayContent(); // 立马显示翻译面板
content.scrollTop = 0; // 翻译面板滚动到顶端 content.scrollTop = 0; // 翻译面板滚动到顶端
@ -601,25 +604,10 @@
engineResult[id] = value; engineResult[id] = value;
} }
} }
/**翻译引擎结果集状态判断*/
function isAllDone() {
var rst = true;
var count = 0;
idsType.forEach(function (id) {
if (count < 0) { // 判断指定数量的完成情况
count++;
if (!(id in engineResult)) {
log('isAllDone(not found):' + id);
rst = false;
}
}
});
return rst;
}
/**显示内容面板*/ /**显示内容面板*/
function displayContent() { function displayContent() {
var panelHeight = 241 + 8; // icon 展开后总高度 var panelHeight = 237 + 8; // icon 展开后总高度
var panelWidth = 320 + 8; // icon 展开后总宽度 var panelWidth = 316 + 8; // icon 展开后总宽度
// 计算位置 // 计算位置
log('content position:', log('content position:',
'window.scrollY', window.scrollY, 'window.scrollY', window.scrollY,
@ -655,12 +643,6 @@
} }
/**内容面板填充数据*/ /**内容面板填充数据*/
function showContent() { function showContent() {
log('showContent:', idsType, engineResult);
if (isAllDone()) {
log('showContent allDone');
} else {
return;
}
log('showContent rendering'); log('showContent rendering');
// 发音 // 发音
audioEngines = []; // 清空防止多次渲染 audioEngines = []; // 清空防止多次渲染
@ -711,6 +693,7 @@
title.setAttribute('rel', 'noreferrer noopener'); title.setAttribute('rel', 'noreferrer noopener');
title.setAttribute('target', '_blank'); title.setAttribute('target', '_blank');
title.setAttribute('href', href); title.setAttribute('href', href);
title.setAttribute('title', '打开源网站');
contentList.appendChild(title); contentList.appendChild(title);
} }
contentList.appendChild(engineResult[id]); contentList.appendChild(engineResult[id]);
@ -734,6 +717,7 @@
/**隐藏 icon*/ /**隐藏 icon*/
function hideIcon() { function hideIcon() {
icon.style.display = 'none'; icon.style.display = 'none';
icon.removeAttribute('activate'); // 标注面板关闭
content.style.display = 'none'; content.style.display = 'none';
engineId = ''; engineId = '';
engineTriggerTime = 0; engineTriggerTime = 0;
@ -760,6 +744,7 @@
type.innerHTML = obj.name; type.innerHTML = obj.name;
type.setAttribute('href', 'javascript:void(0)'); type.setAttribute('href', 'javascript:void(0)');
type.setAttribute('class', 'audio-button'); type.setAttribute('class', 'audio-button');
type.setAttribute('title', '点击发音');
type.addEventListener('mouseup', function () { type.addEventListener('mouseup', function () {
play(obj); play(obj);
}); });

Binary file not shown.

After

Width:  |  Height:  |  Size: 64 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 189 KiB

BIN
translate/translate-pdf.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 98 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 179 KiB

File diff suppressed because one or more lines are too long

BIN
translate/translate.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 68 KiB