MediaWiki 1.30.2

[autoinstallsdev/mediawiki.git] / vendor / oojs / oojs-ui / demos / classes / MenuDialog.js

diff --git a/vendor/oojs/oojs-ui/demos/classes/MenuDialog.js b/vendor/oojs/oojs-ui/demos/classes/MenuDialog.js
new file mode 100644 (file)
index 0000000..11759a8
--- /dev/null
+++ b/vendor/oojs/oojs-ui/demos/classes/MenuDialog.js
@@ -0,0 +1,77 @@
+Demo.MenuDialog = function DemoMenuDialog( config ) {
+       Demo.MenuDialog.parent.call( this, config );
+};
+OO.inheritClass( Demo.MenuDialog, OO.ui.ProcessDialog );
+Demo.MenuDialog.static.title = 'Menu dialog';
+Demo.MenuDialog.static.actions = [
+       { action: 'save', label: 'Done', flags: [ 'primary', 'progressive' ] },
+       { action: 'cancel', label: 'Cancel', flags: [ 'safe', 'back' ] }
+];
+Demo.MenuDialog.prototype.getBodyHeight = function () {
+       return 350;
+};
+Demo.MenuDialog.prototype.initialize = function () {
+       var menuLayout, positionField, showField, menuPanel, contentPanel;
+       Demo.MenuDialog.parent.prototype.initialize.apply( this, arguments );
+
+       menuLayout = new OO.ui.MenuLayout();
+       positionField = new OO.ui.FieldLayout(
+               new OO.ui.ButtonSelectWidget( {
+                       items: [
+                               new OO.ui.ButtonOptionWidget( {
+                                       data: 'before',
+                                       label: 'Before'
+                               } ),
+                               new OO.ui.ButtonOptionWidget( {
+                                       data: 'after',
+                                       label: 'After'
+                               } ),
+                               new OO.ui.ButtonOptionWidget( {
+                                       data: 'top',
+                                       label: 'Top'
+                               } ),
+                               new OO.ui.ButtonOptionWidget( {
+                                       data: 'bottom',
+                                       label: 'Bottom'
+                               } )
+                       ]
+               } ).on( 'select', function ( item ) {
+                       menuLayout.setMenuPosition( item.getData() );
+               } ),
+               {
+                       label: 'Menu position',
+                       align: 'top'
+               }
+       );
+       showField = new OO.ui.FieldLayout(
+               new OO.ui.ToggleSwitchWidget( { value: true } ).on( 'change', function ( value ) {
+                       menuLayout.toggleMenu( value );
+               } ),
+               {
+                       label: 'Show menu',
+                       align: 'top'
+               }
+       );
+       menuPanel = new OO.ui.PanelLayout( { padded: true, expanded: true, scrollable: true } );
+       contentPanel = new OO.ui.PanelLayout( { padded: true, expanded: true, scrollable: true } );
+
+       menuLayout.$menu.append(
+               menuPanel.$element.append( 'Menu panel' )
+       );
+       menuLayout.$content.append(
+               contentPanel.$element.append(
+                       positionField.$element,
+                       showField.$element
+               )
+       );
+
+       this.$body.append( menuLayout.$element );
+};
+Demo.MenuDialog.prototype.getActionProcess = function ( action ) {
+       if ( action ) {
+               return new OO.ui.Process( function () {
+                       this.close( { action: action } );
+               }, this );
+       }
+       return Demo.MenuDialog.parent.prototype.getActionProcess.call( this, action );
+};