< Scratch Wiki:Scratch Wiki Adventure

Edit

/*
 * Guided Tour to test guided tour features.
 */
// Copy the next line into the start of your tour.
( function ( window, document, $, mw, gt ) {

	// Declare a variable for use later
	var pageName = 'Help:Guided tours/guider',
		tour;

	tour = new gt.TourBuilder( {
		/*
		 * This is the name of the tour.  It must be lowercase, without any hyphen (-) or
		 * period (.) characters.
		 *
		 * The page where you save an on-wiki tour must be named
		 * MediaWiki:Guidedtour-tour-{name}.js , in this example MediaWiki:Guidedtour-tour-mytest.js
		 */
		name: 'mytest'
	} );

	// Information defining each tour step

	// This tour shows a central overlay at the start of the tour.
	// Guiders appear in the center if another position is not specified.
	// To specify the first step of the tour, use .firstStep instead of .step
	tour.firstStep( {
		name: 'overlay',
		// Note that for on-wiki tours, we use title and description with the actual text.
		// The title appears in the title bar of the guider.
		title: 'Testing',

		// The description appears in the body
		description: 'This is a test of the description. Lorem ipsum dolor sit!',

		// This specifies that there is an overlay behind the guider.
		overlay: true
	} )
	// This specifies the next step of the tour, and will automatically generate a next button.
	// 'callout' refers to the name used in the step immediately below.  Although putting the steps
	// in a meaningful order is recommended, any step can be specified as next/back.
	.next( 'callout' );

	tour.step( {
		/*
		 * Callout of left menu
		 */
		name: 'callout',
		title: 'Test callouts',
		description: 'This is the community portal page.',

                // This positions the guider next to a page element, in this
                // case the portal link (which is "Community portal" on English
                // Wikipedia, but varies by site).
                // The string is a jQuery selector.  "#n-portal" means the HTML
                // element with this id attribute, and "a" means an a, or link,
                // element inside that.
		attachTo: '#n-portal a',

                // This means the guider shows to the right of the Community Portal link
		position: 'right',
	} )
	.next( 'description' )
	// The 'back' property specifies that you can go back from this step, and where to go
	// if the back button is clicked.
	.back( 'overlay' );

	tour.step( {
		/*
		 * Test out mediawiki description pages
		 */
		name: 'description',
		title: 'Test MediaWiki description pages',

		// Name of the page to parse
		description: pageName,

		overlay: true,

		// This means the wikitext for the description will be loaded from the
		// page name in the description field.
		onShow: gt.getPageAsDescription,

		buttons: [ {
			// This makes a button which acts like a wikilink to 'Help:Guided tours/guider'
			action: 'wikiLink',
			page: pageName,
			name: 'Go to description page',
			// This specifies that the button takes you to the next step of a process,
			// which affects its appearance.
			type: 'progressive'
		}, {
			// This makes the okay button on this step end the tour.
			action: 'end'
		} ]
	} )
	.back( 'callout' );

// The following should be the last line of your tour.
} ( window, document, jQuery, mediaWiki, mediaWiki.guidedTour ) );
// 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;

	// Check if there are section edit links (used later)
	hasEditSection = $( '.mw-editsection' ).length > 0;

	tour = new gt.TourBuilder( {
		name: 'Scratch Wiki Adventure',
		// Specify that we want logging for this tour
		shouldLog: true
	} );

	tour.firstStep( {
		name: 'Welcome!',
		title: 'Welcome to the Wiki!',
		description: 'Hello, and welcome to the Scratch Wiki Adventure (SWA)!  This program will help teach you the basics of the Scratch Wiki, including user page basics, responding to messages on your talk page, creating and editing articles, uploading and using files and posting on talk pages.  This adventure will take approximately (how long it takes) minutes.  You can leave it at any time by pressing the (X) Button.  Press the [Next] button to continue.',
		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();
				}
			}
		} ]
	} )
       tour.firstStep( {
		name: 'intro',
		title: 'Edit the whole page…',
		description: 'Click the "Edit" button to make your changes.',
		attachTo: '#ca-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 'preview', indicating that the tour should transition to the
	// 'preview' step automatically.
	.transition( function () {
		if ( gt.isEditing() ) {
			return 'preview';
		}
	} )
	.next( 'editSection' );

	tour.step( {
		name: 'editSection',
		title: 'Or edit a section',
		description: 'There are "edit" links for each major section in a page, so you can focus on just that part.",',
		position: 'right',
		attachTo: '.mw-editsection',
		// Automatically scroll to this step
		autoFocus: true,
		// Custom width, in pixels
		width: 300
	} )
	.transition( function () {
		if ( gt.isEditing() ) {
			return 'preview';
		} else if ( !hasEditSection ) {
			// Returning HIDE means that the tour should be hidden, but not ended.
			return gt.TransitionAction.HIDE;
		}
	} )
	.back( 'intro' );
        .next( 'summary' );
	tour.step( {
		name: 'summary',
		title: 'Edit your summary',
		description: 'Clicking "Show preview" allows you to check what the page will look like with your changes. Just don\'t forget to save!",',
		attachTo: '#wpSummary',
		autoFocus: true,
		position: 'top',
		// This specifies that, unlike the default, the guider should not close when the user clicks outside of it.
		closeOnClickOutside: false
	} 	
	.next( 'preview' );
tour.step( {
		name: 'preview',
		title: 'Preview your changes',
		description: 'Clicking "Show preview" allows you to check what the page will look like with your changes. Just don\'t forget to save!",',
		attachTo: '#wpPreview',
		autoFocus: true,
		position: 'top',
		// This specifies that, unlike the default, the guider should not close when the user clicks outside of it.
		closeOnClickOutside: false
	} 	
	.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( 'preview' );

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

Cookies help us deliver our services. By using our services, you agree to our use of cookies.