Note: After saving, you have to bypass your browser's cache to see the changes. Google Chrome, Firefox, Microsoft Edge and Safari: Hold down the ⇧ Shift key and click the Reload toolbar button. For details and instructions about other browsers, see Wikipedia:Bypass your cache.
/**
 * This is the main object that holds the state for everything
 */
function mcw() {
 
	//Keep track of what step we are on
	this.wizard_step = 0;
 
	//Has the admin attempted to resolve this on the talk page
	this.talkpage = false;

	//Talk Page Link
	this.talkpage_link = '';
 
	//Title of Article
	this.article_title = '';
  
	//Description of dispute
	this.dispute_description = '';

	//Previous Steps
	this.previous_steps = '';

	//Involved users
    	this.involved_users = mw.config.get( 'wgUserName' ) + ', ';

	/** Previous forum Variables **/

	//These keep the state of which checkboxes were ticked
	this.previous_forums = {
		page1: false,
		page2: false,
		page3: false,
		page4: false
	};

	//These are the labels that the users will see next to each checkbox
	this.previous_forum_labels = {
		page1: "Location 1",
		page2: "Location 2",
		page3: "Location 3",
		page4: "Location 4"
	};

	//These are the links that the user fills in, after ticking the checkbox
	this.previous_forum_links = {
		page1: '',
		page2: '',
		page3: '',
		page4: ''
	};

	this.appendTalkpageInput = function( selector ) {

		$( selector ).append( $('<h3>Location of talk page:</h3>') );
		var inputframe = $('<div></div>');
		inputframe.addClass('talkpageInputFrame');
		inputframe.css('padding-left', '40px');

		var talkpage = $( document.createElement('input') );
		talkpage.attr({
			type: "text",
			name: "talkpage_link",
			onChange: "updateTalkpage(this)",
			size: 45,
			value: this.talkpage_link
		});

		inputframe.append( talkpage );
		$( selector ).append( inputframe );
	}

	this.appendForumInput = function( selector ) {
		var forumstate = this.previous_forums;
		var labels = this.previous_forum_labels;
		var links = this.previous_forum_links;

		var listframe = $("<div></div>");
		listframe.addClass('forumInputFrame');
		listframe.css('padding-top', '10px');
		listframe.css('padding-bottom', '10px');
		listframe.append( $("<h3>Previous Forums:</h3>") );

		var list = $("<ul></ul>", {
			id: "forum_input"
		});

		for (forumid in labels) {
			var inputbox = $("<input></input>", {
				type: "checkbox",
				id: "forForum"+forumid,
				name: "Forum"+forumid,
				value: forumid,
				checked: forumstate[forumid],
				onClick: "setForumState(this)",
			});

			var label = $("<label></label>", {
				for: "forForum"+forumid,
				text: labels[forumid]
			});

			var item = $("<li></li>");

			var linkbox = $("<input></input>", {
                                type: "text",
                                size: 45,
                                name: forumid,
                                onchange: "updateLink(this)",
                                value: links[forumid],

                        });

                        var linkdiv = $("<div></div>", {
                                id: "link_"+forumid
                        });

                        if (forumstate[forumid] == false) {
                                linkdiv.attr('style', 'display: none');
                        }

			linkdiv.html("<label>link:</label>");
                        linkdiv.append(linkbox);

			item.append(inputbox);
			item.append(label);
			item.append(linkdiv);
			list.append(item);
		}

		listframe.append(list);

		$(selector).append(listframe);
	}

	//Desired Outcome
	this.desired_outcome = '';

	//Page where the report will be posted
	this.post_link = '';
 
	// Draw text box
	this.drawTitleInput = function() {
		//Appends to $("#mcwContent1")

		$("#mcwContent1").append("<h3>Location of dispute</h3>");
		$("#mcwContent1").append("<p>What is the location of this dispute? If there are multiple forums, separate them with commas.</p>");

		var inputbox = $( document.createElement('input') );
		inputbox.attr({
			type: "text",
			name: "article_title",
			value: this.article_title
		});

		inputbox.change( function() {  gmcw.article_title = this.value.replace("https://", "http://").replace("http://en.wikipedia.org/wiki/", "").replace("_", " ").replace("[[", '').replace("]]", ''); } )

		$("#mcwContent1").append( inputbox );
	}
 
	// Draw description textarea
	this.drawDescriptionInput = function() {
		//Appends to $("#mcwContent1")
 
		$("#mcwContent1").append("<h3>Dispute overview</h3>");
		$("#mcwContent1").append("<p>Can you give us a quick explanation of what is going on? What is the issue you are bringing to dispute resolution?</p>");
 
		var desc = $( document.createElement('textarea') );
		desc.attr({
			rows: 6,
			cols: 60,
			maxlength: 2000
		});
		desc.text( this.dispute_description );
 
		desc.change( function() { gmcw.dispute_description = this.value; } );
		desc.bind('keyup', function() { $("#taCount").text(""+this.value.length+" / 2000"); } );

		$("#mcwContent1").append( desc );
 
		$("#mcwContent1").append( $("<p id='taCount'>"+this.dispute_description.length+"/2000</p>") );
	}

	// Involved users
	this.drawUserInput = function() {
		//Appends to $("#mcwContent1")

		$("#mcwContent1").append("<h3>Users involved</h3>");
		$("#mcwContent1").append("<p>Who else is involved in the dispute? Enter them into the below box, without the User:, separated by commas: e.g. Example, Example2. (Please remember to notify them of this discussion)</p>");

		var inputbox = $( document.createElement('input') );
		inputbox.attr({
			type: "text",
			name: "involved_users",
			value: this.involved_users
		});

		inputbox.change( function() { gmcw.involved_users = this.value; } );

		$("#mcwContent1").append( inputbox );
	}

	// Draw previous forums
	this.drawPreviousInput = function() {
		//Appends to $("#mcwContent1")
 
		$("#mcwContent1").append("<h3>Resolving the dispute </h3>");
		$("#mcwContent1").append("<p>What other steps, if any, have you tried to resolve this dispute?</p>");
 
		var desc = $( document.createElement('textarea') );
		desc.attr({
			rows: 3,
			cols: 60,
			maxlength: 500,
			onChange: "updatePrevious(this)",
			onkeyup: "updatePreviousCount(this)"
		});
		desc.text( this.previous_steps );
 
		$("#mcwContent1").append( desc );
 
		$("#mcwContent1").append( $("<p id='pcCount'>"+this.previous_steps.length+"/500</p>") );
	}
 
 	// Draw outcome textarea
	this.drawOutcomeInput = function() {
		//Appends to $("#mcwContent1")

		$("#mcwContent1").append("<p>How do you think we can help resolve the dispute?</p>");

		var desc = $( document.createElement('textarea') );
		desc.attr({
			rows: 5,
			cols: 60,
			maxlength: 500
		});
		desc.text( this.desired_outcome );

		desc.change( function() { gmcw.desired_outcome = this.value; } );
		desc.bind('keyup', function() { $("#ocCount").text(""+this.value.length+" / 500"); });

		$("#mcwContent1").append( desc );
		$("#mcwContent1").append( $("<p id='ocCount'>"+this.desired_outcome.length+"/500</p>") );
	}
 
	// Draw the summary content
	this.drawmcwSummary = function() {
		//Appends to $("#mcwContent1")

		//$("#mcwContent1").append(list);

		//Talk Page
		$("#mcwContent1").append("<h3>Talk Page</h3>");
		$("#mcwContent1").append( $("<p></p>").text(this.talkpage_link) );

		//previous forums
		$("#mcwContent1").append("<h3>Previous Forums</h3>");
                var pflist = $("<ul></ul>");
                for ( forumid in this.previous_forum_labels ) {
                     if ( this.previous_forums[forumid] ) {
                         pflist.append( $("<li></li>", {
                             text: this.previous_forum_labels[forumid] + ": " + this.previous_forum_links[forumid]
                         }) );
                     }
                }
		$("#mcwContent1").append( pflist );

		//Article Title
		$("#mcwContent1").append("<h3>Location of dispute</h3>");
		$("#mcwContent1").append( $("<p></p>").text(this.article_title) );

		//Dispute Description
		$("#mcwContent1").append("<h3>Dispute overview</h3>");
		$("#mcwContent1").append( $("<p></p>").text(this.dispute_description) );

		//Users involved
		$("#mcwContent1").append("<h3>Users involved</h3>");
		$("#mcwContent1").append( $("<p></p>").text(this.involved_users) );

		//Previous forums
		$("#mcwContent1").append("<h3>Resolving the dispute</h3>");
		$("#mcwContent1").append("<h4>Other steps if any, you have tried to resolve this dispute</h4>");
		$("#mcwContent1").append( $("<p></p>").text(this.previous_steps) );

		//Desired Outcome
		$("#mcwContent1").append("<h4>How you think we can help resolve the dispute?</h4>");
		$("#mcwContent1").append( $("<p></p>").text(this.desired_outcome) );
 
	}
 
	// Generate a WikiText string, representing the report.
	// Returns a string of wikitext
	this.getWikitextReport = function() {
		//Returns string of wikitext for submission to DR page
		var report = "<noinclude>{{Medcom menu}}</noinclude>{{Medcombox/top|article={{<includeonly>subst:</includeonly>SUBPAGENAME}}}}===\n{{<includeonly>subst:</includeonly>SUBPAGENAME}}===<!--MedComSCRIPT-Do-Not-Remove-Or-Change-This-Line-TAG-->{{Medcombox|article={{<includeonly>subst:</includeonly>SUBPAGENAME}}|mediator=|parties=|opened={{<includeonly>subst:</includeonly>CURRENTDAY}} {{<includeonly>subst:</includeonly>CURRENTMONTHABBREV}} {{<includeonly>subst:</includeonly>CURRENTYEAR}}|status=Rfm}}\n\n";
        
		
        //Article Title
		report += "<span style=\"font-size:110%\">'''Location of dispute'''</span>\n";
		var articleArray = this.article_title.split(',');
		for (var articleIndex = 0; articleIndex < articleArray.length; articleIndex++)
		{
			report += "* {{pagelinks|" + articleArray[articleIndex]+"}}\n";
		}
		
		//Involved users
		report += "<span style=\"font-size:110%\">'''Users involved'''</span>\n";
		var userArray = this.involved_users.split(',');
		for (var userIndex = 0; userIndex < userArray.length; userIndex++)
		{
			report += "* {{User|" + userArray[userIndex]+"}}\n";
		}
		
		//Dispute Description
		report += "<span style=\"font-size:110%\">'''Dispute overview'''</span>\n";
		report += "\n"+ this.dispute_description+"\n\n";
		
		//Previous forums
		report += "<span style=\"font-size:110%\">'''Other steps of [[WP:DR|dispute resolution]] that have been attempted'''</span>\n";
		report += "\n"+ this.previous_forums+"\n\n";
 
		//The rest of the stuff
	    report += "====Issues to be mediated====\n\n''All aspects of article content over which there is disagreement should be listed here. The filing party should define the scope under Primary issues, which is used to frame the case; other parties to the dispute can list other issues under Additional issues, and can contest the primary issues on [[Wikipedia talk:{{PAGENAME}}|case talk page]].''\n;Primary issues\n*Issue 1\n*Issue 2\n\n\;Additional issues (added by other parties)\n*Additional issue 1\n*Additional issue 2\n\n====Parties' agreement to mediation====\n\n''All parties please indicate below whether they agree to mediation of this dispute; remember to [[WP:SIGN|sign]] your post. Extended comments should be made on case talk page. Every party listed above will be automatically notified that this request has been filed.''\n#Agree. <includeonly>~~</includeonly>~~\n#\n\n====Decision of the Mediation Committee====\n''A member of the Mediation Committee will indicate whether this request is to be [[Wikipedia:Requests for mediation/Guide#Accepted requests|accepted]] or [[Wikipedia:Requests for mediation/Guide#Rejected requests|rejected]]. Notes concerning the request and questions to the parties may also be posed by a committee member in this section.''<!--MedComSCRIPT-Do-Not-Remove-Or-Change-This-Line-CLOSECOMMENT--><!-- Do not remove or edit this category. It is essential to the case management bot. --><includeonly>{{Medcombox/bottom}}<noin<noinclude/>clude>[[Category:Mediation Committee pending cases|Sample]]</noin<noinclude/>clude></includeonly>\n\n";
        return report;
    }
	// Returns an html string, representing the progress bar, based on the
	// objects state.
	this.getProgressBar = function() {
		var s1_active =( this.wizard_step==1 )?' pr-active':'';
		var s2_active =( this.wizard_step==2 )?' pr-active':'';
		var s3_active =( this.wizard_step==3 )?' pr-active':'';
 
 
		var signupbox = '<ul id="signuptopbox">';
		signupbox += '<li class="s1'+s1_active+'"><span class="pr-number">1</span><span>Preliminary</span></li>';
		signupbox += '<li class="pr-spacer'+s1_active+'"><div></div></li>';
 
		signupbox += '<li class="s2'+s2_active+'"><span class="pr-number">2</span><span>Description</span></li>';
		signupbox += '<li class="pr-spacer'+s2_active+'"><div></div></li>';
 
		signupbox += '<li class="s3'+s3_active+'"><span class="pr-number">3</span><span>Summary</span></li>';
		signupbox += '<li class="pr-spacer'+s3_active+'"><div></div></li>';
 
		signupbox += '</ul>';
 
		return signupbox;
	}
 
	this.getArticleTitle = function() {
		return this.article_title;
	}
 
	this.getDisputeDescription = function() {
		return this.dispute_description;
	}
}
 
 
/**
 * The various "show...()" functions display each of the 'screens' in the wizard
 */
 
