mediawiki-extensions-Visual.../modules/ve-mw/ui/inspectors/ve.ui.MWMathInspector.js
Trevor Parscal 37240aca59 Math Node UI
Show an inspector with inputwidget when the user clicks a math
node. The data of the math equation is shown in the
edit box, it can re-render the math tag image when
the inspector is closed, and save the change when
saving the page.

TODO:
* Change the icon from link to math
* Translate title by translatewiki in i18n
* Other further UI improvements

Change-Id: I4d7533af25186cc39cc4bc6a4326d222ffd6db19
2013-07-07 07:32:11 +00:00

96 lines
2.2 KiB
JavaScript

/*!
* VisualEditor UserInterface MWMathInspector class.
*
* @copyright 2011-2013 VisualEditor Team and others; see AUTHORS.txt
* @license The MIT License (MIT); see LICENSE.txt
*/
/**
* MediaWiki math inspector.
*
* @class
* @extends ve.ui.Inspector
*
* @constructor
* @param {ve.ui.Surface} surface
* @param {Object} [config] Config options
*/
ve.ui.MWMathInspector = function VeUiMWMathInspector( surface, config ) {
// Parent constructor
ve.ui.Inspector.call( this, surface, config );
};
/* Inheritance */
ve.inheritClass( ve.ui.MWMathInspector, ve.ui.Inspector );
/* Static properties */
ve.ui.MWMathInspector.static.icon = 'link';
ve.ui.MWMathInspector.static.titleMessage = 'visualeditor-mwmathinspector-title';
ve.ui.MWMathInspector.static.InputWidget = ve.ui.InputWidget;
/* Methods */
/**
* Handle frame ready events.
*
* @method
*/
ve.ui.MWMathInspector.prototype.initialize = function () {
// Parent method
ve.ui.Inspector.prototype.initialize.call( this );
this.input = new this.constructor.static.InputWidget( {
'$$': this.frame.$$, 'overlay': this.surface.$localOverlay
} );
// Initialization
this.$form.append( this.input.$ );
};
/**
* Handle the inspector being opened.
*/
ve.ui.MWMathInspector.prototype.onOpen = function () {
var src = this.surface.getView().getFocusedNode().getModel().getAttribute( 'extsrc' );
// Parent method
ve.ui.Inspector.prototype.onOpen.call( this );
// Wait for animation to complete
setTimeout( ve.bind( function () {
// Setup input text
this.input.setValue( src );
this.input.$input.focus().select();
}, this ), 200 );
};
/**
* Handle the inspector being closed.
*
* @param {string} action Action that caused the window to be closed
*/
ve.ui.MWMathInspector.prototype.onClose = function ( action ) {
// Parent method
ve.ui.Inspector.prototype.onClose.call( this, action );
var newsrc = this.input.getValue(),
surfaceModel = this.surface.getModel(),
mathNode = this.surface.getView().getFocusedNode().getModel();
surfaceModel.change(
ve.dm.Transaction.newFromAttributeChanges(
surfaceModel.getDocument(), mathNode.getOuterRange().start, { 'extsrc': newsrc }
)
);
};
/* Registration */
ve.ui.inspectorFactory.register( 'mwMathInspector', ve.ui.MWMathInspector );