diff options
| author | Jörn Zaefferer <joern.zaefferer@gmail.com> | 2012-02-21 17:48:55 +0100 |
|---|---|---|
| committer | Jörn Zaefferer <joern.zaefferer@gmail.com> | 2012-02-21 17:48:55 +0100 |
| commit | 6528b48b4762b0ddf3697580444fdf9f34e7eca9 (patch) | |
| tree | 46e0e17d0b8356d0e9d142e9a00bdf242d5bbf2c | |
| parent | 98d72c7f6d0f1c535774d4db85556626e016603c (diff) | |
| parent | d32a9e81ecb8a201c1737c3226a99c33ced451af (diff) | |
| download | jquery-ui-6528b48b4762b0ddf3697580444fdf9f34e7eca9.tar.gz jquery-ui-6528b48b4762b0ddf3697580444fdf9f34e7eca9.zip | |
Merge branch 'master' into selectmenu
60 files changed, 1050 insertions, 4098 deletions
diff --git a/demos/accordion/hoverintent.html b/demos/accordion/hoverintent.html index 09360d62d..8f628bda8 100644 --- a/demos/accordion/hoverintent.html +++ b/demos/accordion/hoverintent.html @@ -29,7 +29,7 @@ $( this ).unbind( "mouseover", jQuery.event.special.hoverintent.handler ); }, handler: function( event ) { - var self = this, + var that = this, args = arguments, target = $( event.target ), cX, cY, pX, pY; @@ -50,7 +50,11 @@ if ( ( Math.abs( pX - cX ) + Math.abs( pY - cY ) ) < cfg.sensitivity ) { clear(); event.type = "hoverintent"; - jQuery.event.handle.apply( self, args ); + // prevent accessing the original event since the new event + // is fired asynchronously and the old event is no longer + // usable (#6028) + event.originalEvent = {}; + jQuery.event.handle.apply( that, args ); } else { pX = cX; pY = cY; diff --git a/demos/accordion/sortable.html b/demos/accordion/sortable.html index a0a899344..60b5d3c70 100644 --- a/demos/accordion/sortable.html +++ b/demos/accordion/sortable.html @@ -11,16 +11,12 @@ <script src="../../ui/jquery.ui.sortable.js"></script> <script src="../../ui/jquery.ui.accordion.js"></script> <link rel="stylesheet" href="../demos.css"> + <style> + /* IE has layout issues when sorting (see #5413) */ + .group { zoom: 1 } + </style> <script> $(function() { - var stop = false; - $( "#accordion h3" ).click(function( event ) { - if ( stop ) { - event.stopImmediatePropagation(); - event.preventDefault(); - stop = false; - } - }); $( "#accordion" ) .accordion({ header: "> div > h3" @@ -28,8 +24,10 @@ .sortable({ axis: "y", handle: "h3", - stop: function() { - stop = true; + stop: function( event, ui ) { + // IE doesn't register the blur when sorting + // so trigger focusout handlers to remove .ui-state-focus + ui.item.children( "h3" ).triggerHandler( "focusout" ); } }); }); @@ -40,19 +38,19 @@ <div class="demo"> <div id="accordion"> - <div> + <div class="group"> <h3><a href="#">Section 1</a></h3> <div> <p>Mauris mauris ante, blandit et, ultrices a, suscipit eget, quam. Integer ut neque. Vivamus nisi metus, molestie vel, gravida in, condimentum sit amet, nunc. Nam a nibh. Donec suscipit eros. Nam mi. Proin viverra leo ut odio. Curabitur malesuada. Vestibulum a velit eu ante scelerisque vulputate.</p> </div> </div> - <div> + <div class="group"> <h3><a href="#">Section 2</a></h3> <div> <p>Sed non urna. Donec et ante. Phasellus eu ligula. Vestibulum sit amet purus. Vivamus hendrerit, dolor at aliquet laoreet, mauris turpis porttitor velit, faucibus interdum tellus libero ac justo. Vivamus non quam. In suscipit faucibus urna. </p> </div> </div> - <div> + <div class="group"> <h3><a href="#">Section 3</a></h3> <div> <p>Nam enim risus, molestie et, porta ac, aliquam ac, risus. Quisque lobortis. Phasellus pellentesque purus in massa. Aenean in pede. Phasellus ac libero ac tellus pellentesque semper. Sed ac felis. Sed commodo, magna quis lacinia ornare, quam ante aliquam nisi, eu iaculis leo purus venenatis dui. </p> @@ -63,7 +61,7 @@ </ul> </div> </div> - <div> + <div class="group"> <h3><a href="#">Section 4</a></h3> <div> <p>Cras dictum. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Aenean lacinia mauris vel est. </p><p>Suspendisse eu nisl. Nullam ut libero. Integer dignissim consequat lectus. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. </p> diff --git a/demos/addClass/default.html b/demos/addClass/default.html index 38acd8b4c..406466263 100644 --- a/demos/addClass/default.html +++ b/demos/addClass/default.html @@ -33,7 +33,7 @@ <div class="demo"> <div class="toggler"> - <div id="effect" class=" ui-corner-all"> + <div id="effect" class="ui-corner-all"> Etiam libero neque, luctus a, eleifend nec, semper at, lorem. Sed pede. </div> </div> diff --git a/demos/autocomplete/categories.html b/demos/autocomplete/categories.html index 2eead8ad2..902867478 100644 --- a/demos/autocomplete/categories.html +++ b/demos/autocomplete/categories.html @@ -22,14 +22,14 @@ <script> $.widget( "custom.catcomplete", $.ui.autocomplete, { _renderMenu: function( ul, items ) { - var self = this, + var that = this, currentCategory = ""; $.each( items, function( index, item ) { if ( item.category != currentCategory ) { ul.append( "<li class='ui-autocomplete-category'>" + item.category + "</li>" ); currentCategory = item.category; } - self._renderItem( ul, item ); + that._renderItem( ul, item ); }); } }); diff --git a/demos/autocomplete/combobox.html b/demos/autocomplete/combobox.html index aeaee5c4c..27ef92d4e 100644 --- a/demos/autocomplete/combobox.html +++ b/demos/autocomplete/combobox.html @@ -29,7 +29,7 @@ (function( $ ) { $.widget( "ui.combobox", { _create: function() { - var self = this, + var that = this, select = this.element.hide(), selected = select.children( ":selected" ), value = selected.val() ? selected.text() : ""; @@ -85,7 +85,7 @@ }, select: function( event, ui ) { ui.item.option.selected = true; - self._trigger( "selected", event, { + that._trigger( "selected", event, { item: ui.item.option }); }, diff --git a/demos/datepicker/localization.html b/demos/datepicker/localization.html index e11a82438..c276a1679 100644 --- a/demos/datepicker/localization.html +++ b/demos/datepicker/localization.html @@ -34,6 +34,7 @@ <script src="../../ui/i18n/jquery.ui.datepicker-fr-CH.js"></script> <script src="../../ui/i18n/jquery.ui.datepicker-gl.js"></script> <script src="../../ui/i18n/jquery.ui.datepicker-he.js"></script> + <script src="../../ui/i18n/jquery.ui.datepicker-hi.js"></script> <script src="../../ui/i18n/jquery.ui.datepicker-hr.js"></script> <script src="../../ui/i18n/jquery.ui.datepicker-hu.js"></script> <script src="../../ui/i18n/jquery.ui.datepicker-hy.js"></script> @@ -42,6 +43,7 @@ <script src="../../ui/i18n/jquery.ui.datepicker-it.js"></script> <script src="../../ui/i18n/jquery.ui.datepicker-ja.js"></script> <script src="../../ui/i18n/jquery.ui.datepicker-kk.js"></script> + <script src="../../ui/i18n/jquery.ui.datepicker-km.js"></script> <script src="../../ui/i18n/jquery.ui.datepicker-ko.js"></script> <script src="../../ui/i18n/jquery.ui.datepicker-lb.js"></script> <script src="../../ui/i18n/jquery.ui.datepicker-lt.js"></script> @@ -123,12 +125,14 @@ <option value="de">German (Deutsch)</option> <option value="el">Greek (Ελληνικά)</option> <option value="he">Hebrew (‫(עברית</option> + <option value="hi">Hindi (हिंदी)</option> <option value="hu">Hungarian (Magyar)</option> <option value="is">Icelandic (Õslenska)</option> <option value="id">Indonesian (Bahasa Indonesia)</option> <option value="it">Italian (Italiano)</option> <option value="ja">Japanese (日本語)</option> <option value="kk">Kazakhstan (Kazakh)</option> + <option value="km">Khmer</option> <option value="ko">Korean (한국어)</option> <option value="lv">Latvian (Latvieöu Valoda)</option> <option value="lt">Lithuanian (lietuviu kalba)</option> diff --git a/demos/draggable/cursor-style.html b/demos/draggable/cursor-style.html index 2e8930eb0..72e129150 100644 --- a/demos/draggable/cursor-style.html +++ b/demos/draggable/cursor-style.html @@ -15,8 +15,8 @@ </style> <script> $(function() { - $( "#draggable" ).draggable({ cursorAt: { cursor: "move", top: 56, left: 56 } }); - $( "#draggable2" ).draggable({ cursorAt: { cursor: "crosshair", top: -5, left: -5 } }); + $( "#draggable" ).draggable({ cursor: "move", cursorAt: { top: 56, left: 56 } }); + $( "#draggable2" ).draggable({ cursor: "crosshair", cursorAt: { top: -5, left: -5 } }); $( "#draggable3" ).draggable({ cursorAt: { bottom: 0 } }); }); </script> diff --git a/demos/effect/easing.html b/demos/effect/easing.html index e3270c070..f3e07a9c5 100644 --- a/demos/effect/easing.html +++ b/demos/effect/easing.html @@ -15,10 +15,9 @@ </style> <script> $(function() { - if ( !$( "<canvas/>" )[0].getContext ) { - $( "<div/>" ).text( - "Your browser doesn't support canvas, which is required for this demo. " + - "Give Firefox 3 a try!" + if ( !$( "<canvas>" )[0].getContext ) { + $( "<div>" ).text( + "Your browser doesn't support canvas, which is required for this demo." ).appendTo( "#graphs" ); return; } @@ -26,15 +25,13 @@ var i = 0, width = 100, height = 100; + $.each( $.easing, function( name, impl ) { - // skip linear/jswing and any non functioning implementation - if ( !$.isFunction( impl ) || /jswing/.test( name ) ) { - return; - } - var graph = $( "<div/>" ).addClass( "graph" ).appendTo( "#graphs" ), - text = $( "<div/>" ).text( ++i + ". " + name ).appendTo( graph ), - wrap = $( "<div/>" ).appendTo( graph ).css( 'overflow', 'hidden' ), - canvas = $( "<canvas/>" ).appendTo( wrap )[ 0 ]; + var graph = $( "<div>" ).addClass( "graph" ).appendTo( "#graphs" ), + text = $( "<div>" ).text( ++i + ". " + name ).appendTo( graph ), + wrap = $( "<div>" ).appendTo( graph ).css( 'overflow', 'hidden' ), + canvas = $( "<canvas>" ).appendTo( wrap )[ 0 ]; + canvas.width = width; canvas.height = height; var drawHeight = height * 0.8, @@ -42,6 +39,7 @@ ctx = canvas.getContext( "2d" ); ctx.fillStyle = "black"; + // draw background ctx.beginPath(); ctx.moveTo( cradius, 0 ); ctx.quadraticCurveTo( 0, 0, 0, cradius ); @@ -53,31 +51,34 @@ ctx.lineTo( cradius, 0 ); ctx.fill(); + // draw bottom line ctx.strokeStyle = "#555"; ctx.beginPath(); ctx.moveTo( width * 0.1, drawHeight + .5 ); ctx.lineTo( width * 0.9, drawHeight + .5 ); ctx.stroke(); + // draw top line ctx.strokeStyle = "#555"; ctx.beginPath(); ctx.moveTo( width * 0.1, drawHeight * .3 - .5 ); ctx.lineTo( width * 0.9, drawHeight * .3 - .5 ); ctx.stroke(); - + + // plot easing ctx.strokeStyle = "white"; ctx.beginPath(); ctx.lineWidth = 2; ctx.moveTo( width * 0.1, drawHeight ); $.each( new Array( width ), function( position ) { - var val = impl( 0, position, 0, 1, height ); - if ( /linear|jswing/.test( name ) ) { - val = position / width; - } + var state = position / width, + val = impl( state, position, 0, 1, width ); ctx.lineTo( position * 0.8 + width * 0.1, drawHeight - drawHeight * val * 0.7 ); }); ctx.stroke(); + + // animate on click graph.click(function() { wrap .animate( { height: "hide" }, 2000, name ) diff --git a/demos/index.html b/demos/index.html index 76ddcd3da..81217cba3 100644 --- a/demos/index.html +++ b/demos/index.html @@ -68,6 +68,7 @@ <script src="../ui/i18n/jquery.ui.datepicker-fr-CH.js"></script> <script src="../ui/i18n/jquery.ui.datepicker-gl.js"></script> <script src="../ui/i18n/jquery.ui.datepicker-he.js"></script> + <script src="../ui/i18n/jquery.ui.datepicker-hi.js"></script> <script src="../ui/i18n/jquery.ui.datepicker-hr.js"></script> <script src="../ui/i18n/jquery.ui.datepicker-hu.js"></script> <script src="../ui/i18n/jquery.ui.datepicker-hy.js"></script> @@ -76,6 +77,7 @@ <script src="../ui/i18n/jquery.ui.datepicker-it.js"></script> <script src="../ui/i18n/jquery.ui.datepicker-ja.js"></script> <script src="../ui/i18n/jquery.ui.datepicker-kk.js"></script> + <script src="../ui/i18n/jquery.ui.datepicker-km.js"></script> <script src="../ui/i18n/jquery.ui.datepicker-ko.js"></script> <script src="../ui/i18n/jquery.ui.datepicker-lb.js"></script> <script src="../ui/i18n/jquery.ui.datepicker-lt.js"></script> @@ -225,9 +227,9 @@ return false; }); }); - }); + }, "html" ); } - }); + }, "html" ); } function updateDemoNotes() { diff --git a/demos/sortable/connect-lists.html b/demos/sortable/connect-lists.html index 1d4ae490e..3e62952e4 100644 --- a/demos/sortable/connect-lists.html +++ b/demos/sortable/connect-lists.html @@ -11,7 +11,7 @@ <script src="../../ui/jquery.ui.sortable.js"></script> <link rel="stylesheet" href="../demos.css"> <style> - #sortable1, #sortable2 { list-style-type: none; margin: 0; padding: 0; float: left; margin-right: 10px; } + #sortable1, #sortable2 { list-style-type: none; margin: 0; padding: 0 0 2.5em; float: left; margin-right: 10px; } #sortable1 li, #sortable2 li { margin: 0 5px 5px 5px; padding: 5px; font-size: 1.2em; width: 120px; } </style> <script> diff --git a/tests/jquery.simulate.js b/tests/jquery.simulate.js index a8740e6b8..43614dd0a 100644 --- a/tests/jquery.simulate.js +++ b/tests/jquery.simulate.js @@ -157,8 +157,7 @@ $.extend( $.simulate.prototype, { }, drag: function( el ) { - var self = this, - center = this.findCenter(this.target), + var center = this.findCenter(this.target), options = this.options, x = Math.floor( center.x ), y = Math.floor( center.y ), diff --git a/tests/static/slider/default.html b/tests/static/slider/default.html deleted file mode 100644 index aec1f7800..000000000 --- a/tests/static/slider/default.html +++ /dev/null @@ -1,17 +0,0 @@ -<!DOCTYPE html> -<html lang="en"> -<head> - <meta charset="UTF-8" /> - <title>Slider Static Test : Default</title> - <link rel="stylesheet" href="../static.css" type="text/css" /> - <link rel="stylesheet" href="../../../themes/base/jquery.ui.base.css" type="text/css" /> - <link rel="stylesheet" href="../../../themes/base/jquery.ui.theme.css" type="text/css" title="ui-theme" /> - <script type="text/javascript" src="../../../jquery-1.7.1.js"></script> - <script type="text/javascript" src="../static.js"></script> -</head> -<body> - -<div class="ui-slider ui-slider-horizontal ui-widget ui-widget-content ui-corner-all"><a style="left: 0%;" class="ui-slider-handle ui-state-default ui-corner-all" href="#"></a></div> - -</body> -</html> diff --git a/tests/static/slider/default_vertical.html b/tests/static/slider/default_vertical.html deleted file mode 100644 index 6ddf1de2b..000000000 --- a/tests/static/slider/default_vertical.html +++ /dev/null @@ -1,17 +0,0 @@ -<!DOCTYPE html> -<html lang="en"> -<head> - <meta charset="UTF-8" /> - <title>Slider Static Test : Default vertical</title> - <link rel="stylesheet" href="../static.css" type="text/css" /> - <link rel="stylesheet" href="../../../themes/base/jquery.ui.base.css" type="text/css" /> - <link rel="stylesheet" href="../../../themes/base/jquery.ui.theme.css" type="text/css" title="ui-theme" /> - <script type="text/javascript" src="../../../jquery-1.7.1.js"></script> - <script type="text/javascript" src="../static.js"></script> -</head> -<body> - -<div class="ui-slider ui-slider-vertical ui-widget ui-widget-content ui-corner-all"><a style="bottom: 0%;" class="ui-slider-handle ui-state-default ui-corner-all" href="#"></a></div> - -</body> -</html> diff --git a/tests/static/slider/slider_horizontal.html b/tests/static/slider/slider_horizontal.html deleted file mode 100644 index e28d9d774..000000000 --- a/tests/static/slider/slider_horizontal.html +++ /dev/null @@ -1,17 +0,0 @@ -<!DOCTYPE html> -<html lang="en"> -<head> - <meta charset="UTF-8" /> - <title>Slider Static Test : Slider horizontal</title> - <link rel="stylesheet" href="../static.css" type="text/css" /> - <link rel="stylesheet" href="../../../themes/base/jquery.ui.base.css" type="text/css" /> - <link rel="stylesheet" href="../../../themes/base/jquery.ui.theme.css" type="text/css" title="ui-theme" /> - <script type="text/javascript" src="../../../jquery-1.7.1.js"></script> - <script type="text/javascript" src="../static.js"></script> -</head> -<body> - -<div class="ui-slider ui-slider-horizontal ui-widget ui-widget-content ui-corner-all"><a style="left: 50%;" class="ui-slider-handle ui-state-default ui-corner-all" href="#"></a></div> - -</body> -</html> diff --git a/tests/static/slider/slider_horizontal_range.html b/tests/static/slider/slider_horizontal_range.html deleted file mode 100644 index 227ce44bb..000000000 --- a/tests/static/slider/slider_horizontal_range.html +++ /dev/null @@ -1,17 +0,0 @@ -<!DOCTYPE html> -<html lang="en"> -<head> - <meta charset="UTF-8" /> - <title>Slider Static Test : Slider horizontal range</title> - <link rel="stylesheet" href="../static.css" type="text/css" /> - <link rel="stylesheet" href="../../../themes/base/jquery.ui.base.css" type="text/css" /> - <link rel="stylesheet" href="../../../themes/base/jquery.ui.theme.css" type="text/css" title="ui-theme" /> - <script type="text/javascript" src="../../../jquery-1.7.1.js"></script> - <script type="text/javascript" src="../static.js"></script> -</head> -<body> - -<div class="ui-slider ui-slider-horizontal ui-widget ui-widget-content ui-corner-all"><div style="left: 25%; width: 50%;" class="ui-slider-range ui-widget-header"></div><a style="left: 25%;" class="ui-slider-handle ui-state-default ui-corner-all" href="#"></a><a style="left: 75%;" class="ui-slider-handle ui-state-default ui-corner-all" href="#"></a></div> - -</body> -</html> diff --git a/tests/static/slider/slider_horizontal_range_max.html b/tests/static/slider/slider_horizontal_range_max.html deleted file mode 100644 index 11b2a9673..000000000 --- a/tests/static/slider/slider_horizontal_range_max.html +++ /dev/null @@ -1,17 +0,0 @@ -<!DOCTYPE html> -<html lang="en"> -<head> - <meta charset="UTF-8" /> - <title>Slider Static Test : Slider horizontal range max</title> - <link rel="stylesheet" href="../static.css" type="text/css" /> - <link rel="stylesheet" href="../../../themes/base/jquery.ui.base.css" type="text/css" /> - <link rel="stylesheet" href="../../../themes/base/jquery.ui.theme.css" type="text/css" title="ui-theme" /> - <script type="text/javascript" src="../../../jquery-1.7.1.js"></script> - <script type="text/javascript" src="../static.js"></script> -</head> -<body> - -<div class="ui-slider ui-slider-horizontal ui-widget ui-widget-content ui-corner-all"><div style="width:25%;" class="ui-slider-range ui-slider-range-max ui-widget-header"></div><a style="left: 75%;" class="ui-slider-handle ui-state-default ui-corner-all" href="#"></a></div> - -</body> -</html> diff --git a/tests/static/slider/slider_horizontal_range_min.html b/tests/static/slider/slider_horizontal_range_min.html deleted file mode 100644 index 9ed15f538..000000000 --- a/tests/static/slider/slider_horizontal_range_min.html +++ /dev/null @@ -1,17 +0,0 @@ -<!DOCTYPE html> -<html lang="en"> -<head> - <meta charset="UTF-8" /> - <title>Slider Static Test : Slider horizontal range min</title> - <link rel="stylesheet" href="../static.css" type="text/css" /> - <link rel="stylesheet" href="../../../themes/base/jquery.ui.base.css" type="text/css" /> - <link rel="stylesheet" href="../../../themes/base/jquery.ui.theme.css" type="text/css" title="ui-theme" /> - <script type="text/javascript" src="../../../jquery-1.7.1.js"></script> - <script type="text/javascript" src="../static.js"></script> -</head> -<body> - -<div class="ui-slider ui-slider-horizontal ui-widget ui-widget-content ui-corner-all"><div style="width: 25%;" class="ui-slider-range ui-slider-range-min ui-widget-header"></div><a style="left: 25%;" class="ui-slider-handle ui-state-default ui-corner-all" href="#"></a></div> - -</body> -</html> diff --git a/tests/static/slider/slider_vertical.html b/tests/static/slider/slider_vertical.html deleted file mode 100644 index 63ef3d1db..000000000 --- a/tests/static/slider/slider_vertical.html +++ /dev/null @@ -1,17 +0,0 @@ -<!DOCTYPE html> -<html lang="en"> -<head> - <meta charset="UTF-8" /> - <title>Slider Static Test : Slider vertical</title> - <link rel="stylesheet" href="../static.css" type="text/css" /> - <link rel="stylesheet" href="../../../themes/base/jquery.ui.base.css" type="text/css" /> - <link rel="stylesheet" href="../../../themes/base/jquery.ui.theme.css" type="text/css" title="ui-theme" /> - <script type="text/javascript" src="../../../jquery-1.7.1.js"></script> - <script type="text/javascript" src="../static.js"></script> -</head> -<body> - -<div class="ui-slider ui-slider-vertical ui-widget ui-widget-content ui-corner-all"><a style="bottom: 50%;" class="ui-slider-handle ui-state-default ui-corner-all" href="#"></a></div> - -</body> -</html> diff --git a/tests/static/slider/slider_vertical_range.html b/tests/static/slider/slider_vertical_range.html deleted file mode 100644 index 4f1ffb035..000000000 --- a/tests/static/slider/slider_vertical_range.html +++ /dev/null @@ -1,17 +0,0 @@ -<!DOCTYPE html> -<html lang="en"> -<head> - <meta charset="UTF-8" /> - <title>Slider Static Test : Slider vertical range</title> - <link rel="stylesheet" href="../static.css" type="text/css" /> - <link rel="stylesheet" href="../../../themes/base/jquery.ui.base.css" type="text/css" /> - <link rel="stylesheet" href="../../../themes/base/jquery.ui.theme.css" type="text/css" title="ui-theme" /> - <script type="text/javascript" src="../../../jquery-1.7.1.js"></script> - <script type="text/javascript" src="../static.js"></script> -</head> -<body> - -<div class="ui-slider ui-slider-vertical ui-widget ui-widget-content ui-corner-all"><div style="bottom: 25%; height: 50%;" class="ui-slider-range ui-widget-header"></div><a style="bottom: 25%;" class="ui-slider-handle ui-state-default ui-corner-all" href="#"></a><a style="bottom: 75%;" class="ui-slider-handle ui-state-default ui-corner-all" href="#"></a></div> - -</body> -</html> diff --git a/tests/static/slider/slider_vertical_range_max.html b/tests/static/slider/slider_vertical_range_max.html deleted file mode 100644 index a5c9857c1..000000000 --- a/tests/static/slider/slider_vertical_range_max.html +++ /dev/null @@ -1,17 +0,0 @@ -<!DOCTYPE html> -<html lang="en"> -<head> - <meta charset="UTF-8" /> - <title>Slider Static Test : Slider vertical range max</title> - <link rel="stylesheet" href="../static.css" type="text/css" /> - <link rel="stylesheet" href="../../../themes/base/jquery.ui.base.css" type="text/css" /> - <link rel="stylesheet" href="../../../themes/base/jquery.ui.theme.css" type="text/css" title="ui-theme" /> - <script type="text/javascript" src="../../../jquery-1.7.1.js"></script> - <script type="text/javascript" src="../static.js"></script> -</head> -<body> - -<div class="ui-slider ui-slider-vertical ui-widget ui-widget-content ui-corner-all"><div style="height: 25%;" class="ui-slider-range ui-slider-range-max ui-widget-header"></div><a style="bottom: 75%;" class="ui-slider-handle ui-state-default ui-corner-all" href="#"></a></div> - -</body> -</html> diff --git a/tests/static/slider/slider_vertical_range_min.html b/tests/static/slider/slider_vertical_range_min.html deleted file mode 100644 index b43d4511b..000000000 --- a/tests/static/slider/slider_vertical_range_min.html +++ /dev/null @@ -1,17 +0,0 @@ -<!DOCTYPE html> -<html lang="en"> -<head> - <meta charset="UTF-8" /> - <title>Slider Static Test : Slider vertical range min</title> - <link rel="stylesheet" href="../static.css" type="text/css" /> - <link rel="stylesheet" href="../../../themes/base/jquery.ui.base.css" type="text/css" /> - <link rel="stylesheet" href="../../../themes/base/jquery.ui.theme.css" type="text/css" title="ui-theme" /> - <script type="text/javascript" src="../../../jquery-1.7.1.js"></script> - <script type="text/javascript" src="../static.js"></script> -</head> -<body> - -<div class="ui-slider ui-slider-vertical ui-widget ui-widget-content ui-corner-all"><div style="height:25%;" class="ui-slider-range ui-slider-range-min ui-widget-header"></div><a style="bottom: 25%;" class="ui-slider-handle ui-state-default ui-corner-all" href="#"></a></div> - -</body> -</html> diff --git a/tests/unit/accordion/accordion_defaults.js b/tests/unit/accordion/accordion_defaults.js index 9aa58e650..9ad85bbce 100644 --- a/tests/unit/accordion/accordion_defaults.js +++ b/tests/unit/accordion/accordion_defaults.js @@ -1,7 +1,7 @@ commonWidgetTests( "accordion", { defaults: { active: 0, - animated: "slide", + animate: {}, collapsible: false, disabled: false, event: "click", diff --git a/tests/unit/accordion/accordion_defaults_deprecated.js b/tests/unit/accordion/accordion_defaults_deprecated.js index 3f45a1f10..99f5ac827 100644 --- a/tests/unit/accordion/accordion_defaults_deprecated.js +++ b/tests/unit/accordion/accordion_defaults_deprecated.js @@ -1,6 +1,7 @@ commonWidgetTests( "accordion", { defaults: { active: 0, + animate: null, animated: "slide", autoHeight: true, clearStyle: false, diff --git a/tests/unit/accordion/accordion_events.js b/tests/unit/accordion/accordion_events.js index 12acf2a44..b5c3ea228 100644 --- a/tests/unit/accordion/accordion_events.js +++ b/tests/unit/accordion/accordion_events.js @@ -2,6 +2,45 @@ module( "accordion: events", accordion_setupTeardown() ); +test( "create", function() { + expect( 10 ); + + var element = $( "#list1" ), + headers = element.children( "h3" ), + contents = headers.next(); + + element.accordion({ + create: function( event, ui ) { + equals( ui.header.size(), 1, "header size" ); + strictEqual( ui.header[ 0 ], headers[ 0 ], "header" ); + equals( ui.content.size(), 1, "content size" ); + strictEqual( ui.content[ 0 ], contents[ 0 ], "content" ); + } + }); + element.accordion( "destroy" ); + + element.accordion({ + active: 2, + create: function( event, ui ) { + equals( ui.header.size(), 1, "header size" ); + strictEqual( ui.header[ 0 ], headers[ 2 ], "header" ); + equals( ui.content.size(), 1, "content size" ); + strictEqual( ui.content[ 0 ], contents[ 2 ], "content" ); + } + }); + element.accordion( "destroy" ); + + element.accordion({ + active: false, + collapsible: true, + create: function( event, ui ) { + equals( ui.header.size(), 0, "header size" ); + equals( ui.content.size(), 0, "content size" ); + } + }); + element.accordion( "destroy" ); +}); + test( "beforeActivate", function() { expect( 38 ); var element = $( "#list1" ).accordion({ diff --git a/tests/unit/accordion/accordion_options.js b/tests/unit/accordion/accordion_options.js index a60bb27e1..8206b1d62 100644 --- a/tests/unit/accordion/accordion_options.js +++ b/tests/unit/accordion/accordion_options.js @@ -255,7 +255,7 @@ test( "{ icons: false }", function() { var element = $( "#list1" ); function icons( on ) { deepEqual( element.find( "span.ui-icon").length, on ? 3 : 0 ); - deepEqual( element.hasClass( "ui-accordion-icons" ), on ); + deepEqual( element.find( ".ui-accordion-header.ui-accordion-icons" ).length, on ? 3 : 0 ); } element.accordion(); icons( true ); diff --git a/tests/unit/accordion/accordion_test_helpers.js b/tests/unit/accordion/accordion_test_helpers.js index 66d60a469..7b316e983 100644 --- a/tests/unit/accordion/accordion_test_helpers.js +++ b/tests/unit/accordion/accordion_test_helpers.js @@ -18,13 +18,13 @@ function accordion_equalHeights( accordion, min, max ) { } function accordion_setupTeardown() { - var animated = $.ui.accordion.prototype.options.animated; + var animate = $.ui.accordion.prototype.options.animate; return { setup: function() { - $.ui.accordion.prototype.options.animated = false; + $.ui.accordion.prototype.options.animate = false; }, teardown: function() { - $.ui.accordion.prototype.options.animated = animated; + $.ui.accordion.prototype.options.animate = animate; } }; } diff --git a/tests/unit/autocomplete/autocomplete_core.js b/tests/unit/autocomplete/autocomplete_core.js index d98f56abf..ef6ea58af 100644 --- a/tests/unit/autocomplete/autocomplete_core.js +++ b/tests/unit/autocomplete/autocomplete_core.js @@ -2,45 +2,6 @@ module( "autocomplete: core" ); -asyncTest( "close-on-blur is properly delayed", function() { - expect( 3 ); - var element = $( "#autocomplete" ) - .autocomplete({ - source: [ "java", "javascript" ] - }) - .val( "ja" ) - .autocomplete( "search" ), - menu = element.autocomplete( "widget" ); - - ok( menu.is( ":visible" ) ); - element.blur(); - ok( menu.is( ":visible" ) ); - setTimeout(function() { - ok( menu.is( ":hidden") ); - start(); - }, 200 ); -}); - -asyncTest( "close-on-blur is cancelled when starting a search", function() { - expect( 3 ); - var element = $( "#autocomplete" ) - .autocomplete({ - source: [ "java", "javascript" ] - }) - .val( "ja" ) - .autocomplete( "search" ), - menu = element.autocomplete( "widget" ); - - ok( menu.is( ":visible" ) ); - element.blur(); - ok( menu.is( ":visible" ) ); - element.autocomplete( "search" ); - setTimeout(function() { - ok( menu.is( ":visible" ) ); - start(); - }, 200 ); -}); - test( "prevent form submit on enter when menu is active", function() { expect( 2 ); var event, @@ -162,8 +123,4 @@ test( "allow form submit on enter when menu is not active", function() { } })(); -(function() { - -})(); - }( jQuery ) ); diff --git a/tests/unit/autocomplete/autocomplete_events.js b/tests/unit/autocomplete/autocomplete_events.js index 7b51ec4c0..1c7ff7462 100644 --- a/tests/unit/autocomplete/autocomplete_events.js +++ b/tests/unit/autocomplete/autocomplete_events.js @@ -68,7 +68,10 @@ $.each([ ok( menu.is( ":visible" ), "menu is visible after delay" ); element.simulate( "keydown", { keyCode: $.ui.keyCode.DOWN } ); element.simulate( "keydown", { keyCode: $.ui.keyCode.ENTER } ); - element.simulate( "blur" ); + // blur must be async for IE to handle it properly + setTimeout(function() { + element.simulate( "blur" ); + }, 1 ); }, 50 ); }); }); diff --git a/tests/unit/autocomplete/autocomplete_methods.js b/tests/unit/autocomplete/autocomplete_methods.js index 3fe035d28..1600d73dc 100644 --- a/tests/unit/autocomplete/autocomplete_methods.js +++ b/tests/unit/autocomplete/autocomplete_methods.js @@ -9,15 +9,19 @@ test( "destroy", function() { }); }); -test( "search", function() { - expect( 3 ); +test( "search, close", function() { + expect( 6 ); var data = [ "c++", "java", "php", "coldfusion", "javascript", "asp", "ruby", "python", "c", "scala", "groovy", "haskell", "perl" ], element = $( "#autocomplete" ).autocomplete({ source: data, minLength: 0 }), menu = element.autocomplete( "widget" ); + + ok( menu.is( ":hidden" ), "menu is hidden on init" ); + element.autocomplete( "search" ); + ok( menu.is( ":visible" ), "menu is visible after search" ); equal( menu.find( ".ui-menu-item" ).length, data.length, "all items for a blank search" ); element.val( "has" ).autocomplete( "search" ); @@ -25,6 +29,9 @@ test( "search", function() { element.autocomplete( "search", "ja" ); equal( menu.find( ".ui-menu-item" ).length, 2, "only java and javascript for 'ja'" ); + + element.autocomplete( "close" ); + ok( menu.is( ":hidden" ), "menu is hidden after close" ); }); }( jQuery ) ); diff --git a/tests/unit/autocomplete/autocomplete_options.js b/tests/unit/autocomplete/autocomplete_options.js index 114e9a42b..1ab40f36c 100644 --- a/tests/unit/autocomplete/autocomplete_options.js +++ b/tests/unit/autocomplete/autocomplete_options.js @@ -102,6 +102,60 @@ test( "minLength", function() { ok( menu.is( ":visible" ), "blank enough for minLength: 0" ); }); +asyncTest( "minLength, exceed then drop below", function() { + expect( 4 ); + var element = $( "#autocomplete" ).autocomplete({ + minLength: 2, + source: function( req, res ) { + equal( req.term, "12", "correct search term" ); + setTimeout(function() { + res([ "item" ]); + }, 1 ); + } + }), + menu = element.autocomplete( "widget" ); + + ok( menu.is( ":hidden" ), "menu is hidden before first search" ); + element.autocomplete( "search", "12" ); + + ok( menu.is( ":hidden" ), "menu is hidden before second search" ); + element.autocomplete( "search", "1" ); + + setTimeout(function() { + ok( menu.is( ":hidden" ), "menu is hidden after searches" ); + start(); + }, 50 ); +}); + +test( "minLength, exceed then drop below then exceed", function() { + expect( 3 ); + var _res = [], + element = $( "#autocomplete" ).autocomplete({ + minLength: 2, + source: function( req, res ) { + _res.push( res ); + } + }), + menu = element.autocomplete( "widget" ); + + // trigger a valid search + ok( menu.is( ":hidden" ), "menu is hidden before first search" ); + element.autocomplete( "search", "12" ); + + // trigger a search below the minLength, to turn on cancelSearch flag + ok( menu.is( ":hidden" ), "menu is hidden before second search" ); + element.autocomplete( "search", "1" ); + + // trigger a valid search + element.autocomplete( "search", "13" ); + // react as if the first search was cancelled (default ajax behavior) + _res[ 0 ]([]); + // react to second search + _res[ 1 ]([ "13" ]); + + ok( menu.is( ":visible" ), "menu is visible after searches" ); +}); + test( "source, local string array", function() { expect( 1 ); var element = $( "#autocomplete" ).autocomplete({ diff --git a/tests/unit/menu/menu_core.js b/tests/unit/menu/menu_core.js index c0feae75c..bccf4a1f2 100644 --- a/tests/unit/menu/menu_core.js +++ b/tests/unit/menu/menu_core.js @@ -9,27 +9,27 @@ module("menu: core"); test("accessibility", function () { expect(5); - var ac = $('#menu1').menu(); + var menu = $('#menu1').menu(); var item0 = $("li:eq(0) a"); - ok( ac.hasClass("ui-menu ui-widget ui-widget-content ui-corner-all"), "menu class"); - equals( ac.attr("role"), "menu", "main role"); - ok( !ac.attr("aria-activedescendant"), "aria attribute not yet active"); + ok( menu.hasClass("ui-menu ui-widget ui-widget-content ui-corner-all"), "menu class"); + equals( menu.attr("role"), "menu", "main role"); + ok( !menu.attr("aria-activedescendant"), "aria attribute not yet active"); - var item = ac.find( "li:first" ).find( "a" ).attr( "id", "xid" ).end(); - ac.menu( "focus", $.Event(), item ); - equals( ac.attr("aria-activedescendant"), "xid", "aria attribute, id from dom"); + var item = menu.find( "li:first" ).find( "a" ).attr( "id", "xid" ).end(); + menu.menu( "focus", $.Event(), item ); + equals( menu.attr("aria-activedescendant"), "xid", "aria attribute, id from dom"); - var item = ac.find( "li:last" ); - ac.menu( "focus", $.Event(), item ); - equals( ac.attr("aria-activedescendant"), "menu1-4", "aria attribute, generated id"); + var item = menu.find( "li:last" ); + menu.menu( "focus", $.Event(), item ); + equals( menu.attr("aria-activedescendant"), "menu1-4", "aria attribute, generated id"); }); test("items class and role", function () { - var ac = $('#menu1').menu(); - expect(1 + 5 * $("li",ac).length); - ok( ($("li",ac).length > 0 ), "number of menu items"); - $("li",ac).each(function(item) { + var menu = $('#menu1').menu(); + expect(1 + 5 * $("li",menu).length); + ok( ($("li",menu).length > 0 ), "number of menu items"); + $("li",menu).each(function(item) { ok( $(this).hasClass("ui-menu-item"), "menu item ("+ item + ") class for item"); equals( $(this).attr("role"), "presentation", "menu item ("+ item + ") role"); equals( $("a", this).attr("role"), "menuitem", "menu item ("+ item + ") role"); diff --git a/tests/unit/menu/menu_events.js b/tests/unit/menu/menu_events.js index 9e68e0c67..6b03efb3c 100644 --- a/tests/unit/menu/menu_events.js +++ b/tests/unit/menu/menu_events.js @@ -7,7 +7,7 @@ module("menu: events"); test("handle click on menu", function() { expect(1); - var ac = $('#menu1').menu({ + var menu = $('#menu1').menu({ select: function(event, ui) { menu_log(); } @@ -15,15 +15,15 @@ test("handle click on menu", function() { menu_log("click",true); menu_click($('#menu1'),"1"); menu_log("afterclick"); - menu_click( ac,"2"); + menu_click( menu,"2"); menu_click($('#menu1'),"3"); - menu_click( ac,"1"); + menu_click( menu,"1"); equals( $("#log").html(), "1,3,2,afterclick,1,click,", "Click order not valid."); }); test("handle click on custom item menu", function() { expect(1); - var ac = $('#menu5').menu({ + var menu = $('#menu5').menu({ select: function(event, ui) { menu_log(); }, @@ -32,9 +32,9 @@ test("handle click on custom item menu", function() { menu_log("click",true); menu_click($('#menu5'),"1"); menu_log("afterclick"); - menu_click( ac,"2"); + menu_click( menu,"2"); menu_click($('#menu5'),"3"); - menu_click( ac,"1"); + menu_click( menu,"1"); equals( $("#log").html(), "1,3,2,afterclick,1,click,", "Click order not valid."); }); @@ -87,48 +87,55 @@ asyncTest( "handle submenu auto collapse: mouseleave", function() { var $menu = $( "#menu2" ).menu(); $menu.find( "li:nth-child(7)" ).trigger( "mouseover" ); - setTimeout(function() { + setTimeout( menumouseleave1, 350 ); + + function menumouseleave1() { equal( $menu.find( "ul[aria-expanded='true']" ).length, 1, "first submenu expanded" ); $menu.find( "li:nth-child(7) li:first" ).trigger( "mouseover" ); - setTimeout(function() { - equal( $menu.find( "ul[aria-expanded='true']" ).length, 2, "second submenu expanded" ); - $menu.find( "ul[aria-expanded='true']:first" ).trigger( "mouseleave" ); - setTimeout(function() { - equal( $menu.find( "ul[aria-expanded='true']" ).length, 1, "second submenu collapsed" ); - $menu.trigger( "mouseleave" ); - setTimeout(function() { - equal( $menu.find( "ul[aria-expanded='true']" ).length, 0, "first submenu collapsed" ); - start(); - }, 1400); - }, 1050); - }, 700); - }, 350); + setTimeout( menumouseleave2, 350 ); + } + function menumouseleave2() { + equal( $menu.find( "ul[aria-expanded='true']" ).length, 2, "second submenu expanded" ); + $menu.find( "ul[aria-expanded='true']:first" ).trigger( "mouseleave" ); + setTimeout( menumouseleave3, 350 ); + } + function menumouseleave3() { + equal( $menu.find( "ul[aria-expanded='true']" ).length, 1, "second submenu collapsed" ); + $menu.trigger( "mouseleave" ); + setTimeout( menumouseleave4, 350 ); + } + function menumouseleave4() { + equal( $menu.find( "ul[aria-expanded='true']" ).length, 0, "first submenu collapsed" ); + start(); + } }); -asyncTest( "handle custom menu item submenu auto collapse: mouseleave", function() { - expect( 5 ); +asyncTest( "handle submenu auto collapse: mouseleave", function() { + expect( 4 ); var $menu = $( "#menu5" ).menu( { menus: "div" } ); - $menu.children( ":nth-child(7)" ).trigger( "mouseover" ); - setTimeout(function() { + $menu.find( ":nth-child(7)" ).trigger( "mouseover" ); + setTimeout( menumouseleave1, 350 ); + + function menumouseleave1() { equal( $menu.find( "div[aria-expanded='true']" ).length, 1, "first submenu expanded" ); - $menu.children( ":nth-child(7)" ).find( "div:first" ).children( ":first" ).trigger( "mouseover" ); - setTimeout(function() { - equal( $menu.find( "div[aria-expanded='true']" ).length, 2, "second submenu expanded" ); - $menu.find( "div[aria-expanded='true']:first" ).trigger( "mouseleave" ); - setTimeout(function() { - equal( $menu.find( "div[aria-expanded='true']" ).length, 1, "second submenu collapsed" ); - $menu.simulate( "keydown", { keyCode: $.ui.keyCode.DOWN }); - ok( $menu.find( ".ui-state-active" ).is( "#menu5 :nth-child(7) a" ), - "down keypress selected an item from the first submenu" ); - $menu.trigger( "mouseleave" ); - setTimeout(function() { - equal( $menu.find( "div[aria-expanded='true']" ).length, 0, "first submenu collapsed" ); - start(); - }, 1400); - }, 1050); - }, 700); - }, 350); + $menu.find( ":nth-child(7)" ).find( "div" ).eq( 0 ).children().eq( 0 ).trigger( "mouseover" ); + setTimeout( menumouseleave2, 350 ); + } + function menumouseleave2() { + equal( $menu.find( "div[aria-expanded='true']" ).length, 2, "second submenu expanded" ); + $menu.find( "div[aria-expanded='true']:first" ).trigger( "mouseleave" ); + setTimeout( menumouseleave3, 350 ); + } + function menumouseleave3() { + equal( $menu.find( "div[aria-expanded='true']" ).length, 1, "second submenu collapsed" ); + $menu.trigger( "mouseleave" ); + setTimeout( menumouseleave4, 350 ); + } + function menumouseleave4() { + equal( $menu.find( "div[aria-expanded='true']" ).length, 0, "first submenu collapsed" ); + start(); + } }); @@ -144,13 +151,14 @@ test("handle keyboard navigation on menu without scroll and without submenus", f }); menu_log("keydown",true); + element.focus(); element.simulate( "keydown", { keyCode: $.ui.keyCode.DOWN } ); element.simulate( "keydown", { keyCode: $.ui.keyCode.DOWN } ); - equals( $("#log").html(), "1,0,keydown,", "Keydown DOWN"); + equals( $("#log").html(), "2,1,0,keydown,", "Keydown DOWN"); menu_log("keydown",true); element.simulate( "keydown", { keyCode: $.ui.keyCode.UP } ); - equals( $("#log").html(), "0,keydown,", "Keydown UP"); + equals( $("#log").html(), "1,keydown,", "Keydown UP"); menu_log("keydown",true); element.simulate( "keydown", { keyCode: $.ui.keyCode.LEFT } ); @@ -205,81 +213,90 @@ asyncTest("handle keyboard navigation on menu without scroll and with submenus", }); menu_log("keydown",true); - element.simulate( "keydown", { keyCode: $.ui.keyCode.DOWN } ); - element.simulate( "keydown", { keyCode: $.ui.keyCode.DOWN } ); - equals( $("#log").html(), "1,0,keydown,", "Keydown DOWN"); + element.one( "menufocus", function( event, ui ) { + element.simulate( "keydown", { keyCode: $.ui.keyCode.DOWN } ); + element.simulate( "keydown", { keyCode: $.ui.keyCode.DOWN } ); + equals( $("#log").html(), "2,1,keydown,", "Keydown DOWN"); + setTimeout( menukeyboard1, 50 ); + }); + element.focus(); - menu_log("keydown",true); - element.simulate( "keydown", { keyCode: $.ui.keyCode.UP } ); - equals( $("#log").html(), "0,keydown,", "Keydown UP"); + function menukeyboard1() { + menu_log("keydown",true); + element.simulate( "keydown", { keyCode: $.ui.keyCode.UP } ); + element.simulate( "keydown", { keyCode: $.ui.keyCode.UP } ); + equals( $("#log").html(), "0,1,keydown,", "Keydown UP"); - menu_log("keydown",true); - element.simulate( "keydown", { keyCode: $.ui.keyCode.LEFT } ); - equals( $("#log").html(), "keydown,", "Keydown LEFT (no effect)"); + menu_log("keydown",true); + element.simulate( "keydown", { keyCode: $.ui.keyCode.LEFT } ); + equals( $("#log").html(), "keydown,", "Keydown LEFT (no effect)"); - menu_log("keydown",true); - element.simulate( "keydown", { keyCode: $.ui.keyCode.DOWN } ); - element.simulate( "keydown", { keyCode: $.ui.keyCode.DOWN } ); - element.simulate( "keydown", { keyCode: $.ui.keyCode.DOWN } ); - element.simulate( "keydown", { keyCode: $.ui.keyCode.DOWN } ); - element.simulate( "keydown", { keyCode: $.ui.keyCode.RIGHT } ); + menu_log("keydown",true); + element.simulate( "keydown", { keyCode: $.ui.keyCode.DOWN } ); + element.simulate( "keydown", { keyCode: $.ui.keyCode.DOWN } ); + element.simulate( "keydown", { keyCode: $.ui.keyCode.DOWN } ); + element.simulate( "keydown", { keyCode: $.ui.keyCode.DOWN } ); + element.simulate( "keydown", { keyCode: $.ui.keyCode.RIGHT } ); - setTimeout( function() { - equals( $("#log").html(), "0,4,3,2,1,keydown,", "Keydown RIGHT (open submenu)"); - }, 50); + setTimeout( function() { + equals( $("#log").html(), "0,4,3,2,1,keydown,", "Keydown RIGHT (open submenu)"); + }, 50); + setTimeout( menukeyboard2, 50 ); + } - setTimeout( function() { + function menukeyboard2() { menu_log("keydown",true); element.simulate( "keydown", { keyCode: $.ui.keyCode.LEFT } ); equals( $("#log").html(), "4,keydown,", "Keydown LEFT (close submenu)"); //re-open submenu element.simulate( "keydown", { keyCode: $.ui.keyCode.RIGHT } ); + setTimeout( menukeyboard3, 50 ); + } - setTimeout( function() { - menu_log("keydown",true); - element.simulate( "keydown", { keyCode: $.ui.keyCode.PAGE_DOWN } ); - equals( $("#log").html(), "2,keydown,", "Keydown PAGE_DOWN"); - - menu_log("keydown",true); - element.simulate( "keydown", { keyCode: $.ui.keyCode.PAGE_DOWN } ); - equals( $("#log").html(), "keydown,", "Keydown PAGE_DOWN (no effect)"); + function menukeyboard3() { + menu_log("keydown",true); + element.simulate( "keydown", { keyCode: $.ui.keyCode.PAGE_DOWN } ); + equals( $("#log").html(), "2,keydown,", "Keydown PAGE_DOWN"); - menu_log("keydown",true); - element.simulate( "keydown", { keyCode: $.ui.keyCode.PAGE_UP } ); - equals( $("#log").html(), "0,keydown,", "Keydown PAGE_UP"); + menu_log("keydown",true); + element.simulate( "keydown", { keyCode: $.ui.keyCode.PAGE_DOWN } ); + equals( $("#log").html(), "keydown,", "Keydown PAGE_DOWN (no effect)"); - menu_log("keydown",true); - element.simulate( "keydown", { keyCode: $.ui.keyCode.PAGE_UP } ); - equals( $("#log").html(), "keydown,", "Keydown PAGE_UP (no effect)"); + menu_log("keydown",true); + element.simulate( "keydown", { keyCode: $.ui.keyCode.PAGE_UP } ); + equals( $("#log").html(), "0,keydown,", "Keydown PAGE_UP"); - menu_log("keydown",true); - element.simulate( "keydown", { keyCode: $.ui.keyCode.END } ); - equals( $("#log").html(), "2,keydown,", "Keydown END"); + menu_log("keydown",true); + element.simulate( "keydown", { keyCode: $.ui.keyCode.PAGE_UP } ); + equals( $("#log").html(), "keydown,", "Keydown PAGE_UP (no effect)"); - menu_log("keydown",true); - element.simulate( "keydown", { keyCode: $.ui.keyCode.HOME } ); - equals( $("#log").html(), "0,keydown,", "Keydown HOME"); + menu_log("keydown",true); + element.simulate( "keydown", { keyCode: $.ui.keyCode.END } ); + equals( $("#log").html(), "2,keydown,", "Keydown END"); - menu_log("keydown",true); - element.simulate( "keydown", { keyCode: $.ui.keyCode.ESCAPE } ); - equals( $("#log").html(), "4,keydown,", "Keydown ESCAPE (close submenu)"); + menu_log("keydown",true); + element.simulate( "keydown", { keyCode: $.ui.keyCode.HOME } ); + equals( $("#log").html(), "0,keydown,", "Keydown HOME"); - menu_log("keydown",true); - element.simulate( "keydown", { keyCode: $.ui.keyCode.ENTER } ); + menu_log("keydown",true); + element.simulate( "keydown", { keyCode: $.ui.keyCode.ESCAPE } ); + equals( $("#log").html(), "4,keydown,", "Keydown ESCAPE (close submenu)"); - setTimeout( function() { - equals( $("#log").html(), "0,keydown,", "Keydown ENTER (open submenu)"); + menu_log("keydown",true); + element.simulate( "keydown", { keyCode: $.ui.keyCode.ENTER } ); + setTimeout( menukeyboard4, 50 ); + } - menu_log("keydown",true); - element.simulate( "keydown", { keyCode: $.ui.keyCode.ENTER } ); - equals( $("#log").html(), "Ada,keydown,", "Keydown ENTER (select item)"); + function menukeyboard4() { + equals( $("#log").html(), "0,keydown,", "Keydown ENTER (open submenu)"); - start(); - }, 200); - }, 150); - }, 100); + menu_log("keydown",true); + element.simulate( "keydown", { keyCode: $.ui.keyCode.ENTER } ); + equals( $("#log").html(), "Ada,keydown,", "Keydown ENTER (select item)"); + start(); + } }); test("handle keyboard navigation on menu with scroll and without submenus", function() { @@ -294,13 +311,15 @@ test("handle keyboard navigation on menu with scroll and without submenus", func }); menu_log("keydown",true); + element.focus(); element.simulate( "keydown", { keyCode: $.ui.keyCode.DOWN } ); element.simulate( "keydown", { keyCode: $.ui.keyCode.DOWN } ); - equals( $("#log").html(), "1,0,keydown,", "Keydown DOWN"); + equals( $("#log").html(), "2,1,0,keydown,", "Keydown DOWN"); menu_log("keydown",true); element.simulate( "keydown", { keyCode: $.ui.keyCode.UP } ); - equals( $("#log").html(), "0,keydown,", "Keydown UP"); + element.simulate( "keydown", { keyCode: $.ui.keyCode.UP } ); + equals( $("#log").html(), "0,1,keydown,", "Keydown UP"); menu_log("keydown",true); element.simulate( "keydown", { keyCode: $.ui.keyCode.LEFT } ); @@ -363,78 +382,88 @@ asyncTest("handle keyboard navigation on menu with scroll and with submenus", fu }); menu_log("keydown",true); - element.simulate( "keydown", { keyCode: $.ui.keyCode.DOWN } ); - element.simulate( "keydown", { keyCode: $.ui.keyCode.DOWN } ); - equals( $("#log").html(), "1,0,keydown,", "Keydown DOWN"); + element.one( "menufocus", function( event, ui ) { + element.simulate( "keydown", { keyCode: $.ui.keyCode.DOWN } ); + element.simulate( "keydown", { keyCode: $.ui.keyCode.DOWN } ); + equals( $("#log").html(), "2,1,keydown,", "Keydown DOWN"); + setTimeout( menukeyboard1, 50 ); + }); + element.focus(); + - menu_log("keydown",true); - element.simulate( "keydown", { keyCode: $.ui.keyCode.UP } ); - equals( $("#log").html(), "0,keydown,", "Keydown UP"); + function menukeyboard1() { + menu_log("keydown",true); + element.simulate( "keydown", { keyCode: $.ui.keyCode.UP } ); + element.simulate( "keydown", { keyCode: $.ui.keyCode.UP } ); + equals( $("#log").html(), "0,1,keydown,", "Keydown UP"); - menu_log("keydown",true); - element.simulate( "keydown", { keyCode: $.ui.keyCode.LEFT } ); - equals( $("#log").html(), "keydown,", "Keydown LEFT (no effect)"); + menu_log("keydown",true); + element.simulate( "keydown", { keyCode: $.ui.keyCode.LEFT } ); + equals( $("#log").html(), "keydown,", "Keydown LEFT (no effect)"); - menu_log("keydown",true); - element.simulate( "keydown", { keyCode: $.ui.keyCode.DOWN } ); - element.simulate( "keydown", { keyCode: $.ui.keyCode.RIGHT } ); + menu_log("keydown",true); + element.simulate( "keydown", { keyCode: $.ui.keyCode.DOWN } ); + element.simulate( "keydown", { keyCode: $.ui.keyCode.RIGHT } ); - setTimeout( function() { - equals( $("#log").html(), "0,1,keydown,", "Keydown RIGHT (open submenu)"); - }, 50); + setTimeout( function() { + equals( $("#log").html(), "0,1,keydown,", "Keydown RIGHT (open submenu)"); + }, 50); + setTimeout( menukeyboard2, 50 ); + } - setTimeout( function() { + function menukeyboard2() { menu_log("keydown",true); element.simulate( "keydown", { keyCode: $.ui.keyCode.LEFT } ); equals( $("#log").html(), "1,keydown,", "Keydown LEFT (close submenu)"); //re-open submenu element.simulate( "keydown", { keyCode: $.ui.keyCode.RIGHT } ); + setTimeout( menukeyboard3, 50 ); + } - setTimeout( function() { - menu_log("keydown",true); - element.simulate( "keydown", { keyCode: $.ui.keyCode.PAGE_DOWN } ); - equals( $("#log").html(), "10,keydown,", "Keydown PAGE_DOWN"); - - menu_log("keydown",true); - element.simulate( "keydown", { keyCode: $.ui.keyCode.PAGE_DOWN } ); - equals( $("#log").html(), "20,keydown,", "Keydown PAGE_DOWN"); + function menukeyboard3() { + menu_log("keydown",true); + element.simulate( "keydown", { keyCode: $.ui.keyCode.PAGE_DOWN } ); + equals( $("#log").html(), "10,keydown,", "Keydown PAGE_DOWN"); - menu_log("keydown",true); - element.simulate( "keydown", { keyCode: $.ui.keyCode.PAGE_UP } ); - equals( $("#log").html(), "10,keydown,", "Keydown PAGE_UP"); + menu_log("keydown",true); + element.simulate( "keydown", { keyCode: $.ui.keyCode.PAGE_DOWN } ); + equals( $("#log").html(), "20,keydown,", "Keydown PAGE_DOWN"); - menu_log("keydown",true); - element.simulate( "keydown", { keyCode: $.ui.keyCode.PAGE_UP } ); - equals( $("#log").html(), "0,keydown,", "Keydown PAGE_UP"); + menu_log("keydown",true); + element.simulate( "keydown", { keyCode: $.ui.keyCode.PAGE_UP } ); + equals( $("#log").html(), "10,keydown,", "Keydown PAGE_UP"); - menu_log("keydown",true); - element.simulate( "keydown", { keyCode: $.ui.keyCode.END } ); - equals( $("#log").html(), "27,keydown,", "Keydown END"); + menu_log("keydown",true); + element.simulate( "keydown", { keyCode: $.ui.keyCode.PAGE_UP } ); + equals( $("#log").html(), "0,keydown,", "Keydown PAGE_UP"); - menu_log("keydown",true); - element.simulate( "keydown", { keyCode: $.ui.keyCode.HOME } ); - equals( $("#log").html(), "0,keydown,", "Keydown HOME"); + menu_log("keydown",true); + element.simulate( "keydown", { keyCode: $.ui.keyCode.END } ); + equals( $("#log").html(), "27,keydown,", "Keydown END"); - menu_log("keydown",true); - element.simulate( "keydown", { keyCode: $.ui.keyCode.ESCAPE } ); - equals( $("#log").html(), "1,keydown,", "Keydown ESCAPE (close submenu)"); + menu_log("keydown",true); + element.simulate( "keydown", { keyCode: $.ui.keyCode.HOME } ); + equals( $("#log").html(), "0,keydown,", "Keydown HOME"); - menu_log("keydown",true); - element.simulate( "keydown", { keyCode: $.ui.keyCode.ENTER } ); + menu_log("keydown",true); + element.simulate( "keydown", { keyCode: $.ui.keyCode.ESCAPE } ); + equals( $("#log").html(), "1,keydown,", "Keydown ESCAPE (close submenu)"); - setTimeout( function() { - equals( $("#log").html(), "0,keydown,", "Keydown ENTER (open submenu)"); + menu_log("keydown",true); + element.simulate( "keydown", { keyCode: $.ui.keyCode.ENTER } ); + setTimeout( menukeyboard4, 50 ); + } - menu_log("keydown",true); - element.simulate( "keydown", { keyCode: $.ui.keyCode.ENTER } ); - equals( $("#log").html(), "Aberdeen,keydown,", "Keydown ENTER (select item)"); + function menukeyboard4() { + equals( $("#log").html(), "0,keydown,", "Keydown ENTER (open submenu)"); - start(); - }, 200); - }, 150); - }, 100); + menu_log("keydown",true); + element.simulate( "keydown", { keyCode: $.ui.keyCode.ENTER } ); + equals( $("#log").html(), "Aberdeen,keydown,", "Keydown ENTER (select item)"); + start(); + } }); })(jQuery); diff --git a/tests/unit/menu/menu_methods.js b/tests/unit/menu/menu_methods.js index 0ecaf7328..3bcab3361 100644 --- a/tests/unit/menu/menu_methods.js +++ b/tests/unit/menu/menu_methods.js @@ -5,6 +5,36 @@ module("menu: methods"); +test( "enable/disable", function() { + expect( 3 ); + var menu = $( "#menu1" ).menu({ + select: function(event, ui) { + menu_log(); + } + }); + menu.menu("disable"); + ok(menu.is(".ui-state-disabled"),"Missing ui-state-disabled class"); + menu_log("click",true); + menu_click(menu,"1"); + menu_log("afterclick"); + menu.menu("enable"); + ok(menu.not(".ui-state-disabled"),"Has ui-state-disabled class"); + menu_log("click"); + menu_click(menu,"1"); + menu_log("afterclick"); + equals( $("#log").html(), "afterclick,1,click,afterclick,click,", "Click order not valid."); +}); + +test( "refresh", function() { + expect( 3 ); + var menu = $( "#menu1" ).menu(); + equals(menu.find(".ui-menu-item").length,5,"Incorrect number of menu items"); + menu.append("<li><a href='#'>test item</a></li>").menu("refresh"); + equals(menu.find(".ui-menu-item").length,6,"Incorrect number of menu items"); + menu.find(".ui-menu-item:last").remove().end().menu("refresh"); + equals(menu.find(".ui-menu-item").length,5,"Incorrect number of menu items"); +}); + test("destroy", function() { domEqual("#menu1", function() { $("#menu1").menu().menu("destroy"); diff --git a/tests/unit/menu/menu_options.js b/tests/unit/menu/menu_options.js index 03822fd74..479aab0d1 100644 --- a/tests/unit/menu/menu_options.js +++ b/tests/unit/menu/menu_options.js @@ -5,6 +5,34 @@ module("menu: options"); +test( "{ disabled: true }", function() { + expect( 2 ); + var menu = $( "#menu1" ).menu({ + disabled: true, + select: function(event, ui) { + menu_log(); + } + }); + ok(menu.is(".ui-state-disabled"),"Missing ui-state-disabled class"); + menu_log("click",true); + menu_click(menu,"1"); + menu_log("afterclick"); + equals( $("#log").html(), "afterclick,click,", "Click order not valid."); +}); +test( "{ disabled: false }", function() { + expect( 2 ); + var menu = $( "#menu1" ).menu({ + disabled: false, + select: function(event, ui) { + menu_log(); + } + }); + ok(menu.not(".ui-state-disabled"),"Has ui-state-disabled class"); + menu_log("click",true); + menu_click(menu,"1"); + menu_log("afterclick"); + equals( $("#log").html(), "afterclick,1,click,", "Click order not valid."); +}); })(jQuery); diff --git a/tests/unit/tabs/tabs_deprecated.js b/tests/unit/tabs/tabs_deprecated.js index 1323c774a..d0d13fa84 100644 --- a/tests/unit/tabs/tabs_deprecated.js +++ b/tests/unit/tabs/tabs_deprecated.js @@ -281,7 +281,7 @@ test( "enable", function() { var element = $( "#tabs1" ).tabs({ disabled: [ 0, 1 ], - enable: function ( event, ui ) { + enable: function( event, ui ) { equals( ui.tab, element.find( ".ui-tabs-nav a" )[ 1 ], "ui.tab" ); equals( ui.panel, element.find( ".ui-tabs-panel" )[ 1 ], "ui.panel" ); equals( ui.index, 1, "ui.index" ); @@ -296,10 +296,10 @@ test( "disable", function() { expect( 3 ); var element = $( "#tabs1" ).tabs({ - disable: function ( event, ui ) { - equals( ui.tab, element.find( ".ui-tabs-nav a" )[ 1 ], "ui.tab" ); - equals( ui.panel, element.find( ".ui-tabs-panel" )[ 1 ], "ui.panel" ); - equals( ui.index, 1, "ui.index" ); + disable: function( event, ui ) { + equals( ui.tab, element.find( ".ui-tabs-nav a" )[ 1 ], "ui.tab" ); + equals( ui.panel, element.find( ".ui-tabs-panel" )[ 1 ], "ui.panel" ); + equals( ui.index, 1, "ui.index" ); } }); element.tabs( "disable", 1 ); diff --git a/tests/unit/widget/widget_core.js b/tests/unit/widget/widget_core.js index df83abe91..86fa658aa 100644 --- a/tests/unit/widget/widget_core.js +++ b/tests/unit/widget/widget_core.js @@ -1050,11 +1050,54 @@ test( "redefine", function() { } }); - var instance = new $.ui.testWidget(); + var instance = new $.ui.testWidget({}); instance.method( "foo" ); equal( $.ui.testWidget.foo, "bar", "static properties remain" ); }); +test( "redefine deep prototype chain", function() { + expect( 8 ); + $.widget( "ui.testWidget", { + method: function( str ) { + strictEqual( this, instance, "original invoked with correct this" ); + equal( str, "level 4", "original invoked with correct parameter" ); + } + }); + $.widget( "ui.testWidget2", $.ui.testWidget, { + method: function( str ) { + strictEqual( this, instance, "testWidget2 invoked with correct this" ); + equal( str, "level 2", "testWidget2 invoked with correct parameter" ); + this._super( "level 3" ); + } + }); + $.widget( "ui.testWidget3", $.ui.testWidget2, { + method: function( str ) { + strictEqual( this, instance, "testWidget3 invoked with correct this" ); + equal( str, "level 1", "testWidget3 invoked with correct parameter" ); + this._super( "level 2" ); + } + }); + // redefine testWidget after other widgets have inherited from it + // this tests whether the inheriting widgets get updated prototype chains + $.widget( "ui.testWidget", $.ui.testWidget, { + method: function( str ) { + strictEqual( this, instance, "new invoked with correct this" ); + equal( str, "level 3", "new invoked with correct parameter" ); + this._super( "level 4" ); + } + }); + // redefine testWidget3 after it has been automatically redefined + // this tests whether we properly handle _super() when the topmost prototype + // doesn't have the method defined + $.widget( "ui.testWidget3", $.ui.testWidget3, {} ); + + var instance = new $.ui.testWidget3({}); + instance.method( "level 1" ); + + delete $.ui.testWidget3; + delete $.ui.testWidget2; +}); + asyncTest( "_delay", function() { expect( 6 ); var order = 0, diff --git a/tests/visual/dialog/dialog_on_page_with_large_dom.html b/tests/visual/dialog/dialog_on_page_with_large_dom.html index c7c105696..bc87aec09 100644 --- a/tests/visual/dialog/dialog_on_page_with_large_dom.html +++ b/tests/visual/dialog/dialog_on_page_with_large_dom.html @@ -1,26 +1,36 @@ -<!DOCTYPE html> +<!doctype html> <html lang="en"> <head> - <meta charset="UTF-8" /> - <title>Dialog Visual Test : Modal Dialog in Large DOM</title> - <link rel="stylesheet" href="../visual.css" type="text/css" /> - <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css"> - <script type="text/javascript" src="../../../jquery-1.7.1.js"></script> - <script type="text/javascript" src="../../../external/jquery.bgiframe-2.1.2.js"></script> - <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script> - <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script> - <script type="text/javascript" src="../../../ui/jquery.ui.draggable.js"></script> - <script type="text/javascript" src="../../../ui/jquery.ui.position.js"></script> - <script type="text/javascript" src="../../../ui/jquery.ui.resizable.js"></script> - <script type="text/javascript" src="../../../ui/jquery.ui.dialog.js"></script> - <script type="text/javascript"> + <meta charset="utf-8"> + <title>Dialog Visual Test - Modal Dialog in Large DOM</title> + <link rel="stylesheet" href="../visual.css"> + <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css"> + <script src="../../../jquery-1.7.1.js"></script> + <script src="../../../external/jquery.bgiframe-2.1.2.js"></script> + <script src="../../../ui/jquery.ui.core.js"></script> + <script src="../../../ui/jquery.ui.position.js"></script> + <script src="../../../ui/jquery.ui.widget.js"></script> + <script src="../../../ui/jquery.ui.mouse.js"></script> + <script src="../../../ui/jquery.ui.draggable.js"></script> + <script src="../../../ui/jquery.ui.resizable.js"></script> + <script src="../../../ui/jquery.ui.dialog.js"></script> + <script> $(function() { - $("#dialog").dialog({ + var start, + html = new Array( 500 ).join( $( "#template" ).html() ); + $( html ).appendTo( "body" ); + + start = $.now(); + $( "#dialog" ).dialog({ modal: true, autoOpen: false }); - $('#opener').click(function() { - $('#dialog').dialog('open'); + $( "<li>Create: " + ($.now() - start) + "ms</li>" ).appendTo( "#log" ); + + $( "#opener" ).click(function() { + start = $.now(); + $( "#dialog" ).dialog( "open" ); + $( "<li>Open: " + ($.now() - start) + "ms</li>" ).appendTo( "#log" ); }); }); </script> @@ -33,2931 +43,29 @@ <input type="text"> </div> -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> - -<div> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="text"> -<input type="checkbox"><input type="checkbox"><input type="checkbox"> -<select> - <option value="a">option</option> - <option value="b">option</option> - <option value="c">option</option> - <option value="d">option</option> - <option value="e">option</option> - <option value="f">option</option> - <option value="g">option</option> - <option value="h">option</option> - <option value="i">option</option> -</select> -</div> +<ul id="log"></ul> + +<script type="text/html" id="template"> +<div><div><div><div><div><div><div><div><div><div> +<div><div><div><div><div><div><div><div><div><div> +<div><div><div><div><div><div><div><div><div><div> +<div><div><div><div><div><div><div><div><div><div> +<div><div><div><div><div><div><div><div><div><div> +<div><p>This <span>is</span> <span>a</span> <strong>large</strong> <abbr>DOM</abbr></p>.</div> +<input> +<select> + <option>option 1</option> + <option>option 2</option> + <option>option 3</option> + <option>option 4</option> + <option>option 5</option> +</select> +</div></div></div></div></div></div></div></div></div></div> +</div></div></div></div></div></div></div></div></div></div> +</div></div></div></div></div></div></div></div></div></div> +</div></div></div></div></div></div></div></div></div></div> +</div></div></div></div></div></div></div></div></div></div> +</script> </body> </html> diff --git a/tests/visual/menu/drilldown.html b/tests/visual/menu/drilldown.html index a2ae9e88f..781f5d88a 100644 --- a/tests/visual/menu/drilldown.html +++ b/tests/visual/menu/drilldown.html @@ -21,7 +21,7 @@ $.widget("ui.drilldown", { _init: function() { - var self = this; + var that = this; this.active = this.element.find(">ul").attr("tabindex", 0); // hide submenus and create indicator icons @@ -31,18 +31,18 @@ // disable built-in key handling input: $(), focus: function(event, ui) { - self.activeItem = ui.item; + that.activeItem = ui.item; }, select: function(event, ui) { - if (this != self.active[0]) { + if (this != that.active[0]) { return; } var nested = $(">ul", ui.item); if (nested.length) { - self._open(nested); + that._open(nested); } else { - self.element.find("h3").text(ui.item.text()); - self.options.select.apply(this, arguments); + that.element.find("h3").text(ui.item.text()); + that.options.select.apply(this, arguments); } } }); @@ -52,7 +52,7 @@ primary: "ui-icon-carat-1-w" } }).click(function() { - self.up(); + that.up(); return false; }).hide(); }, diff --git a/tests/visual/menu/menu.html b/tests/visual/menu/menu.html index 0715ac7f7..16ba6ae45 100644 --- a/tests/visual/menu/menu.html +++ b/tests/visual/menu/menu.html @@ -74,14 +74,14 @@ </ul> <ul id="menu2"> - <li><a href="#">Aberdeen</a></li> + <li class="ui-state-disabled"><a href="#">Aberdeen</a></li> <li><a href="#">Ada</a></li> <li><a href="#">Adamsville</a></li> <li><a href="#">Addyston</a></li> <li> <a href="#">Delphi</a> <ul> - <li><a href="#">Ada</a></li> + <li class="ui-state-disabled"><a href="#">Ada</a></li> <li><a href="#">Saarland</a></li> <li><a href="#">Salzburg</a></li> </ul> @@ -109,11 +109,12 @@ <li><a href="#">Perch</a></li> </ul> </li> + <li class="ui-state-disabled"><a href="#">Amesville</a></li> </ul> <ul id="menu3"> <li><a href="#"><span class="ui-icon ui-icon-print"></span>Aberdeen</a></li> - <li><a href="#"><span class="ui-icon ui-icon-scissors"></span>Ada</a></li> + <li class="ui-state-disabled"><a href="#"><span class="ui-icon ui-icon-scissors"></span>Ada</a></li> <li><a href="#">Adamsville</a></li> <li><a href="#"><span class="ui-icon ui-icon-wrench"></span>Addyston</a></li> <li> @@ -193,7 +194,7 @@ <div id="menu5"> <blockquote><a href="#">Aberdeen</a></blockquote> <blockquote><a href="#">Ada</a></blockquote> - <blockquote><a href="#">Adamsville</a></blockquote> + <blockquote class="ui-state-disabled"><a href="#">Adamsville</a></blockquote> <blockquote><a href="#">Addyston</a></blockquote> <blockquote> <a href="#">Delphi</a> @@ -243,7 +244,7 @@ <span class="address-content">Bloomsburg, PA 12345</span> </a> </div> - <div class="address-item"> + <div class="address-item ui-state-disabled"> <a href="#"> <span class="address-header">James Doe</span> <span class="address-content">78 West Main St Apt 3A</span> diff --git a/themes/base/jquery.ui.accordion.css b/themes/base/jquery.ui.accordion.css index dfc98c226..721ef336e 100644 --- a/themes/base/jquery.ui.accordion.css +++ b/themes/base/jquery.ui.accordion.css @@ -9,10 +9,11 @@ */ /* IE/Win - Fix animation bug - #4615 */ .ui-accordion { width: 100%; } -.ui-accordion .ui-accordion-header { cursor: pointer; position: relative; margin-top: 1px; zoom: 1; } -.ui-accordion .ui-accordion-header-active { border-bottom: 0 !important; } +.ui-accordion .ui-accordion-header { cursor: pointer; position: relative; margin-top: 2px; zoom: 1; } .ui-accordion .ui-accordion-heading { display: block; font-size: 1em; padding: .5em .5em .5em .7em; } -.ui-accordion-icons .ui-accordion-heading { padding-left: 2.2em; } +.ui-accordion-icons a.ui-accordion-heading { padding-left: 2.2em; } +.ui-accordion-noicons a.ui-accordion-heading { padding-left: .7em; } +.ui-accordion-icons .ui-accordion-icons a.ui-accordion-heading { padding-left: 2.2em; } .ui-accordion .ui-accordion-header .ui-accordion-header-icon { position: absolute; left: .5em; top: 50%; margin-top: -8px; } -.ui-accordion .ui-accordion-content { padding: 1em 2.2em; border-top: 0; margin-top: -2px; position: relative; top: 1px; margin-bottom: 2px; overflow: auto; display: none; zoom: 1; } +.ui-accordion .ui-accordion-content { padding: 1em 2.2em; border-top: 0; overflow: auto; display: none; zoom: 1; } .ui-accordion .ui-accordion-content-active { display: block; } diff --git a/themes/base/jquery.ui.menu.css b/themes/base/jquery.ui.menu.css index 33a9498fb..2df00733f 100644 --- a/themes/base/jquery.ui.menu.css +++ b/themes/base/jquery.ui.menu.css @@ -14,7 +14,7 @@ .ui-menu .ui-menu-item a.ui-state-focus, .ui-menu .ui-menu-item a.ui-state-active { font-weight: normal; margin: -1px; } -.ui-menu .ui-state-disabled { font-weight: normal; padding: .0em .4em; margin: .4em 0 .2em; line-height: 1.5; } +.ui-menu .ui-state-disabled { font-weight: normal; margin: .4em 0 .2em; line-height: 1.5; } /* icon support */ .ui-menu-icons { position: relative; } diff --git a/ui/i18n/jquery.ui.datepicker-he.js b/ui/i18n/jquery.ui.datepicker-he.js index 58ea8c6d8..b9e8deec5 100644 --- a/ui/i18n/jquery.ui.datepicker-he.js +++ b/ui/i18n/jquery.ui.datepicker-he.js @@ -8,8 +8,8 @@ jQuery(function($){ currentText: 'היום', monthNames: ['ינואר','פברואר','מרץ','אפריל','מאי','יוני', 'יולי','אוגוסט','ספטמבר','אוקטובר','נובמבר','דצמבר'], - monthNamesShort: ['1','2','3','4','5','6', - '7','8','9','10','11','12'], + monthNamesShort: ['ינו','פבר','מרץ','אפר','מאי','יוני', + 'יולי','אוג','ספט','אוק','נוב','דצמ'], dayNames: ['ראשון','שני','שלישי','רביעי','חמישי','שישי','שבת'], dayNamesShort: ['א\'','ב\'','ג\'','ד\'','ה\'','ו\'','שבת'], dayNamesMin: ['א\'','ב\'','ג\'','ד\'','ה\'','ו\'','שבת'], diff --git a/ui/i18n/jquery.ui.datepicker-hi.js b/ui/i18n/jquery.ui.datepicker-hi.js new file mode 100644 index 000000000..d75e98ead --- /dev/null +++ b/ui/i18n/jquery.ui.datepicker-hi.js @@ -0,0 +1,23 @@ +/* Hindi initialisation for the jQuery UI date picker plugin. */ +/* Written by Michael Dawart. */ +jQuery(function($){ + $.datepicker.regional['hi'] = { + closeText: 'होकर', + prevText: 'अगला', + nextText: 'नेक्स्ट', + currentText: 'आज', + monthNames: ['जनवरी ','फरवरी','मार्च','अप्रेल','मै','जून', + 'जूलाई','अगस्त ','सितम्बर','आक्टोबर','नवम्बर','दिसम्बर'], + monthNamesShort: ['जन', 'फर', 'मार्च', 'अप्रेल', 'मै', 'जून', + 'जूलाई', 'अग', 'सित', 'आक्ट', 'नव', 'िद'], + dayNames: ['रविवासर', 'सोमवासर', 'मंगलवासर', 'बुधवासर', 'गुरुवासर', 'शुक्रवासर', 'शनिवासर'], + dayNamesShort: ['रवि', 'सोम', 'मंगल', 'बुध', 'गुरु', 'शुक्र', 'शनि'], + dayNamesMin: ['रवि', 'सोम', 'मंगल', 'बुध', 'गुरु', 'शुक्र', 'शनि'], + weekHeader: 'हफ्ता', + dateFormat: 'mm/dd/yy', + firstDay: 1, + isRTL: false, + showMonthAfterYear: false, + yearSuffix: ''}; + $.datepicker.setDefaults($.datepicker.regional['hi']); +}); diff --git a/ui/i18n/jquery.ui.datepicker-km.js b/ui/i18n/jquery.ui.datepicker-km.js new file mode 100644 index 000000000..f9c4e3a02 --- /dev/null +++ b/ui/i18n/jquery.ui.datepicker-km.js @@ -0,0 +1,23 @@ +/* Khmer initialisation for the jQuery calendar extension. */ +/* Written by Chandara Om (chandara.teacher@gmail.com). */ +jQuery(function($){ + $.datepicker.regional['km'] = { + closeText: 'ធ្វើរួច', + prevText: 'មុន', + nextText: 'បន្ទាប់', + currentText: 'ថ្ងៃនេះ', + monthNames: ['មករា','កុម្ភៈ','មីនា','មេសា','ឧសភា','មិថុនា', + 'កក្កដា','សីហា','កញ្ញា','តុលា','វិច្ឆិកា','ធ្នូ'], + monthNamesShort: ['មករា','កុម្ភៈ','មីនា','មេសា','ឧសភា','មិថុនា', + 'កក្កដា','សីហា','កញ្ញា','តុលា','វិច្ឆិកា','ធ្នូ'], + dayNames: ['អាទិត្យ', 'ចន្ទ', 'អង្គារ', 'ពុធ', 'ព្រហស្បតិ៍', 'សុក្រ', 'សៅរ៍'], + dayNamesShort: ['អា', 'ច', 'អ', 'ពុ', 'ព្រហ', 'សុ', 'សៅ'], + dayNamesMin: ['អា', 'ច', 'អ', 'ពុ', 'ព្រហ', 'សុ', 'សៅ'], + weekHeader: 'សប្ដាហ៍', + dateFormat: 'dd-mm-yy', + firstDay: 1, + isRTL: false, + showMonthAfterYear: false, + yearSuffix: ''}; + $.datepicker.setDefaults($.datepicker.regional['km']); +}); diff --git a/ui/jquery.effects.core.js b/ui/jquery.effects.core.js index 233b4f96d..b28e4c4ee 100644 --- a/ui/jquery.effects.core.js +++ b/ui/jquery.effects.core.js @@ -77,7 +77,7 @@ function getColor(elem, attr) { var color; do { - color = $.curCSS(elem, attr); + color = $.css(elem, attr); // Keep going until we find an element that has color, or we hit the body if ( color != "" && color !== "transparent" || $.nodeName(elem, "body") ) @@ -662,229 +662,49 @@ $.fn.extend({ /*********************************** EASING ***********************************/ /******************************************************************************/ -/* - * jQuery Easing v1.3 - http://gsgd.co.uk/sandbox/jquery/easing/ - * - * Uses the built in easing capabilities added In jQuery 1.1 - * to offer multiple easing options - * - * TERMS OF USE - jQuery Easing - * - * Open source under the BSD License. - * - * Copyright 2008 George McGinley Smith - * All rights reserved. - * - * Redistribution and use in source and binary forms, with or without modification, - * are permitted provided that the following conditions are met: - * - * Redistributions of source code must retain the above copyright notice, this list of - * conditions and the following disclaimer. - * Redistributions in binary form must reproduce the above copyright notice, this list - * of conditions and the following disclaimer in the documentation and/or other materials - * provided with the distribution. - * - * Neither the name of the author nor the names of contributors may be used to endorse - * or promote products derived from this software without specific prior written permission. - * - * THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" AND ANY - * EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF - * MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE - * COPYRIGHT OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, - * EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE - * GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED - * AND ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING - * NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED - * OF THE POSSIBILITY OF SUCH DAMAGE. - * -*/ +// based on easing equations from Robert Penner (http://www.robertpenner.com/easing) -// t: current time, b: begInnIng value, c: change In value, d: duration -$.easing.jswing = $.easing.swing; +var baseEasings = {}; -$.extend( $.easing, { - def: "easeOutQuad", - swing: function ( x, t, b, c, d ) { - return $.easing[ $.easing.def ]( x, t, b, c, d ); - }, - easeInQuad: function ( x, t, b, c, d ) { - return c * ( t /= d ) * t + b; - }, - easeOutQuad: function ( x, t, b, c, d ) { - return -c * ( t /= d ) * ( t - 2 ) + b; - }, - easeInOutQuad: function ( x, t, b, c, d ) { - if ( ( t /= d / 2 ) < 1 ) return c / 2 * t * t + b; - return -c / 2 * ( ( --t ) * ( t-2 ) - 1) + b; - }, - easeInCubic: function ( x, t, b, c, d ) { - return c * ( t /= d ) * t * t + b; - }, - easeOutCubic: function ( x, t, b, c, d ) { - return c * ( ( t = t / d - 1 ) * t * t + 1 ) + b; - }, - easeInOutCubic: function ( x, t, b, c, d ) { - if ( ( t /= d / 2 ) < 1 ) return c / 2 * t * t * t + b; - return c / 2 * ( ( t -= 2 ) * t * t + 2) + b; - }, - easeInQuart: function ( x, t, b, c, d ) { - return c * ( t /= d ) * t * t * t + b; - }, - easeOutQuart: function ( x, t, b, c, d ) { - return -c * ( ( t = t / d - 1 ) * t * t * t - 1) + b; - }, - easeInOutQuart: function ( x, t, b, c, d ) { - if ( (t /= d / 2 ) < 1 ) return c / 2 * t * t * t * t + b; - return -c / 2 * ( ( t -= 2 ) * t * t * t - 2) + b; - }, - easeInQuint: function ( x, t, b, c, d ) { - return c * ( t /= d ) * t * t * t * t + b; - }, - easeOutQuint: function ( x, t, b, c, d ) { - return c * ( ( t = t / d - 1 ) * t * t * t * t + 1) + b; - }, - easeInOutQuint: function ( x, t, b, c, d ) { - if ( ( t /= d / 2 ) < 1 ) return c / 2 * t * t * t * t * t + b; - return c / 2 * ( ( t -= 2 ) * t * t * t * t + 2) + b; - }, - easeInSine: function ( x, t, b, c, d ) { - return -c * Math.cos( t / d * ( Math.PI / 2 ) ) + c + b; - }, - easeOutSine: function ( x, t, b, c, d ) { - return c * Math.sin( t / d * ( Math.PI /2 ) ) + b; - }, - easeInOutSine: function ( x, t, b, c, d ) { - return -c / 2 * ( Math.cos( Math.PI * t / d ) - 1 ) + b; - }, - easeInExpo: function ( x, t, b, c, d ) { - return ( t==0 ) ? b : c * Math.pow( 2, 10 * ( t / d - 1) ) + b; - }, - easeOutExpo: function ( x, t, b, c, d ) { - return ( t==d ) ? b + c : c * ( -Math.pow( 2, -10 * t / d) + 1) + b; - }, - easeInOutExpo: function ( x, t, b, c, d ) { - if ( t==0 ) return b; - if ( t==d ) return b + c; - if ( ( t /= d / 2) < 1) return c / 2 * Math.pow( 2, 10 * (t - 1) ) + b; - return c / 2 * ( -Math.pow( 2, -10 * --t ) + 2 ) + b; - }, - easeInCirc: function ( x, t, b, c, d ) { - return -c * ( Math.sqrt( 1 - ( t /= d ) * t ) - 1 ) + b; - }, - easeOutCirc: function ( x, t, b, c, d ) { - return c * Math.sqrt( 1 - ( t = t / d - 1 ) * t ) + b; - }, - easeInOutCirc: function ( x, t, b, c, d ) { - if ( ( t /= d / 2) < 1 ) return -c / 2 * ( Math.sqrt( 1 - t * t ) - 1 ) + b; - return c / 2 * ( Math.sqrt( 1 - ( t -= 2 ) * t ) + 1 ) + b; - }, - easeInElastic: function ( x, t, b, c, d ) { - var s = 1.70158, - p = d * 0.3, - a = c; - if ( t == 0 ) return b; - if ( ( t /= d ) == 1 ) return b+c; - if ( a < Math.abs( c ) ) { - a = c; - s = p / 4; - } else { - s = p / ( 2 * Math.PI ) * Math.asin( c / a ); - } - return - ( a * Math.pow( 2, 10 * ( t -= 1 ) ) * Math.sin( ( t * d - s) * ( 2 * Math.PI ) / p ) ) + b; - }, - easeOutElastic: function ( x, t, b, c, d ) { - var s = 1.70158, - p = d * 0.3, - a = c; - if ( t == 0 ) return b; - if ( ( t /= d ) == 1 ) return b+c; - if ( a < Math.abs( c ) ) { - a = c; - s = p / 4; - } else { - s = p / ( 2 * Math.PI ) * Math.asin( c / a ); - } - return a * Math.pow( 2, -10 * t ) * Math.sin( ( t * d - s ) * ( 2 * Math.PI ) / p ) + c + b; - }, - easeInOutElastic: function ( x, t, b, c, d ) { - var s = 1.70158, - p = d * ( 0.3 * 1.5 ), - a = c; - if ( t == 0 ) return b; - if ( ( t /= d / 2 ) == 2 ) return b+c; - if ( a < Math.abs( c ) ) { - a = c; - s = p / 4; - } else { - s = p / ( 2 * Math.PI ) * Math.asin( c / a ); - } - if ( t < 1 ) return -.5 * ( a * Math.pow( 2, 10 * ( t -= 1 ) ) * Math.sin( ( t * d - s ) * ( 2 * Math.PI ) / p ) ) + b; - return a * Math.pow( 2, -10 * ( t -= 1 ) ) * Math.sin( ( t * d - s ) * ( 2 * Math.PI ) / p ) *.5 + c + b; - }, - easeInBack: function ( x, t, b, c, d, s ) { - if ( s == undefined ) s = 1.70158; - return c * ( t /= d ) * t * ( ( s+1 ) * t - s ) + b; - }, - easeOutBack: function ( x, t, b, c, d, s ) { - if ( s == undefined ) s = 1.70158; - return c * ( ( t = t / d - 1 ) * t * ( ( s + 1 ) * t + s) + 1) + b; +$.each( [ "Quad", "Cubic", "Quart", "Quint", "Expo" ], function( i, name ) { + baseEasings[ name ] = function( p ) { + return Math.pow( p, i + 2 ); + }; +}); + +$.extend( baseEasings, { + Sine: function ( p ) { + return 1 - Math.cos( p * Math.PI / 2 ); }, - easeInOutBack: function ( x, t, b, c, d, s ) { - if ( s == undefined ) s = 1.70158; - if ( ( t /= d / 2 ) < 1 ) return c / 2 * ( t * t * ( ( ( s *= 1.525 ) + 1 ) * t - s ) ) + b; - return c / 2 * ( ( t -= 2 ) * t * ( ( ( s *= 1.525 ) + 1 ) * t + s) + 2) + b; + Circ: function ( p ) { + return 1 - Math.sqrt( 1 - p * p ); }, - easeInBounce: function ( x, t, b, c, d ) { - return c - $.easing.easeOutBounce( x, d - t, 0, c, d ) + b; + Elastic: function( p ) { + return p === 0 || p === 1 ? p : + -Math.pow( 2, 8 * (p - 1) ) * Math.sin( ( (p - 1) * 80 - 7.5 ) * Math.PI / 15 ); }, - easeOutBounce: function ( x, t, b, c, d ) { - if ( ( t /= d ) < ( 1 / 2.75 ) ) { - return c * ( 7.5625 * t * t ) + b; - } else if ( t < ( 2 / 2.75 ) ) { - return c * ( 7.5625 * ( t -= ( 1.5 / 2.75 ) ) * t + .75 ) + b; - } else if ( t < ( 2.5 / 2.75 ) ) { - return c * ( 7.5625 * ( t -= ( 2.25/ 2.75 ) ) * t + .9375 ) + b; - } else { - return c * ( 7.5625 * ( t -= ( 2.625 / 2.75 ) ) * t + .984375 ) + b; - } + Back: function( p ) { + return p * p * ( 3 * p - 2 ); }, - easeInOutBounce: function ( x, t, b, c, d ) { - if ( t < d / 2 ) return $.easing.easeInBounce( x, t * 2, 0, c, d ) * .5 + b; - return $.easing.easeOutBounce( x, t * 2 - d, 0, c, d ) * .5 + c * .5 + b; + Bounce: function ( p ) { + var pow2, + bounce = 4; + + while ( p < ( ( pow2 = Math.pow( 2, --bounce ) ) - 1 ) / 11 ) {} + return 1 / Math.pow( 4, 3 - bounce ) - 7.5625 * Math.pow( ( pow2 * 3 - 2 ) / 22 - p, 2 ); } }); -/* - * - * TERMS OF USE - EASING EQUATIONS - * - * Open source under the BSD License. - * - * Copyright 2001 Robert Penner - * All rights reserved. - * - * Redistribution and use in source and binary forms, with or without modification, - * are permitted provided that the following conditions are met: - * - * Redistributions of source code must retain the above copyright notice, this list of - * conditions and the following disclaimer. - * Redistributions in binary form must reproduce the above copyright notice, this list - * of conditions and the following disclaimer in the documentation and/or other materials - * provided with the distribution. - * - * Neither the name of the author nor the names of contributors may be used to endorse - * or promote products derived from this software without specific prior written permission. - * - * THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" AND ANY - * EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF - * MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE - * COPYRIGHT OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, - * EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE - * GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED - * AND ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING - * NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED - * OF THE POSSIBILITY OF SUCH DAMAGE. - * - */ +$.each( baseEasings, function( name, easeIn ) { + $.easing[ "easeIn" + name ] = easeIn; + $.easing[ "easeOut" + name ] = function( p ) { + return 1 - easeIn( 1 - p ); + }; + $.easing[ "easeInOut" + name ] = function( p ) { + return p < .5 ? + easeIn( p * 2 ) / 2 : + easeIn( p * -2 + 2 ) / -2 + 1; + }; +}); })(jQuery); diff --git a/ui/jquery.ui.accordion.js b/ui/jquery.ui.accordion.js index 127099d59..8731c17ca 100644 --- a/ui/jquery.ui.accordion.js +++ b/ui/jquery.ui.accordion.js @@ -13,12 +13,11 @@ */ (function( $, undefined ) { -// TODO: use ui-accordion-header-active class and fix styling $.widget( "ui.accordion", { version: "@VERSION", options: { active: 0, - animated: "slide", + animate: {}, collapsible: false, event: "click", header: "> li > :first-child,> :not(li):even", @@ -34,19 +33,18 @@ $.widget( "ui.accordion", { }, _create: function() { - var self = this, - options = self.options; + var options = this.options; - self.lastToggle = {}; - self.element.addClass( "ui-accordion ui-widget ui-helper-reset" ); + this.prevShow = this.prevHide = $(); + this.element.addClass( "ui-accordion ui-widget ui-helper-reset" ); - self.headers = self.element.find( options.header ) + this.headers = this.element.find( options.header ) .addClass( "ui-accordion-header ui-helper-reset ui-state-default ui-corner-all" ); - self._hoverable( self.headers ); - self._focusable( self.headers ); - self.headers.find( ":first-child" ).addClass( "ui-accordion-heading" ); + this._hoverable( this.headers ); + this._focusable( this.headers ); + this.headers.find( ":first-child" ).addClass( "ui-accordion-heading" ); - self.headers.next() + this.headers.next() .addClass( "ui-accordion-content ui-helper-reset ui-widget-content ui-corner-bottom" ); // don't allow collapsible: false and active: false @@ -57,26 +55,27 @@ $.widget( "ui.accordion", { if ( options.active < 0 ) { options.active += this.headers.length; } - self.active = self._findActive( options.active ) - .addClass( "ui-state-default ui-state-active" ) + this.active = this._findActive( options.active ) + .addClass( "ui-accordion-header-active ui-state-active" ) .toggleClass( "ui-corner-all" ) .toggleClass( "ui-corner-top" ); - self.active.next().addClass( "ui-accordion-content-active" ); + this.active.next().addClass( "ui-accordion-content-active" ); - self._createIcons(); - self.refresh(); + this._createIcons(); + this.originalHeight = this.element[0].style.height; + this.refresh(); // ARIA - self.element.attr( "role", "tablist" ); + this.element.attr( "role", "tablist" ); - self.headers + this.headers .attr( "role", "tab" ) - .bind( "keydown.accordion", $.proxy( self, "_keydown" ) ) + .bind( "keydown.accordion", $.proxy( this, "_keydown" ) ) .next() .attr( "role", "tabpanel" ); - self.headers - .not( self.active ) + this.headers + .not( this.active ) .attr({ "aria-expanded": "false", "aria-selected": "false", @@ -86,10 +85,10 @@ $.widget( "ui.accordion", { .hide(); // make sure at least one header is in the tab order - if ( !self.active.length ) { - self.headers.eq( 0 ).attr( "tabIndex", 0 ); + if ( !this.active.length ) { + this.headers.eq( 0 ).attr( "tabIndex", 0 ); } else { - self.active.attr({ + this.active.attr({ "aria-expanded": "true", "aria-selected": "true", tabIndex: 0 @@ -98,12 +97,19 @@ $.widget( "ui.accordion", { // only need links in tab order for Safari if ( !$.browser.safari ) { - self.headers.find( "a" ).attr( "tabIndex", -1 ); + this.headers.find( "a" ).attr( "tabIndex", -1 ); } this._setupEvents( options.event ); }, + _getCreateEventData: function() { + return { + header: this.active, + content: !this.active.length ? $() : this.active.next() + }; + }, + _createIcons: function() { var icons = this.options.icons; if ( icons ) { @@ -113,13 +119,15 @@ $.widget( "ui.accordion", { this.active.children( ".ui-accordion-header-icon" ) .removeClass( icons.header ) .addClass( icons.activeHeader ); - this.element.addClass( "ui-accordion-icons" ); + this.headers.addClass( "ui-accordion-icons" ); } }, _destroyIcons: function() { - this.headers.children( ".ui-accordion-header-icon" ).remove(); - this.element.removeClass( "ui-accordion-icons" ); + this.headers + .removeClass( "ui-accordion-icons" ) + .children( ".ui-accordion-header-icon" ) + .remove(); }, _destroy: function() { @@ -131,7 +139,7 @@ $.widget( "ui.accordion", { // clean up headers this.headers .unbind( ".accordion" ) - .removeClass( "ui-accordion-header ui-accordion-disabled ui-helper-reset ui-state-default ui-corner-all ui-state-active ui-state-disabled ui-corner-top" ) + .removeClass( "ui-accordion-header ui-accordion-header-active ui-accordion-disabled ui-helper-reset ui-state-default ui-corner-all ui-state-active ui-state-disabled ui-corner-top" ) .removeAttr( "role" ) .removeAttr( "aria-expanded" ) .removeAttr( "aria-selected" ) @@ -149,6 +157,7 @@ $.widget( "ui.accordion", { .removeAttr( "role" ) .removeClass( "ui-helper-reset ui-widget-content ui-corner-bottom ui-accordion-content ui-accordion-content-active ui-accordion-disabled ui-state-disabled" ); if ( this.options.heightStyle !== "content" ) { + this.element.css( "height", this.originalHeight ); contents.css( "height", "" ); } }, @@ -222,12 +231,12 @@ $.widget( "ui.accordion", { }, refresh: function() { - var options = this.options, + var heightStyle = this.options.heightStyle, parent = this.element.parent(), maxHeight, overflow; - if ( options.heightStyle === "fill" ) { + if ( heightStyle === "fill" ) { // IE 6 treats height like minHeight, so we need to turn off overflow // in order to get a reliable height // we use the minHeight support test because we assume that only @@ -260,7 +269,7 @@ $.widget( "ui.accordion", { $( this ).innerHeight() + $( this ).height() ) ); }) .css( "overflow", "auto" ); - } else if ( options.heightStyle === "auto" ) { + } else if ( heightStyle === "auto" ) { maxHeight = 0; this.headers.next() .each(function() { @@ -269,7 +278,9 @@ $.widget( "ui.accordion", { .height( maxHeight ); } - return this; + if ( heightStyle !== "content" ) { + this.element.height( this.element.height() ); + } }, _activate: function( index ) { @@ -335,15 +346,15 @@ $.widget( "ui.accordion", { // switch classes active - .removeClass( "ui-state-active ui-corner-top" ) - .addClass( "ui-state-default ui-corner-all" ) + .removeClass( "ui-accordion-header-active ui-state-active ui-corner-top" ) + .addClass( "ui-corner-all" ) .children( ".ui-accordion-header-icon" ) .removeClass( options.icons.activeHeader ) .addClass( options.icons.header ); if ( !clickedIsActive ) { clicked - .removeClass( "ui-state-default ui-corner-all" ) - .addClass( "ui-state-active ui-corner-top" ) + .removeClass( "ui-corner-all" ) + .addClass( "ui-accordion-header-active ui-state-active ui-corner-top" ) .children( ".ui-accordion-header-icon" ) .removeClass( options.icons.header ) .addClass( options.icons.activeHeader ); @@ -354,41 +365,20 @@ $.widget( "ui.accordion", { }, _toggle: function( data ) { - var self = this, - options = self.options, - toShow = data.newContent, - toHide = data.oldContent; - - function complete() { - self._completed( data ); - } + var toShow = data.newContent, + toHide = this.prevShow.length ? this.prevShow : data.oldContent; - if ( options.animated ) { - var animations = $.ui.accordion.animations, - animation = options.animated, - additional; - - if ( !animations[ animation ] ) { - additional = { - easing: $.easing[ animation ] ? animation : "slide", - duration: 700 - }; - animation = "slide"; - } + // handle activating a panel during the animation for another activation + this.prevShow.add( this.prevHide ).stop( true, true ); + this.prevShow = toShow; + this.prevHide = toHide; - animations[ animation ]({ - widget: self, - toShow: toShow, - toHide: toHide, - prevShow: self.lastToggle.toShow, - prevHide: self.lastToggle.toHide, - complete: complete, - down: toShow.length && ( !toHide.length || ( toShow.index() < toHide.index() ) ) - }, additional ); + if ( this.options.animate ) { + this._animate( toShow, toHide, data ); } else { toHide.hide(); toShow.show(); - complete(); + this._completed( data ); } // TODO assert that the blur and focus triggers are really necessary, remove otherwise @@ -408,17 +398,51 @@ $.widget( "ui.accordion", { .focus(); }, + _animate: function( toShow, toHide, data ) { + var total, easing, duration, + that = this, + down = toShow.length && + ( !toHide.length || ( toShow.index() < toHide.index() ) ), + animate = this.options.animate || {}, + options = down && animate.down || animate, + complete = function() { + toShow.removeData( "accordionHeight" ); + that._completed( data ); + }; + + if ( typeof options === "number" ) { + duration = options; + } + if ( typeof options === "string" ) { + easing = options; + } + // fall back from options to animation in case of partial down settings + easing = easing || options.easing || animate.easing; + duration = duration || options.duration || animate.duration; + + if ( !toHide.size() ) { + return toShow.animate( showProps, duration, easing, complete ); + } + if ( !toShow.size() ) { + return toHide.animate( hideProps, duration, easing, complete ); + } + + total = toShow.show().outerHeight(); + toHide.animate( hideProps, duration, easing ); + toShow + .hide() + .data( "accordionHeight", { + total: total, + toHide: toHide + }) + .animate( this.options.heightStyle === "content" ? showProps : showPropsAdjust, + duration, easing, complete ); + }, + _completed: function( data ) { var toShow = data.newContent, toHide = data.oldContent; - if ( this.options.heightStyle === "content" ) { - toShow.add( toHide ).css({ - height: "", - overflow: "" - }); - } - // other classes are removed before the animation; this one needs to stay until completed toHide.removeClass( "ui-accordion-content-active" ); // Work around for rendering bug in IE (#5421) @@ -430,113 +454,19 @@ $.widget( "ui.accordion", { } }); -$.extend( $.ui.accordion, { - animations: { - slide: function( options, additions ) { - if ( options.prevShow || options.prevHide ) { - options.prevHide.stop( true, true ); - options.toHide = options.prevShow; - } - - var showOverflow = options.toShow.css( "overflow" ), - hideOverflow = options.toHide.css( "overflow" ), - percentDone = 0, - showProps = {}, - hideProps = {}, - fxAttrs = [ "height", "paddingTop", "paddingBottom" ], - originalWidth; - options = $.extend({ - easing: "swing", - duration: 300 - }, options, additions ); - - options.widget.lastToggle = options; - - if ( !options.toHide.size() ) { - originalWidth = options.toShow[0].style.width; - options.toShow - .show() - .width( options.toShow.width() ) - .hide() - .animate({ - height: "show", - paddingTop: "show", - paddingBottom: "show" - }, { - duration: options.duration, - easing: options.easing, - complete: function() { - options.toShow.width( originalWidth ); - options.complete(); - } - }); - return; - } - if ( !options.toShow.size() ) { - options.toHide.animate({ - height: "hide", - paddingTop: "hide", - paddingBottom: "hide" - }, options ); - return; - } - // fix width before calculating height of hidden element - var s = options.toShow; - originalWidth = s[0].style.width; - s.width( s.parent().width() - - parseFloat( s.css( "paddingLeft" ) ) - - parseFloat( s.css( "paddingRight" ) ) - - ( parseFloat( s.css( "borderLeftWidth" ) ) || 0 ) - - ( parseFloat( s.css( "borderRightWidth" ) ) || 0 ) ); - - $.each( fxAttrs, function( i, prop ) { - hideProps[ prop ] = "hide"; - - var parts = ( "" + $.css( options.toShow[0], prop ) ).match( /^([\d+-.]+)(.*)$/ ), - // work around bug when a panel has no height - #7335 - propVal = prop === "height" && parts[ 1 ] === "0" ? 1 : parts[ 1 ]; - showProps[ prop ] = { - value: propVal, - unit: parts[ 2 ] || "px" - }; - }); - options.toShow.css({ height: 0, overflow: "hidden" }).show(); - options.toHide - .filter( ":hidden" ) - .each( options.complete ) - .end() - .filter( ":visible" ) - .animate( hideProps, { - step: function( now, settings ) { - if ( settings.prop == "height" || settings.prop == "paddingTop" || settings.prop == "paddingBottom" ) { - percentDone = ( settings.end - settings.start === 0 ) ? 0 : - ( settings.now - settings.start ) / ( settings.end - settings.start ); - } - - options.toShow[ 0 ].style[ settings.prop ] = - ( percentDone * showProps[ settings.prop ].value ) - + showProps[ settings.prop ].unit; - }, - duration: options.duration, - easing: options.easing, - complete: function() { - options.toShow.css({ - width: originalWidth, - overflow: showOverflow - }); - options.toHide.css( "overflow", hideOverflow ); - options.complete(); - } - }); - }, - bounceslide: function( options ) { - this.slide( options, { - easing: options.down ? "easeOutBounce" : "swing", - duration: options.down ? 1000 : 200 - }); - } - } -}); +$.fx.step.accordionHeight = function( fx ) { + var elem = $( fx.elem ), + data = elem.data( "accordionHeight" ); + elem.height( data.total - elem.outerHeight() - data.toHide.outerHeight() + elem.height() ); +}; +var hideProps = {}, + showProps = {}, + showPropsAdjust = {}; +hideProps.height = hideProps.paddingTop = hideProps.paddingBottom = + hideProps.borderTopWidth = hideProps.borderBottomWidth = "hide"; +showProps.height = showProps.paddingTop = showProps.paddingBottom = + showProps.borderTopWidth = showProps.borderBottomWidth = "show"; +$.extend( showPropsAdjust, showProps, { accordionHeight: "show" } ); @@ -554,7 +484,7 @@ if ( $.uiBackCompat !== false ) { var _create = prototype._create; prototype._create = function() { if ( this.options.navigation ) { - var self = this, + var that = this, headers = this.element.find( this.options.header ), content = headers.next(), current = headers.add( content ) @@ -564,7 +494,7 @@ if ( $.uiBackCompat !== false ) { if ( current ) { headers.add( content ).each( function( index ) { if ( $.contains( this, current ) ) { - self.options.active = Math.floor( index / 2 ); + that.options.active = Math.floor( index / 2 ); return false; } }); @@ -680,6 +610,40 @@ if ( $.uiBackCompat !== false ) { return ret; }; }( jQuery, jQuery.ui.accordion.prototype ) ); + + // animated option + // NOTE: this only provides support for "slide", "bounceslide", and easings + // not the full $.ui.accordion.animations API + (function( $, prototype ) { + $.extend( prototype.options, { + animate: null, + animated: "slide" + }); + + var _create = prototype._create; + prototype._create = function() { + var options = this.options; + if ( options.animate === null ) { + if ( !options.animated ) { + options.animate = false; + } else if ( options.animated === "slide" ) { + options.animate = 300; + } else if ( options.animated === "bounceslide" ) { + options.animate = { + duration: 200, + down: { + easing: "easeOutBounce", + duration: 1000 + } + } + } else { + options.animate = options.animated; + } + } + + _create.call( this ); + }; + }( jQuery, jQuery.ui.accordion.prototype ) ); } })( jQuery ); diff --git a/ui/jquery.ui.autocomplete.js b/ui/jquery.ui.autocomplete.js index c054ba2dd..e261b9147 100644 --- a/ui/jquery.ui.autocomplete.js +++ b/ui/jquery.ui.autocomplete.js @@ -176,13 +176,14 @@ $.widget( "ui.autocomplete", { return; } + if ( self.cancelBlur ) { + delete self.cancelBlur; + return; + } + clearTimeout( self.searching ); - self.cancelSearch = true; - // clicks on the menu (or a button to trigger a search) will cause a blur event - self.closing = setTimeout(function() { - self.close( event ); - self._change( event ); - }, 150 ); + self.close( event ); + self._change( event ); }); this._initSource(); this.response = function() { @@ -193,6 +194,16 @@ $.widget( "ui.autocomplete", { .appendTo( this.document.find( this.options.appendTo || "body" )[0] ) // prevent the close-on-blur in case of a "slow" click on the menu (long mousedown) .mousedown(function( event ) { + // prevent moving focus out of the text field + event.preventDefault(); + + // IE doesn't prevent moving focus even with event.preventDefault() + // so we set a flag to know when we should ignore the blur event + self.cancelBlur = true; + setTimeout(function() { + delete self.cancelBlur; + }, 1 ); + // clicking on the scrollbar causes focus to shift to the body // but we can't detect a mouseup or a click immediately afterward // so we have to track the next mousedown and close the menu if @@ -209,11 +220,6 @@ $.widget( "ui.autocomplete", { }); }, 1 ); } - - // use another timeout to make sure the blur-event-handler on the input was already triggered - setTimeout(function() { - clearTimeout( self.closing ); - }, 13); }) .menu({ // custom key handling for now @@ -316,7 +322,9 @@ $.widget( "ui.autocomplete", { url: url, data: request, dataType: "json", - autocompleteRequest: ++requestIndex, + context: { + autocompleteRequest: ++requestIndex + }, success: function( data, status ) { if ( this.autocompleteRequest === requestIndex ) { response( data ); @@ -356,7 +364,6 @@ $.widget( "ui.autocomplete", { return this.close( event ); } - clearTimeout( this.closing ); if ( this._trigger( "search", event ) === false ) { return; } @@ -381,7 +388,8 @@ $.widget( "ui.autocomplete", { this._suggest( content ); this._trigger( "open" ); } else { - this.close(); + // use ._close() instead of .close() so we don't cancel future searches + this._close(); } this.pending--; if ( !this.pending ) { @@ -390,6 +398,11 @@ $.widget( "ui.autocomplete", { }, close: function( event ) { + this.cancelSearch = true; + this._close( event ); + }, + + _close: function( event ) { clearTimeout( this.closing ); if ( this.menu.element.is(":visible") ) { this.menu.element.hide(); diff --git a/ui/jquery.ui.button.js b/ui/jquery.ui.button.js index 1c3cf2c64..25f1668a5 100644 --- a/ui/jquery.ui.button.js +++ b/ui/jquery.ui.button.js @@ -66,7 +66,7 @@ $.widget( "ui.button", { this._determineButtonType(); this.hasTitle = !!this.buttonElement.attr( "title" ); - var self = this, + var that = this, options = this.options, toggleButton = this.type === "checkbox" || this.type === "radio", hoverClass = "ui-state-hover" + ( !toggleButton ? " ui-state-active" : "" ), @@ -104,10 +104,10 @@ $.widget( "ui.button", { this.element .bind( "focus.button", function() { // no need to check disabled, focus won't be triggered anyway - self.buttonElement.addClass( focusClass ); + that.buttonElement.addClass( focusClass ); }) .bind( "blur.button", function() { - self.buttonElement.removeClass( focusClass ); + that.buttonElement.removeClass( focusClass ); }); if ( toggleButton ) { @@ -115,7 +115,7 @@ $.widget( "ui.button", { if ( clickDragged ) { return; } - self.refresh(); + that.refresh(); }); // if mouse moves between mousedown and mouseup (drag) set clickDragged flag // prevents issue where button state changes but checkbox/radio checked state @@ -145,7 +145,7 @@ $.widget( "ui.button", { return false; } $( this ).toggleClass( "ui-state-active" ); - self.buttonElement.attr( "aria-pressed", self.element[0].checked ); + that.buttonElement.attr( "aria-pressed", that.element[0].checked ); }); } else if ( this.type === "radio" ) { this.buttonElement.bind( "click.button", function() { @@ -153,9 +153,9 @@ $.widget( "ui.button", { return false; } $( this ).addClass( "ui-state-active" ); - self.buttonElement.attr( "aria-pressed", "true" ); + that.buttonElement.attr( "aria-pressed", "true" ); - var radio = self.element[ 0 ]; + var radio = that.element[ 0 ]; radioGroup( radio ) .not( radio ) .map(function() { @@ -172,7 +172,7 @@ $.widget( "ui.button", { } $( this ).addClass( "ui-state-active" ); lastActive = this; - self.document.one( "mouseup", function() { + that.document.one( "mouseup", function() { lastActive = null; }); }) diff --git a/ui/jquery.ui.core.js b/ui/jquery.ui.core.js index d777d6d49..5f0414ec8 100644 --- a/ui/jquery.ui.core.js +++ b/ui/jquery.ui.core.js @@ -21,23 +21,15 @@ $.extend( $.ui, { version: "@VERSION", keyCode: { - ALT: 18, BACKSPACE: 8, - CAPS_LOCK: 20, COMMA: 188, - COMMAND: 91, - COMMAND_LEFT: 91, // COMMAND - COMMAND_RIGHT: 93, - CONTROL: 17, DELETE: 46, DOWN: 40, END: 35, ENTER: 13, ESCAPE: 27, HOME: 36, - INSERT: 45, LEFT: 37, - MENU: 93, // COMMAND_RIGHT NUMPAD_ADD: 107, NUMPAD_DECIMAL: 110, NUMPAD_DIVIDE: 111, @@ -48,11 +40,9 @@ $.extend( $.ui, { PAGE_UP: 33, PERIOD: 190, RIGHT: 39, - SHIFT: 16, SPACE: 32, TAB: 9, - UP: 38, - WINDOWS: 91 // COMMAND + UP: 38 } }); @@ -77,11 +67,11 @@ $.fn.extend({ var scrollParent; if (($.browser.msie && (/(static|relative)/).test(this.css('position'))) || (/absolute/).test(this.css('position'))) { scrollParent = this.parents().filter(function() { - return (/(relative|absolute|fixed)/).test($.curCSS(this,'position',1)) && (/(auto|scroll)/).test($.curCSS(this,'overflow',1)+$.curCSS(this,'overflow-y',1)+$.curCSS(this,'overflow-x',1)); + return (/(relative|absolute|fixed)/).test($.css(this,'position')) && (/(auto|scroll)/).test($.css(this,'overflow')+$.css(this,'overflow-y')+$.css(this,'overflow-x')); }).eq(0); } else { scrollParent = this.parents().filter(function() { - return (/(auto|scroll)/).test($.curCSS(this,'overflow',1)+$.curCSS(this,'overflow-y',1)+$.curCSS(this,'overflow-x',1)); + return (/(auto|scroll)/).test($.css(this,'overflow')+$.css(this,'overflow-y')+$.css(this,'overflow-x')); }).eq(0); } @@ -141,12 +131,12 @@ $.each( [ "Width", "Height" ], function( i, name ) { function reduce( elem, size, border, margin ) { $.each( side, function() { - size -= parseFloat( $.curCSS( elem, "padding" + this, true ) ) || 0; + size -= parseFloat( $.css( elem, "padding" + this ) ) || 0; if ( border ) { - size -= parseFloat( $.curCSS( elem, "border" + this + "Width", true ) ) || 0; + size -= parseFloat( $.css( elem, "border" + this + "Width" ) ) || 0; } if ( margin ) { - size -= parseFloat( $.curCSS( elem, "margin" + this, true ) ) || 0; + size -= parseFloat( $.css( elem, "margin" + this ) ) || 0; } }); return size; @@ -197,7 +187,7 @@ function focusable( element, isTabIndexNotNaN ) { function visible( element ) { return !$( element ).parents().andSelf().filter(function() { - return $.curCSS( this, "visibility" ) === "hidden" || + return $.css( this, "visibility" ) === "hidden" || $.expr.filters.hidden( this ); }).length; } diff --git a/ui/jquery.ui.datepicker.js b/ui/jquery.ui.datepicker.js index 5915d4027..07aeeadd0 100644 --- a/ui/jquery.ui.datepicker.js +++ b/ui/jquery.ui.datepicker.js @@ -711,8 +711,7 @@ $.extend(Datepicker.prototype, { /* Generate the date picker content. */ _updateDatepicker: function(inst) { - var self = this; - self.maxRows = 4; //Reset the max number of rows being displayed (see #7043) + this.maxRows = 4; //Reset the max number of rows being displayed (see #7043) var borders = $.datepicker._getBorders(inst.dpDiv); instActive = inst; // for delegate hover events inst.dpDiv.empty().append(this._generateHTML(inst)); @@ -802,10 +801,10 @@ $.extend(Datepicker.prototype, { if (this._datepickerShowing) { var showAnim = this._get(inst, 'showAnim'); var duration = this._get(inst, 'duration'); - var self = this; + var that = this; var postProcess = function() { $.datepicker._tidyDialog(inst); - self._curInst = null; + that._curInst = null; }; // DEPRECATED: after BC for 1.8.x $.effects[ showAnim ] is not needed @@ -849,7 +848,7 @@ $.extend(Datepicker.prototype, { if ( ( ( $target[0].id != $.datepicker._mainDivId && $target.parents('#' + $.datepicker._mainDivId).length == 0 && !$target.hasClass($.datepicker.markerClassName) && - !$target.hasClass($.datepicker._triggerClass) && + !$target.closest("." + $.datepicker._triggerClass).length && $.datepicker._datepickerShowing && !($.datepicker._inDialog && $.blockUI) ) ) || ( $target.hasClass($.datepicker.markerClassName) && $.datepicker._curInst != inst ) ) $.datepicker._hideDatepicker(); diff --git a/ui/jquery.ui.draggable.js b/ui/jquery.ui.draggable.js index 92dd13c0d..ccc1fe81b 100644 --- a/ui/jquery.ui.draggable.js +++ b/ui/jquery.ui.draggable.js @@ -212,10 +212,10 @@ $.widget("ui.draggable", $.ui.mouse, { return false; if((this.options.revert == "invalid" && !dropped) || (this.options.revert == "valid" && dropped) || this.options.revert === true || ($.isFunction(this.options.revert) && this.options.revert.call(this.element, dropped))) { - var self = this; + var that = this; $(this.helper).animate(this.originalPosition, parseInt(this.options.revertDuration, 10), function() { - if(self._trigger("stop", event) !== false) { - self._clear(); + if(that._trigger("stop", event) !== false) { + that._clear(); } }); } else { @@ -558,7 +558,7 @@ $.ui.plugin.add("draggable", "connectToSortable", { }, drag: function(event, ui) { - var inst = $(this).data("draggable"), self = this; + var inst = $(this).data("draggable"), that = this; var checkPos = function(o) { var dyClick = this.offset.click.top, dxClick = this.offset.click.left; @@ -585,7 +585,7 @@ $.ui.plugin.add("draggable", "connectToSortable", { //Now we fake the start of dragging for the sortable instance, //by cloning the list group item, appending it to the sortable and using it as inst.currentItem //We can then fire the start event of the sortable with our passed browser event, and our own helper (so it doesn't create a new one) - this.instance.currentItem = $(self).clone().removeAttr('id').appendTo(this.instance.element).data("sortable-item", true); + this.instance.currentItem = $(that).clone().removeAttr('id').appendTo(this.instance.element).data("sortable-item", true); this.instance.options._helper = this.instance.options.helper; //Store helper option to later restore it this.instance.options.helper = function() { return ui.helper[0]; }; diff --git a/ui/jquery.ui.menu.js b/ui/jquery.ui.menu.js index 83ea3c3c0..42829c2a1 100644 --- a/ui/jquery.ui.menu.js +++ b/ui/jquery.ui.menu.js @@ -45,6 +45,9 @@ $.widget( "ui.menu", { event.preventDefault(); } }, this)); + if ( this.options.disabled ) { + this.element.addClass( "ui-state-disabled" ); + } this._bind({ // Prevent focus from sticking to links inside menu after clicking // them (focus should always stay on UL during navigation). @@ -53,13 +56,16 @@ $.widget( "ui.menu", { }, "click .ui-menu-item:has(a)": function( event ) { event.stopImmediatePropagation(); - this.select( event ); - // Redirect focus to the menu with a delay for firefox - this._delay( function() { - if ( !this.element.is(":focus") ) { - this.element.focus(); - } - }, 20); + //Don't select disabled menu items + if ( !$( event.target ).closest( ".ui-menu-item" ).is( ".ui-state-disabled" ) ) { + this.select( event ); + // Redirect focus to the menu with a delay for firefox + this._delay( function() { + if ( !this.element.is(":focus") ) { + this.element.focus(); + } + }, 20); + } }, "mouseover .ui-menu-item": function( event ) { event.stopImmediatePropagation(); @@ -71,7 +77,7 @@ $.widget( "ui.menu", { "mouseleave": "collapseAll", "mouseleave .ui-menu": "collapseAll", "focus": function( event ) { - var firstItem = this.element.children( ".ui-menu-item" ).eq( 0 ); + var firstItem = this.element.children( ".ui-menu-item" ).not( ".ui-state-disabled" ).eq( 0 ); if ( this._hasScroll() && !this.active ) { var menu = this.element; menu.children().each( function() { @@ -280,8 +286,8 @@ $.widget( "ui.menu", { this.blur( event ); if ( this._hasScroll() ) { - var borderTop = parseFloat( $.curCSS( this.activeMenu[0], "borderTopWidth", true ) ) || 0, - paddingTop = parseFloat( $.curCSS( this.activeMenu[0], "paddingTop", true ) ) || 0, + var borderTop = parseFloat( $.css( this.activeMenu[0], "borderTopWidth" ) ) || 0, + paddingTop = parseFloat( $.css( this.activeMenu[0], "paddingTop" ) ) || 0, offset = item.offset().top - this.activeMenu.offset().top - borderTop - paddingTop, scroll = this.activeMenu.scrollTop(), elementHeight = this.activeMenu.height(), @@ -411,7 +417,7 @@ $.widget( "ui.menu", { }, expand: function( event ) { - var newItem = this.active && this.active.children( ".ui-menu " ).children( ".ui-menu-item" ).first(); + var newItem = this.active && this.active.children( ".ui-menu " ).children( ".ui-menu-item" ).not( ".ui-state-disabled" ).first(); if ( newItem && newItem.length ) { this._open( newItem.parent() ); @@ -424,11 +430,11 @@ $.widget( "ui.menu", { } }, - next: function(event) { + next: function( event ) { this._move( "next", "first", event ); }, - previous: function(event) { + previous: function( event ) { this._move( "prev", "last", event ); }, @@ -441,28 +447,27 @@ $.widget( "ui.menu", { }, _move: function( direction, filter, event ) { - if ( !this.active ) { - this.focus( event, this.activeMenu.children( ".ui-menu-item" )[ filter ]() ); - return; - } - var next; - if ( direction === "first" || direction === "last" ) { - next = this.active[ direction === "first" ? "prevAll" : "nextAll" ]( ".ui-menu-item" ).eq( -1 ); - } else { - next = this.active[ direction + "All" ]( ".ui-menu-item" ).eq( 0 ); + if ( this.active ) { + if ( direction === "first" || direction === "last" ) { + next = this.active[ direction === "first" ? "prevAll" : "nextAll" ]( ".ui-menu-item" ).not( ".ui-state-disabled" ).eq( -1 ); + } else { + next = this.active[ direction + "All" ]( ".ui-menu-item" ).not( ".ui-state-disabled" ).eq( 0 ); + } + } + if ( !next || !next.length || !this.active ) { + next = this.activeMenu.children( ".ui-menu-item" )[ filter ](); } - if ( next.length ) { - this.focus( event, next ); - } else { - this.focus( event, this.activeMenu.children( ".ui-menu-item" )[ filter ]() ); + this.focus( event, next ); + if ( next.is( ".ui-state-disabled" ) ) { + this._move( direction, filter, event ); } }, nextPage: function( event ) { if ( !this.active ) { - this.focus( event, this.activeMenu.children( ".ui-menu-item" ).first() ); + this._move( "next", "first", event ); return; } if ( this.isLastItem() ) { @@ -472,21 +477,21 @@ $.widget( "ui.menu", { var base = this.active.offset().top, height = this.element.height(), result; - this.active.nextAll( ".ui-menu-item" ).each( function() { + this.active.nextAll( ".ui-menu-item" ).not( ".ui-state-disabled" ).each( function() { result = $( this ); return $( this ).offset().top - base - height < 0; }); this.focus( event, result ); } else { - this.focus( event, this.activeMenu.children( ".ui-menu-item" ) + this.focus( event, this.activeMenu.children( ".ui-menu-item" ).not( ".ui-state-disabled" ) [ !this.active ? "first" : "last" ]() ); } }, previousPage: function( event ) { if ( !this.active ) { - this.focus( event, this.activeMenu.children( ".ui-menu-item" ).first() ); + this._move( "next", "first", event ); return; } if ( this.isFirstItem() ) { @@ -496,14 +501,14 @@ $.widget( "ui.menu", { var base = this.active.offset().top, height = this.element.height(), result; - this.active.prevAll( ".ui-menu-item" ).each( function() { + this.active.prevAll( ".ui-menu-item" ).not( ".ui-state-disabled" ).each( function() { result = $( this ); return $(this).offset().top - base + height > 0; }); this.focus( event, result ); } else { - this.focus( event, this.activeMenu.children( ".ui-menu-item" ).first() ); + this.focus( event, this.activeMenu.children( ".ui-menu-item" ).not( ".ui-state-disabled" ).first() ); } }, diff --git a/ui/jquery.ui.mouse.js b/ui/jquery.ui.mouse.js index 888fbedfe..b1826aa23 100644 --- a/ui/jquery.ui.mouse.js +++ b/ui/jquery.ui.mouse.js @@ -25,15 +25,15 @@ $.widget("ui.mouse", { delay: 0 }, _mouseInit: function() { - var self = this; + var that = this; this.element .bind('mousedown.'+this.widgetName, function(event) { - return self._mouseDown(event); + return that._mouseDown(event); }) .bind('click.'+this.widgetName, function(event) { - if (true === $.data(event.target, self.widgetName + '.preventClickEvent')) { - $.removeData(event.target, self.widgetName + '.preventClickEvent'); + if (true === $.data(event.target, that.widgetName + '.preventClickEvent')) { + $.removeData(event.target, that.widgetName + '.preventClickEvent'); event.stopImmediatePropagation(); return false; } @@ -57,7 +57,7 @@ $.widget("ui.mouse", { this._mouseDownEvent = event; - var self = this, + var that = this, btnIsLeft = (event.which == 1), // event.target.nodeName works around a bug in IE 8 with // disabled inputs (#7620) @@ -69,7 +69,7 @@ $.widget("ui.mouse", { this.mouseDelayMet = !this.options.delay; if (!this.mouseDelayMet) { this._mouseDelayTimer = setTimeout(function() { - self.mouseDelayMet = true; + that.mouseDelayMet = true; }, this.options.delay); } @@ -88,10 +88,10 @@ $.widget("ui.mouse", { // these delegates are required to keep context this._mouseMoveDelegate = function(event) { - return self._mouseMove(event); + return that._mouseMove(event); }; this._mouseUpDelegate = function(event) { - return self._mouseUp(event); + return that._mouseUp(event); }; $(document) .bind('mousemove.'+this.widgetName, this._mouseMoveDelegate) diff --git a/ui/jquery.ui.position.js b/ui/jquery.ui.position.js index 00976bf79..b8bb2c883 100644 --- a/ui/jquery.ui.position.js +++ b/ui/jquery.ui.position.js @@ -152,13 +152,13 @@ $.fn.position = function( options ) { var elem = $( this ), elemWidth = elem.outerWidth(), elemHeight = elem.outerHeight(), - marginLeft = parseInt( $.curCSS( this, "marginLeft", true ) ) || 0, - marginTop = parseInt( $.curCSS( this, "marginTop", true ) ) || 0, + marginLeft = parseInt( $.css( this, "marginLeft" ) ) || 0, + marginTop = parseInt( $.css( this, "marginTop" ) ) || 0, scrollInfo = $.position.getScrollInfo( within ), collisionWidth = elemWidth + marginLeft + - ( parseInt( $.curCSS( this, "marginRight", true ) ) || 0 ) + scrollInfo.width, + ( parseInt( $.css( this, "marginRight" ) ) || 0 ) + scrollInfo.width, collisionHeight = elemHeight + marginTop + - ( parseInt( $.curCSS( this, "marginBottom", true ) ) || 0 ) + scrollInfo.height, + ( parseInt( $.css( this, "marginBottom" ) ) || 0 ) + scrollInfo.height, position = $.extend( {}, basePosition ), myOffset = [ parseInt( offsets.my[ 0 ], 10 ) * @@ -414,7 +414,7 @@ $.ui.position = { // fraction support test (function () { - var testElement, testElementParent, testElementStyle, offsetLeft, i + var testElement, testElementParent, testElementStyle, offsetLeft, i, body = document.getElementsByTagName( "body" )[ 0 ], div = document.createElement( "div" ); diff --git a/ui/jquery.ui.resizable.js b/ui/jquery.ui.resizable.js index baca11f83..d1745a0c7 100644 --- a/ui/jquery.ui.resizable.js +++ b/ui/jquery.ui.resizable.js @@ -51,10 +51,6 @@ $.widget("ui.resizable", $.ui.mouse, { //Wrap the element if it cannot hold child nodes if(this.element[0].nodeName.match(/canvas|textarea|input|select|button|img/i)) { - //Opera fix for relative positioning - if (/relative/.test(this.element.css('position')) && $.browser.opera) - this.element.css({ position: 'relative', top: 'auto', left: 'auto' }); - //Create a wrapper element and set the wrapper to the new current internal element this.element.wrap( $('<div class="ui-wrapper" style="overflow: hidden;"></div>').css({ @@ -248,10 +244,6 @@ $.widget("ui.resizable", $.ui.mouse, { el.css({ position: 'absolute', top: iniPos.top, left: iniPos.left }); } - //Opera fixing relative position - if ($.browser.opera && (/relative/).test(el.css('position'))) - el.css({ position: 'relative', top: 'auto', left: 'auto' }); - this._renderProxy(); var curleft = num(this.helper.css('left')), curtop = num(this.helper.css('top')); @@ -563,8 +555,7 @@ $.ui.plugin.add("resizable", "alsoResize", { var el = $(this); el.data("resizable-alsoresize", { width: parseInt(el.width(), 10), height: parseInt(el.height(), 10), - left: parseInt(el.css('left'), 10), top: parseInt(el.css('top'), 10), - position: el.css('position') // to reset Opera on stop() + left: parseInt(el.css('left'), 10), top: parseInt(el.css('top'), 10) }); }); }; @@ -596,12 +587,6 @@ $.ui.plugin.add("resizable", "alsoResize", { style[prop] = sum || null; }); - // Opera fixing relative position - if ($.browser.opera && /relative/.test(el.css('position'))) { - self._revertToRelativePosition = true; - el.css({ position: 'absolute', top: 'auto', left: 'auto' }); - } - el.css(style); }); }; @@ -614,25 +599,6 @@ $.ui.plugin.add("resizable", "alsoResize", { }, stop: function (event, ui) { - var self = $(this).data("resizable"), o = self.options; - - var _reset = function (exp) { - $(exp).each(function() { - var el = $(this); - // reset position for Opera - no need to verify it was changed - el.css({ position: el.data("resizable-alsoresize").position }); - }); - }; - - if (self._revertToRelativePosition) { - self._revertToRelativePosition = false; - if (typeof(o.alsoResize) == 'object' && !o.alsoResize.nodeType) { - $.each(o.alsoResize, function (exp) { _reset(exp); }); - }else{ - _reset(o.alsoResize); - } - } - $(this).removeData("resizable-alsoresize"); } }); diff --git a/ui/jquery.ui.slider.js b/ui/jquery.ui.slider.js index 9c5d21ffb..aff9093ba 100644 --- a/ui/jquery.ui.slider.js +++ b/ui/jquery.ui.slider.js @@ -115,8 +115,7 @@ $.widget( "ui.slider", $.ui.mouse, { this.handles .keydown(function( event ) { - var ret = true, - index = $( this ).data( "index.ui-slider-handle" ), + var index = $( this ).data( "index.ui-slider-handle" ), allowed, curVal, newVal, @@ -135,7 +134,7 @@ $.widget( "ui.slider", $.ui.mouse, { case $.ui.keyCode.RIGHT: case $.ui.keyCode.DOWN: case $.ui.keyCode.LEFT: - ret = false; + event.preventDefault(); if ( !self._keySliding ) { self._keySliding = true; $( this ).addClass( "ui-state-active" ); @@ -184,9 +183,6 @@ $.widget( "ui.slider", $.ui.mouse, { } self._slide( event, index, newVal ); - - return ret; - }) .keyup(function( event ) { var index = $( this ).data( "index.ui-slider-handle" ); diff --git a/ui/jquery.ui.sortable.js b/ui/jquery.ui.sortable.js index 600569451..d5796a3f0 100644 --- a/ui/jquery.ui.sortable.js +++ b/ui/jquery.ui.sortable.js @@ -65,7 +65,7 @@ $.widget("ui.sortable", $.ui.mouse, { }, - destroy: function() { + _destroy: function() { this.element .removeClass("ui-sortable ui-sortable-disabled"); this._mouseDestroy(); diff --git a/ui/jquery.ui.tabs.js b/ui/jquery.ui.tabs.js index 7a701405c..6e5cde07e 100644 --- a/ui/jquery.ui.tabs.js +++ b/ui/jquery.ui.tabs.js @@ -596,86 +596,79 @@ if ( $.uiBackCompat !== false ) { }; // url method - (function( $, prototype ) { - prototype.url = function( index, url ) { + $.widget( "ui.tabs", $.ui.tabs, { + url: function( index, url ) { this.anchors.eq( index ).attr( "href", url ); - }; - }( jQuery, jQuery.ui.tabs.prototype ) ); + } + }); // ajaxOptions and cache options - (function( $, prototype ) { - $.extend( prototype.options, { + $.widget( "ui.tabs", $.ui.tabs, { + options: { ajaxOptions: null, cache: false - }); - - var _create = prototype._create, - _setOption = prototype._setOption, - _destroy = prototype._destroy, - oldurl = prototype.url || $.noop; + }, - $.extend( prototype, { - _create: function() { - _create.call( this ); + _create: function() { + this._super(); - var self = this; + var self = this; - this.element.bind( "tabsbeforeload.tabs", function( event, ui ) { - // tab is already cached - if ( $.data( ui.tab[ 0 ], "cache.tabs" ) ) { - event.preventDefault(); - return; - } - - $.extend( ui.ajaxSettings, self.options.ajaxOptions, { - error: function( xhr, s, e ) { - try { - // Passing index avoid a race condition when this method is - // called after the user has selected another tab. - // Pass the anchor that initiated this request allows - // loadError to manipulate the tab content panel via $(a.hash) - self.options.ajaxOptions.error( xhr, s, ui.tab.closest( "li" ).index(), ui.tab[ 0 ] ); - } - catch ( e ) {} - } - }); + this.element.bind( "tabsbeforeload.tabs", function( event, ui ) { + // tab is already cached + if ( $.data( ui.tab[ 0 ], "cache.tabs" ) ) { + event.preventDefault(); + return; + } - ui.jqXHR.success(function() { - if ( self.options.cache ) { - $.data( ui.tab[ 0 ], "cache.tabs", true ); + $.extend( ui.ajaxSettings, self.options.ajaxOptions, { + error: function( xhr, s, e ) { + try { + // Passing index avoid a race condition when this method is + // called after the user has selected another tab. + // Pass the anchor that initiated this request allows + // loadError to manipulate the tab content panel via $(a.hash) + self.options.ajaxOptions.error( xhr, s, ui.tab.closest( "li" ).index(), ui.tab[ 0 ] ); } - }); + catch ( e ) {} + } }); - }, - _setOption: function( key, value ) { - // reset cache if switching from cached to not cached - if ( key === "cache" && value === false ) { - this.anchors.removeData( "cache.tabs" ); - } - _setOption.apply( this, arguments ); - }, + ui.jqXHR.success(function() { + if ( self.options.cache ) { + $.data( ui.tab[ 0 ], "cache.tabs", true ); + } + }); + }); + }, - _destroy: function() { + _setOption: function( key, value ) { + // reset cache if switching from cached to not cached + if ( key === "cache" && value === false ) { this.anchors.removeData( "cache.tabs" ); - _destroy.call( this ); - }, - - url: function( index, url ){ - this.anchors.eq( index ).removeData( "cache.tabs" ); - oldurl.apply( this, arguments ); } - }); - }( jQuery, jQuery.ui.tabs.prototype ) ); + this._super( key, value ); + }, + + _destroy: function() { + this.anchors.removeData( "cache.tabs" ); + this._super(); + }, + + url: function( index, url ){ + this.anchors.eq( index ).removeData( "cache.tabs" ); + this._superApply( arguments ); + } + }); // abort method - (function( $, prototype ) { - prototype.abort = function() { + $.widget( "ui.tabs", $.ui.tabs, { + abort: function() { if ( this.xhr ) { this.xhr.abort(); } - }; - }( jQuery, jQuery.ui.tabs.prototype ) ); + } + }); // spinner $.widget( "ui.tabs", $.ui.tabs, { @@ -702,16 +695,13 @@ if ( $.uiBackCompat !== false ) { }); // enable/disable events - (function( $, prototype ) { - $.extend( prototype.options, { + $.widget( "ui.tabs", $.ui.tabs, { + options: { enable: null, disable: null - }); - - var enable = prototype.enable, - disable = prototype.disable; + }, - prototype.enable = function( index ) { + enable: function( index ) { var options = this.options, trigger; @@ -720,14 +710,14 @@ if ( $.uiBackCompat !== false ) { trigger = true; } - enable.apply( this, arguments ); + this._superApply( arguments ); if ( trigger ) { this._trigger( "enable", null, this._ui( this.anchors[ index ], this.panels[ index ] ) ); } - }; + }, - prototype.disable = function( index ) { + disable: function( index ) { var options = this.options, trigger; @@ -736,23 +726,23 @@ if ( $.uiBackCompat !== false ) { trigger = true; } - disable.apply( this, arguments ); + this._superApply( arguments ); if ( trigger ) { this._trigger( "disable", null, this._ui( this.anchors[ index ], this.panels[ index ] ) ); } - }; - }( jQuery, jQuery.ui.tabs.prototype ) ); + } + }); // add/remove methods and events - (function( $, prototype ) { - $.extend( prototype.options, { + $.widget( "ui.tabs", $.ui.tabs, { + options: { add: null, remove: null, tabTemplate: "<li><a href='#{href}'><span>#{label}</span></a></li>" - }); + }, - prototype.add = function( url, label, index ) { + add: function( url, label, index ) { if ( index === undefined ) { index = this.anchors.length; } @@ -803,9 +793,9 @@ if ( $.uiBackCompat !== false ) { this._trigger( "add", null, this._ui( this.anchors[ index ], this.panels[ index ] ) ); return this; - }; + }, - prototype.remove = function( index ) { + remove: function( index ) { index = this._getIndex( index ); var options = this.options, tab = this.lis.eq( index ).remove(), @@ -832,125 +822,117 @@ if ( $.uiBackCompat !== false ) { this._trigger( "remove", null, this._ui( tab.find( "a" )[ 0 ], panel[ 0 ] ) ); return this; - }; - }( jQuery, jQuery.ui.tabs.prototype ) ); + } + }); // length method - (function( $, prototype ) { - prototype.length = function() { + $.widget( "ui.tabs", $.ui.tabs, { + length: function() { return this.anchors.length; - }; - }( jQuery, jQuery.ui.tabs.prototype ) ); + } + }); // panel ids (idPrefix option + title attribute) - (function( $, prototype ) { - $.extend( prototype.options, { + $.widget( "ui.tabs", $.ui.tabs, { + options: { idPrefix: "ui-tabs-" - }); + }, - var _tabId = prototype._tabId; - prototype._tabId = function( a ) { + _tabId: function( a ) { return $( a ).attr( "aria-controls" ) || a.title && a.title.replace( /\s/g, "_" ).replace( /[^\w\u00c0-\uFFFF-]/g, "" ) || this.options.idPrefix + getNextTabId(); - }; - }( jQuery, jQuery.ui.tabs.prototype ) ); + } + }); // _createPanel method - (function( $, prototype ) { - $.extend( prototype.options, { + $.widget( "ui.tabs", $.ui.tabs, { + options: { panelTemplate: "<div></div>" - }); + }, - var _createPanel = prototype._createPanel; - prototype._createPanel = function( id ) { + _createPanel: function( id ) { return $( this.options.panelTemplate ) - .attr( "id", id ) - .addClass( "ui-tabs-panel ui-widget-content ui-corner-bottom" ) - .data( "destroy.tabs", true ); - }; - }( jQuery, jQuery.ui.tabs.prototype ) ); + .attr( "id", id ) + .addClass( "ui-tabs-panel ui-widget-content ui-corner-bottom" ) + .data( "destroy.tabs", true ); + } + }); // selected option - (function( $, prototype ) { - var _create = prototype._create, - _setOption = prototype._setOption, - _eventHandler = prototype._eventHandler; - - prototype._create = function() { + $.widget( "ui.tabs", $.ui.tabs, { + _create: function() { var options = this.options; if ( options.active === null && options.selected !== undefined ) { options.active = options.selected === -1 ? false : options.selected; } - _create.call( this ); + this._super(); options.selected = options.active; if ( options.selected === false ) { options.selected = -1; } - }; + }, - prototype._setOption = function( key, value ) { + _setOption: function( key, value ) { if ( key !== "selected" ) { - return _setOption.apply( this, arguments ); + return this._super( key, value ); } var options = this.options; - _setOption.call( this, "active", value === -1 ? false : value ); + this._super( "active", value === -1 ? false : value ); options.selected = options.active; if ( options.selected === false ) { options.selected = -1; } - }; + }, - prototype._eventHandler = function( event ) { - _eventHandler.apply( this, arguments ); + _eventHandler: function( event ) { + this._superApply( arguments ); this.options.selected = this.options.active; if ( this.options.selected === false ) { this.options.selected = -1; } - }; - }( jQuery, jQuery.ui.tabs.prototype ) ); + } + }); // show and select event - (function( $, prototype ) { - $.extend( prototype.options, { + $.widget( "ui.tabs", $.ui.tabs, { + options: { show: null, select: null - }); - var _create = prototype._create, - _trigger = prototype._trigger; - - prototype._create = function() { - _create.call( this ); + }, + _create: function() { + this._super(); if ( this.options.active !== false ) { this._trigger( "show", null, this._ui( this.active[ 0 ], this._getPanelForTab( this.active )[ 0 ] ) ); } - }; - prototype._trigger = function( type, event, data ) { - var ret = _trigger.apply( this, arguments ); + }, + _trigger: function( type, event, data ) { + var ret = this._superApply( arguments ); if ( !ret ) { return false; } if ( type === "beforeActivate" && data.newTab.length ) { - ret = _trigger.call( this, "select", event, { + ret = this._super( "select", event, { tab: data.newTab[ 0], panel: data.newPanel[ 0 ], index: data.newTab.closest( "li" ).index() }); } else if ( type === "activate" && data.newTab.length ) { - ret = _trigger.call( this, "show", event, { + ret = this._super( "show", event, { tab: data.newTab[ 0 ], panel: data.newPanel[ 0 ], index: data.newTab.closest( "li" ).index() }); } - }; - }( jQuery, jQuery.ui.tabs.prototype ) ); + return ret; + } + }); // select method - (function( $, prototype ) { - prototype.select = function( index ) { + $.widget( "ui.tabs", $.ui.tabs, { + select: function( index ) { index = this._getIndex( index ); if ( index === -1 ) { if ( this.options.collapsible && this.options.selected !== -1 ) { @@ -960,14 +942,12 @@ if ( $.uiBackCompat !== false ) { } } this.anchors.eq( index ).trigger( this.options.event + ".tabs" ); - }; - }( jQuery, jQuery.ui.tabs.prototype ) ); + } + }); // cookie option var listId = 0; - function getNextListId() { - return ++listId; - } + $.widget( "ui.tabs", $.ui.tabs, { options: { cookie: null // e.g. { expires: 7, path: '/', domain: 'jquery.com', secure: true } @@ -986,7 +966,7 @@ if ( $.uiBackCompat !== false ) { }, _cookie: function( active ) { var cookie = [ this.cookie || - ( this.cookie = this.options.cookie.name || "ui-tabs-" + getNextListId() ) ]; + ( this.cookie = this.options.cookie.name || "ui-tabs-" + ++listId ) ]; if ( arguments.length ) { cookie.push( active === false ? -1 : active ); cookie.push( this.options.cookie ); diff --git a/ui/jquery.ui.tooltip.js b/ui/jquery.ui.tooltip.js index a006f3bf7..cb23e9a4d 100644 --- a/ui/jquery.ui.tooltip.js +++ b/ui/jquery.ui.tooltip.js @@ -103,7 +103,13 @@ $.widget( "ui.tooltip", { target.data( "tooltip-title", target.attr( "title" ) ); } + target.data( "tooltip-open", true ); + content = this.options.content.call( target[0], function( response ) { + // ignore async response if tooltip was closed already + if ( !target.data( "tooltip-open" ) ) { + return; + } // IE may instantly serve a cached response for ajax requests // delay this call to _open so the other call to _open runs first setTimeout(function() { @@ -123,7 +129,10 @@ $.widget( "ui.tooltip", { // if we have a title, clear it to prevent the native tooltip // we have to check first to avoid defining a title if none exists // (we don't want to cause an element to start matching [title]) - // TODO: document why we don't use .removeAttr() + + // We don't use removeAttr as that causes the native tooltip to show + // up in IE (9 and below, didn't yet test 10). Happens only when removing + // inside the mouseover handler. if ( target.is( "[title]" ) ) { target.attr( "title", "" ); } @@ -183,6 +192,7 @@ $.widget( "ui.tooltip", { delete that.tooltips[ this.id ]; }); + target.removeData( "tooltip-open" ); target.unbind( "mouseleave.tooltip blur.tooltip keyup.tooltip" ); this._trigger( "close", event, { tooltip: tooltip } ); diff --git a/ui/jquery.ui.widget.js b/ui/jquery.ui.widget.js index ad03e6f44..2d48ae26d 100644 --- a/ui/jquery.ui.widget.js +++ b/ui/jquery.ui.widget.js @@ -23,8 +23,9 @@ $.cleanData = function( elems ) { }; $.widget = function( name, base, prototype ) { - var namespace = name.split( "." )[ 0 ], - fullName; + var fullName, existingConstructor, constructor, basePrototype, + namespace = name.split( "." )[ 0 ]; + name = name.split( "." )[ 1 ]; fullName = namespace + "-" + name; @@ -39,12 +40,11 @@ $.widget = function( name, base, prototype ) { }; $[ namespace ] = $[ namespace ] || {}; - // create the constructor using $.extend() so we can carry over any - // static properties stored on the existing constructor (if there is one) - $[ namespace ][ name ] = $.extend( function( options, element ) { + existingConstructor = $[ namespace ][ name ]; + constructor = $[ namespace ][ name ] = function( options, element ) { // allow instantiation without "new" keyword if ( !this._createWidget ) { - return new $[ namespace ][ name ]( options, element ); + return new constructor( options, element ); } // allow instantiation without initializing for simple inheritance @@ -52,9 +52,19 @@ $.widget = function( name, base, prototype ) { if ( arguments.length ) { this._createWidget( options, element ); } - }, $[ namespace ][ name ], { version: prototype.version } ); + }; + // extend with the existing constructor to carry over any static properties + $.extend( constructor, existingConstructor, { + version: prototype.version, + // copy the object used to create the prototype in case we need to + // redefine the widget later + _proto: $.extend( {}, prototype ), + // track widgets that inherit from this widget in case this widget is + // redefined after a widget inherits from it + _childConstructors: [] + }); - var basePrototype = new base(); + basePrototype = new base(); // we need to make the options hash a property directly on the new instance // otherwise we'll modify the options hash on the prototype that we're // inheriting from @@ -83,17 +93,41 @@ $.widget = function( name, base, prototype ) { return returnValue; }; - }()); + })(); } }); - $[ namespace ][ name ].prototype = $.widget.extend( basePrototype, { + constructor.prototype = $.widget.extend( basePrototype, { + // TODO: remove support for widgetEventPrefix + // always use the name + a colon as the prefix, e.g., draggable:start + // don't prefix for widgets that aren't DOM-based + widgetEventPrefix: name + }, prototype, { + constructor: constructor, namespace: namespace, widgetName: name, - widgetEventPrefix: name, widgetBaseClass: fullName - }, prototype ); + }); - $.widget.bridge( name, $[ namespace ][ name ] ); + // If this widget is being redefined then we need to find all widgets that + // are inheriting from it and redefine all of them so that they inherit from + // the new version of this widget. We're essentially trying to replace one + // level in the prototype chain. + if ( existingConstructor ) { + $.each( existingConstructor._childConstructors, function( i, child ) { + var childPrototype = child.prototype; + + // redefine the child widget using the same prototype that was + // originally used, but inherit from the new version of the base + $.widget( childPrototype.namespace + "." + childPrototype.widgetName, constructor, child._proto ); + }); + // remove the list of existing child constructors from the old constructor + // so the old child constructors can be garbage collected + delete existingConstructor._childConstructors; + } else { + base._childConstructors.push( constructor ); + } + + $.widget.bridge( name, constructor ); }; $.widget.extend = function( target ) { @@ -148,7 +182,7 @@ $.widget.bridge = function( name, object ) { if ( instance ) { instance.option( options || {} )._init(); } else { - object( options, this ); + new object( options, this ); } }); } @@ -157,18 +191,8 @@ $.widget.bridge = function( name, object ) { }; }; -$.Widget = function( options, element ) { - // allow instantiation without "new" keyword - if ( !this._createWidget ) { - return new $[ namespace ][ name ]( options, element ); - } - - // allow instantiation without initializing for simple inheritance - // must use "new" keyword (the code above always passes args) - if ( arguments.length ) { - this._createWidget( options, element ); - } -}; +$.Widget = function( options, element ) {}; +$.Widget._childConstructors = []; $.Widget.prototype = { widgetName: "widget", |