Utilisateur:Rical/Gadget-ImgSynchro.js

Note : après avoir enregistré vos modifications, il se peut que vous deviez forcer le rechargement complet du cache de votre navigateur pour voir les changements.

  • Firefox / Safari : Maintenez la touche Maj (Shift) en cliquant sur le bouton Actualiser ou pressez Ctrl-F5 ou Ctrl-R (⌘-R sur un Mac) ;
  • Google Chrome : Appuyez sur Ctrl-Maj-R (⌘-Shift-R sur un Mac) ;
  • Internet Explorer : Maintenez la touche Ctrl en cliquant sur le bouton Actualiser ou pressez Ctrl-F5 ;
  • Opera : Allez dans Menu → Settings (Opera → Préférences sur un Mac) et ensuite à Confidentialité & sécurité → Effacer les données d'exploration → Images et fichiers en cache.
/* MediaWiki:Gadget-ImgSynchro.js */
/* Gadget-ImgSynchro.js for ProofreadPage extension for MediaWiki API */
var pr_synchro_date = '20120922 21:40';
// boutons de changements d'images OK = '20120829 15:01';
// P templates in edited text, like {{p|A|95%|22%}} OK = '20120829 15:01';

/** License
 * This program is free software; you can redistribute it and/or modify
 * it under the terms of the GNU General Public License as published by
 * the Free Software Foundation; either version 2 of the License, or
 * (at your option) any later version.
 *
 * This program is distributed in the hope that it will be useful,
 * but WITHOUT ANY WARRANTY; without even the implied warranty of
 * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
 * GNU General Public License for more details.
 *
 * You should have received a copy of the GNU General Public License along
 * with this program; if not, write to the Free Software Foundation, Inc.,
 * 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA.
 * http://www.gnu.org/copyleft/gpl.html
 *
 * @file
 * @ingroup SpecialPage
 * @author Tpt
 * @author Rical
 */

/**
 * file history : proofread.js, ext.proofreadpage.page.js, Gadget-ImgSynchro.js
 *
 *    			FUNCTION
 *
 * The synchronisation function move automaticaly image to follow the changes and movements in the text, in a Page:pagename.
 * The synchronisation points are defined in P templates in edited text,
 * like {{P|A|95%|22%}} with a point name "A" and its X and Y position of a star on the image.
 * The user create points and change them by clic buttons, drag and drop stars, to adapt the auto-scrooling of the image.
 *
 * In the Extension:ProofreadPage, the edit function allows the user to change the text of the page.
 * The quality function allows the user to view and modify the quality of the correction of the page.
 *
 *				QUESTIONS
 *
 * How to read the image url $thumbURL in JS module ?
 * How to read the server url in JS module ?
 * Use {{ns:page}} instead of hard coded namespace name.
 * fill table with textbox and image function pr_fill_table()
 * 	// fill the image container if( !proofreadPageIsEdit )
 * Comment récupérer une valeur mw.msg dans un gadget ?
 * 8/7/12 22:34 reecrire toutes les lignes 'proofreadpage-button-sync-on-label' ici et ProofreadPage.i18n.php
 * Comment suivre le curseur de text ? Par Extension:WikiEditor ?
 * Contourner le bug d'absence d'image.
 * Pour tests, remplacer l'image par une des 3 images types : titre, 1 colonne, 2 colonnes
 *
 * Launching process :
 * 1 - MediaWiki, LocalSettings.php
 * 2 - if Extension:ProofreadPage is running :
 *     ProofreadPage.php, ProofreadPage/modules, ext.proofreadpage.page/ext.proofreadpage.page.js
 * 3 - install Gadget-ImgSynchro.js upon image of the page (on right or top)
 */
  
