mediawiki-extensions-SyntaxHighlight_GeSHi/modules/ve-syntaxhighlight/ve.ui.MWSyntaxHighlightWindow.js

/*!
 * VisualEditor UserInterface MWSyntaxHighlightWindow class.
 *
 * @copyright VisualEditor Team and others
 * @license The MIT License (MIT); see LICENSE.txt
 */

/**
 * MediaWiki syntax highlight window.
 *
 * @class
 * @abstract
 *
 * @constructor
 */
ve.ui.MWSyntaxHighlightWindow = function VeUiMWSyntaxHighlightWindow() {
};

/* Inheritance */

OO.initClass( ve.ui.MWSyntaxHighlightWindow );

/* Static properties */

ve.ui.MWSyntaxHighlightWindow.static.title = OO.ui.deferMsg( 'syntaxhighlight-visualeditor-mwsyntaxhighlightinspector-title' );

ve.ui.MWSyntaxHighlightWindow.static.dir = 'ltr';

/* Methods */

/**
 * @inheritdoc
 */
ve.ui.MWSyntaxHighlightWindow.prototype.initialize = function () {
	const noneMsg = ve.msg( 'syntaxhighlight-visualeditor-mwsyntaxhighlightinspector-none' );

	this.languageValid = null;

	this.language = new OO.ui.ComboBoxInputWidget( {
		$overlay: this.$overlay,
		menu: {
			filterFromInput: true,
			items: ve.dm.MWSyntaxHighlightNode.static.getLanguages().map( ( lang ) => new OO.ui.MenuOptionWidget( { data: lang, label: lang || noneMsg } )
			)
		},
		validate: function ( input ) {
			return ve.dm.MWSyntaxHighlightNode.static.isLanguageSupported( input );
		}
	} );

	this.showLinesCheckbox = new OO.ui.CheckboxInputWidget();

	this.startLineNumber = new OO.ui.NumberInputWidget( {
		min: 0,
		isInteger: true,
		showButtons: false
	} );

	// Events
	this.language.connect( this, { change: 'onLanguageInputChange' } );
	this.showLinesCheckbox.connect( this, { change: 'onShowLinesCheckboxChange' } );
	this.startLineNumber.connect( this, { change: 'onStartLineNumberChange' } );

	this.languageField = new OO.ui.FieldLayout( this.language, {
		classes: [ 've-ui-mwSyntaxHighlightWindow-languageField' ],
		align: 'top',
		label: ve.msg( 'syntaxhighlight-visualeditor-mwsyntaxhighlightinspector-language' )
	} );
	this.codeField = new OO.ui.FieldLayout( this.input, {
		align: 'top',
		label: ve.msg( 'syntaxhighlight-visualeditor-mwsyntaxhighlightinspector-code' )
	} );
	this.showLinesField = new OO.ui.FieldLayout( this.showLinesCheckbox, {
		align: 'inline',
		label: ve.msg( 'syntaxhighlight-visualeditor-mwsyntaxhighlightinspector-showlines' )
	} );
	this.startLineField = new OO.ui.FieldLayout( this.startLineNumber, {
		classes: [ 've-ui-mwSyntaxHighlightWindow-startLineField' ],
		align: 'left',
		label: ve.msg( 'syntaxhighlight-visualeditor-mwsyntaxhighlightinspector-startingline' )
	} );
};

/**
 * Handle input change events
 *
 * @param {string} value New value
 */
ve.ui.MWSyntaxHighlightWindow.prototype.onLanguageInputChange = function () {
	const validity = this.language.getValidity();
	validity.always( () => {
		this.languageValid = validity.state() === 'resolved';
		this.updateActions();
	} );
};

/**
 * Handle change events from the show lines chechbox
 *
 * @param {boolean} value Widget value
 */
ve.ui.MWSyntaxHighlightWindow.prototype.onShowLinesCheckboxChange = function () {
	const showLines = this.showLinesCheckbox.isSelected();
	this.input.toggleLineNumbers( showLines );
	this.startLineNumber.setDisabled( !showLines );
	this.updateActions();
};

/**
 * Handle change events from the start line input
 *
 * @param {string} value Widget value
 */
ve.ui.MWSyntaxHighlightWindow.prototype.onStartLineNumberChange = function ( value ) {
	const input = this.input;

	input.loadingPromise.done( () => {
		input.editor.setOption( 'firstLineNumber', value !== '' ? +value : 1 );
	} ).always( () => {
		this.updateActions();
	} );
};

/**
 * @inheritdoc OO.ui.Window
 */
ve.ui.MWSyntaxHighlightWindow.prototype.getReadyProcess = function ( data, process ) {
	return process.next( () => {
		this.language.getMenu().toggle( false );
		if ( !this.language.getValue() ) {
			this.language.focus();
		} else {
			this.input.focus();
		}
	} );
};

/**
 * @inheritdoc OO.ui.Window
 */
ve.ui.MWSyntaxHighlightWindow.prototype.getSetupProcess = function ( data, process ) {
	return process.next( () => {
		const attrs = this.selectedNode ? this.selectedNode.getAttribute( 'mw' ).attrs : {},
			language = attrs.lang ? attrs.lang.toLowerCase() : '',
			showLines = attrs.line !== undefined,
			startLine = attrs.start,
			isReadOnly = this.isReadOnly();

		this.language.setValue( language ).setReadOnly( isReadOnly );

		this.showLinesCheckbox.setSelected( showLines ).setDisabled( isReadOnly );
		this.startLineNumber.setValue( startLine ).setReadOnly( isReadOnly );
	} );
};

/**
 * @inheritdoc OO.ui.Window
 */
ve.ui.MWSyntaxHighlightWindow.prototype.getTeardownProcess = function ( data, process ) {
	return process;
};

/**
 * @inheritdoc ve.ui.MWExtensionWindow
 */
ve.ui.MWSyntaxHighlightWindow.prototype.updateActions = function () {
	this.getActions().setAbilities( { done: this.languageValid && this.isModified() } );
};

/**
 * @inheritdoc ve.ui.MWExtensionWindow
 */
ve.ui.MWSyntaxHighlightWindow.prototype.updateMwData = function ( mwData ) {
	const language = this.language.getValue(),
		showLines = this.showLinesCheckbox.isSelected(),
		startLine = this.startLineNumber.getValue();

	mwData.attrs.lang = language || undefined;
	if ( !showLines ) {
		delete mwData.attrs.line;
	// Keep whatever value was there before to not cause dirty diffs
	} else if ( !( 'line' in mwData.attrs ) ) {
		mwData.attrs.line = '1';
	}
	mwData.attrs.start = startLine !== '' ? startLine : undefined;
};