User:Bargioni/descTranslator.js

/**********************************************************************************
**         automatic translation of a description - 2020-09-02                   **
***********************************************************************************
**                                                                               **
**     .___                                                                      **                                                                     
**   __| _/ ____    ______  ____                                                 **
**  / __ |_/ __ \  /  ___/_/ ___\                                                **
** / /_/ |\  ___/  \___ \ \  \___                                                **
** \____ | \___  >/____  > \___  >                                               **
** _____\/____ \/      \/      \/             .__            __                  **
** \__    ___/_______ _____     ____    ______|  |  _____  _/  |_  ____ _______  **
**   |    |   \_  __ \\__  \   /    \  /  ___/|  |  \__  \ \   __\/  _ \\_  __ \ **
**   |    |    |  | \/ / __ \_|   |  \ \___ \ |  |__ / __ \_|  | (  <_> )|  | \/ **
**   |____|    |__|   (____  /|___|  //____  >|____/(____  /|__|  \____/ |__|    **
**                        \/      \/      \/            \/                       **
**                                                                               **
**                                                                    v0.2.8     **
**                                                                               **
** ----------------------------------------------------------------------------- **
**  How To use:                                                                  **
**   Add the following to your common.js [[Special:MyPage/common.js]] (can be    **
**   found under [[https://www.wikidata.org/wiki/Special:MyPage/common.js]] ):   **
**     importScript( 'User:Bargioni/descTranslator.js' );                        **
**                                                                               **
**  Links:                                                                       **
**    [[User:Bargioni/descTranslator.js]]:                                       **
**    [[https://www.wikidata.org/wiki/User:Bargioni/descTranslator.js]]          **
**                                                                               **
**  About:                                                                       **
**    This tool will allow you to translate a description to your default        **
**    language. Click the description, and a dialog box will appear.             **
**    Edit the description, copy and paste it.                                   **
**    Translations are generated by Google Translator.                           **
**                                                                               **
***********************************************************************************
**********************************************************************************/

var initDescTranslator = ( function ( mw, $ ) {
	'use strict';

	// console.log('descTranslator loaded');

	function descTranslator( entity ) {
		// console.log(entity);
		
		// define a dialog box
		$('body').append('<div style="display:none" id="descTranslator" title=""></div>');
		$( "#descTranslator" ).dialog({
		  autoOpen: false,
		  buttons: [
			{
			  text: "OK",
			  click: function() {
				$( this ).dialog( "close" );
			  }
			}
		  ]
		});

		// clicking outside the dialog box will close it
		var ele = document.getElementById('descTranslator').parentElement;
		document.addEventListener('click',function(e){if(!ele.contains(e.target)) $( "#descTranslator" ).dialog('close')});

		// icon, cursor pointer, and tooltip
		$('.wikibase-descriptionview-text').each(function(i,e){
			var desc_div = $(e).parents('div')[1];
			if(!$(desc_div).hasClass('wb-empty') &&
				mw.config.get( 'wgUserLanguage' ) != $(desc_div).attr('lang') ) {
				$(e).prepend('<img src="https://cdn-icons-png.flaticon.com/512/104/104081.png" width="16"> ');
				$(e).css('cursor','pointer');
				$(e).attr('title','click to get a translation to your language (by Google)');
				$(e).addClass('desc_translator');
			}
		});

		// $('.wikibase-descriptionview-text').on('click',function(e){
		$('.desc_translator').on('click',function(e){
			var desc_div = $(e.target).parents('div')[1];
			var sourceLang = $(desc_div).attr('lang') || 'auto';
			// console.log($(e.target).prop("tagName")); // test
			if ($(e.target).prop("tagName") != 'TEXTAREA') {
				// do not apply if the user is editing the description
				var targetLang = mw.config.get( 'wgUserLanguage' ) || 'en';
				// var sourceText = $(e.target).text();
				var sourceText = $(e.target).text() || $(e.target).parent().text(); // useful if the user clicked the icon
				var female = get_gender();
				// sourceText = female + sourceText;
				// get the translation from Google Translator; if the text is prefixed with '<2FEMALE>', is intended as female -- FAKE NEWS, at the moment :-)
				var url = "https://translate.googleapis.com/translate_a/single?client=gtx&sl=" + sourceLang + "&tl=" + targetLang + "&dt=t&q=" + encodeURI(sourceText);
				$.getJSON(url, function(R){
					var google_translation = R[0][0][0];
					var title = "descTranslator 0.2 - translate from "+sourceLang;
					// if (female) google_translation = google_translation.replace(/<2FEMALE> /,''); // get rid of gender markup
					var proposed_translation = jsLcfirstLetter(google_translation);
					proposed_translation = proposed_translation.replace(/ american(a|o)/,' statunitense');
					var P21 = $('#P21') ? $($('#P21').find('.wikibase-snakview-value')[0]).text() : 'sesso non noto';
					if (female) P21 = '<img src="https://upload.wikimedia.org/wikipedia/commons/d/d2/Crystal_Clear_kdm_user_female.svg" width="32">';

					// copy and close on return
					$( "#descTranslator" ).dialog({
						open: function() {
							// console.log('open'); // test
							$('#proposed_translation').keypress(function(e) {
							    if (e.keyCode == $.ui.keyCode.ENTER) {
									$( '#proposed_translation' ).select();
									$( '#proposed_translation' ).toArray()[0].setSelectionRange(0, 99999);
									document.execCommand('copy');
							        $('#descTranslator').dialog("close");
							    }
							});
						}
					});
					// button "Copy and Close"
					$( "#descTranslator" ).dialog({
						'buttons' : { "Copy and Close" : function(){
							$( '#proposed_translation' ).select();
							$( '#proposed_translation' ).toArray()[0].setSelectionRange(0, 99999);
							document.execCommand('copy');
					        $(this).dialog("close");
						}}
					});

					// open dialog
					$( "#descTranslator" )
						.dialog( "option", "title", title )
						.dialog( "option", "width", 'auto' )
						.html( P21 + '<br/><input id="proposed_translation" value="' + proposed_translation + '" size="50"/>' )
						.dialog( 'open' );
				});
			}
		});
	
		function jsLcfirstLetter(string) {
	    	return string.charAt(0).toLowerCase() + string.slice(1);
		}
		function get_gender () {
			var P21 = $('#P21').find('.wikibase-snakview-value').find('a');
			if (P21.length == 0) return '';
			var P21_href = $((P21)[0]).attr('href');
			if (P21_href.search(/Q6581072$/) > -1) return '<2FEMALE>';
			return '';
		}
	}

	try {
		mw.hook( 'wikibase.entityPage.entityLoaded' ).add( descTranslator );
	}
	catch(e) {
		console.log('An error occurred in descTranslator: ',e);
	}
	
});

mw.loader.using([ 'jquery.ui' ]).then(function () {
	 initDescTranslator( mediaWiki, jQuery );
});