var prpSynchro = {
	
	init_all: function() {
		prpSynchro.pr_init_debug();
		// to init the page tools
		prpSynchro.pr_debug_trace( 'Page: ' );
		// extension only : jQuery( pr_init_page );
		// extension only : jQuery( pr_init_tabs ); prpSynchro.pr_debug_trace( 'tabs' );
		// extension only : jQuery( pr_init_zoom ); prpSynchro.pr_debug_trace( 'zoom' );
		// extension only : jQuery( pr_init_quality_buttons ); prpSynchro.pr_debug_trace( 'qual' );
		prpSynchro.pr_init_synchro_buttons();
		prpSynchro.pr_init_synchro();
		// prpSynchro.create();
		/* ext.wikiEditor.toolbar.js
		if ( !$.wikiEditor.isSupported( $.wikiEditor.modules.toolbar ) ) {
			$( '.wikiEditor-oldToolbar' ).show();
			return;
		} */
	},

	create: function() {
		var values = this.get();
		$("#editform").before(this.print_form(values));
	},

	pr_raz_debug: function() {
		$('#mwDebugTrace').remove();
	},
	
	pr_init_image_change: function(args) {
		// args = { idButton, txtButton, src }
		// $("#ProofReadImage").attr("src", src);
		var onclick = ' onclick=" $(\'#ProofReadImage\').attr(\'src\', \'' + args.src + '\' );" ';
		var idButton = ' id="' + args.idButton + '" ';
		var Button = '<button type="button" ' 
			+ idButton 
			+ onclick 
			+ ' >' 
			+ args.txtButton 
		+'</button>';
		$( '#mwDebugTrace' ).prepend(Button);
	},
	
	pr_init_proof_image: function() {
		// args = { idButton, txtButton, src }
		// case de donnees à ajouter
		var tdImage = '<td rowspan="3" style="vertical-align: top;">'
			+ '<div style="position: relative; width: 491px;">'
				+ '<div id="pr_container" style="position: absolute; top: 0px; cursor: default; background: none repeat scroll 0% 0% rgb(0, 0, 0); overflow: auto; width: 491px; height: 544px;">'
					+ '<div style="position: absolute; width: 0px; height: 0px; overflow: hidden;">'
						+ '<img id="ProofReadImage" width="471" src="http://upload.wikimedia.org/wikipedia/commons/thumb/1/17/B%C3%A9ranger%2C_oeuvres_compl%C3%A8tes_-_tome_2.pdf/page116-500px-B%C3%A9ranger%2C_oeuvres_compl%C3%A8tes_-_tome_2.pdf.jpg" style="margin: 0px;">' 
					+ '</div>' 
				+ '</div>' 
			+ '</div>' 
		+ '</td>';
		
		// insertion dans le cadre de table
		$("#textBoxTable table tbody tr").append(tdImage);

	},
	/*
	cadre de table :
	<div id="textBoxTable" style="width: 100%;">
<table style="width: 100%; border-collapse: collapse; border-spacing: 0px; border: medium none;">
<tbody>
<tr valign="top">
	
	case de donnees à ajouter :
	<td rowspan="3" style="vertical-align: top;">
<div style="position: relative; width: 491px;">
<div id="pr_container" style="position: absolute; top: 0px; cursor: default; background: none repeat scroll 0% 0% rgb(0, 0, 0); overflow: auto; width: 491px; height: 544px;">
<div style="position: absolute; width: 0px; height: 0px; overflow: hidden;">
<img id="ProofReadImage" width="471" src="http://upload.wikimedia.org/wikipedia/commons/thumb/9/9e/Dierx_-_%C5%92uvres_compl%C3%A8tes%2C_Lemerre%2C_I.djvu/page122-1000px-Dierx_-_%C5%92uvres_compl%C3%A8tes%2C_Lemerre%2C_I.djvu.jpg" style="margin: 0px;">
</div>
</div>
</td>
	*/

	pr_init_debug: function() {
		if( ! document.getElementById( 'mwDebugTrace' ) ) { // init debug-trace
			$('#mw-content-text').prepend('<div id="mwDebugTrace" ><span >!doc</span></div>');
		};
		var dt = new Date();
		var tm = dt.toTimeString();
		prpSynchro.pr_debug_trace( ', debug_trace:' + tm );
		prpSynchro.pr_debug_trace( ', js:date:' + pr_synchro_date );
		
		// args = { idButton, txtButton, src }
		prpSynchro.pr_init_image_change( {idButton:"prTitle", txtButton:"page titre", src:"//upload.wikimedia.org/wikipedia/commons/thumb/1/17/B%C3%A9ranger%2C_oeuvres_compl%C3%A8tes_-_tome_2.pdf/page116-500px-B%C3%A9ranger%2C_oeuvres_compl%C3%A8tes_-_tome_2.pdf.jpg"});
		prpSynchro.pr_init_image_change( {idButton:"pr2col", txtButton:"page 2 col", src:"//upload.wikimedia.org/wikipedia/commons/thumb/1/1e/Diderot_-_Encyclopedie_1ere_edition_tome_5.djvu/page20-500px-Diderot_-_Encyclopedie_1ere_edition_tome_5.djvu.jpg"});
		prpSynchro.pr_init_image_change( {idButton:"prPoem", txtButton:"page poeme", src:"//upload.wikimedia.org/wikipedia/commons/thumb/9/9e/Dierx_-_%C5%92uvres_compl%C3%A8tes%2C_Lemerre%2C_I.djvu/page122-500px-Dierx_-_%C5%92uvres_compl%C3%A8tes%2C_Lemerre%2C_I.djvu.jpg"});
		
		// creer le bouton d'ajout d'image
		$( '#mwDebugTrace' ).prepend('<button type="button" id="prAjoutImage" onclick="pr_init_proof_image()" >ajouter image</button>');
	},

	pr_debug_trace: function( txt ) {
		$('#mwDebugTrace').append('<span >, ' + txt + '</span>');
	},

	//	li = prpSynchro.newPageTab('ca-prev',	prev, 'tabname',	'tabname_help', "icon.png", "page117.pdf.jpg" )
	newPageTab: function( id,		_href, _title,		_title_help,	icon,		image  		) {
		var title = _title;
		var title_help = _title_help;
		var img = '';
		var src = '/w/extensions/ProofreadPage/' + icon;
		if( _title ) { 
			title = mediaWiki.msg( _title ); // title example 'proofreadpage_prevpage'
		} else { var title = ''; }
		if( _title_help ) { 
			title_help = mediaWiki.msg( _title_help ); // title example 'proofreadpage_prevpage'
		} else { var title_help = ''; }
		prpSynchro.pr_debug_trace( title+'='+src);
		/* example OK
		<img id="ProofReadImage" width="317" src="//upload.wikimedia.org/wikipedia/commons/thumb/1/17/B%C3%A9ranger%2C_oeuvres_compl%C3%A8tes_-_tome_2.pdf/page121-2100px-B%C3%A9ranger%2C_oeuvres_compl%C3%A8tes_-_tome_2.pdf.jpg" style="margin: 220px 0px 0px 178px;">
		 */
		if (typeof(image) != 'undefined') {
			prpSynchro.pr_debug_trace("newPageTab no image."); ////////////////// Rical debug
			return;
			var img = document.createElement( 'img' );
			img.innerHTML = tit;
			img.title = title_help;
			img.src = image;
			img.href = _href; // example prev = "/wiki/Page:B%C3%A9ranger,_oeuvres_compl%C3%A8tes_-_tome_2.pdf/118"
			img.width = "15"; img.height = "15";
		}
		// lien :
		var a = document.createElement( 'a' );
		a.innerHTML = tit;
		a.title = help;
		a.href = _href; // example prev = "/wiki/Page:B%C3%A9ranger,_oeuvres_compl%C3%A8tes_-_tome_2.pdf/118"
		a.innerHTML = 'Fichier';
		// texte :
		var span = document.createElement( 'span' );
		// list element :
		var li = document.createElement( 'li' );
		li.id = id; // example '#ca-prev'
		// structure :
		a.appendChild( img ); 
		span.appendChild( a ); 
		li.appendChild( span ); 
		return li;
	}, // newPageTab: function

	/*	ProofreadPage.i18n.php :
		'proofreadpage_namespace'			=> 'Page',
		'proofreadpage_image'				=> 'Image',
		'proofreadpage_image_help'			=> 'Fichier image',
		'proofreadpage_index'				=> 'Index',
		'proofreadpage_nextpage'			=> 'Next page',
		'proofreadpage_prevpage'			=> 'Previous page',
		'proofreadpage_talk'				=> 'Discussion',
		'proofreadpage_talk_help'			=> 'Discussion au sujet de cette page de contenu [ctrl-t]',
		'proofreadpage_quality0_category'	=> 'Without text',
		'proofreadpage_index_listofpages'	=> 'List of pages',
		'proofreadpage_image_message'		=> 'Link to the index page',
		'proofreadpage_page_status'			=> 'Page status',
		'proofreadpage_js_attributes'		=> 'Author Title Year Publisher',
		ProofreadPage_body.php : list( $page_namespace, $index_namespace ) = self::getPageAndIndexNamespace();
	*/
	
	pr_synchro_on: 1, // synchro mode can be y=0=off or y=1=on
	pr_synchro_dir: 'l2r', // default synchro direction left to right
	pr_img_xx: 0, // synchro memorize position in image
	pr_img_yy: 0, // synchro memorize position in image
	pr_txt_xx: 0, // synchro memorize position in text
	pr_txt_yy: 0, // synchro memorize position in text
	idt_on: 'mw-synchro-on', // identifiant de bouton Synchro on
	idt_off: 'mw-synchro-off', // identifiant de bouton Synchro off
	img_on: '//upload.wikimedia.org/wikipedia/commons/0/00/Button-synchro-on.png',
	img_off: '//upload.wikimedia.org/wikipedia/commons/c/cd/Button-synchro-off.png',
	//img_on: mw.config.get( 'wgExtensionAssetsPath' ) + '/ProofreadPage/Button_synchro_on.png',
	//img_off: mw.config.get( 'wgExtensionAssetsPath' ) + '/ProofreadPage/Button_synchro_on.png',

	pr_img_onclick: function( evt ) { // synchro memorize position in image
		if( ! evt ) return;
		var x = evt.layerX;
		if( x < 2 ) x = 1;
		prpSynchro.pr_img_xx = x;
		var y = evt.layerY;
		if( y < 2 ) y = 1;
		prpSynchro.pr_img_yy = y;
		prpSynchro.pr_debug_trace("img=" + prpSynchro.pr_img_xx + ";" + prpSynchro.pr_img_yy ); ////////////////// Rical debug
	},
	
	pr_txt_onclick: function( evt ) { // synchro memorize position in text
		if( ! evt ) return;
		var x = evt.layerX;
		if( x < 2 ) x = 1;
		prpSynchro.pr_txt_xx = x;
		var y = evt.layerY;
		if( y < 2 ) y = 1;
		prpSynchro.pr_txt_yy = y;
		prpSynchro.pr_debug_trace("txt=" + prpSynchro.pr_txt_xx + ";" + prpSynchro.pr_txt_yy ); ////////////////// Rical debug
	},
	
	pr_event_to_template: function( evt ) { // converts an event to template
		if( ! evt ) return;
		var txt = evt.currentTarget.value;
		var deb = txt.indexOf("{{p|");
	//	var n=str.indexOf("e",5);
		var fin = txt.indexOf("}}",deb);
		var tmp = txt.slice(deb+2,fin);
	//	var n=str.slice(1,5); 
	//	var rnd=Math.round(2.5);
		prpSynchro.pr_debug_trace("evt2tmp=" + deb + ":" + fin + ":" + tmp ); ////////////////// Rical debug
		return tmp;
	},
	
	pr_percentTxt2number: function( txt ) {
		if( ! txt ) return 0;
		var txt = txt.replace("%","");
		var nbr = Number(txt);
		var nbr = nbr.toFixed(0);
		return nbr;
	},
	
	pr_add_star_to_img: function( evt ) { // add a star on image
		if( ! evt ) return;
		// link to image
		var Textbox = document.getElementById( 'wpTextbox1' );
		if( typeof(Textbox) == "undefined" ) return;
		var img = document.getElementById( 'ProofReadImage' );
		if( typeof(img) == "undefined" ) return;
		// read the template
		var txt = prpSynchro.pr_event_to_template( evt );
		var n = txt.split("|");
		if( n.length < 4 ) return; // verifier 4 paramètres
		if( n[0] != "p" ) return; // verifier que le modele est P
		var p_txt = n[1];
		var p_x = prpSynchro.pr_percentTxt2number( n[2] );
		var p_y = prpSynchro.pr_percentTxt2number( n[3] );
		// point in image
		// img: offsetHeight 714, offsetLeft 0, offsetParent div#pr_container, offsetTop 0, offsetWidth 443
		var p_xx = p_x / 100 * img.top ; // percent img/txt
		var p_yy = p_y / 100 * img.left ; // percent img/txt
		// add the star on image
		var star = document.createElement( 'img' );
		star.id = 'pr_pnt_' + p_txt;
		star.title = star.id;
		star.alt = star.id;
		star.onclick = prpSynchro.pr_img_onclick;
		star.className = 'pr_pnt_star';
		star.src = mw.config.get( 'wgExtensionAssetsPath' ) + 'ProofreadPage/button_category_plus.png';
		star.setAttribute("cursor", "pointer");
		img.appendChild( star );
		prpSynchro.pr_debug_trace("evt2star=" + p_txt + ":" + p_xx + ":" + p_yy ); ////////////////// Rical debug
	},
	
	pr_init_synchro: function( ) { // change synchro mode
		var pr_container = document.getElementById( 'pr_container' );
		if( ! pr_container ) return;
		prpSynchro.pr_debug_trace( 'pr_init_synchro' );
		// prpSynchro.pr_init_pTitle();
		prpSynchro.pr_synchro_mode(1);
		// pr_container.src = "/Visites57.png";
		// prpSynchro.pr_debug_trace("src=" + pr_container.src); ////////////////// Rical debug
		var img = document.getElementById( 'ProofReadImage' );
		if( img ) img.onclick = prpSynchro.pr_img_onclick; // init synchro memorize position in image
		document.getElementById( 'textBoxTable' ).style.backgroundColor="#F0F0F0";
		var txt = document.getElementById( 'wpTextbox1' );
		if( txt ) txt.onclick = prpSynchro.pr_txt_onclick; // init synchro memorize position in text
		if( txt ) txt.ondblclick = prpSynchro.pr_add_star_to_img; // init synchro add_star_to_img
		prpSynchro.pr_debug_trace( prpSynchro.pr_trac_data() );
		// prpSynchro.pr_init_pTitle();
	},

	pr_trac_data: function( ) { // converts template to image position
		var t = ' user='+window.wgUserName;
		t = t+' ushorz='+mw.user.options.get( 'proofreadpage-horizontal-layout' );
		t = t+' ushead='+mw.user.options.get( 'proofreadpage-showheaders' );
		t = t+' ustool='+mw.user.options.get( 'usebetatoolbar' );
		t = t+' mw='+window.wgVersion;
		t = t+' pg='+mw.config.get( 'proofreadPageFilePage' );
		t = t+' fn='+mw.config.get( 'proofreadPageFileName' );
		t = t+' wd='+mw.config.get( 'proofreadPageWidth' );
		t = t+' url='+mw.config.get( 'proofreadPageURL' );
		t = t+' mw='+mw.msg( 'proofreadpage-button-reset-zoom-label' );
		t = t+' mw='+mw.msg( 'proofreadpage-button-reset-zoom-label' );
		//t = t+' mw='+window.getHistoryInfo;
		//t = t+' mw='+window.getDateFromTimestamp;
		//t = t+' mw='+window.getValidImageFromWikiText;
		return t;
	},

	pr_synchro_mode: function( y ) { // change synchro mode
		// synchro can be y=0=off or y=1=on or 1< y <1000 / per thousand, for a position in the wikitext 
		if ( y < 0 ) { y = 0 }; // normalize y
		if ( y > 99 ) { y = 99 }; // normalize y
		if ( y < 2 ) { // change mode but do not move image
			prpSynchro.pr_synchro_on = y; // change mode but do not move image
			var btn = document.getElementById( prpSynchro.idt_on );
		//	var btn = $( '#mw-synchro-on' );
			if( btn ) { // change image on button
				btn.title = btn.title +':'+ y;
				if ( y == 0 ) { // synchro become off
					btn.src = prpSynchro.img_off;
		//			$( '#mw-synchro-on' ).src = mw.config.get( 'wgExtensionAssetsPath' ) + '/ProofreadPage/Button_synchro_off.png';
				} 
				else { // synchro become on
					btn.src = prpSynchro.img_on;
		//			$( '#mw-synchro-on' ).src = mw.config.get( 'wgExtensionAssetsPath' ) + '/ProofreadPage/Button_synchro_on.png';
				};
			} 
		} 
		else { 
		// y > 1 synchro move image from a position in the wikitext in %
			var old_margin_x = prpSynchro.margin_x;
			var old_margin_y = prpSynchro.margin_y;
			var old_width = prpSynchro.img_width;
			// minimal calculation to debug, to adapt to P points, C columns, hebrew, chinese
			if ( y < 10 ) { y = 10 };
			if ( y > 90 ) { y = 90 };
		//	prpSynchro.pr_set_margins( old_margin_x, y, pr_container.offsetWidth - 20 );
			var rnd=Math.round(2.5);
		};
		prpSynchro.pr_synchro_dir='l2r'; // default synchro direction left to right
		// text line 1 to 99 default synchronize with Y=100 to Y=900 in image /1000
	}, // pr_synchro_mode: function( y )

	pr_template_to_img: function( temp ) { // converts template to image position
		prpSynchro.pr_synchro_mode( 1 ); // default synchro on
		prpSynchro.pr_synchro_dir='l2r'; // default synchro direction left to right
		// text line 1 to 99 default synchronize with Y=100 to Y=900 in image /1000
		var rnd=Math.round(2.5);
	},
	
	pr_onclick_text: function( evt ) {
		// register last onclick position in text
		// jQuery Events : $(selector).click(function) 	Triggers, or binds a function to the click event of selected elements
		// jQuery Event Methods : click() 	Triggers, or binds a function to the click event of selected elements
		// $("button").click(function(){
		// $("p").slideToggle();
		// }); 
		// $("button").click(pr_onclick_text(event, id) );
		prpSynchro.pr_synchro_mode( 1 ); // default synchro on
		prpSynchro.pr_synchro_dir='l2r'; // default synchro direction left to right
		// text line 1 to 99 default synchronize with Y=100 to Y=900 in image /1000
		var rnd=Math.round(2.5);
	},
	
	img_to_template: function( temp ) { // converts image position to template
		prpSynchro.pr_synchro_mode( 1 ); // default synchro on
		prpSynchro.pr_synchro_dir='l2r'; // default synchro direction left to right
		// text line 1 to 99 default synchronize with Y=100 to Y=900 in image /1000
		var rnd=Math.round(2.5);
	},
	/*
	reperage de texte
	<textarea id="wpTextbox1" name="wpTextbox1" tabindex="1" style="height: 688px;"><nowiki /> {{PetitTitre|DE PROFUNDIS}} 
	
	reperage de image
	<div id="pr_container" style="position: absolute; top: 0px; cursor: default; background: none repeat scroll 0% 0% rgb(0, 0, 0); overflow: auto; width: 561px; height: 694px;">
	<img id="ProofReadImage" width="317" style="margin: 220px 0px 0px 178px;" src="//upload.wikimedia.org/wikipedia/commons/thumb/1/17/B%C3%A9ranger%2C_oeuvres_compl%C3%A8tes_-_tome_2.pdf/page121-2100px-B%C3%A9ranger%2C_oeuvres_compl%C3%A8tes_-_tome_2.pdf.jpg">
	</div>
	
	*/
	
	/*
	 * prpSynchro init, setup and config.
	 */
	
	// Synchro init one button
	pr_add_img_button: function(button) {
		// add a button into where
		prpSynchro.pr_debug_trace( '+img ' + button.ident + '.' + button.margin + '.' + button.label );
		var where = document.getElementById( button.where );
		if( where == null ) return;
		var groupwhere = where.parentElement;
		if( typeof(groupwhere) == "undefined" ) return;
		if( groupwhere == null ) return;
		var image = document.createElement( 'img' );
		image.id = button.ident;
		image.title = button.label;
		image.onclick = button.action.execute;
		image.className = 'mw-toolbar-editbutton';
		image.src = button.icon;
		image.innerHTML = button.help;
		image.width = 23;
		image.height = 22;
		image.border = 0;
		image.alt = button.label;
		image.setAttribute("cursor", "pointer");
		image.setAttribute("border-radius", "6px");
		image.style.marginLeft = button.margin + "px" ;
		groupwhere.appendChild( image );
	}, // pr_add_img_button: function(button)
	
	pr_init_synchro_buttons: function() {
		// installer des boutons de zoom et de synchro
		prpSynchro.pr_debug_trace( 'synchro_buttons' );
		// wikEdEditWrapper, mwDebugTrace, <img id="SearchIcon" ...>
		var brotherwhere = 'SearchIcon'; // au même endroit que ce bouton
		$('#mw-zoom-out2').remove();
		prpSynchro.pr_add_img_button( {
			where: brotherwhere,
			ident: 'mw-zoom-out2',
			label: 'Zoom out2',
			icon: '//upload.wikimedia.org/wikipedia/commons/6/67/WikEd_logo.png',
			margin: '12',
			action: {
				type: 'callback',
				execute: function() {
					prpSynchro.pr_synchro_mode( 1 - prpSynchro.pr_synchro_on );
				}
			},
			type: 'button'
		});
		$('#mw-reset-zoom2').remove();
		prpSynchro.pr_add_img_button( {
			where: brotherwhere,
			ident: 'mw-reset-zoom2',
			label: 'Reset Zoom',
			icon: '//upload.wikimedia.org/wikipedia/commons/1/1d/WikEd_close_toolbar.png',
			margin: '0',
			action: {
				type: 'callback',
				execute: function() {
					prpSynchro.pr_synchro_mode( 1 - prpSynchro.pr_synchro_on );
				}
			},
			type: 'button'
		});
		$('#mw-zoom-in2').remove();
		prpSynchro.pr_add_img_button( {
			where: brotherwhere,
			ident: 'mw-zoom-in2',
			label: 'Zoom-in2',
			icon: '//upload.wikimedia.org/wikipedia/commons/d/d3/WikEd_fullscreen.png',
			margin: '0',
			action: {
				type: 'callback',
				execute: function() {
					prpSynchro.pr_synchro_mode(0);
				}
			},
			type: 'button'
		});
		$('#' + prpSynchro.idt_on).remove();
		prpSynchro.pr_add_img_button( {
			where: brotherwhere,
			ident: prpSynchro.idt_on,
			label: 'Synchro On',
			icon: prpSynchro.img_on,
			margin: '12',
			action: {
				type: 'callback',
				execute: function() {
					prpSynchro.pr_synchro_mode(0);
				}
			},
			type: 'button'
		});
		$('#' + prpSynchro.idt_off).remove();
		prpSynchro.pr_add_img_button( {
			where: brotherwhere,
			ident: prpSynchro.idt_off,
			label: 'Synchro Off',
			icon: prpSynchro.img_off,
			margin: '0',
			action: {
				type: 'callback',
				execute: function() {
					prpSynchro.pr_synchro_mode(0);
				}
			},
			type: 'button'
		});
	}, // function pr_init_synchro_buttons()
	
	/* extrait de ProofreadPage.i18n.php pour debug pfpsyn-on-label
	'proofreadpage-button-zoom-out-label'			=> 'Zoom 1 out',
	'pfpsyn-on-label'								=> 'cSynchro 1 image on',
	'proofreadpage-button-reset-zoom-label'			=> 'Original size',
	'pfpsyn-off-label'								=> 'cSynchro 1 image off',
	'proofreadpage-button-zoom-in-label'			=> 'Zoom 2 in',
	
	Bug dans wikiRical, le libelle des boutons de synchro est comme '<pfpsyn-on-label>',
	mw.msg() fonctionne a partir de l'extension et peut-etre pas à partir du gadget.
	Pour debug, Rical COMPARE entre des BOUTONS Zoom(OK) et des boutons Sync(BUG) crees par les memes functions,
	cree les clefs synchro par copie a partir des clefs zoom dans ProofreadPage.i18n.php EN FR QQQ,
	copie les RETOURS LIGNES pour qu'ils soient identiques dans la zone Zoom et Sync,
	change l'ORDRE des clefs dans ProofreadPage.i18n.php EN FR QQQ,
	change les noms des CLEFS pfpsyn-on-label, proofreadpage-button-synchro-on-label,
	interdit l'usage du CACHE par LocalSettings.php $wgResourceLoaderDebug = true;
	reduit le cache de Firefox, le vide par menu et par preference,
	remplace les 'text' ou "text", les l' ou l’ ou l\' ou sans apostrophe,
	visualise les caracteres INVISIBLES dans l'editeur BBEdit derniere version, 
	change les textes des LIBELLES pour verifier que le fichier i18n testé est le bon,
	change l'ordre des instructions dans pr_add_img_button et pr_init_synchro_buttons,
	change de langue dans les preferences, meme bug en FR et en EN,
	et le bug existe toujours. Abandon du debug 20120714 17:42
	*/

}; // prpSynchro