function showStep1() {
 
	gmcw.wizard_step = 1;
 
	$("#mcwProgressBar").html( gmcw.getProgressBar() );
 
	$("#mcwContent1").html('<h2>Request dispute resolution</h2> <p> Hi there. This form can be used to file a request at MedCom - a process for resolving a dispute over article content between two or more editors. It is unable to address disputes primarily concerning user conduct - they should be discussed with the users involved first, and failing that directed <a href="http://en.wikipedia.org/wiki/WP:ANI">here.</a> If you have any questions please ask one of our <a href="http://en.wikipedia.org/wiki/WP:DRVOLUNTEERS">volunteers</a> for guidance.\
\
\
<h3>In brief: dispute resolution should be used when you:</h3>\
\
<ul>\
<li>Have a dispute with another editor and need help resolving it</li>\
<li>Are willing to discuss the issues in a calm and civil manner</li>\
<li>Are open to the idea of compromising with the other editors to resolve the dispute</li>\
</ul>\
\
<h3>This process can:</h3>\
<ul>\
<li>Help provide suggestions on content</li>\
<li>Frame discussions and offer support for parties that want to work towards a compromise</li>\
</ul>\
\
<h3>This process cannot:</h3>\
<ul>\
<li>Block other users from editing (either everywhere or specific pages)</li>\
<li>Remove content that you don\'t like from articles</li>\
<li>Force another editor to do something</li>\
<li>Address disputes that are currently under discussion somewhere else (such as <a href="http://enwp.org/WP:RFC">Requests for Comment</a>, <a href="http://enwp.org/WP:M">Mediation</a> or <a href="http://enwp.org/WP:RFAR">Arbitration</a>).</li>\
</p>\
 <br>Has this issue been discussed extensively on the article talk page? (If you don\'t know what an article talk page is, answer "Not yet". </p>');
 
	var buttons = '<a href="javascript:yesClick()" class="button1">Yes, it has.</a>';
	buttons += ' <a href="javascript:showCancel()" class="button1">Not yet.</a>';
	$("#mcwButtons").html(buttons);
}
 
 
function showStep2( errorMsg ) {

	gmcw.wizard_step = 2;
	$("#mcwProgressBar").html( gmcw.getProgressBar() );

	var intro = '';

	if ( typeof errorMsg !== 'undefined' ) {
		intro = '<p class="warning">' + errorMsg + '</p>';
	}

	intro += '<p>Here, briefly describe the current situation - where the dispute is happening, what is the dispute and what are you hoping to get out of dispute resolution. (Basically, how can we help resolve the issue?)<br><br>Take note of the character limits as they are there to help focus the discussion.</p>';

	$("#mcwContent1").html( intro );
 
	gmcw.drawTitleInput();
 
	gmcw.drawDescriptionInput();
	
	gmcw.drawUserInput();
	
	gmcw.drawPreviousInput();
	
	gmcw.drawOutcomeInput();
 
	var buttons = '<a href="javascript:showStep1()" class="button1">Back</a>';
	buttons += ' <a href="javascript:showCancel()" class="button1">Cancel</a>';
	buttons += ' <a href="javascript:showStep3()" class="button1">Next</a>';
 
	$("#mcwButtons").html(buttons);
}
 
