Esanders has uploaded a new change for review.
https://gerrit.wikimedia.org/r/247851
Change subject: Introduce Ace editor widget
......................................................................
Introduce Ace editor widget
The widget attempts to load the ext.codeEditor.ace.modes module
and if it fails, will fall back to regular TextWidget behaviour.
Change-Id: Ie483f6eba25e3732a396c18decc0e1844b806b23
---
M extension.json
M modules/ve-mw/ui/ve.ui.MWExtensionWindow.js
A modules/ve-mw/ui/widgets/ve.ui.MWAceEditorWidget.js
3 files changed, 154 insertions(+), 2 deletions(-)
git pull ssh://gerrit.wikimedia.org:29418/mediawiki/extensions/VisualEditor
refs/changes/51/247851/1
diff --git a/extension.json b/extension.json
index 90d3dfc..4079952 100644
--- a/extension.json
+++ b/extension.json
@@ -965,6 +965,7 @@
"modules/ve-mw/ui/ve.ui.MWExtensionWindow.js",
"modules/ve-mw/ui/commands/ve.ui.MWWikitextWarningCommand.js",
"modules/ve-mw/ui/datatransferhandlers/ve.ui.MWWikitextStringTransferHandler.js",
+
"modules/ve-mw/ui/widgets/ve.ui.MWAceEditorWidget.js",
"modules/ve-mw/ui/widgets/ve.ui.MWTargetWidget.js",
"modules/ve-mw/ui/widgets/ve.ui.MWTocItemWidget.js",
"modules/ve-mw/ui/widgets/ve.ui.MWTocWidget.js",
diff --git a/modules/ve-mw/ui/ve.ui.MWExtensionWindow.js
b/modules/ve-mw/ui/ve.ui.MWExtensionWindow.js
index 9b47372..e9973a5 100644
--- a/modules/ve-mw/ui/ve.ui.MWExtensionWindow.js
+++ b/modules/ve-mw/ui/ve.ui.MWExtensionWindow.js
@@ -53,9 +53,9 @@
ve.ui.MWExtensionWindow.prototype.initialize = function () {
this.input = new ve.ui.WhitespacePreservingTextInputWidget( {
limit: 1,
- multiline: true
+ multiline: true,
+ classes: [ 've-ui-mwExtensionWindow-input' ]
} );
- this.input.$element.addClass( 've-ui-mwExtensionWindow-input' );
};
/**
diff --git a/modules/ve-mw/ui/widgets/ve.ui.MWAceEditorWidget.js
b/modules/ve-mw/ui/widgets/ve.ui.MWAceEditorWidget.js
new file mode 100644
index 0000000..c816d94
--- /dev/null
+++ b/modules/ve-mw/ui/widgets/ve.ui.MWAceEditorWidget.js
@@ -0,0 +1,151 @@
+/*!
+ * VisualEditor UserInterface MWAceEditorWidget class.
+ *
+ * @copyright 2011-2015 VisualEditor Team and others; see
http://ve.mit-license.org
+ */
+
+/* global ace, require */
+
+/**
+ * Text input widget which hides but preserves leading and trailing whitespace
+ *
+ * @class
+ * @extends ve.ui.WhitespacePreservingTextInputWidget
+ *
+ * @constructor
+ * @param {Object} [config] Configuration options
+ * @param {minLines} [minLines] Minimum number of lines to show, defaults to
none
+ * @param {maxLines} [maxLines=Infinity] Maxmimum number of lines to show,
defaults to infinitely auto-expanding
+ */
+ve.ui.MWAceEditorWidget = function VeUiMWAceEditorWidget( config ) {
+ // Configuration
+ config = config || {};
+
+ this.$ace = $( '<div dir="ltr">' );
+ this.editor = null;
+ // Initialise to a rejected promise for the setValue call in the parent
constructor
+ this.loadingPromise = $.Deferred().reject().promise();
+
+ // Parent constructor
+ ve.ui.MWAceEditorWidget.super.call( this, config );
+
+ this.minLines = config.minLines;
+ this.maxLines = config.maxLines || Infinity;
+
+ // Clear the fake loading promise and setup properly
+ this.loadingPromise = null;
+ this.setup();
+
+ this.$element
+ .append( this.$ace )
+ .addClass( 've-ui-mwAceEditorWidget' );
+};
+
+/* Inheritance */
+
+OO.inheritClass( ve.ui.MWAceEditorWidget,
ve.ui.WhitespacePreservingTextInputWidget );
+
+/* Events */
+
+/**
+ * The editor has resized
+ * @event resize
+ */
+
+/* Methods */
+
+/**
+ * Setup the Ace editor instance
+ */
+ve.ui.MWAceEditorWidget.prototype.setup = function () {
+ if ( !this.loadingPromise ) {
+ this.loadingPromise = mw.loader.moduleRegistry.hasOwnProperty(
'ext.codeEditor.ace.modes' ) ?
+ mw.loader.using( 'ext.codeEditor.ace.modes' ).then(
this.setupEditor.bind( this ) ) :
+ $.Deferred().reject().promise();
+ }
+};
+
+/**
+ * Destroy the Ace editor instance
+ */
+ve.ui.MWAceEditorWidget.prototype.teardown = function () {
+ var widget = this;
+ this.loadingPromise.done( function () {
+ widget.$input.removeClass( 'oo-ui-element-hidden' );
+ widget.editor.destroy();
+ widget.editor = null;
+ } ).always( function () {
+ widget.loadingPromise = null;
+ } );
+};
+
+/**
+ * Setup the Ace editor
+ */
+ve.ui.MWAceEditorWidget.prototype.setupEditor = function () {
+ this.$input.addClass( 'oo-ui-element-hidden' );
+ this.editor = ace.edit( this.$ace[ 0 ] );
+ this.editor.setOptions( {
+ maxLines: this.maxLines,
+ minLines: this.minLines
+ } );
+ this.editor.getSession().on( 'change', this.onEditorChange.bind( this )
);
+ this.editor.renderer.on( 'resize', this.emit.bind( this, 'resize' ) );
+ this.editor.resize();
+};
+
+/**
+ * @inheritdoc
+ */
+ve.ui.MWAceEditorWidget.prototype.setValue = function ( value ) {
+ var widget = this;
+ this.loadingPromise.done( function () {
+ widget.editor.setValue( value );
+ } ).fail( function () {
+ ve.ui.MWAceEditorWidget.super.prototype.setValue.call( widget,
value );
+ } );
+};
+
+/**
+ * Handle change events from the Ace editor
+ */
+ve.ui.MWAceEditorWidget.prototype.onEditorChange = function () {
+ // Call setValue on the parent to keep the value property in sync with
the editor
+ ve.ui.MWAceEditorWidget.super.prototype.setValue.call( this,
this.editor.getValue() );
+};
+
+/**
+ * Toggle the visibility of line numbers
+ *
+ * @param {boolean} visible Visible
+ */
+ve.ui.MWAceEditorWidget.prototype.toggleLineNumbers = function ( visible ) {
+ var widget = this;
+ this.loadingPromise.done( function () {
+ widget.editor.renderer.setShowGutter( visible );
+ } );
+};
+
+/**
+ * Set the language mode of the editor (programming language)
+ *
+ * @param {string} lang Language
+ */
+ve.ui.MWAceEditorWidget.prototype.setLanguage = function ( lang ) {
+ var widget = this;
+ this.loadingPromise.done( function () {
+ widget.editor.getSession().setMode( 'ace/mode/' + ( require(
'ace/mode/' + lang ) ? lang : 'text' ) );
+ } );
+};
+
+/**
+ * Focus the editor
+ */
+ve.ui.MWAceEditorWidget.prototype.focus = function () {
+ var widget = this;
+ this.loadingPromise.done( function () {
+ widget.editor.focus();
+ } ).fail( function () {
+ ve.ui.MWAceEditorWidget.super.prototype.focus.call( widget );
+ } );
+};
--
To view, visit https://gerrit.wikimedia.org/r/247851
To unsubscribe, visit https://gerrit.wikimedia.org/r/settings
Gerrit-MessageType: newchange
Gerrit-Change-Id: Ie483f6eba25e3732a396c18decc0e1844b806b23
Gerrit-PatchSet: 1
Gerrit-Project: mediawiki/extensions/VisualEditor
Gerrit-Branch: master
Gerrit-Owner: Esanders <[email protected]>
_______________________________________________
MediaWiki-commits mailing list
[email protected]
https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits
