Pengguna:Kenrick95/idwp-gpu.js

function IdwpGpuHelper(action) {
	mw.loader.using('oojs-ui', function() {
		var windowManager = new OO.ui.WindowManager();

        var input = [];
        input[0] = new OO.ui.TextInputWidget( { 
        	placeholder: 'Contoh.jpg'
        } );
        input[1] = new OO.ui.TextInputWidget( { 
        	placeholder: 'Contoh nama berkas'
        } );
        input[2] = new OO.ui.TextInputWidget( { 
        	placeholder: 'Deskripsi contoh nama berkas, bla bla bla...'
        } );
	 
        // Create a FieldsetLayout.
        var fieldset = new OO.ui.FieldsetLayout( { 
        label: 'Formulir untuk mengusulkan gambar pilihan di periode XX tahun XXXX',
        classes: [ "container" ]
        } );
	 
        // Use the addItems() method to add FieldLayouts that contain the form 
        // elements (the text inputs and submit button) to the FieldsetLayout:
        fieldset.addItems( [ 
        new OO.ui.FieldLayout( input[0], {
            label: 'Nama berkas (tanpa awalan "Berkas:")', 
            align: 'top' 
        } ),
        new OO.ui.FieldLayout( input[1], { 
            label: 'Deskripsi singkat (tanpa markah wiki)',
            align: 'top' 
        } ),
        new OO.ui.FieldLayout( input[2], { 
            label: 'Deskripsi panjang (memperbolehkan markah wiki)',
            align: 'top' 
        } )
        ] );
        // /w/api.php?action=opensearch&format=json&search=example&namespace=6&suggest=1
        // https://www.mediawiki.org/wiki/OOjs_UI/Windows/Process_Dialogs
	 
        // Add the FieldsetLayout to a FormLayout. 
        var form = new OO.ui.FormLayout(  {
        	items: [ fieldset ]
        } );

		// Subclass ProcessDialog.
        function ProcessDialog( config ) {
            ProcessDialog.super.call( this, config );
        }
        OO.inheritClass( ProcessDialog, OO.ui.ProcessDialog );

        // Specify a static title and actions.
        ProcessDialog.static.title = 'Pengusulan Gambar Pilihan';
        ProcessDialog.static.actions = [
    		{ action: 'save', label: 'Selesai', flags: 'primary' },
        	{ label: 'Batal', flags: 'safe' }
        ];

        // Use the initialize() method to add content to the dialog's $body, 
        // to initialize widgets, and to set up event handlers. 
        ProcessDialog.prototype.initialize = function () {
        ProcessDialog.super.prototype.initialize.apply( this, arguments );

        this.content = new OO.ui.PanelLayout( { $: this.$, padded: true, expanded: false } );
        this.content.$element.append( form.$element );
            
        this.$body.append( this.content.$element );    
        };

        // Use the getActionProcess() method to specify a process to handle the 
        // actions (for the 'save' action, in this example).
        ProcessDialog.prototype.getActionProcess = function ( action ) {
        	
	        var dialog = this;
	        if ( action ) {
	            return new OO.ui.Process( function () {
        			console.log(dialog);
        			console.log(action);
        			console.log(input[0].getValue());
        			console.log(input[1].getValue());
        			console.log(input[2].getValue());
	            	dialog.close( { action: action } );
	            } );
	        }
	        // Fallback to parent handler.
	        return ProcessDialog.super.prototype.getActionProcess.call( this, action );
        };

        // Get dialog height.
        ProcessDialog.prototype.getBodyHeight = function () {
        	return this.content.$element.outerHeight( true );
        };

        // Create and append the window manager.
        $( 'body' ).append( windowManager.$element );

        // Create a new dialog window.
        var processDialog = new ProcessDialog({
        size: 'small'
        });

        // Add windows to window manager using the addWindows() method.
        windowManager.addWindows( [ processDialog ] );

        // Open the window.
        windowManager.openWindow( processDialog );
		processDialog.setSize("large");
	});
}
//Belum mengerjakan apa-apa
//$(IdwpGpuHelper);