MediaWiki:Gadget-database-util.js

Note: After publishing, you may have to bypass your browser's cache to see the changes.

Firefox / Safari: Hold Shift while clicking Reload, or press either Ctrl-F5 or Ctrl-R (⌘-R on a Mac)
Google Chrome: Press Ctrl-Shift-R (⌘-Shift-R on a Mac)
Internet Explorer / Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5
Opera: Press Ctrl-F5.

( function ( $, mw ) {
	'use strict';
	
	mw.loader.using( ['oojs-ui-core', 'oojs-ui-widgets'] ).done( function() {
	
		/*
		 * QueryOptions
		 */
		function QueryOptions() {
			this.queryParams = {};
			this.paramWidgets = {};
			
			this.fieldset = new OO.ui.FieldsetLayout( {
			    label: 'Query options',
			    items: []
			} );
		}
		
		QueryOptions.prototype.addButtonGroup = function( param, fieldOptions, widgetOptions ) {
			var toggleButtons = widgetOptions.items.map( function ( item ) {
				var btn = new OO.ui.ButtonOptionWidget({
					data: item.data,
					label: item.label
				});
				
				return btn;
			} );
				
			var widget = new OO.ui.ButtonSelectWidget( {
				items: toggleButtons,
				align: widgetOptions.align || 'left',
				multiselect: widgetOptions.multiselect || false
			} );
			
			this.fieldset.addItems( [
				new OO.ui.FieldLayout( widget, {
					label: fieldOptions.label,
					align: fieldOptions.align || 'top'
				} )
			] );
		};
		
		QueryOptions.prototype.addButtonMultiselect = function( param, fieldOptions, widgetOptions ) {
			this.queryParams[param] = new pswiki.polyfill.Set();
			
			var paramVal = this.queryParams[param];
			
			var toggleButtons = widgetOptions.items.map( function( item ) {
				var btn = new OO.ui.ToggleButtonWidget( {
					label: item.label,
					value: item.value
				} );
				
				btn.on( 'change', function( selected ) {
					if ( selected ) {
						paramVal.add( item.label );
					} else {
						paramVal.delete( item.label );
					}
					console.log(paramVal.values());
				} );
				
				if ( item.value ) {
					paramVal.add( item.label );
				}
				
				return btn;
			} );
			
			var widget = new OO.ui.ButtonGroupWidget( {
				items: toggleButtons,
				align: widgetOptions.align || 'left'
			} );
			
			this.paramWidgets[ param ] = widget;
			
			this.fieldset.addItems( [
				new OO.ui.FieldLayout( widget, {
					label: fieldOptions.label,
					align: fieldOptions.align || 'top'
				} ),
			] );
			
		};
		
		QueryOptions.prototype.addCheckboxMultiselect = function( param, fieldOptions, widgetOptions ) {
			
		};
		
		QueryOptions.prototype.getOptions = function() {
			var opts = {};
			
			return opts;
		};
		
		/*
		 * DisplayOptions
		 */
		function DisplayOptions() {
			this.displayOptions = {};
			
			this.fieldset = new OO.ui.FieldsetLayout( {
			    label: 'Display options',
			    items: []
			} );
		}
		
		DisplayOptions.prototype.addColumnSelector = function( columns ) {
		
		};
		
		DisplayOptions.prototype.getOptions = function() {
			
		};
		
		
		function SearchWidget( config ) {
			this.fieldset = new OO.ui.FieldsetLayout();
			this.submitButton = new OO.ui.ButtonInputWidget( { 
				label: 'Search',
				flags: [ 'primary', 'progressive' ],
				align: 'left',
				icon: 'search'
			} );
			
			if ( config.queryOptions ) {
				this.fieldset.addItems( [
					config.queryOptions.fieldset
				] );
			}
			
			if ( config.displayOptions ) {
				this.fieldset.addItems( [
					config.displayOptions.fieldset
				] );
			}
			
			this.fieldset.addItems( [
		    	new OO.ui.FieldLayout( this.submitButton )
			] );
		}
		
		Object.preventExtensions( QueryOptions );
		Object.preventExtensions( DisplayOptions );
		Object.preventExtensions( SearchWidget );
		
		window.pswiki.dbUtil = {
			QueryOptions: QueryOptions,
			DisplayOptions: DisplayOptions,
			SearchWidget: SearchWidget
		};
		
	} );
} )( jQuery, mediaWiki );