// Install this gadget by button in personal header
$('#p-personal').prepend('<button type="button" id="button_imgRaz" onclick="prpSynchro.pr_raz_debug()" >imgRaz</button>');
$('#p-personal').prepend('<button type="button" id="button_imgSynchro" onclick="prpSynchro.init_all()" >imgSynchro</button>');

// Install this gadget by display of page in Page: space
var apf_edt_ = ( $.inArray(mw.config.get('wgAction'), ['edit', 'submit']) !== -1 );
var apf_spc_ = ( mw.config.get('wgNamespaceNumber') ); // __Namespace__
var apf_104_ = ( mw.config.get('wgNamespaceNumber') == 104); // Page:
// var apf_102_ = ( mw.config.get('wgNamespaceNumber') == 102); // Auteur:
// if($.inArray(mw.config.get('wgAction'), ['edit', 'submit']) !== -1 && mw.config.get('wgNamespaceNumber') == 104) {
if( apf_104_ && apf_edt_) {
	$(document).ready(function() {
	//	prpSynchro.init_all();
	}); // $(document).ready(function()
};

/* debug Firebug DOM 12/09/2012 00:56
window.prpSynchro.pr_synchro_on = 1
window.prpSynchro.zp = "div#pr_container"
window.prpSynchro.zp.clientHeight = 833
window.wgUserName = "Rical"
window.wgVersion = "1.20wmf11"
window.ws_layouts.Maquette 1.editsection = "display:none"
window.getHistoryInfo.getHistoryInfo(wikipage, whatNext)
window.getHistoryInfo.getInnerText = function()
window.getEditboxSelection = getEditboxSelection()
window.getDateFromTimestamp = getDateFromTimestamp(t)
window.getValidImageFromWikiText = getValidImageFromWikiText(wikiText)
window.getWiki = getWiki(article, onComplete, oldid, owner)
window.getDateFrom.document.onmousemove = function()
window.getDateFromTimestamp = getDateFromTimestamp(t)
TypeError: prpSynchro.pr_init_pTitle is not a function
*/

