User:Inductiveload/LibParamUi.js

/* * Simple UI for setting a set of parameters */

// For when loaded without ResourceLoader support mw.loader.using(	[ 'mediawiki.util', 'oojs-ui-core', 'oojs-ui-windows', 'oojs-ui-widgets' ] ).done( function {

'strict';

var ILUI; var debugSuffix = ''; var addGlobalLibrary = function ( key ) { if ( !window[ key ] ) { window[ key ] = {}; }

return window[ key ]; };

/* debug-replace: debugSuffix = '.debug'; */ ILUI = addGlobalLibrary( 'iltools.ui' + debugSuffix );

/* ======================================================================== */

/*	 * Add a dropdown menu with the given ID to the left or right navigation * bar in the Vector skin. *	 * If the dropdown exists, the existing one is returned. *	 * @param menuType: "dropdown" or "tabs" * @param leftSide: true to append to left, false for right *	 * @return The UL thatThethe user can append entries to	 */ ILUI.addVectorMenu = function ( id, title, menuType, leftSide ) {

var $portlet = $( '#' + id ), $nav, $linkList;

if ( $portlet.length === 0 ) {

$nav = $( ' ' ) .addClass( 'mw-portlet mw-portlet-views vector-menu' ) .addClass( ( menuType === 'dropdown' ) ? 'vector-menu-dropdown vector-menu-dropdown-noicon' : 'vector-menu-tabs' ) .attr( { role: 'navigation', id: id } );

if ( mw.config.get( 'skin' ) === 'vector-2022' || mw.config.get( 'skin' ) === 'vector' ) { $( ' ' )					.attr( {						type: 'checkbox'					} ) .addClass( 'vector-menu-checkbox' ) .appendTo( $nav ); }

$(' ')				.addClass('vector-menu-heading') .append(					$(' ')						.addClass('vector-menu-heading-label')						.text(title)				) .appendTo($nav);

$linkList = $( '' ) .addClass( 'vector-menu-content-list' );

$( ' ' )				.addClass( 'vector-menu-content' ) .appendTo( $nav ) .append( $linkList );

$( leftSide ? '#left-navigation' : '#right-navigation' ) .append( $nav );

return $linkList; }

return $portlet.find( 'ul' ); };

/* ===========================================================================  * GeneralParamsDialog: this is general dialog designed to make it easy to ask * the user for some parameters. *  * Basically, you pass in a list of "needs" and the dialog makes you a list of   * suitable input widgets and returns them to the callback you set on close. */

ILUI.GeneralParamsDialog = function ( config ) { ILUI.GeneralParamsDialog.super.call( this, config ); // mixin constructors // PrimaryActionOnEnterMixin.call(this); };	OO.inheritClass( ILUI.GeneralParamsDialog, OO.ui.ProcessDialog ); // OO.mixinClass(dialogs.GeneralParamsDialog, PrimaryActionOnEnterMixin);

// Specify a name for .addWindows ILUI.GeneralParamsDialog.static.name = 'GeneralParamsDialog'; // Specify a title statically (or, alternatively, with data passed to the opening method). // GeneralParamsDialog.static.title = 'Set parameters';

ILUI.GeneralParamsDialog.static.actions = [ {			action: 'save', label: 'Done', flags: [ 'primary' ] },		{			label: 'Cancel', flags: [ 'safe' ] }	];

ILUI.GeneralParamsDialog.prototype.addFieldFromNeed = function ( need ) { var input, fl, // most widgets can use this default valuefunc = function ( i ) { return i.getValue; };

switch ( need.type ) { case 'int': input = new OO.ui.NumberInputWidget( {					value: need.value,					step: 1				} ); valuefunc = function ( i ) { return i.getNumericValue; };				break; case 'bool': input = new OO.ui.CheckboxInputWidget( {					selected: need.value				} ); valuefunc = function ( i ) { return i.isSelected; };				break; // case 'page': // input = new PageLookupTextInputWidget( {			//      namespaces: need.namespaces,			//      user: mw.config.get( 'wgUserName' )			//      // placeholder: "Index:Filename.djvu"			//  } ); // break; case 'text': input = new OO.ui.TextInputWidget; break; case 'choice': input = new OO.ui.DropdownWidget( {					label: need.label,					menu: {						items: need.options.map( function ( c ) { return new OO.ui.MenuOptionWidget( {								data: c.data,								label: c.label							} ); } )					}				} );				valuefunc = function ( i ) { return i.getMenu.findSelectedItem.getData; };				break; // case 'contrib': // input = new ContribLookupTextInputWidget( {			//      user: need.user			//  } ); // break; default: mw.notify( 'Unknown type: ' + need.type, { type: 'error' } ); }

if ( input ) {

this.inputs.push( {				widget: input,				valuefunc: valuefunc			} );

fl = new OO.ui.FieldLayout( input, {				label: need.label,				help: need.help,				helpInline: false,				align: 'right'			} );

// disable help tabbing, which gets in the way a LOT fl.$element.find( '.oo-ui-fieldLayout-help a' ) .attr( 'tabindex', '-1' );

this.paramFieldset.addItems( [ fl ] ); }	};

// Customize the initialize function: This is where to add content to // the dialog body and set up event handlers. ILUI.GeneralParamsDialog.prototype.initialize = function { // Call the parent method. ILUI.GeneralParamsDialog.super.prototype.initialize.call( this );

this.inputs = []; this.paramFieldset = new OO.ui.FieldsetLayout( {			// label: 'GeneralParamsDialog Parameters',			classes: [ 'userjs-il_dialog_fs' ]		} ); this.$body.append( this.paramFieldset.$element ); };

ILUI.GeneralParamsDialog.prototype.getSetupProcess = function ( data ) { data = data || {}; return ILUI.GeneralParamsDialog.super.prototype.getSetupProcess.call( this, data ) .next( function {				var dialog = this,					need, i;

// if ( data.title ) { // dialog.title = "Foo"; // }

// Set up contents based on data for ( i = 0; i < data.needs.length; ++i ) {

need = data.needs[ i ];

dialog.addFieldFromNeed( need ); }

dialog.saveCallback = data.saveCallback; dialog.cancelCallback = data.cancelCallback; }, this );	};

ILUI.GeneralParamsDialog.prototype.getActionProcess = function ( action ) { var dialog = this; if ( action === 'save' ) { return new OO.ui.Process( function {

var params = [], i, acceptedPromise;

for ( i = 0; i < dialog.inputs.length; ++i ) { params.push( dialog.inputs[ i ].valuefunc( dialog.inputs[ i ].widget ) ); }

// dialog.actions.setMode( 'executing' ); acceptedPromise = dialog.saveCallback( params ); // close the dialog if the save callback accepted the parameters acceptedPromise .then( function {						// console.log( 'Accepted' );						dialog.close;					}, function  {						// console.log( 'Not accepted/failed' );						// save callback failed somehow						// alert( 'Cant save parameters, idk lol' );						// dialog.actions.setMode( 'can_execute' );					} ); } );		} else {			// just close the dialog			return new OO.ui.Process( function {

if ( dialog.cancelCallback ) { dialog.cancelCallback; }				dialog.close; } );		}	};

/* ======================================================================== */

} );