function showStep3() {
 
	var inputErrors = [];

	//Check that vars were filled
	if (gmcw.article_title == '') {
		inputErrors.push("Location of dispute");
	}
	if (gmcw.dispute_description == '') {
		inputErrors.push("Dispute overview");
	}
	if (gmcw.previous_forums == '') {
		inputErrors.push("Previous steps");
	}
	if (gmcw.desired_outcome == '') {
		inputErrors.push("Desired outcome");
	}
	if ( inputErrors.length > 0 ) {
		return showStep2( 'All fields are required. Missing values for: '+inputErrors.join(', ') );
	}

	gmcw.wizard_step = 3;
	$("#mcwProgressBar").html( gmcw.getProgressBar() );
 
	$("#mcwContent1").html('<p>Here\'s a summary of what you\'ve told us. Quickly check that it\'s all correct before you submit your request, and we will file the dispute for you and give you a link to the discussion.</p>');
 
	gmcw.drawmcwSummary();
 
 
	var buttons = '<a href="javascript:showStep2()" class="button1">Edit</a>';
	buttons += ' <a href="javascript:showCancel()" class="button1">Cancel</a>';
	buttons += ' <a href="javascript:doSubmit()" class="button1">Save</a>';
 
	$("#mcwButtons").html(buttons);
}
 
