Skip to content
Permalink
Browse files

Dialog: Move array notation support for position option to backCompat…

… check. Fixes #8824 - Deprecate array notation for position option.
  • Loading branch information...
jzaefferer committed Nov 17, 2012
1 parent 0be97bf commit a0310eb091f679c8ba002d57a30b53f8e7ea8ef3
@@ -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>
@@ -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>
@@ -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({
@@ -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 ) );

0 comments on commit a0310eb

Please sign in to comment.
You can’t perform that action at this time.