User:Prtksxna/block.js

// 1. Find your common.js //       https://mediawiki.org/wiki/Special:MyPage/common.js

// 2. Add the following code to it: //       mw.loader.load('/w/index.php?title=User:Prtksxna/block.js&action=raw&ctype=text/javascript', 'text/javascript'); //       mw.loader.load('/w/index.php?title=User:Prtksxna/block.css&action=raw&ctype=text/css', 'text/css');

// 3. Go to Special:BlankPage (that is where we'll load the form) //       https://www.mediawiki.org/wiki/Special:BlankPage

// 4. ???

// 5. PROFIT!

mw.loader.using( 	[		'oojs', 		'oojs-ui-core', 		'oojs-ui-widgets', 		'mediawiki.widgets.UserInputWidget',		'mediawiki.widgets.SelectWithInputWidget',		'mediawiki.widgets.expiry'	],	function {		if ( window.location.pathname === "/wiki/Special:BlankPage") {			updateTitle;			makeForm;		}	} );

function updateTitle { $('#firstHeading').text( 'Block user' ); }

function makeForm { var $c = $('#mw-content-text'); $c.empty.addClass('specialblock'); $c.append( 'This is a test, it is not the real block page.  '); var user = new mw.widgets.UserInputWidget({		required: true	}); var create = new OO.ui.ButtonWidget( {		label: 'Create block',		flags: [		'primary',		'progressive'		]	} ); var reason = new mw.widgets.SelectWithInputWidget( {    	or: true,    	dropdowninput: {    	options: [	        { data: 'other', label: 'Other' },        	{ data: 'a', label: 'Inserting false information' },        	{ data: 'b', label: 'Removing content from pages' },        	{ data: 'c', label: 'Spammings links to external sites' },        	{ data: 'c', label: 'Inserting nonsense/gibberish into pages' },        	{ data: 'c', label: 'Intimidating behavior/harassment' },        	{ data: 'c', label: 'Abusing multiple accounts' },        	{ data: 'c', label: 'Unacceptable username' }    	]    	},    	textinput: {    	}	} ); var expiry = new mw.widgets.ExpiryWidget({		noDatePicker: false,		RelativeInputClass: mw.widgets.SelectWithInputWidget,		relativeInput: {			or: true,			dropdowninput: {				options: [					{ data: 'c', label: '2 hours' },					{ data: 'c', label: '1 day' },					{ data: 'c', label: '3 days' },					{ data: 'c', label: '1 week' },					{ data: 'c', label: '2 weeks' },					{ data: 'c', label: '1 month' },					{ data: 'c', label: '3 months' },					{ data: 'c', label: '6 months' },					{ data: 'c', label: '1 year' },					{ data: 'c', label: 'Indefinite' },					{ data: 'other', label: 'Other time:' }				]			},			textinput: {}		}	}); console.log(getNamespaces); $c.append( 		$(' ').text('Username or IP address').addClass( 'block' ).addClass( 'bold' ),		user.$element,		$(' ').text('Actions to block:').addClass( 'block' ).addClass( 'bold' ),		check( 'Editing' ),		check( 'Sitewide', true, 'shift', 'Some help text' ),		check( 'Partial', true, 'shift', 'Some help text' ),		multi( 'Pages', [], 'shift2', 'Some help text' ),		multi( 'Namespaces', getNamespaces, 'shift2', 'Some help text' ),		check( 'Uploading files', false, 'shift2' ),		check( 'Moving pages', false, 'shift2' ),		check( 'Account creation' ),		check( 'Sending email' ),		check( 'Editing their own talk page' ),		$(' ').text('Expiration:').addClass( 'block' ).addClass( 'bold' ),		expiry.$element,		$(' ').text('Reason:').addClass( 'block' ).addClass( 'bold' ),		reason.$element,		$(' ').text('Additional options:').addClass( 'block' ).addClass( 'bold' ),		check('Automatically block the last IP address used by this user, and any subsequent IP addresses they try to edit from'), check('Watch this user‘s user and talk pages'), ' ',		create.$element ); }

function wrap( $element, className ) { return $( ' ' ).addClass('wrap').addClass( className ).append( $element ); }

function check( label, radio, className, help ) { var el, labelEl, helpEl; if ( radio ) { el = new OO.ui.RadioInputWidget; } else { el = new OO.ui.CheckboxInputWidget; }	if ( help ) { helpEl = new OO.ui.PopupButtonWidget( {			icon: 'info',			framed: false,			popup: {				head: true,				label: help,				$content: $( help ),				padded: true,				align: 'force-right'			}		} ).$element; }	labelEl = $( ' ' ).text( label ); return wrap( [ el.$element, labelEl, helpEl ], className ); }

function multi( label, options, className, help ) { var el = new OO.ui.MenuTagMultiselectWidget( {	options: [		'foo',		'bar',		'baz'	] } ); var labelEl = $( ' ' ).text( label ); var helpEl = new OO.ui.PopupButtonWidget( {			icon: 'info',			framed: false,			popup: {				head: true,				label: help,				$content: $( help ),				padded: true,				align: 'force-right'			}		} ).$element; return wrap( [ labelEl, helpEl, el.$element ], className ); } function getNamespaces { var namespaces = Object.keys(mw.config.get( 'wgNamespaceIds' )); return namespaces.map( function ( n ) {		var name = toTitleCase( n.split( '_' ).join( ' ' ) );		return { data: name, label: name }	}); } function toTitleCase(str) { return str.replace(/\w\S*/g, function(txt){return txt.charAt(0).toUpperCase + txt.substr(1).toLowerCase;}); }