MediaWiki:Gadget-aaq.js

/**
 * Add a text box to the [[Ask a question]] page, auto-sign questions asked using
 * that form, wrap it in markup that helps facilitate individual question
 * transclusion, and add "response" buttons that spawn textboxes for posting responses.
 */
( function () {
	'use strict';
    var questionTextBox;
	
	mw.loader.using( [
		'oojs-ui',
		'oojs-ui.styles.icons-alerts'
	] ).done( function () {
		if (
			mw.config.get('wgPageName').split('/')[0] == 'Ask_a_question' ||
			mw.config.get('wgPageName') == 'Template:Ask_button'
		) {
			var that = this, gadgetMsg, userLang;
			gadgetMsg = {};
			userLang = mw.config.get('wgUserLanguage');
			new mw.Api().get( {
				action: 'query',
				list: 'messagecollection',
				mcgroup: 'page-Template:I18n/Ask_a_question',
				mclanguage: userLang
			} ).done( function ( data ) {
				var i, res, key, val;
				res = data.query.messagecollection;
				for ( i = 0; i < res.length; i++ ) {
					key = res[ i ].key.replace( 'Template:I18n/Ask_a_question/', '');
					val = res[ i ].translation;
					if ( !val ) {
						// No translation; fall back to English
						val = res[ i ].definition;
					}
					gadgetMsg[ key ] = val;
				}
				questionTextBox = new OO.ui.MultilineTextInputWidget( {
					rows: 5,
					placeholder: gadgetMsg['question-placeholder']
				} );
				
				$( '.aaq-textbox' )
					.css( 'margin-top', '0.5625em' )
					.append( questionTextBox.$element );
				$( '.aaq-ask-button .mw-ui-button' ).on( 'click', function() {
					var prefix, randomString, sectionTitle, suffix, questionAsked;
					event.preventDefault();
					randomString = Math.random().toString( 36 ).substring( 2 );
		
					questionAsked = questionTextBox.getValue();
					if ( questionAsked ) {
						prefix = '<section begin=question />\n';
						
						suffix = '\n~~' + '~~\n<span class="aaq-view-discussion" id="'
							+ randomString
							+ '"><includeonly>\n'
							+ ': {{TNT|AAQ view discussion|' + randomString + '}}'
							+ '</includeonly></span>\n'
							+ '<section end=question /><!--\n\n'
							+ 'You may post responses below this line. -->';
						
						sectionTitle = mw.config.get('wgUserName') + '\'s question';
						questionAsked = prefix + questionAsked + suffix;
						
						new mw.Api().postWithToken(
							'csrf',
							{
								action: 'edit',
								section: 'new',
								sectiontitle: sectionTitle,
								nocreate: true,
								summary: '/*' + sectionTitle + '*/ new question',
								title: 'Ask a question/Recent questions',
								text: questionAsked
							}
						).done( function() {
							new mw.Api().postWithToken(
								'csrf',
								{
									action: 'purge',
									titles: [ 'Wikimedia Resource Center', 'Ask a question' ]
								}
							).done( function() {
								window.location.href = 'https://meta.wikimedia.org/wiki/Ask_a_question/Recent_questions#' + mw.util.escapeIdForLink( randomString );
								location.reload();
							} );
						} ).fail( function() {
							alert('Post failed to save');
							location.reload();
						} );
					}
				} );
				if ( mw.config.get('wgPageName') == 'Ask_a_question/Recent_questions' ) {
					$( 'head' ).append(
						'<style>.aaq-respond-button { margin-left:1.125em; } .aaq-response { margin-top:0.5625em; margin-left:1.5em; }</style>'
					);
					$( 'h2' ).each( function() {
						var $sectionHeader = $( this ),
						buttonLabel, respondButton, userName;
						userName = $sectionHeader.children().eq(0)[0];
						if ( userName ) {
							userName = userName.innerText.replace('\'s question', '');
							buttonLabel = gadgetMsg['button-respond-to'].replace('$1', userName);
						} else {
							buttonLabel = gadgetMsg['button-respond'];
						}
						$sectionHeader.data( 'aaq-username', userName );
						respondButton = new OO.ui.ButtonInputWidget( {
							label: buttonLabel,
							framed: false,
							icon: 'speechBubbles',
							classes: [ 'aaq-respond-button' ],
							flags: [ 'progressive' ]
						} ).on( 'click', function () {
							var $button, defaultInput;
							$button = $( this );
							if ( $sectionHeader.data( 'aaq-username' ) ) {
								defaultInput = '{{ping|'
									+ $sectionHeader.data( 'aaq-username' ) 
									+ '}} ';
							} else {
								defaultInput = '';
							}
							$button.responseTextBox = new OO.ui.MultilineTextInputWidget( {
								value: defaultInput,
								rows: 5,
								classes: [ 'aaq-response' ]
							} );
							$button.responseSubmit = new OO.ui.ButtonInputWidget( { 
								label: gadgetMsg['button-respond-submit'],
								classes: [ 'aaq-response' ]
							} ).on( 'click', function () {
								var response, sectionNumber;
								if ( $button.responseTextBox.getValue() ) {
									response = '\n\n: '
										+ $button.responseTextBox.getValue()
										+ ' ~~' + '~~';
									sectionNumber = $button.responseSubmit.$element
										.parent()
										.prevAll("h2:first")
										.children( '.mw-editsection' )
										.eq(0)
										.children( 'a' )
										.eq(0)
										.attr( 'href' )
										.match( /&section=(\d+)/ )[1];
									new mw.Api().postWithToken(
										'csrf',
										{
											title: 'Ask a question/Recent questions',
											action: 'edit',
											section: sectionNumber,
											appendtext: response
										}
									).done( function() {
										location.reload();
									} );
								}
							} );
							
							$sectionHeader.nextUntil( 'h2' ).last()
								.append( $button.responseTextBox.$element )
								.append( $button.responseSubmit.$element )
								.append( $( '<span>' + gadgetMsg['respond-placeholder'] + '</span>' ) );
						} );
						if ( $sectionHeader.children().eq(1) ) {
							$sectionHeader.children().eq(1).append( respondButton.$element );
						}
					} );
				}
			} );
		}
	} );
}() );