/* reperes dans
	* contentCollector.js
70		function isBlockElement(n) {
101 	textLines : function() {
	* jquery.wikiEditor.toc.js
7		'browsers': {
42		rtl: false
53		evt: {
69		$.wikiEditor.modules.toc.evt.resize( context );
71		resize: function( context, event ) {
105		// store the width of the view for comparison on next resize

*/

/*
Pour suivre les mouvements dans le texte il faut les connaitre,
 donc chercher dans WikiEditor (Version 0.3.1) 13/06/2012 :
* jquery.wikiEditor.js 
419 : * Save scrollTop and cursor position for IE
425 : 'pos': context.$textarea.textSelection( 'getCaretPosition', { startAndEnd: true } )

*/
/* Quality buttons */
// function pr_init_quality_buttons() {}

// Load an external javascript file as complement
// mw.loader.load( '//www.mediawiki.org/w/index.php?title=MediaWiki:Gadget-UTCLiveClock.js' + '&debug=true&action=raw&ctype=text/javascript' );
// bug image en cours de debug, a attente. première image par contournement OK a '20120704 19:04' dans
// http://localhost:8888/index.php?title=Page:Dictionnaire_de_Tr%C3%A9voux,_1771,_I.djvu/5&action=submit

/*
// Load an external javascript file as is
mw.loader.load( '//www.mediawiki.org/w/index.php?title=MediaWiki:Gadget-UTCLiveClock.js&action=raw&ctype=text/javascript' );
 
// Load an external stylesheet as is
mw.loader.load( 'http://example.com/mystyles.css?color=blue', 'text/css' );

				btn.src = mw.config.get( 'wgExtensionAssetsPath' ) + '/ProofreadPage/Button_synchro_off.png';

// Load an external javascript file as is
mw.loader.load( mw.config.get( 'wgExtensionAssetsPath' ) + '/extensions/ProofreadPage/Synchro.js' + '&debug=true&action=raw&ctype=text/javascript' );
*/