mediawiki-extensions-Visual.../modules/syntaxhighlight/ve.ui.MWSyntaxHighlightDialog.js
Tongbo Sui 62ec9d92e2 SyntaxHighlight node support
Update: Switched to generic ve.ui.Toolbar and ve.ui.Tool for consistency
with VE in general. Changed searchbox to floating and hidden by default.
Call for search using shortcut key. Overriden ESC key.

Node handler for <syntaxhighlight>'s Rdfa type.
Embedded in VisualEditor.php with its own ResourceLoader module.
Use $wgVisualEditorEnableExperimentalCode in LocalSettings.php
to load the module.

Supported languages (for testing): text, javascript

Features:
(1) Internal mechanisms:
	(1.1) Tokenizer. Tokenize input code string.
	(1.2) Highlighter. Highlight based on predefined rules.
	(1.3) Syntax checker. Validate based on predefined rules.
(2) SimpleSurface:
	(2.1) Auto indenter. Works with (){}[] blocks.
	(2.2) Reformatter. Reformats spaces and remove trailing
	whitespaces.
	(2.3) Language selection dropdown.
	(2.4) Basic editing. Insert, deletion, selection.
	(2.5) Clipboard & edit history support.
		(2.5.1) Undo (Ctrl + Z), redo (Ctrl + Y)
		(2.5.2) Copy (Ctrl + C), cut (Ctrl + X), paste (Ctrl + V)
	(2.6) Search & replace. Ctrl + F to quickly move focus to search
	box.

Bug 47742

Change-Id: I4adede9e05fd2236cee50ce03f597e8ff6b1914d
2013-10-02 11:01:06 -07:00

105 lines
2.8 KiB
JavaScript

/*!
* VisualEditor user interface MWSyntaxHighlightDialog class.
*
* @copyright 2011-2013 VisualEditor Team and others; see AUTHORS.txt
* @license The MIT License (MIT); see LICENSE.txt
*/
/**
* Document dialog.
*
* @class
* @extends ve.ui.Dialog
*
* @constructor
* @param {ve.ui.Surface} surface
* @param {Object} [config] Config options
*/
ve.ui.MWSyntaxHighlightDialog = function VeUiMWSyntaxHighlightDialog( surface, config ) {
// Parent constructor
ve.ui.MWDialog.call( this, surface, config );
};
/* Inheritance */
ve.inheritClass( ve.ui.MWSyntaxHighlightDialog, ve.ui.MWDialog );
/* Static Properties */
ve.ui.MWSyntaxHighlightDialog.static.titleMessage = 'visualeditor-dialog-syntaxhighlight-title';
ve.ui.MWSyntaxHighlightDialog.static.icon = 'syntaxHighlight';
ve.ui.MWSyntaxHighlightDialog.static.name = 'mwSyntaxHighlight';
/* Methods */
/**
* Handle frame ready events.
*
* @method
*/
ve.ui.MWSyntaxHighlightDialog.prototype.initialize = function () {
// Call parent method
ve.ui.Dialog.prototype.initialize.call( this );
this.editPanel = new ve.ui.PanelLayout( {
'$$': this.frame.$$, 'scrollable': false, 'padded': false
} );
this.applyButton = new ve.ui.ButtonWidget( {
'$$': this.frame.$$, 'label': ve.msg( 'visualeditor-dialog-action-apply' ), 'flags': ['primary']
} );
this.applyButton.connect( this, { 'click': [ 'close', 'apply' ] } );
this.$body.append( this.editPanel.$ );
this.$foot.append( this.applyButton.$ );
};
/**
* Handle frame ready events.
*
* @method
*/
ve.ui.MWSyntaxHighlightDialog.prototype.onOpen = function () {
// Parent method
ve.ui.Dialog.prototype.onOpen.call( this );
// Properties
this.sourceNode = this.surface.getView().getFocusedNode();
this.sourceText = this.sourceNode.getModel().getAttribute( 'body' );
this.sourceLang = this.sourceNode.getModel().getAttribute( 'lang' );
this.editSurface = new ve.ui.MWSyntaxHighlightSimpleSurface( this.sourceText, this.sourceLang );
// Initialization
this.editPanel.$.append( this.editSurface.$ );
this.editSurface.initialize();
};
/**
* Handle frame ready events.
*
* @method
* @param {string} action Action that caused the window to be closed
*/
ve.ui.MWSyntaxHighlightDialog.prototype.onClose = function ( action ) {
var tx,
doc = this.surface.getModel().getDocument();
// Parent method
ve.ui.Dialog.prototype.onClose.call( this );
// Save changes via Transaction
if ( action === 'apply' ) {
tx = ve.dm.Transaction.newFromAttributeChanges(
doc,
this.sourceNode.getModel().getOffset(),
{
'body':this.editSurface.getModel(),
'lang':this.editSurface.getLang()
}
);
this.surface.getModel().change( tx );
}
// Cleanup
this.editSurface.destroy();
};
/* Registration */
ve.ui.dialogFactory.register( ve.ui.MWSyntaxHighlightDialog );