function showResult( status ) {
 
	$("#mcwProgressBar").text('');
 
	if ( status == 'ok' ) {
		//Show thankyou
		$("#mcwContent1").html('<h3>Success!</h3><p>Thank you for filing a request for dispute resolution</p>');
		$("#mcwContent1").append( $("<a>Click here to go view your request.</a>").attr({ href: wgArticlePath.replace('$1', gmcw.post_link) }) );
		$("#mcwButtons").html('');
	} else if ( status == 'error' ) {
		//Show error
		$("#mcwContent1").html('<h2>Error</h2><p>Sorry, there was an error attaching your request. Maybe try it again?</p>');
		$("#mcwButtons").html('<a href="javascript:showStep3()" class="button1">Back to Summary</a>');
	} else {
		$("#mcwContent1").html('<h2>Error</p><p>Something went wrong!</p>');
		$("#mcwButtons").html('');
	}
}
 
 
function showCancel() {
 
	gmcw.wizard_step = 0;
	$("#mcwProgressBar").html( gmcw.getProgressBar() );
 
	$("#mcwContent1").html('<p>It\'s best to discuss your concerns with the other users on the talk page of the article before seeking dispute resolution. You can find instructions on how to do this at <a href="http://en.wikipedia.org/wiki/WP:DISCUSSIT">this page,</a>\ or you can place <code><nowiki>{{helpme}}</nowiki></code> on <a href="http://enwp.org/Special:MyTalk">your own talk page</a>, and a volunteer will come by your page to help.<br><br> If you have already tried to discuss this issue already and have received <b>no</b> response from others, you may go back to the previous page and file a request - but this must only be done if you have attempted to discuss the issue first.</a>\</p>');
	$("#mcwButtons").html('<a href="javascript:showStep1()" class="button1">Start Over</a>');
}
 
