Allow users to choose math inspector or math dialog
The context item for math nodes now has two edit buttons, one for the inspector (edit inline) and one for the dialog (edit). Creating a new math node automatically opens the dialog. Bug: T120382 Change-Id: Icd3ec75262fcc5e0cbc304051c651278b0d8b01c
This commit is contained in:
parent
961944c3e3
commit
5fe280c3cf
|
@ -142,19 +142,23 @@
|
|||
"scripts": [
|
||||
"ve-math/ve.dm.MWMathNode.js",
|
||||
"ve-math/ve.ce.MWMathNode.js",
|
||||
"ve-math/ve.ui.MWMathInspector.js",
|
||||
"ve-math/ve.ui.MWMathContextItem.js",
|
||||
"ve-math/ve.ui.MWMathDialog.js",
|
||||
"ve-math/ve.ui.MWMathPage.js",
|
||||
"ve-math/ve.ui.MWMathInspectorTool.js"
|
||||
"ve-math/ve.ui.MWMathDialogTool.js"
|
||||
],
|
||||
"styles": [
|
||||
"ve-math/ve.ce.MWMathNode.css",
|
||||
"ve-math/ve.ui.MWMathIcons.css",
|
||||
"ve-math/ve.ui.MWMathInspector.css",
|
||||
"ve-math/ve.ui.MWMathDialog.css"
|
||||
],
|
||||
"dependencies": [
|
||||
"ext.visualEditor.mwcore"
|
||||
],
|
||||
"messages": [
|
||||
"math-visualeditor-mwmathcontextitem-quickedit",
|
||||
"math-visualeditor-mwmathdialog-title",
|
||||
"math-visualeditor-mwmathdialog-card-formula",
|
||||
"math-visualeditor-mwmathdialog-card-options",
|
||||
|
|
|
@ -18,6 +18,7 @@
|
|||
]
|
||||
},
|
||||
"math-desc": "Render mathematical formulas between <code><math></code> ... <code></math></code> tags",
|
||||
"math-visualeditor-mwmathcontextitem-quickedit": "Quick edit",
|
||||
"math-visualeditor-mwmathdialog-title": "Formula",
|
||||
"math-visualeditor-mwmathdialog-card-formula": "Formula",
|
||||
"math-visualeditor-mwmathdialog-card-options": "Options",
|
||||
|
|
|
@ -17,6 +17,7 @@
|
|||
]
|
||||
},
|
||||
"math-desc": "{{desc|name=Math|url=https://www.mediawiki.org/wiki/Extension:Math}}",
|
||||
"math-visualeditor-mwmathcontextitem-quickedit": "Label for the quick edit button in the math context item",
|
||||
"math-visualeditor-mwmathdialog-title": "Title for the dialog to edit <nowiki><math></nowiki> formula blocks.\n{{Identical|Formula}}",
|
||||
"math-visualeditor-mwmathdialog-card-formula": "Label for the formula card of the math dialog\n{{Identical|Formula}}",
|
||||
"math-visualeditor-mwmathdialog-card-options": "Label for the options card of the math dialog\n{{Identical|Options}}",
|
||||
|
|
|
@ -0,0 +1,64 @@
|
|||
/*!
|
||||
* VisualEditor MWMathContextItem class.
|
||||
*
|
||||
* @copyright 2015 VisualEditor Team and others; see http://ve.mit-license.org
|
||||
*/
|
||||
|
||||
/**
|
||||
* Context item for a math node.
|
||||
*
|
||||
* @class
|
||||
* @extends ve.ui.LinearContextItem
|
||||
*
|
||||
* @param {ve.ui.Context} context Context item is in
|
||||
* @param {ve.dm.Model} model Model item is related to
|
||||
* @param {Object} config Configuration options
|
||||
*/
|
||||
ve.ui.MWMathContextItem = function VeUiMWMathContextItem() {
|
||||
// Parent constructor
|
||||
ve.ui.MWMathContextItem.super.apply( this, arguments );
|
||||
|
||||
this.quickEditButton = new OO.ui.ButtonWidget( {
|
||||
label: ve.msg( 'math-visualeditor-mwmathcontextitem-quickedit' ),
|
||||
flags: [ 'progressive' ]
|
||||
} );
|
||||
|
||||
this.actionButtons.addItems( [ this.quickEditButton ], 0 );
|
||||
|
||||
this.quickEditButton.connect( this, { click: 'onInlineEditButtonClick' } );
|
||||
|
||||
// Initialization
|
||||
this.$element.addClass( 've-ui-mwMathContextItem' );
|
||||
};
|
||||
|
||||
/* Inheritance */
|
||||
|
||||
OO.inheritClass( ve.ui.MWMathContextItem, ve.ui.LinearContextItem );
|
||||
|
||||
/* Static Properties */
|
||||
|
||||
ve.ui.MWMathContextItem.static.name = 'math';
|
||||
|
||||
ve.ui.MWMathContextItem.static.icon = 'math';
|
||||
|
||||
ve.ui.MWMathContextItem.static.label = OO.ui.deferMsg( 'math-visualeditor-mwmathinspector-title' );
|
||||
|
||||
ve.ui.MWMathContextItem.static.modelClasses = [ ve.dm.MWMathNode ];
|
||||
|
||||
ve.ui.MWMathContextItem.static.embeddable = false;
|
||||
|
||||
ve.ui.MWMathContextItem.static.commandName = 'mathDialog';
|
||||
|
||||
/* Methods */
|
||||
|
||||
/**
|
||||
* Handle inline edit button click events.
|
||||
*/
|
||||
ve.ui.MWMathContextItem.prototype.onInlineEditButtonClick = function () {
|
||||
var command = ve.init.target.commandRegistry.lookup( 'mathInspector' );
|
||||
command.execute( this.context.getSurface() );
|
||||
};
|
||||
|
||||
/* Registration */
|
||||
|
||||
ve.ui.contextItemFactory.register( ve.ui.MWMathContextItem );
|
|
@ -27,7 +27,7 @@ OO.inheritClass( ve.ui.MWMathDialog, ve.ui.MWExtensionPreviewDialog );
|
|||
|
||||
/* Static properties */
|
||||
|
||||
ve.ui.MWMathDialog.static.name = 'math';
|
||||
ve.ui.MWMathDialog.static.name = 'mathDialog';
|
||||
|
||||
ve.ui.MWMathDialog.static.icon = 'math';
|
||||
|
||||
|
|
|
@ -0,0 +1,53 @@
|
|||
/*!
|
||||
* VisualEditor UserInterface MWMathDialogTool class.
|
||||
*
|
||||
* @copyright 2011-2015 VisualEditor Team and others; see AUTHORS.txt
|
||||
* @license The MIT License (MIT); see LICENSE.txt
|
||||
*/
|
||||
|
||||
/*global ve, OO */
|
||||
|
||||
/**
|
||||
* MediaWiki UserInterface math tool.
|
||||
*
|
||||
* @class
|
||||
* @extends ve.ui.DialogTool
|
||||
* @constructor
|
||||
* @param {OO.ui.ToolGroup} toolGroup
|
||||
* @param {Object} [config] Configuration options
|
||||
*/
|
||||
ve.ui.MWMathDialogTool = function VeUiMWMathDialogTool( toolGroup, config ) {
|
||||
ve.ui.MWMathDialogTool.super.call( this, toolGroup, config );
|
||||
};
|
||||
OO.inheritClass( ve.ui.MWMathDialogTool, ve.ui.DialogTool );
|
||||
ve.ui.MWMathDialogTool.static.name = 'math';
|
||||
ve.ui.MWMathDialogTool.static.group = 'object';
|
||||
ve.ui.MWMathDialogTool.static.icon = 'math';
|
||||
ve.ui.MWMathDialogTool.static.title = OO.ui.deferMsg(
|
||||
'math-visualeditor-mwmathinspector-title' );
|
||||
ve.ui.MWMathDialogTool.static.modelClasses = [ ve.dm.MWMathNode ];
|
||||
ve.ui.MWMathDialogTool.static.commandName = 'mathDialog';
|
||||
ve.ui.toolFactory.register( ve.ui.MWMathDialogTool );
|
||||
|
||||
ve.ui.commandRegistry.register(
|
||||
new ve.ui.Command(
|
||||
'mathDialog', 'window', 'open',
|
||||
{ args: [ 'mathDialog' ], supportedSelections: [ 'linear' ] }
|
||||
)
|
||||
);
|
||||
|
||||
ve.ui.commandRegistry.register(
|
||||
new ve.ui.Command(
|
||||
'mathInspector', 'window', 'open',
|
||||
{ args: [ 'mathInspector' ], supportedSelections: [ 'linear' ] }
|
||||
)
|
||||
);
|
||||
|
||||
ve.ui.sequenceRegistry.register(
|
||||
new ve.ui.Sequence( 'wikitextMath', 'mathDialog', '<math', 5 )
|
||||
);
|
||||
|
||||
ve.ui.commandHelpRegistry.register( 'insert', 'mathDialog', {
|
||||
sequences: [ 'wikitextMath' ],
|
||||
label: OO.ui.deferMsg( 'math-visualeditor-mwmathinspector-title' )
|
||||
} );
|
|
@ -0,0 +1,10 @@
|
|||
/*!
|
||||
* VisualEditor UserInterface MWMathInspector styles.
|
||||
*
|
||||
* @copyright 2011-2015 VisualEditor Team and others; see AUTHORS.txt
|
||||
* @license The MIT License (MIT); see LICENSE.txt
|
||||
*/
|
||||
|
||||
.ve-ui-mwMathInspector-content .ve-ui-mwExtensionWindow-input textarea {
|
||||
font-family: monospace, Courier;
|
||||
}
|
|
@ -0,0 +1,143 @@
|
|||
/*!
|
||||
* VisualEditor UserInterface MWMathInspector class.
|
||||
*
|
||||
* @copyright 2011-2015 VisualEditor Team and others; see AUTHORS.txt
|
||||
* @license The MIT License (MIT); see LICENSE.txt
|
||||
*/
|
||||
|
||||
/*global ve, OO */
|
||||
|
||||
/**
|
||||
* MediaWiki math inspector.
|
||||
*
|
||||
* @class
|
||||
* @extends ve.ui.MWLiveExtensionInspector
|
||||
*
|
||||
* @constructor
|
||||
* @param {Object} [config] Configuration options
|
||||
*/
|
||||
ve.ui.MWMathInspector = function VeUiMWMathInspector( config ) {
|
||||
// Parent constructor
|
||||
ve.ui.MWMathInspector.super.call( this, config );
|
||||
};
|
||||
|
||||
/* Inheritance */
|
||||
|
||||
OO.inheritClass( ve.ui.MWMathInspector, ve.ui.MWLiveExtensionInspector );
|
||||
|
||||
/* Static properties */
|
||||
|
||||
ve.ui.MWMathInspector.static.name = 'mathInspector';
|
||||
|
||||
ve.ui.MWMathInspector.static.icon = 'math';
|
||||
|
||||
ve.ui.MWMathInspector.static.title = OO.ui.deferMsg( 'math-visualeditor-mwmathinspector-title' );
|
||||
|
||||
ve.ui.MWMathInspector.static.modelClasses = [ ve.dm.MWMathNode ];
|
||||
|
||||
ve.ui.MWMathInspector.static.dir = 'ltr';
|
||||
|
||||
/* Methods */
|
||||
|
||||
/**
|
||||
* @inheritdoc
|
||||
*/
|
||||
ve.ui.MWMathInspector.prototype.initialize = function () {
|
||||
var inputField, displayField, idField;
|
||||
|
||||
// Parent method
|
||||
ve.ui.MWMathInspector.super.prototype.initialize.call( this );
|
||||
|
||||
this.displaySelect = new OO.ui.ButtonSelectWidget( {
|
||||
items: [
|
||||
new OO.ui.ButtonOptionWidget( {
|
||||
data: 'default',
|
||||
icon: 'math-display-default',
|
||||
label: ve.msg( 'math-visualeditor-mwmathinspector-display-default' )
|
||||
} ),
|
||||
new OO.ui.ButtonOptionWidget( {
|
||||
data: 'inline',
|
||||
icon: 'math-display-inline',
|
||||
label: ve.msg( 'math-visualeditor-mwmathinspector-display-inline' )
|
||||
} ),
|
||||
new OO.ui.ButtonOptionWidget( {
|
||||
data: 'block',
|
||||
icon: 'math-display-block',
|
||||
label: ve.msg( 'math-visualeditor-mwmathinspector-display-block' )
|
||||
} )
|
||||
]
|
||||
} );
|
||||
|
||||
this.idInput = new OO.ui.TextInputWidget();
|
||||
|
||||
inputField = new OO.ui.FieldLayout( this.input, {
|
||||
align: 'top',
|
||||
label: ve.msg( 'math-visualeditor-mwmathinspector-title' )
|
||||
} );
|
||||
displayField = new OO.ui.FieldLayout( this.displaySelect, {
|
||||
align: 'top',
|
||||
label: ve.msg( 'math-visualeditor-mwmathinspector-display' )
|
||||
} );
|
||||
idField = new OO.ui.FieldLayout( this.idInput, {
|
||||
align: 'top',
|
||||
label: ve.msg( 'math-visualeditor-mwmathinspector-id' )
|
||||
} );
|
||||
|
||||
// Initialization
|
||||
this.$content.addClass( 've-ui-mwMathInspector-content' );
|
||||
this.form.$element.append(
|
||||
inputField.$element,
|
||||
this.generatedContentsError.$element,
|
||||
displayField.$element,
|
||||
idField.$element
|
||||
);
|
||||
};
|
||||
|
||||
/**
|
||||
* @inheritdoc
|
||||
*/
|
||||
ve.ui.MWMathInspector.prototype.getSetupProcess = function ( data ) {
|
||||
return ve.ui.MWMathInspector.super.prototype.getSetupProcess.call( this, data )
|
||||
.next( function () {
|
||||
var display = this.selectedNode.getAttribute( 'mw' ).attrs.display || 'default';
|
||||
this.displaySelect.selectItemByData( display );
|
||||
this.displaySelect.on( 'choose', this.onChangeHandler );
|
||||
}, this );
|
||||
};
|
||||
|
||||
/**
|
||||
* @inheritdoc
|
||||
*/
|
||||
ve.ui.MWMathInspector.prototype.getTeardownProcess = function ( data ) {
|
||||
return ve.ui.MWMathInspector.super.prototype.getTeardownProcess.call( this, data )
|
||||
.first( function () {
|
||||
this.displaySelect.off( 'choose', this.onChangeHandler );
|
||||
}, this );
|
||||
};
|
||||
|
||||
/**
|
||||
* @inheritdoc
|
||||
*/
|
||||
ve.ui.MWMathInspector.prototype.updateMwData = function ( mwData ) {
|
||||
var display, id;
|
||||
|
||||
// Parent method
|
||||
ve.ui.MWMathInspector.super.prototype.updateMwData.call( this, mwData );
|
||||
|
||||
display = this.displaySelect.getSelectedItem().getData();
|
||||
id = this.idInput.getValue();
|
||||
|
||||
mwData.attrs.display = display !== 'default' ? display : undefined;
|
||||
mwData.attrs.id = id || undefined;
|
||||
};
|
||||
|
||||
/**
|
||||
* @inheritdoc
|
||||
*/
|
||||
ve.ui.MWMathInspector.prototype.formatGeneratedContentsError = function ( $element ) {
|
||||
return $element.text().trim();
|
||||
};
|
||||
|
||||
/* Registration */
|
||||
|
||||
ve.ui.windowFactory.register( ve.ui.MWMathInspector );
|
|
@ -1,46 +0,0 @@
|
|||
/*!
|
||||
* VisualEditor UserInterface MWMathInspectorTool class.
|
||||
*
|
||||
* @copyright 2011-2015 VisualEditor Team and others; see AUTHORS.txt
|
||||
* @license The MIT License (MIT); see LICENSE.txt
|
||||
*/
|
||||
|
||||
/*global ve, OO */
|
||||
|
||||
/**
|
||||
* MediaWiki UserInterface math tool.
|
||||
*
|
||||
* @class
|
||||
* @extends ve.ui.InspectorTool
|
||||
* @constructor
|
||||
* @param {OO.ui.ToolGroup} toolGroup
|
||||
* @param {Object} [config] Configuration options
|
||||
*/
|
||||
ve.ui.MWMathInspectorTool = function VeUiMWMathInspectorTool( toolGroup, config ) {
|
||||
ve.ui.MWMathInspectorTool.super.call( this, toolGroup, config );
|
||||
};
|
||||
OO.inheritClass( ve.ui.MWMathInspectorTool, ve.ui.InspectorTool );
|
||||
ve.ui.MWMathInspectorTool.static.name = 'math';
|
||||
ve.ui.MWMathInspectorTool.static.group = 'object';
|
||||
ve.ui.MWMathInspectorTool.static.icon = 'math';
|
||||
ve.ui.MWMathInspectorTool.static.title = OO.ui.deferMsg(
|
||||
'math-visualeditor-mwmathinspector-title' );
|
||||
ve.ui.MWMathInspectorTool.static.modelClasses = [ ve.dm.MWMathNode ];
|
||||
ve.ui.MWMathInspectorTool.static.commandName = 'math';
|
||||
ve.ui.toolFactory.register( ve.ui.MWMathInspectorTool );
|
||||
|
||||
ve.ui.commandRegistry.register(
|
||||
new ve.ui.Command(
|
||||
'math', 'window', 'open',
|
||||
{ args: [ 'math' ], supportedSelections: [ 'linear' ] }
|
||||
)
|
||||
);
|
||||
|
||||
ve.ui.sequenceRegistry.register(
|
||||
new ve.ui.Sequence( 'wikitextMath', 'math', '<math', 5 )
|
||||
);
|
||||
|
||||
ve.ui.commandHelpRegistry.register( 'insert', 'math', {
|
||||
sequences: [ 'wikitextMath' ],
|
||||
label: OO.ui.deferMsg( 'math-visualeditor-mwmathinspector-title' )
|
||||
} );
|
Loading…
Reference in New Issue