User:Soumi150/OOUI-Demo.js

// User script to change title of page by taking input.

$( document ).ready( function {	mw.loader.using( 'oojs-ui-core' ).done( function  { var changeTitle = function ( config ) { // Configuration object config = config || {}; // Calling super constructor changeTitle.super.call( this, config );

this.input = new OO.ui.TextInputWidget( {				placeholder: 'Text here...'			} );

this.button = new OO.ui.ButtonWidget( {				label: ' Add Title ',				flags: [ 'primary', 'progressive' ]

} );

this.input.connect( this, { enter: 'onClick' } ); this.button.connect( this, { click: 'onClick' } );

this.$element.append(				this.input.$element.css( { width: '65%', display: 'inline-block' } ),				this.button.$element.css( { float: 'right' } )			);		};

OO.inheritClass( changeTitle, OO.ui.Widget );

changeTitle.prototype.onClick = function { $( '#firstHeading' ).text( this.input.getValue ).css( { color: 'blue' } ); };

// This creates an object of changeTitle class var inputWidget = new changeTitle,

beginButton = new OO.ui.PopupButtonWidget( {				label: 'Begin Here',				flags: [ 'primary', 'progressive' ],				popup: {					$content: inputWidget.$element,					padded: true				}			} );

$( '#mw-content-text' ) .append( beginButton.$element );

} ); } );