Add support for display and ID attributes to VisualEditor
Change-Id: Ie65ff26c9e214f74b0217238a3def2242505d4c2
This commit is contained in:
Ed Sanders
Physikerwelt
parent
98b3992783
commit
70573daa0b
5
Math.php
5
Math.php
|
|
@ -519,6 +519,11 @@ $wgResourceModules['ext.math.visualEditor'] = array(
|
|||
'ext.visualEditor.mwcore',
|
||||
),
|
||||
'messages' => array(
|
||||
'math-visualeditor-mwmathinspector-display',
|
||||
'math-visualeditor-mwmathinspector-display-block',
|
||||
'math-visualeditor-mwmathinspector-display-default',
|
||||
'math-visualeditor-mwmathinspector-display-inline',
|
||||
'math-visualeditor-mwmathinspector-id',
|
||||
'math-visualeditor-mwmathinspector-title',
|
||||
),
|
||||
'targets' => array( 'desktop', 'mobile' ),
|
||||
|
|
|
|||
|
|
@ -7,6 +7,11 @@
|
|||
"math-preference-mwmathinspector-discussion-link": "https://www.mediawiki.org/wiki/Special:MyLanguage/Talk:VisualEditor/Beta_Features/Formulae",
|
||||
"math-preference-mwmathinspector-info-link": "https://www.mediawiki.org/wiki/Special:MyLanguage/VisualEditor/Beta_Features/Formulae",
|
||||
"math-preference-mwmathinspector-label": "VisualEditor formula editing",
|
||||
"math-visualeditor-mwmathinspector-display": "Display",
|
||||
"math-visualeditor-mwmathinspector-display-block": "Block",
|
||||
"math-visualeditor-mwmathinspector-display-default": "Default",
|
||||
"math-visualeditor-mwmathinspector-display-inline": "Inline",
|
||||
"math-visualeditor-mwmathinspector-id": "Link ID (optional)",
|
||||
"math-visualeditor-mwmathinspector-title": "Formula",
|
||||
"math_bad_output": "Cannot write to or create math output directory",
|
||||
"math_bad_tmpdir": "Cannot write to or create math temp directory",
|
||||
|
|
|
|||
|
|
@ -16,6 +16,11 @@
|
|||
"math-preference-mwmathinspector-discussion-link": "{{optional|Used on [[Special:Preferences]] as a link to a page where users can discuss this Beta Feature. Defaults to a page on MediaWiki.org.}}",
|
||||
"math-preference-mwmathinspector-info-link": "{{optional|Used on [[Special:Preferences]] as a link to a page where users can learn about this Beta Feature. Defaults to a page on MediaWiki.org.}}",
|
||||
"math-preference-mwmathinspector-label": "Used in [[Special:Preferences]].\n\nUsed as label for checkbox to enable editing of mathematical formulae in VisualEditor.\n\nThe description for this checkbox is:\n* {{msg-mw|Math-preference-mwmathinspector-description}}",
|
||||
"math-visualeditor-mwmathinspector-display": "Label for the display attribute of the math node",
|
||||
"math-visualeditor-mwmathinspector-display-block": "Label for the 'block' value of the display attribute",
|
||||
"math-visualeditor-mwmathinspector-display-default": "Label for the 'default' value of the display attribute",
|
||||
"math-visualeditor-mwmathinspector-display-inline": "Label for the 'inline' value of the display attribute",
|
||||
"math-visualeditor-mwmathinspector-id": "Label for the link ID attribute of the math node",
|
||||
"math-visualeditor-mwmathinspector-title": "Title for the inspector to edit <nowiki><math></nowiki> formula blocks.\n{{Identical|Formula}}",
|
||||
"math_bad_output": "Used as error message.\n\nThis message follows the message {{msg-mw|Math failure}}.",
|
||||
"math_bad_tmpdir": "Used as error message.\n\nThis message follows the message {{msg-mw|Math failure}}.",
|
||||
|
|
|
|||
|
|
@ -0,0 +1,7 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
|
||||
<g id="math-display-default">
|
||||
<path id="sigma" d="M 12.609,11.391 10.275186,16.004 15,16 l 0,-1 1,0 0,3 L 7.2711863,18 11,12 7.2711863,7 16,7 l 0,3 -1,0 0,-2 -4.728814,0" />
|
||||
<path id="text" d="m 3.5,19 17,0 c 0.277,0 0.5,0.223 0.5,0.5 0,0.277 -0.223,0.5 -0.5,0.5 l -17,0 C 3.223,20 3,19.777 3,19.5 3,19.223 3.223,19 3.5,19 z m 0,-14 17,0 C 20.777,5 21,5.223 21,5.5 21,5.777 20.777,6 20.5,6 L 3.5,6 C 3.223,6 3,5.777 3,5.5 3,5.223 3.223,5 3.5,5 z" />
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 609 B |
|
|
@ -0,0 +1,10 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
|
||||
<g id="math-display-default">
|
||||
<path id="sigma" d="M 12.609,11.391 10.275186,16.004 15,16 l 0,-1 1,0 0,3 L 7.2711866,18 11,12 7.2711866,7 16,7 l 0,3 -1,0 0,-2 -4.728814,0" />
|
||||
<path id="sum-to" d="m 13,20 c 0,0.552285 -0.447715,1 -1,1 -0.552285,0 -1,-0.447715 -1,-1 0,-0.552285 0.447715,-1 1,-1 0.552285,0 1,0.447715 1,1 z" />
|
||||
<path id="sum-from" d="m 13,5 c 0,0.5522847 -0.447715,1 -1,1 -0.552285,0 -1,-0.4477153 -1,-1 0,-0.5522847 0.447715,-1 1,-1 0.552285,0 1,0.4477153 1,1 z" />
|
||||
<path id="text-before" d="M 3,11.5 C 3,11.223 3.223,11 3.5,11 l 3,0 C 6.777,11 7,11.223 7,11.5 l 0,2 C 7,13.777 6.777,14 6.5,14 l -3,0 C 3.223,14 3,13.777 3,13.5 z" />
|
||||
<path id="text-after" d="M 17,11.5 C 17,11.223 17.223,11 17.5,11 l 3,0 c 0.277,0 0.5,0.223 0.5,0.5 l 0,2 c 0,0.277 -0.223,0.5 -0.5,0.5 l -3,0 C 17.223,14 17,13.777 17,13.5 z" />
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1010 B |
|
|
@ -0,0 +1,10 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
|
||||
<g id="math-display-inline">
|
||||
<path id="sigma" d="M 11.609,11.391 9.8551551,15.004 13,15 l 0,-1 1,0 0,3 L 7.2710001,17 10,12 7.2710001,8 14,8 l 0,3 -1,0 0,-2 -3.1488449,0" />
|
||||
<path id="sum-to" d="m 17,16 c 0,0.552285 -0.447715,1 -1,1 -0.552285,0 -1,-0.447715 -1,-1 0,-0.552285 0.447715,-1 1,-1 0.552285,0 1,0.447715 1,1 z" />
|
||||
<path id="sum-from" d="m 17,9 c 0,0.5522847 -0.447715,1 -1,1 -0.552285,0 -1,-0.4477153 -1,-1 0,-0.5522847 0.447715,-1 1,-1 0.552285,0 1,0.4477153 1,1 z" />
|
||||
<path id="text-before" d="M 3,11.5 C 3,11.223 3.223,11 3.5,11 l 3,0 c 0.277,0 0.5,0.223 0.5,0.5 l 0,2 C 7,13.777 6.777,14 6.5,14 l -3,0 C 3.223,14 3,13.777 3,13.5 z" />
|
||||
<path id="text-after" d="M 17,11.5 C 17,11.223 17.223,11 17.5,11 l 3,0 c 0.277,0 0.5,0.223 0.5,0.5 l 0,2 c 0,0.277 -0.223,0.5 -0.5,0.5 l -3,0 C 17.223,14 17,13.777 17,13.5 z" />
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1011 B |
|
|
@ -1,8 +1,6 @@
|
|||
<?xml version="1.0" encoding="iso-8859-1"?>
|
||||
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
|
||||
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="24px"
|
||||
height="24px" viewBox="0 0 24 24" style="enable-background:new 0 0 24 24;" xml:space="preserve">
|
||||
<g id="math">
|
||||
<path id="sigma" d="M 13.609,11.391 10.004,16.004 16,16 l 0,-1 1,0 0,3 -10,0 5,-6 -5,-6 10,0 0,3 -1,0 0,-2 -6,0 3.609,4.391" />
|
||||
</g>
|
||||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
|
||||
<g id="math">
|
||||
<path id="sigma" d="M 13.609,11.391 10.004,16.004 16,16 l 0,-1 1,0 0,3 -10,0 5,-6 -5,-6 10,0 0,3 -1,0 0,-2 -6,0 3.609,4.391" />
|
||||
</g>
|
||||
</svg>
|
||||
|
|
|
|||
|
Before Width: | Height: | Size: 527 B After Width: | Height: | Size: 293 B |
|
|
@ -2,3 +2,18 @@
|
|||
/* @embed */
|
||||
background-image: url(math.svg);
|
||||
}
|
||||
|
||||
.oo-ui-icon-math-display-block {
|
||||
/* @embed */
|
||||
background-image: url(math-display-block.svg);
|
||||
}
|
||||
|
||||
.oo-ui-icon-math-display-default {
|
||||
/* @embed */
|
||||
background-image: url(math-display-default.svg);
|
||||
}
|
||||
|
||||
.oo-ui-icon-math-display-inline {
|
||||
/* @embed */
|
||||
background-image: url(math-display-inline.svg);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -39,6 +39,104 @@ ve.ui.MWMathInspector.static.nodeModel = ve.dm.MWMathNode;
|
|||
|
||||
ve.ui.MWMathInspector.static.dir = 'ltr';
|
||||
|
||||
/* Methods */
|
||||
|
||||
/**
|
||||
* @inheritdoc
|
||||
*/
|
||||
ve.ui.MWMathInspector.prototype.initialize = function () {
|
||||
// Parent method
|
||||
ve.ui.MWMathInspector.super.prototype.initialize.call( this );
|
||||
|
||||
// Position
|
||||
this.displaySelect = new OO.ui.ButtonSelectWidget( {
|
||||
$: this.$,
|
||||
items: [
|
||||
new OO.ui.ButtonOptionWidget( {
|
||||
$: this.$,
|
||||
data: 'default',
|
||||
icon: 'math-display-default',
|
||||
label: ve.msg( 'math-visualeditor-mwmathinspector-display-default' )
|
||||
} ),
|
||||
new OO.ui.ButtonOptionWidget( {
|
||||
$: this.$,
|
||||
data: 'inline',
|
||||
icon: 'math-display-inline',
|
||||
label: ve.msg( 'math-visualeditor-mwmathinspector-display-inline' )
|
||||
} ),
|
||||
new OO.ui.ButtonOptionWidget( {
|
||||
$: this.$,
|
||||
data: 'block',
|
||||
icon: 'math-display-block',
|
||||
label: ve.msg( 'math-visualeditor-mwmathinspector-display-block' )
|
||||
} )
|
||||
]
|
||||
} );
|
||||
|
||||
this.idInput = new OO.ui.TextInputWidget( { $: this.$ } );
|
||||
|
||||
var inputField = new OO.ui.FieldLayout( this.input, {
|
||||
$: this.$,
|
||||
align: 'top',
|
||||
label: ve.msg( 'math-visualeditor-mwmathinspector-title' )
|
||||
} ),
|
||||
displayField = new OO.ui.FieldLayout( this.displaySelect, {
|
||||
$: this.$,
|
||||
align: 'top',
|
||||
label: ve.msg( 'math-visualeditor-mwmathinspector-display' )
|
||||
} ),
|
||||
idField = new OO.ui.FieldLayout( this.idInput, {
|
||||
$: this.$,
|
||||
align: 'top',
|
||||
label: ve.msg( 'math-visualeditor-mwmathinspector-id' )
|
||||
} );
|
||||
|
||||
// Initialization
|
||||
this.$content.addClass( 've-ui-mwMathInspector-content' );
|
||||
this.form.$element.append( inputField.$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.node.getAttribute( 'mw' ).attrs.display || 'default';
|
||||
this.displaySelect.selectItem( this.displaySelect.getItemFromData( display ) );
|
||||
this.displaySelect.on( 'choose', this.onChangeHandler );
|
||||
this.idInput.on( 'change', 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.idInput.off( 'change', this.onChangeHandler );
|
||||
}, this );
|
||||
};
|
||||
|
||||
/**
|
||||
* @inheritdoc
|
||||
*/
|
||||
ve.ui.MWMathInspector.prototype.updatePreview = function () {
|
||||
var mwData = ve.copy( this.node.getAttribute( 'mw' ) ),
|
||||
display = this.displaySelect.getSelectedItem().getData(),
|
||||
id = this.idInput.getValue();
|
||||
|
||||
mwData.body.extsrc = this.input.getValue();
|
||||
mwData.attrs.display = display !== 'default' ? display : undefined;
|
||||
mwData.attrs.id = id || undefined;
|
||||
|
||||
if ( this.visible ) {
|
||||
this.getFragment().changeAttributes( { mw: mwData } );
|
||||
}
|
||||
};
|
||||
|
||||
/* Registration */
|
||||
|
||||
ve.ui.windowFactory.register( ve.ui.MWMathInspector );
|
||||
|
|
|
|||
Loading…
Reference in New Issue