mirror of
https://github.com/jquery/jquery-ui.git
synced 2025-01-07 20:34:24 +00:00
Merge branch 'master' into effects-unit
This commit is contained in:
gnarf
commit
4a4d7e4b73
@ -112,6 +112,9 @@
|
||||
return;
|
||||
}
|
||||
|
||||
// work around a bug (likely same cause as #5265)
|
||||
$( this ).blur();
|
||||
|
||||
// pass empty string as value to search for, displaying all results
|
||||
input.autocomplete( "search", "" );
|
||||
input.focus();
|
||||
|
||||
@ -320,10 +320,10 @@ div.demo-description {
|
||||
#widget-docs .ui-tabs-nav li a:hover,
|
||||
#widget-docs .ui-tabs-nav li a:active { font-size:14px; padding:4px 1.2em 3px; color:#fff; }
|
||||
|
||||
#widget-docs .ui-tabs-nav li.ui-tabs-selected a:link,
|
||||
#widget-docs .ui-tabs-nav li.ui-tabs-selected a:visited,
|
||||
#widget-docs .ui-tabs-nav li.ui-tabs-selected a:hover,
|
||||
#widget-docs .ui-tabs-nav li.ui-tabs-selected a:active { color:#e6820E; }
|
||||
#widget-docs .ui-tabs-nav li.ui-tabs-active a:link,
|
||||
#widget-docs .ui-tabs-nav li.ui-tabs-active a:visited,
|
||||
#widget-docs .ui-tabs-nav li.ui-tabs-active a:hover,
|
||||
#widget-docs .ui-tabs-nav li.ui-tabs-active a:active { color:#e6820E; }
|
||||
|
||||
#widget-docs .ui-tabs-panel { padding:20px 9px; font-size:12px; line-height:1.4; color:#000; }
|
||||
|
||||
|
||||
@ -12,12 +12,12 @@
|
||||
<script>
|
||||
$(function() {
|
||||
$( "#tabs" ).tabs({
|
||||
ajaxOptions: {
|
||||
error: function( xhr, status, index, anchor ) {
|
||||
$( anchor.hash ).html(
|
||||
beforeLoad: function( event, ui ) {
|
||||
ui.jqXHR.error(function() {
|
||||
ui.panel.html(
|
||||
"Couldn't load this tab. We'll try to fix this as soon as possible. " +
|
||||
"If this wouldn't be a demo." );
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
@ -23,7 +23,6 @@
|
||||
.tabs-bottom .ui-tabs-panel { height: 140px; overflow: auto; }
|
||||
.tabs-bottom .ui-tabs-nav { position: absolute !important; left: 0; bottom: 0; right:0; padding: 0 0.2em 0.2em 0; }
|
||||
.tabs-bottom .ui-tabs-nav li { margin-top: -2px !important; margin-bottom: 1px !important; border-top: none; border-bottom-width: 1px; }
|
||||
.ui-tabs-selected { margin-top: -3px !important; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
@ -13,7 +13,13 @@
|
||||
<link rel="stylesheet" href="../demos.css">
|
||||
<script>
|
||||
$(function() {
|
||||
$( "#tabs" ).tabs().find( ".ui-tabs-nav" ).sortable({ axis: "x" });
|
||||
var tabs = $( "#tabs" ).tabs();
|
||||
tabs.find( ".ui-tabs-nav" ).sortable({
|
||||
axis: "x",
|
||||
stop: function() {
|
||||
tabs.tabs( "refresh" );
|
||||
}
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</head>
|
||||
|
||||
@ -20,7 +20,7 @@
|
||||
.ui-tabs-vertical .ui-tabs-nav { padding: .2em .1em .2em .2em; float: left; width: 12em; }
|
||||
.ui-tabs-vertical .ui-tabs-nav li { clear: left; width: 100%; border-bottom-width: 1px !important; border-right-width: 0 !important; margin: 0 -1px .2em 0; }
|
||||
.ui-tabs-vertical .ui-tabs-nav li a { display:block; }
|
||||
.ui-tabs-vertical .ui-tabs-nav li.ui-tabs-selected { padding-bottom: 0; padding-right: .1em; border-right-width: 1px; border-right-width: 1px; }
|
||||
.ui-tabs-vertical .ui-tabs-nav li.ui-tabs-active { padding-bottom: 0; padding-right: .1em; border-right-width: 1px; border-right-width: 1px; }
|
||||
.ui-tabs-vertical .ui-tabs-panel { padding: 1em; float: right; width: 40em;}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
@ -11,12 +11,15 @@
|
||||
<link type="text/css" href="../demos.css" rel="stylesheet" />
|
||||
<script type="text/javascript">
|
||||
$(function() {
|
||||
// TODO overhaul this with custom animation API
|
||||
$(".demo").tooltip({
|
||||
open: function() {
|
||||
$(this).tooltip("widget").stop(false, true).hide().slideDown();
|
||||
$(".ui-tooltip").stop(false, true).hide().slideDown();
|
||||
},
|
||||
close: function() {
|
||||
$(this).tooltip("widget").stop(false, true).show().slideUp();
|
||||
$(".ui-tooltip").stop(false, false).show().slideUp(function() {
|
||||
$(this).remove();
|
||||
});
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
@ -14,6 +14,7 @@
|
||||
<li><a href="tracking.html">Track the mouse</a></li>
|
||||
<li><a href="custom-animation.html">Custom animation</a></li>
|
||||
<li><a href="delegation-mixbag.html">Delegation Mixbag</a></li>
|
||||
<li><a href="lots.html">Lots</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
|
||||
@ -13,12 +13,11 @@
|
||||
$(function() {
|
||||
$(".demo").tooltip({
|
||||
open: function() {
|
||||
var tooltip = $(this).tooltip("widget");
|
||||
$(document).mousemove(function(event) {
|
||||
tooltip.position({
|
||||
my: "left center",
|
||||
at: "right center",
|
||||
offset: "25 25",
|
||||
var tooltip = $( ".ui-tooltip" );
|
||||
$(document).mousemove(function( event ) {
|
||||
tooltip.position( {
|
||||
my: "left+25 center",
|
||||
at: "right+25 center",
|
||||
of: event
|
||||
});
|
||||
})
|
||||
@ -26,7 +25,7 @@
|
||||
.mousemove();
|
||||
},
|
||||
close: function() {
|
||||
$(document).unbind("mousemove");
|
||||
$(document).unbind( "mousemove" );
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
@ -1,172 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<title>Menu 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.5.1.js"></script>
|
||||
<script type="text/javascript" src="../static.js"></script>
|
||||
|
||||
<script src="http://jqueryui.com/themeroller/themeswitchertool/" type="text/javascript"></script>
|
||||
<script>
|
||||
$(document).ready(function(){
|
||||
$('#switcher').themeswitcher();
|
||||
});
|
||||
</script>
|
||||
|
||||
|
||||
|
||||
<style type="text/css">
|
||||
/* styles for this page only */
|
||||
.ui-menu { width: 200px; }
|
||||
#flyout .ui-menu { position: relative; }
|
||||
#flyout .ui-menu.ui-menu-icons { position: absolute; }
|
||||
|
||||
.ui-menu.ui-menu-icons { position: relative; }
|
||||
.ui-menu.ui-menu-icons .ui-menu-item a { position: relative; padding-left: 2em; }
|
||||
|
||||
/* left-aligned icon */
|
||||
.ui-menu .ui-icon { position: absolute; top: .2em; left: .2em; }
|
||||
|
||||
/* right-aligned icon */
|
||||
.ui-menu .ui-icon.ui-menu-icon { position: static; float: right; }
|
||||
</style>
|
||||
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div id="switcher" style="position: absolute; top: 20px; right: 20px;"></div>
|
||||
|
||||
|
||||
<!-- NOTES:
|
||||
|
||||
* Added "ui-menu-icons" class to set a left indent value for all menu items in a single menu
|
||||
|
||||
-->
|
||||
|
||||
|
||||
<h2>Default</h2>
|
||||
|
||||
<ul role="menu" aria-activedescendant="ui-active-menuitem" class="ui-menu ui-menu-icons ui-widget ui-widget-content ui-corner-bottom">
|
||||
<li class="ui-menu-item" role="menuitem"><a href="#" tabindex="-1" class="ui-corner-all"><span class="ui-icon ui-icon-print"></span>Aberdeen</a></li>
|
||||
<li class="ui-menu-item" role="menuitem" id="ui-active-menuitem"><a href="#" tabindex="-1" class="ui-state-hover ui-corner-all">Ada</a></li>
|
||||
<li class="ui-menu-item" role="menuitem"><a href="#" tabindex="-1" class="ui-corner-all">Adamsville</a></li>
|
||||
<li class="ui-menu-item" role="menuitem"><a href="#" tabindex="-1" class="ui-corner-all"><span class="ui-icon ui-icon-scissors"></span>Addyston really long menu option to show wrap</a></li>
|
||||
<li class="ui-menu-item" role="menuitem"><a href="#" tabindex="-1" class="ui-corner-all"><span class="ui-icon ui-icon-wrench"></span>Adelphi</a></li>
|
||||
<li class="ui-menu-item" role="menuitem"><a href="#" tabindex="-1" class="ui-corner-all"><span class="ui-icon ui-icon-star"></span>Adena</a></li>
|
||||
<li class="ui-menu-item" role="menuitem"><a href="#" tabindex="-1" class="ui-corner-all">Adrian</a></li>
|
||||
<li class="ui-menu-item" role="menuitem"><a href="#" tabindex="-1" class="ui-corner-all">Akron</a></li>
|
||||
<li class="ui-menu-item" role="menuitem"><a href="#" tabindex="-1" class="ui-corner-all">Albany</a></li>
|
||||
</ul>
|
||||
|
||||
<br /><br />
|
||||
|
||||
<div id="drilldown">
|
||||
|
||||
<h2>Drilldown</h2>
|
||||
|
||||
<ul role="listbox" aria-activedescendant="ui-active-menuitem" class="ui-menu ui-menu-icons ui-widget ui-widget-content ui-corner-all">
|
||||
<li role="menuitem" class="ui-menu-item">
|
||||
<a href="#" tabindex="-1" class="ui-state-hover ui-corner-all"><span class="ui-icon ui-icon-print"></span><span class="ui-icon ui-menu-icon ui-icon-carat-1-e"></span>Amsterdam</a>
|
||||
<ul aria-activedescendant="ui-active-menuitem" role="listbox" class="ui-menu ui-widget ui-widget-content ui-corner-all" style="display: none;">
|
||||
<li role="menuitem" class="ui-menu-item"><a tabindex="-1" class="ui-corner-all" href="#">Aberdeen</a></li>
|
||||
<li role="menuitem" class="ui-menu-item"><a tabindex="-1" class="ui-corner-all" href="#">Ada</a></li>
|
||||
<li role="menuitem" class="ui-menu-item">
|
||||
<a tabindex="-1" class="ui-corner-all" href="#"><span class="ui-icon ui-menu-icon ui-icon-carat-1-e"></span>Adamsville</a>
|
||||
<ul aria-activedescendant="ui-active-menuitem" role="listbox" class="ui-menu ui-widget ui-widget-content ui-corner-all" style="display: none;">
|
||||
<li role="menuitem" class="ui-menu-item"><a tabindex="-1" class="ui-corner-all" href="#">Anaheim</a></li>
|
||||
<li role="menuitem" class="ui-menu-item">
|
||||
<a tabindex="-1" class="ui-corner-all" href="#"><span class="ui-icon ui-menu-icon ui-icon-carat-1-e"></span>Cologne</a>
|
||||
<ul aria-activedescendant="ui-active-menuitem" role="listbox" class="ui-menu ui-widget ui-widget-content ui-corner-all" style="display: none;">
|
||||
<li role="menuitem" class="ui-menu-item"><a tabindex="-1" class="ui-corner-all" href="#">Mberdeen</a></li>
|
||||
<li role="menuitem" class="ui-menu-item"><a tabindex="-1" class="ui-corner-all" href="#">Mda</a></li>
|
||||
<li role="menuitem" class="ui-menu-item"><a tabindex="-1" class="ui-corner-all" href="#">Mdamsville</a></li>
|
||||
<li role="menuitem" class="ui-menu-item"><a tabindex="-1" class="ui-corner-all" href="#">Mddyston</a></li>
|
||||
<li role="menuitem" class="ui-menu-item"><a tabindex="-1" class="ui-corner-all" href="#">Mmesville</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li role="menuitem" class="ui-menu-item"><a tabindex="-1" class="ui-corner-all" href="#">Frankfurt</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li role="menuitem" class="ui-menu-item"><a tabindex="-1" class="ui-corner-all" href="#">Addyston</a></li>
|
||||
<li role="menuitem" class="ui-menu-item"><a tabindex="-1" class="ui-corner-all" href="#">Amesville</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li role="menuitem" class="ui-menu-item"><a tabindex="-1" class="ui-corner-all" href="#"><span class="ui-icon ui-icon-star"></span>Anaheim</a></li>
|
||||
<li role="menuitem" class="ui-menu-item"><a tabindex="-1" class="ui-corner-all" href="#"><span class="ui-icon ui-icon-heart"></span>Cologne</a></li>
|
||||
<li role="menuitem" class="ui-menu-item"><a tabindex="-1" class="ui-corner-all" href="#"><span class="ui-icon ui-icon-key"></span>Frankfurt</a></li>
|
||||
<li role="menuitem" class="ui-menu-item">
|
||||
<a tabindex="-1" class="ui-corner-all" href="#"><span class="ui-icon ui-menu-icon ui-icon-carat-1-e"></span>Magdeburg</a>
|
||||
<ul aria-activedescendant="ui-active-menuitem" role="listbox" class="ui-menu ui-widget ui-widget-content ui-corner-all" style="display: none;">
|
||||
<li role="menuitem" class="ui-menu-item"><a tabindex="-1" class="ui-corner-all" href="#">Mberdeen</a></li>
|
||||
<li role="menuitem" class="ui-menu-item"><a tabindex="-1" class="ui-corner-all" href="#">Mda</a></li>
|
||||
<li role="menuitem" class="ui-menu-item"><a tabindex="-1" class="ui-corner-all" href="#">Mdamsville</a></li>
|
||||
<li role="menuitem" class="ui-menu-item"><a tabindex="-1" class="ui-corner-all" href="#">Mddyston</a></li>
|
||||
<li role="menuitem" class="ui-menu-item"><a tabindex="-1" class="ui-corner-all" href="#">Mmesville</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li role="menuitem" class="ui-menu-item"><a tabindex="-1" class="ui-corner-all" href="#">Munich</a></li>
|
||||
<li role="menuitem" class="ui-menu-item"><a tabindex="-1" class="ui-corner-all" href="#">Utrecht</a></li>
|
||||
<li role="menuitem" class="ui-menu-item"><a tabindex="-1" class="ui-corner-all" href="#">Zurich</a></li>
|
||||
</ul>
|
||||
|
||||
</div>
|
||||
|
||||
<br /><br />
|
||||
|
||||
<div id="flyout">
|
||||
|
||||
<h2>Flyout / nested</h2>
|
||||
|
||||
<ul aria-activedescendant="ui-active-menuitem" role="listbox" class="ui-menu ui-menu-icons ui-widget ui-widget-content ui-corner-all" id="menu">
|
||||
<li role="menuitem" class="ui-menu-item">
|
||||
<a tabindex="-1" class="ui-corner-all" href="#"><span class="ui-icon ui-icon-scissors"></span>Amsterdam</a>
|
||||
<ul style="display: block; top: 88.5px; left: 205px;" aria-activedescendant="ui-active-menuitem" role="listbox" class="ui-menu ui-menu-icons ui-widget ui-widget-content ui-corner-all">
|
||||
<li role="menuitem" class="ui-menu-item"><a tabindex="-1" class="ui-corner-all" href="#">Aberdeen</a></li>
|
||||
<li role="menuitem" class="ui-menu-item"><a tabindex="-1" class="ui-corner-all" href="#">Ada</a></li>
|
||||
<li role="menuitem" class="ui-menu-item">
|
||||
<a tabindex="-1" class="ui-state-active ui-corner-all" href="#"><span class="ui-icon ui-icon-print"></span><span class="ui-icon ui-menu-icon ui-icon-carat-1-e"></span>Adamsville</a>
|
||||
<ul style="display: block; top: 73px; left: -11px; z-index: 9999;" aria-activedescendant="ui-active-menuitem" role="listbox" class="ui-menu ui-menu-icons ui-widget ui-widget-content ui-corner-all">
|
||||
<li role="menuitem" class="ui-menu-item"><a tabindex="-1" class="ui-corner-all" href="#">Anaheim</a></li>
|
||||
<li role="menuitem" class="ui-menu-item">
|
||||
<a tabindex="-1" class="ui-corner-all" href="#">Cologne</a>
|
||||
<ul style="display: none;" aria-activedescendant="ui-active-menuitem" role="listbox" class="ui-menu ui-menu-icons ui-widget ui-widget-content ui-corner-all">
|
||||
<li role="menuitem" class="ui-menu-item"><a tabindex="-1" class="ui-corner-all" href="#">Mberdeen</a></li>
|
||||
<li role="menuitem" class="ui-menu-item"><a tabindex="-1" class="ui-corner-all" href="#">Mda</a></li>
|
||||
<li role="menuitem" class="ui-menu-item"><a tabindex="-1" class="ui-corner-all" href="#">Mdamsville</a></li>
|
||||
<li role="menuitem" class="ui-menu-item"><a tabindex="-1" class="ui-corner-all" href="#">Mddyston</a></li>
|
||||
<li role="menuitem" class="ui-menu-item"><a tabindex="-1" class="ui-corner-all" href="#">Mmesville</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li role="menuitem" class="ui-menu-item"><a tabindex="-1" class="ui-state-hover ui-corner-all" href="#">Frankfurt</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li role="menuitem" class="ui-menu-item"><a tabindex="-1" class="ui-corner-all" href="#">Addyston</a></li>
|
||||
<li role="menuitem" class="ui-menu-item"><a tabindex="-1" class="ui-corner-all" href="#">Amesville</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li role="menuitem" class="ui-menu-item"><a tabindex="-1" class="ui-corner-all" href="#">Anaheim</a></li>
|
||||
<li role="menuitem" class="ui-menu-item"><a tabindex="-1" class="ui-corner-all" href="#"><span class="ui-icon ui-icon-pencil"></span>Cologne</a></li>
|
||||
<li role="menuitem" class="ui-menu-item"><a tabindex="-1" class="ui-corner-all" href="#"><span class="ui-icon ui-icon-clock"></span>Frankfurt</a></li>
|
||||
<li role="menuitem" class="ui-menu-item">
|
||||
<a tabindex="-1" class="ui-state-active ui-corner-all" href="#"><span class="ui-icon ui-icon-print"></span><span class="ui-icon ui-menu-icon ui-icon-carat-1-e"></span>Magdeburg</a>
|
||||
<ul style="display: none;" aria-activedescendant="ui-active-menuitem" role="listbox" class="ui-menu ui-menu-icons ui-widget ui-widget-content ui-corner-all">
|
||||
<li role="menuitem" class="ui-menu-item"><a tabindex="-1" class="ui-corner-all" href="#">Mberdeen</a></li>
|
||||
<li role="menuitem" class="ui-menu-item"><a tabindex="-1" class="ui-corner-all" href="#">Mda</a></li>
|
||||
<li role="menuitem" class="ui-menu-item"><a tabindex="-1" class="ui-corner-all" href="#">Mdamsville</a></li>
|
||||
<li role="menuitem" class="ui-menu-item"><a tabindex="-1" class="ui-corner-all" href="#">Mddyston</a></li>
|
||||
<li role="menuitem" class="ui-menu-item"><a tabindex="-1" class="ui-corner-all" href="#">Mmesville</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li role="menuitem" class="ui-menu-item"><a tabindex="-1" class="ui-corner-all" href="#"><span class="ui-icon ui-icon-lightbulb"></span>Munich</a></li>
|
||||
<li role="menuitem" class="ui-menu-item"><a tabindex="-1" class="ui-corner-all" href="#"><span class="ui-icon ui-icon-clipboard"></span>Utrecht</a></li>
|
||||
<li role="menuitem" class="ui-menu-item"><a tabindex="-1" class="ui-corner-all" href="#">Zurich</a></li>
|
||||
</ul>
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
</body>
|
||||
</html>
|
||||
@ -1,39 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<title>Menu 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.5.1.js"></script>
|
||||
<script type="text/javascript" src="../static.js"></script>
|
||||
|
||||
</head>
|
||||
<body>
|
||||
|
||||
|
||||
<ul role="menu" aria-activedescendant="ui-active-menuitem" class="ui-menu ui-widget ui-widget-content ui-corner-bottom">
|
||||
<li class="ui-menu-item" role="menuitem"><a href="#" tabindex="-1" class="ui-corner-all">Aberdeen</a></li>
|
||||
<li class="ui-menu-item" role="menuitem" id="ui-active-menuitem"><a href="#" tabindex="-1" class="ui-state-hover ui-corner-all">Ada</a></li>
|
||||
<li class="ui-menu-item" role="menuitem"><a href="#" tabindex="-1" class="ui-corner-all">Adamsville</a></li>
|
||||
<li class="ui-menu-item" role="menuitem"><a href="#" tabindex="-1" class="ui-corner-all">Addyston</a></li>
|
||||
<li class="ui-menu-item" role="menuitem"><a href="#" tabindex="-1" class="ui-corner-all">Adelphi</a></li>
|
||||
<li class="ui-menu-item" role="menuitem"><a href="#" tabindex="-1" class="ui-corner-all">Adena</a></li>
|
||||
<li class="ui-menu-item" role="menuitem"><a href="#" tabindex="-1" class="ui-corner-all">Adrian</a></li>
|
||||
<li class="ui-menu-item" role="menuitem"><a href="#" tabindex="-1" class="ui-corner-all">Akron</a></li>
|
||||
<li class="ui-menu-item" role="menuitem"><a href="#" tabindex="-1" class="ui-corner-all">Albany</a></li>
|
||||
<li class="ui-menu-item" role="menuitem"><a href="#" tabindex="-1" class="ui-corner-all">Alexandria</a></li>
|
||||
<li class="ui-menu-item" role="menuitem"><a href="#" tabindex="-1" class="ui-corner-all">Alger</a></li>
|
||||
<li class="ui-menu-item" role="menuitem"><a href="#" tabindex="-1" class="ui-corner-all">Alledonia</a></li>
|
||||
<li class="ui-menu-item" role="menuitem"><a href="#" tabindex="-1" class="ui-corner-all">Alliance</a></li>
|
||||
<li class="ui-menu-item" role="menuitem"><a href="#" tabindex="-1" class="ui-corner-all">Alpha</a></li>
|
||||
<li class="ui-menu-item" role="menuitem"><a href="#" tabindex="-1" class="ui-corner-all">Alvada</a></li>
|
||||
<li class="ui-menu-item" role="menuitem"><a href="#" tabindex="-1" class="ui-corner-all">Alvordton</a></li>
|
||||
<li class="ui-menu-item" role="menuitem"><a href="#" tabindex="-1" class="ui-corner-all">Amanda</a></li>
|
||||
<li class="ui-menu-item" role="menuitem"><a href="#" tabindex="-1" class="ui-corner-all">Amelia</a></li>
|
||||
<li class="ui-menu-item" role="menuitem"><a href="#" tabindex="-1" class="ui-corner-all">Amesville</a></li>
|
||||
</ul>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
@ -1,4 +1,4 @@
|
||||
<!DOCTYPE html>
|
||||
<!doctype html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
@ -20,7 +20,7 @@
|
||||
<script src="../testsuite.js"></script>
|
||||
|
||||
<script>
|
||||
function state( accordion ) {
|
||||
function accordion_state( accordion ) {
|
||||
var expected = $.makeArray( arguments ).slice( 1 );
|
||||
var actual = accordion.find( ".ui-accordion-content" ).map(function() {
|
||||
return $( this ).css( "display" ) === "none" ? 0 : 1;
|
||||
@ -54,7 +54,6 @@
|
||||
<script src="accordion_events.js"></script>
|
||||
<script src="accordion_methods.js"></script>
|
||||
<script src="accordion_options.js"></script>
|
||||
<script src="accordion_tickets.js"></script>
|
||||
|
||||
<script src="../swarminject.js"></script>
|
||||
<style>
|
||||
@ -130,8 +129,8 @@
|
||||
<li>
|
||||
<h2><a href="?p=1.1.3">Drums</a></h2>
|
||||
<ul>
|
||||
<li><a href="?p=1.1.3.2">Acoustic Drums</a></li>
|
||||
<li><a href="?p=1.1.3.3">Electronic Drums</a></li>
|
||||
<li><a href="?p=1.1.3.2">Acoustic</a></li>
|
||||
<li><a href="?p=1.1.3.3">Electronic</a></li>
|
||||
<li><a href="?p=1.1.3.6">Accessories</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
|
||||
@ -4,46 +4,46 @@ module( "accordion: core", accordionSetupTeardown() );
|
||||
|
||||
$.each( { div: "#list1", ul: "#navigation", dl: "#accordion-dl" }, function( type, selector ) {
|
||||
test( "markup structure: " + type, function() {
|
||||
var ac = $( selector ).accordion();
|
||||
ok( ac.hasClass( "ui-accordion" ), "main element is .ui-accordion" );
|
||||
equal( ac.find( ".ui-accordion-header" ).length, 3,
|
||||
var element = $( selector ).accordion();
|
||||
ok( element.hasClass( "ui-accordion" ), "main element is .ui-accordion" );
|
||||
equal( element.find( ".ui-accordion-header" ).length, 3,
|
||||
".ui-accordion-header elements exist, correct number" );
|
||||
equal( ac.find( ".ui-accordion-content" ).length, 3,
|
||||
equal( element.find( ".ui-accordion-content" ).length, 3,
|
||||
".ui-accordion-content elements exist, correct number" );
|
||||
same( ac.find( ".ui-accordion-header" ).next().get(),
|
||||
ac.find( ".ui-accordion-content" ).get(),
|
||||
same( element.find( ".ui-accordion-header" ).next().get(),
|
||||
element.find( ".ui-accordion-content" ).get(),
|
||||
"content panels come immediately after headers" );
|
||||
});
|
||||
});
|
||||
|
||||
test( "handle click on header-descendant", function() {
|
||||
var ac = $( "#navigation" ).accordion();
|
||||
var element = $( "#navigation" ).accordion();
|
||||
$( "#navigation h2:eq(1) a" ).click();
|
||||
state( ac, 0, 1, 0 );
|
||||
accordion_state( element, 0, 1, 0 );
|
||||
});
|
||||
|
||||
test( "ui-accordion-heading class added to headers anchor", function() {
|
||||
expect( 1 );
|
||||
var ac = $( "#list1" ).accordion();
|
||||
var anchors = $( ".ui-accordion-heading" );
|
||||
var element = $( "#list1" ).accordion();
|
||||
var anchors = element.find( ".ui-accordion-heading" );
|
||||
equals( anchors.length, 3 );
|
||||
});
|
||||
|
||||
test( "accessibility", function () {
|
||||
expect( 13 );
|
||||
var ac = $( "#list1" ).accordion().accordion( "option", "active", 1 );
|
||||
var headers = $( ".ui-accordion-header" );
|
||||
var element = $( "#list1" ).accordion().accordion( "option", "active", 1 );
|
||||
var headers = element.find( ".ui-accordion-header" );
|
||||
|
||||
equals( headers.eq( 1 ).attr( "tabindex" ), 0, "active header should have tabindex=0" );
|
||||
equals( headers.eq( 0 ).attr( "tabindex" ), -1, "inactive header should have tabindex=-1" );
|
||||
equals( ac.attr( "role" ), "tablist", "main role" );
|
||||
equals( element.attr( "role" ), "tablist", "main role" );
|
||||
equals( headers.attr( "role" ), "tab", "tab roles" );
|
||||
equals( headers.next().attr( "role" ), "tabpanel", "tabpanel roles" );
|
||||
equals( headers.eq( 1 ).attr( "aria-expanded" ), "true", "active tab has aria-expanded" );
|
||||
equals( headers.eq( 0 ).attr( "aria-expanded" ), "false", "inactive tab has aria-expanded" );
|
||||
equals( headers.eq( 1 ).attr( "aria-selected" ), "true", "active tab has aria-selected" );
|
||||
equals( headers.eq( 0 ).attr( "aria-selected" ), "false", "inactive tab has aria-selected" );
|
||||
ac.accordion( "option", "active", 0 );
|
||||
element.accordion( "option", "active", 0 );
|
||||
equals( headers.eq( 0 ).attr( "aria-expanded" ), "true", "newly active tab has aria-expanded" );
|
||||
equals( headers.eq( 1 ).attr( "aria-expanded" ), "false", "newly inactive tab has aria-expanded" );
|
||||
equals( headers.eq( 0 ).attr( "aria-selected" ), "true", "active tab has aria-selected" );
|
||||
|
||||
@ -10,6 +10,11 @@ commonWidgetTests( "accordion", {
|
||||
icons: {
|
||||
"activeHeader": "ui-icon-triangle-1-s",
|
||||
"header": "ui-icon-triangle-1-e"
|
||||
}
|
||||
},
|
||||
|
||||
// callbacks
|
||||
activate: null,
|
||||
beforeActivate: null,
|
||||
create: null
|
||||
}
|
||||
});
|
||||
|
||||
@ -16,6 +16,13 @@ commonWidgetTests( "accordion", {
|
||||
"headerSelected": "ui-icon-triangle-1-s"
|
||||
},
|
||||
navigation: false,
|
||||
navigationFilter: function() {}
|
||||
navigationFilter: function() {},
|
||||
|
||||
// callbacks
|
||||
activate: null,
|
||||
beforeActivate: null,
|
||||
change: null,
|
||||
changestart: null,
|
||||
create: null
|
||||
}
|
||||
});
|
||||
|
||||
@ -1,4 +1,4 @@
|
||||
<!DOCTYPE html>
|
||||
<!doctype html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
@ -17,7 +17,7 @@
|
||||
<script src="../testsuite.js"></script>
|
||||
|
||||
<script>
|
||||
function state( accordion ) {
|
||||
function accordion_state( accordion ) {
|
||||
var expected = $.makeArray( arguments ).slice( 1 );
|
||||
var actual = accordion.find( ".ui-accordion-content" ).map(function() {
|
||||
return $( this ).css( "display" ) === "none" ? 0 : 1;
|
||||
@ -51,7 +51,6 @@
|
||||
<script src="accordion_events.js"></script>
|
||||
<script src="accordion_methods.js"></script>
|
||||
<script src="accordion_options.js"></script>
|
||||
<script src="accordion_tickets.js"></script>
|
||||
<script src="accordion_deprecated.js"></script>
|
||||
|
||||
<script src="../swarminject.js"></script>
|
||||
@ -128,8 +127,8 @@
|
||||
<li>
|
||||
<h2><a href="?p=1.1.3">Drums</a></h2>
|
||||
<ul>
|
||||
<li><a href="?p=1.1.3.2">Acoustic Drums</a></li>
|
||||
<li><a href="?p=1.1.3.3">Electronic Drums</a></li>
|
||||
<li><a href="?p=1.1.3.2">Acoustic</a></li>
|
||||
<li><a href="?p=1.1.3.3">Electronic</a></li>
|
||||
<li><a href="?p=1.1.3.6">Accessories</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
@ -3,89 +3,89 @@
|
||||
module( "accordion (deprecated): expanded active option, activate method", accordionSetupTeardown() );
|
||||
|
||||
test( "activate, numeric", function() {
|
||||
var ac = $( "#list1" ).accordion({ active: 1 });
|
||||
state( ac, 0, 1, 0 );
|
||||
ac.accordion( "activate", 2 );
|
||||
state( ac, 0, 0, 1 );
|
||||
ac.accordion( "activate", 0 );
|
||||
state( ac, 1, 0, 0 );
|
||||
ac.accordion( "activate", 1 );
|
||||
state( ac, 0, 1, 0 );
|
||||
ac.accordion( "activate", 2 );
|
||||
state( ac, 0, 0, 1 );
|
||||
var element = $( "#list1" ).accordion({ active: 1 });
|
||||
accordion_state( element, 0, 1, 0 );
|
||||
element.accordion( "activate", 2 );
|
||||
accordion_state( element, 0, 0, 1 );
|
||||
element.accordion( "activate", 0 );
|
||||
accordion_state( element, 1, 0, 0 );
|
||||
element.accordion( "activate", 1 );
|
||||
accordion_state( element, 0, 1, 0 );
|
||||
element.accordion( "activate", 2 );
|
||||
accordion_state( element, 0, 0, 1 );
|
||||
});
|
||||
|
||||
test( "activate, numeric, collapsible:true", function() {
|
||||
var ac = $( "#list1" ).accordion({ collapsible: true });
|
||||
ac.accordion( "activate", 2 );
|
||||
state( ac, 0, 0, 1 );
|
||||
ac.accordion( "activate", 0 );
|
||||
state( ac, 1, 0, 0 );
|
||||
ac.accordion( "activate", -1 );
|
||||
state( ac, 0, 0, 0 );
|
||||
var element = $( "#list1" ).accordion({ collapsible: true });
|
||||
element.accordion( "activate", 2 );
|
||||
accordion_state( element, 0, 0, 1 );
|
||||
element.accordion( "activate", 0 );
|
||||
accordion_state( element, 1, 0, 0 );
|
||||
element.accordion( "activate", -1 );
|
||||
accordion_state( element, 0, 0, 0 );
|
||||
});
|
||||
|
||||
test( "activate, boolean, collapsible: true", function() {
|
||||
var ac = $( "#list1" ).accordion({ collapsible: true });
|
||||
ac.accordion( "activate", 2 );
|
||||
state( ac, 0, 0, 1 );
|
||||
ac.accordion( "activate", false );
|
||||
state( ac, 0, 0, 0 );
|
||||
var element = $( "#list1" ).accordion({ collapsible: true });
|
||||
element.accordion( "activate", 2 );
|
||||
accordion_state( element, 0, 0, 1 );
|
||||
element.accordion( "activate", false );
|
||||
accordion_state( element, 0, 0, 0 );
|
||||
});
|
||||
|
||||
test( "activate, boolean, collapsible: false", function() {
|
||||
var ac = $( "#list1" ).accordion();
|
||||
ac.accordion( "activate", 2 );
|
||||
state( ac, 0, 0, 1 );
|
||||
ac.accordion( "activate", false );
|
||||
state( ac, 0, 0, 1 );
|
||||
var element = $( "#list1" ).accordion();
|
||||
element.accordion( "activate", 2 );
|
||||
accordion_state( element, 0, 0, 1 );
|
||||
element.accordion( "activate", false );
|
||||
accordion_state( element, 0, 0, 1 );
|
||||
});
|
||||
|
||||
test( "activate, string expression", function() {
|
||||
var ac = $( "#list1" ).accordion({ active: "h3:last" });
|
||||
state( ac, 0, 0, 1 );
|
||||
ac.accordion( "activate", ":first" );
|
||||
state( ac, 1, 0, 0 );
|
||||
ac.accordion( "activate", ":eq(1)" );
|
||||
state( ac, 0, 1, 0 );
|
||||
ac.accordion( "activate", ":last" );
|
||||
state( ac, 0, 0, 1 );
|
||||
var element = $( "#list1" ).accordion({ active: "h3:last" });
|
||||
accordion_state( element, 0, 0, 1 );
|
||||
element.accordion( "activate", ":first" );
|
||||
accordion_state( element, 1, 0, 0 );
|
||||
element.accordion( "activate", ":eq(1)" );
|
||||
accordion_state( element, 0, 1, 0 );
|
||||
element.accordion( "activate", ":last" );
|
||||
accordion_state( element, 0, 0, 1 );
|
||||
});
|
||||
|
||||
test( "activate, jQuery or DOM element", function() {
|
||||
var ac = $( "#list1" ).accordion({ active: $( "#list1 h3:last" ) });
|
||||
state( ac, 0, 0, 1 );
|
||||
ac.accordion( "activate", $( "#list1 h3:first" ) );
|
||||
state( ac, 1, 0, 0 );
|
||||
ac.accordion( "activate", $( "#list1 h3" )[ 1 ] );
|
||||
state( ac, 0, 1, 0 );
|
||||
var element = $( "#list1" ).accordion({ active: $( "#list1 h3:last" ) });
|
||||
accordion_state( element, 0, 0, 1 );
|
||||
element.accordion( "activate", $( "#list1 h3:first" ) );
|
||||
accordion_state( element, 1, 0, 0 );
|
||||
element.accordion( "activate", $( "#list1 h3" )[ 1 ] );
|
||||
accordion_state( element, 0, 1, 0 );
|
||||
});
|
||||
|
||||
test( "{ active: Selector }", function() {
|
||||
var ac = $("#list1").accordion({
|
||||
var element = $("#list1").accordion({
|
||||
active: "h3:last"
|
||||
});
|
||||
state( ac, 0, 0, 1 );
|
||||
ac.accordion( "option", "active", "h3:eq(1)" );
|
||||
state( ac, 0, 1, 0 );
|
||||
accordion_state( element, 0, 0, 1 );
|
||||
element.accordion( "option", "active", "h3:eq(1)" );
|
||||
accordion_state( element, 0, 1, 0 );
|
||||
});
|
||||
|
||||
test( "{ active: Element }", function() {
|
||||
var ac = $( "#list1" ).accordion({
|
||||
var element = $( "#list1" ).accordion({
|
||||
active: $( "#list1 h3:last" )[ 0 ]
|
||||
});
|
||||
state( ac, 0, 0, 1 );
|
||||
ac.accordion( "option", "active", $( "#list1 h3:eq(1)" )[ 0 ] );
|
||||
state( ac, 0, 1, 0 );
|
||||
accordion_state( element, 0, 0, 1 );
|
||||
element.accordion( "option", "active", $( "#list1 h3:eq(1)" )[ 0 ] );
|
||||
accordion_state( element, 0, 1, 0 );
|
||||
});
|
||||
|
||||
test( "{ active: jQuery Object }", function() {
|
||||
var ac = $( "#list1" ).accordion({
|
||||
var element = $( "#list1" ).accordion({
|
||||
active: $( "#list1 h3:last" )
|
||||
});
|
||||
state( ac, 0, 0, 1 );
|
||||
ac.accordion( "option", "active", $( "#list1 h3:eq(1)" ) );
|
||||
state( ac, 0, 1, 0 );
|
||||
accordion_state( element, 0, 0, 1 );
|
||||
element.accordion( "option", "active", $( "#list1 h3:eq(1)" ) );
|
||||
accordion_state( element, 0, 1, 0 );
|
||||
});
|
||||
|
||||
|
||||
@ -99,9 +99,9 @@ test( "{ autoHeight: true }, default", function() {
|
||||
});
|
||||
|
||||
test("{ autoHeight: false }", function() {
|
||||
var accordion = $('#navigation').accordion({ autoHeight: false });
|
||||
var element = $('#navigation').accordion({ autoHeight: false });
|
||||
var sizes = [];
|
||||
accordion.find(".ui-accordion-content").each(function() {
|
||||
element.find(".ui-accordion-content").each(function() {
|
||||
sizes.push($(this).height());
|
||||
});
|
||||
ok( sizes[0] >= 70 && sizes[0] <= 105, "was " + sizes[0] );
|
||||
@ -111,8 +111,8 @@ test("{ autoHeight: false }", function() {
|
||||
|
||||
test( "{ fillSpace: true }", function() {
|
||||
$( "#navigationWrapper" ).height( 500 );
|
||||
var ac = $( "#navigation" ).accordion({ fillSpace: true });
|
||||
equalHeights( ac, 446, 458 );
|
||||
var element = $( "#navigation" ).accordion({ fillSpace: true });
|
||||
equalHeights( element, 446, 458 );
|
||||
});
|
||||
|
||||
test( "{ fillSapce: true } with sibling", function() {
|
||||
@ -124,8 +124,8 @@ test( "{ fillSapce: true } with sibling", function() {
|
||||
marginBottom: 30
|
||||
})
|
||||
.prependTo( "#navigationWrapper" );
|
||||
var ac = $( "#navigation" ).accordion({ fillSpace: true });
|
||||
equalHeights( ac , 346, 358);
|
||||
var element = $( "#navigation" ).accordion({ fillSpace: true });
|
||||
equalHeights( element , 346, 358);
|
||||
});
|
||||
|
||||
test( "{ fillSpace: true } with multiple siblings", function() {
|
||||
@ -152,8 +152,8 @@ test( "{ fillSpace: true } with multiple siblings", function() {
|
||||
marginBottom: 15
|
||||
})
|
||||
.prependTo( "#navigationWrapper" );
|
||||
var ac = $( "#navigation" ).accordion({ fillSpace: true });
|
||||
equalHeights( ac, 296, 308 );
|
||||
var element = $( "#navigation" ).accordion({ fillSpace: true });
|
||||
equalHeights( element, 296, 308 );
|
||||
});
|
||||
|
||||
|
||||
@ -163,13 +163,13 @@ test( "{ fillSpace: true } with multiple siblings", function() {
|
||||
module( "accordion (deprecated) - icons", accordionSetupTeardown() );
|
||||
|
||||
test( "icons, headerSelected", function() {
|
||||
var list = $( "#list1" ).accordion({
|
||||
var element = $( "#list1" ).accordion({
|
||||
icons: { headerSelected: "a1", header: "h1" }
|
||||
});
|
||||
ok( list.find( ".ui-accordion-header.ui-state-active span.ui-icon" ).hasClass( "a1" ) );
|
||||
list.accordion( "option", "icons", { headerSelected: "a2", header: "h2" } );
|
||||
ok( !list.find( ".ui-accordion-header.ui-state-active span.ui-icon" ).hasClass( "a1" ) );
|
||||
ok( list.find( ".ui-accordion-header.ui-state-active span.ui-icon" ).hasClass( "a2" ) );
|
||||
ok( element.find( ".ui-accordion-header.ui-state-active span.ui-icon" ).hasClass( "a1" ) );
|
||||
element.accordion( "option", "icons", { headerSelected: "a2", header: "h2" } );
|
||||
ok( !element.find( ".ui-accordion-header.ui-state-active span.ui-icon" ).hasClass( "a1" ) );
|
||||
ok( element.find( ".ui-accordion-header.ui-state-active span.ui-icon" ).hasClass( "a2" ) );
|
||||
});
|
||||
|
||||
|
||||
@ -179,18 +179,18 @@ test( "icons, headerSelected", function() {
|
||||
module( "accordion (deprecated) - resize", accordionSetupTeardown() );
|
||||
|
||||
test( "resize", function() {
|
||||
var expected = $( "#navigation" )
|
||||
var element = $( "#navigation" )
|
||||
.parent()
|
||||
.height( 300 )
|
||||
.end()
|
||||
.accordion({
|
||||
heightStyle: "fill"
|
||||
});
|
||||
equalHeights( expected, 246, 258 );
|
||||
equalHeights( element, 246, 258 );
|
||||
|
||||
expected.parent().height( 500 );
|
||||
expected.accordion( "resize" );
|
||||
equalHeights( expected, 446, 458 );
|
||||
element.parent().height( 500 );
|
||||
element.accordion( "resize" );
|
||||
equalHeights( element, 446, 458 );
|
||||
});
|
||||
|
||||
|
||||
@ -200,25 +200,25 @@ test( "resize", function() {
|
||||
module( "accordion (deprecated) - navigation", accordionSetupTeardown() );
|
||||
|
||||
test( "{ navigation: true, navigationFilter: header }", function() {
|
||||
var ac = $( "#navigation" ).accordion({
|
||||
var element = $( "#navigation" ).accordion({
|
||||
navigation: true,
|
||||
navigationFilter: function() {
|
||||
return /\?p=1\.1\.3$/.test( this.href );
|
||||
}
|
||||
});
|
||||
equal( ac.accordion( "option", "active" ), 2 );
|
||||
state( ac, 0, 0, 1 );
|
||||
equal( element.accordion( "option", "active" ), 2 );
|
||||
accordion_state( element, 0, 0, 1 );
|
||||
});
|
||||
|
||||
test( "{ navigation: true, navigationFilter: content }", function() {
|
||||
var ac = $("#navigation").accordion({
|
||||
var element = $("#navigation").accordion({
|
||||
navigation: true,
|
||||
navigationFilter: function() {
|
||||
return /\?p=1\.1\.3\.2$/.test(this.href);
|
||||
}
|
||||
});
|
||||
equal( ac.accordion( "option", "active" ), 2 );
|
||||
state( ac, 0, 0, 1 );
|
||||
equal( element.accordion( "option", "active" ), 2 );
|
||||
accordion_state( element, 0, 0, 1 );
|
||||
});
|
||||
|
||||
|
||||
@ -229,26 +229,26 @@ module( "accordion (deprecated) - changestart/change events", accordionSetupTear
|
||||
|
||||
test( "changestart", function() {
|
||||
expect( 26 );
|
||||
var ac = $( "#list1" ).accordion({
|
||||
var element = $( "#list1" ).accordion({
|
||||
active: false,
|
||||
collapsible: true
|
||||
});
|
||||
var headers = ac.find( ".ui-accordion-header" );
|
||||
var content = ac.find( ".ui-accordion-content" );
|
||||
var headers = element.find( ".ui-accordion-header" );
|
||||
var content = element.find( ".ui-accordion-content" );
|
||||
|
||||
ac.one( "accordionchangestart", function( event, ui ) {
|
||||
element.one( "accordionchangestart", function( event, ui ) {
|
||||
equals( ui.oldHeader.size(), 0 );
|
||||
equals( ui.oldContent.size(), 0 );
|
||||
equals( ui.newHeader.size(), 1 );
|
||||
strictEqual( ui.newHeader[ 0 ], headers[ 0 ] );
|
||||
equals( ui.newContent.size(), 1 );
|
||||
strictEqual( ui.newContent[ 0 ], content[ 0 ] );
|
||||
state( ac, 0, 0, 0 );
|
||||
accordion_state( element, 0, 0, 0 );
|
||||
});
|
||||
ac.accordion( "option", "active", 0 );
|
||||
state( ac, 1, 0, 0 );
|
||||
element.accordion( "option", "active", 0 );
|
||||
accordion_state( element, 1, 0, 0 );
|
||||
|
||||
ac.one( "accordionchangestart", function( event, ui ) {
|
||||
element.one( "accordionchangestart", function( event, ui ) {
|
||||
equals( ui.oldHeader.size(), 1 );
|
||||
strictEqual( ui.oldHeader[ 0 ], headers[ 0 ] );
|
||||
equals( ui.oldContent.size(), 1 );
|
||||
@ -257,34 +257,34 @@ test( "changestart", function() {
|
||||
strictEqual( ui.newHeader[ 0 ], headers[ 1 ] );
|
||||
equals( ui.newContent.size(), 1 );
|
||||
strictEqual( ui.newContent[ 0 ], content[ 1 ] );
|
||||
state( ac, 1, 0, 0 );
|
||||
accordion_state( element, 1, 0, 0 );
|
||||
});
|
||||
headers.eq( 1 ).click();
|
||||
state( ac, 0, 1, 0 );
|
||||
accordion_state( element, 0, 1, 0 );
|
||||
|
||||
ac.one( "accordionchangestart", function( event, ui ) {
|
||||
element.one( "accordionchangestart", function( event, ui ) {
|
||||
equals( ui.oldHeader.size(), 1 );
|
||||
strictEqual( ui.oldHeader[ 0 ], headers[ 1 ] );
|
||||
equals( ui.oldContent.size(), 1 );
|
||||
strictEqual( ui.oldContent[ 0 ], content[ 1 ] );
|
||||
equals( ui.newHeader.size(), 0 );
|
||||
equals( ui.newContent.size(), 0 );
|
||||
state( ac, 0, 1, 0 );
|
||||
accordion_state( element, 0, 1, 0 );
|
||||
});
|
||||
ac.accordion( "option", "active", false );
|
||||
state( ac, 0, 0, 0 );
|
||||
element.accordion( "option", "active", false );
|
||||
accordion_state( element, 0, 0, 0 );
|
||||
});
|
||||
|
||||
test( "change", function() {
|
||||
expect( 20 );
|
||||
var ac = $( "#list1" ).accordion({
|
||||
var element = $( "#list1" ).accordion({
|
||||
active: false,
|
||||
collapsible: true
|
||||
});
|
||||
var headers = ac.find( ".ui-accordion-header" );
|
||||
var content = ac.find( ".ui-accordion-content" );
|
||||
var headers = element.find( ".ui-accordion-header" );
|
||||
var content = element.find( ".ui-accordion-content" );
|
||||
|
||||
ac.one( "accordionchange", function( event, ui ) {
|
||||
element.one( "accordionchange", function( event, ui ) {
|
||||
equals( ui.oldHeader.size(), 0 );
|
||||
equals( ui.oldContent.size(), 0 );
|
||||
equals( ui.newHeader.size(), 1 );
|
||||
@ -292,9 +292,9 @@ test( "change", function() {
|
||||
equals( ui.newContent.size(), 1 );
|
||||
strictEqual( ui.newContent[ 0 ], content[ 0 ] );
|
||||
});
|
||||
ac.accordion( "option", "active", 0 );
|
||||
element.accordion( "option", "active", 0 );
|
||||
|
||||
ac.one( "accordionchange", function( event, ui ) {
|
||||
element.one( "accordionchange", function( event, ui ) {
|
||||
equals( ui.oldHeader.size(), 1 );
|
||||
strictEqual( ui.oldHeader[ 0 ], headers[ 0 ] );
|
||||
equals( ui.oldContent.size(), 1 );
|
||||
@ -306,7 +306,7 @@ test( "change", function() {
|
||||
});
|
||||
headers.eq( 1 ).click();
|
||||
|
||||
ac.one( "accordionchange", function( event, ui ) {
|
||||
element.one( "accordionchange", function( event, ui ) {
|
||||
equals( ui.oldHeader.size(), 1 );
|
||||
strictEqual( ui.oldHeader[ 0 ], headers[ 1 ] );
|
||||
equals( ui.oldContent.size(), 1 );
|
||||
@ -314,7 +314,7 @@ test( "change", function() {
|
||||
equals( ui.newHeader.size(), 0 );
|
||||
equals( ui.newContent.size(), 0 );
|
||||
});
|
||||
ac.accordion( "option", "active", false );
|
||||
element.accordion( "option", "active", false );
|
||||
});
|
||||
|
||||
})(jQuery);
|
||||
|
||||
@ -3,27 +3,29 @@
|
||||
module( "accordion: events", accordionSetupTeardown() );
|
||||
|
||||
test( "beforeActivate", function() {
|
||||
expect( 42 );
|
||||
var ac = $( "#list1" ).accordion({
|
||||
expect( 38 );
|
||||
var element = $( "#list1" ).accordion({
|
||||
active: false,
|
||||
collapsible: true
|
||||
});
|
||||
var headers = ac.find( ".ui-accordion-header" );
|
||||
var content = ac.find( ".ui-accordion-content" );
|
||||
var headers = element.find( ".ui-accordion-header" );
|
||||
var content = element.find( ".ui-accordion-content" );
|
||||
|
||||
ac.one( "accordionbeforeactivate", function( event, ui ) {
|
||||
element.one( "accordionbeforeactivate", function( event, ui ) {
|
||||
ok( !( "originalEvent" in event ) );
|
||||
equals( ui.oldHeader.size(), 0 );
|
||||
equals( ui.oldContent.size(), 0 );
|
||||
equals( ui.newHeader.size(), 1 );
|
||||
strictEqual( ui.newHeader[ 0 ], headers[ 0 ] );
|
||||
equals( ui.newContent.size(), 1 );
|
||||
strictEqual( ui.newContent[ 0 ], content[ 0 ] );
|
||||
state( ac, 0, 0, 0 );
|
||||
accordion_state( element, 0, 0, 0 );
|
||||
});
|
||||
ac.accordion( "option", "active", 0 );
|
||||
state( ac, 1, 0, 0 );
|
||||
element.accordion( "option", "active", 0 );
|
||||
accordion_state( element, 1, 0, 0 );
|
||||
|
||||
ac.one( "accordionbeforeactivate", function( event, ui ) {
|
||||
element.one( "accordionbeforeactivate", function( event, ui ) {
|
||||
equals( event.originalEvent.type, "click" );
|
||||
equals( ui.oldHeader.size(), 1 );
|
||||
strictEqual( ui.oldHeader[ 0 ], headers[ 0 ] );
|
||||
equals( ui.oldContent.size(), 1 );
|
||||
@ -32,37 +34,26 @@ test( "beforeActivate", function() {
|
||||
strictEqual( ui.newHeader[ 0 ], headers[ 1 ] );
|
||||
equals( ui.newContent.size(), 1 );
|
||||
strictEqual( ui.newContent[ 0 ], content[ 1 ] );
|
||||
state( ac, 1, 0, 0 );
|
||||
accordion_state( element, 1, 0, 0 );
|
||||
});
|
||||
headers.eq( 1 ).click();
|
||||
state( ac, 0, 1, 0 );
|
||||
accordion_state( element, 0, 1, 0 );
|
||||
|
||||
ac.one( "accordionbeforeactivate", function( event, ui ) {
|
||||
element.one( "accordionbeforeactivate", function( event, ui ) {
|
||||
ok( !( "originalEvent" in event ) );
|
||||
equals( ui.oldHeader.size(), 1 );
|
||||
strictEqual( ui.oldHeader[ 0 ], headers[ 1 ] );
|
||||
equals( ui.oldContent.size(), 1 );
|
||||
strictEqual( ui.oldContent[ 0 ], content[ 1 ] );
|
||||
equals( ui.newHeader.size(), 0 );
|
||||
equals( ui.newContent.size(), 0 );
|
||||
state( ac, 0, 1, 0 );
|
||||
accordion_state( element, 0, 1, 0 );
|
||||
});
|
||||
ac.accordion( "option", "active", false );
|
||||
state( ac, 0, 0, 0 );
|
||||
element.accordion( "option", "active", false );
|
||||
accordion_state( element, 0, 0, 0 );
|
||||
|
||||
ac.one( "accordionbeforeactivate", function( event, ui ) {
|
||||
equals( ui.oldHeader.size(), 0 );
|
||||
equals( ui.oldContent.size(), 0 );
|
||||
equals( ui.newHeader.size(), 1 );
|
||||
strictEqual( ui.newHeader[ 0 ], headers[ 1 ] );
|
||||
equals( ui.newContent.size(), 1 );
|
||||
strictEqual( ui.newContent[ 0 ], content[ 1 ] );
|
||||
event.preventDefault();
|
||||
state( ac, 0, 0, 0 );
|
||||
});
|
||||
ac.accordion( "option", "active", 1 );
|
||||
state( ac, 0, 0, 0 );
|
||||
|
||||
ac.one( "accordionbeforeactivate", function( event, ui ) {
|
||||
element.one( "accordionbeforeactivate", function( event, ui ) {
|
||||
ok( !( "originalEvent" in event ) );
|
||||
equals( ui.oldHeader.size(), 0 );
|
||||
equals( ui.oldContent.size(), 0 );
|
||||
equals( ui.newHeader.size(), 1 );
|
||||
@ -70,22 +61,22 @@ test( "beforeActivate", function() {
|
||||
equals( ui.newContent.size(), 1 );
|
||||
strictEqual( ui.newContent[ 0 ], content[ 2 ] );
|
||||
event.preventDefault();
|
||||
state( ac, 0, 0, 0 );
|
||||
accordion_state( element, 0, 0, 0 );
|
||||
});
|
||||
headers.eq( 2 ).click();
|
||||
state( ac, 0, 0, 0 );
|
||||
element.accordion( "option", "active", 2 );
|
||||
accordion_state( element, 0, 0, 0 );
|
||||
});
|
||||
|
||||
test( "activate", function() {
|
||||
expect( 20 );
|
||||
var ac = $( "#list1" ).accordion({
|
||||
expect( 21 );
|
||||
var element = $( "#list1" ).accordion({
|
||||
active: false,
|
||||
collapsible: true
|
||||
});
|
||||
var headers = ac.find( ".ui-accordion-header" );
|
||||
var content = ac.find( ".ui-accordion-content" );
|
||||
var headers = element.find( ".ui-accordion-header" );
|
||||
var content = element.find( ".ui-accordion-content" );
|
||||
|
||||
ac.one( "accordionactivate", function( event, ui ) {
|
||||
element.one( "accordionactivate", function( event, ui ) {
|
||||
equals( ui.oldHeader.size(), 0 );
|
||||
equals( ui.oldContent.size(), 0 );
|
||||
equals( ui.newHeader.size(), 1 );
|
||||
@ -93,9 +84,9 @@ test( "activate", function() {
|
||||
equals( ui.newContent.size(), 1 );
|
||||
strictEqual( ui.newContent[ 0 ], content[ 0 ] );
|
||||
});
|
||||
ac.accordion( "option", "active", 0 );
|
||||
element.accordion( "option", "active", 0 );
|
||||
|
||||
ac.one( "accordionactivate", function( event, ui ) {
|
||||
element.one( "accordionactivate", function( event, ui ) {
|
||||
equals( ui.oldHeader.size(), 1 );
|
||||
strictEqual( ui.oldHeader[ 0 ], headers[ 0 ] );
|
||||
equals( ui.oldContent.size(), 1 );
|
||||
@ -107,7 +98,7 @@ test( "activate", function() {
|
||||
});
|
||||
headers.eq( 1 ).click();
|
||||
|
||||
ac.one( "accordionactivate", function( event, ui ) {
|
||||
element.one( "accordionactivate", function( event, ui ) {
|
||||
equals( ui.oldHeader.size(), 1 );
|
||||
strictEqual( ui.oldHeader[ 0 ], headers[ 1 ] );
|
||||
equals( ui.oldContent.size(), 1 );
|
||||
@ -115,7 +106,17 @@ test( "activate", function() {
|
||||
equals( ui.newHeader.size(), 0 );
|
||||
equals( ui.newContent.size(), 0 );
|
||||
});
|
||||
ac.accordion( "option", "active", false );
|
||||
element.accordion( "option", "active", false );
|
||||
|
||||
// prevent activation
|
||||
element.one( "accordionbeforeactivate", function( event ) {
|
||||
ok( true );
|
||||
event.preventDefault();
|
||||
});
|
||||
element.one( "accordionactivate", function() {
|
||||
ok( false );
|
||||
});
|
||||
element.accordion( "option", "active", 1 );
|
||||
});
|
||||
|
||||
}( jQuery ) );
|
||||
|
||||
@ -9,29 +9,29 @@ test( "destroy", function() {
|
||||
});
|
||||
|
||||
test( "enable/disable", function() {
|
||||
var accordion = $('#list1').accordion();
|
||||
state( accordion, 1, 0, 0 );
|
||||
accordion.accordion( "disable" );
|
||||
accordion.accordion( "option", "active", 1 );
|
||||
state( accordion, 1, 0, 0 );
|
||||
accordion.accordion( "enable" );
|
||||
accordion.accordion( "option", "active", 1 );
|
||||
state( accordion, 0, 1, 0 );
|
||||
var element = $('#list1').accordion();
|
||||
accordion_state( element, 1, 0, 0 );
|
||||
element.accordion( "disable" );
|
||||
element.accordion( "option", "active", 1 );
|
||||
accordion_state( element, 1, 0, 0 );
|
||||
element.accordion( "enable" );
|
||||
element.accordion( "option", "active", 1 );
|
||||
accordion_state( element, 0, 1, 0 );
|
||||
});
|
||||
|
||||
test( "refresh", function() {
|
||||
var expected = $( "#navigation" )
|
||||
var element = $( "#navigation" )
|
||||
.parent()
|
||||
.height( 300 )
|
||||
.end()
|
||||
.accordion({
|
||||
heightStyle: "fill"
|
||||
});
|
||||
equalHeights( expected, 246, 258 );
|
||||
equalHeights( element, 246, 258 );
|
||||
|
||||
expected.parent().height( 500 );
|
||||
expected.accordion( "refresh" );
|
||||
equalHeights( expected, 446, 458 );
|
||||
element.parent().height( 500 );
|
||||
element.accordion( "refresh" );
|
||||
equalHeights( element, 446, 458 );
|
||||
});
|
||||
|
||||
}( jQuery ) );
|
||||
|
||||
@ -3,184 +3,184 @@
|
||||
module( "accordion: options", accordionSetupTeardown() );
|
||||
|
||||
test( "{ active: default }", function() {
|
||||
var ac = $( "#list1" ).accordion();
|
||||
equals( ac.accordion( "option", "active" ), 0 );
|
||||
state( ac, 1, 0, 0 );
|
||||
var element = $( "#list1" ).accordion();
|
||||
equals( element.accordion( "option", "active" ), 0 );
|
||||
accordion_state( element, 1, 0, 0 );
|
||||
});
|
||||
|
||||
test( "{ active: false }", function() {
|
||||
var ac = $( "#list1" ).accordion({
|
||||
var element = $( "#list1" ).accordion({
|
||||
active: false,
|
||||
collapsible: true
|
||||
});
|
||||
state( ac, 0, 0, 0 );
|
||||
equals( ac.find( ".ui-accordion-header.ui-state-active" ).size(), 0, "no headers selected" );
|
||||
equals( ac.accordion( "option", "active" ), false );
|
||||
accordion_state( element, 0, 0, 0 );
|
||||
equals( element.find( ".ui-accordion-header.ui-state-active" ).size(), 0, "no headers selected" );
|
||||
equals( element.accordion( "option", "active" ), false );
|
||||
|
||||
ac.accordion( "option", "collapsible", false );
|
||||
state( ac, 1, 0, 0 );
|
||||
equals( ac.accordion( "option", "active" ), 0 );
|
||||
element.accordion( "option", "collapsible", false );
|
||||
accordion_state( element, 1, 0, 0 );
|
||||
equals( element.accordion( "option", "active" ), 0 );
|
||||
|
||||
ac.accordion( "destroy" );
|
||||
ac.accordion({
|
||||
element.accordion( "destroy" );
|
||||
element.accordion({
|
||||
active: false
|
||||
});
|
||||
state( ac, 1, 0, 0 );
|
||||
strictEqual( ac.accordion( "option", "active" ), 0 );
|
||||
accordion_state( element, 1, 0, 0 );
|
||||
strictEqual( element.accordion( "option", "active" ), 0 );
|
||||
});
|
||||
|
||||
test( "{ active: Number }", function() {
|
||||
var ac = $( "#list1" ).accordion({
|
||||
var element = $( "#list1" ).accordion({
|
||||
active: 2
|
||||
});
|
||||
equals( ac.accordion( "option", "active" ), 2 );
|
||||
state( ac, 0, 0, 1 );
|
||||
equals( element.accordion( "option", "active" ), 2 );
|
||||
accordion_state( element, 0, 0, 1 );
|
||||
|
||||
ac.accordion( "option", "active", 0 );
|
||||
equals( ac.accordion( "option", "active" ), 0 );
|
||||
state( ac, 1, 0, 0 );
|
||||
element.accordion( "option", "active", 0 );
|
||||
equals( element.accordion( "option", "active" ), 0 );
|
||||
accordion_state( element, 1, 0, 0 );
|
||||
|
||||
ac.find( ".ui-accordion-header" ).eq( 1 ).click();
|
||||
equals( ac.accordion( "option", "active" ), 1 );
|
||||
state( ac, 0, 1, 0 );
|
||||
element.find( ".ui-accordion-header" ).eq( 1 ).click();
|
||||
equals( element.accordion( "option", "active" ), 1 );
|
||||
accordion_state( element, 0, 1, 0 );
|
||||
|
||||
ac.accordion( "option", "active", 10 );
|
||||
equals( ac.accordion( "option", "active" ), 1 );
|
||||
state( ac, 0, 1, 0 );
|
||||
element.accordion( "option", "active", 10 );
|
||||
equals( element.accordion( "option", "active" ), 1 );
|
||||
accordion_state( element, 0, 1, 0 );
|
||||
});
|
||||
|
||||
if ( $.uiBackCompat === false ) {
|
||||
test( "{ active: -Number }", function() {
|
||||
var ac = $( "#list1" ).accordion({
|
||||
var element = $( "#list1" ).accordion({
|
||||
active: -1
|
||||
});
|
||||
equals( ac.accordion( "option", "active" ), 2 );
|
||||
state( ac, 0, 0, 1 );
|
||||
equals( element.accordion( "option", "active" ), 2 );
|
||||
accordion_state( element, 0, 0, 1 );
|
||||
|
||||
ac.accordion( "option", "active", -2 );
|
||||
equals( ac.accordion( "option", "active" ), 1 );
|
||||
state( ac, 0, 1, 0 );
|
||||
element.accordion( "option", "active", -2 );
|
||||
equals( element.accordion( "option", "active" ), 1 );
|
||||
accordion_state( element, 0, 1, 0 );
|
||||
|
||||
ac.accordion( "option", "active", -10 );
|
||||
equals( ac.accordion( "option", "active" ), 1 );
|
||||
state( ac, 0, 1, 0 );
|
||||
element.accordion( "option", "active", -10 );
|
||||
equals( element.accordion( "option", "active" ), 1 );
|
||||
accordion_state( element, 0, 1, 0 );
|
||||
|
||||
ac.accordion( "option", "active", -3 );
|
||||
equals( ac.accordion( "option", "active" ), 0 );
|
||||
state( ac, 1, 0, 0 );
|
||||
element.accordion( "option", "active", -3 );
|
||||
equals( element.accordion( "option", "active" ), 0 );
|
||||
accordion_state( element, 1, 0, 0 );
|
||||
});
|
||||
}
|
||||
|
||||
// TODO: add animation tests
|
||||
|
||||
test( "{ collapsible: false }", function() {
|
||||
var ac = $( "#list1" ).accordion({
|
||||
var element = $( "#list1" ).accordion({
|
||||
active: 1
|
||||
});
|
||||
ac.accordion( "option", "active", false );
|
||||
equal( ac.accordion( "option", "active" ), 1 );
|
||||
state( ac, 0, 1, 0 );
|
||||
element.accordion( "option", "active", false );
|
||||
equal( element.accordion( "option", "active" ), 1 );
|
||||
accordion_state( element, 0, 1, 0 );
|
||||
|
||||
ac.find( ".ui-accordion-header" ).eq( 1 ).click();
|
||||
equal( ac.accordion( "option", "active" ), 1 );
|
||||
state( ac, 0, 1, 0 );
|
||||
element.find( ".ui-accordion-header" ).eq( 1 ).click();
|
||||
equal( element.accordion( "option", "active" ), 1 );
|
||||
accordion_state( element, 0, 1, 0 );
|
||||
});
|
||||
|
||||
test( "{ collapsible: true }", function() {
|
||||
var ac = $( "#list1" ).accordion({
|
||||
var element = $( "#list1" ).accordion({
|
||||
active: 1,
|
||||
collapsible: true
|
||||
});
|
||||
|
||||
ac.accordion( "option", "active", false );
|
||||
equal( ac.accordion( "option", "active" ), false );
|
||||
state( ac, 0, 0, 0 );
|
||||
element.accordion( "option", "active", false );
|
||||
equal( element.accordion( "option", "active" ), false );
|
||||
accordion_state( element, 0, 0, 0 );
|
||||
|
||||
ac.accordion( "option", "active", 1 );
|
||||
equal( ac.accordion( "option", "active" ), 1 );
|
||||
state( ac, 0, 1, 0 );
|
||||
element.accordion( "option", "active", 1 );
|
||||
equal( element.accordion( "option", "active" ), 1 );
|
||||
accordion_state( element, 0, 1, 0 );
|
||||
|
||||
ac.find( ".ui-accordion-header" ).eq( 1 ).click();
|
||||
equals( ac.accordion( "option", "active" ), false );
|
||||
state( ac, 0, 0, 0 );
|
||||
element.find( ".ui-accordion-header" ).eq( 1 ).click();
|
||||
equals( element.accordion( "option", "active" ), false );
|
||||
accordion_state( element, 0, 0, 0 );
|
||||
});
|
||||
|
||||
test( "{ event: null }", function() {
|
||||
var ac = $( "#list1" ).accordion({
|
||||
var element = $( "#list1" ).accordion({
|
||||
event: null
|
||||
});
|
||||
state( ac, 1, 0, 0 );
|
||||
accordion_state( element, 1, 0, 0 );
|
||||
|
||||
ac.accordion( "option", "active", 1 );
|
||||
equal( ac.accordion( "option", "active" ), 1 );
|
||||
state( ac, 0, 1, 0 );
|
||||
element.accordion( "option", "active", 1 );
|
||||
equal( element.accordion( "option", "active" ), 1 );
|
||||
accordion_state( element, 0, 1, 0 );
|
||||
|
||||
// ensure default click handler isn't bound
|
||||
ac.find( ".ui-accordion-header" ).eq( 2 ).click();
|
||||
equal( ac.accordion( "option", "active" ), 1 );
|
||||
state( ac, 0, 1, 0 );
|
||||
element.find( ".ui-accordion-header" ).eq( 2 ).click();
|
||||
equal( element.accordion( "option", "active" ), 1 );
|
||||
accordion_state( element, 0, 1, 0 );
|
||||
});
|
||||
|
||||
test( "{ event: custom }", function() {
|
||||
var ac = $( "#list1" ).accordion({
|
||||
var element = $( "#list1" ).accordion({
|
||||
event: "custom1 custom2"
|
||||
});
|
||||
state( ac, 1, 0, 0 );
|
||||
accordion_state( element, 1, 0, 0 );
|
||||
|
||||
ac.find( ".ui-accordion-header" ).eq( 1 ).trigger( "custom1" );
|
||||
equal( ac.accordion( "option", "active" ), 1 );
|
||||
state( ac, 0, 1, 0 );
|
||||
element.find( ".ui-accordion-header" ).eq( 1 ).trigger( "custom1" );
|
||||
equal( element.accordion( "option", "active" ), 1 );
|
||||
accordion_state( element, 0, 1, 0 );
|
||||
|
||||
// ensure default click handler isn't bound
|
||||
ac.find( ".ui-accordion-header" ).eq( 2 ).trigger( "click" );
|
||||
equal( ac.accordion( "option", "active" ), 1 );
|
||||
state( ac, 0, 1, 0 );
|
||||
element.find( ".ui-accordion-header" ).eq( 2 ).trigger( "click" );
|
||||
equal( element.accordion( "option", "active" ), 1 );
|
||||
accordion_state( element, 0, 1, 0 );
|
||||
|
||||
ac.find( ".ui-accordion-header" ).eq( 2 ).trigger( "custom2" );
|
||||
equal( ac.accordion( "option", "active" ), 2 );
|
||||
state( ac, 0, 0, 1 );
|
||||
element.find( ".ui-accordion-header" ).eq( 2 ).trigger( "custom2" );
|
||||
equal( element.accordion( "option", "active" ), 2 );
|
||||
accordion_state( element, 0, 0, 1 );
|
||||
|
||||
ac.accordion( "option", "event", "custom3" );
|
||||
element.accordion( "option", "event", "custom3" );
|
||||
|
||||
// ensure old event handlers are unbound
|
||||
ac.find( ".ui-accordion-header" ).eq( 1 ).trigger( "custom1" );
|
||||
equal( ac.accordion( "option", "active" ), 2 );
|
||||
state( ac, 0, 0, 1 );
|
||||
element.find( ".ui-accordion-header" ).eq( 1 ).trigger( "custom1" );
|
||||
equal( element.accordion( "option", "active" ), 2 );
|
||||
accordion_state( element, 0, 0, 1 );
|
||||
|
||||
ac.find( ".ui-accordion-header" ).eq( 1 ).trigger( "custom3" );
|
||||
equal( ac.accordion( "option", "active" ), 1 );
|
||||
state( ac, 0, 1, 0 );
|
||||
element.find( ".ui-accordion-header" ).eq( 1 ).trigger( "custom3" );
|
||||
equal( element.accordion( "option", "active" ), 1 );
|
||||
accordion_state( element, 0, 1, 0 );
|
||||
});
|
||||
|
||||
test( "{ header: default }", function() {
|
||||
// default: > li > :first-child,> :not(li):even
|
||||
// > :not(li):even
|
||||
state( $( "#list1" ).accordion(), 1, 0, 0);
|
||||
accordion_state( $( "#list1" ).accordion(), 1, 0, 0);
|
||||
// > li > :first-child
|
||||
state( $( "#navigation" ).accordion(), 1, 0, 0);
|
||||
accordion_state( $( "#navigation" ).accordion(), 1, 0, 0);
|
||||
});
|
||||
|
||||
test( "{ header: custom }", function() {
|
||||
var ac = $( "#navigationWrapper" ).accordion({
|
||||
var element = $( "#navigationWrapper" ).accordion({
|
||||
header: "h2"
|
||||
});
|
||||
ac.find( "h2" ).each(function() {
|
||||
element.find( "h2" ).each(function() {
|
||||
ok( $( this ).hasClass( "ui-accordion-header" ) );
|
||||
});
|
||||
equal( ac.find( ".ui-accordion-header" ).length, 3 );
|
||||
state( ac, 1, 0, 0 );
|
||||
ac.accordion( "option", "active", 2 );
|
||||
state( ac, 0, 0, 1 );
|
||||
equal( element.find( ".ui-accordion-header" ).length, 3 );
|
||||
accordion_state( element, 1, 0, 0 );
|
||||
element.accordion( "option", "active", 2 );
|
||||
accordion_state( element, 0, 0, 1 );
|
||||
});
|
||||
|
||||
test( "{ heightStyle: 'auto' }", function() {
|
||||
var ac = $( "#navigation" ).accordion({ heightStyle: "auto" });
|
||||
equalHeights( ac, 95, 130 );
|
||||
var element = $( "#navigation" ).accordion({ heightStyle: "auto" });
|
||||
equalHeights( element, 95, 130 );
|
||||
});
|
||||
|
||||
test( "{ heightStyle: 'content' }", function() {
|
||||
var ac = $( "#navigation" ).accordion({ heightStyle: "content" });
|
||||
var sizes = ac.find( ".ui-accordion-content" ).map(function() {
|
||||
var element = $( "#navigation" ).accordion({ heightStyle: "content" });
|
||||
var sizes = element.find( ".ui-accordion-content" ).map(function() {
|
||||
return $( this ).height();
|
||||
}).get();
|
||||
ok( sizes[ 0 ] >= 70 && sizes[ 0 ] <= 105, "was " + sizes[ 0 ] );
|
||||
@ -190,8 +190,8 @@ test( "{ heightStyle: 'content' }", function() {
|
||||
|
||||
test( "{ heightStyle: 'fill' }", function() {
|
||||
$( "#navigationWrapper" ).height( 500 );
|
||||
var ac = $( "#navigation" ).accordion({ heightStyle: "fill" });
|
||||
equalHeights( ac, 446, 458 );
|
||||
var element = $( "#navigation" ).accordion({ heightStyle: "fill" });
|
||||
equalHeights( element, 446, 458 );
|
||||
});
|
||||
|
||||
test( "{ heightStyle: 'fill' } with sibling", function() {
|
||||
@ -203,8 +203,8 @@ test( "{ heightStyle: 'fill' } with sibling", function() {
|
||||
marginBottom: 30
|
||||
})
|
||||
.prependTo( "#navigationWrapper" );
|
||||
var ac = $( "#navigation" ).accordion({ heightStyle: "fill" });
|
||||
equalHeights( ac , 346, 358);
|
||||
var element = $( "#navigation" ).accordion({ heightStyle: "fill" });
|
||||
equalHeights( element , 346, 358);
|
||||
});
|
||||
|
||||
test( "{ heightStyle: 'fill' } with multiple siblings", function() {
|
||||
@ -231,36 +231,36 @@ test( "{ heightStyle: 'fill' } with multiple siblings", function() {
|
||||
marginBottom: 15
|
||||
})
|
||||
.prependTo( "#navigationWrapper" );
|
||||
var ac = $( "#navigation" ).accordion({ heightStyle: "fill" });
|
||||
equalHeights( ac, 296, 308 );
|
||||
var element = $( "#navigation" ).accordion({ heightStyle: "fill" });
|
||||
equalHeights( element, 296, 308 );
|
||||
});
|
||||
|
||||
test( "{ icons: false }", function() {
|
||||
var list = $( "#list1" );
|
||||
var element = $( "#list1" );
|
||||
function icons( on ) {
|
||||
same( list.find( "span.ui-icon").length, on ? 3 : 0 );
|
||||
same( list.hasClass( "ui-accordion-icons" ), on );
|
||||
same( element.find( "span.ui-icon").length, on ? 3 : 0 );
|
||||
same( element.hasClass( "ui-accordion-icons" ), on );
|
||||
}
|
||||
list.accordion();
|
||||
element.accordion();
|
||||
icons( true );
|
||||
list.accordion( "destroy" ).accordion({
|
||||
element.accordion( "destroy" ).accordion({
|
||||
icons: false
|
||||
});
|
||||
icons( false );
|
||||
list.accordion( "option", "icons", { header: "foo", activeHeader: "bar" } );
|
||||
element.accordion( "option", "icons", { header: "foo", activeHeader: "bar" } );
|
||||
icons( true );
|
||||
list.accordion( "option", "icons", false );
|
||||
element.accordion( "option", "icons", false );
|
||||
icons( false );
|
||||
});
|
||||
|
||||
test( "{ icons: hash }", function() {
|
||||
var list = $( "#list1" ).accordion({
|
||||
var element = $( "#list1" ).accordion({
|
||||
icons: { activeHeader: "a1", header: "h1" }
|
||||
});
|
||||
ok( list.find( ".ui-accordion-header.ui-state-active span.ui-icon" ).hasClass( "a1" ) );
|
||||
list.accordion( "option", "icons", { activeHeader: "a2", header: "h2" } );
|
||||
ok( !list.find( ".ui-accordion-header.ui-state-active span.ui-icon" ).hasClass( "a1" ) );
|
||||
ok( list.find( ".ui-accordion-header.ui-state-active span.ui-icon" ).hasClass( "a2" ) );
|
||||
ok( element.find( ".ui-accordion-header.ui-state-active span.ui-icon" ).hasClass( "a1" ) );
|
||||
element.accordion( "option", "icons", { activeHeader: "a2", header: "h2" } );
|
||||
ok( !element.find( ".ui-accordion-header.ui-state-active span.ui-icon" ).hasClass( "a1" ) );
|
||||
ok( element.find( ".ui-accordion-header.ui-state-active span.ui-icon" ).hasClass( "a2" ) );
|
||||
});
|
||||
|
||||
}( jQuery ) );
|
||||
|
||||
@ -1,5 +0,0 @@
|
||||
(function( $ ) {
|
||||
|
||||
module( "accordion: tickets", accordionSetupTeardown() );
|
||||
|
||||
}( jQuery ) );
|
||||
@ -23,7 +23,6 @@
|
||||
<script type="text/javascript" src="autocomplete_events.js"></script>
|
||||
<script type="text/javascript" src="autocomplete_methods.js"></script>
|
||||
<script type="text/javascript" src="autocomplete_options.js"></script>
|
||||
<script type="text/javascript" src="autocomplete_tickets.js"></script>
|
||||
|
||||
<script type="text/javascript" src="../swarminject.js"></script>
|
||||
</head>
|
||||
|
||||
@ -1,19 +1,25 @@
|
||||
/*
|
||||
* autocomplete_defaults.js
|
||||
*/
|
||||
commonWidgetTests( "autocomplete", {
|
||||
defaults: {
|
||||
appendTo: "body",
|
||||
autoFocus: false,
|
||||
delay: 300,
|
||||
disabled: false,
|
||||
minLength: 1,
|
||||
position: {
|
||||
my: "left top",
|
||||
at: "left bottom",
|
||||
collision: "none"
|
||||
},
|
||||
source: null,
|
||||
|
||||
var autocomplete_defaults = {
|
||||
appendTo: "body",
|
||||
autoFocus: true,
|
||||
delay: 300,
|
||||
disabled: false,
|
||||
minLength: 1,
|
||||
position: {
|
||||
my: "left top",
|
||||
at: "left bottom",
|
||||
collision: "none"
|
||||
},
|
||||
source: null
|
||||
};
|
||||
|
||||
commonWidgetTests('autocomplete', { defaults: autocomplete_defaults });
|
||||
// callbacks
|
||||
change: null,
|
||||
close: null,
|
||||
create: null,
|
||||
focus: null,
|
||||
open: null,
|
||||
response: null,
|
||||
search: null,
|
||||
select: null
|
||||
}
|
||||
});
|
||||
|
||||
@ -1,14 +0,0 @@
|
||||
/*
|
||||
* autocomplete_tickets.js
|
||||
*/
|
||||
(function($) {
|
||||
|
||||
module("autocomplete: tickets", {
|
||||
teardown: function() {
|
||||
$( ":ui-autocomplete" ).autocomplete( "destroy" );
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
|
||||
})(jQuery);
|
||||
@ -1,15 +1,14 @@
|
||||
/*
|
||||
* button_defaults.js
|
||||
*/
|
||||
commonWidgetTests( "button", {
|
||||
defaults: {
|
||||
disabled: null,
|
||||
icons: {
|
||||
primary: null,
|
||||
secondary: null
|
||||
},
|
||||
label: null,
|
||||
text: true,
|
||||
|
||||
var button_defaults = {
|
||||
disabled: null,
|
||||
text: true,
|
||||
label: null,
|
||||
icons: {
|
||||
primary: null,
|
||||
secondary: null
|
||||
// callbacks
|
||||
create: null
|
||||
}
|
||||
};
|
||||
|
||||
commonWidgetTests('button', { defaults: button_defaults });
|
||||
});
|
||||
|
||||
@ -1,35 +1,34 @@
|
||||
/*
|
||||
* dialog_defaults.js
|
||||
*/
|
||||
commonWidgetTests( "dialog", {
|
||||
defaults: {
|
||||
autoOpen: true,
|
||||
buttons: {},
|
||||
closeOnEscape: true,
|
||||
closeText: 'close',
|
||||
disabled: false,
|
||||
dialogClass: '',
|
||||
draggable: true,
|
||||
height: 'auto',
|
||||
hide: null,
|
||||
maxHeight: false,
|
||||
maxWidth: false,
|
||||
minHeight: 150,
|
||||
minWidth: 150,
|
||||
modal: false,
|
||||
position: {
|
||||
my: 'center',
|
||||
at: 'center',
|
||||
of: window,
|
||||
collision: 'fit',
|
||||
using: $.ui.dialog.prototype.options.position.using
|
||||
},
|
||||
resizable: true,
|
||||
show: null,
|
||||
stack: true,
|
||||
title: '',
|
||||
width: 300,
|
||||
zIndex: 1000,
|
||||
|
||||
var dialog_defaults = {
|
||||
autoOpen: true,
|
||||
buttons: {},
|
||||
closeOnEscape: true,
|
||||
closeText: 'close',
|
||||
disabled: false,
|
||||
dialogClass: '',
|
||||
draggable: true,
|
||||
height: 'auto',
|
||||
hide: null,
|
||||
maxHeight: false,
|
||||
maxWidth: false,
|
||||
minHeight: 150,
|
||||
minWidth: 150,
|
||||
modal: false,
|
||||
position: {
|
||||
my: 'center',
|
||||
at: 'center',
|
||||
of: window,
|
||||
collision: 'fit',
|
||||
using: $.ui.dialog.prototype.options.position.using
|
||||
},
|
||||
resizable: true,
|
||||
show: null,
|
||||
stack: true,
|
||||
title: '',
|
||||
width: 300,
|
||||
zIndex: 1000
|
||||
};
|
||||
|
||||
commonWidgetTests('dialog', { defaults: dialog_defaults });
|
||||
// callbacks
|
||||
create: null
|
||||
}
|
||||
});
|
||||
|
||||
@ -180,7 +180,7 @@ test("height", function() {
|
||||
expect(3);
|
||||
|
||||
el = $('<div></div>').dialog();
|
||||
equals(dlg().height(), dialog_defaults.minHeight, "default height");
|
||||
equals(dlg().height(), 150, "default height");
|
||||
el.remove();
|
||||
|
||||
el = $('<div></div>').dialog({ height: 237 });
|
||||
@ -431,7 +431,7 @@ test("width", function() {
|
||||
expect(3);
|
||||
|
||||
el = $('<div></div>').dialog();
|
||||
equals(dlg().width(), dialog_defaults.width, "default width");
|
||||
equals(dlg().width(), 300, "default width");
|
||||
el.remove();
|
||||
|
||||
el = $('<div></div>').dialog({width: 437 });
|
||||
|
||||
@ -20,7 +20,6 @@
|
||||
<script type="text/javascript" src="draggable_events.js"></script>
|
||||
<script type="text/javascript" src="draggable_methods.js"></script>
|
||||
<script type="text/javascript" src="draggable_options.js"></script>
|
||||
<script type="text/javascript" src="draggable_tickets.js"></script>
|
||||
|
||||
<script type="text/javascript">
|
||||
// disable this stale testsuite for testswarm only
|
||||
|
||||
@ -1,8 +0,0 @@
|
||||
/*
|
||||
* draggable_tickets.js
|
||||
*/
|
||||
(function($) {
|
||||
|
||||
module("draggable: tickets");
|
||||
|
||||
})(jQuery);
|
||||
@ -21,7 +21,6 @@
|
||||
<script type="text/javascript" src="droppable_events.js"></script>
|
||||
<script type="text/javascript" src="droppable_methods.js"></script>
|
||||
<script type="text/javascript" src="droppable_options.js"></script>
|
||||
<script type="text/javascript" src="droppable_tickets.js"></script>
|
||||
|
||||
<script type="text/javascript">
|
||||
// disable this stale testsuite for testswarm only
|
||||
|
||||
@ -1,8 +0,0 @@
|
||||
/*
|
||||
* droppable_tickets.js
|
||||
*/
|
||||
(function($) {
|
||||
|
||||
module("droppable: tickets");
|
||||
|
||||
})(jQuery);
|
||||
@ -1,13 +1,12 @@
|
||||
/*
|
||||
* menu_defaults.js
|
||||
*/
|
||||
commonWidgetTests( "menu", {
|
||||
defaults: {
|
||||
disabled: false,
|
||||
position: {
|
||||
my: "left top",
|
||||
at: "right top"
|
||||
},
|
||||
|
||||
var menu_defaults = {
|
||||
disabled: false,
|
||||
position: {
|
||||
my: "left top",
|
||||
at: "right top"
|
||||
// callbacks
|
||||
create: null
|
||||
}
|
||||
};
|
||||
|
||||
commonWidgetTests('menu', { defaults: menu_defaults });
|
||||
});
|
||||
|
||||
@ -21,7 +21,6 @@
|
||||
<script type="text/javascript" src="progressbar_events.js"></script>
|
||||
<script type="text/javascript" src="progressbar_methods.js"></script>
|
||||
<script type="text/javascript" src="progressbar_options.js"></script>
|
||||
<script type="text/javascript" src="progressbar_tickets.js"></script>
|
||||
|
||||
<script type="text/javascript" src="../swarminject.js"></script>
|
||||
</head>
|
||||
|
||||
@ -1,11 +1,10 @@
|
||||
/*
|
||||
* progressbar_defaults.js
|
||||
*/
|
||||
commonWidgetTests( "progressbar", {
|
||||
defaults: {
|
||||
disabled: false,
|
||||
value: 0,
|
||||
max: 100,
|
||||
|
||||
var progressbar_defaults = {
|
||||
disabled: false,
|
||||
value: 0,
|
||||
max: 100
|
||||
};
|
||||
|
||||
commonWidgetTests('progressbar', { defaults: progressbar_defaults });
|
||||
//callbacks
|
||||
create: null
|
||||
}
|
||||
});
|
||||
|
||||
@ -10,6 +10,23 @@ test("{ value : 0 }, default", function() {
|
||||
same( 0, $("#progressbar").progressbar("value") );
|
||||
});
|
||||
|
||||
// Ticket #7231 - valueDiv should be hidden when value is at 0%
|
||||
test( "value: visibility of valueDiv", function() {
|
||||
expect( 5 );
|
||||
var element = $( "#progressbar" ).progressbar({
|
||||
value: 0
|
||||
});
|
||||
ok( element.children( ".ui-progressbar-value" ).is( ":hidden" ), "valueDiv hidden when value is initialized at 0" );
|
||||
element.progressbar( "value", 1 );
|
||||
ok( element.children( ".ui-progressbar-value" ).is( ":visible" ), "valueDiv visible when value is set to 1" );
|
||||
element.progressbar( "value", 100 );
|
||||
ok( element.children( ".ui-progressbar-value" ).is( ":visible" ), "valueDiv visible when value is set to 100" );
|
||||
element.progressbar( "value", 0 );
|
||||
ok( element.children( ".ui-progressbar-value" ).is( ":hidden" ), "valueDiv hidden when value is set to 0" );
|
||||
element.progressbar( "value", -1 );
|
||||
ok( element.children( ".ui-progressbar-value" ).is( ":hidden" ), "valueDiv hidden when value set to -1 (normalizes to 0)" );
|
||||
});
|
||||
|
||||
test("{ value : 5 }", function() {
|
||||
$("#progressbar").progressbar({
|
||||
value: 5
|
||||
|
||||
@ -1,8 +0,0 @@
|
||||
/*
|
||||
* progressbar_tickets.js
|
||||
*/
|
||||
(function($) {
|
||||
|
||||
module("progressbar: tickets");
|
||||
|
||||
})(jQuery);
|
||||
@ -22,7 +22,6 @@
|
||||
<script type="text/javascript" src="resizable_events.js"></script>
|
||||
<script type="text/javascript" src="resizable_methods.js"></script>
|
||||
<script type="text/javascript" src="resizable_options.js"></script>
|
||||
<script type="text/javascript" src="resizable_tickets.js"></script>
|
||||
|
||||
<script type="text/javascript">
|
||||
// disable this stale testsuite for testswarm only
|
||||
|
||||
@ -1,8 +0,0 @@
|
||||
/*
|
||||
* resizable_tickets.js
|
||||
*/
|
||||
(function($) {
|
||||
|
||||
module("resizable: tickets");
|
||||
|
||||
})(jQuery);
|
||||
@ -20,7 +20,6 @@
|
||||
<script type="text/javascript" src="selectable_events.js"></script>
|
||||
<script type="text/javascript" src="selectable_methods.js"></script>
|
||||
<script type="text/javascript" src="selectable_options.js"></script>
|
||||
<script type="text/javascript" src="selectable_tickets.js"></script>
|
||||
|
||||
<script type="text/javascript">
|
||||
// disable this stale testsuite for testswarm only
|
||||
|
||||
@ -1,8 +0,0 @@
|
||||
/*
|
||||
* selectable_tickets.js
|
||||
*/
|
||||
(function($) {
|
||||
|
||||
module("selectable: tickets");
|
||||
|
||||
})(jQuery);
|
||||
@ -22,7 +22,6 @@
|
||||
<script type="text/javascript" src="slider_events.js"></script>
|
||||
<script type="text/javascript" src="slider_methods.js"></script>
|
||||
<script type="text/javascript" src="slider_options.js"></script>
|
||||
<script type="text/javascript" src="slider_tickets.js"></script>
|
||||
|
||||
<script type="text/javascript">
|
||||
// disable this stale testsuite for testswarm only
|
||||
|
||||
@ -1,20 +1,19 @@
|
||||
/*
|
||||
* slider_defaults.js
|
||||
*/
|
||||
commonWidgetTests( "slider", {
|
||||
defaults: {
|
||||
animate: false,
|
||||
cancel: function() {},
|
||||
delay: 0,
|
||||
disabled: false,
|
||||
distance: 0,
|
||||
max: 100,
|
||||
min: 0,
|
||||
orientation: 'horizontal',
|
||||
range: false,
|
||||
step: 1,
|
||||
value: 0,
|
||||
values: null,
|
||||
|
||||
var slider_defaults = {
|
||||
animate: false,
|
||||
cancel: function() {},
|
||||
delay: 0,
|
||||
disabled: false,
|
||||
distance: 0,
|
||||
max: 100,
|
||||
min: 0,
|
||||
orientation: 'horizontal',
|
||||
range: false,
|
||||
step: 1,
|
||||
value: 0,
|
||||
values: null
|
||||
};
|
||||
|
||||
commonWidgetTests('slider', { defaults: slider_defaults });
|
||||
// callbacks
|
||||
create: null
|
||||
}
|
||||
});
|
||||
|
||||
@ -74,7 +74,7 @@ test("value", function() {
|
||||
value: 5
|
||||
});
|
||||
equals(el.slider('value'), 5, 'range: ' + this + ' slider method get');
|
||||
el.slider('value', 10);
|
||||
equals(el.slider('value', 10), el, 'value method is chainable');
|
||||
equals(el.slider('value'), 10, 'range: ' + this + ' slider method set');
|
||||
el.remove();
|
||||
});
|
||||
@ -85,13 +85,13 @@ test("value", function() {
|
||||
el.slider('option', 'value', -2);
|
||||
equals(el.slider('option', 'value'), -2, 'value option does not respect min');
|
||||
equals(el.slider('value'), -1, 'value method get respects min');
|
||||
el.slider('value', -2);
|
||||
equals(el.slider('value', -2), el, 'value method is chainable');
|
||||
equals(el.slider('option', 'value'), -1, 'value method set respects min');
|
||||
// max with value option vs value method
|
||||
el.slider('option', 'value', 2);
|
||||
equals(el.slider('option', 'value'), 2, 'value option does not respect max');
|
||||
equals(el.slider('value'), 1, 'value method get respects max');
|
||||
el.slider('value', 2);
|
||||
equals(el.slider('value', 2), el, 'value method is chainable');
|
||||
equals(el.slider('option', 'value'), 1, 'value method set respects max');
|
||||
});
|
||||
|
||||
|
||||
@ -1,8 +0,0 @@
|
||||
/*
|
||||
* slider_tickets.js
|
||||
*/
|
||||
(function($) {
|
||||
|
||||
module("slider: tickets");
|
||||
|
||||
})(jQuery);
|
||||
@ -1,16 +1,15 @@
|
||||
/*
|
||||
* spinner_defaults.js
|
||||
*/
|
||||
commonWidgetTests( "spinner", {
|
||||
defaults: {
|
||||
disabled: false,
|
||||
incremental: true,
|
||||
max: null,
|
||||
min: null,
|
||||
numberformat: null,
|
||||
page: 10,
|
||||
step: null,
|
||||
value: null,
|
||||
|
||||
var spinner_defaults = {
|
||||
disabled: false,
|
||||
incremental: true,
|
||||
max: null,
|
||||
min: null,
|
||||
numberformat: null,
|
||||
page: 10,
|
||||
step: null,
|
||||
value: null
|
||||
};
|
||||
|
||||
commonWidgetTests('spinner', { defaults: spinner_defaults });
|
||||
// callbacks
|
||||
create: null
|
||||
}
|
||||
});
|
||||
|
||||
@ -1,30 +1,88 @@
|
||||
<!DOCTYPE html>
|
||||
<!doctype html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<meta charset="utf-8">
|
||||
<title>jQuery UI Tabs Test Suite</title>
|
||||
|
||||
<link type="text/css" href="../../../themes/base/jquery.ui.tabs.css" rel="stylesheet" />
|
||||
<link rel="stylesheet" href="../../../themes/base/jquery.ui.tabs.css">
|
||||
|
||||
<script type="text/javascript" src="../../../jquery-1.5.1.js"></script>
|
||||
<script type="text/javascript" src="../../../external/jquery.cookie.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.tabs.js"></script>
|
||||
<script src="../../../jquery-1.5.1.js"></script>
|
||||
<script>
|
||||
$.uiBackCompat = false;
|
||||
</script>
|
||||
<script src="../../../ui/jquery.ui.core.js"></script>
|
||||
<script src="../../../ui/jquery.ui.widget.js"></script>
|
||||
<script src="../../../ui/jquery.ui.tabs.js"></script>
|
||||
|
||||
<link rel="stylesheet" href="../../../external/qunit.css" type="text/css"/>
|
||||
<script type="text/javascript" src="../../../external/qunit.js"></script>
|
||||
<script type="text/javascript" src="../../jquery.simulate.js"></script>
|
||||
<script type="text/javascript" src="../testsuite.js"></script>
|
||||
|
||||
<script type="text/javascript" src="tabs_core.js"></script>
|
||||
<script type="text/javascript" src="tabs_defaults.js"></script>
|
||||
<script type="text/javascript" src="tabs_events.js"></script>
|
||||
<script type="text/javascript" src="tabs_methods.js"></script>
|
||||
<script type="text/javascript" src="tabs_options.js"></script>
|
||||
<script type="text/javascript" src="tabs_tickets.js"></script>
|
||||
|
||||
<script type="text/javascript">
|
||||
<link rel="stylesheet" href="../../../external/qunit.css">
|
||||
<script src="../../../external/qunit.js"></script>
|
||||
<script src="../../jquery.simulate.js"></script>
|
||||
<script src="../testsuite.js"></script>
|
||||
|
||||
<script src="tabs_defaults.js"></script>
|
||||
<script src="tabs_core.js"></script>
|
||||
<script src="tabs_events.js"></script>
|
||||
<script src="tabs_methods.js"></script>
|
||||
<script src="tabs_options.js"></script>
|
||||
<script src="tabs_tickets.js"></script>
|
||||
|
||||
<script>
|
||||
function tabs_state( tabs ) {
|
||||
var expected = $.makeArray( arguments ).slice( 1 );
|
||||
var actual = tabs.find( ".ui-tabs-nav li" ).map(function() {
|
||||
var tab = $( this ),
|
||||
panel = $( $.ui.tabs.prototype._sanitizeSelector(
|
||||
"#" + tab.find( "a" ).attr( "aria-controls" ) ) ),
|
||||
tabIsActive = tab.hasClass( "ui-state-active" ),
|
||||
panelIsActive = panel.css( "display" ) !== "none";
|
||||
|
||||
if ( tabIsActive && panelIsActive ) {
|
||||
return 1;
|
||||
}
|
||||
if ( !tabIsActive && !panelIsActive ) {
|
||||
return 0;
|
||||
}
|
||||
return -1; // mixed state - invalid
|
||||
}).get();
|
||||
same( actual, expected );
|
||||
}
|
||||
|
||||
function tabs_disabled( tabs, state ) {
|
||||
var expected = $.map( new Array( tabs.find ( ".ui-tabs-nav li" ).length ), function( _, index ) {
|
||||
if ( typeof state === "boolean" ) {
|
||||
return state ? 1 : 0;
|
||||
} else {
|
||||
return $.inArray( index, state ) !== -1 ? 1 : 0;
|
||||
}
|
||||
});
|
||||
|
||||
var internalState = tabs.tabs( "option", "disabled" );
|
||||
if ( internalState === false ) {
|
||||
internalState = [];
|
||||
}
|
||||
if ( internalState === true ) {
|
||||
internalState = $.map( new Array( tabs.find( ".ui-tabs-nav li" ).length ), function( _, index ) {
|
||||
return index;
|
||||
});
|
||||
}
|
||||
|
||||
var actual = tabs.find( ".ui-tabs-nav li" ).map(function( index ) {
|
||||
var tab = $( this ),
|
||||
tabIsDisabled = tab.hasClass( "ui-state-disabled" );
|
||||
|
||||
if ( tabIsDisabled && $.inArray( index, internalState ) !== -1 ) {
|
||||
return 1;
|
||||
}
|
||||
if ( !tabIsDisabled && $.inArray( index, internalState ) === -1 ) {
|
||||
return 0;
|
||||
}
|
||||
return -1; // mixed state - invalid
|
||||
}).get();
|
||||
same( tabs.tabs( "option", "disabled" ), state );
|
||||
same( actual, expected );
|
||||
}
|
||||
</script>
|
||||
<script>
|
||||
// disable this stale testsuite for testswarm only
|
||||
var url = window.location.search;
|
||||
url = decodeURIComponent( url.slice( url.indexOf("swarmURL=") + 9 ) );
|
||||
@ -34,7 +92,7 @@
|
||||
test("tabs", function() { ok(true, "disabled tabs testsuite"); });
|
||||
}
|
||||
</script>
|
||||
<script type="text/javascript" src="../swarminject.js"></script>
|
||||
<script src="../swarminject.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
@ -42,80 +100,87 @@
|
||||
<h2 id="qunit-banner"></h2>
|
||||
<div id="qunit-testrunner-toolbar"></div>
|
||||
<h2 id="qunit-userAgent"></h2>
|
||||
<ol id="qunit-tests">
|
||||
</ol>
|
||||
|
||||
<ol id="qunit-tests"></ol>
|
||||
<div id="qunit-fixture">
|
||||
|
||||
<div id="tabs1">
|
||||
<ul>
|
||||
<li><a href="#fragment-1"><span>1</span></a></li>
|
||||
<li><a href="#fragment-2"><span>2</span></a></li>
|
||||
<li><a href="#fragment-3"><span>3</span></a></li>
|
||||
</ul>
|
||||
<div id="fragment-1"></div>
|
||||
<div id="fragment-2"></div>
|
||||
<div id="fragment-3"></div>
|
||||
</div>
|
||||
<div id="tabs2">
|
||||
<ul>
|
||||
<li><a href="#colon:test"><span>1</span></a></li>
|
||||
<li><a href="#inline-style"><span>2</span></a></li>
|
||||
<li><a href="data/test.html#test"><span>3</span></a></li>
|
||||
<li><a href="data/test.html" title="∫ßáö Սե"><span>4</span></a></li>
|
||||
</ul>
|
||||
<div id="colon:test"></div>
|
||||
<div style="height: 300px;" id="inline-style"></div>
|
||||
</div>
|
||||
<div id="tabs3">
|
||||
<div>
|
||||
<ul id="tabs3-list">
|
||||
<li><a href="#tabs3-1">1</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<div id="tabs4">
|
||||
<ul id="tabs4-list">
|
||||
<li><a href="#tabs4-1">1</a></li>
|
||||
</ul>
|
||||
<ol>
|
||||
<li><a href="#tabs4-1">1</a></li>
|
||||
</ol>
|
||||
</div>
|
||||
<div id="tabs4a">
|
||||
<ol id="tabs4a-list">
|
||||
<li><a href="#tabs4a-1">1</a></li>
|
||||
</ol>
|
||||
<ul>
|
||||
<li><a href="#tabs4a-1">1</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<div id="tabs5">
|
||||
<div>
|
||||
<ul id="tabs5-list"></ul>
|
||||
</div>
|
||||
</div>
|
||||
<div id="tabs6">
|
||||
<ul id="tabs6-list">
|
||||
<li><a href="#tabs6-1">1</a>
|
||||
<ul>
|
||||
<li><a href="#item6-3">3</a></li>
|
||||
<li><a href="#item6-4">4</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li><a href="#tabs6-2">2</a></li>
|
||||
</ul>
|
||||
<div id="tabs6-1"></div>
|
||||
<div id="tabs6-2"></div>
|
||||
</div>
|
||||
<div id="tabs7">
|
||||
<ul id="tabs7-list">
|
||||
<li><a href="#tabs7-1">1</a></li>
|
||||
<li><a href="#tabs7-2">2</a></li>
|
||||
</ul>
|
||||
<div id="tabs7-2"></div>
|
||||
<div id="tabs7-1"></div>
|
||||
</div>
|
||||
<div id="tabs1">
|
||||
<ul>
|
||||
<li><a href="#fragment-1"><span>1</span></a></li>
|
||||
<li><a href="#fragment-2"><span>2</span></a></li>
|
||||
<li><a href="#fragment-3"><span>3</span></a></li>
|
||||
</ul>
|
||||
<div id="fragment-1"></div>
|
||||
<div id="fragment-2"></div>
|
||||
<div id="fragment-3"></div>
|
||||
</div>
|
||||
|
||||
<div id="tabs2">
|
||||
<ul>
|
||||
<li><a href="#colon:test"><span>1</span></a></li>
|
||||
<li><a href="#inline-style"><span>2</span></a></li>
|
||||
<li><a href="data/test.html#test"><span>3</span></a></li>
|
||||
<li><a href="data/test.html" aria-controls="custom-id"><span>4</span></a></li>
|
||||
<li><a href="data/test.html" title="∫ßáö Սե"><span>5</span></a></li>
|
||||
</ul>
|
||||
<div id="colon:test"></div>
|
||||
<div style="height: 300px;" id="inline-style"></div>
|
||||
</div>
|
||||
|
||||
<div id="tabs3">
|
||||
<div>
|
||||
<ul id="tabs3-list">
|
||||
<li><a href="#tabs3-1">1</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="tabs4">
|
||||
<ul id="tabs4-list">
|
||||
<li><a href="#tabs4-1">1</a></li>
|
||||
</ul>
|
||||
<ol>
|
||||
<li><a href="#tabs4-1">1</a></li>
|
||||
</ol>
|
||||
</div>
|
||||
|
||||
<div id="tabs4a">
|
||||
<ol id="tabs4a-list">
|
||||
<li><a href="#tabs4a-1">1</a></li>
|
||||
</ol>
|
||||
<ul>
|
||||
<li><a href="#tabs4a-1">1</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div id="tabs5">
|
||||
<div>
|
||||
<ul id="tabs5-list"></ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="tabs6">
|
||||
<ul id="tabs6-list">
|
||||
<li><a href="#tabs6-1">1</a>
|
||||
<ul>
|
||||
<li><a href="#item6-3">3</a></li>
|
||||
<li><a href="#item6-4">4</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li><a href="#tabs6-2">2</a></li>
|
||||
</ul>
|
||||
<div id="tabs6-1"></div>
|
||||
<div id="tabs6-2"></div>
|
||||
</div>
|
||||
|
||||
<div id="tabs7">
|
||||
<ul id="tabs7-list">
|
||||
<li><a href="#tabs7-1">1</a></li>
|
||||
<li><a href="#tabs7-2">2</a></li>
|
||||
</ul>
|
||||
<div id="tabs7-2"></div>
|
||||
<div id="tabs7-1"></div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
@ -1,58 +1,66 @@
|
||||
/*
|
||||
* tabs_core.js
|
||||
*/
|
||||
var el;
|
||||
(function( $ ) {
|
||||
|
||||
(function($) {
|
||||
module( "tabs: core" );
|
||||
|
||||
module("tabs: core");
|
||||
|
||||
test('navigation markup', function() {
|
||||
el = $('#tabs3').tabs();
|
||||
ok($('#tabs3-list').hasClass('ui-tabs-nav'), 'custom markup; allow list to be any descendant');
|
||||
el.tabs('destroy');
|
||||
|
||||
el = $('#tabs4').tabs();
|
||||
ok($('#tabs4-list').hasClass('ui-tabs-nav'), 'first list found becomes nav - ul');
|
||||
el.tabs('destroy');
|
||||
|
||||
el = $('#tabs4a').tabs();
|
||||
ok($('#tabs4a-list').hasClass('ui-tabs-nav'), 'first list found becomes nav - ol');
|
||||
el.tabs('destroy');
|
||||
|
||||
el = $('#tabs5').tabs();
|
||||
ok($('#tabs5-list').hasClass('ui-tabs-nav'), 'empty list can be used');
|
||||
el.tabs('destroy');
|
||||
test( "markup structure", function() {
|
||||
expect( 3 );
|
||||
var element = $( "#tabs1" ).tabs();
|
||||
ok( element.hasClass( "ui-tabs" ), "main element is .ui-tabs" );
|
||||
ok( element.find( "ul" ).hasClass( "ui-tabs-nav" ), "list item is .ui-tabs-nav" );
|
||||
equal( element.find( ".ui-tabs-panel" ).length, 3,
|
||||
".ui-tabs-panel elements exist, correct number" );
|
||||
});
|
||||
|
||||
test('ajax', function() {
|
||||
expect(4);
|
||||
stop();
|
||||
|
||||
el = $('#tabs2');
|
||||
|
||||
el.tabs({
|
||||
selected: 2,
|
||||
load: function() {
|
||||
// spinner: default spinner
|
||||
setTimeout(function() {
|
||||
equals($('li:eq(2) > a > span', el).length, 1, "should restore tab markup after spinner is removed");
|
||||
equals($('li:eq(2) > a > span', el).html(), '3', "should restore tab label after spinner is removed");
|
||||
el.tabs('destroy');
|
||||
el.tabs({
|
||||
selected: 2,
|
||||
spinner: '<img src="spinner.gif" alt="">',
|
||||
load: function() {
|
||||
// spinner: image
|
||||
equals($('li:eq(2) > a > span', el).length, 1, "should restore tab markup after spinner is removed");
|
||||
equals($('li:eq(2) > a > span', el).html(), '3', "should restore tab label after spinner is removed");
|
||||
start();
|
||||
}
|
||||
});
|
||||
}, 1);
|
||||
}
|
||||
$.each({
|
||||
"deep ul": "#tabs3",
|
||||
"multiple lists, ul first": "#tabs4",
|
||||
"multiple lists, ol first": "#tabs5",
|
||||
"empty list": "#tabs6"
|
||||
}, function( type, selector ) {
|
||||
test( "markup structure: " + type, function() {
|
||||
expect( 2 );
|
||||
var element = $( selector ).tabs();
|
||||
ok( element.hasClass( "ui-tabs" ), "main element is .ui-tabs" );
|
||||
ok( $( selector + "-list" ).hasClass( "ui-tabs-nav" ),
|
||||
"list item is .ui-tabs-nav" );
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
})(jQuery);
|
||||
// #5893 - Sublist in the tab list are considered as tab
|
||||
test( "nested list", function() {
|
||||
expect( 1 );
|
||||
|
||||
var element = $( "#tabs6" ).tabs();
|
||||
equals( element.data( "tabs" ).anchors.length, 2, "should contain 2 tab" );
|
||||
});
|
||||
|
||||
test( "disconnected from DOM", function() {
|
||||
expect( 2 );
|
||||
|
||||
var element = $( "#tabs1" ).remove().tabs();
|
||||
equals( element.find( ".ui-tabs-nav" ).length, 1, "should initialize nav" );
|
||||
equals( element.find( ".ui-tabs-panel" ).length, 3, "should initialize panels" );
|
||||
});
|
||||
|
||||
test( "aria-controls", function() {
|
||||
expect( 7 );
|
||||
var element = $( "#tabs1" ).tabs(),
|
||||
tabs = element.find( ".ui-tabs-nav a" );
|
||||
tabs.each(function() {
|
||||
var tab = $( this );
|
||||
equal( tab.attr( "href" ).substring( 1 ), tab.attr( "aria-controls" ) );
|
||||
});
|
||||
|
||||
element = $( "#tabs2" ).tabs();
|
||||
tabs = element.find( ".ui-tabs-nav a" );
|
||||
equal( tabs.eq( 0 ).attr( "aria-controls" ), "colon:test" );
|
||||
equal( tabs.eq( 1 ).attr( "aria-controls" ), "inline-style" );
|
||||
ok( /^ui-tabs-\d+$/.test( tabs.eq( 2 ).attr( "aria-controls" ) ), "generated id" );
|
||||
equal( tabs.eq( 3 ).attr( "aria-controls" ), "custom-id" );
|
||||
});
|
||||
|
||||
test( "accessibility", function() {
|
||||
// TODO: add tests
|
||||
});
|
||||
|
||||
}( jQuery ) );
|
||||
|
||||
@ -1,27 +1,16 @@
|
||||
/*
|
||||
* tabs_defaults.js
|
||||
*/
|
||||
commonWidgetTests( "tabs", {
|
||||
defaults: {
|
||||
active: null,
|
||||
collapsible: false,
|
||||
disabled: false,
|
||||
event: "click",
|
||||
fx: null,
|
||||
|
||||
var tabs_defaults = {
|
||||
add: null,
|
||||
ajaxOptions: null,
|
||||
cache: false,
|
||||
collapsible: false,
|
||||
cookie: null,
|
||||
disable: null,
|
||||
disabled: false,
|
||||
enable: null,
|
||||
event: "click",
|
||||
fx: null,
|
||||
idPrefix: "ui-tabs-",
|
||||
load: null,
|
||||
panelTemplate: "<div></div>",
|
||||
remove: null,
|
||||
select: null,
|
||||
show: null,
|
||||
spinner: "<em>Loading…</em>",
|
||||
tabTemplate: "<li><a href='#{href}'><span>#{label}</span></a></li>"
|
||||
};
|
||||
|
||||
// FAIL: falsy values break the cookie option
|
||||
commonWidgetTests( "tabs", { defaults: tabs_defaults } );
|
||||
// callbacks
|
||||
activate: null,
|
||||
beforeActivate: null,
|
||||
beforeLoad: null,
|
||||
create: null,
|
||||
load: null
|
||||
}
|
||||
});
|
||||
|
||||
29
tests/unit/tabs/tabs_defaults_deprecated.js
Normal file
29
tests/unit/tabs/tabs_defaults_deprecated.js
Normal file
@ -0,0 +1,29 @@
|
||||
commonWidgetTests( "tabs", {
|
||||
defaults: {
|
||||
active: null,
|
||||
ajaxOptions: null,
|
||||
cache: false,
|
||||
collapsible: false,
|
||||
cookie: null,
|
||||
disabled: false,
|
||||
event: "click",
|
||||
fx: null,
|
||||
idPrefix: "ui-tabs-",
|
||||
panelTemplate: "<div></div>",
|
||||
spinner: "<em>Loading…</em>",
|
||||
tabTemplate: "<li><a href='#{href}'><span>#{label}</span></a></li>",
|
||||
|
||||
// callbacks
|
||||
activate: null,
|
||||
add: null,
|
||||
beforeActivate: null,
|
||||
beforeLoad: null,
|
||||
create: null,
|
||||
disable: null,
|
||||
enable: null,
|
||||
load: null,
|
||||
remove: null,
|
||||
select: null,
|
||||
show: null
|
||||
}
|
||||
});
|
||||
185
tests/unit/tabs/tabs_deprecated.html
Normal file
185
tests/unit/tabs/tabs_deprecated.html
Normal file
@ -0,0 +1,185 @@
|
||||
<!doctype html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>jQuery UI Tabs Test Suite</title>
|
||||
|
||||
<link rel="stylesheet" href="../../../themes/base/jquery.ui.tabs.css">
|
||||
|
||||
<script src="../../../jquery-1.5.1.js"></script>
|
||||
<script src="../../../external/jquery.cookie.js"></script>
|
||||
<script src="../../../ui/jquery.ui.core.js"></script>
|
||||
<script src="../../../ui/jquery.ui.widget.js"></script>
|
||||
<script src="../../../ui/jquery.ui.tabs.js"></script>
|
||||
|
||||
<link rel="stylesheet" href="../../../external/qunit.css">
|
||||
<script src="../../../external/qunit.js"></script>
|
||||
<script src="../../jquery.simulate.js"></script>
|
||||
<script src="../testsuite.js"></script>
|
||||
|
||||
<script src="tabs_defaults_deprecated.js"></script>
|
||||
<script src="tabs_core.js"></script>
|
||||
<script src="tabs_events.js"></script>
|
||||
<script src="tabs_methods.js"></script>
|
||||
<script src="tabs_options.js"></script>
|
||||
<script src="tabs_tickets.js"></script>
|
||||
<script src="tabs_deprecated.js"></script>
|
||||
|
||||
<script>
|
||||
function tabs_state( tabs ) {
|
||||
var expected = $.makeArray( arguments ).slice( 1 );
|
||||
var actual = tabs.find( ".ui-tabs-nav li" ).map(function() {
|
||||
var tab = $( this ),
|
||||
panel = $( $.ui.tabs.prototype._sanitizeSelector(
|
||||
"#" + tab.find( "a" ).attr( "aria-controls" ) ) ),
|
||||
tabIsActive = tab.hasClass( "ui-state-active" ),
|
||||
panelIsActive = panel.css( "display" ) !== "none";
|
||||
|
||||
if ( tabIsActive && panelIsActive ) {
|
||||
return 1;
|
||||
}
|
||||
if ( !tabIsActive && !panelIsActive ) {
|
||||
return 0;
|
||||
}
|
||||
return -1; // mixed state - invalid
|
||||
}).get();
|
||||
same( actual, expected );
|
||||
}
|
||||
|
||||
function tabs_disabled( tabs, state ) {
|
||||
var expected = $.map( new Array( tabs.find ( ".ui-tabs-nav li" ).length ), function( _, index ) {
|
||||
if ( typeof state === "boolean" ) {
|
||||
return state ? 1 : 0;
|
||||
} else {
|
||||
return $.inArray( index, state ) !== -1 ? 1 : 0;
|
||||
}
|
||||
});
|
||||
|
||||
var internalState = tabs.tabs( "option", "disabled" );
|
||||
if ( internalState === false ) {
|
||||
internalState = [];
|
||||
}
|
||||
if ( internalState === true ) {
|
||||
internalState = $.map( new Array( tabs.find( ".ui-tabs-nav li" ).length ), function( _, index ) {
|
||||
return index;
|
||||
});
|
||||
}
|
||||
|
||||
var actual = tabs.find( ".ui-tabs-nav li" ).map(function( index ) {
|
||||
var tab = $( this ),
|
||||
tabIsDisabled = tab.hasClass( "ui-state-disabled" );
|
||||
|
||||
if ( tabIsDisabled && $.inArray( index, internalState ) !== -1 ) {
|
||||
return 1;
|
||||
}
|
||||
if ( !tabIsDisabled && $.inArray( index, internalState ) === -1 ) {
|
||||
return 0;
|
||||
}
|
||||
return -1; // mixed state - invalid
|
||||
}).get();
|
||||
same( tabs.tabs( "option", "disabled" ), state );
|
||||
same( actual, expected );
|
||||
}
|
||||
</script>
|
||||
<script>
|
||||
// disable this stale testsuite for testswarm only
|
||||
var url = window.location.search;
|
||||
url = decodeURIComponent( url.slice( url.indexOf("swarmURL=") + 9 ) );
|
||||
if ( url && url.indexOf("http") == 0 ) {
|
||||
// reset config to kill previous tests; make sure testsuite.js is loaded afterwards to init the testswarm script
|
||||
QUnit.init();
|
||||
test("tabs", function() { ok(true, "disabled tabs testsuite"); });
|
||||
}
|
||||
</script>
|
||||
<script src="../swarminject.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<h1 id="qunit-header">jQuery UI Tabs Test Suite</h1>
|
||||
<h2 id="qunit-banner"></h2>
|
||||
<div id="qunit-testrunner-toolbar"></div>
|
||||
<h2 id="qunit-userAgent"></h2>
|
||||
<ol id="qunit-tests"></ol>
|
||||
<div id="qunit-fixture">
|
||||
|
||||
<div id="tabs1">
|
||||
<ul>
|
||||
<li><a href="#fragment-1"><span>1</span></a></li>
|
||||
<li><a href="#fragment-2"><span>2</span></a></li>
|
||||
<li><a href="#fragment-3"><span>3</span></a></li>
|
||||
</ul>
|
||||
<div id="fragment-1"></div>
|
||||
<div id="fragment-2"></div>
|
||||
<div id="fragment-3"></div>
|
||||
</div>
|
||||
|
||||
<div id="tabs2">
|
||||
<ul>
|
||||
<li><a href="#colon:test"><span>1</span></a></li>
|
||||
<li><a href="#inline-style"><span>2</span></a></li>
|
||||
<li><a href="data/test.html#test"><span>3</span></a></li>
|
||||
<li><a href="data/test.html" aria-controls="custom-id"><span>4</span></a></li>
|
||||
<li><a href="data/test.html" title="∫ßáö Սե"><span>5</span></a></li>
|
||||
</ul>
|
||||
<div id="colon:test"></div>
|
||||
<div style="height: 300px;" id="inline-style"></div>
|
||||
</div>
|
||||
|
||||
<div id="tabs3">
|
||||
<div>
|
||||
<ul id="tabs3-list">
|
||||
<li><a href="#tabs3-1">1</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="tabs4">
|
||||
<ul id="tabs4-list">
|
||||
<li><a href="#tabs4-1">1</a></li>
|
||||
</ul>
|
||||
<ol>
|
||||
<li><a href="#tabs4-1">1</a></li>
|
||||
</ol>
|
||||
</div>
|
||||
|
||||
<div id="tabs4a">
|
||||
<ol id="tabs4a-list">
|
||||
<li><a href="#tabs4a-1">1</a></li>
|
||||
</ol>
|
||||
<ul>
|
||||
<li><a href="#tabs4a-1">1</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div id="tabs5">
|
||||
<div>
|
||||
<ul id="tabs5-list"></ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="tabs6">
|
||||
<ul id="tabs6-list">
|
||||
<li><a href="#tabs6-1">1</a>
|
||||
<ul>
|
||||
<li><a href="#item6-3">3</a></li>
|
||||
<li><a href="#item6-4">4</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li><a href="#tabs6-2">2</a></li>
|
||||
</ul>
|
||||
<div id="tabs6-1"></div>
|
||||
<div id="tabs6-2"></div>
|
||||
</div>
|
||||
|
||||
<div id="tabs7">
|
||||
<ul id="tabs7-list">
|
||||
<li><a href="#tabs7-1">1</a></li>
|
||||
<li><a href="#tabs7-2">2</a></li>
|
||||
</ul>
|
||||
<div id="tabs7-2"></div>
|
||||
<div id="tabs7-1"></div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
386
tests/unit/tabs/tabs_deprecated.js
Normal file
386
tests/unit/tabs/tabs_deprecated.js
Normal file
@ -0,0 +1,386 @@
|
||||
(function( $ ) {
|
||||
|
||||
module("tabs (deprecated): core");
|
||||
|
||||
test( "panel ids", function() {
|
||||
expect( 2 );
|
||||
|
||||
var element = $( "#tabs2" ).tabs();
|
||||
|
||||
element.one( "tabsbeforeload", function( event, ui ) {
|
||||
equal( ui.panel.attr( "id" ), "∫ßáö_Սե", "from title attribute" );
|
||||
event.preventDefault();
|
||||
});
|
||||
element.tabs( "option", "active", 4 );
|
||||
|
||||
element.one( "tabsbeforeload", function( event, ui ) {
|
||||
ok( /^ui-tabs-\d+$/.test( ui.panel.attr( "id" ) ), "generated id" );
|
||||
event.preventDefault();
|
||||
});
|
||||
element.tabs( "option", "active", 2 );
|
||||
});
|
||||
|
||||
module("tabs (deprecated): options");
|
||||
|
||||
test('ajaxOptions', function() {
|
||||
ok(false, "missing test - untested code is broken code.");
|
||||
});
|
||||
|
||||
test('cache', function() {
|
||||
ok(false, "missing test - untested code is broken code.");
|
||||
});
|
||||
|
||||
test('idPrefix', function() {
|
||||
ok(false, "missing test - untested code is broken code.");
|
||||
});
|
||||
|
||||
test('tabTemplate', function() {
|
||||
ok(false, "missing test - untested code is broken code.");
|
||||
});
|
||||
|
||||
test('panelTemplate', function() {
|
||||
ok(false, "missing test - untested code is broken code.");
|
||||
});
|
||||
|
||||
test('cookie', function() {
|
||||
expect(6);
|
||||
|
||||
el = $('#tabs1');
|
||||
var cookieName = 'tabs_test', cookieObj = { name: cookieName };
|
||||
$.cookie(cookieName, null); // blank state
|
||||
var cookie = function() {
|
||||
return parseInt($.cookie(cookieName), 10);
|
||||
};
|
||||
|
||||
el.tabs({ cookie: cookieObj });
|
||||
equals(cookie(), 0, 'initial cookie value');
|
||||
|
||||
el.tabs('destroy');
|
||||
el.tabs({ active: 1, cookie: cookieObj });
|
||||
equals(cookie(), 1, 'initial cookie value, from active property');
|
||||
|
||||
el.tabs('option', 'active', 2);
|
||||
equals(cookie(), 2, 'cookie value updated after activating');
|
||||
|
||||
el.tabs('destroy');
|
||||
$.cookie(cookieName, 1);
|
||||
el.tabs({ cookie: cookieObj });
|
||||
equals(cookie(), 1, 'initial cookie value, from existing cookie');
|
||||
|
||||
el.tabs('destroy');
|
||||
el.tabs({ cookie: cookieObj, collapsible: true });
|
||||
el.tabs('option', 'active', false);
|
||||
equals(cookie(), -1, 'cookie value for all tabs unselected');
|
||||
|
||||
el.tabs('destroy');
|
||||
ok($.cookie(cookieName) === null, 'erase cookie after destroy');
|
||||
|
||||
});
|
||||
|
||||
|
||||
test('spinner', function() {
|
||||
expect(4);
|
||||
stop();
|
||||
|
||||
el = $('#tabs2');
|
||||
|
||||
el.tabs({
|
||||
selected: 2,
|
||||
load: function() {
|
||||
// spinner: default spinner
|
||||
setTimeout(function() {
|
||||
equals($('li:eq(2) > a > span', el).length, 1, "should restore tab markup after spinner is removed");
|
||||
equals($('li:eq(2) > a > span', el).html(), '3', "should restore tab label after spinner is removed");
|
||||
el.tabs('destroy');
|
||||
el.tabs({
|
||||
selected: 2,
|
||||
spinner: '<img src="spinner.gif" alt="">',
|
||||
load: function() {
|
||||
// spinner: image
|
||||
equals($('li:eq(2) > a > span', el).length, 1, "should restore tab markup after spinner is removed");
|
||||
equals($('li:eq(2) > a > span', el).html(), '3', "should restore tab label after spinner is removed");
|
||||
start();
|
||||
}
|
||||
});
|
||||
}, 1);
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
test('selected', function() {
|
||||
expect(10);
|
||||
|
||||
el = $('#tabs1').tabs();
|
||||
equals(el.tabs('option', 'selected'), 0, 'should be 0 by default');
|
||||
|
||||
el.tabs('destroy');
|
||||
//set a hash in the url
|
||||
location.hash = '#fragment-2';
|
||||
//selection of tab with divs ordered differently than list
|
||||
el = $('#tabs1').tabs();
|
||||
equals(el.tabs('option', 'selected'), 1, 'second tab should be selected');
|
||||
|
||||
el.tabs('destroy');
|
||||
//set a hash in the url
|
||||
location.hash = '#tabs7-2';
|
||||
//selection of tab with divs ordered differently than list
|
||||
el = $('#tabs7').tabs();
|
||||
equals(el.tabs('option', 'selected'), 1, 'second tab should be selected');
|
||||
|
||||
el.tabs('destroy');
|
||||
el = $('#tabs1').tabs({ selected: -1 });
|
||||
equals(el.tabs('option', 'selected'), -1, 'should be -1 for all tabs unselected');
|
||||
equals( $('li.ui-tabs-active', el).length, 0, 'no tab should be selected' );
|
||||
equals( $('div:hidden', '#tabs1').length, 3, 'all panels should be hidden' );
|
||||
|
||||
el.tabs('destroy');
|
||||
el.tabs({ selected: 1 });
|
||||
equals(el.tabs('option', 'selected'), 1, 'should be specified tab');
|
||||
|
||||
el.tabs('destroy');
|
||||
el.tabs({ selected: 99 });
|
||||
equals(el.tabs('option', 'selected'), 0, 'selected should default to zero if given value is out of index');
|
||||
|
||||
el.tabs('destroy');
|
||||
el.tabs({ collapsible: true });
|
||||
el.tabs('option', 'selected', 0);
|
||||
equals(el.tabs('option', 'selected'), 0, 'should not collapse tab if value is same as selected');
|
||||
|
||||
el.tabs('destroy');
|
||||
el = $('#tabs1').tabs();
|
||||
el.tabs('select', 1);
|
||||
equals(el.tabs('option', 'selected'), 1, 'should select tab');
|
||||
});
|
||||
|
||||
module("tabs (deprecated): events");
|
||||
|
||||
test('enable', function() {
|
||||
expect(4);
|
||||
|
||||
var uiObj;
|
||||
el = $('#tabs1').tabs({
|
||||
disabled: [ 0, 1 ],
|
||||
enable: function (event, ui) {
|
||||
uiObj = ui;
|
||||
}
|
||||
});
|
||||
el.tabs('enable', 1);
|
||||
ok(uiObj !== undefined, 'trigger callback');
|
||||
equals(uiObj.tab, $('a', el)[1], 'contain tab as DOM anchor element');
|
||||
equals(uiObj.panel, $('div', el)[1], 'contain panel as DOM div element');
|
||||
equals(uiObj.index, 1, 'contain index');
|
||||
});
|
||||
|
||||
test('disable', function() {
|
||||
expect(4);
|
||||
|
||||
var uiObj;
|
||||
el = $('#tabs1').tabs({
|
||||
disable: function (event, ui) {
|
||||
uiObj = ui;
|
||||
}
|
||||
});
|
||||
el.tabs('disable', 1);
|
||||
ok(uiObj !== undefined, 'trigger callback');
|
||||
equals(uiObj.tab, $('a', el)[1], 'contain tab as DOM anchor element');
|
||||
equals(uiObj.panel, $('div', el)[1], 'contain panel as DOM div element');
|
||||
equals(uiObj.index, 1, 'contain index');
|
||||
});
|
||||
|
||||
test('show', function() {
|
||||
expect(5);
|
||||
|
||||
var uiObj, eventObj;
|
||||
el = $('#tabs1').tabs({
|
||||
show: function(event, ui) {
|
||||
uiObj = ui;
|
||||
eventObj = event;
|
||||
}
|
||||
});
|
||||
ok(uiObj !== undefined, 'trigger callback after initialization');
|
||||
equals(uiObj.tab, $('a', el)[0], 'contain tab as DOM anchor element');
|
||||
equals(uiObj.panel, $('div', el)[0], 'contain panel as DOM div element');
|
||||
equals(uiObj.index, 0, 'contain index');
|
||||
|
||||
el.find( "li:eq(1) a" ).simulate( "click" );
|
||||
equals( eventObj.originalEvent.type, "click", "show triggered by click" );
|
||||
|
||||
});
|
||||
|
||||
test('select', function() {
|
||||
expect(7);
|
||||
|
||||
var eventObj;
|
||||
el = $('#tabs1').tabs({
|
||||
select: function(event, ui) {
|
||||
ok(true, 'select triggered after initialization');
|
||||
equals(this, el[0], "context of callback");
|
||||
equals(event.type, 'tabsselect', 'event type in callback');
|
||||
equals(ui.tab, el.find('a')[1], 'contain tab as DOM anchor element');
|
||||
equals(ui.panel, el.find('div')[1], 'contain panel as DOM div element');
|
||||
equals(ui.index, 1, 'contain index');
|
||||
evenObj = event;
|
||||
}
|
||||
});
|
||||
el.tabs('select', 1);
|
||||
|
||||
el.find( "li:eq(1) a" ).simulate( "click" );
|
||||
equals( evenObj.originalEvent.type, "click", "select triggered by click" );
|
||||
});
|
||||
|
||||
module( "tabs (deprecated): methods" );
|
||||
|
||||
test( "add", function() {
|
||||
expect( 27 );
|
||||
|
||||
var element = $( "#tabs1" ).tabs();
|
||||
tabs_state( element, 1, 0, 0 );
|
||||
|
||||
// add without index
|
||||
element.one( "tabsadd", function( event, ui ) {
|
||||
equal( ui.index, 3, "ui.index" );
|
||||
equal( $( ui.tab ).text(), "New", "ui.tab" );
|
||||
equal( ui.panel.id, "new", "ui.panel" );
|
||||
});
|
||||
element.tabs( "add", "#new", "New" );
|
||||
tabs_state( element, 1, 0, 0, 0 );
|
||||
var tab = element.find( ".ui-tabs-nav li" ).last(),
|
||||
anchor = tab.find( "a" );
|
||||
equals( tab.text(), "New", "label" );
|
||||
equals( anchor.attr( "href" ), "#new", "href" );
|
||||
equals( anchor.attr( "aria-controls" ), "new", "aria-controls" );
|
||||
ok( !tab.hasClass( "ui-state-hover" ), "not hovered" );
|
||||
anchor.simulate( "mouseover" );
|
||||
ok( tab.hasClass( "ui-state-hover" ), "hovered" );
|
||||
anchor.simulate( "click" );
|
||||
tabs_state( element, 0, 0, 0, 1 );
|
||||
|
||||
// add remote tab with index
|
||||
element.one( "tabsadd", function( event, ui ) {
|
||||
equal( ui.index, 1, "ui.index" );
|
||||
equal( $( ui.tab ).text(), "New Remote", "ui.tab" );
|
||||
equal( ui.panel.id, $( ui.tab ).attr( "aria-controls" ), "ui.panel" );
|
||||
});
|
||||
element.tabs( "add", "data/test.html", "New Remote", 1 );
|
||||
tabs_state( element, 0, 0, 0, 0, 1 );
|
||||
tab = element.find( ".ui-tabs-nav li" ).eq( 1 );
|
||||
anchor = tab.find( "a" );
|
||||
equals( tab.text(), "New Remote", "label" );
|
||||
equals( anchor.attr( "href" ), "data/test.html", "href" );
|
||||
ok( /^ui-tabs-\d+$/.test( anchor.attr( "aria-controls" ) ), "aria controls" );
|
||||
ok( !tab.hasClass( "ui-state-hover" ), "not hovered" );
|
||||
anchor.simulate( "mouseover" );
|
||||
ok( tab.hasClass( "ui-state-hover" ), "hovered" );
|
||||
anchor.simulate( "click" );
|
||||
tabs_state( element, 0, 1, 0, 0, 0 );
|
||||
|
||||
// add to empty tab set
|
||||
element = $( "<div><ul></ul></div>" ).tabs();
|
||||
equals( element.tabs( "option", "active" ), false, "active: false on init" );
|
||||
element.one( "tabsadd", function( event, ui ) {
|
||||
equal( ui.index, 0, "ui.index" );
|
||||
equal( $( ui.tab ).text(), "First", "ui.tab" );
|
||||
equal( ui.panel.id, "first", "ui.panel" );
|
||||
});
|
||||
element.tabs( "add", "#first", "First" );
|
||||
tabs_state( element, 1 );
|
||||
equals( element.tabs( "option", "active" ), 0, "active: 0 after add" );
|
||||
});
|
||||
|
||||
test( "#5069 - ui.tabs.add creates two tab panels when using a full URL", function() {
|
||||
expect( 2 );
|
||||
|
||||
var element = $( "#tabs2" ).tabs();
|
||||
equals( element.children( "div" ).length, element.find( ".ui-tabs-nav li" ).length );
|
||||
element.tabs( "add", "/new", "New" );
|
||||
equals( element.children( "div" ).length, element.find( ".ui-tabs-nav li" ).length );
|
||||
});
|
||||
|
||||
test( "remove", function() {
|
||||
expect( 17 );
|
||||
|
||||
var element = $( "#tabs1" ).tabs({ active: 1 });
|
||||
tabs_state( element, 0, 1, 0 );
|
||||
|
||||
element.one( "tabsremove", function( event, ui ) {
|
||||
equal( ui.index, -1, "ui.index" );
|
||||
equal( $( ui.tab ).text(), "2", "ui.tab" );
|
||||
equal( ui.panel.id, "fragment-2", "ui.panel" );
|
||||
});
|
||||
element.tabs( "remove", 1 );
|
||||
tabs_state( element, 0, 1 );
|
||||
equals( element.tabs( "option", "active" ), 1 );
|
||||
equals( element.find( ".ui-tabs-nav li a[href$='fragment-2']" ).length, 0,
|
||||
"remove correct list item" );
|
||||
equals( element.find( "#fragment-2" ).length, 0, "remove correct panel" );
|
||||
|
||||
element.one( "tabsremove", function( event, ui ) {
|
||||
equal( ui.index, -1, "ui.index" );
|
||||
equal( $( ui.tab ).text(), "3", "ui.tab" );
|
||||
equal( ui.panel.id, "fragment-3", "ui.panel" );
|
||||
});
|
||||
element.tabs( "remove", 1 );
|
||||
tabs_state( element, 1 );
|
||||
equals( element.tabs( "option", "active"), 0 );
|
||||
|
||||
element.one( "tabsremove", function( event, ui ) {
|
||||
equal( ui.index, -1, "ui.index" );
|
||||
equal( $( ui.tab ).text(), "1", "ui.tab" );
|
||||
equal( ui.panel.id, "fragment-1", "ui.panel" );
|
||||
});
|
||||
element.tabs( "remove", 0 );
|
||||
equals( element.tabs( "option", "active" ), false );
|
||||
});
|
||||
|
||||
test('select', function() {
|
||||
expect(6);
|
||||
|
||||
el = $('#tabs1').tabs();
|
||||
|
||||
el.tabs('select', 1);
|
||||
equals(el.tabs('option', 'active'), 1, 'should select tab');
|
||||
|
||||
el.tabs('destroy');
|
||||
el.tabs({ collapsible: true });
|
||||
el.tabs('select', 0);
|
||||
equals(el.tabs('option', 'active'), -1, 'should collapse tab passing in the already active tab');
|
||||
|
||||
el.tabs('destroy');
|
||||
el.tabs({ collapsible: true });
|
||||
el.tabs('select', -1);
|
||||
equals(el.tabs('option', 'active'), -1, 'should collapse tab passing in -1');
|
||||
|
||||
el.tabs('destroy');
|
||||
el.tabs();
|
||||
el.tabs('select', 0);
|
||||
equals(el.tabs('option', 'active'), 0, 'should not collapse tab if collapsible is not set to true');
|
||||
el.tabs('select', -1);
|
||||
equals(el.tabs('option', 'active'), 0, 'should not collapse tab if collapsible is not set to true');
|
||||
|
||||
el.tabs('select', '#fragment-2');
|
||||
equals(el.tabs('option', 'active'), 1, 'should select tab by id');
|
||||
});
|
||||
|
||||
test( "length", function() {
|
||||
expect( 2 );
|
||||
|
||||
equals( $( "#tabs1" ).tabs().tabs( "length" ), 3, "basic tabs" );
|
||||
equals( $( "#tabs2" ).tabs().tabs( "length" ), 5, "ajax tabs with missing panels" );
|
||||
});
|
||||
|
||||
test( "url", function() {
|
||||
expect( 2 );
|
||||
|
||||
var element = $( "#tabs2" ).tabs(),
|
||||
tab = element.find( "a" ).eq( 3 );
|
||||
|
||||
element.tabs( "url", 3, "data/test2.html" );
|
||||
equals( tab.attr( "href" ), "data/test2.html", "href was updated" );
|
||||
element.one( "tabsbeforeload", function( event, ui ) {
|
||||
equals( ui.ajaxSettings.url, "data/test2.html", "ajaxSettings.url" );
|
||||
event.preventDefault();
|
||||
});
|
||||
element.tabs( "option", "active", 3 );
|
||||
});
|
||||
|
||||
}( jQuery ) );
|
||||
@ -1,105 +1,198 @@
|
||||
/*
|
||||
* tabs_events.js
|
||||
*/
|
||||
(function($) {
|
||||
(function( $ ) {
|
||||
|
||||
module("tabs: events");
|
||||
module( "tabs: events" );
|
||||
|
||||
test('select', function() {
|
||||
expect(7);
|
||||
test( "beforeActivate", function() {
|
||||
expect( 38 );
|
||||
|
||||
var eventObj;
|
||||
el = $('#tabs1').tabs({
|
||||
select: function(event, ui) {
|
||||
ok(true, 'select triggered after initialization');
|
||||
equals(this, el[0], "context of callback");
|
||||
equals(event.type, 'tabsselect', 'event type in callback');
|
||||
equals(ui.tab, el.find('a')[1], 'contain tab as DOM anchor element');
|
||||
equals(ui.panel, el.find('div')[1], 'contain panel as DOM div element');
|
||||
equals(ui.index, 1, 'contain index');
|
||||
evenObj = event;
|
||||
}
|
||||
var element = $( "#tabs1" ).tabs({
|
||||
active: false,
|
||||
collapsible: true
|
||||
}),
|
||||
tabs = element.find( ".ui-tabs-nav a" ),
|
||||
panels = element.find( ".ui-tabs-panel" );
|
||||
|
||||
// from collapsed
|
||||
element.one( "tabsbeforeactivate", function( event, ui ) {
|
||||
ok( !( "originalEvent" in event ), "originalEvent" );
|
||||
equals( ui.oldTab.size(), 0, "oldTab size" );
|
||||
equals( ui.oldPanel.size(), 0, "oldPanel size" );
|
||||
equals( ui.newTab.size(), 1, "newTab size" );
|
||||
strictEqual( ui.newTab[ 0 ], tabs[ 0 ], "newTab" );
|
||||
equals( ui.newPanel.size(), 1, "newPanel size" );
|
||||
strictEqual( ui.newPanel[ 0 ], panels[ 0 ], "newPanel" );
|
||||
tabs_state( element, 0, 0, 0 );
|
||||
});
|
||||
el.tabs('select', 1);
|
||||
element.tabs( "option", "active", 0 );
|
||||
tabs_state( element, 1, 0, 0 );
|
||||
|
||||
el.find( "li:eq(1) a" ).simulate( "click" );
|
||||
equals( evenObj.originalEvent.type, "click", "select triggered by click" );
|
||||
});
|
||||
|
||||
test('load', function() {
|
||||
ok(false, "missing test - untested code is broken code.");
|
||||
});
|
||||
|
||||
test('show', function() {
|
||||
expect(5);
|
||||
|
||||
var uiObj, eventObj;
|
||||
el = $('#tabs1').tabs({
|
||||
show: function(event, ui) {
|
||||
uiObj = ui;
|
||||
eventObj = event;
|
||||
}
|
||||
// switching tabs
|
||||
element.one( "tabsbeforeactivate", function( event, ui ) {
|
||||
equals( event.originalEvent.type, "click", "originalEvent" );
|
||||
equals( ui.oldTab.size(), 1, "oldTab size" );
|
||||
strictEqual( ui.oldTab[ 0 ], tabs[ 0 ], "oldTab" );
|
||||
equals( ui.oldPanel.size(), 1, "oldPanel size" );
|
||||
strictEqual( ui.oldPanel[ 0 ], panels[ 0 ], "oldPanel" );
|
||||
equals( ui.newTab.size(), 1, "newTab size" );
|
||||
strictEqual( ui.newTab[ 0 ], tabs[ 1 ], "newTab" );
|
||||
equals( ui.newPanel.size(), 1, "newPanel size" );
|
||||
strictEqual( ui.newPanel[ 0 ], panels[ 1 ], "newPanel" );
|
||||
tabs_state( element, 1, 0, 0 );
|
||||
});
|
||||
ok(uiObj !== undefined, 'trigger callback after initialization');
|
||||
equals(uiObj.tab, $('a', el)[0], 'contain tab as DOM anchor element');
|
||||
equals(uiObj.panel, $('div', el)[0], 'contain panel as DOM div element');
|
||||
equals(uiObj.index, 0, 'contain index');
|
||||
tabs.eq( 1 ).click();
|
||||
tabs_state( element, 0, 1, 0 );
|
||||
|
||||
el.find( "li:eq(1) a" ).simulate( "click" );
|
||||
equals( eventObj.originalEvent.type, "click", "show triggered by click" );
|
||||
|
||||
});
|
||||
|
||||
test('add', function() {
|
||||
|
||||
// TODO move to methods, not at all event related...
|
||||
|
||||
var el = $('<div id="tabs"><ul></ul></div>').tabs();
|
||||
equals(el.tabs('option', 'selected'), -1, 'Initially empty, no selected tab');
|
||||
|
||||
el.tabs('add', '#test1', 'Test 1');
|
||||
equals(el.tabs('option', 'selected'), 0, 'First tab added should be auto selected');
|
||||
|
||||
el.tabs('add', '#test2', 'Test 2');
|
||||
equals(el.tabs('option', 'selected'), 0, 'Second tab added should not be auto selected');
|
||||
|
||||
});
|
||||
|
||||
test('remove', function() {
|
||||
ok(false, "missing test - untested code is broken code.");
|
||||
});
|
||||
|
||||
test('enable', function() {
|
||||
expect(4);
|
||||
|
||||
var uiObj;
|
||||
el = $('#tabs1').tabs({
|
||||
disabled: [ 0, 1 ],
|
||||
enable: function (event, ui) {
|
||||
uiObj = ui;
|
||||
}
|
||||
// collapsing
|
||||
element.one( "tabsbeforeactivate", function( event, ui ) {
|
||||
ok( !( "originalEvent" in event ), "originalEvent" );
|
||||
equals( ui.oldTab.size(), 1, "oldTab size" );
|
||||
strictEqual( ui.oldTab[ 0 ], tabs[ 1 ], "oldTab" );
|
||||
equals( ui.oldPanel.size(), 1, "oldPanel size" );
|
||||
strictEqual( ui.oldPanel[ 0 ], panels[ 1 ], "oldPanel" );
|
||||
equals( ui.newTab.size(), 0, "newTab size" );
|
||||
equals( ui.newPanel.size(), 0, "newPanel size" );
|
||||
tabs_state( element, 0, 1, 0 );
|
||||
});
|
||||
el.tabs('enable', 1);
|
||||
ok(uiObj !== undefined, 'trigger callback');
|
||||
equals(uiObj.tab, $('a', el)[1], 'contain tab as DOM anchor element');
|
||||
equals(uiObj.panel, $('div', el)[1], 'contain panel as DOM div element');
|
||||
equals(uiObj.index, 1, 'contain index');
|
||||
});
|
||||
element.tabs( "option", "active", false );
|
||||
tabs_state( element, 0, 0, 0 );
|
||||
|
||||
test('disable', function() {
|
||||
expect(4);
|
||||
|
||||
var uiObj;
|
||||
el = $('#tabs1').tabs({
|
||||
disable: function (event, ui) {
|
||||
uiObj = ui;
|
||||
}
|
||||
// prevent activation
|
||||
element.one( "tabsbeforeactivate", function( event, ui ) {
|
||||
ok( !( "originalEvent" in event ), "originalEvent" );
|
||||
equals( ui.oldTab.size(), 0, "oldTab size" );
|
||||
equals( ui.oldPanel.size(), 0, "oldTab" );
|
||||
equals( ui.newTab.size(), 1, "newTab size" );
|
||||
strictEqual( ui.newTab[ 0 ], tabs[ 1 ], "newTab" );
|
||||
equals( ui.newPanel.size(), 1, "newPanel size" );
|
||||
strictEqual( ui.newPanel[ 0 ], panels[ 1 ], "newPanel" );
|
||||
event.preventDefault();
|
||||
tabs_state( element, 0, 0, 0 );
|
||||
});
|
||||
el.tabs('disable', 1);
|
||||
ok(uiObj !== undefined, 'trigger callback');
|
||||
equals(uiObj.tab, $('a', el)[1], 'contain tab as DOM anchor element');
|
||||
equals(uiObj.panel, $('div', el)[1], 'contain panel as DOM div element');
|
||||
equals(uiObj.index, 1, 'contain index');
|
||||
element.tabs( "option", "active", 1 );
|
||||
tabs_state( element, 0, 0, 0 );
|
||||
});
|
||||
|
||||
})(jQuery);
|
||||
test( "activate", function() {
|
||||
expect( 30 );
|
||||
|
||||
var element = $( "#tabs1" ).tabs({
|
||||
active: false,
|
||||
collapsible: true
|
||||
}),
|
||||
tabs = element.find( ".ui-tabs-nav a" ),
|
||||
panels = element.find( ".ui-tabs-panel" );
|
||||
|
||||
// from collapsed
|
||||
element.one( "tabsactivate", function( event, ui ) {
|
||||
ok( !( "originalEvent" in event ), "originalEvent" );
|
||||
equals( ui.oldTab.size(), 0, "oldTab size" );
|
||||
equals( ui.oldPanel.size(), 0, "oldPanel size" );
|
||||
equals( ui.newTab.size(), 1, "newTab size" );
|
||||
strictEqual( ui.newTab[ 0 ], tabs[ 0 ], "newTab" );
|
||||
equals( ui.newPanel.size(), 1, "newPanel size" );
|
||||
strictEqual( ui.newPanel[ 0 ], panels[ 0 ], "newPanel" );
|
||||
tabs_state( element, 1, 0, 0 );
|
||||
});
|
||||
element.tabs( "option", "active", 0 );
|
||||
tabs_state( element, 1, 0, 0 );
|
||||
|
||||
// switching tabs
|
||||
element.one( "tabsactivate", function( event, ui ) {
|
||||
equals( event.originalEvent.type, "click", "originalEvent" );
|
||||
equals( ui.oldTab.size(), 1, "oldTab size" );
|
||||
strictEqual( ui.oldTab[ 0 ], tabs[ 0 ], "oldTab" );
|
||||
equals( ui.oldPanel.size(), 1, "oldPanel size" );
|
||||
strictEqual( ui.oldPanel[ 0 ], panels[ 0 ], "oldPanel" );
|
||||
equals( ui.newTab.size(), 1, "newTab size" );
|
||||
strictEqual( ui.newTab[ 0 ], tabs[ 1 ], "newTab" );
|
||||
equals( ui.newPanel.size(), 1, "newPanel size" );
|
||||
strictEqual( ui.newPanel[ 0 ], panels[ 1 ], "newPanel" );
|
||||
tabs_state( element, 0, 1, 0 );
|
||||
});
|
||||
tabs.eq( 1 ).click();
|
||||
tabs_state( element, 0, 1, 0 );
|
||||
|
||||
// collapsing
|
||||
element.one( "tabsactivate", function( event, ui ) {
|
||||
ok( !( "originalEvent" in event ), "originalEvent" );
|
||||
equals( ui.oldTab.size(), 1, "oldTab size" );
|
||||
strictEqual( ui.oldTab[ 0 ], tabs[ 1 ], "oldTab" );
|
||||
equals( ui.oldPanel.size(), 1, "oldPanel size" );
|
||||
strictEqual( ui.oldPanel[ 0 ], panels[ 1 ], "oldPanel" );
|
||||
equals( ui.newTab.size(), 0, "newTab size" );
|
||||
equals( ui.newPanel.size(), 0, "newPanel size" );
|
||||
tabs_state( element, 0, 0, 0 );
|
||||
});
|
||||
element.tabs( "option", "active", false );
|
||||
tabs_state( element, 0, 0, 0 );
|
||||
|
||||
// prevent activation
|
||||
element.one( "tabsbeforeactivate", function( event ) {
|
||||
ok( true, "tabsbeforeactivate" );
|
||||
event.preventDefault();
|
||||
});
|
||||
element.one( "tabsactivate", function() {
|
||||
ok( false, "tabsactivate" );
|
||||
});
|
||||
element.tabs( "option", "active", 1 );
|
||||
});
|
||||
|
||||
test( "beforeLoad", function() {
|
||||
expect( 21 );
|
||||
|
||||
var tab, panelId, panel,
|
||||
element = $( "#tabs2" ).tabs();
|
||||
|
||||
// TODO: init
|
||||
// element.one( "tabsbeforeload", function( event, ui ) {
|
||||
// });
|
||||
// element.tabs({ active: 2 });
|
||||
|
||||
// .option()
|
||||
element.one( "tabsbeforeload", function( event, ui ) {
|
||||
tab = element.find( ".ui-tabs-nav a" ).eq( 2 );
|
||||
panelId = tab.attr( "aria-controls" );
|
||||
panel = $( "#" + panelId );
|
||||
|
||||
ok( !( "originalEvent" in event ), "originalEvent" );
|
||||
ok( "abort" in ui.jqXHR, "jqXHR" );
|
||||
ok( ui.ajaxSettings.url, "data/test.html", "ajaxSettings.url" );
|
||||
equals( ui.tab.size(), 1, "tab size" );
|
||||
strictEqual( ui.tab[ 0 ], tab[ 0 ], "tab" );
|
||||
equals( ui.panel.size(), 1, "panel size" );
|
||||
strictEqual( ui.panel[ 0 ], panel[ 0 ], "panel" );
|
||||
equals( ui.panel.html(), "", "panel html" );
|
||||
event.preventDefault();
|
||||
tabs_state( element, 1, 0, 0, 0, 0 );
|
||||
});
|
||||
element.tabs( "option", "active", 2 );
|
||||
tabs_state( element, 0, 0, 1, 0, 0 );
|
||||
equals( panel.html(), "", "panel html after" );
|
||||
|
||||
// click, change panel content
|
||||
element.one( "tabsbeforeload", function( event, ui ) {
|
||||
tab = element.find( ".ui-tabs-nav a" ).eq( 3 );
|
||||
panelId = tab.attr( "aria-controls" );
|
||||
panel = $( "#" + panelId );
|
||||
|
||||
equals( event.originalEvent.type, "click", "originalEvent" );
|
||||
ok( "abort" in ui.jqXHR, "jqXHR" );
|
||||
ok( ui.ajaxSettings.url, "data/test.html", "ajaxSettings.url" );
|
||||
equals( ui.tab.size(), 1, "tab size" );
|
||||
strictEqual( ui.tab[ 0 ], tab[ 0 ], "tab" );
|
||||
equals( ui.panel.size(), 1, "panel size" );
|
||||
strictEqual( ui.panel[ 0 ], panel[ 0 ], "panel" );
|
||||
ui.panel.html( "<p>testing</p>" );
|
||||
event.preventDefault();
|
||||
tabs_state( element, 0, 0, 1, 0, 0 );
|
||||
});
|
||||
element.find( ".ui-tabs-nav a" ).eq( 3 ).click();
|
||||
tabs_state( element, 0, 0, 0, 1, 0 );
|
||||
equals( panel.html(), "<p>testing</p>", "panel html after" );
|
||||
});
|
||||
|
||||
test( "load", function() {
|
||||
ok( false, "missing test - untested code is broken code." );
|
||||
});
|
||||
|
||||
}( jQuery ) );
|
||||
|
||||
@ -1,61 +1,6 @@
|
||||
/*
|
||||
* tabs_methods.js
|
||||
*/
|
||||
(function($) {
|
||||
(function( $ ) {
|
||||
|
||||
module("tabs: methods");
|
||||
|
||||
test('init', function() {
|
||||
expect(9);
|
||||
|
||||
el = $('#tabs1').tabs();
|
||||
|
||||
ok(true, '.tabs() called on element');
|
||||
ok( el.is('.ui-tabs.ui-widget.ui-widget-content.ui-corner-all'), 'attach classes to container');
|
||||
ok( $('ul', el).is('.ui-tabs-nav.ui-helper-reset.ui-helper-clearfix.ui-widget-header.ui-corner-all'), 'attach classes to list' );
|
||||
ok( $('div:eq(0)', el).is('.ui-tabs-panel.ui-widget-content.ui-corner-bottom'), 'attach classes to panel' );
|
||||
ok( $('li:eq(0)', el).is('.ui-tabs-selected.ui-state-active.ui-corner-top'), 'attach classes to active li');
|
||||
ok( $('li:eq(1)', el).is('.ui-state-default.ui-corner-top'), 'attach classes to inactive li');
|
||||
equals( el.tabs('option', 'selected'), 0, 'selected option set' );
|
||||
equals( $('li', el).index( $('li.ui-tabs-selected', el) ), 0, 'second tab active');
|
||||
equals( $('div', el).index( $('div.ui-tabs-hide', '#tabs1') ), 1, 'second panel should be hidden' );
|
||||
});
|
||||
|
||||
test('init with hash', function() {
|
||||
expect(5);
|
||||
|
||||
//set a hash in the url
|
||||
location.hash = '#fragment-2';
|
||||
|
||||
//selection of tab with divs ordered differently than list
|
||||
el = $('#tabs1').tabs();
|
||||
|
||||
equals(el.tabs('option', 'selected'), 1, 'second tab should be selected');
|
||||
|
||||
ok(!$('#tabs1 ul li:eq(0)').is('.ui-tabs-selected.ui-state-active'), 'first tab should not be selected nor active');
|
||||
ok($('#tabs1 div:eq(0)').is('.ui-tabs-hide'), 'first div for first tab should be hidden');
|
||||
|
||||
ok($('#tabs1 ul li:eq(1)').is('.ui-tabs-selected.ui-state-active'), 'second tab should be selected and active');
|
||||
ok(!$('#tabs1 div:eq(1)').is('.ui-tabs-hide'), 'second div for second tab should not be hidden');
|
||||
});
|
||||
|
||||
test('init mismatched order with hash', function() {
|
||||
expect(5);
|
||||
|
||||
//set a hash in the url
|
||||
location.hash = '#tabs7-2';
|
||||
|
||||
//selection of tab with divs ordered differently than list
|
||||
el = $('#tabs7').tabs();
|
||||
|
||||
equals(el.tabs('option', 'selected'), 1, 'second tab should be selected');
|
||||
|
||||
ok(!$('#tabs7-list li:eq(0)').is('.ui-tabs-selected.ui-state-active'), 'first tab should not be selected nor active');
|
||||
ok($('#tabs7 div:eq(1)').is('.ui-tabs-hide'), 'second div for first tab should be hidden');
|
||||
|
||||
ok($('#tabs7-list li:eq(1)').is('.ui-tabs-selected.ui-state-active'), 'second tab should be selected and active');
|
||||
ok(!$('#tabs7 div:eq(0)').is('.ui-tabs-hide'), 'first div for second tab should not be hidden');
|
||||
});
|
||||
module( "tabs: methods" );
|
||||
|
||||
test('destroy', function() {
|
||||
expect(6);
|
||||
@ -66,148 +11,151 @@ test('destroy', function() {
|
||||
|
||||
ok( el.is(':not(.ui-tabs, .ui-widget, .ui-widget-content, .ui-corner-all, .ui-tabs-collapsible)'), 'remove classes from container');
|
||||
ok( $('ul', el).is(':not(.ui-tabs-nav, .ui-helper-reset, .ui-helper-clearfix, .ui-widget-header, .ui-corner-all)'), 'remove classes from list' );
|
||||
ok( $('div:eq(1)', el).is(':not(.ui-tabs-panel, .ui-widget-content, .ui-corner-bottom, .ui-tabs-hide)'), 'remove classes to panel' );
|
||||
ok( $('li:eq(0)', el).is(':not(.ui-tabs-selected, .ui-state-active, .ui-corner-top)'), 'remove classes from active li');
|
||||
ok( $('div:eq(1)', el).is(':not(.ui-tabs-panel, .ui-widget-content, .ui-corner-bottom)'), 'remove classes to panel' );
|
||||
ok( $('li:eq(0)', el).is(':not(.ui-tabs-active, .ui-state-active, .ui-corner-top)'), 'remove classes from active li');
|
||||
ok( $('li:eq(1)', el).is(':not(.ui-state-default, .ui-corner-top)'), 'remove classes from inactive li');
|
||||
ok( $('li:eq(2)', el).is(':not(.ui-state-hover, .ui-state-focus)'), 'remove classes from mouseovered or focused li');
|
||||
});
|
||||
|
||||
test('enable', function() {
|
||||
expect(8);
|
||||
test( "enable", function() {
|
||||
expect( 8 );
|
||||
|
||||
el = $('#tabs1').tabs({ disabled: [ 0, 1 ] });
|
||||
el.tabs("enable", 1);
|
||||
ok( $('li:eq(1)', el).is(':not(.ui-state-disabled)'), 'remove class from li');
|
||||
same(el.tabs('option', 'disabled'), [ 0 ], 'update property');
|
||||
var element = $( "#tabs1" ).tabs({ disabled: true });
|
||||
tabs_disabled( element, true );
|
||||
element.tabs( "enable" );
|
||||
tabs_disabled( element, false );
|
||||
element.tabs( "destroy" );
|
||||
|
||||
element.tabs({ disabled: [ 0, 1 ] });
|
||||
tabs_disabled( element, [ 0, 1 ] );
|
||||
element.tabs( "enable" );
|
||||
tabs_disabled( element, false );
|
||||
});
|
||||
|
||||
test( "enable( index )", function() {
|
||||
expect( 10 );
|
||||
|
||||
var element = $( "#tabs1" ).tabs({ disabled: true });
|
||||
tabs_disabled( element, true );
|
||||
// fully disabled -> partially disabled
|
||||
element.tabs( "enable", 1 );
|
||||
tabs_disabled( element, [ 0, 2 ] );
|
||||
// partially disabled -> partially disabled
|
||||
element.tabs( "enable", 2 );
|
||||
tabs_disabled( element, [ 0 ] );
|
||||
// already enabled tab, no change
|
||||
element.tabs( "enable", 2 );
|
||||
tabs_disabled( element, [ 0 ] );
|
||||
// partially disabled -> fully enabled
|
||||
element.tabs( "enable", 0 );
|
||||
tabs_disabled( element, false );
|
||||
});
|
||||
|
||||
test( "disable", function() {
|
||||
expect( 8 );
|
||||
|
||||
var element = $( "#tabs1" ).tabs({ disabled: false });
|
||||
tabs_disabled( element, false );
|
||||
element.tabs( "disable" );
|
||||
tabs_disabled( element, true );
|
||||
element.tabs( "destroy" );
|
||||
|
||||
element.tabs({ disabled: [ 0, 1 ] });
|
||||
tabs_disabled( element, [ 0, 1 ] );
|
||||
element.tabs( "disable" );
|
||||
tabs_disabled( element, true );
|
||||
});
|
||||
|
||||
test( "disable( index )", function() {
|
||||
expect( 10 );
|
||||
|
||||
var element = $( "#tabs1" ).tabs({ disabled: false });
|
||||
tabs_disabled( element, false );
|
||||
// fully enabled -> partially disabled
|
||||
element.tabs( "disable", 1 );
|
||||
tabs_disabled( element, [ 1 ] );
|
||||
// partially disabled -> partially disabled
|
||||
element.tabs( "disable", 2 );
|
||||
tabs_disabled( element, [ 1, 2 ] );
|
||||
// already disabled tab, no change
|
||||
element.tabs( "disable", 2 );
|
||||
tabs_disabled( element, [ 1, 2 ] );
|
||||
// partially disabled -> fully disabled
|
||||
element.tabs( "disable", 0 );
|
||||
tabs_disabled( element, true );
|
||||
});
|
||||
|
||||
test( "refersh", function() {
|
||||
expect( 27 );
|
||||
|
||||
var element = $( "#tabs1" ).tabs();
|
||||
tabs_state( element, 1, 0, 0 );
|
||||
tabs_disabled( element, false );
|
||||
|
||||
// disable tab via markup
|
||||
element.find( ".ui-tabs-nav li" ).eq( 1 ).addClass( "ui-state-disabled" );
|
||||
element.tabs( "refresh" );
|
||||
tabs_state( element, 1, 0, 0 );
|
||||
tabs_disabled( element, [ 1 ] );
|
||||
|
||||
// add remote tab
|
||||
element.find( ".ui-tabs-nav" ).append( "<li id='newTab'><a href='data/test.html'>new</a></li>" );
|
||||
element.tabs( "refresh" );
|
||||
tabs_state( element, 1, 0, 0, 0 );
|
||||
tabs_disabled( element, [ 1 ] );
|
||||
equals( element.find( "#" + $( "#newTab a" ).attr( "aria-controls" ) ).length, 1,
|
||||
"panel added for remote tab" );
|
||||
|
||||
// remove all tabs
|
||||
element.find( ".ui-tabs-nav li, .ui-tabs-panel" ).remove();
|
||||
element.tabs( "refresh" );
|
||||
tabs_state( element );
|
||||
equals( element.tabs( "option", "active" ), false, "no active tab" );
|
||||
|
||||
// add tabs
|
||||
element.find( ".ui-tabs-nav" )
|
||||
.append( "<li class='ui-state-disabled'><a href='#newTab2'>new 2</a></li>" )
|
||||
.append( "<li><a href='#newTab3'>new 3</a></li>" )
|
||||
.append( "<li><a href='#newTab4'>new 4</a></li>" )
|
||||
.append( "<li><a href='#newTab5'>new 5</a></li>" );
|
||||
element
|
||||
.append( "<div id='newTab2'>new 2</div>" )
|
||||
.append( "<div id='newTab3'>new 3</div>" )
|
||||
.append( "<div id='newTab4'>new 4</div>" )
|
||||
.append( "<div id='newTab5'>new 5</div>" );
|
||||
element.tabs( "refresh" );
|
||||
tabs_state( element, 0, 0, 0, 0 );
|
||||
tabs_disabled( element, [ 0 ] );
|
||||
|
||||
// activate third tab
|
||||
element.tabs( "option", "active", 2 );
|
||||
tabs_state( element, 0, 0, 1, 0 );
|
||||
tabs_disabled( element, [ 0 ] );
|
||||
|
||||
// remove fourth tab, third tab should stay active
|
||||
element.find( ".ui-tabs-nav li" ).eq( 3 ).remove();
|
||||
element.find( ".ui-tabs-panel" ).eq( 3 ).remove();
|
||||
element.tabs( "refresh" );
|
||||
tabs_state( element, 0, 0, 1 );
|
||||
tabs_disabled( element, [ 0 ] );
|
||||
|
||||
// remove third (active) tab, second tab should become active
|
||||
element.find( ".ui-tabs-nav li" ).eq( 2 ).remove();
|
||||
element.find( ".ui-tabs-panel" ).eq( 2 ).remove();
|
||||
element.tabs( "refresh" );
|
||||
tabs_state( element, 0, 1 );
|
||||
tabs_disabled( element, [ 0 ] );
|
||||
|
||||
// enable all tabs
|
||||
el.tabs({ disabled: [ 0, 1 ] });
|
||||
el.tabs("enable");
|
||||
ok( !$('li.ui-state-disabled', el).length, 'enable all');
|
||||
same(el.tabs('option', 'disabled'), false, 'update property');
|
||||
|
||||
el.tabs('destroy');
|
||||
// enable all tabs one by one
|
||||
el.tabs({ disabled: [ 1, 2 ] });
|
||||
el.tabs("enable", 1);
|
||||
ok( $('li:eq(1)', el).is(':not(.ui-state-disabled)'), 'remove class from li');
|
||||
same(el.tabs('option', 'disabled'), [ 2 ], 'update property');
|
||||
el.tabs("enable", 2);
|
||||
ok( $('li:eq(2)', el).is(':not(.ui-state-disabled)'), 'remove class from li');
|
||||
same( el.tabs('option', 'disabled'), false, 'set to false');
|
||||
});
|
||||
|
||||
test('disable', function() {
|
||||
expect(12);
|
||||
|
||||
// normal
|
||||
el = $('#tabs1').tabs();
|
||||
el.tabs('disable', 1);
|
||||
ok( $('li:eq(1)', el).is('.ui-state-disabled'), 'add class to li');
|
||||
same(el.tabs('option', 'disabled'), [ 1 ], 'update disabled property');
|
||||
|
||||
// disable selected
|
||||
el.tabs('disable', 0);
|
||||
ok( $('li:eq(0)', el).is('.ui-state-disabled'), 'add class to selected li');
|
||||
same(el.tabs('option', 'disabled'), [ 0, 1 ], 'update disabled property');
|
||||
|
||||
// disable all tabs
|
||||
el.tabs('disable');
|
||||
same( $('li.ui-state-disabled', el).length, 3, 'disable all');
|
||||
same(el.tabs('option', 'disabled'), true, 'set to true');
|
||||
|
||||
el.tabs("destroy");
|
||||
// disable all tabs one by one
|
||||
el.tabs();
|
||||
el.tabs('disable', 0);
|
||||
ok( $('li:eq(0)', el).is('.ui-state-disabled'), 'add class to li');
|
||||
same(el.tabs('option', 'disabled'), [ 0 ], 'update disabled property');
|
||||
el.tabs('disable', 1);
|
||||
ok( $('li:eq(1)', el).is('.ui-state-disabled'), 'add class to li');
|
||||
same(el.tabs('option', 'disabled'), [ 0, 1 ], 'update disabled property');
|
||||
el.tabs('disable', 2);
|
||||
ok( $('li:eq(2)', el).is('.ui-state-disabled'), 'add class to li');
|
||||
same(el.tabs('option', 'disabled'), true, 'set to true');
|
||||
});
|
||||
|
||||
test('add', function() {
|
||||
expect(4);
|
||||
|
||||
el = $('#tabs1').tabs();
|
||||
el.tabs('add', '#new', 'New');
|
||||
|
||||
var added = $('li:last', el).simulate('mouseover');
|
||||
ok(added.is('.ui-state-hover'), 'should add mouseover handler to added tab');
|
||||
added.simulate('mouseout');
|
||||
var other = $('li:first', el).simulate('mouseover');
|
||||
ok(other.is('.ui-state-hover'), 'should not remove mouseover handler from existing tab');
|
||||
other.simulate('mouseout');
|
||||
|
||||
equals($('a', added).attr('href'), '#new', 'should not expand href to full url of current page');
|
||||
|
||||
ok(false, "missing test - untested code is broken code.");
|
||||
});
|
||||
|
||||
test('remove', function() {
|
||||
expect(4);
|
||||
|
||||
el = $('#tabs1').tabs();
|
||||
|
||||
el.tabs('remove', 0);
|
||||
equals(el.tabs('length'), 2, 'remove tab');
|
||||
equals($('li a[href$="fragment-1"]', el).length, 0, 'remove associated list item');
|
||||
equals($('#fragment-1').length, 0, 'remove associated panel');
|
||||
|
||||
// TODO delete tab -> focus tab to right
|
||||
// TODO delete last tab -> focus tab to left
|
||||
|
||||
el.tabs('select', 1);
|
||||
el.tabs('remove', 1);
|
||||
equals(el.tabs('option', 'selected'), 0, 'update selected property');
|
||||
});
|
||||
|
||||
test('select', function() {
|
||||
expect(6);
|
||||
|
||||
el = $('#tabs1').tabs();
|
||||
|
||||
el.tabs('select', 1);
|
||||
equals(el.tabs('option', 'selected'), 1, 'should select tab');
|
||||
|
||||
el.tabs('destroy');
|
||||
el.tabs({ collapsible: true });
|
||||
el.tabs('select', 0);
|
||||
equals(el.tabs('option', 'selected'), -1, 'should collapse tab passing in the already selected tab');
|
||||
|
||||
el.tabs('destroy');
|
||||
el.tabs({ collapsible: true });
|
||||
el.tabs('select', -1);
|
||||
equals(el.tabs('option', 'selected'), -1, 'should collapse tab passing in -1');
|
||||
|
||||
el.tabs('destroy');
|
||||
el.tabs();
|
||||
el.tabs('select', 0);
|
||||
equals(el.tabs('option', 'selected'), 0, 'should not collapse tab if collapsible is not set to true');
|
||||
el.tabs('select', -1);
|
||||
equals(el.tabs('option', 'selected'), 0, 'should not collapse tab if collapsible is not set to true');
|
||||
|
||||
el.tabs('select', '#fragment-2');
|
||||
equals(el.tabs('option', 'selected'), 1, 'should select tab by id');
|
||||
// remove first tab, previously active tab (now first) should stay active
|
||||
element.find( ".ui-tabs-nav li" ).eq( 0 ).remove();
|
||||
element.find( ".ui-tabs-panel" ).eq( 0 ).remove();
|
||||
element.tabs( "refresh" );
|
||||
tabs_state( element, 1 );
|
||||
tabs_disabled( element, false );
|
||||
});
|
||||
|
||||
test('load', function() {
|
||||
ok(false, "missing test - untested code is broken code.");
|
||||
});
|
||||
|
||||
test('url', function() {
|
||||
ok(false, "missing test - untested code is broken code.");
|
||||
});
|
||||
|
||||
test('length', function() {
|
||||
expect(1);
|
||||
|
||||
el = $('#tabs1').tabs();
|
||||
equals(el.tabs('length'), $('ul a', el).length, ' should return length');
|
||||
});
|
||||
|
||||
})(jQuery);
|
||||
}( jQuery ) );
|
||||
|
||||
@ -1,66 +1,134 @@
|
||||
/*
|
||||
* tabs_options.js
|
||||
*/
|
||||
(function($) {
|
||||
(function( $ ) {
|
||||
|
||||
module("tabs: options");
|
||||
module( "tabs: options" );
|
||||
|
||||
test('ajaxOptions', function() {
|
||||
ok(false, "missing test - untested code is broken code.");
|
||||
test( "{ active: default }", function() {
|
||||
expect( 4 );
|
||||
|
||||
var element = $( "#tabs1" ).tabs();
|
||||
equals( element.tabs( "option", "active" ), 0, "should be 0 by default" );
|
||||
tabs_state( element, 1, 0, 0 );
|
||||
element.tabs( "destroy" );
|
||||
|
||||
location.hash = "#fragment-3";
|
||||
element = $( "#tabs1" ).tabs();
|
||||
equals( element.tabs( "option", "active" ), 2, "should be 2 based on URL" );
|
||||
tabs_state( element, 0, 0, 1 );
|
||||
element.tabs( "destroy" );
|
||||
});
|
||||
|
||||
test('cache', function() {
|
||||
ok(false, "missing test - untested code is broken code.");
|
||||
test( "{ active: false }", function() {
|
||||
expect( 7 );
|
||||
|
||||
var element = $( "#tabs1" ).tabs({
|
||||
active: false,
|
||||
collapsible: true
|
||||
});
|
||||
tabs_state( element, 0, 0, 0 );
|
||||
equal( element.find( ".ui-tabs-nav .ui-state-active" ).size(), 0, "no tabs selected" );
|
||||
strictEqual( element.tabs( "option", "active" ), false );
|
||||
|
||||
element.tabs( "option", "collapsible", false );
|
||||
tabs_state( element, 1, 0, 0 );
|
||||
equal( element.tabs( "option", "active" ), 0 );
|
||||
|
||||
element.tabs( "destroy" );
|
||||
element.tabs({
|
||||
active: false
|
||||
});
|
||||
tabs_state( element, 1, 0, 0 );
|
||||
strictEqual( element.tabs( "option", "active" ), 0 );
|
||||
});
|
||||
|
||||
test('collapsible', function() {
|
||||
expect(4);
|
||||
test( "{ active: Number }", function() {
|
||||
expect( 8 );
|
||||
|
||||
el = $('#tabs1');
|
||||
var element = $( "#tabs1" ).tabs({
|
||||
active: 2
|
||||
});
|
||||
equals( element.tabs( "option", "active" ), 2 );
|
||||
tabs_state( element, 0, 0, 1 );
|
||||
|
||||
el.tabs({ collapsible: true });
|
||||
equals(el.tabs('option', 'collapsible'), true, 'option set');
|
||||
ok(el.is('.ui-tabs-collapsible'), 'extra class "ui-tabs-collapsible" attached');
|
||||
el.tabs('select', 0);
|
||||
equals($('div.ui-tabs-hide', '#tabs1').length, 3, 'all panels should be hidden');
|
||||
el.tabs('option', 'collapsible', false);
|
||||
ok(el.is(':not(.ui-tabs-collapsible)'), 'extra class "ui-tabs-collapsible" not attached');
|
||||
element.tabs( "option", "active", 0 );
|
||||
equals( element.tabs( "option", "active" ), 0 );
|
||||
tabs_state( element, 1, 0, 0 );
|
||||
|
||||
element.find( ".ui-tabs-nav a" ).eq( 1 ).click();
|
||||
equals( element.tabs( "option", "active" ), 1 );
|
||||
tabs_state( element, 0, 1, 0 );
|
||||
|
||||
element.tabs( "option", "active", 10 );
|
||||
equals( element.tabs( "option", "active" ), 1 );
|
||||
tabs_state( element, 0, 1, 0 );
|
||||
});
|
||||
|
||||
test('cookie', function() {
|
||||
expect(6);
|
||||
if ( $.uiBackCompat === false ) {
|
||||
test( "{ active: -Number }", function() {
|
||||
var element = $( "#tabs1" ).tabs({
|
||||
active: -1
|
||||
});
|
||||
equals( element.tabs( "option", "active" ), 2 );
|
||||
tabs_state( element, 0, 0, 1 );
|
||||
|
||||
el = $('#tabs1');
|
||||
var cookieName = 'tabs_test', cookieObj = { name: cookieName };
|
||||
$.cookie(cookieName, null); // blank state
|
||||
var cookie = function() {
|
||||
return parseInt($.cookie(cookieName), 10);
|
||||
};
|
||||
element.tabs( "option", "active", -2 );
|
||||
equals( element.tabs( "option", "active" ), 1 );
|
||||
tabs_state( element, 0, 1, 0 );
|
||||
|
||||
el.tabs({ cookie: cookieObj });
|
||||
equals(cookie(), 0, 'initial cookie value');
|
||||
element.tabs( "option", "active", -10 );
|
||||
equals( element.tabs( "option", "active" ), 1 );
|
||||
tabs_state( element, 0, 1, 0 );
|
||||
|
||||
el.tabs('destroy');
|
||||
el.tabs({ selected: 1, cookie: cookieObj });
|
||||
equals(cookie(), 1, 'initial cookie value, from selected property');
|
||||
element.tabs( "option", "active", -3 );
|
||||
equals( element.tabs( "option", "active" ), 0 );
|
||||
tabs_state( element, 1, 0, 0 );
|
||||
});
|
||||
}
|
||||
|
||||
el.tabs('select', 2);
|
||||
equals(cookie(), 2, 'cookie value updated after select');
|
||||
test( "active - mismatched tab/panel order", function() {
|
||||
expect( 3 );
|
||||
|
||||
el.tabs('destroy');
|
||||
$.cookie(cookieName, 1);
|
||||
el.tabs({ cookie: cookieObj });
|
||||
equals(cookie(), 1, 'initial cookie value, from existing cookie');
|
||||
location.hash = "#tabs7-2";
|
||||
var element = $( "#tabs7" ).tabs();
|
||||
equals( element.tabs( "option", "active" ), 1, "should be 1 based on URL" );
|
||||
tabs_state( element, 0, 1 );
|
||||
element.tabs( "option", "active", 0 );
|
||||
tabs_state( element, 1, 0 );
|
||||
});
|
||||
|
||||
el.tabs('destroy');
|
||||
el.tabs({ cookie: cookieObj, collapsible: true });
|
||||
el.tabs('select', 0);
|
||||
equals(cookie(), -1, 'cookie value for all tabs unselected');
|
||||
test( "{ collapsible: false }", function() {
|
||||
expect( 4 );
|
||||
|
||||
el.tabs('destroy');
|
||||
ok($.cookie(cookieName) === null, 'erase cookie after destroy');
|
||||
var element = $( "#tabs1" ).tabs({
|
||||
active: 1
|
||||
});
|
||||
element.tabs( "option", "active", false );
|
||||
equal( element.tabs( "option", "active" ), 1 );
|
||||
tabs_state( element, 0, 1, 0 );
|
||||
|
||||
element.find( ".ui-state-active a" ).eq( 1 ).click();
|
||||
equal( element.tabs( "option", "active" ), 1 );
|
||||
tabs_state( element, 0, 1, 0 );
|
||||
});
|
||||
|
||||
test( "{ collapsible: true }", function() {
|
||||
expect( 6 );
|
||||
|
||||
var element = $( "#tabs1" ).tabs({
|
||||
active: 1,
|
||||
collapsible: true
|
||||
});
|
||||
|
||||
element.tabs( "option", "active", false );
|
||||
equal( element.tabs( "option", "active" ), false );
|
||||
tabs_state( element, 0, 0, 0 );
|
||||
|
||||
element.tabs( "option", "active", 1 );
|
||||
equal( element.tabs( "option", "active" ), 1 );
|
||||
tabs_state( element, 0, 1, 0 );
|
||||
|
||||
element.find( ".ui-state-active a" ).click();
|
||||
equal( element.tabs( "option", "active" ), false );
|
||||
tabs_state( element, 0, 0, 0 );
|
||||
});
|
||||
|
||||
test('disabled', function() {
|
||||
@ -87,50 +155,4 @@ test('fx', function() {
|
||||
ok(false, "missing test - untested code is broken code.");
|
||||
});
|
||||
|
||||
test('idPrefix', function() {
|
||||
ok(false, "missing test - untested code is broken code.");
|
||||
});
|
||||
|
||||
test('panelTemplate', function() {
|
||||
ok(false, "missing test - untested code is broken code.");
|
||||
});
|
||||
|
||||
test('selected', function() {
|
||||
expect(8);
|
||||
|
||||
el = $('#tabs1').tabs();
|
||||
equals(el.tabs('option', 'selected'), 0, 'should be 0 by default');
|
||||
|
||||
el.tabs('destroy');
|
||||
el.tabs({ selected: -1 });
|
||||
equals(el.tabs('option', 'selected'), -1, 'should be -1 for all tabs unselected');
|
||||
equals( $('li.ui-tabs-selected', el).length, 0, 'no tab should be selected' );
|
||||
equals( $('div.ui-tabs-hide', '#tabs1').length, 3, 'all panels should be hidden' );
|
||||
|
||||
el.tabs('destroy');
|
||||
el.tabs({ selected: null });
|
||||
equals(el.tabs('option', 'selected'), -1, 'should be -1 for all tabs unselected with value null (deprecated)');
|
||||
|
||||
el.tabs('destroy');
|
||||
el.tabs({ selected: 1 });
|
||||
equals(el.tabs('option', 'selected'), 1, 'should be specified tab');
|
||||
|
||||
el.tabs('destroy');
|
||||
el.tabs({ selected: 99 });
|
||||
equals(el.tabs('option', 'selected'), 0, 'selected should default to zero if given value is out of index');
|
||||
|
||||
el.tabs('destroy');
|
||||
el.tabs({ collapsible: true });
|
||||
el.tabs('option', 'selected', 0);
|
||||
equals(el.tabs('option', 'selected'), 0, 'should not collapse tab if value is same as selected');
|
||||
});
|
||||
|
||||
test('spinner', function() {
|
||||
ok(false, "missing test - untested code is broken code.");
|
||||
});
|
||||
|
||||
test('tabTemplate', function() {
|
||||
ok(false, "missing test - untested code is broken code.");
|
||||
});
|
||||
|
||||
})(jQuery);
|
||||
|
||||
@ -5,111 +5,33 @@
|
||||
|
||||
module("tabs: tickets");
|
||||
|
||||
test('#2715 - id containing colon', function() {
|
||||
// http://dev.jqueryui.com/ticket/2715
|
||||
expect(4);
|
||||
|
||||
el = $('#tabs2').tabs();
|
||||
ok( $('div.ui-tabs-panel:eq(0)', '#tabs2').is(':visible'), 'first panel should be visible' );
|
||||
ok( $('div.ui-tabs-panel:eq(1)', '#tabs2').is(':hidden'), 'second panel should be hidden' );
|
||||
|
||||
el.tabs('select', 1).tabs('select', 0);
|
||||
ok( $('div.ui-tabs-panel:eq(0)', '#tabs2').is(':visible'), 'first panel should be visible' );
|
||||
ok( $('div.ui-tabs-panel:eq(1)', '#tabs2').is(':hidden'), 'second panel should be hidden' );
|
||||
|
||||
});
|
||||
|
||||
test('#???? - panel containing inline style', function() {
|
||||
expect(3);
|
||||
|
||||
var inlineStyle = function(property) {
|
||||
return $('#inline-style')[0].style[property];
|
||||
};
|
||||
var expected = inlineStyle('height');
|
||||
|
||||
el = $('#tabs2').tabs();
|
||||
equals(inlineStyle('height'), expected, 'init should not remove inline style');
|
||||
|
||||
el.tabs('select', 1);
|
||||
equals(inlineStyle('height'), expected, 'show tab should not remove inline style');
|
||||
|
||||
el.tabs('select', 0);
|
||||
equals(inlineStyle('height'), expected, 'hide tab should not remove inline style');
|
||||
|
||||
});
|
||||
|
||||
test('#3627 - Ajax tab with url containing a fragment identifier fails to load', function() {
|
||||
// http://dev.jqueryui.com/ticket/3627
|
||||
expect(1);
|
||||
|
||||
el = $('#tabs2').tabs();
|
||||
|
||||
ok(/test.html$/.test( $('a:eq(2)', el).data('load.tabs') ), 'should ignore fragment identifier');
|
||||
|
||||
el = $('#tabs2').tabs({
|
||||
active: 2,
|
||||
beforeLoad: function( event, ui ) {
|
||||
event.preventDefault();
|
||||
ok(/test.html$/.test( ui.ajaxSettings.url ), 'should ignore fragment identifier');
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
test('#4033 - IE expands hash to full url and misinterprets tab as ajax', function() {
|
||||
// http://dev.jqueryui.com/ticket/4033
|
||||
expect(1);
|
||||
|
||||
el = $('<div><ul><li><a href="#tab">Tab</a></li></ul><div id="tab"></div></div>')
|
||||
.appendTo('#main').tabs();
|
||||
|
||||
equals($('a', el).data('load.tabs'), undefined, 'should not create ajax tab');
|
||||
|
||||
});
|
||||
|
||||
test('#5069 - ui.tabs.add creates two tab panels when using a full URL', function() {
|
||||
// http://dev.jqueryui.com/ticket/5069
|
||||
expect(2);
|
||||
|
||||
el = $('#tabs2').tabs();
|
||||
equals(el.children('div').length, el.find('> ul > li').length, 'After creation, number of panels should be equal to number of tabs');
|
||||
el.tabs('add', '/ajax_html_echo', 'Test');
|
||||
equals(el.children('div').length, el.find('> ul > li').length, 'After add, number of panels should be equal to number of tabs');
|
||||
|
||||
});
|
||||
|
||||
test('#5893 - Sublist in the tab list are considered as tab', function() {
|
||||
// http://dev.jqueryui.com/ticket/5893
|
||||
expect(1);
|
||||
|
||||
el = $('#tabs6').tabs();
|
||||
equals(el.tabs( "length" ), 2, 'should contain 2 tab');
|
||||
|
||||
});
|
||||
|
||||
asyncTest( "#4581 - title attribute for remote tabs does not support foreign languages", function() {
|
||||
expect( 1 );
|
||||
|
||||
$( "#tabs2" ).tabs({
|
||||
selected: 3,
|
||||
load: function( event, ui ) {
|
||||
equal( ui.panel.id, "∫ßáö_Սե", "proper title" );
|
||||
start();
|
||||
el = $('<div><ul><li><a href="#tab">Tab</a></li></ul><div id="tab"></div></div>');
|
||||
el.appendTo('#main');
|
||||
el.tabs({
|
||||
beforeLoad: function( event, ui ) {
|
||||
event.preventDefault();
|
||||
ok( false, 'should not be an ajax tab');
|
||||
}
|
||||
});
|
||||
|
||||
equals($('a', el).attr('aria-controls'), 'tab', 'aria-contorls attribute is correct');
|
||||
});
|
||||
|
||||
|
||||
test('#6710 - selectors are global', function() {
|
||||
// http://bugs.jqueryui.com/ticket/6710
|
||||
expect(1);
|
||||
|
||||
var container = $('\
|
||||
<div>\
|
||||
<div id="tabs_6710">\
|
||||
<ul>\
|
||||
<li><a href="#tabs-1_6710">Nunc tincidunt</a></li>\
|
||||
<li><a href="#tabs-2_6710">Proin dolor</a></li>\
|
||||
</ul>\
|
||||
<div id="tabs-1_6710"> <p>first</p> </div>\
|
||||
<div id="tabs-2_6710"> <p>second</p>\
|
||||
</div>\
|
||||
</div>');
|
||||
container.find('#tabs_6710').tabs();
|
||||
ok( container.find('#tabs-2_6710').hasClass('ui-tabs-hide'), 'should find panels and add corresponding classes' );
|
||||
});
|
||||
|
||||
|
||||
})(jQuery);
|
||||
|
||||
@ -26,8 +26,6 @@ var privateMethods = [
|
||||
"_createWidget",
|
||||
"destroy",
|
||||
"option",
|
||||
"enable",
|
||||
"disable",
|
||||
"_trigger"
|
||||
];
|
||||
|
||||
|
||||
@ -1,16 +1,15 @@
|
||||
/*
|
||||
* tooltip_defaults.js
|
||||
*/
|
||||
commonWidgetTests( "tooltip", {
|
||||
defaults: {
|
||||
disabled: false,
|
||||
items: "[title]",
|
||||
content: $.ui.tooltip.prototype.options.content,
|
||||
position: {
|
||||
my: "left center",
|
||||
at: "right center",
|
||||
offset: "15 0"
|
||||
},
|
||||
|
||||
var tooltip_defaults = {
|
||||
disabled: false,
|
||||
items: "[title]",
|
||||
content: $.ui.tooltip.prototype.options.content,
|
||||
position: {
|
||||
my: "left center",
|
||||
at: "right center",
|
||||
offset: "15 0"
|
||||
// callbacks
|
||||
create: null
|
||||
}
|
||||
};
|
||||
|
||||
commonWidgetTests('tooltip', { defaults: tooltip_defaults });
|
||||
});
|
||||
|
||||
@ -14,7 +14,6 @@
|
||||
<script src="../testsuite.js"></script>
|
||||
|
||||
<script src="widget_core.js"></script>
|
||||
<script src="widget_tickets.js"></script>
|
||||
|
||||
<script src="../swarminject.js"></script>
|
||||
</head>
|
||||
|
||||
@ -202,6 +202,7 @@ test( "merge multiple option arguments", function() {
|
||||
$.widget( "ui.testWidget", {
|
||||
_create: function() {
|
||||
same( this.options, {
|
||||
create: null,
|
||||
disabled: false,
|
||||
option1: "value1",
|
||||
option2: "value2",
|
||||
@ -249,6 +250,7 @@ test( "._getCreateOptions()", function() {
|
||||
},
|
||||
_create: function() {
|
||||
same( this.options, {
|
||||
create: null,
|
||||
disabled: false,
|
||||
option1: "override1",
|
||||
option2: "value2",
|
||||
@ -288,6 +290,45 @@ test( "re-init", function() {
|
||||
same( actions, [ "optionfoo", "init" ], "correct methods called on re-init with options" );
|
||||
});
|
||||
|
||||
test( "inheritance - options", function() {
|
||||
// #5830 - Widget: Using inheritance overwrites the base classes options
|
||||
$.widget( "ui.testWidgetBase", {
|
||||
options: {
|
||||
obj: {
|
||||
key1: "foo",
|
||||
key2: "bar"
|
||||
},
|
||||
arr: [ "testing" ]
|
||||
}
|
||||
});
|
||||
|
||||
$.widget( "ui.testWidgetExtension", $.ui.testWidgetBase, {
|
||||
options: {
|
||||
obj: {
|
||||
key1: "baz"
|
||||
},
|
||||
arr: [ "alpha", "beta" ]
|
||||
}
|
||||
});
|
||||
|
||||
same( $.ui.testWidgetBase.prototype.options.obj, {
|
||||
key1: "foo",
|
||||
key2: "bar"
|
||||
}, "base class option object not overridden");
|
||||
same( $.ui.testWidgetBase.prototype.options.arr, [ "testing" ],
|
||||
"base class option array not overridden");
|
||||
|
||||
same( $.ui.testWidgetExtension.prototype.options.obj, {
|
||||
key1: "baz",
|
||||
key2: "bar"
|
||||
}, "extension class option object extends base");
|
||||
same( $.ui.testWidgetExtension.prototype.options.arr, [ "alpha", "beta" ],
|
||||
"extension class option array overwrites base");
|
||||
|
||||
delete $.ui.testWidgetBase;
|
||||
delete $.ui.testWidgetExtension;
|
||||
});
|
||||
|
||||
test( "._super()", function() {
|
||||
expect( 9 );
|
||||
var instance;
|
||||
@ -379,6 +420,7 @@ test( ".option() - getter", function() {
|
||||
|
||||
var options = div.testWidget( "option" );
|
||||
same( options, {
|
||||
create: null,
|
||||
disabled: false,
|
||||
foo: "bar",
|
||||
baz: 5,
|
||||
@ -795,6 +837,55 @@ test( "._trigger() - provide event and ui", function() {
|
||||
.testWidget( "testEvent" );
|
||||
});
|
||||
|
||||
test( "._trigger() - array as ui", function() {
|
||||
// #6795 - Widget: handle array arguments to _trigger consistently
|
||||
expect( 4 );
|
||||
|
||||
$.widget( "ui.testWidget", {
|
||||
_create: function() {},
|
||||
testEvent: function() {
|
||||
var ui = {
|
||||
foo: "bar",
|
||||
baz: {
|
||||
qux: 5,
|
||||
quux: 20
|
||||
}
|
||||
};
|
||||
var extra = {
|
||||
bar: 5
|
||||
};
|
||||
this._trigger( "foo", null, [ ui, extra ] );
|
||||
}
|
||||
});
|
||||
$( "#widget" ).bind( "testwidgetfoo", function( event, ui, extra ) {
|
||||
same( ui, {
|
||||
foo: "bar",
|
||||
baz: {
|
||||
qux: 5,
|
||||
quux: 20
|
||||
}
|
||||
}, "event: ui hash passed" );
|
||||
same( extra, {
|
||||
bar: 5
|
||||
}, "event: extra argument passed" );
|
||||
});
|
||||
$( "#widget" ).testWidget({
|
||||
foo: function( event, ui, extra ) {
|
||||
same( ui, {
|
||||
foo: "bar",
|
||||
baz: {
|
||||
qux: 5,
|
||||
quux: 20
|
||||
}
|
||||
}, "callback: ui hash passed" );
|
||||
same( extra, {
|
||||
bar: 5
|
||||
}, "callback: extra argument passed" );
|
||||
}
|
||||
})
|
||||
.testWidget( "testEvent" );
|
||||
});
|
||||
|
||||
test( "._trigger() - instance as element", function() {
|
||||
expect( 4 );
|
||||
$.widget( "ui.testWidget", {
|
||||
|
||||
@ -1,91 +0,0 @@
|
||||
(function( $ ) {
|
||||
|
||||
module( "widget: tickets" );
|
||||
|
||||
test( "#5830 - Widget: Using inheritance overwrites the base classes options", function() {
|
||||
$.widget( "ui.testWidgetBase", {
|
||||
options: {
|
||||
obj: {
|
||||
key1: "foo",
|
||||
key2: "bar"
|
||||
},
|
||||
arr: [ "testing" ]
|
||||
}
|
||||
});
|
||||
|
||||
$.widget( "ui.testWidgetExtension", $.ui.testWidgetBase, {
|
||||
options: {
|
||||
obj: {
|
||||
key1: "baz"
|
||||
},
|
||||
arr: [ "alpha", "beta" ]
|
||||
}
|
||||
});
|
||||
|
||||
same( $.ui.testWidgetBase.prototype.options.obj, {
|
||||
key1: "foo",
|
||||
key2: "bar"
|
||||
}, "base class option object not overridden");
|
||||
same( $.ui.testWidgetBase.prototype.options.arr, [ "testing" ],
|
||||
"base class option array not overridden");
|
||||
|
||||
same( $.ui.testWidgetExtension.prototype.options.obj, {
|
||||
key1: "baz",
|
||||
key2: "bar"
|
||||
}, "extension class option object extends base");
|
||||
same( $.ui.testWidgetExtension.prototype.options.arr, [ "alpha", "beta" ],
|
||||
"extension class option array overwrites base");
|
||||
|
||||
delete $.ui.testWidgetBase;
|
||||
delete $.ui.testWidgetExtension;
|
||||
});
|
||||
|
||||
test( "#6795 - Widget: handle array arguments to _trigger consistently", function() {
|
||||
expect( 4 );
|
||||
|
||||
$.widget( "ui.testWidget", {
|
||||
_create: function() {},
|
||||
testEvent: function() {
|
||||
var ui = {
|
||||
foo: "bar",
|
||||
baz: {
|
||||
qux: 5,
|
||||
quux: 20
|
||||
}
|
||||
};
|
||||
var extra = {
|
||||
bar: 5
|
||||
};
|
||||
this._trigger( "foo", null, [ ui, extra ] );
|
||||
}
|
||||
});
|
||||
$( "#widget" ).bind( "testwidgetfoo", function( event, ui, extra ) {
|
||||
same( ui, {
|
||||
foo: "bar",
|
||||
baz: {
|
||||
qux: 5,
|
||||
quux: 20
|
||||
}
|
||||
}, "event: ui hash passed" );
|
||||
same( extra, {
|
||||
bar: 5
|
||||
}, "event: extra argument passed" );
|
||||
});
|
||||
$( "#widget" ).testWidget({
|
||||
foo: function( event, ui, extra ) {
|
||||
same( ui, {
|
||||
foo: "bar",
|
||||
baz: {
|
||||
qux: 5,
|
||||
quux: 20
|
||||
}
|
||||
}, "callback: ui hash passed" );
|
||||
same( extra, {
|
||||
bar: 5
|
||||
}, "callback: extra argument passed" );
|
||||
}
|
||||
})
|
||||
.testWidget( "testEvent" );
|
||||
});
|
||||
|
||||
}( jQuery ) );
|
||||
@ -1,32 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<title>Dialog Visual Test : Default</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.5.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.mouse.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">
|
||||
$(function() {
|
||||
$("#dialog").dialog();
|
||||
});
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div id="dialog" title="Dialog Title">
|
||||
<p>
|
||||
Dialog Content
|
||||
</p>
|
||||
</div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
@ -1,29 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<title>Dialog Visual Test : Dialog on page with scrollbars</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.5.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">
|
||||
$(function() {
|
||||
$("#dialog").dialog();
|
||||
});
|
||||
</script>
|
||||
</head>
|
||||
<body style="height:2000px;">
|
||||
|
||||
<div id="dialog" title="Dialog Title">
|
||||
<p> Dialog Content </p>
|
||||
</div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
@ -1,36 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<title>Dialog Visual Test : Dialog option buttons OK Cancel</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.5.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">
|
||||
$(function() {
|
||||
$("#dialog").dialog({
|
||||
buttons: {
|
||||
"OK": function() { $(this).dialog('close'); },
|
||||
"Cancel": function() { $(this).dialog('close'); }
|
||||
}
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div id="dialog" title="Dialog Title">
|
||||
<p>
|
||||
Dialog Content
|
||||
</p>
|
||||
</div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
@ -1,31 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<title>Dialog Visual Test : Dialog option closeOnEscape true</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.5.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">
|
||||
$(function() {
|
||||
$("#dialog").dialog({
|
||||
closeOnEscape: false
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div id="dialog" title="Dialog Title">
|
||||
<p> Dialog Content </p>
|
||||
</div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
@ -1,31 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<title>Dialog Visual Test : Dialog option closeOnEscape true</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.5.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">
|
||||
$(function() {
|
||||
$("#dialog").dialog({
|
||||
closeOnEscape: true
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div id="dialog" title="Dialog Title">
|
||||
<p> Dialog Content </p>
|
||||
</div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
@ -1,31 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<title>Dialog Visual Test : Dialog option modal false</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.5.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">
|
||||
$(function() {
|
||||
$("#dialog").dialog({
|
||||
modal: false
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<input />
|
||||
<div id="dialog" title="Dialog Title">
|
||||
<p> Dialog Content </p>
|
||||
</div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
@ -1,31 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<title>Dialog Visual Test : Dialog option modal true</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.5.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">
|
||||
$(function() {
|
||||
$("#dialog").dialog({
|
||||
modal: true
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<input />
|
||||
<div id="dialog" title="Dialog Title">
|
||||
<p> Dialog Content </p>
|
||||
</div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
@ -1,33 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<title>Dialog Visual Test : Dialog option position right top</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.5.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">
|
||||
$(function() {
|
||||
|
||||
$("#dialog").dialog({
|
||||
position: ['right', 'top']
|
||||
});
|
||||
|
||||
});
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div id="dialog" title="Dialog Title">
|
||||
<p> Dialog Content </p>
|
||||
</div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
@ -1,44 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<title>Dialog Visual Test : Dialog ticket #4350</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.5.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.mouse.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">
|
||||
$(function() {
|
||||
$("#dialog").dialog({
|
||||
height: 200
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<h1 class="ui-widget-header"><a href="http://dev.jqueryui.com/ticket/4350">#4350 - Dialog: No Scrollbars in IE in Quirksmode</a></h1>
|
||||
|
||||
<input />
|
||||
<div id="dialog" title="Dialog Title">
|
||||
foo<p/>
|
||||
foo<p/>
|
||||
foo<p/>
|
||||
foo<p/>
|
||||
foo<p/>
|
||||
foo<p/>
|
||||
foo<p/>
|
||||
foo<p/>
|
||||
foo<p/>
|
||||
foo<p/>
|
||||
</div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
@ -1,44 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<title>Dialog Visual Test : Dialog ticket #4826</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.5.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">
|
||||
$(function() {
|
||||
|
||||
$('#dialog').dialog({ resizable: false });
|
||||
|
||||
$('#handle').click(function() {
|
||||
$('#dialog')
|
||||
.dialog('option', {
|
||||
resizable: false
|
||||
})
|
||||
.dialog('open');
|
||||
|
||||
return false;
|
||||
});
|
||||
|
||||
});
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<h1 class="ui-widget-header"><a href="http://dev.jqueryui.com/ticket/4826">#4826 - Setting resizable false toggles resizable on dialog</a></h1>
|
||||
|
||||
<button id="handle">Click me!</button>
|
||||
<div id="dialog" title="Dialog Title">
|
||||
<p id="msg">I should <strong>NEVER</strong> be resizable!</p>
|
||||
</div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
@ -1,62 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<title>jQuery UI Visual Tests</title>
|
||||
<link rel="stylesheet" href="../../themes/base/jquery.ui.all.css" type="text/css" />
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
<h1>jQuery UI Visual Tests</h1>
|
||||
|
||||
<h2>Composites</h2>
|
||||
<ul>
|
||||
<li><a href="all.html">All Widgets</a></li>
|
||||
<li><a href="theme.html">All Widgets with Themes</a></li>
|
||||
<li><a href="effects.all.html">Effects</a></li>
|
||||
<li><a href="compound/accordion_tabs.html">Tabs contain Accordion</a></li>
|
||||
<li><a href="compound/datepicker_dialog.html">Datepicker within a Dialog</a></li>
|
||||
<li><a href="compound/draggable_accordion_accordion_tabs_draggable.html">Draggable contains Tabs, contain Accordion, contain Draggables</a></li>
|
||||
<li><a href="compound/draggable_accordion.html">Draggable Accordion</a></li>
|
||||
<li><a href="compound/sortable_accordion_sortable_tabs.html">Accordion within Tabs, both Sortable</a></li>
|
||||
<li><a href="compound/tabs_tabs.html">Tabs contains Tabs</a></li>
|
||||
<li><a href="compound/tabs_tooltips.html">Tabs with Tooltips</a></li>
|
||||
<li><a href="compound/widgets_in_dialog.html">All Widgets within a Dialog</a></li>
|
||||
</ul>
|
||||
|
||||
|
||||
<h2>Interactions</h2>
|
||||
<ul>
|
||||
<li><a href="draggable/draggable.html">Draggable</a></li>
|
||||
<li><a href="droppable/droppable.html">Droppable</a></li>
|
||||
<li><a href="resizable/resizable.html">Resizable</a></li>
|
||||
<li><a href="selectable/selectable.html">Selectable</a></li>
|
||||
<li><a href="sortable/sortable.html">Sortable</a></li>
|
||||
</ul>
|
||||
|
||||
<h2>Widgets</h2>
|
||||
<ul>
|
||||
<li><a href="accordion/accordion.html">Accordion</a></li>
|
||||
<li><a href="autocomplete/autocomplete.html">Autocomplete</a></li>
|
||||
<li><a href="button/button.html">Button</a></li>
|
||||
<li><a href="datepicker/datepicker.html">Datepicker</a></li>
|
||||
<li><a href="dialog/dialog.html">Dialog</a></li>
|
||||
<li>
|
||||
<a href="menu/menu.html">Menu</a>
|
||||
<ul>
|
||||
<li><a href="menu/contextmenu.html">Context Menu</a></li>
|
||||
<li><a href="menu/flyoutmenu.html">Flyout Menu</a></li>
|
||||
<li><a href="menu/menubar.html">Menubar</a></li>
|
||||
<li><a href="menu/drilldown.html">Drilldown Menu</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li><a href="progressbar/progressbar.html">Progressbar</a></li>
|
||||
<li><a href="slider/slider.html">Slider</a></li>
|
||||
<li><a href="spinner/spinner.html">Spinner</a></li>
|
||||
<li><a href="tabs/tabs.html">Tabs</a></li>
|
||||
<li><a href="tooltip/tooltip.html">Tooltip</a></li>
|
||||
</ul>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
@ -25,7 +25,7 @@
|
||||
});
|
||||
}
|
||||
|
||||
var menus = $("#menu1, #menu2, #menu3");
|
||||
var menus = $("#menu1, #menu2, #menu3, #menu4");
|
||||
create();
|
||||
|
||||
$("#toggle-destroy").toggle(function() {
|
||||
@ -41,7 +41,7 @@
|
||||
<style>
|
||||
body { font-size:62.5%; }
|
||||
.ui-menu { width: 200px; margin-bottom: 2em; }
|
||||
#menu3 { height: 200px; overflow: auto; }
|
||||
#menu4 { height: 200px; overflow: auto; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
@ -56,7 +56,7 @@
|
||||
<li><a href="#">Salzburg</a></li>
|
||||
</ul>
|
||||
|
||||
<ul id="menu1">
|
||||
<ul id="menu2">
|
||||
<li><a href="#">Aberdeen</a></li>
|
||||
<li><a href="#">Ada</a></li>
|
||||
<li><a href="#">Adamsville</a></li>
|
||||
@ -95,6 +95,44 @@
|
||||
</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><a href="#">Adamsville</a></li>
|
||||
<li><a href="#"><span class="ui-icon ui-icon-wrench"></span>Addyston</a></li>
|
||||
<li>
|
||||
<a href="#">Delphi</a>
|
||||
<ul>
|
||||
<li><a href="#">Ada</a></li>
|
||||
<li><a href="#"><span class="ui-icon ui-icon-wrench"></span>Saarland</a></li>
|
||||
<li><a href="#">Salzburg</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li><a href="#">Saarland</a></li>
|
||||
<li>
|
||||
<a href="#"><span class="ui-icon ui-icon-print"></span>Salzburg</a>
|
||||
<ul>
|
||||
<li>
|
||||
<a href="#"><span class="ui-icon ui-icon-wrench"></span>Delphi</a>
|
||||
<ul>
|
||||
<li><a href="#">Ada</a></li>
|
||||
<li><a href="#">Saarland</a></li>
|
||||
<li><a href="#">Salzburg</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#">Delphi</a>
|
||||
<ul>
|
||||
<li><a href="#"><span class="ui-icon ui-icon-wrench"></span>Ada</a></li>
|
||||
<li><a href="#"><span class="ui-icon ui-icon-wrench"></span>Saarland</a></li>
|
||||
<li><a href="#"><span class="ui-icon ui-icon-wrench"></span>Salzburg</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li><a href="#">Perch</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<ul id="menu4">
|
||||
<li><a href="#">Aberdeen</a></li>
|
||||
<li><a href="#">Ada</a></li>
|
||||
<li><a href="#">Adamsville</a></li>
|
||||
|
||||
@ -55,6 +55,16 @@
|
||||
.ui-menubar .ui-button { float: left; font-weight: normal; border-top-width: 0 !important; border-bottom-width: 0 !important; margin: 0; outline: none; }
|
||||
.ui-menubar .ui-menubar-link { border-right: 1px dashed transparent; border-left: 1px dashed transparent; }
|
||||
|
||||
.ui-menubar {
|
||||
list-style: none;
|
||||
margin: 0;
|
||||
padding-left: 0;
|
||||
}
|
||||
|
||||
.ui-menubar-item {
|
||||
float: left;
|
||||
}
|
||||
|
||||
table {
|
||||
border-collapse: collapse;
|
||||
}
|
||||
@ -66,85 +76,97 @@
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div id="bar1" class="menubar">
|
||||
<a href="#">File</a>
|
||||
<ul>
|
||||
<li><a href="#">Open...</a></li>
|
||||
<li class="ui-state-disabled">Open recent...</li>
|
||||
<li><a href="#">Save</a></li>
|
||||
<li><a href="#">Save as...</a></li>
|
||||
<li><a href="#">Close</a></li>
|
||||
<li><a href="#">Quit</a></li>
|
||||
</ul>
|
||||
<a href="#">Edit</a>
|
||||
<ul>
|
||||
<li><a href="#">Copy</a></li>
|
||||
<li><a href="#">Cut</a></li>
|
||||
<li class="ui-state-disabled">Paste</li>
|
||||
</ul>
|
||||
<a href="#">View</a>
|
||||
<ul>
|
||||
<li><a href="#">Fullscreen</a></li>
|
||||
<li><a href="#">Fit into view</a></li>
|
||||
<li>
|
||||
<a href="#">Encoding</a>
|
||||
<ul>
|
||||
<li><a href="#">Auto-detect</a></li>
|
||||
<li><a href="#">UTF-8</a></li>
|
||||
<li>
|
||||
<a href="#">UTF-16</a>
|
||||
<ul>
|
||||
<li><a href="#">Option 1</a></li>
|
||||
<li><a href="#">Option 2</a></li>
|
||||
<li><a href="#">Option 3</a></li>
|
||||
<li><a href="#">Option 4</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li><a href="#">Customize...</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<ul id="bar1" class="menubar">
|
||||
<li>
|
||||
<a href="#">File</a>
|
||||
<ul>
|
||||
<li><a href="#">Open...</a></li>
|
||||
<li class="ui-state-disabled">Open recent...</li>
|
||||
<li><a href="#">Save</a></li>
|
||||
<li><a href="#">Save as...</a></li>
|
||||
<li><a href="#">Close</a></li>
|
||||
<li><a href="#">Quit</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#">Edit</a>
|
||||
<ul>
|
||||
<li><a href="#">Copy</a></li>
|
||||
<li><a href="#">Cut</a></li>
|
||||
<li class="ui-state-disabled">Paste</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#">View</a>
|
||||
<ul>
|
||||
<li><a href="#">Fullscreen</a></li>
|
||||
<li><a href="#">Fit into view</a></li>
|
||||
<li>
|
||||
<a href="#">Encoding</a>
|
||||
<ul>
|
||||
<li><a href="#">Auto-detect</a></li>
|
||||
<li><a href="#">UTF-8</a></li>
|
||||
<li>
|
||||
<a href="#">UTF-16</a>
|
||||
<ul>
|
||||
<li><a href="#">Option 1</a></li>
|
||||
<li><a href="#">Option 2</a></li>
|
||||
<li><a href="#">Option 3</a></li>
|
||||
<li><a href="#">Option 4</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li><a href="#">Customize...</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<div id="bar2" class="menubar-icons">
|
||||
<a href="#">File</a>
|
||||
<ul>
|
||||
<li><a href="#">Open...</a></li>
|
||||
<li class="ui-state-disabled">Open recent...</li>
|
||||
<li><a href="#">Save</a></li>
|
||||
<li><a href="#">Save as...</a></li>
|
||||
<li><a href="#">Close</a></li>
|
||||
<li><a href="#">Quit</a></li>
|
||||
</ul>
|
||||
<a href="#">Edit</a>
|
||||
<ul>
|
||||
<li><a href="#">Copy</a></li>
|
||||
<li><a href="#">Cut</a></li>
|
||||
<li class="ui-state-disabled">Paste</li>
|
||||
</ul>
|
||||
<a href="#">View</a>
|
||||
<ul>
|
||||
<li><a href="#">Fullscreen</a></li>
|
||||
<li><a href="#">Fit into view</a></li>
|
||||
<li>
|
||||
<a href="#">Encoding</a>
|
||||
<ul>
|
||||
<li><a href="#">Auto-detect</a></li>
|
||||
<li><a href="#">UTF-8</a></li>
|
||||
<li>
|
||||
<a href="#">UTF-16</a>
|
||||
<ul>
|
||||
<li><a href="#">Option 1</a></li>
|
||||
<li><a href="#">Option 2</a></li>
|
||||
<li><a href="#">Option 3</a></li>
|
||||
<li><a href="#">Option 4</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li><a href="#">Customize...</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<ul id="bar2" class="menubar-icons">
|
||||
<li>
|
||||
<a href="#">File</a>
|
||||
<ul>
|
||||
<li><a href="#">Open...</a></li>
|
||||
<li class="ui-state-disabled">Open recent...</li>
|
||||
<li><a href="#">Save</a></li>
|
||||
<li><a href="#">Save as...</a></li>
|
||||
<li><a href="#">Close</a></li>
|
||||
<li><a href="#">Quit</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#">Edit</a>
|
||||
<ul>
|
||||
<li><a href="#">Copy</a></li>
|
||||
<li><a href="#">Cut</a></li>
|
||||
<li class="ui-state-disabled">Paste</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#">View</a>
|
||||
<ul>
|
||||
<li><a href="#">Fullscreen</a></li>
|
||||
<li><a href="#">Fit into view</a></li>
|
||||
<li>
|
||||
<a href="#">Encoding</a>
|
||||
<ul>
|
||||
<li><a href="#">Auto-detect</a></li>
|
||||
<li><a href="#">UTF-8</a></li>
|
||||
<li>
|
||||
<a href="#">UTF-16</a>
|
||||
<ul>
|
||||
<li><a href="#">Option 1</a></li>
|
||||
<li><a href="#">Option 2</a></li>
|
||||
<li><a href="#">Option 3</a></li>
|
||||
<li><a href="#">Option 4</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li><a href="#">Customize...</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<table id="movies" class="ui-widget">
|
||||
<thead>
|
||||
@ -161,24 +183,26 @@
|
||||
<td class="ui-widget-content">1993</td>
|
||||
<td class="ui-widget-content">3.6</td>
|
||||
<td class="ui-widget-content">
|
||||
<div class="menubar">
|
||||
<a href="#">Options</a>
|
||||
<ul>
|
||||
<li><a href="#">Order...</a></li>
|
||||
<li class="ui-state-disabled">Write a Review...</li>
|
||||
<li><a href="#">Find Similar Movies...</a></li>
|
||||
<li>
|
||||
<a href="#">Rate</a>
|
||||
<ul>
|
||||
<li><a href="#">5 stars</a></li>
|
||||
<li><a href="#">4 stars</a></li>
|
||||
<li><a href="#">3 stars</a></li>
|
||||
<li><a href="#">2 stars</a></li>
|
||||
<li><a href="#">1 stars</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<ul class="menubar">
|
||||
<li>
|
||||
<a href="#">Options</a>
|
||||
<ul>
|
||||
<li><a href="#">Order...</a></li>
|
||||
<li class="ui-state-disabled">Write a Review...</li>
|
||||
<li><a href="#">Find Similar Movies...</a></li>
|
||||
<li>
|
||||
<a href="#">Rate</a>
|
||||
<ul>
|
||||
<li><a href="#">5 stars</a></li>
|
||||
<li><a href="#">4 stars</a></li>
|
||||
<li><a href="#">3 stars</a></li>
|
||||
<li><a href="#">2 stars</a></li>
|
||||
<li><a href="#">1 stars</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
|
||||
@ -13,24 +13,31 @@ $.widget("ui.menubar", {
|
||||
},
|
||||
_create: function() {
|
||||
var self = this;
|
||||
var items = this.items = this.element.children("button, a");
|
||||
var items = this.items = this.element.children("li")
|
||||
.addClass("ui-menubar-item")
|
||||
.attr("role", "presentation")
|
||||
.children("button, a");
|
||||
items.slice(1).attr("tabIndex", -1);
|
||||
var o = this.options;
|
||||
|
||||
this.element.addClass('ui-menubar ui-widget-header ui-helper-clearfix');
|
||||
this.element.addClass('ui-menubar ui-widget-header ui-helper-clearfix').attr("role", "menubar");
|
||||
this._focusable(items);
|
||||
this._hoverable(items);
|
||||
items.next("ul").each(function(i, elm) {
|
||||
$(elm).menu({
|
||||
select: function(event, ui) {
|
||||
ui.item.parents("ul:last").hide()
|
||||
self.options.select.apply(this, arguments);
|
||||
ui.item.parents("ul.ui-menu:last").hide();
|
||||
self._trigger( "select", event, ui );
|
||||
self._close();
|
||||
$(event.target).prev().focus();
|
||||
}
|
||||
}).hide().keydown(function(event) {
|
||||
}).hide()
|
||||
.attr("aria-hidden", "true")
|
||||
.attr("aria-expanded", "false")
|
||||
.keydown(function(event) {
|
||||
var menu = $(this);
|
||||
if (menu.is(":hidden"))
|
||||
return;
|
||||
event.stopPropagation();
|
||||
switch (event.keyCode) {
|
||||
case $.ui.keyCode.LEFT:
|
||||
self._left(event);
|
||||
@ -41,9 +48,7 @@ $.widget("ui.menubar", {
|
||||
event.preventDefault();
|
||||
break;
|
||||
};
|
||||
}).blur(function( event ) {
|
||||
self._close( event );
|
||||
});
|
||||
})
|
||||
});
|
||||
items.each(function() {
|
||||
var input = $(this),
|
||||
@ -55,12 +60,11 @@ $.widget("ui.menubar", {
|
||||
return;
|
||||
}
|
||||
event.preventDefault();
|
||||
event.stopPropagation();
|
||||
if (event.type == "click" && menu.is(":visible") && self.active && self.active[0] == menu[0]) {
|
||||
self._close();
|
||||
return;
|
||||
}
|
||||
if (self.open || event.type == "click") {
|
||||
if ((self.open && event.type == "mouseenter") || event.type == "click") {
|
||||
self._open(event, menu);
|
||||
}
|
||||
})
|
||||
@ -83,6 +87,8 @@ $.widget("ui.menubar", {
|
||||
}
|
||||
})
|
||||
.addClass("ui-button ui-widget ui-button-text-only ui-menubar-link")
|
||||
.attr("role", "menuitem")
|
||||
.attr("aria-haspopup", "true")
|
||||
.wrapInner("<span class='ui-button-text'></span>");
|
||||
|
||||
if (o.menuIcon) {
|
||||
@ -95,35 +101,66 @@ $.widget("ui.menubar", {
|
||||
};
|
||||
|
||||
});
|
||||
self._bind(document, {
|
||||
click: function(event) {
|
||||
if (self.open && !$(event.target).closest(".ui-menubar").length) {
|
||||
self._close();
|
||||
}
|
||||
}
|
||||
})
|
||||
self._bind({
|
||||
keyup: function(event) {
|
||||
if (event.keyCode == $.ui.keyCode.ESCAPE && self.open) {
|
||||
if (self.active.menu("left", event) !== true) {
|
||||
keydown: function(event) {
|
||||
if (event.keyCode == $.ui.keyCode.ESCAPE) {
|
||||
if (self.active && self.active.menu("left", event) !== true) {
|
||||
var active = self.active;
|
||||
self.active.blur();
|
||||
self._close( event );
|
||||
active.prev().focus();
|
||||
}
|
||||
}
|
||||
},
|
||||
focusout : function( event ) {
|
||||
self.closeTimer = setTimeout(function() {
|
||||
self._close( event );
|
||||
}, 100);
|
||||
},
|
||||
focusin :function( event ) {
|
||||
clearTimeout(self.closeTimer);
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
_destroy : function() {
|
||||
var items = this.element.children("li")
|
||||
.removeClass("ui-menubar-item")
|
||||
.removeAttr("role", "presentation")
|
||||
.children("button, a");
|
||||
|
||||
this.element.removeClass('ui-menubar ui-widget-header ui-helper-clearfix').removeAttr("role", "menubar").unbind(".menubar");;
|
||||
items.unbind("focusin focusout click focus mouseenter keydown");
|
||||
|
||||
items
|
||||
.removeClass("ui-button ui-widget ui-button-text-only ui-menubar-link ui-state-default")
|
||||
.removeAttr("role", "menuitem")
|
||||
.removeAttr("aria-haspopup", "true")
|
||||
.children("span.ui-button-text").each(function(i, e) {
|
||||
var item = $(this);
|
||||
item.parent().html(item.html());
|
||||
})
|
||||
.end()
|
||||
.children(".ui-icon").remove();
|
||||
|
||||
$(document).unbind(".menubar");
|
||||
|
||||
this.element.find(":ui-menu").menu("destroy")
|
||||
.show()
|
||||
.removeAttr("aria-hidden", "true")
|
||||
.removeAttr("aria-expanded", "false")
|
||||
.removeAttr("tabindex")
|
||||
.unbind("keydown", "blur")
|
||||
;
|
||||
},
|
||||
|
||||
_close: function() {
|
||||
this.active.menu("closeAll").hide();
|
||||
if (!this.active || !this.active.length)
|
||||
return;
|
||||
this.active.menu("closeAll").hide().attr("aria-hidden", "true").attr("aria-expanded", "false");
|
||||
this.active.prev().removeClass("ui-state-active").removeAttr("tabIndex");
|
||||
this.active = null;
|
||||
var self = this;
|
||||
// delay for the next focus event to see it as still "open"
|
||||
self.timer = setTimeout(function() {
|
||||
self.open = false;
|
||||
}, 13);
|
||||
this.open = false;
|
||||
},
|
||||
|
||||
_open: function(event, menu) {
|
||||
@ -133,55 +170,63 @@ $.widget("ui.menubar", {
|
||||
}
|
||||
// almost the same as _close above, but don't remove tabIndex
|
||||
if (this.active) {
|
||||
this.active.menu("closeAll").hide();
|
||||
this.active.menu("closeAll").hide().attr("aria-hidden", "true").attr("aria-expanded", "false");
|
||||
this.active.prev().removeClass("ui-state-active");
|
||||
}
|
||||
clearTimeout(this.timer);
|
||||
this.open = true;
|
||||
// set tabIndex -1 to have the button skipped on shift-tab when menu is open (it gets focus)
|
||||
var button = menu.prev().addClass("ui-state-active").attr("tabIndex", -1);
|
||||
this.active = menu.show().position({
|
||||
my: "left top",
|
||||
at: "left bottom",
|
||||
of: button
|
||||
}).focus();
|
||||
})
|
||||
.removeAttr("aria-hidden").attr("aria-expanded", "true")
|
||||
.menu("focus", event, menu.children("li").first())
|
||||
.focus()
|
||||
.focusin()
|
||||
;
|
||||
this.open = true;
|
||||
},
|
||||
|
||||
_prev: function( event, button ) {
|
||||
button.attr("tabIndex", -1);
|
||||
var prev = button.prevAll( ".ui-button" ).eq( 0 );
|
||||
var prev = button.parent().prevAll("li").children( ".ui-button" ).eq( 0 );
|
||||
if (prev.length) {
|
||||
prev.removeAttr("tabIndex")[0].focus();
|
||||
} else {
|
||||
this.element.children(".ui-button:last").removeAttr("tabIndex")[0].focus();
|
||||
var lastItem = this.element.children("li:last").children(".ui-button:last");
|
||||
lastItem.removeAttr("tabIndex")[0].focus();
|
||||
}
|
||||
},
|
||||
|
||||
_next: function( event, button ) {
|
||||
button.attr("tabIndex", -1);
|
||||
var next = button.nextAll( ".ui-button" ).eq( 0 );
|
||||
var next = button.parent().nextAll("li").children( ".ui-button" ).eq( 0 );
|
||||
if (next.length) {
|
||||
next.removeAttr("tabIndex")[0].focus();
|
||||
} else {
|
||||
this.element.children(".ui-button:first").removeAttr("tabIndex")[0].focus();
|
||||
var firstItem = this.element.children("li:first").children(".ui-button:first");
|
||||
firstItem.removeAttr("tabIndex")[0].focus();
|
||||
}
|
||||
},
|
||||
|
||||
_left: function(event) {
|
||||
var prev = this.active.prevAll( ".ui-menu" ).eq( 0 );
|
||||
var prev = this.active.parent().prevAll("li:eq(0)").children( ".ui-menu" ).eq( 0 );
|
||||
if (prev.length) {
|
||||
this._open(event, prev);
|
||||
} else {
|
||||
this._open(event, this.element.children(".ui-menu:last"));
|
||||
var lastItem = this.element.children("li:last").children(".ui-menu:first");
|
||||
this._open(event, lastItem);
|
||||
}
|
||||
},
|
||||
|
||||
_right: function(event) {
|
||||
var next = this.active.nextAll( ".ui-menu" ).eq( 0 );
|
||||
var next = this.active.parent().nextAll("li:eq(0)").children( ".ui-menu" ).eq( 0 );
|
||||
if (next.length) {
|
||||
this._open(event, next);
|
||||
} else {
|
||||
this._open(event, this.element.children(".ui-menu:first"));
|
||||
var firstItem = this.element.children("li:first").children(".ui-menu:first");
|
||||
this._open(event, firstItem);
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
159
tests/visual/menu/popup.html
Normal file
159
tests/visual/menu/popup.html
Normal file
@ -0,0 +1,159 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>Visual Test for Popup Utility</title>
|
||||
<link rel="stylesheet" href="../visual.css" type="text/css" />
|
||||
<link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css" title="ui-theme" />
|
||||
<script type="text/javascript" src="../../../jquery-1.5.1.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.position.js"></script>
|
||||
<script type="text/javascript" src="../../../ui/jquery.ui.button.js"></script>
|
||||
<script type="text/javascript" src="../../../ui/jquery.ui.menu.js"></script>
|
||||
<script type="text/javascript" src="popup.js"></script>
|
||||
<!--
|
||||
<script type="text/javascript" src="http://jqueryui.com/themeroller/themeswitchertool/"></script>
|
||||
-->
|
||||
<script type="text/javascript">
|
||||
$(function() {
|
||||
$.fn.themeswitcher && $('<div/>').css({
|
||||
position: "absolute",
|
||||
right: 10,
|
||||
top: 10
|
||||
}).appendTo(document.body).themeswitcher();
|
||||
|
||||
var selected = {
|
||||
select: function( event, ui ) {
|
||||
$( "<div/>" ).text( "Selected: " + ui.item.text() ).appendTo( "#log" );
|
||||
$(this).hide();
|
||||
}
|
||||
};
|
||||
|
||||
$("#button1").button();
|
||||
$("#menu1").menu(selected).popup();
|
||||
|
||||
$( "#rerun" )
|
||||
.button()
|
||||
.click(function() {
|
||||
alert( "Running the last action" );
|
||||
})
|
||||
.next()
|
||||
.button({
|
||||
text: false,
|
||||
icons: {
|
||||
primary: "ui-icon-triangle-1-s"
|
||||
}
|
||||
})
|
||||
.parent()
|
||||
.buttonset()
|
||||
.next()
|
||||
.menu(selected)
|
||||
.popup({
|
||||
trigger: $("#select")
|
||||
});
|
||||
|
||||
$("td:has(.menubar)").clone().appendTo("tbody tr:not(:first)");
|
||||
$("table .menubar > ul").menu(selected).popup().prev().button();
|
||||
});
|
||||
</script>
|
||||
<style type="text/css">
|
||||
body { font-size:62.5%; }
|
||||
|
||||
.ui-popup { position: absolute; z-index: 5000; }
|
||||
.ui-menu { width: 200px; }
|
||||
|
||||
table {
|
||||
border-collapse: collapse;
|
||||
}
|
||||
th, td {
|
||||
padding: 0.5em;
|
||||
border: 1px solid black;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<button id="button1">Show context menu 1</button>
|
||||
<ul id="menu1">
|
||||
<li><a href="#">Amsterdam</a></li>
|
||||
<li><a href="#">Anaheim</a></li>
|
||||
<li><a href="#">Cologne</a></li>
|
||||
<li><a href="#">Frankfurt</a></li>
|
||||
<li><a href="#">Magdeburg</a></li>
|
||||
<li><a href="#">Munich</a></li>
|
||||
<li><a href="#">Utrecht</a></li>
|
||||
<li><a href="#">Zurich</a></li>
|
||||
</ul>
|
||||
|
||||
<div>
|
||||
<div>
|
||||
<button id="rerun">Run last action</button>
|
||||
<button id="select">Select an action</button>
|
||||
</div>
|
||||
<ul>
|
||||
<li><a href="#">Open...</a></li>
|
||||
<li><a href="#">Save</a></li>
|
||||
<li><a href="#">Delete</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<table id="movies" class="ui-widget">
|
||||
<thead>
|
||||
<tr>
|
||||
<th data-field="Name" class="ui-widget-header">Name</th>
|
||||
<th data-field="ReleaseYear" class="ui-widget-header">Release Year</th>
|
||||
<th data-field="AverageRating" class="ui-widget-header">Average Rating</th>
|
||||
<th class="ui-widget-header"></th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td class="ui-widget-content">Red Hot Chili Peppers: Funky Monks</td>
|
||||
<td class="ui-widget-content">1993</td>
|
||||
<td class="ui-widget-content">3.6</td>
|
||||
<td class="ui-widget-content">
|
||||
<div class="menubar">
|
||||
<a href="#">Options</a>
|
||||
<ul>
|
||||
<li><a href="#">Order...</a></li>
|
||||
<li class="ui-state-disabled">Write a Review...</li>
|
||||
<li><a href="#">Find Similar Movies...</a></li>
|
||||
<li>
|
||||
<a href="#">Rate</a>
|
||||
<ul>
|
||||
<li><a href="#">5 stars</a></li>
|
||||
<li><a href="#">4 stars</a></li>
|
||||
<li><a href="#">3 stars</a></li>
|
||||
<li><a href="#">2 stars</a></li>
|
||||
<li><a href="#">1 stars</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="ui-widget-content">Rod Stewart: Storyteller 1984-1991</td>
|
||||
<td class="ui-widget-content">1991</td>
|
||||
<td class="ui-widget-content">3.1</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="ui-widget-content">Stevie Ray Vaughan and Double Trouble: Live at the El Mocambo 1983</td>
|
||||
<td class="ui-widget-content">1991</td>
|
||||
<td class="ui-widget-content">3.9</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="ui-widget-content">Spike and Mike's Sick & Twisted Festival of Animation</td>
|
||||
<td class="ui-widget-content">1997</td>
|
||||
<td class="ui-widget-content">2.6</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
<div class="ui-widget" style="margin-top:2em; font-family:Arial">
|
||||
Log:
|
||||
<div id="log" style="height: 400px; width: 300px; overflow: auto;" class="ui-widget-content"></div>
|
||||
</div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
124
tests/visual/menu/popup.js
Normal file
124
tests/visual/menu/popup.js
Normal file
@ -0,0 +1,124 @@
|
||||
/*
|
||||
* jQuery UI popup utility
|
||||
*/
|
||||
(function($) {
|
||||
|
||||
var idIncrement = 0;
|
||||
|
||||
$.widget( "ui.popup", {
|
||||
options: {
|
||||
position: {
|
||||
my: "left top",
|
||||
at: "left bottom"
|
||||
}
|
||||
},
|
||||
_create: function() {
|
||||
if ( !this.options.trigger ) {
|
||||
this.options.trigger = this.element.prev();
|
||||
}
|
||||
|
||||
if ( !this.element.attr( "id" ) ) {
|
||||
this.element.attr( "id", "ui-popup-" + idIncrement++ );
|
||||
this.generatedId = true;
|
||||
}
|
||||
|
||||
if ( !this.element.attr( "role" ) ) {
|
||||
// TODO alternatives to tooltip are dialog and menu, all three aren't generic popups
|
||||
this.element.attr( "role", "tooltip" );
|
||||
this.generatedRole = true;
|
||||
}
|
||||
|
||||
this.options.trigger
|
||||
.attr( "aria-haspopup", true )
|
||||
.attr( "aria-owns", this.element.attr( "id" ) );
|
||||
|
||||
this.element
|
||||
.addClass("ui-popup")
|
||||
this._close();
|
||||
|
||||
this._bind(this.options.trigger, {
|
||||
click: function( event ) {
|
||||
event.preventDefault();
|
||||
var that = this;
|
||||
setTimeout(function() {
|
||||
that._open( event );
|
||||
}, 1);
|
||||
}
|
||||
});
|
||||
|
||||
this._bind(this.element, {
|
||||
blur: "_close"
|
||||
});
|
||||
|
||||
this._bind({
|
||||
keyup: function( event ) {
|
||||
if (event.keyCode == $.ui.keyCode.ESCAPE && this.element.is( ":visible" )) {
|
||||
this._close( event );
|
||||
this.options.trigger.focus();
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
this._bind(document, {
|
||||
click: function( event ) {
|
||||
if (this.open && !$(event.target).closest(".ui-popup").length) {
|
||||
this._close( event );
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
_destroy: function() {
|
||||
this.element
|
||||
.show()
|
||||
.removeClass( "ui-popup" )
|
||||
.removeAttr( "aria-hidden" )
|
||||
.removeAttr( "aria-expanded" );
|
||||
|
||||
this.options.trigger
|
||||
.removeAttr( "aria-haspopup" )
|
||||
.removeAttr( "aria-owns" );
|
||||
|
||||
if ( this.generatedId ) {
|
||||
this.element.removeAttr( "id" );
|
||||
}
|
||||
if ( this.generatedRole ) {
|
||||
this.element.removeAttr( "role" );
|
||||
}
|
||||
},
|
||||
|
||||
_open: function( event ) {
|
||||
var position = $.extend( {}, {
|
||||
of: this.options.trigger
|
||||
}, this.options.position );
|
||||
|
||||
this.element
|
||||
.show()
|
||||
.attr( "aria-hidden", false )
|
||||
.attr( "aria-expanded", true )
|
||||
.position( position )
|
||||
.focus();
|
||||
|
||||
// take trigger out of tab order to allow shift-tab to skip trigger
|
||||
this.options.trigger.attr("tabindex", -1);
|
||||
|
||||
this.open = true;
|
||||
this._trigger( "open", event );
|
||||
},
|
||||
|
||||
_close: function( event ) {
|
||||
this.element
|
||||
.hide()
|
||||
.attr( "aria-hidden", true )
|
||||
.attr( "aria-expanded", false );
|
||||
|
||||
this.options.trigger.attr("tabindex", 0);
|
||||
|
||||
this.open = false;
|
||||
this._trigger( "close", event );
|
||||
}
|
||||
|
||||
|
||||
});
|
||||
|
||||
}(jQuery));
|
||||
@ -1,54 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<title>Sortable Visual Test : Sortable ticket #4551</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.5.1.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.mouse.js"></script>
|
||||
<script type="text/javascript" src="../../../ui/jquery.ui.sortable.js"></script>
|
||||
<script type="text/javascript">
|
||||
$(function() {
|
||||
$("#first, #second").sortable({
|
||||
connectWith: '.sortable'
|
||||
}).disableSelection();
|
||||
});
|
||||
</script>
|
||||
<style type="text/css">
|
||||
.sortable { margin: 0; padding: 0; }
|
||||
.sortable div { margin: 3px 3px 3px 0; background: #ccc; padding: 1px; border: 1px solid black; float:left; width: 100px; height: 140px; font-size: 1em; text-align: center; }
|
||||
#second div { background: #acc; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<h1 class="ui-widget-header"><a href="http://dev.jqueryui.com/ticket/4551">#4551 - Sortable connectWith fails if item is floated</a></h1>
|
||||
|
||||
<div id="first" class="sortable">
|
||||
<div>1</div>
|
||||
<div>2</div>
|
||||
<div>3</div>
|
||||
<div>4</div>
|
||||
<div>5</div>
|
||||
<div>6</div>
|
||||
<div>7</div>
|
||||
<div>8</div>
|
||||
<div>9</div>
|
||||
<div>10</div>
|
||||
<div>11</div>
|
||||
<div>12</div>
|
||||
</div>
|
||||
|
||||
<br style="clear:both;">
|
||||
<hr />
|
||||
|
||||
<div id="second" class="sortable">
|
||||
<div>12</div>
|
||||
<div>14</div>
|
||||
</div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
@ -10,7 +10,9 @@
|
||||
<script type="text/javascript" src="../../../ui/jquery.ui.position.js"></script>
|
||||
<script type="text/javascript" src="../../../ui/jquery.ui.button.js"></script>
|
||||
<script type="text/javascript" src="../../../ui/jquery.ui.tooltip.js"></script>
|
||||
<!--
|
||||
<script type="text/javascript" src="http://jqueryui.com/themeroller/themeswitchertool/"></script>
|
||||
-->
|
||||
<script type="text/javascript">
|
||||
$(function() {
|
||||
$.fn.themeswitcher && $('<div/>').css({
|
||||
@ -18,20 +20,22 @@
|
||||
right: 10,
|
||||
top: 10
|
||||
}).appendTo(document.body).themeswitcher();
|
||||
|
||||
|
||||
function enable() {
|
||||
// default
|
||||
$("#context1, form, #childish").tooltip();
|
||||
|
||||
// custom class, replaces ui-widget-content
|
||||
$("#context2").tooltip().each(function() {
|
||||
$(this).tooltip("widget").addClass("ui-widget-header");
|
||||
})
|
||||
$("#right1").tooltip().tooltip("widget").addClass("ui-state-error");
|
||||
$("#context2").tooltip({
|
||||
tooltipClass: "ui-widget-header"
|
||||
});
|
||||
$("#right1").tooltip({
|
||||
tooltipClass: "ui-state-error"
|
||||
});
|
||||
|
||||
// synchronous content
|
||||
$("#footnotes").tooltip({
|
||||
items: "[href^=#]",
|
||||
items: "[href^='#']",
|
||||
content: function() {
|
||||
return $($(this).attr("href")).html();
|
||||
}
|
||||
@ -64,12 +68,13 @@
|
||||
|
||||
// custom position
|
||||
$("#right2").tooltip({
|
||||
tooltipClass: "ui-state-highlight",
|
||||
position: {
|
||||
my: "center top",
|
||||
at: "center bottom",
|
||||
offset: "0 10"
|
||||
}
|
||||
}).tooltip("widget").addClass("ui-state-highlight");
|
||||
});
|
||||
|
||||
$("#button1").button();
|
||||
$("#button2").button({
|
||||
@ -94,12 +99,12 @@
|
||||
enable();
|
||||
|
||||
$("#disable").toggle(function() {
|
||||
$("*").tooltip("disable");
|
||||
$(":ui-tooltip").tooltip("disable");
|
||||
}, function() {
|
||||
$("*").tooltip("enable");
|
||||
$(":ui-tooltip").tooltip("enable");
|
||||
});
|
||||
$("#toggle").toggle(function() {
|
||||
$("*").tooltip("destroy");
|
||||
$(":ui-tooltip").tooltip("destroy");
|
||||
}, function() {
|
||||
enable();
|
||||
});
|
||||
|
||||
17
themes/base/jquery.ui.menu.css
vendored
17
themes/base/jquery.ui.menu.css
vendored
@ -26,11 +26,9 @@
|
||||
.ui-menu .ui-menu-item a {
|
||||
text-decoration:none;
|
||||
display:block;
|
||||
padding:.2em .4em;
|
||||
padding: 2px .4em;
|
||||
line-height:1.5;
|
||||
zoom:1;
|
||||
}
|
||||
.ui-menu .ui-menu-item a {
|
||||
font-weight: normal;
|
||||
}
|
||||
.ui-menu .ui-menu-item a.ui-state-focus,
|
||||
@ -39,6 +37,15 @@
|
||||
margin: -1px;
|
||||
}
|
||||
|
||||
.ui-menu .ui-icon { float: right; }
|
||||
|
||||
/* nested menus */
|
||||
.ui-menu .ui-menu { position: absolute; }
|
||||
|
||||
/* icon support */
|
||||
.ui-menu-icons { position: relative; }
|
||||
.ui-menu-icons .ui-menu-item a { position: relative; padding-left: 2em; }
|
||||
|
||||
/* left-aligned */
|
||||
.ui-menu .ui-icon { position: absolute; top: .2em; left: .2em; }
|
||||
|
||||
/* right-aligned */
|
||||
.ui-menu .ui-menu-icon { position: static; float: right; }
|
||||
7
themes/base/jquery.ui.resizable.css
vendored
7
themes/base/jquery.ui.resizable.css
vendored
@ -8,7 +8,12 @@
|
||||
* http://docs.jquery.com/UI/Resizable#theming
|
||||
*/
|
||||
.ui-resizable { position: relative;}
|
||||
.ui-resizable-handle { position: absolute;font-size: 0.1px;z-index: 99999; display: block;}
|
||||
.ui-resizable-handle { position: absolute;font-size: 0.1px;z-index: 99999; display: block;
|
||||
/* http://bugs.jqueryui.com/ticket/7233
|
||||
- Resizable: resizable handles fail to work in IE if transparent and content overlaps
|
||||
*/
|
||||
background-image:url(data:image/gif;base64,R0lGODlhAQABAAD/ACwAAAAAAQABAAACADs=);
|
||||
}
|
||||
.ui-resizable-disabled .ui-resizable-handle, .ui-resizable-autohide .ui-resizable-handle { display: none; }
|
||||
.ui-resizable-n { cursor: n-resize; height: 7px; width: 100%; top: -5px; left: 0; }
|
||||
.ui-resizable-s { cursor: s-resize; height: 7px; width: 100%; bottom: -5px; left: 0; }
|
||||
|
||||
7
themes/base/jquery.ui.tabs.css
vendored
7
themes/base/jquery.ui.tabs.css
vendored
@ -11,8 +11,7 @@
|
||||
.ui-tabs .ui-tabs-nav { margin: 0; padding: .2em .2em 0; }
|
||||
.ui-tabs .ui-tabs-nav li { list-style: none; float: left; position: relative; top: 1px; margin: 0 .2em 1px 0; border-bottom: 0 !important; padding: 0; white-space: nowrap; }
|
||||
.ui-tabs .ui-tabs-nav li a { float: left; padding: .5em 1em; text-decoration: none; }
|
||||
.ui-tabs .ui-tabs-nav li.ui-tabs-selected { margin-bottom: 0; padding-bottom: 1px; }
|
||||
.ui-tabs .ui-tabs-nav li.ui-tabs-selected a, .ui-tabs .ui-tabs-nav li.ui-state-disabled a, .ui-tabs .ui-tabs-nav li.ui-state-processing a { cursor: text; }
|
||||
.ui-tabs .ui-tabs-nav li a, .ui-tabs.ui-tabs-collapsible .ui-tabs-nav li.ui-tabs-selected a { cursor: pointer; } /* first selector in group seems obsolete, but required to overcome bug in Opera applying cursor: text overall if defined elsewhere... */
|
||||
.ui-tabs .ui-tabs-nav li.ui-tabs-active { margin-bottom: 0; padding-bottom: 1px; }
|
||||
.ui-tabs .ui-tabs-nav li.ui-tabs-active a, .ui-tabs .ui-tabs-nav li.ui-state-disabled a, .ui-tabs .ui-tabs-nav li.ui-tabs-loading a { cursor: text; }
|
||||
.ui-tabs .ui-tabs-nav li a, .ui-tabs.ui-tabs-collapsible .ui-tabs-nav li.ui-tabs-active a { cursor: pointer; } /* first selector in group seems obsolete, but required to overcome bug in Opera applying cursor: text overall if defined elsewhere... */
|
||||
.ui-tabs .ui-tabs-panel { display: block; border-width: 0; padding: 1em 1.4em; background: none; }
|
||||
.ui-tabs .ui-tabs-hide { display: none !important; }
|
||||
|
||||
2
ui/i18n/jquery.ui.datepicker-nl.js
vendored
2
ui/i18n/jquery.ui.datepicker-nl.js
vendored
@ -14,7 +14,7 @@ jQuery(function($){
|
||||
dayNamesShort: ['zon', 'maa', 'din', 'woe', 'don', 'vri', 'zat'],
|
||||
dayNamesMin: ['zo', 'ma', 'di', 'wo', 'do', 'vr', 'za'],
|
||||
weekHeader: 'Wk',
|
||||
dateFormat: 'dd/mm/yy',
|
||||
dateFormat: 'dd-mm-yy',
|
||||
firstDay: 1,
|
||||
isRTL: false,
|
||||
showMonthAfterYear: false,
|
||||
|
||||
2
ui/i18n/jquery.ui.datepicker-sk.js
vendored
2
ui/i18n/jquery.ui.datepicker-sk.js
vendored
@ -10,7 +10,7 @@ jQuery(function($){
|
||||
'Júl','August','September','Október','November','December'],
|
||||
monthNamesShort: ['Jan','Feb','Mar','Apr','Máj','Jún',
|
||||
'Júl','Aug','Sep','Okt','Nov','Dec'],
|
||||
dayNames: ['Nedel\'a','Pondelok','Utorok','Streda','Štvrtok','Piatok','Sobota'],
|
||||
dayNames: ['Nedeľa','Pondelok','Utorok','Streda','Štvrtok','Piatok','Sobota'],
|
||||
dayNamesShort: ['Ned','Pon','Uto','Str','Štv','Pia','Sob'],
|
||||
dayNamesMin: ['Ne','Po','Ut','St','Št','Pia','So'],
|
||||
weekHeader: 'Ty',
|
||||
|
||||
47
ui/jquery.effects.core.js
vendored
47
ui/jquery.effects.core.js
vendored
@ -234,12 +234,12 @@ $.effects.animateClass = function( value, duration, easing, callback ) {
|
||||
easing = null;
|
||||
}
|
||||
|
||||
return this.queue( 'fx', function() {
|
||||
return this.queue(function() {
|
||||
var that = $( this ),
|
||||
originalStyleAttr = that.attr( 'style' ) || ' ',
|
||||
originalStyle = filterStyles( getElementStyles.call( this ) ),
|
||||
newStyle,
|
||||
className = that.attr( 'className' );
|
||||
className = that.attr( 'class' );
|
||||
|
||||
$.each( classAnimationActions, function(i, action) {
|
||||
if ( value[ action ] ) {
|
||||
@ -247,32 +247,31 @@ $.effects.animateClass = function( value, duration, easing, callback ) {
|
||||
}
|
||||
});
|
||||
newStyle = filterStyles( getElementStyles.call( this ) );
|
||||
that.attr( 'className', className );
|
||||
that.attr( 'class', className );
|
||||
|
||||
that.animate( styleDifference( originalStyle, newStyle ), duration, easing, function() {
|
||||
$.each( classAnimationActions, function( i, action ) {
|
||||
if ( value[ action ] ) {
|
||||
that[ action + 'Class' ]( value[ action ] );
|
||||
that.animate( styleDifference( originalStyle, newStyle ), {
|
||||
queue: false,
|
||||
duration: duration,
|
||||
easing: easing,
|
||||
complete: function() {
|
||||
$.each( classAnimationActions, function( i, action ) {
|
||||
if ( value[ action ] ) {
|
||||
that[ action + 'Class' ]( value[ action ] );
|
||||
}
|
||||
});
|
||||
// work around bug in IE by clearing the cssText before setting it
|
||||
if ( typeof that.attr( 'style' ) == 'object' ) {
|
||||
that.attr( 'style' ).cssText = '';
|
||||
that.attr( 'style' ).cssText = originalStyleAttr;
|
||||
} else {
|
||||
that.attr( 'style', originalStyleAttr );
|
||||
}
|
||||
});
|
||||
// work around bug in IE by clearing the cssText before setting it
|
||||
if ( typeof that.attr( 'style' ) == 'object' ) {
|
||||
that.attr( 'style' ).cssText = '';
|
||||
that.attr( 'style' ).cssText = originalStyleAttr;
|
||||
} else {
|
||||
that.attr( 'style', originalStyleAttr );
|
||||
}
|
||||
if ( callback ) {
|
||||
callback.apply( this, arguments );
|
||||
if ( callback ) {
|
||||
callback.apply( this, arguments );
|
||||
}
|
||||
$.dequeue( this );
|
||||
}
|
||||
});
|
||||
|
||||
// $.animate adds a function to the end of the queue
|
||||
// but we want it at the front
|
||||
var queue = $.queue( this ),
|
||||
anim = queue.splice( queue.length - 1, 1 )[ 0 ];
|
||||
queue.splice( 1, 0, anim );
|
||||
$.dequeue( this );
|
||||
});
|
||||
};
|
||||
|
||||
|
||||
15
ui/jquery.ui.accordion.js
vendored
15
ui/jquery.ui.accordion.js
vendored
@ -25,7 +25,11 @@ $.widget( "ui.accordion", {
|
||||
icons: {
|
||||
activeHeader: "ui-icon-triangle-1-s",
|
||||
header: "ui-icon-triangle-1-e"
|
||||
}
|
||||
},
|
||||
|
||||
// callbacks
|
||||
activate: null,
|
||||
beforeActivate: null
|
||||
},
|
||||
|
||||
_create: function() {
|
||||
@ -275,7 +279,7 @@ $.widget( "ui.accordion", {
|
||||
}
|
||||
|
||||
// trying to collapse, simulate a click on the currently active header
|
||||
active = active || this.active;
|
||||
active = active || this.active[ 0 ];
|
||||
|
||||
this._eventHandler({
|
||||
target: active,
|
||||
@ -319,7 +323,7 @@ $.widget( "ui.accordion", {
|
||||
// click on active header, but not collapsible
|
||||
( clickedIsActive && !options.collapsible ) ||
|
||||
// allow canceling activation
|
||||
( this._trigger( "beforeActivate", null, eventData ) === false ) ) {
|
||||
( this._trigger( "beforeActivate", event, eventData ) === false ) ) {
|
||||
return;
|
||||
}
|
||||
|
||||
@ -649,6 +653,11 @@ if ( $.uiBackCompat !== false ) {
|
||||
|
||||
// change events
|
||||
(function( $, prototype ) {
|
||||
$.extend( prototype.options, {
|
||||
change: null,
|
||||
changestart: null
|
||||
});
|
||||
|
||||
var _trigger = prototype._trigger;
|
||||
prototype._trigger = function( type, event, data ) {
|
||||
var ret = _trigger.apply( this, arguments );
|
||||
|
||||
13
ui/jquery.ui.autocomplete.js
vendored
13
ui/jquery.ui.autocomplete.js
vendored
@ -22,7 +22,7 @@ $.widget( "ui.autocomplete", {
|
||||
defaultElement: "<input>",
|
||||
options: {
|
||||
appendTo: "body",
|
||||
autoFocus: true,
|
||||
autoFocus: false,
|
||||
delay: 300,
|
||||
minLength: 1,
|
||||
position: {
|
||||
@ -30,7 +30,16 @@ $.widget( "ui.autocomplete", {
|
||||
at: "left bottom",
|
||||
collision: "none"
|
||||
},
|
||||
source: null
|
||||
source: null,
|
||||
|
||||
// callbacks
|
||||
change: null,
|
||||
close: null,
|
||||
focus: null,
|
||||
open: null,
|
||||
response: null,
|
||||
search: null,
|
||||
select: null
|
||||
},
|
||||
|
||||
pending: 0,
|
||||
|
||||
52
ui/jquery.ui.core.js
vendored
52
ui/jquery.ui.core.js
vendored
@ -141,12 +141,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( $.curCSS( elem, "padding" + this, true ) ) || 0;
|
||||
if ( border ) {
|
||||
size -= parseFloat( $.curCSS( elem, "border" + this + "Width", true) ) || 0;
|
||||
size -= parseFloat( $.curCSS( elem, "border" + this + "Width", true ) ) || 0;
|
||||
}
|
||||
if ( margin ) {
|
||||
size -= parseFloat( $.curCSS( elem, "margin" + this, true) ) || 0;
|
||||
size -= parseFloat( $.curCSS( elem, "margin" + this, true ) ) || 0;
|
||||
}
|
||||
});
|
||||
return size;
|
||||
@ -174,6 +174,27 @@ $.each( [ "Width", "Height" ], function( i, name ) {
|
||||
});
|
||||
|
||||
// selectors
|
||||
function focusable( element, isTabIndexNotNaN ) {
|
||||
var nodeName = element.nodeName.toLowerCase();
|
||||
if ( "area" === nodeName ) {
|
||||
var map = element.parentNode,
|
||||
mapName = map.name,
|
||||
img;
|
||||
if ( !element.href || !mapName || map.nodeName.toLowerCase() !== "map" ) {
|
||||
return false;
|
||||
}
|
||||
img = $( "img[usemap=#" + mapName + "]" )[0];
|
||||
return !!img && visible( img );
|
||||
}
|
||||
return ( /input|select|textarea|button|object/.test( nodeName )
|
||||
? !element.disabled
|
||||
: "a" == nodeName
|
||||
? element.href || isTabIndexNotNaN
|
||||
: isTabIndexNotNaN)
|
||||
// the element and all of its ancestors must be visible
|
||||
&& visible( element );
|
||||
}
|
||||
|
||||
function visible( element ) {
|
||||
return !$( element ).parents().andSelf().filter(function() {
|
||||
return $.curCSS( this, "visibility" ) === "hidden" ||
|
||||
@ -187,30 +208,13 @@ $.extend( $.expr[ ":" ], {
|
||||
},
|
||||
|
||||
focusable: function( element ) {
|
||||
var nodeName = element.nodeName.toLowerCase(),
|
||||
tabIndex = $.attr( element, "tabindex" );
|
||||
if ( "area" === nodeName ) {
|
||||
var map = element.parentNode,
|
||||
mapName = map.name,
|
||||
img;
|
||||
if ( !element.href || !mapName || map.nodeName.toLowerCase() !== "map" ) {
|
||||
return false;
|
||||
}
|
||||
img = $( "img[usemap=#" + mapName + "]" )[0];
|
||||
return !!img && visible( img );
|
||||
}
|
||||
return ( /input|select|textarea|button|object/.test( nodeName )
|
||||
? !element.disabled
|
||||
: "a" == nodeName
|
||||
? element.href || !isNaN( tabIndex )
|
||||
: !isNaN( tabIndex ))
|
||||
// the element and all of its ancestors must be visible
|
||||
&& visible( element );
|
||||
return focusable( element, !isNaN( $.attr( element, "tabindex" ) ) );
|
||||
},
|
||||
|
||||
tabbable: function( element ) {
|
||||
var tabIndex = $.attr( element, "tabindex" );
|
||||
return ( isNaN( tabIndex ) || tabIndex >= 0 ) && $( element ).is( ":focusable" );
|
||||
var tabIndex = $.attr( element, "tabindex" ),
|
||||
isTabIndexNaN = isNaN( tabIndex );
|
||||
return ( isTabIndexNaN || tabIndex >= 0 ) && focusable( element, !isTabIndexNaN );
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
70
ui/jquery.ui.datepicker.js
vendored
70
ui/jquery.ui.datepicker.js
vendored
@ -1579,40 +1579,42 @@ $.extend(Datepicker.prototype, {
|
||||
if (!showMonthAfterYear)
|
||||
html += monthHtml + (secondary || !(changeMonth && changeYear) ? ' ' : '');
|
||||
// year selection
|
||||
inst.yearshtml = '';
|
||||
if (secondary || !changeYear)
|
||||
html += '<span class="ui-datepicker-year">' + drawYear + '</span>';
|
||||
else {
|
||||
// determine range of years to display
|
||||
var years = this._get(inst, 'yearRange').split(':');
|
||||
var thisYear = new Date().getFullYear();
|
||||
var determineYear = function(value) {
|
||||
var year = (value.match(/c[+-].*/) ? drawYear + parseInt(value.substring(1), 10) :
|
||||
(value.match(/[+-].*/) ? thisYear + parseInt(value, 10) :
|
||||
parseInt(value, 10)));
|
||||
return (isNaN(year) ? thisYear : year);
|
||||
};
|
||||
var year = determineYear(years[0]);
|
||||
var endYear = Math.max(year, determineYear(years[1] || ''));
|
||||
year = (minDate ? Math.max(year, minDate.getFullYear()) : year);
|
||||
endYear = (maxDate ? Math.min(endYear, maxDate.getFullYear()) : endYear);
|
||||
inst.yearshtml += '<select class="ui-datepicker-year" ' +
|
||||
'onchange="DP_jQuery_' + dpuuid + '.datepicker._selectMonthYear(\'#' + inst.id + '\', this, \'Y\');" ' +
|
||||
'onclick="DP_jQuery_' + dpuuid + '.datepicker._clickMonthYear(\'#' + inst.id + '\');"' +
|
||||
'>';
|
||||
for (; year <= endYear; year++) {
|
||||
inst.yearshtml += '<option value="' + year + '"' +
|
||||
(year == drawYear ? ' selected="selected"' : '') +
|
||||
'>' + year + '</option>';
|
||||
}
|
||||
inst.yearshtml += '</select>';
|
||||
//when showing there is no need for later update
|
||||
if( ! $.browser.mozilla ){
|
||||
html += inst.yearshtml;
|
||||
inst.yearshtml = null;
|
||||
} else {
|
||||
// will be replaced later with inst.yearshtml
|
||||
html += '<select class="ui-datepicker-year"><option value="' + drawYear + '" selected="selected">' + drawYear + '</option></select>';
|
||||
if ( !inst.yearshtml ) {
|
||||
inst.yearshtml = '';
|
||||
if (secondary || !changeYear)
|
||||
html += '<span class="ui-datepicker-year">' + drawYear + '</span>';
|
||||
else {
|
||||
// determine range of years to display
|
||||
var years = this._get(inst, 'yearRange').split(':');
|
||||
var thisYear = new Date().getFullYear();
|
||||
var determineYear = function(value) {
|
||||
var year = (value.match(/c[+-].*/) ? drawYear + parseInt(value.substring(1), 10) :
|
||||
(value.match(/[+-].*/) ? thisYear + parseInt(value, 10) :
|
||||
parseInt(value, 10)));
|
||||
return (isNaN(year) ? thisYear : year);
|
||||
};
|
||||
var year = determineYear(years[0]);
|
||||
var endYear = Math.max(year, determineYear(years[1] || ''));
|
||||
year = (minDate ? Math.max(year, minDate.getFullYear()) : year);
|
||||
endYear = (maxDate ? Math.min(endYear, maxDate.getFullYear()) : endYear);
|
||||
inst.yearshtml += '<select class="ui-datepicker-year" ' +
|
||||
'onchange="DP_jQuery_' + dpuuid + '.datepicker._selectMonthYear(\'#' + inst.id + '\', this, \'Y\');" ' +
|
||||
'onclick="DP_jQuery_' + dpuuid + '.datepicker._clickMonthYear(\'#' + inst.id + '\');"' +
|
||||
'>';
|
||||
for (; year <= endYear; year++) {
|
||||
inst.yearshtml += '<option value="' + year + '"' +
|
||||
(year == drawYear ? ' selected="selected"' : '') +
|
||||
'>' + year + '</option>';
|
||||
}
|
||||
inst.yearshtml += '</select>';
|
||||
//when showing there is no need for later update
|
||||
if( ! $.browser.mozilla ){
|
||||
html += inst.yearshtml;
|
||||
inst.yearshtml = null;
|
||||
} else {
|
||||
// will be replaced later with inst.yearshtml
|
||||
html += '<select class="ui-datepicker-year"><option value="' + drawYear + '" selected="selected">' + drawYear + '</option></select>';
|
||||
}
|
||||
}
|
||||
}
|
||||
html += this._get(inst, 'yearSuffix');
|
||||
|
||||
100
ui/jquery.ui.menu.js
vendored
100
ui/jquery.ui.menu.js
vendored
@ -28,11 +28,14 @@ $.widget("ui.menu", {
|
||||
var self = this;
|
||||
this.activeMenu = this.element;
|
||||
this.menuId = this.element.attr( "id" ) || "ui-menu-" + idIncrement++;
|
||||
if (this.element.find(".ui-icon").length) {
|
||||
this.element.addClass("ui-menu-icons");
|
||||
}
|
||||
this.element
|
||||
.addClass( "ui-menu ui-widget ui-widget-content ui-corner-all" )
|
||||
.attr({
|
||||
id: this.menuId,
|
||||
role: "listbox"
|
||||
role: "menu"
|
||||
})
|
||||
.bind( "click.menu", function( event ) {
|
||||
var item = $( event.target ).closest( ".ui-menu-item:has(a)" );
|
||||
@ -108,9 +111,16 @@ $.widget("ui.menu", {
|
||||
event.preventDefault();
|
||||
break;
|
||||
case $.ui.keyCode.ENTER:
|
||||
self.select( event );
|
||||
if (self.active.children("a[aria-haspopup='true']").length) {
|
||||
if (self.right( event )) {
|
||||
event.stopImmediatePropagation();
|
||||
}
|
||||
}
|
||||
else {
|
||||
self.select( event );
|
||||
event.stopImmediatePropagation();
|
||||
}
|
||||
event.preventDefault();
|
||||
event.stopImmediatePropagation();
|
||||
break;
|
||||
case $.ui.keyCode.ESCAPE:
|
||||
if ( self.left( event ) ) {
|
||||
@ -132,13 +142,13 @@ $.widget("ui.menu", {
|
||||
function escape(value) {
|
||||
return value.replace(/[-[\]{}()*+?.,\\^$|#\s]/g, "\\$&");
|
||||
}
|
||||
var match = self.widget().children(".ui-menu-item").filter(function() {
|
||||
var match = self.activeMenu.children(".ui-menu-item").filter(function() {
|
||||
return new RegExp("^" + escape(character), "i").test($(this).children("a").text());
|
||||
});
|
||||
var match = skip && match.index(self.active.next()) != -1 ? self.active.nextAll(".ui-menu-item") : match;
|
||||
if (!match.length) {
|
||||
character = String.fromCharCode(event.keyCode);
|
||||
match = self.widget().children(".ui-menu-item").filter(function() {
|
||||
match = self.activeMenu.children(".ui-menu-item").filter(function() {
|
||||
return new RegExp("^" + escape(character), "i").test($(this).children("a").text());
|
||||
});
|
||||
}
|
||||
@ -160,41 +170,62 @@ $.widget("ui.menu", {
|
||||
},
|
||||
|
||||
_destroy: function() {
|
||||
//destroy (sub)menus
|
||||
this.element
|
||||
.removeAttr( "aria-activedescendant" )
|
||||
.find("ul")
|
||||
.andSelf()
|
||||
.removeClass( "ui-menu ui-widget ui-widget-content ui-corner-all" )
|
||||
.removeAttr( "tabIndex" )
|
||||
.removeAttr( "role" )
|
||||
.removeAttr( "aria-activedescendant" );
|
||||
.removeAttr("id")
|
||||
.removeAttr( "aria-labelledby" )
|
||||
.removeAttr( "aria-expanded" )
|
||||
.removeAttr( "aria-hidden" )
|
||||
.show();
|
||||
|
||||
this.element.children( ".ui-menu-item" )
|
||||
//destroy menu items
|
||||
this.element.find( ".ui-menu-item" )
|
||||
.unbind( ".menu" )
|
||||
.removeClass( "ui-menu-item" )
|
||||
.removeAttr( "role" )
|
||||
.children( "a" )
|
||||
.removeClass( "ui-corner-all ui-state-hover" )
|
||||
.removeAttr( "tabIndex" )
|
||||
.unbind( ".menu" );
|
||||
.removeAttr( "role" )
|
||||
.removeAttr( "aria-haspopup" )
|
||||
.removeAttr( "id" )
|
||||
.children(".ui-icon").remove();
|
||||
},
|
||||
|
||||
refresh: function() {
|
||||
var self = this;
|
||||
// initialize nested menus
|
||||
// TODO add role=listbox to these, too? or just the top level menu?
|
||||
var submenus = this.element.find("ul:not(.ui-menu)")
|
||||
.addClass( "ui-menu ui-widget ui-widget-content ui-corner-all" )
|
||||
.attr("role", "menu")
|
||||
.hide()
|
||||
|
||||
submenus
|
||||
.prev("a")
|
||||
.prepend('<span class="ui-icon ui-icon-carat-1-e"></span>');
|
||||
|
||||
.attr("aria-hidden", "true")
|
||||
.attr("aria-expanded", "false")
|
||||
;
|
||||
|
||||
// don't refresh list items that are already adapted
|
||||
var items = submenus.add(this.element).children( "li:not(.ui-menu-item):has(a)" )
|
||||
.addClass( "ui-menu-item" )
|
||||
.attr( "role", "menuitem" );
|
||||
.attr( "role", "presentation" );
|
||||
|
||||
items.children( "a" )
|
||||
.addClass( "ui-corner-all" )
|
||||
.attr( "tabIndex", -1 );
|
||||
.attr( "tabIndex", -1 )
|
||||
.attr( "role", "menuitem" )
|
||||
.attr("id", function(i) {return self.element.attr("id") + "-" + i});
|
||||
|
||||
submenus.each(function() {
|
||||
var menu = $(this);
|
||||
var item = menu.prev("a")
|
||||
item.attr("aria-haspopup", "true")
|
||||
.prepend('<span class="ui-menu-icon ui-icon ui-icon-carat-1-e"></span>');
|
||||
menu.attr("aria-labelledby", item.attr("id"));
|
||||
});
|
||||
},
|
||||
|
||||
focus: function( event, item ) {
|
||||
@ -219,13 +250,11 @@ $.widget("ui.menu", {
|
||||
this.active = item.first()
|
||||
.children( "a" )
|
||||
.addClass( "ui-state-focus" )
|
||||
.attr( "id", function(index, id) {
|
||||
return (self.itemId = id || self.menuId + "-activedescendant");
|
||||
})
|
||||
.end();
|
||||
// need to remove the attribute before adding it for the screenreader to pick up the change
|
||||
// see http://groups.google.com/group/jquery-a11y/msg/929e0c1e8c5efc8f
|
||||
this.element.removeAttr("aria-activedescendant").attr("aria-activedescendant", self.itemId)
|
||||
self.element.attr("aria-activedescendant", self.active.children("a").attr("id"))
|
||||
|
||||
// highlight active parent menu item, if any
|
||||
this.active.parent().closest(".ui-menu-item").children("a:first").addClass("ui-state-active");
|
||||
|
||||
self.timer = setTimeout(function() {
|
||||
self._close();
|
||||
@ -247,10 +276,6 @@ $.widget("ui.menu", {
|
||||
clearTimeout(this.timer);
|
||||
|
||||
this.active.children( "a" ).removeClass( "ui-state-focus" );
|
||||
// remove only generated id
|
||||
$( "#" + this.menuId + "-activedescendant" ).removeAttr( "id" );
|
||||
this.element.removeAttr( "aria-activedescenant" );
|
||||
this._trigger( "blur", event );
|
||||
this.active = null;
|
||||
},
|
||||
|
||||
@ -264,23 +289,20 @@ $.widget("ui.menu", {
|
||||
},
|
||||
|
||||
_open: function(submenu) {
|
||||
this.element.find(".ui-menu").not(submenu.parents()).hide();
|
||||
|
||||
clearTimeout(this.timer);
|
||||
this.element.find(".ui-menu").not(submenu.parents()).hide().attr("aria-hidden", "true");
|
||||
var position = $.extend({}, {
|
||||
of: this.active
|
||||
}, $.type(this.options.position) == "function"
|
||||
? this.options.position(this.active)
|
||||
: this.options.position
|
||||
);
|
||||
|
||||
submenu.show().position(position);
|
||||
|
||||
this.active.find(">a:first").addClass("ui-state-active");
|
||||
submenu.show().removeAttr("aria-hidden").attr("aria-expanded", "true").position(position);
|
||||
},
|
||||
|
||||
closeAll: function() {
|
||||
this.element
|
||||
.find("ul").hide().end()
|
||||
.find("ul").hide().attr("aria-hidden", "true").attr("aria-expanded", "false").end()
|
||||
.find("a.ui-state-active").removeClass("ui-state-active");
|
||||
this.blur();
|
||||
this.activeMenu = this.element;
|
||||
@ -288,25 +310,27 @@ $.widget("ui.menu", {
|
||||
|
||||
_close: function() {
|
||||
this.active.parent()
|
||||
.find("ul").hide().end()
|
||||
.find("ul").hide().attr("aria-hidden", "true").attr("aria-expanded", "false").end()
|
||||
.find("a.ui-state-active").removeClass("ui-state-active");
|
||||
},
|
||||
|
||||
left: function(event) {
|
||||
var newItem = this.active && this.active.parents("li").first();
|
||||
var newItem = this.active && this.active.parents("li:not(.ui-menubar-item)").first();
|
||||
if (newItem && newItem.length) {
|
||||
this.active.parent().hide();
|
||||
this.active.parent().attr("aria-hidden", "true").attr("aria-expanded", "false").hide();
|
||||
this.focus(event, newItem);
|
||||
return true;
|
||||
}
|
||||
},
|
||||
|
||||
right: function(event) {
|
||||
var self= this;
|
||||
var newItem = this.active && this.active.children("ul").children("li").first();
|
||||
if (newItem && newItem.length) {
|
||||
this._open(newItem.parent());
|
||||
var current = this.active;
|
||||
this.focus(event, newItem);
|
||||
//timeout so Firefox will not hide activedescendant change in expanding submenu from AT
|
||||
setTimeout(function(){self.focus(event, newItem)}, 20);
|
||||
return true;
|
||||
}
|
||||
},
|
||||
|
||||
1
ui/jquery.ui.progressbar.js
vendored
1
ui/jquery.ui.progressbar.js
vendored
@ -93,6 +93,7 @@ $.widget( "ui.progressbar", {
|
||||
}
|
||||
|
||||
this.valueDiv
|
||||
.toggle( value > this.min )
|
||||
.toggleClass( "ui-corner-right", value === this.options.max )
|
||||
.width( percentage.toFixed(0) + "%" );
|
||||
this.element.attr( "aria-valuenow", value );
|
||||
|
||||
2
ui/jquery.ui.slider.js
vendored
2
ui/jquery.ui.slider.js
vendored
@ -466,6 +466,7 @@ $.widget( "ui.slider", $.ui.mouse, {
|
||||
this.options.value = this._trimAlignValue( newValue );
|
||||
this._refreshValue();
|
||||
this._change( null, 0 );
|
||||
return;
|
||||
}
|
||||
|
||||
return this._value();
|
||||
@ -480,6 +481,7 @@ $.widget( "ui.slider", $.ui.mouse, {
|
||||
this.options.values[ index ] = this._trimAlignValue( newValue );
|
||||
this._refreshValue();
|
||||
this._change( null, index );
|
||||
return;
|
||||
}
|
||||
|
||||
if ( arguments.length ) {
|
||||
|
||||
4
ui/jquery.ui.sortable.js
vendored
4
ui/jquery.ui.sortable.js
vendored
@ -614,6 +614,10 @@ $.widget("ui.sortable", $.ui.mouse, {
|
||||
for (var i = this.items.length - 1; i >= 0; i--){
|
||||
var item = this.items[i];
|
||||
|
||||
//We ignore calculating positions of all connected containers when we're not over them
|
||||
if(item.instance != this.currentContainer && this.currentContainer && item.item[0] != this.currentItem[0])
|
||||
continue;
|
||||
|
||||
var t = this.options.toleranceElement ? $(this.options.toleranceElement, item.item) : item.item;
|
||||
|
||||
if (!fast) {
|
||||
|
||||
1359
ui/jquery.ui.tabs.js
vendored
1359
ui/jquery.ui.tabs.js
vendored
File diff suppressed because it is too large
Load Diff
138
ui/jquery.ui.tooltip.js
vendored
138
ui/jquery.ui.tooltip.js
vendored
@ -18,9 +18,10 @@ var increments = 0;
|
||||
|
||||
$.widget("ui.tooltip", {
|
||||
options: {
|
||||
tooltipClass: null,
|
||||
items: "[title]",
|
||||
content: function() {
|
||||
return $(this).attr("title");
|
||||
return $( this ).attr( "title" );
|
||||
},
|
||||
position: {
|
||||
my: "left center",
|
||||
@ -29,25 +30,10 @@ $.widget("ui.tooltip", {
|
||||
}
|
||||
},
|
||||
_create: function() {
|
||||
var self = this;
|
||||
this.tooltip = $("<div></div>")
|
||||
.attr("id", "ui-tooltip-" + increments++)
|
||||
.attr("role", "tooltip")
|
||||
.attr("aria-hidden", "true")
|
||||
.addClass("ui-tooltip ui-widget ui-corner-all ui-widget-content")
|
||||
.appendTo(document.body)
|
||||
.hide();
|
||||
this.tooltipContent = $("<div></div>")
|
||||
.addClass("ui-tooltip-content")
|
||||
.appendTo(this.tooltip);
|
||||
this.opacity = this.tooltip.css("opacity");
|
||||
this.element
|
||||
.bind("focus.tooltip mouseover.tooltip", function(event) {
|
||||
self.open( event );
|
||||
})
|
||||
.bind("blur.tooltip mouseout.tooltip", function(event) {
|
||||
self.close( event );
|
||||
});
|
||||
this._bind( {
|
||||
mouseover: "open",
|
||||
focusin: "open"
|
||||
});
|
||||
},
|
||||
|
||||
enable: function() {
|
||||
@ -55,34 +41,28 @@ $.widget("ui.tooltip", {
|
||||
},
|
||||
|
||||
disable: function() {
|
||||
// only set option, disable element style changes
|
||||
this.options.disabled = true;
|
||||
},
|
||||
|
||||
_destroy: function() {
|
||||
this.tooltip.remove();
|
||||
},
|
||||
|
||||
widget: function() {
|
||||
return this.element.pushStack(this.tooltip.get());
|
||||
},
|
||||
|
||||
open: function(event) {
|
||||
var target = $(event && event.target || this.element).closest(this.options.items);
|
||||
if ( !target.length ) {
|
||||
return;
|
||||
}
|
||||
// already visible? possible when both focus and mouseover events occur
|
||||
if (this.current && this.current[0] == target[0])
|
||||
return;
|
||||
var self = this;
|
||||
this.current = target;
|
||||
this.currentTitle = target.attr("title");
|
||||
if ( !target.data("tooltip-title") ) {
|
||||
target.data("tooltip-title", target.attr("title"));
|
||||
}
|
||||
var content = this.options.content.call(target[0], function(response) {
|
||||
// IE may instantly serve a cached response, need to give it a chance to finish with _open before that
|
||||
setTimeout(function() {
|
||||
// ignore async responses that come in after the tooltip is already hidden
|
||||
if (self.current == target)
|
||||
// when undefined, it got removeAttr, then ignore (ajax response)
|
||||
// intially its an empty string, so not undefined
|
||||
// TODO is there a better approach to enable ajax tooltips to have two updates?
|
||||
if (target.attr( "aria-describedby" ) !== undefined) {
|
||||
self._open(event, target, response);
|
||||
}
|
||||
}, 13);
|
||||
});
|
||||
if (content) {
|
||||
@ -90,48 +70,74 @@ $.widget("ui.tooltip", {
|
||||
}
|
||||
},
|
||||
|
||||
_open: function(event, target, content) {
|
||||
if (!content)
|
||||
_open: function( event, target, content ) {
|
||||
if ( !content )
|
||||
return;
|
||||
|
||||
target.attr("title", "");
|
||||
|
||||
if (this.options.disabled)
|
||||
return;
|
||||
|
||||
this.tooltipContent.html(content);
|
||||
this.tooltip.css({
|
||||
top: 0,
|
||||
left: 0
|
||||
}).show().position( $.extend({
|
||||
of: target
|
||||
}, this.options.position )).hide();
|
||||
|
||||
this.tooltip.attr("aria-hidden", "false");
|
||||
target.attr("aria-describedby", this.tooltip.attr("id"));
|
||||
|
||||
this.tooltip.stop(false, true).fadeIn();
|
||||
target.attr("title", "");
|
||||
|
||||
if ( this.options.disabled )
|
||||
return;
|
||||
|
||||
// ajaxy tooltip can update an existing one
|
||||
var tooltip = this._find( target );
|
||||
if (!tooltip.length) {
|
||||
tooltip = this._tooltip();
|
||||
target.attr( "aria-describedby", tooltip.attr( "id" ) );
|
||||
}
|
||||
tooltip.find(".ui-tooltip-content").html( content );
|
||||
tooltip.position( $.extend({
|
||||
of: target
|
||||
}, this.options.position ) ).hide();
|
||||
|
||||
|
||||
tooltip.fadeIn();
|
||||
|
||||
this._trigger( "open", event );
|
||||
|
||||
this._bind( target, {
|
||||
mouseleave: "close",
|
||||
blur: "close"
|
||||
});
|
||||
},
|
||||
|
||||
close: function(event) {
|
||||
if (!this.current)
|
||||
close: function( event ) {
|
||||
var target = $( event && event.currentTarget || this.element );
|
||||
target.attr( "title", target.data( "tooltip-title" ) );
|
||||
|
||||
if ( this.options.disabled )
|
||||
return;
|
||||
|
||||
var tooltip = this._find( target );
|
||||
target.removeAttr( "aria-describedby" );
|
||||
|
||||
var current = this.current;
|
||||
this.current = null;
|
||||
current.attr("title", this.currentTitle);
|
||||
tooltip.fadeOut( function() {
|
||||
$( this ).remove();
|
||||
});
|
||||
|
||||
if (this.options.disabled)
|
||||
return;
|
||||
|
||||
current.removeAttr("aria-describedby");
|
||||
this.tooltip.attr("aria-hidden", "true");
|
||||
|
||||
this.tooltip.stop(false, true).fadeOut();
|
||||
target.unbind( "mouseleave.tooltip blur.tooltip" );
|
||||
|
||||
this._trigger( "close", event );
|
||||
},
|
||||
|
||||
_tooltip: function() {
|
||||
var tooltip = $( "<div></div>" )
|
||||
.attr( "id", "ui-tooltip-" + increments++ )
|
||||
.attr( "role", "tooltip" )
|
||||
.addClass( "ui-tooltip ui-widget ui-corner-all ui-widget-content" );
|
||||
if (this.options.tooltipClass) {
|
||||
tooltip.addClass(this.options.tooltipClass);
|
||||
}
|
||||
$( "<div></div>" )
|
||||
.addClass( "ui-tooltip-content" )
|
||||
.appendTo( tooltip );
|
||||
tooltip.appendTo( document.body );
|
||||
return tooltip;
|
||||
},
|
||||
|
||||
_find: function( target ) {
|
||||
var id = target.attr( "aria-describedby" );
|
||||
return id ? $( document.getElementById( id ) ) : $();
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
5
ui/jquery.ui.widget.js
vendored
5
ui/jquery.ui.widget.js
vendored
@ -155,7 +155,10 @@ $.Widget.prototype = {
|
||||
widgetEventPrefix: "",
|
||||
defaultElement: "<div>",
|
||||
options: {
|
||||
disabled: false
|
||||
disabled: false,
|
||||
|
||||
// callbacks
|
||||
create: null
|
||||
},
|
||||
_createWidget: function( options, element ) {
|
||||
element = $( element || this.defaultElement || this )[ 0 ];
|
||||
|
||||
Loading…
Reference in New Issue
Block a user