// ==UserScript==
// @name 翻译
// @namespace http://tampermonkey.net/
// @version 0.1
// @description try to take over the world!
// @author su
// @match http://*/*
// @include https://*/*
// @grant GM_xmlhttpRequest
// @connect cn.bing.com
// @connect fy.iciba.com
// ==/UserScript==
(function() {
//金山词霸翻译接口
const cibaUrl = "http://fy.iciba.com/ajax.php?a=fy";
//css样式
const style = {
'ballStyle': 'position: fixed;top: 100px;right: 0;width: 40px;height: 40px;border-radius: 50%;border: 1px solid #ececec;text-align: center;line-height: 40px;font-size: 24px;ont-weight: 900;color: rgb(103, 192, 192);cursor: pointer;',
'traStyle': 'position: fixed;top: 100px;right: 0;width: 30%;border-radius: 6px;font: 13px/normal Arial, Helvetica;visibility: hidden;box-shadow: 0 0 0 1px rgba(0, 0, 0, .05), 0 2px 3px 0 rgba(0, 0, 0, .1);',
'selectStyle': 'width: 60%;margin-top: 3px;border: 1px solid #ececec;height: 28px;border-radius: 2px;color: #666;',
'textareaStyle': 'height: 96px;top: 40px;width: 100%;font-weight: normal;font-family: "Roboto", Sans-Serif;outline: none;-webkit-appearance: none;white-space: pre-wrap;word-wrap: break-word;z-index: 2;background: transparent;border-width: 0;',
'dTextStyle': 'height: auto;min-height: 120px;padding: 30px 20px 12px 20px;overflow: hidden;'
}
/**
* ajax 跨域访问公共方法
* @param {*} url
* @param {*} method
* @param {*} data
*/
function ajax(url, method, data) {
if (!!!method)
method = 'GET';
GM_xmlhttpRequest({
method: method,
url: url,
onload: function(res) {
console.log(res.responseText);
document.getElementById("tra_text").value = JSON.parse(res.responseText).content.out;
},
onerror: function(res) {
console.log("连接失败:" + res);
}
});
}
/**
* 创建选择下拉框
* @param {*} id
* @param {*} selected
*/
function createSelect(id, selected) {
var select = document.createElement('select');
select.setAttribute('id', id);
select.setAttribute('style', style.selectStyle);
select.innerHTML = '<option value="en" selected>英语</option><option value="zh-Hans">简体中文</option><option value="ar">阿拉伯语</option><option value="et">爱沙尼亚语</option><option value="bg">保加利亚语</option><option value="is">冰岛语</option><option value="pl">波兰语</option><option value="bs-Latn">波斯尼亚语(拉丁语)</option><option value="fa">波斯语</option><option value="da">丹麦语</option><option value="de">德语</option><option value="ru">俄语</option><option value="fr">法语</option><option value="zh-Hant">繁体中文</option><option value="fil">菲律宾语</option><option value="fj">斐济语</option><option value="fi">芬兰语</option><option value="ht">海地克里奥尔语</option><option value="ko">韩语</option><option value="nl">荷兰语</option><option value="ca">加泰罗尼亚语</option><option value="cs">捷克语</option><option value="otq">克雷塔罗奥托米语</option><option value="tlh">克林贡语</option><option value="hr">克罗地亚语</option><option value="lv">拉脱维亚语</option><option value="lt">立陶宛语</option><option value="ro">罗马尼亚语</option><option value="mg">马达加斯加语</option><option value="mt">马耳他语</option><option value="ms">马来语(拉丁语)</option><option value="bn-BD">孟加拉语</option><option value="mww">苗语</option><option value="af">南非荷兰语</option><option value="pt">葡萄牙语</option><option value="ja">日语</option><option value="sv">瑞典语</option><option value="sm">萨摩亚语</option><option value="sr-Latn">塞尔维亚语(拉丁语)</option><option value="sr-Cyrl">塞尔维亚语(西里尔文)</option><option value="no">书面挪威语</option><option value="sk">斯洛伐克语</option><option value="sl">斯洛文尼亚语</option><option value="sw">斯瓦希里语</option><option value="ty">塔希提语</option><option value="te">泰卢固语</option><option value="ta">泰米尔语</option><option value="th">泰语</option><option value="to">汤加语</option><option value="tr">土耳其语</option><option value="cy">威尔士语</option><option value="ur">乌尔都语</option><option value="uk">乌克兰语</option><option value="es">西班牙语</option><option value="he">希伯来语</option><option value="el">希腊语</option><option value="hu">匈牙利语</option><option value="it">意大利语</option><option value="hi">印地语</option><option value="id">印度尼西亚语</option><option value="yua">尤卡坦玛雅语</option><option value="vi">越南语</option><option value="yue">粤语(繁体)</option>';
setSelectChecked(select, selected);
return select;
}
/**
* 设置下拉框选中
* @param {*} select
* @param {*} checkValue
*/
function setSelectChecked(select, checkValue) {
for (var i = 0; i < select.options.length; i++) {
if (select.options[i].innerHTML == checkValue) {
select.options[i].selected = true;
break;
}
}
};
/**
* 创建输入框
* @param {输入框id} id
*/
function createTextArea(id) {
var ta = document.createElement('textarea');
ta.setAttribute('id', id);
ta.setAttribute('style', style.textareaStyle);
ta.setAttribute('placeholder', '输入文本');
return ta;
}
/**
* 创建小球
*/
function createBall() {
var ball = document.createElement('div');
ball.setAttribute('id', 'ball');
ball.setAttribute('style', style.ballStyle)
ball.innerHTML = '译'
return ball;
}
/**
* 创建列
*/
function createOriTd() {
var oriTd = document.createElement('td');
oriTd.setAttribute('id', 'oriTd');
oriTd.setAttribute('style', 'border-right: 1px solid #ececec;background-color: #fff;width: 50%;');
var div = document.createElement('div');
var div_s = document.createElement('div');
var div_t = document.createElement('div');
div_s.setAttribute('style', 'margin: 10px 8px 0 16px;height: 40px;');
div_t.setAttribute('style', style.dTextStyle);
div_s.appendChild(createSelect('ori_select', '英语'));
div_t.appendChild(createTextArea('ori_text'));
div.appendChild(div_s);
div.appendChild(div_t);
oriTd.appendChild(div);
return oriTd;
}
/**
* 创建列
*/
function createTraTd() {
var traTd = document.createElement('td');
traTd.setAttribute('id', 'traTd');
traTd.setAttribute('style', 'width: 50%;background: #f9f9f9;');
var div = document.createElement('div');
var div_s = document.createElement('div');
var div_t = document.createElement('div');
div_s.setAttribute('style', 'margin: 10px 8px 0 16px;height: 40px;');
div_t.setAttribute('style', style.dTextStyle);
div_s.appendChild(createSelect('tra_select', '简体中文'));
div_t.appendChild(createTextArea('tra_text'));
div.appendChild(div_s);
div.appendChild(div_t);
traTd.appendChild(div);
return traTd;
}
/**
* 创建翻译框
*/
function createTra() {
var tra = document.createElement('div');
tra.setAttribute('id', 'tra');
tra.setAttribute('style', style.traStyle)
var table = document.createElement('table');
table.setAttribute('style', "width: 100%");
var tr = document.createElement('tr');
tr.appendChild(createOriTd());
tr.appendChild(createTraTd());
table.appendChild(tr);
tra.appendChild(table);
return tra;
}
/**
* 创建翻译主面板
*/
function createMain() {
var main_s = document.createElement('div');
main_s.setAttribute('id', 'main_s');
main_s.setAttribute('style', 'z-index:10086');
main_s.appendChild(createBall());
main_s.appendChild(createTra())
return main_s;
}
/**
* 金山词霸翻译
* @param {需要翻译文本的语言} f
* @param {翻译结果的语言} t
* @param {翻译原文} w
*/
function cibaFun(f, t, w) {
var url = cibaUrl + "&f=" + f + "&t=" + t + "&w=" + w;
ajax(url);
}
//判断当前窗口是否为最顶层窗口,是则创建
if (window.top == window.self) {
var timeout;
document.body.appendChild(createMain());
/**
* 控制翻译面板的显示
*/
function hideTra() {
document.getElementById('tra').style.visibility = 'hidden';
document.getElementById('tra').style.height = 0;
document.getElementById("ball").style.visibility = 'visible'
}
document.getElementById("main_s").onmouseleave = function() {
timeout = setTimeout(hideTra, 2000);
};
document.getElementById("main_s").onmouseenter = function() {
clearTimeout(timeout);
}
document.getElementById("ball").onclick = function() {
document.getElementById('tra').style.visibility = 'visible';
document.getElementById('tra').style.height = 'auto';
document.getElementById("ball").style.visibility = 'hidden'
}
document.getElementById("ori_text").onchange = function() {
var from = document.getElementById("ori_select").value;
var to = document.getElementById("tra_select").value;
cibaFun(from, to, document.getElementById("ori_text").value)
}
}
})()