// ==UserScript==
// @name Google Translator Tooltip
// @namespace meh
// @description Translates selected text into a tooltip.
// @include http://*
// @require http://code.jquery.com/jquery-1.7.2.min.js
// @require http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.13/jquery-ui.min.js
// ==/UserScript==
const HREF_NO = 'javascript:void(0)';
const MAX_Z = 2147483640;
var imgLookup;
var txtSel; // text selected
var currentURL;
var languagesGoogle;
var timerWindowResize;
var initialized = false;
var COLOR_BG1, COLOR_BG2, COLOR_TEXT, COLOR_LINK;
var colorschemes = [
{name:'Default', bg1:'#FFFF77', bg2:'#FFFFAA', link:'#0000FF', text:'#333333'},
{name:'Dark', bg1:'#333', bg2:'#555', link:'#ddd', text:'#eee'},
// http://www.colorschemer.com/schemes/viewscheme.php?id=9456
{name:'Dark green', bg1:'#284030', bg2:'#5D7350', link:'#FAFCB6', text:'#E2F0A8'},
//http://www.colorschemer.com/schemes/viewscheme.php?id=315
{name:'Dark blue', bg1:'#2D4358', bg2:'#3A5065', link:'#b5cce3', text:'#b5cce3'},
//http://www.colorschemer.com/schemes/viewscheme.php?id=9603
{name:'Dark red', bg1:'#751310', bg2:'#9C1B19', link:'#FAEFE0', text:'#FAEFE0'},//DEB990
//http://www.colorschemer.com/schemes/viewscheme.php?id=158
{name:'Light green', bg1:'#4F724F', bg2:'#649064', link:'#EDF8ED', text:'#EDF8ED'},
//http://www.colorschemer.com/schemes/viewscheme.php?id=158
{name:'Light blue', bg1:'#4D6680', bg2:'#647A90', link:'#EDF2F8', text:'#EDF2F8'}
]
//setup events
document.addEventListener('mouseup', showLookupIcon, false);
document.addEventListener('mousedown', mousedownCleaning, false);
window.addEventListener('resize', windowResizeHandler, false);
function mousedownCleaning(evt){
var divDic = getId('divDic');
var divLookup = getId('divLookup');
if(divDic)
{
if(!clickedInsideID(evt.target,'divDic')){
divDic.parentNode.removeChild(divDic);
}
}
if(divLookup)
divLookup.parentNode.removeChild(divLookup);
}
function showLookupIcon(evt){
if(evt.ctrlKey && evt.altKey && (!GM_getValue('ctrl') || !GM_getValue('alt')))
return;
//XOR http://www.howtocreate.co.uk/xor.html
if(evt.ctrlKey ? !GM_getValue('ctrl') : GM_getValue('ctrl'))
return;
if(evt.altKey ? !GM_getValue('alt') : GM_getValue('alt'))
return;
var divDic = getId('divDic');
var divLookup = getId('divLookup');
txtSel = getSelection(evt);
//exit if no text is selected
if(!txtSel || txtSel=="")
{
if(divDic)
{
if(!clickedInsideID(evt.target,'divDic')){
divDic.parentNode.removeChild(divDic);
deselect();
}
}
if(divLookup)
divLookup.parentNode.removeChild(divLookup);
return;
}
//possible cleanup
if(divDic)
{
if(!clickedInsideID(evt.target,'divDic')){
divDic.parentNode.removeChild(divDic);
deselect();
}
return;
}
//remove div if exists
if(divLookup)
{
divLookup.parentNode.removeChild(divLookup);
}
if(!initialized){
initialized = true;
images();
if( GM_getValue('opt_youtube') == undefined ){
GM_setValue('opt_youtube',true)
GM_setValue('opt_youtube_auto',true)
GM_setValue('opt_compare',true)
}
}
css(true);
//div container
divLookup = createElement('div', {id: 'divLookup', style: 'top:'+(evt.clientY+window.pageYOffset+10)+'px; left:'+(evt.clientX + window.pageXOffset + 10) + 'px;'});
divLookup.appendChild(imgLookup.cloneNode(false));
divLookup.addEventListener('mouseover', lookup, false);
document.body.appendChild(divLookup);
if(GM_getValue('opt_shadow')==true)
$(divLookup).addClass('classShadowww')
repositionNode($('#divLookup'));
}
function lookup(evt){
var divResult = null;
var divDic = getId('divDic');
var divLookup = getId('divLookup');
var top = divLookup.style.top;
var left = divLookup.style.left;
//no text selected
if(!txtSel || txtSel==""){
if(divDic = getId('divDic'))
divDic.parentNode.removeChild(divDic);
return;
}
//cleanup divs
if(divDic = getId('divDic'))
{
divDic.parentNode.removeChild(divDic);
}
divLookup.parentNode.removeChild(divLookup);
//div container
divDic = createElement('div', {id:'divDic'});
divDic.style.top = top;
divDic.style.left = left;
divDic.addEventListener('mousedown', dragHandler, false);
document.body.appendChild(divDic);
if(GM_getValue('opt_shadow')==true)
$(divDic).addClass('classShadowww')
//div result
divResult = createElement('div', {id:'divResult'}, null, 'Loading...');
divDic.appendChild(divResult);
//options link
divDic.appendChild(createElement('span', {id:'optionsLink', title:'options', href:HREF_NO}, 'click toggleOptions false', '>>'));
//lookup
if( txtSel.search(/^\s*https?:\/\//) > -1 )
{
divResult.innerHTML = '<a class="gootranslink" href="'+txtSel+'" target="_blank" >'+txtSel+'</a>';
if(GM_getValue('opt_youtube') && isYoutubeLink(txtSel) )
return;
}
else if( txtSel.search(/^\s*\S+(\.\S+)+/) > -1 ) // site.dom
{
divResult.innerHTML = '<a class="gootranslink" href="http://'+txtSel+'" target="_blank" >'+txtSel+'</a>';
if(GM_getValue('opt_youtube') && isYoutubeLink(txtSel) )
return;
}
else
{
var sl, tl, lang;
sl = GM_getValue('from') ? GM_getValue('from') : "auto";
tl = GM_getValue('to') ? GM_getValue('to') : "auto";
lang = sl + "|" + tl;
currentURL = "http://www.google.com/translate_t?text=" + txtSel + "&langpair=" + lang;
GM_xmlhttpRequest({
method: 'GET',
url: currentURL,
onload: function(resp) {
try{
extractResultFrames(resp);
}catch(e){
GM_log(e);
}
}
});
}
repositionNode($('#divDic'));
//store query as attribute
getId('divDic').setAttribute('query', txtSel);
//other searches
divDic.appendChild(createElement('span',{id:'spanOtherSearches', title:'search other sites'},'mouseover otherSites false','+'));
}
function quickLookup(){
getId('divResult').innerHTML = 'Loading...'
currentURL = "http://www.google.com/translate_t?text=" + $('#divDic').attr('query') + "&langpair=" + getId('optSelLangFrom').value + "|" + getId('optSelLangTo').value;
GM_xmlhttpRequest({
method: 'GET',
url: currentURL,
onload: function(resp) {
try{
extractResultFrames(resp);
}catch(e){
GM_log(e);
}
}
});
}
function otherSites(evt){
var ul, li, query = getId('divDic').getAttribute('query').replace(/\s+$/,'').replace(/^\s+/,'');
var sites = [
{name:'Google', href:'http://www.google.com/search?q='+query.replace(/\s+/g,'+')},
{name:'Google Images', href:'http://www.google.com/images?q='+query.replace(/\s+/g,'+')},
{name:'The Free Dictionary', href:'http://www.thefreedictionary.com/'+query.replace(/\s+/g,'+')},
{name:'Urban Dictionary', href:'http://www.urbandictionary.com/define.php?term='+query.replace(/\s+/g,'+')},
{name:'Linguee', href:'http://www.linguee.com/search?query='+query.replace(/\s+/g,'+')},
{name:'Wikipedia', href:'http://www.wikipedia.org/w/index.php?title=Special%3ASearch&search='+query.replace(/\s+/g,'+')},
{name:'IMDb', href:'http://www.imdb.com/find?s=all&q='+query.replace(/\s+/g,'+')},
{name:'Youtube', href:'http://www.youtube.com/results?search_query='+query.replace(/\s+/g,'+')}
];
getId('divDic').appendChild(createElement('br'));
getId('divDic').appendChild(document.createTextNode('Search "'+(query.match(/^[\s\S]{15}/) ? query.match(/^[\s\S]{15}/)[0]+'...' : query.match(/^[\s\S]+/)[0] )+'" at:'));
ul = getId('divDic').appendChild(createElement('ul'));
for(var i=0; i<sites.length; i++){
li = ul.appendChild(createElement('li'));
li.appendChild(createElement('a', {class:'gootranslink', target:'_blank', href:sites[i].href}, null, sites[i].name));
}
evt.target.parentNode.removeChild(evt.target);
repositionNode($('#divDic'));
}
function extractResultFrames(resp){
//select body and remove some tags
var html = resp.responseText.match(/\<body[^\>]*\>([\s\S]+)\<\/body\>/)[1];
html = html.replace(/\<script[^\<]+\<\/script\>/ig, '');
html = html.replace(/\<iframe[^\<]+\<\/iframe\>/ig, '');
//append requested page as hidden iframe
var iframe = document.body.appendChild(createElement('iframe', {style:'visibility:hidden;'}));
var divExtract = iframe.contentWindow.document.body.appendChild(createElement('div', {id:'divExtract'}, null, html));
divExtract = document.importNode(divExtract, true);
iframe.parentNode.removeChild(iframe);
//adjust link(s)
var arrs = getTag('a',divExtract);
for(var i=0; i<arrs.length; i++){
arrs[i].setAttribute('target','_blank');
arrs[i].setAttribute('class','gootranslink');
}
//gather info
var translation = trim( xp('.//span[@id="result_box"]', divExtract)[0].textContent );
var dict = xp('.//div[@id="gt-res-dict"]', divExtract)[0];
if(dict){
try{
dict.removeChild(getTag('h3',dict)[0]);
dict = dict.innerHTML;
}catch(e){
dict = null;
}
}
//parse info
getId('divResult').innerHTML = '<a class="gootranslink" href="'+currentURL+'" target="_blank">'
+ translation
+ '</a>'
+ '<div id="divCompareee" ' + (GM_getValue('opt_compare')==true ? '' : 'style="display:none;"') + '>' + $('#divDic').attr('query') + '</div>';
if(dict)
{
getId('divResult').innerHTML += '<br><br><div id="dict">'+dict+'</div>';
}
repositionNode($('#divDic'));
}
function repositionNode(node){
//reposition div if out of bounds
var pos = node.offset();
if(pos==null)
return;
var w = node.width();
var h = node.height();
if(pos.left + w > window.innerWidth+window.pageXOffset){
node.css('left', window.innerWidth+window.pageXOffset - w - 25);
}
if(pos.top + h > window.innerHeight+window.pageYOffset){
node.css('top', window.innerHeight+window.pageYOffset - h - 25);
}
}
function repositionNodeFixed(node,pad){
//reposition fixed node if out of window
var pos = node.offset();
if(pos==null)
return;
var w = node.width();
var h = node.height();
if(pos.left + w > window.innerWidth+window.pageXOffset){
node.css('left', window.innerWidth- w - (pad?pad:25));
}
if(pos.top + h > window.innerHeight+window.pageYOffset){
node.css('top', window.innerHeight - h - (pad?pad:25));
}
}
function trim(str){
return str.replace(/^\s+/,'').replace(/\s+$/,'');
}
function getSelection(evt){
var txt = null;
//get selected text
if(evt && evt.target.nodeName=='TEXTAREA')
{
//var begin = evt.target.value.substr(0, evt.target.selectionStart);
txt = evt.target.value.substr(evt.target.selectionStart, evt.target.selectionEnd - evt.target.selectionStart);
//var end = evt.target.value.substr(evt.target.selectionEnd);
//myArea.value = begin + text1 + selection + text2 + end;
}
else if (window.getSelection)
{
txt = window.getSelection();
}
else if (document.getSelection)
{
txt = document.getSelection();
}
else if (document.selection)
{
txt = document.selection.createRange().text;
}
try{
return txt.toString();
}catch(e){
return txt;
}
}
//http://stackoverflow.com/questions/6186844/clear-a-selection-in-firefox/6187098#6187098
function deselect(){
try{
window.getSelection().removeAllRanges()
}catch(e){
document.selection.empty()
}
}
function isYoutubeLink(txt){
var id, time=null;
if(txt.search(/youtube\.com\/watch\?/) > -1)
id = txt.match(/[\?\&]v\=([^\&]+)/)[1]
else if(txt.search(/youtu.be\//) > -1)
id = txt.match(/youtu.be\/([^\?]+)/)[1]
else if(txt.search(/youtube\.com\/v\/[^\?]+/) > -1) //embed url
id = txt.match(/youtube\.com\/v\/([^\?]+)/)[1]
else
return false;
//if skip to timestamp
try{
time = txt.match(/[\?\&\#](t\=[^\&]+)/)[1];
}catch(e){
time = null;
}
if(time!=null){
//convert to seconds for parameter "start"
var h, m, s;
try{ h = parseInt(time.match(/(\d+)h/)[1]); }catch(e){ h = 0; }
try{ m = parseInt(time.match(/(\d+)m/)[1]); }catch(e){ m = 0; }
try{ s = parseInt(time.match(/(\d+)s/)[1]); }catch(e){ s = 0; }
time = s + (m*60) + (h*60*60);
}else{
//if embed url ( http://www.youtube.com/v/vIdEoIddD?fs=1&autoplay=1&start=34 )
if(txt.search(/[\?\&]start\=\d+/) > -1)
time = txt.match(/start\=(\d+)/)[1];
}
//clear selection
deselect();
//check if video is already opened
if( $('.classDivYoutubeeee[ytvid="'+id+'"]').length > 0 ){
var div = $('.classDivYoutubeeee[ytvid="'+id+'"]:first');
if(div.hasClass('classYoutubeMinimizeddd')){
toggleYoutubeSize({target: div.find('.classtoggleSize:first').get(0)})
}
div.effect('shake',{times:2})
//remove lookup icon, div dict
$('#divDic,#divLookup').remove()
return true;
}
// create video div
var auto = GM_getValue('opt_youtube')==true && GM_getValue('opt_youtube_auto')==true ? 1 : 0;
var url = 'http://www.youtube.com/v/' + id + '?fs=1&autoplay=' + auto + ( time!=null ? '&start='+time : '');
var pos = $('#divDic').offset();
var div = $('<div>')
.attr('ytvid',id)
.addClass('classDivYoutubeeee')
.css({backgroundColor:COLOR_BG1, position:'fixed', top:Math.abs(window.pageYOffset-pos.top), left:Math.abs(window.pageXOffset-pos.left), zIndex:MAX_Z, padding:'0px 26px', borderRadius:'5px'})
.appendTo(document.body)
.append(
$('<span title="close">').css({float:'right', cursor:'pointer',color:COLOR_LINK, marginLeft:7}).append('\u24E7').click(function(evt){
$(this).parents('.classDivYoutubeeee:first').remove();
})
)
.append(
$('<span class="classtoggleSize" title="toggle size">').css({float:'right', cursor:'pointer',color:COLOR_LINK, marginLeft:7}).append('\u21F2').click(toggleYoutubeSize)
)
.append('<br><object><param name="movie" value="'+url+'"</param><param name="allowFullScreen" value="true"></param><embed src="'+url+'" type="application/x-shockwave-flash" allowfullscreen="true" width="425" height="344"></embed></object><br><br>')
.draggable()
//add shadow
if(GM_getValue('opt_shadow')==true)
div.addClass('classShadowww')
//position
repositionNodeFixed(div);
//remove lookup icon, div dict
$('#divDic,#divLookup').remove()
return true;
}
function toggleYoutubeSize(evt){
var div = $(evt.target).parents('.classDivYoutubeeee:first');
var ytlink = div.find('a[href*="youtube.com"]');
var pos = div.offset();
if(!div.hasClass('classYoutubeMinimizeddd')){ // minimize
ytlink.hide();
div.addClass('classYoutubeMinimizeddd');
//backup div position
div.attr({prevlefttt: Math.abs(window.pageXOffset - pos.left), prevtoppp: Math.abs(window.pageYOffset - pos.top)})
//resize div
div.find('embed').attr({width:'212.5', height:'172'})
//position div
div.css({top:window.innerHeight-div.outerHeight()-7, left:window.innerWidth-div.outerWidth()-13})
if($('.classYoutubeMinimizeddd').length > 1){//distribute minimized divs
var len = $('.classYoutubeMinimizeddd').length;
var top = div.offset().top;
var left = div.offset().left;
left -= (div.outerWidth()+7) * (len-1);
if(left < 0){
left = div.offset().left;
}
div.css({left:left})
}
//change icon to maximize
evt.target.innerHTML = '\u21F1';
}else{ // restore
ytlink.show();
div.removeClass('classYoutubeMinimizeddd');
//restore div position
div.css({top:div.attr('prevtoppp')+'px', left:div.attr('prevlefttt')+'px'})
//restore div size
div.find('embed').attr({width:'425', height:'344'})
//set minimize icon
evt.target.innerHTML = '\u21F2';
}
}
function windowResizeHandler(evt){
clearTimeout(timerWindowResize);
timerWindowResize = setTimeout(windowResized,333);
}
function windowResized(evt){
if($('#divDic,.classDivYoutubeeee').length==0)
return;
if($('#divDic').length > 0)
repositionNodeFixed($('#divDic'));
if($('.classDivYoutubeeee').length > 0){
var vids = $('.classDivYoutubeeee');
for(var i=0; i<vids.length; i++)
repositionNodeFixed(vids.eq(i),35);
}
}
function toggleOptions(evt){
if(!languagesGoogle){
languagesGoogle = '<option value="auto">Detect language</option><option value="sq">Albanian</option><option value="ar">Arabic</option><option value="bg">Bulgarian</option><option value="ca">Catalan</option><option value="zh-TW">Chinese_TC</option><option value="zh-CN">Chinese</option><option value="hr">Croatian</option><option value="cs">Czech</option><option value="da">Danish</option><option value="nl">Dutch</option><option value="en">English</option><option value="et">Estonian</option><option value="tl">Filipino</option><option value="fi">Finnish</option><option value="fr">French</option><option value="gl">Galician</option><option value="de">German</option><option value="el">Greek</option><option value="iw">Hebrew</option><option value="hi">Hindi</option><option value="hu">Hungarian</option><option value="id">Indonesian</option><option value="it">Italian</option><option value="ja">Japanese</option><option value="ko">Korean</option><option value="lv">Latvian</option><option value="lt">Lithuanian</option><option value="mt">Maltese</option><option value="no">Norwegian</option><option value="pl">Polish</option><option value="pt">Portuguese</option><option value="ro">Romanian</option><option value="ru">Russian</option><option value="sr">Serbian</option><option value="sk">Slovak</option><option value="sl">Slovenian</option><option value="es">Spanish</option><option value="sv">Swedish</option><option value="th">Thai</option><option value="tr">Turkish</option><option value="uk">Ukrainian</option><option value="vi">Vietnamese</option>';
}
var divOptions = getId('divOpt');
if(!divOptions)//show options
{
divOptions = createElement('div', {id:'divOpt'});
getId('divDic').appendChild(divOptions);
getId('optionsLink').style.visibility = 'hidden';
//from
divOptions.appendChild(createElement('span', null, null,'From:'));
divOptions.appendChild(createElement('select', {id:'optSelLangFrom'}, null, languagesGoogle));
getId('optSelLangFrom').value = GM_getValue('from') ? GM_getValue('from') : "auto";
getId('optSelLangFrom').addEventListener('change', quickLookup, false);
//to
divOptions.appendChild(createElement('span', null, null,' To:'));
divOptions.appendChild(createElement('select', {id:'optSelLangTo'}, null, languagesGoogle));
getId('optSelLangTo').value = GM_getValue('to') ? GM_getValue('to') : "auto";
getId('optSelLangTo').addEventListener('change', quickLookup, false);
//use ctrl
divOptions.appendChild(createElement('br'));
divOptions.appendChild(createElement('br'));
divOptions.appendChild(createElement('input', {id:'checkCtrl', type:'checkbox'}));
divOptions.appendChild(createElement('span', null, null,'Use Ctrl key'));
getId('checkCtrl').checked = GM_getValue('ctrl');
//use alt
divOptions.appendChild(createElement('br'));
divOptions.appendChild(createElement('input', {id:'checkAlt', type:'checkbox'}));
divOptions.appendChild(createElement('span', null, null,'Use Alt key'));
getId('checkAlt').checked = GM_getValue('alt');
//Compare
divOptions.appendChild(createElement('br'));
divOptions.appendChild(createElement('input', {id:'checkCompare', type:'checkbox'}));
divOptions.appendChild(createElement('span', null, null,'Compare translation to original'));
getId('checkCompare').checked = GM_getValue('opt_compare');
$('#checkCompare').click(function(evt){
if(this.checked){
$('#divCompareee').show()
}else{
$('#divCompareee').hide()
}
})
//box shadow
divOptions.appendChild(createElement('br'));
divOptions.appendChild(createElement('input', {id:'checkShadowww', type:'checkbox'}));
divOptions.appendChild(createElement('span', null, null,'Show box shadow'));
getId('checkShadowww').checked = GM_getValue('opt_shadow');
$('#checkShadowww').click(function(evt){
if(this.checked){
$('#divDic').addClass('classShadowww')
}else{
$('.classShadowww').removeClass('classShadowww')
}
})
//youtube
divOptions.appendChild(createElement('br'));
divOptions.appendChild(createElement('input', {id:'checkYoutubeee', type:'checkbox'}));
divOptions.appendChild(createElement('span', null, null,'Preview Youtube links'));
getId('checkYoutubeee').checked = GM_getValue('opt_youtube');
$(divOptions).append(
$('<div id="divOptYoutubeee">')
.css({display: GM_getValue('opt_youtube')==true?'block':'none'})
//.append('<br>')
.append(' <input id="checkYoutubeAutoplayyy" type="checkbox">')
.append('autoplay video')
)
getId('checkYoutubeAutoplayyy').checked = GM_getValue('opt_youtube_auto');
$('#checkYoutubeee').click(function(evt){
if(this.checked){
$('#divOptYoutubeee').show()
}else{
$('#divOptYoutubeee').hide()
}
})
//colors
$(divOptions).append(
'<br>'
+'<table id="tablecolorrr">'
+'<tr><td>Color schemes:</td><td colspan=2><select id="selectColorSchemesss"><option value=""></option></select> <a class="gootranslink" id="spanNewColorSchemeee" statusss="hidden" href="'+HREF_NO+'">customize</span> </td></tr>'
+'<tr style="display:none;"> <td>Background 1:</td> <td><input type="text" size="10" id="inputbgcolor111" value="'+COLOR_BG1+'" /></td> <td><input class="simplecolorrr" id="bgcolor111" value="'+COLOR_BG1+'" /></td> </tr>'
+'<tr style="display:none;"><td>Background 2:</td> <td><input type="text" size="10" id="inputbgcolor222" value="'+COLOR_BG2+'" /></td> <td><input class="simplecolorrr" id="bgcolor222" value="'+COLOR_BG2+'" /></td> </tr>'
+'<tr style="display:none;"><td>Text:</td> <td><input type="text" size="10" id="inputtxttt" value="'+COLOR_TEXT+'" /></td> <td><input class="simplecolorrr" id="textcolorrr" value="'+COLOR_TEXT+'" /></td></tr>'
+'<tr style="display:none;"><td>Link:</td> <td><input type="text" size="10" id="inputlinkkk" value="'+COLOR_LINK+'" /></td> <td><input class="simplecolorrr" id="linkcolorrr" value="'+COLOR_LINK+'" /></td></tr>'
+'</table>'
)
$('.simplecolorrr').simpleColor({boxWidth:'0px', boxHeight:'0px', buttonClass:'classButtonColorrr'});
$('#bgcolor111, #bgcolor222, #linkcolorrr, #textcolorrr').change(optColorPickerChanged);
$('#inputbgcolor111, #inputbgcolor222, #inputlinkkk, #inputtxttt').keyup(optColorInputChanged);
for(var i=0; i<colorschemes.length; i++){
$('#selectColorSchemesss').append('<option value="'+colorschemes[i].name+'">'+colorschemes[i].name+'</option>')
}
$('#selectColorSchemesss').change(changeColorScheme)
$('#spanNewColorSchemeee').click(function(evt){
if($('#spanNewColorSchemeee').attr('statusss')=='hidden'){
$('#tablecolorrr tr:not(:first-child)').show();
$('#spanNewColorSchemeee').attr('statusss','visible');
}else{
$('#tablecolorrr tr:not(:first-child)').hide();
$('#spanNewColorSchemeee').attr('statusss','hidden');
}
})
//save
divOptions.appendChild(createElement('br'));
divOptions.appendChild(createElement('a', {href:HREF_NO, class:"gootranslink"}, 'click saveOptions false', 'save'));
//cancel
divOptions.appendChild(createElement('span', null, null,' '));
divOptions.appendChild(createElement('a', {href:HREF_NO, class:"gootranslink"}, 'click toggleOptions false', 'cancel'));
repositionNode($('#divDic'));
}
else//cancel options
{
divOptions.parentNode.removeChild(divOptions);
getId('optionsLink').style.visibility = 'visible';
css(true)
}
}
function changeColorScheme(evt){
var name = this.value;
if(name=='')
return;
var sch = getColorSchemeByName(name);
if(sch == null){
return;
}
COLOR_BG1 = sch.bg1;
COLOR_BG2 = sch.bg2;
COLOR_TEXT = sch.text;
COLOR_LINK = sch.link;
css();
$('#inputbgcolor111').val(COLOR_BG1)
$('#inputbgcolor222').val(COLOR_BG2)
$('#inputtxttt').val(COLOR_TEXT)
$('#inputlinkkk').val(COLOR_LINK)
}
function getColorSchemeByName(name){
for(var i=0; i<colorschemes.length; i++){
if(name == colorschemes[i].name)
return colorschemes[i];
}
return null;
}
function optColorInputChanged(evt){
var id, color = evt.target.value;
// http://networking.mydesigntool.com/viewtopic.php?tid=415&id=31
if(!isColorValid(color)){
return;
}
if(color.charAt(0)!='#'){
color = '#'+color;
}
id = evt.target.getAttribute('id');
if(id=='inputbgcolor111'){
COLOR_BG1 = color;
css();
}else if(id=='inputbgcolor222'){
COLOR_BG2 = color;
css();
}else if(id=='inputtxttt'){
COLOR_TEXT = color;
css();
}else if(id=='inputlinkkk'){
COLOR_LINK = color;
css();
}
}
function isColorValid(color){
return (color.search(/^(#)?([0-9a-fA-F]{3})([0-9a-fA-F]{3})?$/) == 0);
}
function optColorPickerChanged(evt){
var color = evt.target.value;
var id = evt.target.getAttribute('id');
if(id=='bgcolor111'){
COLOR_BG1 = color;
$('#inputbgcolor111').val(color)
css();
}else if(id=='bgcolor222'){
COLOR_BG2 = color;
$('#inputbgcolor222').val(color)
css();
}else if(id=='textcolorrr'){
COLOR_TEXT = color;
$('#inputtxttt').val(color)
css();
}else if(id=='linkcolorrr'){
COLOR_LINK = color;
$('#inputlinkkk').val(color)
css();
}
}
function saveOptions(evt){
var from = getId('optSelLangFrom').value;
var to = getId('optSelLangTo').value;
var ctrl = getId('checkCtrl').checked;
var alt = getId('checkAlt').checked;
var compare = getId('checkCompare').checked;
var shadow = getId('checkShadowww').checked;
var yt = getId('checkYoutubeee').checked;
var ytauto = getId('checkYoutubeAutoplayyy').checked;
GM_setValue('from', from);
GM_setValue('to', to);
GM_setValue('ctrl', ctrl);
GM_setValue('alt', alt);
GM_setValue('opt_compare', compare);
GM_setValue('opt_shadow', shadow);
GM_setValue('opt_youtube', yt);
GM_setValue('opt_youtube_auto', ytauto);
//colors
if(!isColorValid($('#inputbgcolor111').val())){
$('#inputbgcolor111').effect('pulsate');
return;
}
if(!isColorValid($('#inputbgcolor222').val())){
$('#inputbgcolor222').effect('pulsate');
return;
}
if(!isColorValid($('#inputtxttt').val())){
$('#inputtxttt').effect('pulsate');
return;
}
if(!isColorValid($('#inputlinkkk').val())){
$('#inputlinkkk').effect('pulsate');
return;
}
GM_setValue('opt_color_bg1', $('#inputbgcolor111').val() )
GM_setValue('opt_color_bg2', $('#inputbgcolor222').val() )
GM_setValue('opt_color_text', $('#inputtxttt').val() )
GM_setValue('opt_color_link', $('#inputlinkkk').val() )
css(true)
getId('divDic').removeChild(getId('divOpt'));
getId('optionsLink').style.visibility = 'visible';
}
function css(init){
$('#css_googletranslatortooltip').remove();
if(init==true){
COLOR_BG1 = GM_getValue('opt_color_bg1') != undefined ? GM_getValue('opt_color_bg1') : '#FFFF77' ;
COLOR_BG2 = GM_getValue('opt_color_bg2') != undefined ? GM_getValue('opt_color_bg2') : '#FFFFAA';
COLOR_TEXT = GM_getValue('opt_color_text') != undefined ? GM_getValue('opt_color_text') : '#333333';
COLOR_LINK = GM_getValue('opt_color_link') != undefined ? GM_getValue('opt_color_link') : '#0000FF';
if(GM_getValue('opt_shadow')==true)
$('#divDic,#divLookup').removeClass('classShadowww').addClass('classShadowww')
else
$('.classShadowww').removeClass('classShadowww')
}
var style = createElement('style', {id:'css_googletranslatortooltip', type:"text/css"}, null, ''
+'a.gootranslink:link {color: '+COLOR_LINK+' !important; text-decoration: underline !important;}'
+'a.gootranslink:visited {color: '+COLOR_LINK+' !important; text-decoration: underline !important;}'
+'a.gootranslink:hover {color: '+COLOR_LINK+' !important; text-decoration: underline !important;}'
+'a.gootranslink:active {color: '+COLOR_LINK+' !important; text-decoration: underline !important;}'
+'#divLookup { background:none !important; color:'+COLOR_TEXT+' !important; position:absolute; z-index:'+MAX_Z+'; border:none !important;}'
+'#divLookup img { border:2px solid '+COLOR_BG1+' !important;}'
+'#divDic { background-color:'+COLOR_BG1+' !important; color:'+COLOR_TEXT+' !important; position:absolute; min-width:250px; min-height:50px; max-width:50%; padding:5px; font-size:small; text-align:left; z-index:'+MAX_Z+'; border-radius:3px; line-height:1 !important; border:none !important; }'
+'#divResult {overflow:auto; padding:3px !important; background-color:'+COLOR_BG1+' !important; color:'+COLOR_TEXT+' !important; border:none !important; margin:0 !important; padding:0 !important; line-height:1 !important;}'
+'#divOpt { background-color:'+COLOR_BG2+' !important; position:relative; padding:5px !important; border:none !important; margin:0 !important; line-height:1 !important;}'
+'#optionsLink {position:absolute; bottom:3px; right:5px; font-size:small; text-decoration:none; cursor:pointer;}'
+'#spanOtherSearches {position:absolute; left:5px; bottom:3px; cursor:pointer; font-size:small;}'
+'#dict { background-color:'+COLOR_BG2+' !important; color:'+COLOR_TEXT+' !important; padding:5px; -moz-border-radius:3px; margin-bottom:10px; max-height:180px; overflow-y:auto; overflow-x:hidden; font-size:small;}'
//translation comparison div
+'#divCompareee {margin-bottom:7px !important;}'
//lists
+'#divDic ul {margin: 7px 23px !important; list-style: disc outside none !important; padding:0 !important;}'+
+'#dict > ol {list-style: none;}'
+'#dict > ol > li {display:table-cell; }'
//color options
+'#tablecolorrr .simpleColorDisplay {display: none !important;}'
+'#tablecolorrr {border:none !important; padding:0 !important; margin:0 !important;}'
+'#tablecolorrr td {vertical-align: top !important; color:'+COLOR_TEXT+' !important; border:none !important; padding:0 !important; margin:0 !important;}'
+'#tablecolorrr input, #tablecolorrr select {border:none !important; padding:0 !important; margin:0 !important; width:100% !important;}'
+'#tablecolorrr td:first-child {text-align:right;}'
+'#tablecolorrr .classButtonColorrr {vertical-align: top;}'
//shadows
+'.classShadowww { box-shadow: 3px 3px 10px #333 !important; }'
);
getTag('head')[0].appendChild(style);
}
function createElement(type, attrArray, evtListener, html)
{
var node = document.createElement(type);
for (var attr in attrArray) if (attrArray.hasOwnProperty(attr)){
node.setAttribute(attr, attrArray[attr]);
}
if(evtListener){
var a = evtListener.split(' ');
node.addEventListener(a[0], eval(a[1]), eval(a[2]));
}
if(html)
node.innerHTML = html;
return node;
}
function getId(id, parent){
if(!parent)
return document.getElementById(id);
return parent.getElementById(id);
}
function getTag(name, parent){
if(!parent)
return document.getElementsByTagName(name);
return parent.getElementsByTagName(name);
}
function xp(p, context, doc) {
if (!context)
context = document;
if (!doc)
doc = document;
var i, arr = [], xpr = doc.evaluate(p, context, null, XPathResult.UNORDERED_NODE_SNAPSHOT_TYPE, null);
for (i = 0; item = xpr.snapshotItem(i); i++)
arr.push(item);
return arr;
}
function debug(str)
{
var d = document.getElementById('debugg');
if(!d){
var div = document.createElement('div');
div.setAttribute('id','divdebug');
div.setAttribute('style', 'background-color:#000000; position:fixed; bottom:3px; left:3px; width:50%; z-index:999999999;');
var closeButton = document.createElement('input');
closeButton.setAttribute('id','closedebug');
closeButton.setAttribute('type', 'button');
closeButton.setAttribute('value', 'close');
closeButton.setAttribute('onClick', 'this.parentNode.parentNode.removeChild(this.parentNode);');
d = document.createElement('textarea');
d.setAttribute('id','debugg');
d.setAttribute('style',"height:150px; width:99%; margin:2px;");
div.appendChild(d);
div.appendChild(document.createElement('br'));
div.appendChild(closeButton);
document.body.appendChild(div);
}
d.innerHTML += '\n'+str;
d.scrollTop = d.scrollHeight;
}
/*
* Drag and drop support adapted fom http://www.hunlock.com/blogs/Javascript_Drag_and_Drop
*/
var savedTarget=null; // The target layer (effectively vidPane)
var orgCursor=null; // The original mouse style so we can restore it
var dragOK=false; // True if we're allowed to move the element under mouse
var dragXoffset=0; // How much we've moved the element on the horozontal
var dragYoffset=0; // How much we've moved the element on the verticle
var didDrag=false; //set to true when we do a drag
function moveHandler(e){
if (e == null) return;// { e = window.event }
if ( e.button<=1 && dragOK ){
savedTarget.style.left = e.clientX - dragXoffset + 'px';
savedTarget.style.top = e.clientY - dragYoffset + 'px';
return false;
}
}
function dragCleanup(e) {
document.removeEventListener('mousemove',moveHandler,false);
document.removeEventListener('mouseup',dragCleanup,false);
savedTarget.style.cursor=orgCursor;
dragOK=false; //its been dragged now
didDrag=true;
}
function dragHandler(e){
var htype='-moz-grabbing';
if (e == null) return;//{ e = window.event;} // htype='move';}
var target = e.target;// != null ? e.target : e.srcElement;
orgCursor=target.style.cursor;
if(target.nodeName!='DIV')
return;
else if(clickedInsideID(target, 'dict'))
return;
if (target = clickedInsideID(target, 'divDic')) {
savedTarget=target;
target.style.cursor=htype;
dragOK=true;
dragXoffset = e.clientX-target.offsetLeft;
dragYoffset = e.clientY-target.offsetTop;
//set the left before removing the right
target.style.left = e.clientX - dragXoffset + 'px';
target.style.right = null;
document.addEventListener('mousemove',moveHandler,false);
document.addEventListener('mouseup',dragCleanup,false);
return false;
}
}
function clickedInsideID(target, id) {
if (target.getAttribute('id')==id)
return getId(id);
if (target.parentNode) {
while (target = target.parentNode) {
try{
if (target.getAttribute('id')==id)
return getId(id);
}catch(e){
}
}
}
return null;
}
//end drag code
/*
* Images
*/
function images()
{
imgLookup = createElement('img',{border:0});
imgLookup.src = 'data:image/gif,GIF89a%12%12%B3%FF%FF%FF%F7%F7%EF%CC%CC%CC%BD%BE%BD%99%99%99ZYZRUR%FE%01%02!%F9%04%04%14%FF%2C%12%12%04X0%C8I%2B%1D8%EB%3D%E4%60(%8A%85%17%0AG*%8C%40%19%7CJ%08%C4%B1%92%26z%C76%FE%02%07%C2%89v%F0%7Dz%C3b%C8u%14%82V5%23o%A7%13%19L%BCY-%25%7D%A6l%DF%D0%F5%C7%02%85%5B%D82%90%CBT%87%D8i7%88Y%A8%DB%EFx%8B%DE%12%01%3B';
}
/*
* jQuery simple-color plugin
* @requires jQuery v1.4.2 or later
*
* See http://recursive-design.com/projects/jquery-simple-color/
*
* Licensed under the MIT license:
* http://www.opensource.org/licenses/mit-license.php
*
* Version: 1.0.1 (201108151520)
*/
(function(c){c.fn.simpleColor=function(b){var o=["990033","ff3366","cc0033","ff0033","ff9999","cc3366","ffccff","cc6699","993366","660033","cc3399","ff99cc","ff66cc","ff99ff","ff6699","cc0066","ff0066","ff3399","ff0099","ff33cc","ff00cc","ff66ff","ff33ff","ff00ff","cc0099","990066","cc66cc","cc33cc","cc99ff","cc66ff","cc33ff","993399","cc00cc","cc00ff","9900cc","990099","cc99cc","996699","663366","660099","9933cc","660066","9900ff","9933ff","9966cc","330033","663399","6633cc","6600cc","9966ff","330066",
"6600ff","6633ff","ccccff","9999ff","9999cc","6666cc","6666ff","666699","333366","333399","330099","3300cc","3300ff","3333ff","3333cc","0066ff","0033ff","3366ff","3366cc","000066","000033","0000ff","000099","0033cc","0000cc","336699","0066cc","99ccff","6699ff","003366","6699cc","006699","3399cc","0099cc","66ccff","3399ff","003399","0099ff","33ccff","00ccff","99ffff","66ffff","33ffff","00ffff","00cccc","009999","669999","99cccc","ccffff","33cccc","66cccc","339999","336666","006666","003333","00ffcc",
"33ffcc","33cc99","00cc99","66ffcc","99ffcc","00ff99","339966","006633","336633","669966","66cc66","99ff99","66ff66","339933","99cc99","66ff99","33ff99","33cc66","00cc66","66cc99","009966","009933","33ff66","00ff66","ccffcc","ccff99","99ff66","99ff33","00ff33","33ff33","00cc33","33cc33","66ff33","00ff00","66cc33","006600","003300","009900","33ff00","66ff00","99ff00","66cc00","00cc00","33cc00","339900","99cc66","669933","99cc33","336600","669900","99cc00","ccff66","ccff33","ccff00","999900","cccc00",
"cccc33","333300","666600","999933","cccc66","666633","999966","cccc99","ffffcc","ffff99","ffff66","ffff33","ffff00","ffcc00","ffcc66","ffcc33","cc9933","996600","cc9900","ff9900","cc6600","993300","cc6633","663300","ff9966","ff6633","ff9933","ff6600","cc3300","996633","330000","663333","996666","cc9999","993333","cc6666","ffcccc","ff3333","cc3333","ff6666","660000","990000","cc0000","ff0000","ff3300","cc9966","ffcc99","ffffff","cccccc","999999","666666","333333","000000","000000","000000","000000",
"000000","000000","000000","000000","000000"];b=c.extend({defaultColor:this.attr("defaultColor")||"#FFF",border:this.attr("border")||"1px solid #000",cellWidth:this.attr("cellWidth")||10,cellHeight:this.attr("cellHeight")||10,cellMargin:this.attr("cellMargin")||1,boxWidth:this.attr("boxWidth")||"115px",boxHeight:this.attr("boxHeight")||"20px",columns:this.attr("columns")||16,insert:this.attr("insert")||"after",buttonClass:this.attr("buttonClass")||"",colors:this.attr("colors")||o,displayColorCode:this.attr("displayColorCode")||
false,colorCodeAlign:this.attr("colorCodeAlign")||"center",colorCodeColor:this.attr("colorCodeColor")||"#FFF"},b||{});this.hide();b.totalWidth=b.columns*(b.cellWidth+2*b.cellMargin);if(c.browser.msie)b.totalWidth+=2;b.totalHeight=Math.ceil(b.colors.length/b.columns)*(b.cellHeight+2*b.cellMargin);c.simpleColorOptions=b;this.each(function(){var a=c.simpleColorOptions,i=c("<div class='simpleColorContainer' />"),l=this.value&&this.value!=""?this.value:a.defaultColor,d=c("<div class='simpleColorDisplay' />");
d.css("backgroundColor",l);d.css("border",a.border);d.css("width",a.boxWidth);d.css("height",a.boxHeight);d.css("cursor","pointer");i.append(d);if(a.displayColorCode){d.text(this.value);d.css("color",a.colorCodeColor);d.css("textAlign",a.colorCodeAlign)}var j=c("<input type='button' value='Select' class='simpleColorSelectButton "+a.buttonClass+"'>");i.append(j);var k=c("<input type='button' value='Cancel' class='simpleColorCancelButton "+a.buttonClass+"'>");i.append(k);k.hide();l=function(e){e.data.select_button.hide();
e.data.cancel_button.show();if(e.data.container.chooser)e.data.container.chooser.show();else{var g=c("<div class='simpleColorChooser'/>");g.css("border",a.border);g.css("margin","0px");g.css("margin-top","3px");g.css("width",a.totalWidth+"px");g.css("height",a.totalHeight+"px");e.data.container.chooser=g;e.data.container.append(g);for(var m=0;m<a.colors.length;m++){var f=c("<div class='simpleColorCell' id='"+a.colors[m]+"'/>");f.css("width",a.cellWidth+"px");f.css("height",a.cellHeight+"px");f.css("margin",
a.cellMargin+"px");f.css("cursor","pointer");f.css("lineHeight",a.cellHeight+"px");f.css("fontSize","1px");f.css("float","left");f.css("backgroundColor","#"+a.colors[m]);g.append(f);f.bind("click",{input:e.data.input,chooser:g,select_button:j,cancel_button:k,display_box:d},function(h){h.data.input.value="#"+this.id;c(h.data.input).change();h.data.display_box.css("backgroundColor","#"+this.id);h.data.chooser.hide();h.data.cancel_button.hide();h.data.display_box.show();h.data.select_button.show();a.displayColorCode&&
h.data.display_box.text("#"+this.id)})}}};var n={container:i,input:this,cancel_button:k,display_box:d,select_button:j};j.bind("click",n,l);d.bind("click",n,l);k.bind("click",{container:i,select_button:j,display_box:d},function(e){c(this).hide();e.data.container.find(".simpleColorChooser").hide();e.data.display_box.show();e.data.select_button.show()});c(this).after(i)});return this};c.fn.closeSelector=function(){this.each(function(){var b=c(this).parent().find("div.simpleColorContainer");b.find(".simpleColorCancelButton").hide();
b.find(".simpleColorChooser").hide();b.find(".simpleColorDisplay").show();b.find(".simpleColorSelectButton").show()});return this}})(jQuery);
Continue reading...
