modules/ve-mw/ui/widgets/ve.ui.MWTransclusionOutlineControlsWidget.js
/**
* Toolbar at the bottom of the template dialog sidebar. Provides buttons to
* reorder and delete top-level parts, and buttons to add templates or raw
* wikitext.
*
* When there is only one template in the transclusion, the sidebar may be
* hidden.
*
* @class
* @extends OO.ui.Widget
* @mixes OO.ui.mixin.GroupElement
*
* @constructor
*/
ve.ui.MWTransclusionOutlineControlsWidget = function OoUiOutlineControlsWidget() {
// Parent constructor
ve.ui.MWTransclusionOutlineControlsWidget.super.call( this );
// Mixin constructors
OO.ui.mixin.GroupElement.call( this );
// Properties
this.addTemplateButton = new OO.ui.ButtonWidget( {
framed: false,
icon: 'puzzle',
title: ve.msg( 'visualeditor-dialog-transclusion-add-template-button' )
} );
this.addWikitextButton = new OO.ui.ButtonWidget( {
framed: false,
icon: 'wikiText',
title: ve.msg( 'visualeditor-dialog-transclusion-add-wikitext' )
} );
this.upButton = new OO.ui.ButtonWidget( {
framed: false,
icon: 'upTriangle',
title: OO.ui.msg( 'ooui-outline-control-move-up' ),
disabled: true
} );
this.downButton = new OO.ui.ButtonWidget( {
framed: false,
icon: 'downTriangle',
title: OO.ui.msg( 'ooui-outline-control-move-down' ),
disabled: true
} );
this.removeButton = new OO.ui.ButtonWidget( {
framed: false,
icon: 'trash',
title: OO.ui.msg( 'ooui-outline-control-remove' ),
disabled: true
} );
// Events
this.addTemplateButton.connect( this, {
click: [ 'emit', 'addTemplate' ]
} );
this.addWikitextButton.connect( this, {
click: [ 'emit', 'addWikitext' ]
} );
this.upButton.connect( this, {
click: [ 'emit', 'move', -1 ]
} );
this.downButton.connect( this, {
click: [ 'emit', 'move', 1 ]
} );
this.removeButton.connect( this, {
click: [ 'emit', 'remove' ]
} );
// Initialization
this.$element.addClass( 've-ui-mwTransclusionOutlineControlsWidget' );
this.$group.addClass( 've-ui-mwTransclusionOutlineControlsWidget-items' )
.append(
this.addTemplateButton.$element,
this.addWikitextButton.$element
);
const $movers = $( '<div>' )
.addClass( 've-ui-mwTransclusionOutlineControlsWidget-movers' )
.append(
this.upButton.$element,
this.downButton.$element,
this.removeButton.$element
);
this.$element.append( this.$icon, this.$group, $movers );
};
/* Setup */
OO.inheritClass( ve.ui.MWTransclusionOutlineControlsWidget, OO.ui.Widget );
OO.mixinClass( ve.ui.MWTransclusionOutlineControlsWidget, OO.ui.mixin.GroupElement );
/* Events */
/**
* Emitted when the "Add template" button in the toolbar is clicked
*
* @event ve.ui.MWTransclusionOutlineControlsWidget#addTemplate
*/
/**
* Emitted when the "Add wikitext" button in the toolbar is clicked
*
* @event ve.ui.MWTransclusionOutlineControlsWidget#addWikitext
*/
/**
* Emitted when one of the two "Move item up/down" buttons in the toolbar is clicked
*
* @event ve.ui.MWTransclusionOutlineControlsWidget#move
* @param {number} places Number of places to move, typically -1 or 1
*/
/**
* Emitted when the "Remove item" button in the toolbar is clicked
*
* @event ve.ui.MWTransclusionOutlineControlsWidget#remove
*/
/* Methods */
/**
* Change buttons
*
* @param {Object} states List of abilities with canMoveUp, canMoveDown and canBeDeleted
* @param {boolean} states.canMoveUp Allow moving item up
* @param {boolean} states.canMoveDown Allow moving item down
* @param {boolean} states.canBeDeleted Allow removing removable item
*/
ve.ui.MWTransclusionOutlineControlsWidget.prototype.setButtonsEnabled = function ( states ) {
this.upButton.setDisabled( !states.canMoveUp );
this.downButton.setDisabled( !states.canMoveDown );
this.removeButton.setDisabled( !states.canBeDeleted );
};