mirror of
https://github.com/jquery/jquery-ui.git
synced 2025-01-07 20:34:24 +00:00
Dialog: Move array notation support for position option to backCompat check. Fixes #8824 - Deprecate array notation for position option.
This commit is contained in:
Jörn Zaefferer
parent
6dccd917c3
commit
9fe3a62d80
@ -15,6 +15,7 @@ var versions = {
|
||||
"Core": "core/core.html",
|
||||
"Datepicker": "datepicker/datepicker.html",
|
||||
"Dialog": "dialog/dialog.html",
|
||||
"Dialog_deprecated": "dialog/dialog_deprecated.html",
|
||||
"Draggable": "draggable/draggable.html",
|
||||
"Droppable": "droppable/droppable.html",
|
||||
"Effects": "effects/effects.html",
|
||||
|
||||
@ -22,6 +22,7 @@
|
||||
"core/core.html",
|
||||
"datepicker/datepicker.html",
|
||||
"dialog/dialog.html",
|
||||
"dialog/dialog_deprecated.html",
|
||||
"draggable/draggable.html",
|
||||
"droppable/droppable.html",
|
||||
"effects/effects.html",
|
||||
|
||||
@ -5,6 +5,9 @@
|
||||
<title>jQuery UI Dialog Test Suite</title>
|
||||
|
||||
<script src="../../jquery.js"></script>
|
||||
<script>
|
||||
$.uiBackCompat = false;
|
||||
</script>
|
||||
<link rel="stylesheet" href="../../../external/qunit.css">
|
||||
<script src="../../../external/qunit.js"></script>
|
||||
<script src="../../jquery.simulate.js"></script>
|
||||
|
||||
62
tests/unit/dialog/dialog_deprecated.html
Normal file
62
tests/unit/dialog/dialog_deprecated.html
Normal file
@ -0,0 +1,62 @@
|
||||
<!doctype html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>jQuery UI Dialog Test Suite</title>
|
||||
|
||||
<script src="../../jquery.js"></script>
|
||||
<link rel="stylesheet" href="../../../external/qunit.css">
|
||||
<script src="../../../external/qunit.js"></script>
|
||||
<script src="../../jquery.simulate.js"></script>
|
||||
<script src="../testsuite.js"></script>
|
||||
<script>
|
||||
TestHelpers.loadResources({
|
||||
css: [ "ui.core", "ui.dialog" ],
|
||||
js: [
|
||||
"ui/jquery.ui.core.js",
|
||||
"ui/jquery.ui.widget.js",
|
||||
"ui/jquery.ui.position.js",
|
||||
"ui/jquery.ui.mouse.js",
|
||||
"ui/jquery.ui.draggable.js",
|
||||
"ui/jquery.ui.resizable.js",
|
||||
"ui/jquery.ui.button.js",
|
||||
"ui/jquery.ui.dialog.js"
|
||||
]
|
||||
});
|
||||
</script>
|
||||
|
||||
<script src="dialog_common.js"></script>
|
||||
<script src="dialog_core.js"></script>
|
||||
<script src="dialog_events.js"></script>
|
||||
<script src="dialog_methods.js"></script>
|
||||
<script src="dialog_options.js"></script>
|
||||
<script src="dialog_test_helpers.js"></script>
|
||||
<script src="dialog_tickets.js"></script>
|
||||
<script src="dialog_deprecated.js"></script>
|
||||
|
||||
<script src="../swarminject.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<h1 id="qunit-header">jQuery UI Dialog Test Suite</h1>
|
||||
<h2 id="qunit-banner"></h2>
|
||||
<div id="qunit-testrunner-toolbar"></div>
|
||||
<h2 id="qunit-userAgent"></h2>
|
||||
<ol id="qunit-tests"></ol>
|
||||
<div id="qunit-fixture">
|
||||
<div id="dialog1"></div>
|
||||
<div id="dialog2"></div>
|
||||
<div id="form-dialog" title="Profile Information">
|
||||
<fieldset>
|
||||
<legend>Please share some personal information</legend>
|
||||
<label for="favorite-animal">Your favorite animal</label><input id="favorite-animal">
|
||||
<label for="favorite-color">Your favorite color</label><input id="favorite-color">
|
||||
</fieldset>
|
||||
<div role="group" aria-describedby="section2">
|
||||
<p id="section2">Some more (optional) information</p>
|
||||
<label for="favorite-food">Favorite food</label><input id="favorite-food">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
23
tests/unit/dialog/dialog_deprecated.js
Normal file
23
tests/unit/dialog/dialog_deprecated.js
Normal file
@ -0,0 +1,23 @@
|
||||
module("dialog (deprecated): position opton with array");
|
||||
|
||||
if ( !$.ui.ie ) {
|
||||
test("position, right bottom on window w/array", function() {
|
||||
expect( 2 );
|
||||
var el = $('<div></div>').dialog({ position: ["right", "bottom"] }),
|
||||
dialog = el.dialog('widget'),
|
||||
offset = dialog.offset();
|
||||
closeEnough(offset.left, $(window).width() - dialog.outerWidth() + $(window).scrollLeft(), 1);
|
||||
closeEnough(offset.top, $(window).height() - dialog.outerHeight() + $(window).scrollTop(), 1);
|
||||
el.remove();
|
||||
});
|
||||
}
|
||||
|
||||
test("position, offset from top left w/array", function() {
|
||||
expect( 2 );
|
||||
var el = $('<div></div>').dialog({ position: [10, 10] }),
|
||||
dialog = el.dialog('widget'),
|
||||
offset = dialog.offset();
|
||||
closeEnough(offset.left, 10 + $(window).scrollLeft(), 1);
|
||||
closeEnough(offset.top, 10 + $(window).scrollTop(), 1);
|
||||
el.remove();
|
||||
});
|
||||
@ -331,16 +331,6 @@ if ( !$.ui.ie ) {
|
||||
el.remove();
|
||||
});
|
||||
|
||||
test("position, right bottom on window w/array", function() {
|
||||
expect( 2 );
|
||||
var el = $('<div></div>').dialog({ position: ["right", "bottom"] }),
|
||||
dialog = el.dialog('widget'),
|
||||
offset = dialog.offset();
|
||||
closeEnough(offset.left, $(window).width() - dialog.outerWidth() + $(window).scrollLeft(), 1);
|
||||
closeEnough(offset.top, $(window).height() - dialog.outerHeight() + $(window).scrollTop(), 1);
|
||||
el.remove();
|
||||
});
|
||||
|
||||
test("position, right bottom at right bottom via ui.position args", function() {
|
||||
expect( 2 );
|
||||
var el = $('<div></div>').dialog({
|
||||
@ -359,16 +349,6 @@ if ( !$.ui.ie ) {
|
||||
|
||||
}
|
||||
|
||||
test("position, offset from top left w/array", function() {
|
||||
expect( 2 );
|
||||
var el = $('<div></div>').dialog({ position: [10, 10] }),
|
||||
dialog = el.dialog('widget'),
|
||||
offset = dialog.offset();
|
||||
closeEnough(offset.left, 10 + $(window).scrollLeft(), 1);
|
||||
closeEnough(offset.top, 10 + $(window).scrollTop(), 1);
|
||||
el.remove();
|
||||
});
|
||||
|
||||
test("position, at another element", function() {
|
||||
expect( 4 );
|
||||
var parent = $('<div></div>').css({
|
||||
|
||||
80
ui/jquery.ui.dialog.js
vendored
80
ui/jquery.ui.dialog.js
vendored
@ -211,7 +211,7 @@ $.widget("ui.dialog", {
|
||||
this.opener = $( this.document[ 0 ].activeElement );
|
||||
|
||||
this._size();
|
||||
this._position( this.options.position );
|
||||
this._position();
|
||||
if ( this.options.modal ) {
|
||||
this.overlay = new $.ui.dialog.overlay( this );
|
||||
}
|
||||
@ -500,38 +500,24 @@ $.widget("ui.dialog", {
|
||||
}
|
||||
},
|
||||
|
||||
_position: function( position ) {
|
||||
var myAt = [],
|
||||
offset = [ 0, 0 ],
|
||||
_position: function() {
|
||||
var position = this.options.position,
|
||||
myAt = [],
|
||||
isVisible;
|
||||
|
||||
if ( position ) {
|
||||
// TODO we don't support 1.3.2 anymore, clean this mess up
|
||||
// deep extending converts arrays to objects in jQuery <= 1.3.2 :-(
|
||||
// if (typeof position == 'string' || $.isArray(position)) {
|
||||
// myAt = $.isArray(position) ? position : position.split(' ');
|
||||
|
||||
if ( typeof position === "string" || (typeof position === "object" && "0" in position ) ) {
|
||||
myAt = position.split ? position.split( " " ) : [ position[ 0 ], position[ 1 ] ];
|
||||
if ( typeof position === "string" ) {
|
||||
myAt = position.split( " " );
|
||||
if ( myAt.length === 1 ) {
|
||||
myAt[ 1 ] = myAt[ 0 ];
|
||||
}
|
||||
|
||||
$.each( [ "left", "top" ], function( i, offsetPosition ) {
|
||||
if ( +myAt[ i ] === myAt[ i ] ) {
|
||||
offset[ i ] = myAt[ i ];
|
||||
myAt[ i ] = offsetPosition;
|
||||
}
|
||||
});
|
||||
|
||||
position = {
|
||||
my: myAt[0] + (offset[0] < 0 ? offset[0] : "+" + offset[0]) + " " +
|
||||
myAt[1] + (offset[1] < 0 ? offset[1] : "+" + offset[1]),
|
||||
my: myAt[0] + " " + myAt[1],
|
||||
at: myAt.join( " " )
|
||||
};
|
||||
position = $.extend( {}, $.ui.dialog.prototype.options.position, position );
|
||||
}
|
||||
|
||||
position = $.extend( {}, $.ui.dialog.prototype.options.position, position );
|
||||
} else {
|
||||
position = $.ui.dialog.prototype.options.position;
|
||||
}
|
||||
@ -610,7 +596,7 @@ $.widget("ui.dialog", {
|
||||
}
|
||||
|
||||
if ( key === "position" ) {
|
||||
this._position( value );
|
||||
this._position();
|
||||
}
|
||||
|
||||
if ( key === "resizable" ) {
|
||||
@ -744,4 +730,52 @@ $.extend( $.ui.dialog.overlay.prototype, {
|
||||
}
|
||||
});
|
||||
|
||||
// DEPRECATED
|
||||
if ( $.uiBackCompat !== false ) {
|
||||
// position option with array notation
|
||||
// just override with old implementation
|
||||
$.ui.dialog.prototype._position = function() {
|
||||
var position = this.options.position,
|
||||
myAt = [],
|
||||
offset = [ 0, 0 ],
|
||||
isVisible;
|
||||
|
||||
if ( position ) {
|
||||
if ( typeof position === "string" || (typeof position === "object" && "0" in position ) ) {
|
||||
myAt = position.split ? position.split( " " ) : [ position[ 0 ], position[ 1 ] ];
|
||||
if ( myAt.length === 1 ) {
|
||||
myAt[ 1 ] = myAt[ 0 ];
|
||||
}
|
||||
|
||||
$.each( [ "left", "top" ], function( i, offsetPosition ) {
|
||||
if ( +myAt[ i ] === myAt[ i ] ) {
|
||||
offset[ i ] = myAt[ i ];
|
||||
myAt[ i ] = offsetPosition;
|
||||
}
|
||||
});
|
||||
|
||||
position = {
|
||||
my: myAt[0] + (offset[0] < 0 ? offset[0] : "+" + offset[0]) + " " +
|
||||
myAt[1] + (offset[1] < 0 ? offset[1] : "+" + offset[1]),
|
||||
at: myAt.join( " " )
|
||||
};
|
||||
}
|
||||
|
||||
position = $.extend( {}, $.ui.dialog.prototype.options.position, position );
|
||||
} else {
|
||||
position = $.ui.dialog.prototype.options.position;
|
||||
}
|
||||
|
||||
// need to show the dialog to get the actual offset in the position plugin
|
||||
isVisible = this.uiDialog.is( ":visible" );
|
||||
if ( !isVisible ) {
|
||||
this.uiDialog.show();
|
||||
}
|
||||
this.uiDialog.position( position );
|
||||
if ( !isVisible ) {
|
||||
this.uiDialog.hide();
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
}( jQuery ) );
|
||||
|
||||
Loading…
Reference in New Issue
Block a user