MediaWiki:Gadget-database-util.js

( function ( $, mw, psw ) {
	'use strict';

	/*
	 * QueryOptions
	 */
	function QueryOptions () {
		this.queryParams = {};
		this.getters = {};
		
		this.fieldset = new OO.ui.FieldsetLayout( {
		    label: 'Query options',
		    items: []
		} );
	}
	
	QueryOptions.prototype.addButtonMultiInput = function ( param, fieldOptions, widgetOptions ) {
		var toggleButtons = widgetOptions.items.map( function ( item ) {
			var btn = new OO.ui.ButtonOptionWidget( {
				data: item.data || item.label,
				label: item.label
			} );
			
			return btn;
		} );
			
		var widget = new OO.ui.ButtonSelectWidget( {
			items: toggleButtons,
			align: widgetOptions.align || 'left',
			multiselect: widgetOptions.multiselect || false
		} );
		
		if ( Array.isArray( widgetOptions.selected ) ) {
			widgetOptions.selected.forEach( function ( label ) {
				widget.selectItemByLabel( label );
			} );
		} else if ( typeof widgetOptions.selected === 'string' ) {
			widget.selectItemByLabel( widgetOptions.selected );
		}
		
		this.fieldset.addItems( [
			new OO.ui.FieldLayout( widget, {
				label: fieldOptions.label,
				align: fieldOptions.align || 'top'
			} )
		] );
		
		this.getters[ param ] = function () {
			var selected = widget.findSelectedItems();
			
			if ( Array.isArray( selected ) ) {
				return selected
					.map( function ( item ) { 
						return item.getData();
					} )
					.join(widgetOptions.delimiter || ',');
			} else if ( selected !== null ) {
				return selected.getData();
			}
			
			return '';
		};
	};
	
	QueryOptions.prototype.addCheckboxInput = function ( param, fieldOptions, widgetOptions ) {
		var widget = new OO.ui.CheckboxInputWidget( {
	        selected: widgetOptions.selected || false
		} );
		
		this.fieldset.addItems( [
			new OO.ui.FieldLayout( widget, {
				label: fieldOptions.label,
				align: fieldOptions.align || 'inline'
			} )
		] );
		
		this.getters[ param ] = function () {
			var selected = widget.isSelected();
			
			if ( selected ) {
				return widgetOptions.dataTrue;
			}
			
			return widgetOptions.dataFalse;
		};
	};
	
	QueryOptions.prototype.addCheckboxMultiInput = function ( param, fieldOptions, widgetOptions ) {
		
	};
	
	QueryOptions.prototype.addDateInput = function ( param, fieldOptions, widgetOptions ) {
		var widget = new mw.widgets.DateInputWidget( {
			type: 'date'
		} );
		
		this.fieldset.addItems( [
			new OO.ui.FieldLayout( widget, {
				label: fieldOptions.label,
				align: fieldOptions.align || 'top'
			} )
		] );
		
		this.getters[ param ] = function () {
			return widget.getValue();
		};
	};
	
	QueryOptions.prototype.addNumberInput = function ( param, fieldOptions, widgetOptions ) {
		var widget = new OO.ui.NumberInputWidget( {
			min: widgetOptions.min,
			max: widgetOptions.max,
			buttonStep: widgetOptions.buttonStep,
			pageStep: widgetOptions.pageStep,
			showButtons: widgetOptions.showButtons
		} );
		
		this.fieldset.addItems( [
			new OO.ui.FieldLayout( widget, {
				label: fieldOptions.label,
				align: fieldOptions.align || 'top'
			} )
		] );
		
		this.getters[ param ] = function () {
			return widget.getValue();
		};
	};
	
	QueryOptions.prototype.getOptions = function () {
		var opts = {};
		
		for ( var key in this.getters ) {
			opts[ key ] = this.getters[ key ]();
		}
		
		return opts;
	};
	
	/*
	 * DisplayOptions
	 */
	function DisplayOptions () {
		this.displayOptions = {};
		this.getters = {};
		
		this.fieldset = new OO.ui.FieldsetLayout( {
		    label: 'Display options',
		    items: []
		} );
	}
	
	DisplayOptions.prototype.addColumnSelector = function ( columns, fieldOptions ) {
		var items = columns.map( function (column) {
			return new OO.ui.CheckboxMultioptionWidget( {
				data: column.name,
				selected: column.selected,
				label: column.label
			} );
		} );
		
		var widget = new OO.ui.CheckboxMultiselectWidget( {
			items: items
		} );
		
		this.fieldset.addItems( [
			new OO.ui.FieldLayout( widget, {
				label: 'Visible columns',
				align: fieldOptions.align || 'top'
			} )
		] );
		
		this.getters[ 'columns' ] = function () {
			return widget.findSelectedItemsData();
		};
	};
	
	DisplayOptions.prototype.getOptions = function () {
		var opts = {};
		
		for ( var key in this.getters ) {
			opts[ key ] = this.getters[ key ]();
		}
		
		return opts;
	};
	
	
	function SearchWidget ( optionConfig, searchConfig ) {
		this.api = new mw.Api();
		
		this.fieldset = new OO.ui.FieldsetLayout();
		
		this.submitButton = new OO.ui.ButtonInputWidget( { 
			label: 'Search',
			flags: [ 'primary', 'progressive' ],
			align: 'left',
			icon: 'search'
		} );
		this.submitButton.on( 'click', this.search.bind( this ) );
		
		if ( optionConfig.queryOptions ) {
			this.queryOptions = optionConfig.queryOptions;
			this.fieldset.addItems( [
				optionConfig.queryOptions.fieldset
			] );
		}
		
		if ( optionConfig.displayOptions ) {
			this.displayOptions = optionConfig.displayOptions;
			this.fieldset.addItems( [
				optionConfig.displayOptions.fieldset
			] );
		}
		
		this.fieldset.addItems( [
	    	new OO.ui.FieldLayout( this.submitButton )
		] );
		
		this.tableSelector = searchConfig.selector;
		this.template      = searchConfig.template;
	}
	
	SearchWidget.prototype.search = function () {
		const params = [];
		
		if ( this.queryOptions ) {
			const options = this.queryOptions.getOptions();
			for ( var key in options ) {
				params.push( '|' + key + ' = ' + options[ key ] );
			}
		}
		
		if ( this.displayOptions ) {
			const options = this.displayOptions.getOptions();
			for ( var key in options ) {
				params.push( '|' + key + ' = ' + options[ key ] );
			}
		}

		var text = '{' + '{' +
			this.template + '\n' + 
			params.join('\n') + 
			'\n}}';
		console.log( text );
			
		var selector = this.tableSelector;
		
		$( selector ).html( 'Searching...' );
		
		this.api.get( {
			action: 'parse',
			title: mw.config.get( 'wgPageName' ),
			prop: 'text',
			text: text,
			maxage: 3600,
			smaxage: 3600
		} ).done( function( results ) {
			$( selector ).empty()
				.append( $( results.parse.text[ '*' ] ) );
			$( selector + ' table' ).tablesorter();
		} );
	};
	
	Object.preventExtensions( QueryOptions );
	Object.preventExtensions( DisplayOptions );
	Object.preventExtensions( SearchWidget );
	
	psw.db = {
		QueryOptions: QueryOptions,
		DisplayOptions: DisplayOptions,
		SearchWidget: SearchWidget
	};
		
} )( jQuery, mediaWiki, pswiki );