mirror of
https://gerrit.wikimedia.org/r/mediawiki/extensions/VisualEditor
synced 2024-11-12 09:09:25 +00:00
Merge "ve.ce.MWGalleryNode: Fix how 'mode', 'class', 'style' changes are applied"
This commit is contained in:
commit
0896917030
|
@ -33,8 +33,10 @@ ve.ce.MWGalleryNode = function VeCeMWGalleryNode() {
|
|||
// Events
|
||||
this.model.connect( this, { update: 'updateInvisibleIcon' } );
|
||||
this.model.connect( this, { update: 'onUpdate' } );
|
||||
this.model.connect( this, { attributeChange: 'onAttributeChange' } );
|
||||
|
||||
// Initialization
|
||||
this.$element.addClass( 'gallery' );
|
||||
this.onUpdate();
|
||||
};
|
||||
|
||||
|
@ -66,10 +68,9 @@ ve.ce.MWGalleryNode.prototype.onUpdate = function () {
|
|||
defaults = mw.config.get( 'wgVisualEditorConfig' ).galleryOptions;
|
||||
mode = mwAttrs.mode || defaults.mode;
|
||||
|
||||
this.$element
|
||||
.attr( 'class', mwAttrs.class )
|
||||
.attr( 'style', mwAttrs.style )
|
||||
.addClass( 'gallery mw-gallery-' + mode );
|
||||
// `.attr( …, undefined )` does nothing - it's required to use `null` to remove an attribute.
|
||||
// (This also clears the 'max-width', set below, if it's not needed.)
|
||||
this.$element.attr( 'style', mwAttrs.style || null );
|
||||
|
||||
if ( mwAttrs.perrow && ( mode === 'traditional' || mode === 'nolines' ) ) {
|
||||
// Magic 30 and 8 matches the code in ve.ce.MWGalleryImageNode
|
||||
|
@ -79,6 +80,35 @@ ve.ce.MWGalleryNode.prototype.onUpdate = function () {
|
|||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* Handle attribute changes to keep the live HTML element updated.
|
||||
*
|
||||
* @param {string} key Attribute name
|
||||
* @param {Mixed} from Old value
|
||||
* @param {Mixed} to New value
|
||||
*/
|
||||
ve.ce.MWGalleryNode.prototype.onAttributeChange = function ( key, from, to ) {
|
||||
var defaults = mw.config.get( 'wgVisualEditorConfig' ).galleryOptions;
|
||||
|
||||
if ( key !== 'mw' ) {
|
||||
return;
|
||||
}
|
||||
|
||||
if ( from.attrs.class !== to.attrs.class ) {
|
||||
// We can't overwrite the whole 'class' HTML attribute, because it also contains a class
|
||||
// generated from the 'mode' MW attribute, and VE internal classes like 've-ce-focusableNode'
|
||||
this.$element
|
||||
.removeClass( from.attrs.class )
|
||||
.addClass( to.attrs.class );
|
||||
}
|
||||
|
||||
if ( from.attrs.mode !== to.attrs.mode ) {
|
||||
this.$element
|
||||
.removeClass( 'mw-gallery-' + ( from.attrs.mode || defaults.mode ) )
|
||||
.addClass( 'mw-gallery-' + ( to.attrs.mode || defaults.mode ) );
|
||||
}
|
||||
};
|
||||
|
||||
/* Registration */
|
||||
|
||||
ve.ce.nodeFactory.register( ve.ce.MWGalleryNode );
|
||||
|
|
Loading…
Reference in a new issue