diff --git a/VisualEditor.php b/VisualEditor.php index 1b610d100d..0c3c1883cb 100644 --- a/VisualEditor.php +++ b/VisualEditor.php @@ -413,6 +413,8 @@ $wgResourceModules += array( 've/ce/nodes/ve.ce.TableSectionNode.js', 've/ce/nodes/ve.ce.TextNode.js', + 've-mw/ce/ve.ce.MWResizableNode.js', + 've-mw/ce/nodes/ve.ce.MWEntityNode.js', 've-mw/ce/nodes/ve.ce.MWHeadingNode.js', 've-mw/ce/nodes/ve.ce.MWPreformattedNode.js', diff --git a/modules/ve-mw/ce/nodes/ve.ce.MWBlockImageNode.js b/modules/ve-mw/ce/nodes/ve.ce.MWBlockImageNode.js index 5811fa105a..e52dfbc3c1 100644 --- a/modules/ve-mw/ce/nodes/ve.ce.MWBlockImageNode.js +++ b/modules/ve-mw/ce/nodes/ve.ce.MWBlockImageNode.js @@ -11,6 +11,9 @@ * @class * @extends ve.ce.BranchNode * @mixins ve.ce.ProtectedNode + * @mixins ve.ce.FocusableNode + * @mixins ve.ce.RelocatableNode + * @mixins ve.ce.MWResizableNode * * @constructor * @param {ve.dm.MWBlockImageNode} model Model to observe @@ -26,7 +29,7 @@ ve.ce.MWBlockImageNode = function VeCeMWBlockImageNode( model, config ) { ve.ce.ProtectedNode.call( this ); ve.ce.FocusableNode.call( this ); ve.ce.RelocatableNode.call( this ); - ve.ce.ResizableNode.call( this ); + ve.ce.MWResizableNode.call( this ); type = this.model.getAttribute( 'type' ); @@ -94,8 +97,11 @@ ve.mixinClass( ve.ce.MWBlockImageNode, ve.ce.FocusableNode ); ve.mixinClass( ve.ce.MWBlockImageNode, ve.ce.RelocatableNode ); +// Need to mixin base class as well ve.mixinClass( ve.ce.MWBlockImageNode, ve.ce.ResizableNode ); +ve.mixinClass( ve.ce.MWBlockImageNode, ve.ce.MWResizableNode ); + /* Static Properties */ ve.ce.MWBlockImageNode.static.name = 'mwBlockImage'; diff --git a/modules/ve-mw/ce/nodes/ve.ce.MWInlineImageNode.js b/modules/ve-mw/ce/nodes/ve.ce.MWInlineImageNode.js index f3731631f6..56818a280f 100644 --- a/modules/ve-mw/ce/nodes/ve.ce.MWInlineImageNode.js +++ b/modules/ve-mw/ce/nodes/ve.ce.MWInlineImageNode.js @@ -1,5 +1,5 @@ /*! - * VisualEditor ContentEditable MWEntityNode class. + * VisualEditor ContentEditable MWInlineImageNode class. * * @copyright 2011-2013 VisualEditor Team and others; see AUTHORS.txt * @license The MIT License (MIT); see LICENSE.txt @@ -10,6 +10,9 @@ * * @class * @extends ve.ce.LeafNode + * @mixins ve.ce.ProtectedNode + * @mixins ve.ce.FocusableNode + * @mixins ve.ce.RelocatableNode * * @constructor * @param {ve.dm.MWInlineImageNode} model Model to observe diff --git a/modules/ve-mw/ce/ve.ce.MWResizableNode.js b/modules/ve-mw/ce/ve.ce.MWResizableNode.js new file mode 100644 index 0000000000..0426e9fe4c --- /dev/null +++ b/modules/ve-mw/ce/ve.ce.MWResizableNode.js @@ -0,0 +1,41 @@ +/*! + * VisualEditor ContentEditable MWResizableNode class. + * + * @copyright 2011-2013 VisualEditor Team and others; see AUTHORS.txt + * @license The MIT License (MIT); see LICENSE.txt + */ + +/** + * ContentEditable MediaWiki resizable node. + * + * @class + * @abstract + * @extends {ve.ce.ResizableNode} + * + * @constructor + * @param {jQuery} [$resizable=this.$] Resizable DOM element + */ +ve.ce.MWResizableNode = function VeCeMwResizableNode( $resizable ) { + ve.ce.ResizableNode.call( this, $resizable ); +}; + +/* Inheritance */ + +ve.inheritClass( ve.ce.MWResizableNode, ve.ce.ResizableNode ); + +/** + * Generate an object of attributes changes from the new width and height. + * + * If either property changes, clear the defaultSize flag. + * + * @param {number} width New image width + * @param {number} height New image height + * @returns {Object} Attribute changes + */ +ve.ce.MWResizableNode.prototype.getAttributeChanges = function ( width, height ) { + var attrChanges = ve.ce.ResizableNode.prototype.getAttributeChanges.call( this, width, height ); + if ( !ve.isEmptyObject( attrChanges ) ) { + attrChanges.defaultSize = false; + } + return attrChanges; +}; \ No newline at end of file diff --git a/modules/ve-mw/dm/nodes/ve.dm.MWInlineImageNode.js b/modules/ve-mw/dm/nodes/ve.dm.MWInlineImageNode.js index 923f52e385..43c23f925a 100644 --- a/modules/ve-mw/dm/nodes/ve.dm.MWInlineImageNode.js +++ b/modules/ve-mw/dm/nodes/ve.dm.MWInlineImageNode.js @@ -1,5 +1,5 @@ /*! - * VisualEditor DataModel MWEntityNode class. + * VisualEditor DataModel MWInlineImage class. * * @copyright 2011-2013 VisualEditor Team and others; see AUTHORS.txt * @license The MIT License (MIT); see LICENSE.txt diff --git a/modules/ve-mw/test/index.php b/modules/ve-mw/test/index.php index c30f5624d4..8e4b725b5c 100644 --- a/modules/ve-mw/test/index.php +++ b/modules/ve-mw/test/index.php @@ -180,6 +180,7 @@ + diff --git a/modules/ve/ce/ve.ce.ResizableNode.js b/modules/ve/ce/ve.ce.ResizableNode.js index aa8e8fb831..62cea43ad9 100644 --- a/modules/ve/ce/ve.ce.ResizableNode.js +++ b/modules/ve/ce/ve.ce.ResizableNode.js @@ -258,25 +258,20 @@ ve.ce.ResizableNode.prototype.onDocumentMouseMove = function ( e ) { * @method */ ve.ce.ResizableNode.prototype.onDocumentMouseUp = function () { - var offset = this.model.getOffset(), + var attrChanges, + offset = this.model.getOffset(), width = this.$resizeHandles.outerWidth(), height = this.$resizeHandles.outerHeight(), surfaceModel = this.getRoot().getSurface().getModel(), documentModel = surfaceModel.getDocument(), - selection = surfaceModel.getSelection(), - attrChanges = {}; + selection = surfaceModel.getSelection(); this.$resizeHandles.removeClass( 've-ui-resizableNode-handles-resizing' ); $( this.getElementDocument() ).off( '.ve-ce-resizableNode' ); this.resizing = false; // Apply changes to the model - if ( this.model.getAttribute( 'width' ) !== width ) { - attrChanges.width = width; - } - if ( this.model.getAttribute( 'height' ) !== height ) { - attrChanges.height = height; - } + attrChanges = this.getAttributeChanges( width, height ); if ( !ve.isEmptyObject( attrChanges ) ) { surfaceModel.change( ve.dm.Transaction.newFromAttributeChanges( documentModel, offset, attrChanges ), @@ -286,3 +281,21 @@ ve.ce.ResizableNode.prototype.onDocumentMouseUp = function () { this.emit( 'resize' ); }; + +/** + * Generate an object of attributes changes from the new width and height. + * + * @param {number} width New image width + * @param {number} height New image height + * @returns {Object} Attribute changes + */ +ve.ce.ResizableNode.prototype.getAttributeChanges = function ( width, height ) { + var attrChanges = {}; + if ( this.model.getAttribute( 'width' ) !== width ) { + attrChanges.width = width; + } + if ( this.model.getAttribute( 'height' ) !== height ) { + attrChanges.height = height; + } + return attrChanges; +}; \ No newline at end of file