/**
 * Do the final step of the mcw and post the report to the appropriate page
 */
function doSubmit() {
 
	//Notify user that we are doing the update
	$("#mcwProgressBar").html( '<div style="text-align: center"><img alt="saving report" src="https://upload.wikimedia.org/wikipedia/commons/d/de/Ajax-loader.gif"></img></div>' );
	$("#mcwContent1").html('<p>Posting Report....</p>');
 
	//Decide on the page to update
	var DRPage = 'Wikipedia:Requests for mediation/Pending'; //The default page to post this
 
	/**
	 * Decide where to post this dispute resolution report. In the end, DRPage needs to hold
	 * the title of the page where we post the report.
	 * 
	 * gmcw.dispute_type is set the short name (index) of the user-selected dispute type
	 * gmcw.previous_forums['xxx'] will be true if the use ticked the 'xxx' checkbox in the previous forums
	 */
 
 
	//Set the post-page on the mcw object
	gmcw.post_link = DRPage + "#" + gmcw.article_title.replace(' ', '_');

	//Compose Report
	var report = gmcw.getWikitextReport();
 
	//Add new section to designated page
	var edittoken = mw.user.tokens.get( 'editToken' );
 
	var date=new Date();
	var dateString=date.toLocaleDateString();
	var summary = gmcw.article_title;
 
	addNewSection( DRPage, summary, report, edittoken );
}
 
 
/**
 * Event handler functions
 */
