MediaWiki:Guidedtour-tour-twa1.js
// The Wikipedia Adventure Mission 1 - Visual Editor
( function ( window, document, $, mw, gt ) {
var api = new mw.Api();
// Disable these VE onboarding things that clash with TWA onboarding and don't explain anything TWA doesn't
api.saveOption("visualeditor-hidebetawelcome", 1);
api.saveOption("visualeditor-hideusered", 1);
//automatic api:edit function to send yourself messages
// Simplified version for this module which doesn't need the TWA Earth boilerplate
function sendMessage( targetPage, msgPage, linkTo, isTalk) {
if(!mw.config.get('wgUserName')) {
alert( "Please login." );
return;
}
api.get( {
'action' : 'query',
'titles' : msgPage+'|'+targetPage,
'prop' : 'revisions',
'meta' : 'tokens',
'type' : 'csrf',
'rvprop' : 'content',
'indexpageids' : 1
} ).done( function (result) {
result = result.query;
var page = result.pages[result.pageids[1]];
var text = page.revisions[0]['*'];
text = text.replaceAll("
if (result.pageids[0] > 0) {
var targetSrc = result.pages[result.pageids[0]];
var srcText = targetSrc.revisions[0]['*'];
if (isTalk && srcText.includes(text.substring(0, 20))) {
// Don't send duplicates
window.location.href = linkTo;
return;
} else if (srcText.includes(text)) {
// Don't send duplicate badges
window.location.href = linkTo;
return;
}
}
api.post( {
'action' : 'edit',
'title' : targetPage,
'appendtext' : '\n'+text.replace("
'summary' : 'New Message (simulated automatically as part of The Wikipedia Adventure)',
'token' : result.tokens.csrftoken
} ).done( function () {
window.location.href = linkTo;
} );
} );
}
var tour = new gt.TourBuilder( {
name: 'twa1',
emitTransitionOnStep: true,
});
var steps = [{
//1
title: 'Welcome to Wikipedia!',
description: new gt.WikitextDescription('
The journey has 7 missions, each with its own skills and surprises, all designed for you to become a great contributor to Wikipedia.
'),
overlay: true,
closeOnClickOutside: false,
buttons: [ {
name: 'Get equipped for the trip',
action: 'next',
}, {
name: 'I\'d like to leave',
onclick: function() { document.cookie = 'enwiki-mw-tour=; Path=/; Expires=Thu, 01 Jan 1970 00:00:01 GMT;'; document.location.replace('/wiki/Wikipedia:The Wikipedia Adventure'); return false; }
} ],
allowAutomaticOkay: false,
}, {
//2
title: 'Know before you go',
description: new gt.WikitextDescription('
Don\'t [x] out
This box is your spacesuit: if you close it before completing a mission, you leave the adventure and need to restart the mission from the beginning.
Automatic messages
When you play this game, you send some messages to your personal Wikipedia page, any time you see * in the blue button.'),
overlay: true,
closeOnClickOutside: false,
back: true,
buttons: [ {
name: 'Come with me...',
action: 'next',
} ],
allowAutomaticOkay: false
}, {
//3
title: 'Why Wikipedia?',
description: new gt.WikitextDescription('
Imagine a world in which every single person on the planet is given free access to the sum of all human knowledge.
Most amazing is that...
'),
overlay: false,
closeOnClickOutside: false,
back: true,
buttons: [ {
name: 'It is happening',
action: 'next',
} ],
allowAutomaticOkay: false
}, {
//4
title: 'It is happening',
description: new gt.WikitextDescription('
'),
overlay: false,
closeOnClickOutside: false,
back: true,
buttons: [ {
name: 'Who writes this Wikipedia?',
action: 'next',
} ],
allowAutomaticOkay: false
}, {
//5
title: 'Who writes this Wikipedia?',
description: new gt.WikitextDescription('
'),
overlay: false,
closeOnClickOutside: false,
back: true,
buttons: [ {
name: 'Why do people edit?',
action: 'next',
} ],
allowAutomaticOkay: false
}, {
//6
title: 'Discover your special role',
description: new gt.WikitextDescription('
'),
overlay: false,
closeOnClickOutside: false,
back: true,
buttons: [ {
name: 'Are you ready?',
action: 'next',
} ],
allowAutomaticOkay: false,
}, {
//7
title: 'Login or create an account',
description: new gt.WikitextDescription('
'),
overlay: false,
closeOnClickOutside: false,
back: true,
buttons: [ {
name: 'Log in!',
action: 'externalLink',
url: mw.util.getUrl( 'Special:UserLogin' ) + '?tour=twa1&step=7'
} , {
name: 'Register!',
action: 'externalLink',
url: mw.config.get('wgServer') + mw.config.get('wgScriptPath') + '/index.php?title=Special:CreateAccount&returnto=Wikipedia:TWA/1/Start&returntoquery=tour%3Dtwa1%26step%3D8'
} ],
allowAutomaticOkay: false,
skip:function() {
// For the case where you do log in/register and reload the tour after
return mw.config.get('wgUserId') != null;
}
} , {
//8
title: 'Say hello to Wikipedia',
description: new gt.WikitextDescription('
Let\'s start off by introducing yourself to the community.
It will take just a few seconds to load the universe—light only travels so fast.
(For the rest of the journey, you need to be logged in.)
'),
overlay: true,
closeOnClickOutside: false,
buttons: [ {
name: '←',
action: 'externalLink',
url: mw.config.get('wgServer') + mw.config.get('wgScriptPath') + '/index.php?title=Wikipedia:TWA/1/Start&tour=twa1&step=6'
} , {
name: 'Hello World*',
onclick: function() { if(!mw.config.get('wgUserName')){ alert( "Please login." ); return; } sendMessage( 'User talk:' + mw.config.get( 'wgUserName' ), 'Wikipedia:TWA/Welcome' , mw.util.getUrl( 'Special:MyPage' ) + '?tour=twa1&step=9', true); }
} ],
allowAutomaticOkay: false
} , {
//9
title: 'Your userpage',
description: new gt.WikitextDescription('
Remember this is a very public profile, so keep private information, well, private.
'),
overlay: false,
closeOnClickOutside: false,
buttons: [ {
name: '←',
action: 'externalLink',
url: mw.util.getUrl( 'Wikipedia:TWA/1/Start' ) + '?tour=twa1&step=8'
} , {
name: 'What does a good userpage look like?',
action: 'externalLink',
url: mw.util.getUrl( 'Wikipedia:TWA/1/Bio' ) + '?tour=twa1&step=10'
} ],
allowAutomaticOkay: false
} , {
//10
title: 'Challenge yourself BELOW...',
description: new gt.WikitextDescription('Hint: you can learn as much from getting it wrong as getting it right. And you can always try again!'),
attachTo:'#contentSub',
position: 'bottom',
overlay: false,
closeOnClickOutside: false,
allowAutomaticOkay: false,
buttons: [ {
name: '←',
action: 'externalLink',
url: mw.util.getUrl( 'Special:MyPage' ) + '?tour=twa1&step=9'
} ],
} , {
//11
title: 'Your turn!',
description: new gt.WikitextDescription('
Creating your userpage on Wikipedia is as simple as editing it.
Click CREATE or EDIT above.
'),
attachTo: '#ca-edit',
position: 'bottom',
overlay: false,
closeOnClickOutside: false,
allowAutomaticOkay: false,
buttons: [ {
name: '←',
action: 'externalLink',
url: mw.util.getUrl( 'WP:TWA/1/Bio' ) + '?tour=twa1&step=10'
} ],
skip: "vefork",
hooks: "ve.activationComplete"
}, {
//12
title: 'The editing interface',
description: new gt.WikitextDescription('
This is the visual editor. Type something in the editable area: your username, city or country, education, skills, and interests. What are you excited about doing here? Share as much or as little as you like, but make at least ONE edit.
If you already have a userpage, make at least ONE improvement to it.
When you\'re ready, click PUBLISH PAGE or PUBLISH CHANGES.'),
overlay: false,
attachTo: '.ve-ui-toolbar-group-save',
position: 'bottom',
closeOnClickOutside: false,
allowAutomaticOkay: false,
buttons: [ {
name: '←',
action: 'externalLink',
url: mw.util.getUrl( 'Special:MyPage' ) + '?tour=twa1&step=11'
}],
skip: function(transitionEvent) {
return transitionEvent.type === gt.TransitionEvent.MW_HOOK && transitionEvent.hookName == "ve.saveDialog.stateChanged";
},
hooks: "ve.saveDialog.stateChanged"
} , {
//13
title: 'Edit summary and Publish',
description: new gt.WikitextDescription( '
That looks pretty good! Leave a brief note about the changes you made, called an Edit Summary. This helps others follow along with your work.
Let\'s say that you "Introduced myself".
Now all you have to do is Publish it. Publishing makes an edit live and public. Click PUBLISH PAGE or PUBLISH CHANGES again when you\'re ready.
'),
overlay: false,
// Ideally this would be attached to the save dialog itself but since it is still loading when the tour event fires that doesn't work
attachTo: "#footer, #mw-footer",
position:"bottom",
closeOnClickOutside: false,
allowAutomaticOkay: false,
skip: gt.isPostEdit,
back: true,
buttons: []
} , {
//14
title: 'Congrats!',
description: new gt.WikitextDescription('NEW TOOL EARNED: Editor Badge
You\'re a Wikipedia editor! How does it feel? It\'s great that you introduced yourself.
'),
overlay: false,
closeOnClickOutside: false,
allowAutomaticOkay: false,
buttons: [ {
name: '←',
action: 'externalLink',
url: mw.util.getUrl( 'Special:MyPage' ) + '?tour=twa1&step=12&veaction=edit'
} , {
name: 'Make it even better*',
onclick: function() { if(!mw.config.get('wgUserName')){ alert( "Please login." ); return; } sendMessage( 'User:' + mw.config.get( 'wgUserName' ), 'Wikipedia:TWA/Badge/1template2' , mw.util.getUrl( 'Special:MyPage' ) + '?tour=twa1&step=15', false); }
} ],
} , {
//15
title: 'Even better',
description: new gt.WikitextDescription('
Let\'s go back and make a few changes to the text. Click EDIT
'),
overlay: false,
attachTo: '#ca-edit',
position: 'bottom',
closeOnClickOutside: false,
allowAutomaticOkay: false,
back: true,
buttons: [],
skip: "vefork",
hooks: "ve.activationComplete"
} , {
//16
title: 'Add bold',
description: new gt.WikitextDescription('
Then click the \'\'\'\'\'A\'\'\'\'\' in the toolbar above and select BOLD.
The visual editor makes editing much easier because it automatically adds formatting.
.'),
attachTo: "#bodyContent",
position: 'leftTop',
overlay: false,
closeOnClickOutside: false,
buttons: [ {
name: '←',
action: 'externalLink',
url: mw.util.getUrl( 'Special:MyPage' ) + '?tour=twa1&step=15'
} , {
name: 'Bolded',
action: 'next'
} ],
} , {
//17
title: 'Add italics',
description: new gt.WikitextDescription('
Then select ITALIC from the same toolbar menu to put them in italics.
'),
attachTo: "#bodyContent",
position: 'leftTop',
overlay: false,
closeOnClickOutside: false,
allowAutomaticOkay: false,
back: true,
buttons: [ {
name: 'Italicized',
action: 'next'
} ],
} , {
//18
title: 'Add wikilinks',
description: new gt.WikitextDescription('
Highlight the city or country where you\'re from.
Then click the File:OOjs UI icon link-ltr.svg button in the editing toolbar (it looks like part of a chain).
Last, click DONE to insert the link, and click PUBLISH CHANGES to publish your changes.
'),
attachTo: "#bodyContent",
position: 'leftTop',
overlay: false,
closeOnClickOutside: false,
back: true,
buttons: [],
skip: function(transitionEvent) {
return transitionEvent.type === gt.TransitionEvent.MW_HOOK && transitionEvent.hookName == "ve.saveDialog.stateChanged";
},
allowAutomaticOkay: false,
hooks: "ve.saveDialog.stateChanged"
} , {
//19
title: 'Edit summary and Publish',
description: new gt.WikitextDescription('
You "Added bold, italics, and wikilinks". Just click PUBLISH CHANGES again, and your edits will go live.
'),
attachTo: "#footer, #mw-footer",
position:"bottom",
overlay: false,
closeOnClickOutside: false,
allowAutomaticOkay: false,
buttons: [ {
name: 'Go back',
action: 'externalLink',
url: mw.util.getUrl( 'Special:MyPage' ) + '?tour=twa1&step=18&veaction=edit'
} ],
skip: gt.isPostEdit,
} , {
//20
title: 'You did it :)',
description: new gt.WikitextDescription('NEW TOOL EARNED: Formatter Badge
You\'re learning fast. You\'re awesome. We\'re just getting started but already you have the basic tools to go on an adventure. Keep an eye on the skill meter at the bottom of the page as you develop more and more strengths.
'),
overlay: true,
closeOnClickOutside: false,
buttons: [ {
name: '←',
action: 'externalLink',
url: mw.util.getUrl( 'Special:MyPage' ) + '?tour=twa1&step=18&veaction=edit'
} , {
name: 'What\'s next??*',
onclick: function() { if(!mw.config.get('wgUserName')){ alert( "Please login." ); return; } sendMessage( 'User:' + mw.config.get( 'wgUserName' ), 'Wikipedia:TWA/Badge/2template2' , mw.util.getUrl( 'Wikipedia:TWA/1/End' ) + '?tour=twa1&step=21', false); }
} ],
allowAutomaticOkay: false
} , {
//21
title: 'Mission 1 complete!',
description: new gt.WikitextDescription('
File:Carl Czerny - Duo Concertante - 1. Allegro (short).ogg
Journey on to mission 2...'),
overlay: false,
closeOnClickOutside: false,
buttons: [ {
name: 'Congrats me!',
action: 'end'
} ],
}];
var sourceEditorStepOverrides = {
12: {
title: 'The editing interface',
description: new gt.WikitextDescription('
Type into the big text box towards the top left: your username, city or country, education, skills, and interests. What are you excited about doing here? Share as much or as little as you like, but make at least ONE edit.
If you already have a userpage, make at least ONE improvement to it.
'),
overlay: false,
attachTo: '#wpTextbox1',
position: 'bottomRight',
closeOnClickOutside: false,
buttons: [ {
name: '←',
action: 'externalLink',
url: mw.util.getUrl( 'Special:MyPage' ) + '?tour=twa1&step=11'
} , {
name: 'Typed it',
action: 'next'
} ],
}, 13: {
title: 'Edit summary and Publish',
description: new gt.WikitextDescription( '
That looks pretty good! Before you click Publish, leave a brief note about the changes you made, called an Edit Summary. This helps others follow along with your work.
Let\'s say that you "Introduced myself".
Now all you have to do is Publish it. Publishing makes an edit live and public. Click PUBLISH when you\'re ready.
'),
overlay: false,
attachTo: '#wpSave',
position: 'bottomRight',
closeOnClickOutside: false,
allowAutomaticOkay: false,
skip: gt.isPostEdit,
back: true,
}, 16: {
title: 'Add bold',
description: new gt.WikitextDescription('
Then click the File:OOjs UI icon bold-b.svg button on the editing toolbar above the text box.
The editing toolbar makes Wikipedia much much easier, because it adds the formatting for you.'),
attachTo: '#wpTextbox1',
position: 'bottomRight',
overlay: false,
closeOnClickOutside: false,
buttons: [ {
name: '←',
action: 'externalLink',
url: mw.util.getUrl( 'Special:MyPage' ) + '?tour=twa1&step=15'
} , {
name: 'Bolded',
action: 'next'
} ],
}, 17: {
title: 'Add italics',
description: new gt.WikitextDescription('
Then click File:OOjs UI icon italic-i.svg on the editing toolbar to put them in italics.
'),
attachTo: '#wpTextbox1',
position: 'bottomRight',
overlay: false,
closeOnClickOutside: false,
allowAutomaticOkay: false,
back: true,
buttons: [ {
name: 'Italicized',
action: 'next'
} ],
}, 18: {
//18
title: 'Add wikilinks',
description: new gt.WikitextDescription('
Highlight the city or country where you\'re from.
Then click the File:OOjs UI icon link-ltr.svg button in the editing toolbar (it looks like part of a chain).
Last, INSERT the link.
'),
attachTo: '#wpTextbox1',
position: 'bottomRight',
overlay: false,
closeOnClickOutside: false,
back: true,
buttons: [ {
name: 'WikiLinked',
action: 'next'
} ],
}, 19: {
title: 'Preview your changes',
description: new gt.WikitextDescription('
Click SHOW PREVIEW to see how your new and improved user page will appear before going live.'),
attachTo: "#wpPreview",
position: "bottomRight",
overlay: false,
closeOnClickOutside: false,
allowAutomaticOkay: false,
back: true,
autoFocus: mw.config.get("wgAction") === "edit",
buttons: [ {
name: 'Previewed',
action: 'next'
} ]
}, 20: {
title: 'Edit summary and Publish',
description: new gt.WikitextDescription('
You "Added bold, italics, and wikilinks". Just click PUBLISH, and your edits will go live.
'),
attachTo: '#wpSave',
position: 'bottomRight',
overlay: false,
closeOnClickOutside: false,
allowAutomaticOkay: false,
back: true,
skip: gt.isPostEdit,
skipOffset: -1
}
};
var stepBuilders = [];
var sStepBuilders = [];
function makeSkip(target, query) {
return function(event) {
if (query(event)) {
return target;
}
};
}
function makeVeSkip(target1, target2) {
return function() {
if (gt.isEditingWithVisualEditor()) {
return target1;
} else if (gt.isEditingWithWikitext()) {
return target2;
}
};
}
for (var i = 0; i < steps.length; i++) {
var step = steps[i];
step.allowAutomaticNext = false;
step.name = (i+1).toString();
var stepBuilder;
if (i == 0) {
stepBuilder = tour.firstStep(step);
} else {
stepBuilder = tour.step(step);
}
stepBuilders[i] = stepBuilder;
if (sourceEditorStepOverrides[i]) {
var sStep = sourceEditorStepOverrides[i];
sStep.allowAutomaticNext = false;
sStep.name = i.toString()+"src";
sStepBuilders[i-1] = tour.step(sStep);
}
}
for (var j = 0; j < steps.length; j++) {
if (steps[j].hooks) {
stepBuilders[j].listenForMwHooks(steps[j].hooks);
}
if (steps[j].skip) {
if (steps[j].skip == "vefork") {
stepBuilders[j].transition(makeVeSkip(stepBuilders[j+1], sStepBuilders[j+1]));
} else {
stepBuilders[j].transition(makeSkip(stepBuilders[j+1], steps[j].skip));
}
}
if (sourceEditorStepOverrides[j] && sourceEditorStepOverrides[j].skip) {
var k = j + (sourceEditorStepOverrides[j].skipOffset || 0);
sStepBuilders[j-1].transition(makeSkip(sStepBuilders[j] || stepBuilders[k], sourceEditorStepOverrides[j].skip));
}
if (j > 0) {
if (steps[j].back) {
stepBuilders[j].back(stepBuilders[j-1]);
}
if (sStepBuilders[j] && sStepBuilders[j-1] && sourceEditorStepOverrides[j+1].back) {
sStepBuilders[j].back(sStepBuilders[j-1]);
}
}
if (j < steps.length - 1) {
stepBuilders[j].next(stepBuilders[j+1]);
if (sStepBuilders[j] && sStepBuilders[j+1]) {
sStepBuilders[j].next(sStepBuilders[j+1]);
}
}
}
} (window, document, jQuery, mediaWiki, mediaWiki.guidedTour ) ) ;