Resizable: Fix size/position changes in resize event

Fixes #10351
Closes gh-1292
This commit is contained in:
Scott González 2014-07-24 13:32:34 -04:00
parent 9bb51d308e
commit 5beae72e77
2 changed files with 58 additions and 23 deletions

View File

@ -146,6 +146,27 @@ test("resize (grid)", function() {
}); });
test( "resize, custom adjustment", function() {
expect( 4 );
var handle = ".ui-resizable-se",
element = $( "#resizable1" ).resizable({
resize: function( event, ui ) {
ui.size.width = 100;
ui.size.height = 200;
ui.position.left = 300;
ui.position.top = 400;
}
});
TestHelpers.resizable.drag( handle, 50, 50 );
equal( element.width(), 100, "resize event can control width" );
equal( element.height(), 200, "resize event can control height" );
equal( element.position().left, 300, "resize event can control left" );
equal( element.position().top, 400, "resize event can control top" );
});
test("stop", function() { test("stop", function() {
expect(5); expect(5);

View File

@ -321,22 +321,14 @@ $.widget("ui.resizable", $.ui.mouse, {
_mouseDrag: function(event) { _mouseDrag: function(event) {
var data, var data, props,
el = this.helper, props = {},
smp = this.originalMousePosition, smp = this.originalMousePosition,
a = this.axis, a = this.axis,
dx = (event.pageX-smp.left)||0, dx = (event.pageX-smp.left)||0,
dy = (event.pageY-smp.top)||0, dy = (event.pageY-smp.top)||0,
trigger = this._change[a]; trigger = this._change[a];
this.prevPosition = { this._updatePrevProperties();
top: this.position.top,
left: this.position.left
};
this.prevSize = {
width: this.size.width,
height: this.size.height
};
if (!trigger) { if (!trigger) {
return false; return false;
@ -355,26 +347,16 @@ $.widget("ui.resizable", $.ui.mouse, {
this._propagate("resize", event); this._propagate("resize", event);
if ( this.position.top !== this.prevPosition.top ) { props = this._applyChanges();
props.top = this.position.top + "px";
}
if ( this.position.left !== this.prevPosition.left ) {
props.left = this.position.left + "px";
}
if ( this.size.width !== this.prevSize.width ) {
props.width = this.size.width + "px";
}
if ( this.size.height !== this.prevSize.height ) {
props.height = this.size.height + "px";
}
el.css( props );
if ( !this._helper && this._proportionallyResizeElements.length ) { if ( !this._helper && this._proportionallyResizeElements.length ) {
this._proportionallyResize(); this._proportionallyResize();
} }
if ( !$.isEmptyObject( props ) ) { if ( !$.isEmptyObject( props ) ) {
this._updatePrevProperties();
this._trigger( "resize", event, this.ui() ); this._trigger( "resize", event, this.ui() );
this._applyChanges();
} }
return false; return false;
@ -423,6 +405,38 @@ $.widget("ui.resizable", $.ui.mouse, {
}, },
_updatePrevProperties: function() {
this.prevPosition = {
top: this.position.top,
left: this.position.left
};
this.prevSize = {
width: this.size.width,
height: this.size.height
};
},
_applyChanges: function() {
var props = {};
if ( this.position.top !== this.prevPosition.top ) {
props.top = this.position.top + "px";
}
if ( this.position.left !== this.prevPosition.left ) {
props.left = this.position.left + "px";
}
if ( this.size.width !== this.prevSize.width ) {
props.width = this.size.width + "px";
}
if ( this.size.height !== this.prevSize.height ) {
props.height = this.size.height + "px";
}
this.helper.css( props );
return props;
},
_updateVirtualBoundaries: function(forceAspectRatio) { _updateVirtualBoundaries: function(forceAspectRatio) {
var pMinWidth, pMaxWidth, pMinHeight, pMaxHeight, b, var pMinWidth, pMaxWidth, pMinHeight, pMaxHeight, b,
o = this.options; o = this.options;