wikimedia/mediawiki-extensions-VisualEditor

View on GitHub
modules/ve-mw/ui/widgets/ve.ui.MWTransclusionOutlineControlsWidget.js

Summary

Maintainability
B
5 hrs
Test Coverage
/**
 * 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 );
};