%PDF- %PDF-
| Direktori : /www/varak.net/wiki.varak.net/vendor/oojs/oojs-ui/demos/classes/ |
| Current File : /www/varak.net/wiki.varak.net/vendor/oojs/oojs-ui/demos/classes/MenuDialog.js |
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, expandField, menuPanel, contentPanel;
Demo.MenuDialog.parent.prototype.initialize.apply( this, arguments );
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'
}
);
expandField = new OO.ui.FieldLayout(
new OO.ui.ToggleSwitchWidget( { value: true } ).on( 'change', function ( value ) {
menuLayout.$element.toggleClass( 'oo-ui-menuLayout-expanded', value );
menuLayout.$element.toggleClass( 'oo-ui-menuLayout-static', !value );
menuPanel.$element.toggleClass( 'oo-ui-panelLayout-expanded', value );
contentPanel.$element.toggleClass( 'oo-ui-panelLayout-expanded', value );
} ),
{
label: 'Expand layout',
align: 'top'
}
);
menuPanel = new OO.ui.PanelLayout( { padded: true, expanded: true, scrollable: true } );
menuPanel.$element.append( 'Menu panel' );
contentPanel = new OO.ui.PanelLayout( { padded: true, expanded: true, scrollable: true } );
contentPanel.$element.append(
positionField.$element,
expandField.$element,
showField.$element
);
menuLayout = new OO.ui.MenuLayout( {
menuPanel: menuPanel,
contentPanel: contentPanel
} );
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 );
};