MediaWiki:Guidedtour-tour-visual edition.js

// Guided Tour to help users make their first edit.
// Designed to work on any Wikipedia article, and can work for other sites with minor message changes.

( function ( window, document, $, mw, gt ) {
	var hasEditSection, tour;
	
	console.log('Loading visual_edition tour.');
	
	// Check if there are section edit links (used later)
	hasEditSection = $( '.mw-editsection' ).length > 0;

	tour = new gt.TourBuilder({name: 'visual_edition'});
	
	tour.firstStep( {
		name: 'overlay',
		title: ($( '.ve-ce-documentNode[contenteditable="true"]' ).length > 0).toString(), //'Comment modifier une page?',
		description: 'Dans ce guide, vous apprendrez à modifier une page. À la fin de ce guide, vous saurez comment rédiger de nouvelles sections, ajouter des images et créer des liens vers d\'autres pages!',
		overlay: true
	} )
		.next( 'intro' );

	tour.step( {
		name: 'intro',
		title: 'Modification d\'une page',
		description: 'Par défaut, Wikimedica vous permet de consulter ses pages en mode \"Lecture\". Il est cependant possible de modifier une page en cliquant sur le bouton ci-dessus.',
		attachTo: '#ca-ve-edit',
		position: 'bottom',
		// This indicates that we don't want an automatic next button,
		// even though we are specifying which step comes next.
		allowAutomaticNext: false,
		buttons: [ {
			// Custom logic to specify a button and its behavior
			// depending on whether there are sections on the page.
			action: hasEditSection ? 'next' : 'okay',
			onclick: function () {
				if ( hasEditSection ) {
					mw.libs.guiders.next();
				} else {
					mw.libs.guiders.hideAll();
				}
			}
		} ]
	} )
	// At certain times, called transition points, the callback passed to .transition
	// will be called.  At those times, this tour checks if the user is editing.  If so,
	// the tour returns 'modifier_texte', indicating that the tour should transition to the
	// 'modifier_texte' step automatically.
	.transition( function () {
		if ( gt.isEditingWithVisualEditor() ) {
			return 'modifier_texte';
		}
	} )
	.next( 'editSection' );

	tour.step( {
		name: 'editSection',
		title: 'Modification d\'une page (suite)',
		description: 'Il existe aussi sur chaque page des boutons de modification pour chaque section. Ils permettent alors de se concentrer uniquement sur la section pertinente!',
		position: 'right',
		attachTo: '.mw-editsection-visualeditor',
		// Automatically scroll to this step
		autoFocus: true,
		// Custom width, in pixels
		width: 300
	} )
	.transition( function () {
		if ( gt.isEditingWithVisualEditor() ) {
			return 'modifier_texte';
		} else if ( !hasEditSection ) {
			// Returning HIDE means that the tour should be hidden, but not ended.
			return gt.TransitionAction.HIDE;
		}
	} )
	.back( 'intro' );

	tour.step( {
		name: 'modifier_texte',
		title: ($( '.ve-ce-documentNode[contenteditable="true"]' ).length > 0).toString(),
		description: 'Afin d\'écrire du texte, vous pouvez simplement cliquer à l\'endroit où vous désirez écrire, et taper le texte désirez. Essayer par exemple d\'écrire \"Voici ma première phrase écrite sur Wikimedica\".',
		attachTo: '#n-help',
		autoFocus: true,
		position: 'right',
		// This specifies that, unlike the default, the guider should not close when the user clicks outside of it.
		closeOnClickOutside: false
	} )
	.transition( function () {
		// isReviewing checks whether the user is either previewing or showing changes.
		if ( gt.isReviewing() ) {
			return 'save';
		} else if ( !gt.isEditingWithVisualEditor() ) {
			// When the user is on this step, but neither editing nor reviewing, this tour automatically ends.
			return gt.TransitionAction.END;
		}
	} )
	.next( 'save' );

	tour.step( {
		name: 'save',
		title: 'You\'re almost done!',
		description: 'When you\'re ready, clicking "Save pages" will make your changes visible for everyone.',
		attachTo: '#wpSave',
		autoFocus: true,
		position: 'top',
		closeOnClickOutside: false
	} )
	.transition( function () {
		if ( !gt.isReviewing() ) {
			return gt.TransitionAction.END;
		}
	} )
	.back( 'modifier_texte' );

} ( window, document, jQuery, mediaWiki, mediaWiki.guidedTour ) );