Tchanders has uploaded a new change for review.

  https://gerrit.wikimedia.org/r/257261

Change subject: WIP Allow users to choose math inspector or math dialog
......................................................................

WIP 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
---
M extension.json
M i18n/en.json
M i18n/qqq.json
A modules/ve-math/ve.ui.MWMathContextItem.js
M modules/ve-math/ve.ui.MWMathDialog.js
A modules/ve-math/ve.ui.MWMathDialogTool.js
A modules/ve-math/ve.ui.MWMathInspector.css
A modules/ve-math/ve.ui.MWMathInspector.js
D modules/ve-math/ve.ui.MWMathInspectorTool.js
9 files changed, 283 insertions(+), 48 deletions(-)


  git pull ssh://gerrit.wikimedia.org:29418/mediawiki/extensions/Math 
refs/changes/61/257261/1

diff --git a/extension.json b/extension.json
index 20d87fe..117563e 100644
--- a/extension.json
+++ b/extension.json
@@ -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-editinline",
                                "math-visualeditor-mwmathdialog-title",
                                "math-visualeditor-mwmathdialog-card-formula",
                                "math-visualeditor-mwmathdialog-card-options",
diff --git a/i18n/en.json b/i18n/en.json
index a4e2bc0..b2cf398 100644
--- a/i18n/en.json
+++ b/i18n/en.json
@@ -18,6 +18,7 @@
                ]
        },
        "math-desc": "Render mathematical formulas between 
<code>&lt;math&gt;</code> ... <code>&lt;/math&gt;</code> tags",
+       "math-visualeditor-mwmathcontextitem-editinline": "Edit inline",
        "math-visualeditor-mwmathdialog-title": "Formula",
        "math-visualeditor-mwmathdialog-card-formula": "Formula",
        "math-visualeditor-mwmathdialog-card-options": "Options",
diff --git a/i18n/qqq.json b/i18n/qqq.json
index 46a7294..64434e0 100644
--- a/i18n/qqq.json
+++ b/i18n/qqq.json
@@ -17,6 +17,7 @@
                ]
        },
        "math-desc": 
"{{desc|name=Math|url=https://www.mediawiki.org/wiki/Extension:Math}}";,
+       "math-visualeditor-mwmathcontextitem-editinline": "Label for the edit 
inline 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}}",
diff --git a/modules/ve-math/ve.ui.MWMathContextItem.js 
b/modules/ve-math/ve.ui.MWMathContextItem.js
new file mode 100644
index 0000000..183575e
--- /dev/null
+++ b/modules/ve-math/ve.ui.MWMathContextItem.js
@@ -0,0 +1,69 @@
+/*!
+ * VisualEditor MWMathContextItem class.
+ *
+ * @copyright 2015 VisualEditor Team and others; see http://ve.mit-license.org
+ */
+
+/**
+ * Context item for a link.
+ *
+ * @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.editInlineButton = new OO.ui.ButtonWidget( {
+               label: ve.msg( 'math-visualeditor-mwmathcontextitem-editinline' 
),
+               flags: [ 'progressive' ]
+       } );
+
+       this.actionButtons.addItems( [ this.editInlineButton ], 0 );
+
+       this.editInlineButton.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 */
+
+// /**
+//  * @inheritdoc
+//  */
+// ve.ui.MWMathContextItem.prototype.getDescription = function () {
+//     return this.model.getAttribute( 'mw' ).body.extsrc;
+// };
+
+// Add documentation
+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 );
diff --git a/modules/ve-math/ve.ui.MWMathDialog.js 
b/modules/ve-math/ve.ui.MWMathDialog.js
index 7c42fea..74964f3 100644
--- a/modules/ve-math/ve.ui.MWMathDialog.js
+++ b/modules/ve-math/ve.ui.MWMathDialog.js
@@ -27,7 +27,7 @@
 
 /* Static properties */
 
-ve.ui.MWMathDialog.static.name = 'math';
+ve.ui.MWMathDialog.static.name = 'mathDialog';
 
 ve.ui.MWMathDialog.static.icon = 'math';
 
diff --git a/modules/ve-math/ve.ui.MWMathDialogTool.js 
b/modules/ve-math/ve.ui.MWMathDialogTool.js
new file mode 100644
index 0000000..8e11818
--- /dev/null
+++ b/modules/ve-math/ve.ui.MWMathDialogTool.js
@@ -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', 'math', '<math', 5 )
+);
+
+ve.ui.commandHelpRegistry.register( 'insert', 'math', {
+       sequences: [ 'wikitextMath' ],
+       label: OO.ui.deferMsg( 'math-visualeditor-mwmathinspector-title' )
+} );
diff --git a/modules/ve-math/ve.ui.MWMathInspector.css 
b/modules/ve-math/ve.ui.MWMathInspector.css
new file mode 100644
index 0000000..387b3b9
--- /dev/null
+++ b/modules/ve-math/ve.ui.MWMathInspector.css
@@ -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;
+}
diff --git a/modules/ve-math/ve.ui.MWMathInspector.js 
b/modules/ve-math/ve.ui.MWMathInspector.js
new file mode 100644
index 0000000..ef1704d
--- /dev/null
+++ b/modules/ve-math/ve.ui.MWMathInspector.js
@@ -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 );
diff --git a/modules/ve-math/ve.ui.MWMathInspectorTool.js 
b/modules/ve-math/ve.ui.MWMathInspectorTool.js
deleted file mode 100644
index dc65dfb..0000000
--- a/modules/ve-math/ve.ui.MWMathInspectorTool.js
+++ /dev/null
@@ -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' )
-} );

-- 
To view, visit https://gerrit.wikimedia.org/r/257261
To unsubscribe, visit https://gerrit.wikimedia.org/r/settings

Gerrit-MessageType: newchange
Gerrit-Change-Id: Icd3ec75262fcc5e0cbc304051c651278b0d8b01c
Gerrit-PatchSet: 1
Gerrit-Project: mediawiki/extensions/Math
Gerrit-Branch: master
Gerrit-Owner: Tchanders <thalia.e.c...@googlemail.com>

_______________________________________________
MediaWiki-commits mailing list
MediaWiki-commits@lists.wikimedia.org
https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits

Reply via email to