function setDisputeForum( box ) {
	//alert("Setting "+gmcw.forum_labels[box.value]+" to true");
	gmcw.previous_forums[box.value] = box.checked;
	
	var linkboxid = "link_"+box.value;

	if ( box.checked ) {
		$("#"+linkboxid).show();
	} else {
		$("#"+linkboxid).hide();
	}
}
 
function updateLink( box ) {
        gmcw.forum_links[box.name] = box.value;
}
 
function yesClick() {
	gmcw.talkpage = true;
	showStep2();
}
 
/**
 * Taken almost verbatim from http://www.mediawiki.org/wiki/API:Edit
 */
function addNewSection( pagetitle, summary, content, editToken ) {
    $.ajax({
        url: mw.util.wikiScript( 'api' ),
        data: {
            format: 'json',
            action: 'edit',
            title: pagetitle,
            section: 'new',
            summary: summary,
            text: content,
            token: editToken
        },
        dataType: 'json',
        type: 'POST',
        success: function( data ) {
            if ( data && data.edit && data.edit.result == 'Success' ) {
                //window.location.reload(); // reload page if edit was successful
		showResult( 'ok' );
            } else if ( data && data.error ) {
                alert( 'Error: API returned error code "' + data.error.code + '": ' + data.error.info );
		showResult( 'error' );
            } else {
                alert( 'Error: Unknown result from API.' );
		showResult( 'error2' );
            }
        },
        error: function( xhr ) {
            alert( 'Error: Request failed.' );
        }
    });
}
 
 
/**
 * Initialization function. Test if we should place the mcw on the current page.
 * Looks for a <div id="mymcw"></div> on the page.
 */
 
function runmcw() {
 
	if ($('#mymcw').length){
 
                importStylesheet('User:Szhang (WMF)/mcw.css'); //CSS Styles for the mcw
 
       		//Setup the App's workspace
                $("#mymcw").html('');
		$("#mymcw").append($('<div id=mcw_main style="height: 600px; width: 800px; border : 2px black solid;"></div>'));
		$("#mcw_main").css('height', '1000px');
		$("#mcw_main").append('<div style="width: 750px; padding: 20px 25px; height: 30px; text-align: center" id="mcwProgressBar"></div>');
		$("#mcw_main").append('<div style="width: 700px; padding: 25px 50px" id="mcwContent1"></div>');
		$("#mcw_main").append('<div style="width: 700px; padding: 10px 50px; text-align: center" id="mcwButtons"></div>');
 
		showStep1(); //Show the first page
	}
};
 
var gmcw = new mcw();
 
$( document ).ready( runmcw );
// JavaScript Document