library-mirrors/jquery-ui
1
0
Fork 0
mirror of https://github.com/jquery/jquery-ui.git synced 2025-01-07 20:34:24 +00:00
Code Issues Actions 1 Packages Projects Releases Wiki Activity

Dialog: Move array notation support for position option to backCompat check. Fixes #8824 - Deprecate array notation for position option.

Browse Source
This commit is contained in:
Jörn Zaefferer 2012-11-17 12:10:26 +01:00
parent 6dccd917c3
commit 9fe3a62d80
7 changed files with 147 additions and 43 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
build/tasks/testswarm.js
View File

@ -15,6 +15,7 @@ var versions = {
"Core": "core/core.html", "Core": "core/core.html",
"Datepicker": "datepicker/datepicker.html", "Datepicker": "datepicker/datepicker.html",
"Dialog": "dialog/dialog.html", "Dialog": "dialog/dialog.html",
"Dialog_deprecated": "dialog/dialog_deprecated.html",
"Draggable": "draggable/draggable.html", "Draggable": "draggable/draggable.html",
"Droppable": "droppable/droppable.html", "Droppable": "droppable/droppable.html",
"Effects": "effects/effects.html", "Effects": "effects/effects.html",

1
tests/unit/all.html
View File

@ -22,6 +22,7 @@
"core/core.html", "core/core.html",
"datepicker/datepicker.html", "datepicker/datepicker.html",
"dialog/dialog.html", "dialog/dialog.html",
"dialog/dialog_deprecated.html",
"draggable/draggable.html", "draggable/draggable.html",
"droppable/droppable.html", "droppable/droppable.html",
"effects/effects.html", "effects/effects.html",

3
tests/unit/dialog/dialog.html
View File

@ -5,6 +5,9 @@
<title>jQuery UI Dialog Test Suite</title> <title>jQuery UI Dialog Test Suite</title>
<script src="../../jquery.js"></script> <script src="../../jquery.js"></script>
<script>
$.uiBackCompat = false;
</script>
<link rel="stylesheet" href="../../../external/qunit.css"> <link rel="stylesheet" href="../../../external/qunit.css">
<script src="../../../external/qunit.js"></script> <script src="../../../external/qunit.js"></script>
<script src="../../jquery.simulate.js"></script> <script src="../../jquery.simulate.js"></script>

62
tests/unit/dialog/dialog_deprecated.html Normal file
View 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
View 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();
});

20
tests/unit/dialog/dialog_options.js
View File

@ -331,16 +331,6 @@ if ( !$.ui.ie ) {
el.remove(); 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() { test("position, right bottom at right bottom via ui.position args", function() {
expect( 2 ); expect( 2 );
var el = $('<div></div>').dialog({ 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() { test("position, at another element", function() {
expect( 4 ); expect( 4 );
var parent = $('<div></div>').css({ var parent = $('<div></div>').css({

80
ui/jquery.ui.dialog.js vendored
View File

@ -211,7 +211,7 @@ $.widget("ui.dialog", {
this.opener = $( this.document[ 0 ].activeElement ); this.opener = $( this.document[ 0 ].activeElement );
this._size(); this._size();
this._position( this.options.position ); this._position();
if ( this.options.modal ) { if ( this.options.modal ) {
this.overlay = new $.ui.dialog.overlay( this ); this.overlay = new $.ui.dialog.overlay( this );
} }
@ -500,38 +500,24 @@ $.widget("ui.dialog", {
} }
}, },
_position: function( position ) { _position: function() {
var myAt = [], var position = this.options.position,
offset = [ 0, 0 ], myAt = [],
isVisible; isVisible;
if ( position ) { if ( position ) {
// TODO we don't support 1.3.2 anymore, clean this mess up if ( typeof position === "string" ) {
// deep extending converts arrays to objects in jQuery <= 1.3.2 :-( myAt = position.split( " " );
// 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 ( myAt.length === 1 ) { if ( myAt.length === 1 ) {
myAt[ 1 ] = myAt[ 0 ]; myAt[ 1 ] = myAt[ 0 ];
} }
$.each( [ "left", "top" ], function( i, offsetPosition ) {
if ( +myAt[ i ] === myAt[ i ] ) {
offset[ i ] = myAt[ i ];
myAt[ i ] = offsetPosition;
}
});
position = { position = {
my: myAt[0] + (offset[0] < 0 ? offset[0] : "+" + offset[0]) + " " + my: myAt[0] + " " + myAt[1],
myAt[1] + (offset[1] < 0 ? offset[1] : "+" + offset[1]),
at: myAt.join( " " ) at: myAt.join( " " )
}; };
position = $.extend( {}, $.ui.dialog.prototype.options.position, position );
} }
position = $.extend( {}, $.ui.dialog.prototype.options.position, position );
} else { } else {
position = $.ui.dialog.prototype.options.position; position = $.ui.dialog.prototype.options.position;
} }
@ -610,7 +596,7 @@ $.widget("ui.dialog", {
} }
if ( key === "position" ) { if ( key === "position" ) {
this._position( value ); this._position();
} }
if ( key === "resizable" ) { 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 ) ); }( jQuery ) );