Merged in /branches/dev r3251:3620 (excluding autocomplete, modal, tooltip, menu; including menu static tests).

This commit is contained in:
Scott González 2010-01-07 03:19:50 +00:00
parent 975b02a82c
commit 90fb45dffa
72 changed files with 3226 additions and 1756 deletions

View File

@ -0,0 +1,46 @@
<!doctype html>
<html lang="en">
<head>
<title>jQuery UI Button - Checkboxes demo</title>
<link type="text/css" href="../../themes/base/ui.all.css" rel="stylesheet" />
<script type="text/javascript" src="../../jquery-1.3.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.button.js"></script>
<link type="text/css" href="../demos.css" rel="stylesheet" />
<script type="text/javascript">
$(function() {
$("#check").button();
$("#format").buttonset();
});
</script>
<style>
#format { margin-top: 2em; }
</style>
</head>
<body>
<div class="demo">
<input type="checkbox" id="check" /><label for="check">Toggle</label>
<div id="format">
<input type="checkbox" id="check1" /><label for="check1">B</label>
<input type="checkbox" id="check2" /><label for="check2">I</label>
<input type="checkbox" id="check3" /><label for="check3">U</label>
</div>
</div><!-- End demo -->
<div class="demo-description">
<p>TODO</p>
</div><!-- End demo-description -->
</body>
</html>

43
demos/button/default.html Normal file
View File

@ -0,0 +1,43 @@
<!doctype html>
<html lang="en">
<head>
<title>jQuery UI Button - Default demo</title>
<link type="text/css" href="../../themes/base/ui.all.css" rel="stylesheet" />
<script type="text/javascript" src="../../jquery-1.3.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.button.js"></script>
<link type="text/css" href="../demos.css" rel="stylesheet" />
<script type="text/javascript">
$(function() {
$("button, input:submit, a").button();
});
</script>
<style>
</style>
</head>
<body>
<div class="demo">
<button>A button element</button>
<input type="submit" value="A submit button">
<a href="#">An anchor</a>
</div><!-- End demo -->
<div class="demo-description">
<p>Examples of the markup that can be used for buttons: A button element, an input of type submit and an anchor.</p>
</div><!-- End demo-description -->
</body>
</html>

62
demos/button/icons.html Normal file
View File

@ -0,0 +1,62 @@
<!doctype html>
<html lang="en">
<head>
<title>jQuery UI Button - Icons demo</title>
<link type="text/css" href="../../themes/base/ui.all.css" rel="stylesheet" />
<script type="text/javascript" src="../../jquery-1.3.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.button.js"></script>
<link type="text/css" href="../demos.css" rel="stylesheet" />
<script type="text/javascript">
$(function() {
$("button:first").button({
icons: {
primary: 'ui-icon-locked'
},
text: false
}).next().button({
icons: {
primary: 'ui-icon-locked'
}
}).next().button({
icons: {
primary: 'ui-icon-gear',
secondary: 'ui-icon-triangle-1-s'
}
}).next().button({
icons: {
primary: 'ui-icon-gear',
secondary: 'ui-icon-triangle-1-s'
},
text: false
});
});
</script>
<style>
</style>
</head>
<body>
<div class="demo">
<button>Button with icon only</button>
<button>Button with icon on the left</button>
<button>Button with two icons</button>
<button>Button with two icons and no text</button>
</div><!-- End demo -->
<div class="demo-description">
<p>Some buttons with various combinations of text and icons, here specified via metadata.</p>
</div><!-- End demo-description -->
</body>
</html>

22
demos/button/index.html Normal file
View File

@ -0,0 +1,22 @@
<!doctype html>
<html lang="en">
<head>
<title>jQuery UI Button Demos</title>
<link type="text/css" href="../demos.css" rel="stylesheet" />
</head>
<body>
<div class="demos-nav">
<h4>Examples</h4>
<ul>
<li class="demo-config-on"><a href="default.html">Default functionality</a></li>
<li><a href="radio.html">Radios</a></li>
<li><a href="checkbox.html">Checkboxes</a></li>
<li><a href="icons.html">Icons</a></li>
<li><a href="toolbar.html">Toolbar</a></li>
<li><a href="splitbutton.html">Split Button</a></li>
</ul>
</div>
</body>
</html>

45
demos/button/radio.html Normal file
View File

@ -0,0 +1,45 @@
<!doctype html>
<html lang="en">
<head>
<title>jQuery UI Button - Radio Buttons demo</title>
<link type="text/css" href="../../themes/base/ui.all.css" rel="stylesheet" />
<script type="text/javascript" src="../../jquery-1.3.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.button.js"></script>
<link type="text/css" href="../demos.css" rel="stylesheet" />
<script type="text/javascript">
$(function() {
$("#radio1").buttonset();
});
</script>
<style>
</style>
</head>
<body>
<div class="demo">
<form>
<div id="radio1">
<input type="radio" id="radio1" name="radio" /><label for="radio1">Choice 1</label>
<input type="radio" id="radio2" name="radio" checked="checked" /><label for="radio2">Choice 2</label>
<input type="radio" id="radio3" name="radio" /><label for="radio3">Choice 3</label>
</div>
</form>
</div><!-- End demo -->
<div class="demo-description">
<p>A set of three radio buttons transformed into a button set.</p>
</div><!-- End demo-description -->
</body>
</html>

View File

@ -0,0 +1,57 @@
<!doctype html>
<html lang="en">
<head>
<title>jQuery UI Button - Default demo</title>
<link type="text/css" href="../../themes/base/ui.all.css" rel="stylesheet" />
<script type="text/javascript" src="../../jquery-1.3.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.button.js"></script>
<link type="text/css" href="../demos.css" rel="stylesheet" />
<script type="text/javascript">
$(function() {
$("#rerun").button().click(function() {
alert("Running the last action");
})
.next()
.button({
text: false,
icons: {
primary: "ui-icon-triangle-1-s"
}
})
.click(function() {
alert("Could display a menu to select an action");
})
.parent()
.buttonset();
});
</script>
<style>
</style>
</head>
<body>
<div class="demo">
<div>
<button id="rerun">Run last action</button>
<button id="select">Select an action</button>
</div>
</div><!-- End demo -->
<div class="demo-description">
<p>An example of a split button built with two buttons: A plan button with just text, one with only a primary icon
and no text. Both are grouped together in a set.</p>
</div><!-- End demo-description -->
</body>
</html>

123
demos/button/toolbar.html Normal file
View File

@ -0,0 +1,123 @@
<!doctype html>
<html lang="en">
<head>
<title>jQuery UI Button - Toolbar demo</title>
<link type="text/css" href="../../themes/base/ui.all.css" rel="stylesheet" />
<script type="text/javascript" src="../../jquery-1.3.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.button.js"></script>
<link type="text/css" href="../demos.css" rel="stylesheet" />
<style type="text/css">
#toolbar {
padding: 10px 4px;
}
</style>
<script type="text/javascript">
$(function() {
$('#beginning').button({
text: false,
icons: {
primary: 'ui-icon-seek-start'
}
});
$('#rewind').button({
text: false,
icons: {
primary: 'ui-icon-seek-prev'
}
});
$('#play').button({
text: false,
icons: {
primary: 'ui-icon-play'
}
})
.click(function() {
var options;
if ($(this).text() == 'play') {
options = {
label: 'pause',
icons: {
primary: 'ui-icon-pause'
}
};
} else {
options = {
label: 'play',
icons: {
primary: 'ui-icon-play'
}
};
}
$(this).button('option', options);
});
$('#stop').button({
text: false,
icons: {
primary: 'ui-icon-stop'
}
})
.click(function() {
$('#play').button('option', {
label: 'play',
icons: {
primary: 'ui-icon-play'
}
});
});
$('#forward').button({
text: false,
icons: {
primary: 'ui-icon-seek-next'
}
});
$('#end').button({
text: false,
icons: {
primary: 'ui-icon-seek-end'
}
});
$("#shuffle").button();
$("#repeat").buttonset();
});
</script>
</head>
<body>
<div class="demo">
<span id="toolbar" class="ui-widget-header ui-corner-all">
<button id="beginning">go to beginning</button>
<button id="rewind">rewind</button>
<button id="play">play</button>
<button id="stop">stop</button>
<button id="forward">fast forward</button>
<button id="end">go to end</button>
<input type="checkbox" id="shuffle" /><label for="shuffle">Shuffle</label>
<span id="repeat">
<input type="radio" id="repeat0" name="repeat" checked="checked" /><label for="repeat0">No Repeat</label>
<input type="radio" id="repeat1" name="repeat" /><label for="repeat1">Once</label>
<input type="radio" id="repeatall" name="repeat" /><label for="repeatall">All</label>
</span>
</span>
</div><!-- End demo -->
<div class="demo-description">
<p>
A mediaplayer toolbar. Take a look at the underlying markup: A few button elements,
an input of type checkbox for the Shuffle button, and three inputs of type radio for the Repeat options.
</p>
</div><!-- End demo-description -->
</body>
</html>

View File

@ -1,33 +1,33 @@
<!doctype html> <!doctype html>
<html lang="en"> <html lang="en">
<head> <head>
<title>jQuery UI Datepicker - Dates in other months</title> <title>jQuery UI Datepicker - Dates in other months</title>
<link type="text/css" href="../../themes/base/ui.all.css" rel="stylesheet" /> <link type="text/css" href="../../themes/base/ui.all.css" rel="stylesheet" />
<script type="text/javascript" src="../../jquery-1.3.2.js"></script> <script type="text/javascript" src="../../jquery-1.3.2.js"></script>
<script type="text/javascript" src="../../ui/jquery.ui.core.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.widget.js"></script>
<script type="text/javascript" src="../../ui/jquery.ui.datepicker.js"></script> <script type="text/javascript" src="../../ui/jquery.ui.datepicker.js"></script>
<link type="text/css" href="../demos.css" rel="stylesheet" /> <link type="text/css" href="../demos.css" rel="stylesheet" />
<script type="text/javascript"> <script type="text/javascript">
$(function() { $(function() {
$("#datepicker").datepicker({showOtherMonths: true, selectOtherMonths: true}); $("#datepicker").datepicker({showOtherMonths: true, selectOtherMonths: true});
}); });
</script> </script>
</head> </head>
<body> <body>
<div class="demo"> <div class="demo">
<p>Date: <input type="text" id="datepicker"></p> <p>Date: <input type="text" id="datepicker"></p>
</div><!-- End demo --> </div><!-- End demo -->
<div class="demo-description"> <div class="demo-description">
<p>The datepicker can show dates that come from other than the main month <p>The datepicker can show dates that come from other than the main month
being displayed. These other dates can also be made selectable.</p> being displayed. These other dates can also be made selectable.</p>
</div><!-- End demo-description --> </div><!-- End demo-description -->
</body> </body>
</html> </html>

View File

@ -1,35 +1,35 @@
<!doctype html> <!doctype html>
<html lang="en"> <html lang="en">
<head> <head>
<title>jQuery UI Datepicker - Show week of the year</title> <title>jQuery UI Datepicker - Show week of the year</title>
<link type="text/css" href="../../themes/base/ui.all.css" rel="stylesheet" /> <link type="text/css" href="../../themes/base/ui.all.css" rel="stylesheet" />
<script type="text/javascript" src="../../jquery-1.3.2.js"></script> <script type="text/javascript" src="../../jquery-1.3.2.js"></script>
<script type="text/javascript" src="../../ui/jquery.ui.core.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.widget.js"></script>
<script type="text/javascript" src="../../ui/jquery.ui.datepicker.js"></script> <script type="text/javascript" src="../../ui/jquery.ui.datepicker.js"></script>
<link type="text/css" href="../demos.css" rel="stylesheet" /> <link type="text/css" href="../demos.css" rel="stylesheet" />
<script type="text/javascript"> <script type="text/javascript">
$(function() { $(function() {
$("#datepicker").datepicker({showWeek: true, firstDay: 1}); $("#datepicker").datepicker({showWeek: true, firstDay: 1});
}); });
</script> </script>
</head> </head>
<body> <body>
<div class="demo"> <div class="demo">
<p>Date: <input type="text" id="datepicker"></p> <p>Date: <input type="text" id="datepicker"></p>
</div><!-- End demo --> </div><!-- End demo -->
<div class="demo-description"> <div class="demo-description">
<p>The datepicker can show the week of the year. The default calculation follows <p>The datepicker can show the week of the year. The default calculation follows
the ISO 8601 definition: the week starts on Monday, the first week of the year the ISO 8601 definition: the week starts on Monday, the first week of the year
contains the first Thursday of the year. This means that some days from one contains the first Thursday of the year. This means that some days from one
year may be placed into weeks 'belonging' to another year.</p> year may be placed into weeks 'belonging' to another year.</p>
</div><!-- End demo-description --> </div><!-- End demo-description -->
</body> </body>
</html> </html>

View File

@ -17,7 +17,7 @@
<script type="text/javascript" src="../../ui/jquery.effects.explode.js"></script> <script type="text/javascript" src="../../ui/jquery.effects.explode.js"></script>
<link type="text/css" href="../demos.css" rel="stylesheet" /> <link type="text/css" href="../demos.css" rel="stylesheet" />
<script type="text/javascript"> <script type="text/javascript">
$.ui.dialog.defaults.stackfix = true; $.ui.dialog.prototype.options.stackfix = true;
// increase the default animation speed to exaggerate the effect // increase the default animation speed to exaggerate the effect
$.fx.speeds._default = 1000; $.fx.speeds._default = 1000;
$(function() { $(function() {

View File

@ -14,7 +14,7 @@
<script type="text/javascript" src="../../ui/jquery.ui.dialog.js"></script> <script type="text/javascript" src="../../ui/jquery.ui.dialog.js"></script>
<link type="text/css" href="../demos.css" rel="stylesheet" /> <link type="text/css" href="../demos.css" rel="stylesheet" />
<script type="text/javascript"> <script type="text/javascript">
$.ui.dialog.defaults.stackfix = true; $.ui.dialog.prototype.options.stackfix = true;
$(function() { $(function() {
$("#dialog").dialog(); $("#dialog").dialog();
}); });

View File

@ -7,6 +7,7 @@
<script type="text/javascript" src="../../ui/jquery.ui.core.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.widget.js"></script>
<script type="text/javascript" src="../../ui/jquery.ui.mouse.js"></script> <script type="text/javascript" src="../../ui/jquery.ui.mouse.js"></script>
<script type="text/javascript" src="../../ui/jquery.ui.button.js"></script>
<script type="text/javascript" src="../../ui/jquery.ui.draggable.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.position.js"></script>
<script type="text/javascript" src="../../ui/jquery.ui.resizable.js"></script> <script type="text/javascript" src="../../ui/jquery.ui.resizable.js"></script>

View File

@ -7,6 +7,7 @@
<script type="text/javascript" src="../../ui/jquery.ui.core.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.widget.js"></script>
<script type="text/javascript" src="../../ui/jquery.ui.mouse.js"></script> <script type="text/javascript" src="../../ui/jquery.ui.mouse.js"></script>
<script type="text/javascript" src="../../ui/jquery.ui.button.js"></script>
<script type="text/javascript" src="../../ui/jquery.ui.draggable.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.position.js"></script>
<script type="text/javascript" src="../../ui/jquery.ui.resizable.js"></script> <script type="text/javascript" src="../../ui/jquery.ui.resizable.js"></script>
@ -23,7 +24,6 @@
div#users-contain { width: 350px; margin: 20px 0; } div#users-contain { width: 350px; margin: 20px 0; }
div#users-contain table { margin: 1em 0; border-collapse: collapse; width: 100%; } div#users-contain table { margin: 1em 0; border-collapse: collapse; width: 100%; }
div#users-contain table td, div#users-contain table th { border: 1px solid #eee; padding: .6em 10px; text-align: left; } div#users-contain table td, div#users-contain table th { border: 1px solid #eee; padding: .6em 10px; text-align: left; }
.ui-button { outline: 0; margin: 0; padding: .4em 1em .5em; text-decoration: none; cursor: pointer; position: relative; text-align: center; }
.ui-dialog .ui-state-error { padding: .3em; } .ui-dialog .ui-state-error { padding: .3em; }
.validateTips { border: 1px solid transparent; padding: 0.3em; } .validateTips { border: 1px solid transparent; padding: 0.3em; }
@ -112,29 +112,11 @@
$('#create-user').click(function() { $('#create-user')
$('#dialog-form').dialog('open'); .button()
}) .click(function() {
.hover( $('#dialog-form').dialog('open');
function() { });
$(this).addClass("ui-state-hover");
},
function() {
$(this).removeClass("ui-state-hover");
}
)
.focus(function() {
$(this).addClass('ui-state-focus');
})
.blur(function() {
$(this).removeClass('ui-state-focus');
})
.mousedown(function() {
$(this).addClass("ui-state-active");
})
.mouseup(function() {
$(this).removeClass("ui-state-active");
});
}); });
</script> </script>
@ -181,7 +163,7 @@
</tbody> </tbody>
</table> </table>
</div> </div>
<button id="create-user" class="ui-button ui-state-default ui-corner-all">Create new user</button> <button id="create-user">Create new user</button>
</div><!-- End demo --> </div><!-- End demo -->

View File

@ -7,6 +7,7 @@
<script type="text/javascript" src="../../ui/jquery.ui.core.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.widget.js"></script>
<script type="text/javascript" src="../../ui/jquery.ui.mouse.js"></script> <script type="text/javascript" src="../../ui/jquery.ui.mouse.js"></script>
<script type="text/javascript" src="../../ui/jquery.ui.button.js"></script>
<script type="text/javascript" src="../../ui/jquery.ui.draggable.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.position.js"></script>
<script type="text/javascript" src="../../ui/jquery.ui.resizable.js"></script> <script type="text/javascript" src="../../ui/jquery.ui.resizable.js"></script>

View File

@ -11,6 +11,7 @@
<script type="text/javascript" src="../ui/jquery.ui.mouse.js"></script> <script type="text/javascript" src="../ui/jquery.ui.mouse.js"></script>
<script type="text/javascript" src="../ui/jquery.ui.stackfix.js"></script> <script type="text/javascript" src="../ui/jquery.ui.stackfix.js"></script>
<script type="text/javascript" src="../ui/jquery.ui.accordion.js"></script> <script type="text/javascript" src="../ui/jquery.ui.accordion.js"></script>
<script type="text/javascript" src="../ui/jquery.ui.button.js"></script>
<script type="text/javascript" src="../ui/jquery.ui.datepicker.js"></script> <script type="text/javascript" src="../ui/jquery.ui.datepicker.js"></script>
<script type="text/javascript" src="../ui/jquery.ui.dialog.js"></script> <script type="text/javascript" src="../ui/jquery.ui.dialog.js"></script>
<script type="text/javascript" src="../ui/jquery.ui.draggable.js"></script> <script type="text/javascript" src="../ui/jquery.ui.draggable.js"></script>
@ -255,6 +256,7 @@
<dd><a href="sortable/index.html">Sortable</a></dd> <dd><a href="sortable/index.html">Sortable</a></dd>
<dt>Widgets</dt> <dt>Widgets</dt>
<dd><a href="accordion/index.html">Accordion</a></dd> <dd><a href="accordion/index.html">Accordion</a></dd>
<dd><a href="button/index.html">Button</a></dd>
<dd><a href="datepicker/index.html">Datepicker</a></dd> <dd><a href="datepicker/index.html">Datepicker</a></dd>
<dd><a href="dialog/index.html">Dialog</a></dd> <dd><a href="dialog/index.html">Dialog</a></dd>
<dd><a href="progressbar/index.html">Progressbar</a></dd> <dd><a href="progressbar/index.html">Progressbar</a></dd>

View File

@ -6,7 +6,6 @@
<script type="text/javascript" src="../../jquery-1.3.2.js"></script> <script type="text/javascript" src="../../jquery-1.3.2.js"></script>
<script type="text/javascript" src="../../ui/jquery.ui.core.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.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.position.js"></script>
<link type="text/css" href="../demos.css" rel="stylesheet" /> <link type="text/css" href="../demos.css" rel="stylesheet" />
@ -23,7 +22,7 @@
$.fn.position2 = function(options) { $.fn.position2 = function(options) {
return this.position($.extend({ return this.position($.extend({
of: window, of: window,
by: function(to) { using: function(to) {
$(this).css({ $(this).css({
top: to.top, top: to.top,
left: to.left left: to.left
@ -33,27 +32,27 @@
}, options)); }, options));
} }
$.fn.left = function(by) { $.fn.left = function(using) {
return this.position2({ return this.position2({
my: "right middle", my: "right middle",
at: "left middle", at: "left middle",
offset: "25 0", offset: "25 0",
by: by using: using
}); });
} }
$.fn.right = function(by) { $.fn.right = function(using) {
return this.position2({ return this.position2({
my: "left middle", my: "left middle",
at: "right middle", at: "right middle",
offset: "-25 0", offset: "-25 0",
by: by using: using
}); });
} }
$.fn.center = function(by) { $.fn.center = function(using) {
return this.position2({ return this.position2({
my: "center middle", my: "center middle",
at: "center middle", at: "center middle",
by: by using: using
}); });
}; };

View File

@ -6,6 +6,7 @@
<script type="text/javascript" src="../../jquery-1.3.2.js"></script> <script type="text/javascript" src="../../jquery-1.3.2.js"></script>
<script type="text/javascript" src="../../ui/jquery.ui.core.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.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.draggable.js"></script>
<script type="text/javascript" src="../../ui/jquery.ui.position.js"></script> <script type="text/javascript" src="../../ui/jquery.ui.position.js"></script>
<link type="text/css" href="../demos.css" rel="stylesheet" /> <link type="text/css" href="../demos.css" rel="stylesheet" />
@ -44,23 +45,23 @@
<script type="text/javascript"> <script type="text/javascript">
$(function() { $(function() {
function position(by) { function position(using) {
$('.positionable').position({ $('.positionable').position({
of: $('#parent'), of: $('#parent'),
my: $('#my_horizontal').val() + ' ' + $('#my_vertical').val(), my: $('#my_horizontal').val() + ' ' + $('#my_vertical').val(),
at: $('#at_horizontal').val() + ' '+ $('#at_vertical').val(), at: $('#at_horizontal').val() + ' '+ $('#at_vertical').val(),
offset: $('#offset').val(), offset: $('#offset').val(),
by: by, using: using,
collision: $("#collision_horizontal").val() + ' ' + $("#collision_vertical").val() collision: $("#collision_horizontal").val() + ' ' + $("#collision_vertical").val()
}); });
} }
$('.positionable').css("opacity", 0.5); $('.positionable').css("opacity", 0.5);
$(':input').bind('click keyup change', position); $(':input').bind('click keyup change', function() { position(); });
$("#parent").draggable({ $("#parent").draggable({
drag: position drag: function() { position(); }
}); });
$('.positionable').draggable({ $('.positionable').draggable({

View File

@ -18,7 +18,7 @@
<script type="text/javascript"> <script type="text/javascript">
$(function() { $(function() {
// change defaults for range, animate and orientation // change defaults for range, animate and orientation
$.extend($.ui.slider.defaults, { $.extend($.ui.slider.prototype.options, {
range: "min", range: "min",
animate: true, animate: true,
orientation: "vertical" orientation: "vertical"

View File

@ -1,66 +1,66 @@
<!doctype html> <!doctype html>
<html lang="en"> <html lang="en">
<head> <head>
<title>jQuery UI Slider - Snap to increments</title> <title>jQuery UI Slider - Snap to increments</title>
<link type="text/css" href="../../themes/base/ui.all.css" rel="stylesheet" /> <link type="text/css" href="../../themes/base/ui.all.css" rel="stylesheet" />
<script type="text/javascript" src="../../jquery-1.3.2.js"></script> <script type="text/javascript" src="../../jquery-1.3.2.js"></script>
<script type="text/javascript" src="../../ui/jquery.ui.core.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.widget.js"></script>
<script type="text/javascript" src="../../ui/jquery.ui.mouse.js"></script> <script type="text/javascript" src="../../ui/jquery.ui.mouse.js"></script>
<script type="text/javascript" src="../../ui/jquery.ui.tabs.js"></script> <script type="text/javascript" src="../../ui/jquery.ui.tabs.js"></script>
<script type="text/javascript" src="../../ui/jquery.ui.slider.js"></script> <script type="text/javascript" src="../../ui/jquery.ui.slider.js"></script>
<link type="text/css" href="../demos.css" rel="stylesheet" /> <link type="text/css" href="../demos.css" rel="stylesheet" />
<style type="text/css"> <style type="text/css">
#demo-frame > div.demo { padding: 10px !important; } #demo-frame > div.demo { padding: 10px !important; }
</style> </style>
<script type="text/javascript"> <script type="text/javascript">
$(function() { $(function() {
$("#tabs").tabs({ $("#tabs").tabs({
select: function(event, ui) { select: function(event, ui) {
$("#slider").slider("value", ui.index); $("#slider").slider("value", ui.index);
} }
}); });
$("#slider").slider({ $("#slider").slider({
min: 0, min: 0,
max: $("#tabs").tabs("length") - 1, max: $("#tabs").tabs("length") - 1,
slide: function(event, ui) { slide: function(event, ui) {
$("#tabs").tabs("select", ui.value); $("#tabs").tabs("select", ui.value);
} }
}); });
}); });
</script> </script>
</head> </head>
<body> <body>
<div class="demo"> <div class="demo">
<div id="slider" style="width:100px"></div> <div id="slider" style="width:100px"></div>
<div id="tabs"> <div id="tabs">
<ul> <ul>
<li><a href="#tabs-1">Nunc tincidunt</a></li> <li><a href="#tabs-1">Nunc tincidunt</a></li>
<li><a href="#tabs-2">Proin dolor</a></li> <li><a href="#tabs-2">Proin dolor</a></li>
<li><a href="#tabs-3">Aenean lacinia</a></li> <li><a href="#tabs-3">Aenean lacinia</a></li>
</ul> </ul>
<div id="tabs-1"> <div id="tabs-1">
<p>Proin elit arcu, rutrum commodo, vehicula tempus, commodo a, risus. Curabitur nec arcu. Donec sollicitudin mi sit amet mauris. Nam elementum quam ullamcorper ante. Etiam aliquet massa et lorem. Mauris dapibus lacus auctor risus. Aenean tempor ullamcorper leo. Vivamus sed magna quis ligula eleifend adipiscing. Duis orci. Aliquam sodales tortor vitae ipsum. Aliquam nulla. Duis aliquam molestie erat. Ut et mauris vel pede varius sollicitudin. Sed ut dolor nec orci tincidunt interdum. Phasellus ipsum. Nunc tristique tempus lectus.</p> <p>Proin elit arcu, rutrum commodo, vehicula tempus, commodo a, risus. Curabitur nec arcu. Donec sollicitudin mi sit amet mauris. Nam elementum quam ullamcorper ante. Etiam aliquet massa et lorem. Mauris dapibus lacus auctor risus. Aenean tempor ullamcorper leo. Vivamus sed magna quis ligula eleifend adipiscing. Duis orci. Aliquam sodales tortor vitae ipsum. Aliquam nulla. Duis aliquam molestie erat. Ut et mauris vel pede varius sollicitudin. Sed ut dolor nec orci tincidunt interdum. Phasellus ipsum. Nunc tristique tempus lectus.</p>
</div> </div>
<div id="tabs-2"> <div id="tabs-2">
<p>Morbi tincidunt, dui sit amet facilisis feugiat, odio metus gravida ante, ut pharetra massa metus id nunc. Duis scelerisque molestie turpis. Sed fringilla, massa eget luctus malesuada, metus eros molestie lectus, ut tempus eros massa ut dolor. Aenean aliquet fringilla sem. Suspendisse sed ligula in ligula suscipit aliquam. Praesent in eros vestibulum mi adipiscing adipiscing. Morbi facilisis. Curabitur ornare consequat nunc. Aenean vel metus. Ut posuere viverra nulla. Aliquam erat volutpat. Pellentesque convallis. Maecenas feugiat, tellus pellentesque pretium posuere, felis lorem euismod felis, eu ornare leo nisi vel felis. Mauris consectetur tortor et purus.</p> <p>Morbi tincidunt, dui sit amet facilisis feugiat, odio metus gravida ante, ut pharetra massa metus id nunc. Duis scelerisque molestie turpis. Sed fringilla, massa eget luctus malesuada, metus eros molestie lectus, ut tempus eros massa ut dolor. Aenean aliquet fringilla sem. Suspendisse sed ligula in ligula suscipit aliquam. Praesent in eros vestibulum mi adipiscing adipiscing. Morbi facilisis. Curabitur ornare consequat nunc. Aenean vel metus. Ut posuere viverra nulla. Aliquam erat volutpat. Pellentesque convallis. Maecenas feugiat, tellus pellentesque pretium posuere, felis lorem euismod felis, eu ornare leo nisi vel felis. Mauris consectetur tortor et purus.</p>
</div> </div>
<div id="tabs-3"> <div id="tabs-3">
<p>Mauris eleifend est et turpis. Duis id erat. Suspendisse potenti. Aliquam vulputate, pede vel vehicula accumsan, mi neque rutrum erat, eu congue orci lorem eget lorem. Vestibulum non ante. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Fusce sodales. Quisque eu urna vel enim commodo pellentesque. Praesent eu risus hendrerit ligula tempus pretium. Curabitur lorem enim, pretium nec, feugiat nec, luctus a, lacus.</p> <p>Mauris eleifend est et turpis. Duis id erat. Suspendisse potenti. Aliquam vulputate, pede vel vehicula accumsan, mi neque rutrum erat, eu congue orci lorem eget lorem. Vestibulum non ante. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Fusce sodales. Quisque eu urna vel enim commodo pellentesque. Praesent eu risus hendrerit ligula tempus pretium. Curabitur lorem enim, pretium nec, feugiat nec, luctus a, lacus.</p>
<p>Duis cursus. Maecenas ligula eros, blandit nec, pharetra at, semper at, magna. Nullam ac lacus. Nulla facilisi. Praesent viverra justo vitae neque. Praesent blandit adipiscing velit. Suspendisse potenti. Donec mattis, pede vel pharetra blandit, magna ligula faucibus eros, id euismod lacus dolor eget odio. Nam scelerisque. Donec non libero sed nulla mattis commodo. Ut sagittis. Donec nisi lectus, feugiat porttitor, tempor ac, tempor vitae, pede. Aenean vehicula velit eu tellus interdum rutrum. Maecenas commodo. Pellentesque nec elit. Fusce in lacus. Vivamus a libero vitae lectus hendrerit hendrerit.</p> <p>Duis cursus. Maecenas ligula eros, blandit nec, pharetra at, semper at, magna. Nullam ac lacus. Nulla facilisi. Praesent viverra justo vitae neque. Praesent blandit adipiscing velit. Suspendisse potenti. Donec mattis, pede vel pharetra blandit, magna ligula faucibus eros, id euismod lacus dolor eget odio. Nam scelerisque. Donec non libero sed nulla mattis commodo. Ut sagittis. Donec nisi lectus, feugiat porttitor, tempor ac, tempor vitae, pede. Aenean vehicula velit eu tellus interdum rutrum. Maecenas commodo. Pellentesque nec elit. Fusce in lacus. Vivamus a libero vitae lectus hendrerit hendrerit.</p>
</div> </div>
</div> </div>
</div><!-- End demo --> </div><!-- End demo -->
<div class="demo-description"> <div class="demo-description">
<p>Control tabs with a slider.</p> <p>Control tabs with a slider.</p>
</div><!-- End demo-description --> </div><!-- End demo-description -->
</body> </body>
</html> </html>

View File

@ -1,59 +1,59 @@
<!doctype html> <!doctype html>
<html lang="en"> <html lang="en">
<head> <head>
<title>jQuery UI Tabs - Tabs at bottom</title> <title>jQuery UI Tabs - Tabs at bottom</title>
<link type="text/css" href="../../themes/base/ui.all.css" rel="stylesheet" /> <link type="text/css" href="../../themes/base/ui.all.css" rel="stylesheet" />
<script type="text/javascript" src="../../jquery-1.3.2.js"></script> <script type="text/javascript" src="../../jquery-1.3.2.js"></script>
<script type="text/javascript" src="../../ui/jquery.ui.core.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.widget.js"></script>
<script type="text/javascript" src="../../ui/jquery.ui.tabs.js"></script> <script type="text/javascript" src="../../ui/jquery.ui.tabs.js"></script>
<link type="text/css" href="../demos.css" rel="stylesheet" /> <link type="text/css" href="../demos.css" rel="stylesheet" />
<script type="text/javascript"> <script type="text/javascript">
$(function() { $(function() {
$("#tabs").tabs(); $("#tabs").tabs();
$(".tabs-bottom .ui-tabs-nav, .tabs-bottom .ui-tabs-nav > *") $(".tabs-bottom .ui-tabs-nav, .tabs-bottom .ui-tabs-nav > *")
.removeClass("ui-corner-all ui-corner-top") .removeClass("ui-corner-all ui-corner-top")
.addClass("ui-corner-bottom"); .addClass("ui-corner-bottom");
}); });
</script> </script>
<style> <style>
#tabs { height: 200px; } #tabs { height: 200px; }
.tabs-bottom { position: relative; } .tabs-bottom { position: relative; }
.tabs-bottom .ui-tabs-panel { height: 140px; overflow: auto; } .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 { 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; } .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; } .ui-tabs-selected { margin-top: -3px !important; }
</style> </style>
</head> </head>
<body> <body>
<div class="demo"> <div class="demo">
<div id="tabs" class="tabs-bottom"> <div id="tabs" class="tabs-bottom">
<ul> <ul>
<li><a href="#tabs-1">Nunc tincidunt</a></li> <li><a href="#tabs-1">Nunc tincidunt</a></li>
<li><a href="#tabs-2">Proin dolor</a></li> <li><a href="#tabs-2">Proin dolor</a></li>
<li><a href="#tabs-3">Aenean lacinia</a></li> <li><a href="#tabs-3">Aenean lacinia</a></li>
</ul> </ul>
<div id="tabs-1"> <div id="tabs-1">
<p>Proin elit arcu, rutrum commodo, vehicula tempus, commodo a, risus. Curabitur nec arcu. Donec sollicitudin mi sit amet mauris. Nam elementum quam ullamcorper ante. Etiam aliquet massa et lorem. Mauris dapibus lacus auctor risus. Aenean tempor ullamcorper leo. Vivamus sed magna quis ligula eleifend adipiscing. Duis orci. Aliquam sodales tortor vitae ipsum. Aliquam nulla. Duis aliquam molestie erat. Ut et mauris vel pede varius sollicitudin. Sed ut dolor nec orci tincidunt interdum. Phasellus ipsum. Nunc tristique tempus lectus.</p> <p>Proin elit arcu, rutrum commodo, vehicula tempus, commodo a, risus. Curabitur nec arcu. Donec sollicitudin mi sit amet mauris. Nam elementum quam ullamcorper ante. Etiam aliquet massa et lorem. Mauris dapibus lacus auctor risus. Aenean tempor ullamcorper leo. Vivamus sed magna quis ligula eleifend adipiscing. Duis orci. Aliquam sodales tortor vitae ipsum. Aliquam nulla. Duis aliquam molestie erat. Ut et mauris vel pede varius sollicitudin. Sed ut dolor nec orci tincidunt interdum. Phasellus ipsum. Nunc tristique tempus lectus.</p>
</div> </div>
<div id="tabs-2"> <div id="tabs-2">
<p>Morbi tincidunt, dui sit amet facilisis feugiat, odio metus gravida ante, ut pharetra massa metus id nunc. Duis scelerisque molestie turpis. Sed fringilla, massa eget luctus malesuada, metus eros molestie lectus, ut tempus eros massa ut dolor. Aenean aliquet fringilla sem. Suspendisse sed ligula in ligula suscipit aliquam. Praesent in eros vestibulum mi adipiscing adipiscing. Morbi facilisis. Curabitur ornare consequat nunc. Aenean vel metus. Ut posuere viverra nulla. Aliquam erat volutpat. Pellentesque convallis. Maecenas feugiat, tellus pellentesque pretium posuere, felis lorem euismod felis, eu ornare leo nisi vel felis. Mauris consectetur tortor et purus.</p> <p>Morbi tincidunt, dui sit amet facilisis feugiat, odio metus gravida ante, ut pharetra massa metus id nunc. Duis scelerisque molestie turpis. Sed fringilla, massa eget luctus malesuada, metus eros molestie lectus, ut tempus eros massa ut dolor. Aenean aliquet fringilla sem. Suspendisse sed ligula in ligula suscipit aliquam. Praesent in eros vestibulum mi adipiscing adipiscing. Morbi facilisis. Curabitur ornare consequat nunc. Aenean vel metus. Ut posuere viverra nulla. Aliquam erat volutpat. Pellentesque convallis. Maecenas feugiat, tellus pellentesque pretium posuere, felis lorem euismod felis, eu ornare leo nisi vel felis. Mauris consectetur tortor et purus.</p>
</div> </div>
<div id="tabs-3"> <div id="tabs-3">
<p>Mauris eleifend est et turpis. Duis id erat. Suspendisse potenti. Aliquam vulputate, pede vel vehicula accumsan, mi neque rutrum erat, eu congue orci lorem eget lorem. Vestibulum non ante. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Fusce sodales. Quisque eu urna vel enim commodo pellentesque. Praesent eu risus hendrerit ligula tempus pretium. Curabitur lorem enim, pretium nec, feugiat nec, luctus a, lacus.</p> <p>Mauris eleifend est et turpis. Duis id erat. Suspendisse potenti. Aliquam vulputate, pede vel vehicula accumsan, mi neque rutrum erat, eu congue orci lorem eget lorem. Vestibulum non ante. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Fusce sodales. Quisque eu urna vel enim commodo pellentesque. Praesent eu risus hendrerit ligula tempus pretium. Curabitur lorem enim, pretium nec, feugiat nec, luctus a, lacus.</p>
<p>Duis cursus. Maecenas ligula eros, blandit nec, pharetra at, semper at, magna. Nullam ac lacus. Nulla facilisi. Praesent viverra justo vitae neque. Praesent blandit adipiscing velit. Suspendisse potenti. Donec mattis, pede vel pharetra blandit, magna ligula faucibus eros, id euismod lacus dolor eget odio. Nam scelerisque. Donec non libero sed nulla mattis commodo. Ut sagittis. Donec nisi lectus, feugiat porttitor, tempor ac, tempor vitae, pede. Aenean vehicula velit eu tellus interdum rutrum. Maecenas commodo. Pellentesque nec elit. Fusce in lacus. Vivamus a libero vitae lectus hendrerit hendrerit.</p> <p>Duis cursus. Maecenas ligula eros, blandit nec, pharetra at, semper at, magna. Nullam ac lacus. Nulla facilisi. Praesent viverra justo vitae neque. Praesent blandit adipiscing velit. Suspendisse potenti. Donec mattis, pede vel pharetra blandit, magna ligula faucibus eros, id euismod lacus dolor eget odio. Nam scelerisque. Donec non libero sed nulla mattis commodo. Ut sagittis. Donec nisi lectus, feugiat porttitor, tempor ac, tempor vitae, pede. Aenean vehicula velit eu tellus interdum rutrum. Maecenas commodo. Pellentesque nec elit. Fusce in lacus. Vivamus a libero vitae lectus hendrerit hendrerit.</p>
</div> </div>
</div> </div>
</div><!-- End demo --> </div><!-- End demo -->
<div class="demo-description"> <div class="demo-description">
<p>With some additional CSS (for positioning) and JS (to put the right classes on elements) the tabs can be placed below their content.</p> <p>With some additional CSS (for positioning) and JS (to put the right classes on elements) the tabs can be placed below their content.</p>
</div><!-- End demo-description --> </div><!-- End demo-description -->
</body> </body>
</html> </html>

View File

@ -6,6 +6,7 @@
<script type="text/javascript" src="../../jquery-1.3.2.js"></script> <script type="text/javascript" src="../../jquery-1.3.2.js"></script>
<script type="text/javascript" src="../../ui/jquery.ui.core.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.widget.js"></script>
<script type="text/javascript" src="../../ui/jquery.ui.button.js"></script>
<script type="text/javascript" src="../../ui/jquery.ui.tabs.js"></script> <script type="text/javascript" src="../../ui/jquery.ui.tabs.js"></script>
<script type="text/javascript" src="../../ui/jquery.ui.dialog.js"></script> <script type="text/javascript" src="../../ui/jquery.ui.dialog.js"></script>
<link type="text/css" href="../demos.css" rel="stylesheet" /> <link type="text/css" href="../demos.css" rel="stylesheet" />
@ -67,13 +68,11 @@
} }
// addTab button: just opens the dialog // addTab button: just opens the dialog
$('#add_tab').click(function() { $('#add_tab')
$dialog.dialog('open'); .button()
}).hover(function() { .click(function() {
$(this).addClass("ui-state-hover"); $dialog.dialog('open');
}, function() { });
$(this).removeClass("ui-state-hover");
});
// close icon: removing the tab on click // close icon: removing the tab on click
// note: closable tabs gonna be an option in the future - see http://dev.jqueryui.com/ticket/3924 // note: closable tabs gonna be an option in the future - see http://dev.jqueryui.com/ticket/3924
@ -99,7 +98,7 @@
</form> </form>
</div> </div>
<button id="add_tab" class="ui-button ui-state-default ui-corner-all">Add Tab</button> <button id="add_tab">Add Tab</button>
<div id="tabs"> <div id="tabs">
<ul> <ul>

View File

@ -1,97 +1,97 @@
/** /**
* Cookie plugin * Cookie plugin
* *
* Copyright (c) 2006 Klaus Hartl (stilbuero.de) * Copyright (c) 2006 Klaus Hartl (stilbuero.de)
* Dual licensed under the MIT and GPL licenses: * Dual licensed under the MIT and GPL licenses:
* http://www.opensource.org/licenses/mit-license.php * http://www.opensource.org/licenses/mit-license.php
* http://www.gnu.org/licenses/gpl.html * http://www.gnu.org/licenses/gpl.html
* *
*/ */
/** /**
* Create a cookie with the given name and value and other optional parameters. * Create a cookie with the given name and value and other optional parameters.
* *
* @example $.cookie('the_cookie', 'the_value'); * @example $.cookie('the_cookie', 'the_value');
* @desc Set the value of a cookie. * @desc Set the value of a cookie.
* @example $.cookie('the_cookie', 'the_value', { expires: 7, path: '/', domain: 'jquery.com', secure: true }); * @example $.cookie('the_cookie', 'the_value', { expires: 7, path: '/', domain: 'jquery.com', secure: true });
* @desc Create a cookie with all available options. * @desc Create a cookie with all available options.
* @example $.cookie('the_cookie', 'the_value'); * @example $.cookie('the_cookie', 'the_value');
* @desc Create a session cookie. * @desc Create a session cookie.
* @example $.cookie('the_cookie', null); * @example $.cookie('the_cookie', null);
* @desc Delete a cookie by passing null as value. Keep in mind that you have to use the same path and domain * @desc Delete a cookie by passing null as value. Keep in mind that you have to use the same path and domain
* used when the cookie was set. * used when the cookie was set.
* *
* @param String name The name of the cookie. * @param String name The name of the cookie.
* @param String value The value of the cookie. * @param String value The value of the cookie.
* @param Object options An object literal containing key/value pairs to provide optional cookie attributes. * @param Object options An object literal containing key/value pairs to provide optional cookie attributes.
* @option Number|Date expires Either an integer specifying the expiration date from now on in days or a Date object. * @option Number|Date expires Either an integer specifying the expiration date from now on in days or a Date object.
* If a negative value is specified (e.g. a date in the past), the cookie will be deleted. * If a negative value is specified (e.g. a date in the past), the cookie will be deleted.
* If set to null or omitted, the cookie will be a session cookie and will not be retained * If set to null or omitted, the cookie will be a session cookie and will not be retained
* when the the browser exits. * when the the browser exits.
* @option String path The value of the path atribute of the cookie (default: path of page that created the cookie). * @option String path The value of the path atribute of the cookie (default: path of page that created the cookie).
* @option String domain The value of the domain attribute of the cookie (default: domain of page that created the cookie). * @option String domain The value of the domain attribute of the cookie (default: domain of page that created the cookie).
* @option Boolean secure If true, the secure attribute of the cookie will be set and the cookie transmission will * @option Boolean secure If true, the secure attribute of the cookie will be set and the cookie transmission will
* require a secure protocol (like HTTPS). * require a secure protocol (like HTTPS).
* @type undefined * @type undefined
* *
* @name $.cookie * @name $.cookie
* @cat Plugins/Cookie * @cat Plugins/Cookie
* @author Klaus Hartl/klaus.hartl@stilbuero.de * @author Klaus Hartl/klaus.hartl@stilbuero.de
*/ */
/** /**
* Get the value of a cookie with the given name. * Get the value of a cookie with the given name.
* *
* @example $.cookie('the_cookie'); * @example $.cookie('the_cookie');
* @desc Get the value of a cookie. * @desc Get the value of a cookie.
* *
* @param String name The name of the cookie. * @param String name The name of the cookie.
* @return The value of the cookie. * @return The value of the cookie.
* @type String * @type String
* *
* @name $.cookie * @name $.cookie
* @cat Plugins/Cookie * @cat Plugins/Cookie
* @author Klaus Hartl/klaus.hartl@stilbuero.de * @author Klaus Hartl/klaus.hartl@stilbuero.de
*/ */
jQuery.cookie = function(name, value, options) { jQuery.cookie = function(name, value, options) {
if (typeof value != 'undefined') { // name and value given, set cookie if (typeof value != 'undefined') { // name and value given, set cookie
options = options || {}; options = options || {};
if (value === null) { if (value === null) {
value = ''; value = '';
options = $.extend({}, options); // clone object since it's unexpected behavior if the expired property were changed options = $.extend({}, options); // clone object since it's unexpected behavior if the expired property were changed
options.expires = -1; options.expires = -1;
} }
var expires = ''; var expires = '';
if (options.expires && (typeof options.expires == 'number' || options.expires.toUTCString)) { if (options.expires && (typeof options.expires == 'number' || options.expires.toUTCString)) {
var date; var date;
if (typeof options.expires == 'number') { if (typeof options.expires == 'number') {
date = new Date(); date = new Date();
date.setTime(date.getTime() + (options.expires * 24 * 60 * 60 * 1000)); date.setTime(date.getTime() + (options.expires * 24 * 60 * 60 * 1000));
} else { } else {
date = options.expires; date = options.expires;
} }
expires = '; expires=' + date.toUTCString(); // use expires attribute, max-age is not supported by IE expires = '; expires=' + date.toUTCString(); // use expires attribute, max-age is not supported by IE
} }
// NOTE Needed to parenthesize options.path and options.domain // NOTE Needed to parenthesize options.path and options.domain
// in the following expressions, otherwise they evaluate to undefined // in the following expressions, otherwise they evaluate to undefined
// in the packed version for some reason... // in the packed version for some reason...
var path = options.path ? '; path=' + (options.path) : ''; var path = options.path ? '; path=' + (options.path) : '';
var domain = options.domain ? '; domain=' + (options.domain) : ''; var domain = options.domain ? '; domain=' + (options.domain) : '';
var secure = options.secure ? '; secure' : ''; var secure = options.secure ? '; secure' : '';
document.cookie = [name, '=', encodeURIComponent(value), expires, path, domain, secure].join(''); document.cookie = [name, '=', encodeURIComponent(value), expires, path, domain, secure].join('');
} else { // only name given, get cookie } else { // only name given, get cookie
var cookieValue = null; var cookieValue = null;
if (document.cookie && document.cookie != '') { if (document.cookie && document.cookie != '') {
var cookies = document.cookie.split(';'); var cookies = document.cookie.split(';');
for (var i = 0; i < cookies.length; i++) { for (var i = 0; i < cookies.length; i++) {
var cookie = jQuery.trim(cookies[i]); var cookie = jQuery.trim(cookies[i]);
// Does this cookie string begin with the name we want? // Does this cookie string begin with the name we want?
if (cookie.substring(0, name.length + 1) == (name + '=')) { if (cookie.substring(0, name.length + 1) == (name + '=')) {
cookieValue = decodeURIComponent(cookie.substring(name.length + 1)); cookieValue = decodeURIComponent(cookie.substring(name.length + 1));
break; break;
} }
} }
} }
return cookieValue; return cookieValue;
} }
}; };

122
external/jquery.metadata.js vendored Normal file
View File

@ -0,0 +1,122 @@
/*
* Metadata - jQuery plugin for parsing metadata from elements
*
* Copyright (c) 2006 John Resig, Yehuda Katz, J<EFBFBD>örn Zaefferer, Paul McLanahan
*
* Dual licensed under the MIT and GPL licenses:
* http://www.opensource.org/licenses/mit-license.php
* http://www.gnu.org/licenses/gpl.html
*
* Revision: $Id: jquery.metadata.js 4187 2007-12-16 17:15:27Z joern.zaefferer $
*
*/
/**
* Sets the type of metadata to use. Metadata is encoded in JSON, and each property
* in the JSON will become a property of the element itself.
*
* There are three supported types of metadata storage:
*
* attr: Inside an attribute. The name parameter indicates *which* attribute.
*
* class: Inside the class attribute, wrapped in curly braces: { }
*
* elem: Inside a child element (e.g. a script tag). The
* name parameter indicates *which* element.
*
* The metadata for an element is loaded the first time the element is accessed via jQuery.
*
* As a result, you can define the metadata type, use $(expr) to load the metadata into the elements
* matched by expr, then redefine the metadata type and run another $(expr) for other elements.
*
* @name $.metadata.setType
*
* @example <p id="one" class="some_class {item_id: 1, item_label: 'Label'}">This is a p</p>
* @before $.metadata.setType("class")
* @after $("#one").metadata().item_id == 1; $("#one").metadata().item_label == "Label"
* @desc Reads metadata from the class attribute
*
* @example <p id="one" class="some_class" data="{item_id: 1, item_label: 'Label'}">This is a p</p>
* @before $.metadata.setType("attr", "data")
* @after $("#one").metadata().item_id == 1; $("#one").metadata().item_label == "Label"
* @desc Reads metadata from a "data" attribute
*
* @example <p id="one" class="some_class"><script>{item_id: 1, item_label: 'Label'}</script>This is a p</p>
* @before $.metadata.setType("elem", "script")
* @after $("#one").metadata().item_id == 1; $("#one").metadata().item_label == "Label"
* @desc Reads metadata from a nested script element
*
* @param String type The encoding type
* @param String name The name of the attribute to be used to get metadata (optional)
* @cat Plugins/Metadata
* @descr Sets the type of encoding to be used when loading metadata for the first time
* @type undefined
* @see metadata()
*/
(function($) {
$.extend({
metadata : {
defaults : {
type: 'class',
name: 'metadata',
cre: /({.*})/,
single: 'metadata'
},
setType: function( type, name ){
this.defaults.type = type;
this.defaults.name = name;
},
get: function( elem, opts ){
var settings = $.extend({},this.defaults,opts);
// check for empty string in single property
if ( !settings.single.length ) settings.single = 'metadata';
var data = $.data(elem, settings.single);
// returned cached data if it already exists
if ( data ) return data;
data = "{}";
if ( settings.type == "class" ) {
var m = settings.cre.exec( elem.className );
if ( m )
data = m[1];
} else if ( settings.type == "elem" ) {
if( !elem.getElementsByTagName )
return undefined;
var e = elem.getElementsByTagName(settings.name);
if ( e.length )
data = $.trim(e[0].innerHTML);
} else if ( elem.getAttribute != undefined ) {
var attr = elem.getAttribute( settings.name );
if ( attr )
data = attr;
}
if ( data.indexOf( '{' ) <0 )
data = "{" + data + "}";
data = eval("(" + data + ")");
$.data( elem, settings.single, data );
return data;
}
}
});
/**
* Returns the metadata object for the first member of the jQuery object.
*
* @name metadata
* @descr Returns element's metadata object
* @param Object opts An object contianing settings to override the defaults
* @type jQuery
* @cat Plugins/Metadata
*/
$.fn.metadata = function( opts ){
return $.metadata.get( this[0], opts );
};
})(jQuery);

View File

@ -1,150 +1,150 @@
/* /*
* jquery.simulate - simulate browser mouse and keyboard events * jquery.simulate - simulate browser mouse and keyboard events
* *
* Copyright (c) 2009 AUTHORS.txt (http://jqueryui.com/about) * Copyright (c) 2009 AUTHORS.txt (http://jqueryui.com/about)
* Dual licensed under the MIT (MIT-LICENSE.txt) * Dual licensed under the MIT (MIT-LICENSE.txt)
* and GPL (GPL-LICENSE.txt) licenses. * and GPL (GPL-LICENSE.txt) licenses.
* *
*/ */
;(function($) { ;(function($) {
$.fn.extend({ $.fn.extend({
simulate: function(type, options) { simulate: function(type, options) {
return this.each(function() { return this.each(function() {
var opt = $.extend({}, $.simulate.defaults, options || {}); var opt = $.extend({}, $.simulate.defaults, options || {});
new $.simulate(this, type, opt); new $.simulate(this, type, opt);
}); });
} }
}); });
$.simulate = function(el, type, options) { $.simulate = function(el, type, options) {
this.target = el; this.target = el;
this.options = options; this.options = options;
if (/^drag$/.test(type)) { if (/^drag$/.test(type)) {
this[type].apply(this, [this.target, options]); this[type].apply(this, [this.target, options]);
} else { } else {
this.simulateEvent(el, type, options); this.simulateEvent(el, type, options);
} }
} }
$.extend($.simulate.prototype, { $.extend($.simulate.prototype, {
simulateEvent: function(el, type, options) { simulateEvent: function(el, type, options) {
var evt = this.createEvent(type, options); var evt = this.createEvent(type, options);
this.dispatchEvent(el, type, evt, options); this.dispatchEvent(el, type, evt, options);
return evt; return evt;
}, },
createEvent: function(type, options) { createEvent: function(type, options) {
if (/^mouse(over|out|down|up|move)|(dbl)?click$/.test(type)) { if (/^mouse(over|out|down|up|move)|(dbl)?click$/.test(type)) {
return this.mouseEvent(type, options); return this.mouseEvent(type, options);
} else if (/^key(up|down|press)$/.test(type)) { } else if (/^key(up|down|press)$/.test(type)) {
return this.keyboardEvent(type, options); return this.keyboardEvent(type, options);
} }
}, },
mouseEvent: function(type, options) { mouseEvent: function(type, options) {
var evt; var evt;
var e = $.extend({ var e = $.extend({
bubbles: true, cancelable: (type != "mousemove"), view: window, detail: 0, bubbles: true, cancelable: (type != "mousemove"), view: window, detail: 0,
screenX: 0, screenY: 0, clientX: 0, clientY: 0, screenX: 0, screenY: 0, clientX: 0, clientY: 0,
ctrlKey: false, altKey: false, shiftKey: false, metaKey: false, ctrlKey: false, altKey: false, shiftKey: false, metaKey: false,
button: 0, relatedTarget: undefined button: 0, relatedTarget: undefined
}, options); }, options);
var relatedTarget = $(e.relatedTarget)[0]; var relatedTarget = $(e.relatedTarget)[0];
if ($.isFunction(document.createEvent)) { if ($.isFunction(document.createEvent)) {
evt = document.createEvent("MouseEvents"); evt = document.createEvent("MouseEvents");
evt.initMouseEvent(type, e.bubbles, e.cancelable, e.view, e.detail, evt.initMouseEvent(type, e.bubbles, e.cancelable, e.view, e.detail,
e.screenX, e.screenY, e.clientX, e.clientY, e.screenX, e.screenY, e.clientX, e.clientY,
e.ctrlKey, e.altKey, e.shiftKey, e.metaKey, e.ctrlKey, e.altKey, e.shiftKey, e.metaKey,
e.button, e.relatedTarget || document.body.parentNode); e.button, e.relatedTarget || document.body.parentNode);
} else if (document.createEventObject) { } else if (document.createEventObject) {
evt = document.createEventObject(); evt = document.createEventObject();
$.extend(evt, e); $.extend(evt, e);
evt.button = { 0:1, 1:4, 2:2 }[evt.button] || evt.button; evt.button = { 0:1, 1:4, 2:2 }[evt.button] || evt.button;
} }
return evt; return evt;
}, },
keyboardEvent: function(type, options) { keyboardEvent: function(type, options) {
var evt; var evt;
var e = $.extend({ bubbles: true, cancelable: true, view: window, var e = $.extend({ bubbles: true, cancelable: true, view: window,
ctrlKey: false, altKey: false, shiftKey: false, metaKey: false, ctrlKey: false, altKey: false, shiftKey: false, metaKey: false,
keyCode: 0, charCode: 0 keyCode: 0, charCode: 0
}, options); }, options);
if ($.isFunction(document.createEvent)) { if ($.isFunction(document.createEvent)) {
try { try {
evt = document.createEvent("KeyEvents"); evt = document.createEvent("KeyEvents");
evt.initKeyEvent(type, e.bubbles, e.cancelable, e.view, evt.initKeyEvent(type, e.bubbles, e.cancelable, e.view,
e.ctrlKey, e.altKey, e.shiftKey, e.metaKey, e.ctrlKey, e.altKey, e.shiftKey, e.metaKey,
e.keyCode, e.charCode); e.keyCode, e.charCode);
} catch(err) { } catch(err) {
evt = document.createEvent("Events"); evt = document.createEvent("Events");
evt.initEvent(type, e.bubbles, e.cancelable); evt.initEvent(type, e.bubbles, e.cancelable);
$.extend(evt, { view: e.view, $.extend(evt, { view: e.view,
ctrlKey: e.ctrlKey, altKey: e.altKey, shiftKey: e.shiftKey, metaKey: e.metaKey, ctrlKey: e.ctrlKey, altKey: e.altKey, shiftKey: e.shiftKey, metaKey: e.metaKey,
keyCode: e.keyCode, charCode: e.charCode keyCode: e.keyCode, charCode: e.charCode
}); });
} }
} else if (document.createEventObject) { } else if (document.createEventObject) {
evt = document.createEventObject(); evt = document.createEventObject();
$.extend(evt, e); $.extend(evt, e);
} }
if ($.browser.msie || $.browser.opera) { if ($.browser.msie || $.browser.opera) {
evt.keyCode = (e.charCode > 0) ? e.charCode : e.keyCode; evt.keyCode = (e.charCode > 0) ? e.charCode : e.keyCode;
evt.charCode = undefined; evt.charCode = undefined;
} }
return evt; return evt;
}, },
dispatchEvent: function(el, type, evt) { dispatchEvent: function(el, type, evt) {
if (el.dispatchEvent) { if (el.dispatchEvent) {
el.dispatchEvent(evt); el.dispatchEvent(evt);
} else if (el.fireEvent) { } else if (el.fireEvent) {
el.fireEvent('on' + type, evt); el.fireEvent('on' + type, evt);
} }
return evt; return evt;
}, },
drag: function(el) { drag: function(el) {
var self = this, center = this.findCenter(this.target), var self = this, center = this.findCenter(this.target),
options = this.options, x = Math.floor(center.x), y = Math.floor(center.y), options = this.options, x = Math.floor(center.x), y = Math.floor(center.y),
dx = options.dx || 0, dy = options.dy || 0, target = this.target; dx = options.dx || 0, dy = options.dy || 0, target = this.target;
var coord = { clientX: x, clientY: y }; var coord = { clientX: x, clientY: y };
this.simulateEvent(target, "mousedown", coord); this.simulateEvent(target, "mousedown", coord);
coord = { clientX: x + 1, clientY: y + 1 }; coord = { clientX: x + 1, clientY: y + 1 };
this.simulateEvent(document, "mousemove", coord); this.simulateEvent(document, "mousemove", coord);
coord = { clientX: x + dx, clientY: y + dy }; coord = { clientX: x + dx, clientY: y + dy };
this.simulateEvent(document, "mousemove", coord); this.simulateEvent(document, "mousemove", coord);
this.simulateEvent(document, "mousemove", coord); this.simulateEvent(document, "mousemove", coord);
this.simulateEvent(target, "mouseup", coord); this.simulateEvent(target, "mouseup", coord);
}, },
findCenter: function(el) { findCenter: function(el) {
var el = $(this.target), o = el.offset(); var el = $(this.target), o = el.offset();
return { return {
x: o.left + el.outerWidth() / 2, x: o.left + el.outerWidth() / 2,
y: o.top + el.outerHeight() / 2 y: o.top + el.outerHeight() / 2
}; };
} }
}); });
$.extend($.simulate, { $.extend($.simulate, {
defaults: { defaults: {
speed: 'sync' speed: 'sync'
}, },
VK_TAB: 9, VK_TAB: 9,
VK_ENTER: 13, VK_ENTER: 13,
VK_ESC: 27, VK_ESC: 27,
VK_PGUP: 33, VK_PGUP: 33,
VK_PGDN: 34, VK_PGDN: 34,
VK_END: 35, VK_END: 35,
VK_HOME: 36, VK_HOME: 36,
VK_LEFT: 37, VK_LEFT: 37,
VK_UP: 38, VK_UP: 38,
VK_RIGHT: 39, VK_RIGHT: 39,
VK_DOWN: 40 VK_DOWN: 40
}); });
})(jQuery); })(jQuery);

View File

@ -0,0 +1,129 @@
<!DOCTYPE html>
<html lang="en">
<head>
<title>Button Static Test : Default</title>
<link rel="stylesheet" href="../static.css" type="text/css" />
<link rel="stylesheet" href="../../../themes/base/ui.base.css" type="text/css" />
<link rel="stylesheet" href="../../../themes/base/ui.theme.css" type="text/css" title="ui-theme" />
<script type="text/javascript" src="../../../jquery-1.3.2.js"></script>
<script type="text/javascript" src="../static.js"></script>
<style>
div { margin: 0 0 1em; }
h2 { margin: 2em 0 1em; }
</style>
</head>
<body>
<h2>Using button elements</h2>
<div>
<button class="ui-button ui-button-text-only ui-widget ui-state-default ui-corner-all">
<span class="ui-button-text">Button</span>
</button>
<button class="ui-button ui-button-icon-only ui-widget ui-state-default ui-corner-all" title="Button">
<span class="ui-button-icon-primary ui-icon ui-icon-locked"></span>
<span class="ui-button-text">Button</span>
</button>
<button class="ui-button ui-button-text-icon ui-widget ui-state-default ui-corner-all">
<span class="ui-button-icon-primary ui-icon ui-icon-locked"></span>
<span class="ui-button-text">Button</span>
</button>
<button class="ui-button ui-button-text-icons ui-widget ui-state-default ui-corner-all">
<span class="ui-button-icon-primary ui-icon ui-icon-gear"></span>
<span class="ui-button-text">Button</span>
<span class="ui-button-icon-secondary ui-icon ui-icon-triangle-1-s"></span>
</button>
<button class="ui-button ui-button-icons-only ui-widget ui-state-default ui-corner-all">
<span class="ui-button-icon-primary ui-icon ui-icon-gear"></span>
<span class="ui-button-text">Button</span>
<span class="ui-button-icon-secondary ui-icon ui-icon-triangle-1-s"></span>
</button>
</div>
<h2>Using anchor elements</h2>
<div>
<a href="#" class="ui-button ui-button-text-only ui-widget ui-state-default ui-corner-all">
<span class="ui-button-text">Button</span>
</a>
<a href="#" class="ui-button ui-button-icon-only ui-widget ui-state-default ui-corner-all" title="Button">
<span class="ui-button-icon-primary ui-icon ui-icon-locked"></span>
<span class="ui-button-text">Button</span>
</a>
<a href="#" class="ui-button ui-button-text-icon ui-widget ui-state-default ui-corner-all">
<span class="ui-button-icon-primary ui-icon ui-icon-locked"></span>
<span class="ui-button-text">Button</span>
</a>
<a href="#" class="ui-button ui-button-text-icons ui-widget ui-state-default ui-corner-all">
<span class="ui-button-icon-primary ui-icon ui-icon-gear"></span>
<span class="ui-button-text">Button</span>
<span class="ui-button-icon-secondary ui-icon ui-icon-triangle-1-s"></span>
</a>
<a href="#" class="ui-button ui-button-icons-only ui-widget ui-state-default ui-corner-all">
<span class="ui-button-icon-primary ui-icon ui-icon-gear"></span>
<span class="ui-button-text">Button</span>
<span class="ui-button-icon-secondary ui-icon ui-icon-triangle-1-s"></span>
</a>
</div>
<h2>Using label elements (used when proxying to radio or check inputs)</h2>
<div>
<label class="ui-button ui-button-text-only ui-widget ui-state-default ui-corner-all">
<span class="ui-button-text">Button</span>
</label>
<label class="ui-button ui-button-icon-only ui-widget ui-state-default ui-corner-all" title="Button">
<span class="ui-button-icon-primary ui-icon ui-icon-locked"></span>
<span class="ui-button-text">Button</span>
</label>
<label class="ui-button ui-button-text-icon ui-widget ui-state-default ui-corner-all">
<span class="ui-button-icon-primary ui-icon ui-icon-locked"></span>
<span class="ui-button-text">Button</span>
</label>
<label class="ui-button ui-button-text-icons ui-widget ui-state-default ui-corner-all">
<span class="ui-button-icon-primary ui-icon ui-icon-gear"></span>
<span class="ui-button-text">Button</span>
<span class="ui-button-icon-secondary ui-icon ui-icon-triangle-1-s"></span>
</label>
<label class="ui-button ui-button-icons-only ui-widget ui-state-default ui-corner-all">
<span class="ui-button-icon-primary ui-icon ui-icon-gear"></span>
<span class="ui-button-text">Button</span>
<span class="ui-button-icon-secondary ui-icon ui-icon-triangle-1-s"></span>
</label>
</div>
<h2>Button Sets</h2>
<div class="ui-button-set">
<button class="ui-button ui-button-text-only ui-widget ui-state-default ui-corner-left"><span class="ui-button-text">Simple button</span></button>
<button class="ui-button ui-button-text-only ui-widget ui-state-default"><span class="ui-button-text">Simple button</span></button>
<button class="ui-button ui-button-text-only ui-widget ui-state-default ui-corner-right"><span class="ui-button-text">Simple button</span></button>
</div>
<script type="text/javascript" src="http://jqueryui.com/themeroller/themeswitchertool/"></script>
<script>
$('<div/>').css({
position: "absolute",
right: 10,
top: 10
}).appendTo(document.body).themeswitcher();
</script>
</body>
</html>

View File

@ -0,0 +1,38 @@
<!doctype html>
<html>
<head>
<title>Menu Static Test : Default</title>
<link rel="stylesheet" href="../static.css" type="text/css" />
<link rel="stylesheet" href="../../../themes/base/ui.base.css" type="text/css" />
<link rel="stylesheet" href="../../../themes/base/ui.theme.css" type="text/css" title="ui-theme" />
<script type="text/javascript" src="../../../jquery-1.3.2.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>

View File

@ -5,7 +5,7 @@
(function($) { (function($) {
jQuery.ui.accordion.defaults.animated = false; $.ui.accordion.prototype.options.animated = false;
function state(accordion) { function state(accordion) {
var args = $.makeArray(arguments).slice(1); var args = $.makeArray(arguments).slice(1);

View File

@ -127,19 +127,20 @@ test("{ header: '> li > :first-child,> :not(li):even' }, default", function() {
}); });
test("{ icons: false }", function() { test("{ icons: false }", function() {
var list = $("#list1");
function icons(on) { function icons(on) {
same($("#list1 span.ui-icon").length, on ? 3 : 0); same($("span.ui-icon", list).length, on ? 3 : 0);
same( $("#list1").hasClass("ui-accordion-icons"), on ); same( list.hasClass("ui-accordion-icons"), on );
} }
$("#list1").accordion(); list.accordion();
icons(true); icons(true);
$("#list1").accordion("destroy").accordion({ list.accordion("destroy").accordion({
icons: false icons: false
}); });
icons(false); icons(false);
$("#list1").accordion("option", "icons", $.ui.accordion.defaults.icons); list.accordion("option", "icons", $.ui.accordion.prototype.options.icons);
icons(true); icons(true);
$("#list1").accordion("option", "icons", false); list.accordion("option", "icons", false);
icons(false); icons(false);
}); });

View File

@ -0,0 +1,56 @@
<!doctype html>
<html lang="en">
<head>
<title>jQuery UI Button Test Suite</title>
<script type="text/javascript" src="../../../jquery-1.3.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.button.js"></script>
<link type="text/css" href="../testsuite.css" rel="stylesheet" />
<script type="text/javascript" src="../../../external/testrunner-r6588.js"></script>
<script type="text/javascript" src="../../jquery.simulate.js"></script>
<script type="text/javascript" src="../testsuite.js"></script>
<script type="text/javascript" src="button_core.js"></script>
<script type="text/javascript" src="button_defaults.js"></script>
<script type="text/javascript" src="button_events.js"></script>
<script type="text/javascript" src="button_methods.js"></script>
<script type="text/javascript" src="button_options.js"></script>
<script type="text/javascript" src="button_tickets.js"></script>
</head>
<body>
<div id="main">
<div><button id="button" class="foo">Label</button></div>
<div id="radio0" style="margin-top: 2em;">
<input type="radio" id="radio01" name="radio" checked="checked" /><label for="radio01">Choice 1</label>
<input type="radio" id="radio02" name="radio" /><label for="radio02">Choice 2</label>
<input type="radio" id="radio03" name="radio" /><label for="radio03">Choice 3</label>
</div>
<form>
<div id="radio1" style="margin-top: 2em;">
<input type="radio" id="radio11" name="radio" /><label for="radio11">Choice 1</label>
<input type="radio" id="radio12" name="radio" checked="checked" /><label for="radio12">Choice 2</label>
<input type="radio" id="radio13" name="radio" /><label for="radio13">Choice 3</label>
</div>
</form>
<form>
<div id="radio2" style="margin-top: 2em;">
<input type="radio" id="radio21" name="radio" /><label for="radio21">Choice 1</label>
<input type="radio" id="radio22" name="radio" /><label for="radio22">Choice 2</label>
<input type="radio" id="radio23" name="radio" checked="checked" /><label for="radio23">Choice 3</label>
</div>
</form>
<input type="checkbox" id="check" /><label for="check">Toggle</label>
<div><input id="submit" type="submit" value="Label" /></div>
</div>
</body>
</html>

View File

@ -0,0 +1,70 @@
/*
* button_core.js
*/
(function($) {
module("button: core");
test("checkbox", function() {
var input = $("#check");
label = $("label[for=check]");
ok( input.is(":visble") );
ok( label.is(":not(.ui-button)") );
input.button();
ok( input.is(":hidden") );
ok( label.is(".ui-button") );
});
test("radios", function() {
var inputs = $("#radio0 input");
labels = $("#radio0 label");
ok( inputs.is(":visble") );
ok( labels.is(":not(.ui-button)") );
inputs.button();
ok( inputs.is(":hidden") );
ok( labels.is(".ui-button") );
});
function assert(noForm, form1, form2) {
ok( $("#radio0 .ui-button" + noForm).is(".ui-state-active") );
ok( $("#radio1 .ui-button" + form1).is(".ui-state-active") );
ok( $("#radio2 .ui-button" + form2).is(".ui-state-active") );
}
test("radio groups", function() {
$(":radio").button();
assert(":eq(0)", ":eq(1)", ":eq(2)");
// click outside of forms
$("#radio0 .ui-button:eq(1)").click();
assert(":eq(1)", ":eq(1)", ":eq(2)");
// click in first form
$("#radio1 .ui-button:eq(0)").click();
assert(":eq(1)", ":eq(0)", ":eq(2)");
// click in second form
$("#radio2 .ui-button:eq(0)").click();
assert(":eq(1)", ":eq(0)", ":eq(0)");
});
test("input type submit, don't create child elements", function() {
var input = $("#submit")
same( input.children().length, 0 );
input.button();
same( input.children().length, 0 );
});
test("buttonset", function() {
var set = $("#radio1").buttonset();
ok( set.is(".ui-button-set") );
same( set.children(".ui-button").length, 3 );
same( set.children("input:radio:hidden").length, 3 );
ok( set.children("label:eq(0)").is(".ui-button.ui-corner-left:not(.ui-corner-all)") );
ok( set.children("label:eq(1)").is(".ui-button:not(.ui-corner-all)") );
ok( set.children("label:eq(2)").is(".ui-button.ui-corner-right:not(.ui-corner-all)") );
});
})(jQuery);

View File

@ -0,0 +1,15 @@
/*
* button_defaults.js
*/
var button_defaults = {
disabled: false,
text: true,
label: null,
icons: {
primary: null,
secondary: null
}
};
commonWidgetTests('button', { defaults: button_defaults });

View File

@ -0,0 +1,17 @@
/*
* button_events.js
*/
(function($) {
module("button: events");
test("click-through", function() {
expect(2);
var set = $("#radio1").buttonset();
set.find("input:first").click(function() {
ok( true );
});
ok( set.find("label:first").click().is(".ui-button") );
});
})(jQuery);

View File

@ -0,0 +1,15 @@
/*
* button_methods.js
*/
(function($) {
module("button: methods");
test("destroy", function() {
var beforeHtml = $("#button").parent().html();
var afterHtml = $("#button").button().button("destroy").parent().html();
same( beforeHtml, afterHtml );
});
})(jQuery);

View File

@ -0,0 +1,69 @@
/*
* button_options.js
*/
(function($) {
module("button: options");
test("text false without icon", function() {
$("#button").button({
text: false
});
ok( $("#button").is(".ui-button-text-only:not(.ui-button-icon-only)") );
$("#button").button("destroy");
});
test("text false with icon", function() {
$("#button").button({
text: false,
icons: {
primary: "iconclass"
}
});
ok( $("#button").is(".ui-button-icon-only:not(.ui-button-text):has(span.ui-icon.iconclass)") );
$("#button").button("destroy");
});
test("label, default", function() {
$("#button").button();
same( $("#button").text(), "Label" );
$("#button").button("destroy");
});
test("label", function() {
$("#button").button({
label: "xxx"
});
same( $("#button").text(), "xxx" );
$("#button").button("destroy");
});
test("label default with input type submit", function() {
same( $("#submit").button().val(), "Label" );
});
test("label with input type submit", function() {
var label = $("#submit").button({
label: "xxx"
}).val();
same( label, "xxx" );
});
test("icons", function() {
$("#button").button({
text: false,
icons: {
primary: "iconclass",
secondary: "iconclass2"
}
});
ok( $("#button").is(":has(span.ui-icon.ui-button-icon-primary.iconclass):has(span.ui-icon.ui-button-icon-secondary.iconclass2)") );
$("#button").button("destroy");
});
})(jQuery);

View File

@ -0,0 +1,10 @@
/*
* button_tickets.js
*/
(function($) {
module("button: tickets");
})(jQuery);

View File

@ -57,40 +57,4 @@ test('zIndex', function() {
equals($('#zIndexAutoNoParent').zIndex(), 0, 'zIndex never explicitly set in hierarchy'); equals($('#zIndexAutoNoParent').zIndex(), 0, 'zIndex never explicitly set in hierarchy');
}); });
test('widget factory, merge multiple option arguments', function() {
expect(1);
$.widget("ui.widgetTest", {
_init: function() {
same(this.options, {
disabled: false,
option1: "value1",
option2: "value2",
option3: "value3",
option4: {
option4a: "valuea",
option4b: "valueb"
}
});
}
});
$("#main > :first").widgetTest({
option1: "valuex",
option2: "valuex",
option3: "value3",
option4: {
option4a: "valuex"
}
}, {
option1: "value1",
option2: "value2",
option4: {
option4b: "valueb"
}
}, {
option4: {
option4a: "valuea"
}
});
});
})(jQuery); })(jQuery);

View File

@ -47,6 +47,11 @@ module("datepicker: core", {
} }
}); });
test("widget method", function() {
var actual = $("#inp").datepicker().datepicker("widget")[0];
same($("body > #ui-datepicker-div:last-child")[0], actual);
});
test('baseStructure', function() { test('baseStructure', function() {
var inp = init('#inp'); var inp = init('#inp');
inp.focus(); inp.focus();

View File

@ -147,4 +147,9 @@ test("ARIA", function() {
el.remove(); el.remove();
}); });
test("widget method", function() {
var dialog = $("<div/>").appendTo("#main").dialog();
same(dialog.parent()[0], dialog.dialog("widget")[0]);
});
})(jQuery); })(jQuery);

View File

@ -1,333 +1,333 @@
/* /*
* position_core.js * position_core.js
*/ */
(function($) { (function($) {
test('my, at, of', function() { test('my, at, of', function() {
$('#elx').position({ $('#elx').position({
my: 'left top', my: 'left top',
at: 'left top', at: 'left top',
of: '#parentx', of: '#parentx',
collision: 'none' collision: 'none'
}); });
same($('#elx').offset(), { top: 40, left: 40 }, 'left top, left top'); same($('#elx').offset(), { top: 40, left: 40 }, 'left top, left top');
$('#elx').position({ $('#elx').position({
my: 'left top', my: 'left top',
at: 'left bottom', at: 'left bottom',
of: '#parentx', of: '#parentx',
collision: 'none' collision: 'none'
}); });
same($('#elx').offset(), { top: 60, left: 40 }, 'left top, left bottom'); same($('#elx').offset(), { top: 60, left: 40 }, 'left top, left bottom');
$('#elx').position({ $('#elx').position({
my: 'left', my: 'left',
at: 'bottom', at: 'bottom',
of: '#parentx', of: '#parentx',
collision: 'none' collision: 'none'
}); });
same($('#elx').offset(), { top: 55, left: 50 }, 'left, bottom'); same($('#elx').offset(), { top: 55, left: 50 }, 'left, bottom');
$('#elx').position({ $('#elx').position({
my: 'left foo', my: 'left foo',
at: 'bar baz', at: 'bar baz',
of: '#parentx', of: '#parentx',
collision: 'none' collision: 'none'
}); });
same($('#elx').offset(), { top: 45, left: 50 }, 'left foo, bar baz'); same($('#elx').offset(), { top: 45, left: 50 }, 'left foo, bar baz');
}); });
test('multiple elements', function() { test('multiple elements', function() {
var elements = $('#el1, #el2'); var elements = $('#el1, #el2');
var result = elements.position({ var result = elements.position({
my: 'left top', my: 'left top',
at: 'left bottom', at: 'left bottom',
of: '#parent', of: '#parent',
collision: 'none' collision: 'none'
}); });
same(result, elements); same(result, elements);
var expected = {top: 10, left: 4}; var expected = {top: 10, left: 4};
elements.each(function() { elements.each(function() {
same($(this).offset(), expected); same($(this).offset(), expected);
}); });
}); });
test('positions', function() { test('positions', function() {
var definitions = []; var definitions = [];
var offsets = { var offsets = {
left: 0, left: 0,
center: 3, center: 3,
right: 6, right: 6,
top: 0, top: 0,
center: 3, center: 3,
bottom: 6 bottom: 6
}; };
var start = { left: 4, top: 4 }; var start = { left: 4, top: 4 };
$.each([0, 1], function(my) { $.each([0, 1], function(my) {
$.each(["top", "center", "bottom"], function(vindex, vertical) { $.each(["top", "center", "bottom"], function(vindex, vertical) {
$.each(["left", "center", "right"], function(hindex, horizontal) { $.each(["left", "center", "right"], function(hindex, horizontal) {
definitions.push({ definitions.push({
my: my ? horizontal + " " + vertical : 'left top', my: my ? horizontal + " " + vertical : 'left top',
at: !my ? horizontal + " " + vertical : 'left top', at: !my ? horizontal + " " + vertical : 'left top',
result: { result: {
top: my ? start.top - offsets[vertical] : start.top + offsets[vertical], top: my ? start.top - offsets[vertical] : start.top + offsets[vertical],
left: my ? start.left - offsets[horizontal] : start.left + offsets[horizontal] left: my ? start.left - offsets[horizontal] : start.left + offsets[horizontal]
} }
}); });
}); });
}); });
}); });
var el = $("#el1"); var el = $("#el1");
$.each(definitions, function(index, definition) { $.each(definitions, function(index, definition) {
el.position({ el.position({
my: definition.my, my: definition.my,
at: definition.at, at: definition.at,
of: '#parent', of: '#parent',
collision: 'none' collision: 'none'
}); });
same(el.offset(), definition.result, "Position via " + jsDump.parse({my:definition.my, at:definition.at})); same(el.offset(), definition.result, "Position via " + jsDump.parse({my:definition.my, at:definition.at}));
}); });
}); });
test('of', function() { test('of', function() {
$('#elx').position({ $('#elx').position({
my: 'left top', my: 'left top',
at: 'left top', at: 'left top',
of: '#parentx', of: '#parentx',
collision: 'none' collision: 'none'
}); });
same($('#elx').offset(), { top: 40, left: 40 }, 'selector'); same($('#elx').offset(), { top: 40, left: 40 }, 'selector');
$('#elx').position({ $('#elx').position({
my: 'left top', my: 'left top',
at: 'left bottom', at: 'left bottom',
of: $('#parentx'), of: $('#parentx'),
collision: 'none' collision: 'none'
}); });
same($('#elx').offset(), { top: 60, left: 40 }, 'jQuery object'); same($('#elx').offset(), { top: 60, left: 40 }, 'jQuery object');
$('#elx').position({ $('#elx').position({
my: 'left top', my: 'left top',
at: 'left top', at: 'left top',
of: $('#parentx')[0], of: $('#parentx')[0],
collision: 'none' collision: 'none'
}); });
same($('#elx').offset(), { top: 40, left: 40 }, 'DOM element'); same($('#elx').offset(), { top: 40, left: 40 }, 'DOM element');
$('#elx').position({ $('#elx').position({
my: 'right bottom', my: 'right bottom',
at: 'right bottom', at: 'right bottom',
of: document, of: document,
collision: 'none' collision: 'none'
}); });
same($('#elx').offset(), { same($('#elx').offset(), {
top: $(document).height() - 10, top: $(document).height() - 10,
left: $(document).width() - 10 left: $(document).width() - 10
}, 'document'); }, 'document');
$('#elx').position({ $('#elx').position({
my: 'right bottom', my: 'right bottom',
at: 'right bottom', at: 'right bottom',
of: window, of: window,
collision: 'none' collision: 'none'
}); });
same($('#elx').offset(), { same($('#elx').offset(), {
top: $(window).height() - 10, top: $(window).height() - 10,
left: $(window).width() - 10 left: $(window).width() - 10
}, 'window'); }, 'window');
$(window).scrollTop(500).scrollLeft(200); $(window).scrollTop(500).scrollLeft(200);
$('#elx').position({ $('#elx').position({
my: 'right bottom', my: 'right bottom',
at: 'right bottom', at: 'right bottom',
of: window, of: window,
collision: 'none' collision: 'none'
}); });
same($('#elx').offset(), { same($('#elx').offset(), {
top: $(window).height() + 500 - 10, top: $(window).height() + 500 - 10,
left: $(window).width() + 200 - 10 left: $(window).width() + 200 - 10
}, 'window, scrolled'); }, 'window, scrolled');
$(window).scrollTop(0).scrollLeft(0); $(window).scrollTop(0).scrollLeft(0);
var event = $.extend($.Event('someEvent'), { pageX: 200, pageY: 300 }); var event = $.extend($.Event('someEvent'), { pageX: 200, pageY: 300 });
$('#elx').position({ $('#elx').position({
my: 'left top', my: 'left top',
at: 'left top', at: 'left top',
of: event, of: event,
collision: 'none' collision: 'none'
}); });
same($('#elx').offset(), { same($('#elx').offset(), {
top: 300, top: 300,
left: 200 left: 200
}, 'event - left top, left top'); }, 'event - left top, left top');
event = $.extend($.Event('someEvent'), { pageX: 400, pageY: 600 }); event = $.extend($.Event('someEvent'), { pageX: 400, pageY: 600 });
$('#elx').position({ $('#elx').position({
my: 'left top', my: 'left top',
at: 'right bottom', at: 'right bottom',
of: event, of: event,
collision: 'none' collision: 'none'
}); });
same($('#elx').offset(), { same($('#elx').offset(), {
top: 600, top: 600,
left: 400 left: 400
}, 'event - left top, right bottom'); }, 'event - left top, right bottom');
}); });
test('offset', function() { test('offset', function() {
$('#elx').position({ $('#elx').position({
my: 'left top', my: 'left top',
at: 'left bottom', at: 'left bottom',
of: '#parentx', of: '#parentx',
offset: '10', offset: '10',
collision: 'none' collision: 'none'
}); });
same($('#elx').offset(), { top: 70, left: 50 }, 'single value'); same($('#elx').offset(), { top: 70, left: 50 }, 'single value');
$('#elx').position({ $('#elx').position({
my: 'left top', my: 'left top',
at: 'left bottom', at: 'left bottom',
of: '#parentx', of: '#parentx',
offset: '5 -3', offset: '5 -3',
collision: 'none' collision: 'none'
}); });
same($('#elx').offset(), { top: 57, left: 45 }, 'two values'); same($('#elx').offset(), { top: 57, left: 45 }, 'two values');
$('#elx').position({ $('#elx').position({
my: 'left top', my: 'left top',
at: 'left bottom', at: 'left bottom',
of: '#parentx', of: '#parentx',
offset: '5px -3px', offset: '5px -3px',
collision: 'none' collision: 'none'
}); });
same($('#elx').offset(), { top: 57, left: 45 }, 'with units'); same($('#elx').offset(), { top: 57, left: 45 }, 'with units');
}); });
test('by', function() { test('using', function() {
expect(6); expect(6);
var count = 0, var count = 0,
elems = $('#el1, #el2'), elems = $('#el1, #el2'),
expectedPosition = { top: 40, left: 40 }, expectedPosition = { top: 40, left: 40 },
originalPosition = elems.position({ originalPosition = elems.position({
my: 'right bottom', my: 'right bottom',
at: 'rigt bottom', at: 'rigt bottom',
of: '#parentx', of: '#parentx',
collision: 'none' collision: 'none'
}).offset(); }).offset();
elems.position({ elems.position({
my: 'left top', my: 'left top',
at: 'left top', at: 'left top',
of: '#parentx', of: '#parentx',
by: function(position) { using: function(position) {
same(this, elems[count], 'correct context for call #' + count); same(this, elems[count], 'correct context for call #' + count);
same(position, expectedPosition, 'correct position for call #' + count); same(position, expectedPosition, 'correct position for call #' + count);
count++; count++;
} }
}); });
elems.each(function() { elems.each(function() {
same($(this).offset(), originalPosition, 'elements not moved'); same($(this).offset(), originalPosition, 'elements not moved');
}); });
}); });
function collisionTest(config, result, msg) { function collisionTest(config, result, msg) {
var elem = $("#elx").position($.extend({ var elem = $("#elx").position($.extend({
my: "left top", my: "left top",
at: "right bottom", at: "right bottom",
of: window of: window
}, config)); }, config));
same(elem.offset(), result, msg); same(elem.offset(), result, msg);
} }
function collisionTest2(config, result, msg) { function collisionTest2(config, result, msg) {
collisionTest($.extend({ collisionTest($.extend({
my: "right bottom", my: "right bottom",
at: "left top" at: "left top"
}, config), result, msg); }, config), result, msg);
} }
test("collision: fit, no offset", function() { test("collision: fit, no offset", function() {
collisionTest({ collisionTest({
collision: "fit" collision: "fit"
}, { top: $(window).height() - 10, left: $(window).width() - 10 }, "right bottom"); }, { top: $(window).height() - 10, left: $(window).width() - 10 }, "right bottom");
collisionTest2({ collisionTest2({
collision: "fit" collision: "fit"
}, { top: 0, left: 0 }, "left top"); }, { top: 0, left: 0 }, "left top");
}); });
test("collision: fit, with offset", function() { test("collision: fit, with offset", function() {
collisionTest({ collisionTest({
collision: "fit", collision: "fit",
offset: "2 3" offset: "2 3"
}, { top: $(window).height() - 10, left: $(window).width() - 10 }, "right bottom"); }, { top: $(window).height() - 10, left: $(window).width() - 10 }, "right bottom");
collisionTest2({ collisionTest2({
collision: "fit", collision: "fit",
offset: "2 3" offset: "2 3"
}, { top: 0, left: 0 }, "left top, positive offset"); }, { top: 0, left: 0 }, "left top, positive offset");
collisionTest2({ collisionTest2({
collision: "fit", collision: "fit",
offset: "-2 -3" offset: "-2 -3"
}, { top: 0, left: 0 }, "left top, negative offset"); }, { top: 0, left: 0 }, "left top, negative offset");
}); });
test("collision: flip, no offset", function() { test("collision: flip, no offset", function() {
collisionTest({ collisionTest({
collision: "flip" collision: "flip"
}, { top: -10, left: -10 }, "left top"); }, { top: -10, left: -10 }, "left top");
collisionTest2({ collisionTest2({
collision: "flip" collision: "flip"
}, { top: $(window).height(), left: $(window).width() }, "right bottom"); }, { top: $(window).height(), left: $(window).width() }, "right bottom");
}); });
test("collision: flip, with offset", function() { test("collision: flip, with offset", function() {
collisionTest({ collisionTest({
collision: "flip", collision: "flip",
offset: "2 3" offset: "2 3"
}, { top: -13, left: -12 }, "left top, with offset added"); }, { top: -13, left: -12 }, "left top, with offset added");
collisionTest2({ collisionTest2({
collision: "flip", collision: "flip",
offset: "2 3" offset: "2 3"
}, { top: $(window).height() - 3, left: $(window).width() - 2 }, "bottom, positive offset"); }, { top: $(window).height() - 3, left: $(window).width() - 2 }, "bottom, positive offset");
collisionTest2({ collisionTest2({
collision: "flip", collision: "flip",
offset: "-2 -3" offset: "-2 -3"
}, { top: $(window).height() + 3, left: $(window).width() + 2 }, "right bottom, negative offset"); }, { top: $(window).height() + 3, left: $(window).width() + 2 }, "right bottom, negative offset");
}); });
test("collision: none, no offset", function() { test("collision: none, no offset", function() {
collisionTest({ collisionTest({
collision: "none" collision: "none"
}, { top: $(window).height(), left: $(window).width() }, "left top"); }, { top: $(window).height(), left: $(window).width() }, "left top");
collisionTest2({ collisionTest2({
collision: "none" collision: "none"
}, { top: -10, left: -10 }, "moved to the right bottom"); }, { top: -10, left: -10 }, "moved to the right bottom");
}); });
test("collision: none, with offset", function() { test("collision: none, with offset", function() {
collisionTest({ collisionTest({
collision: "none", collision: "none",
offset: "2 3" offset: "2 3"
}, { top: $(window).height() + 3, left: $(window).width() + 2 }, "right bottom, with offset added"); }, { top: $(window).height() + 3, left: $(window).width() + 2 }, "right bottom, with offset added");
collisionTest2({ collisionTest2({
collision: "none", collision: "none",
offset: "2 3" offset: "2 3"
}, { top: -7, left: -8 }, "left top, positive offset"); }, { top: -7, left: -8 }, "left top, positive offset");
collisionTest2({ collisionTest2({
collision: "none", collision: "none",
offset: "-2 -3" offset: "-2 -3"
}, { top: -13, left: -12 }, "left top, negative offset"); }, { top: -13, left: -12 }, "left top, negative offset");
}); });
})(jQuery); })(jQuery);

View File

@ -3,15 +3,14 @@ var hasDuplicate = false;
function testWidgetDefaults(widget, defaults) { function testWidgetDefaults(widget, defaults) {
var pluginDefaults = $.extend({}, var pluginDefaults = $.extend({},
$.widget.defaults, $.ui[widget].prototype.options
$.ui[widget].defaults
); );
// ensure that all defualts have the correct value // ensure that all defaults have the correct value
test('defined defaults', function() { test('defined defaults', function() {
$.each(defaults, function(key, val) { $.each(defaults, function(key, val) {
if ($.isFunction(val)) { if ($.isFunction(val)) {
ok(val !== undefined); ok(val !== undefined, key);
return; return;
} }
same(pluginDefaults[key], val, key); same(pluginDefaults[key], val, key);
@ -24,72 +23,21 @@ function testWidgetDefaults(widget, defaults) {
ok(key in defaults, key); ok(key in defaults, key);
}); });
}); });
// defaults after init
test('defaults on init', function() {
var el = $('<div/>')[widget](),
instance = el.data(widget);
$.each(defaults, function(key, val) {
if ($.isFunction(val)) {
ok(val !== undefined);
return;
}
same(instance.options[key], val, key);
});
el.remove();
});
}
function testSettingOptions(widget, options) {
test('option values', function() {
var el = $('<div/>')[widget](),
instance = el.data(widget);
$.each(options, function(i, option) {
$.each({
'null': null,
'false': false,
'true': true,
zero: 0,
number: 1,
'empty string': '',
string: 'string',
'empty array': [],
array: ['array'],
'empty object': {},
object: {obj: 'ect'},
date: new Date(),
regexp: /regexp/,
'function': function() {}
}, function(type, val) {
el[widget]('option', option, val);
same(instance.options[option], val, option + ': ' + type);
});
});
el.remove();
});
} }
function testWidgetOverrides(widget) { function testWidgetOverrides(widget) {
test('$.widget overrides', function() { test('$.widget overrides', function() {
$.each(['option', '_getData', '_trigger'], function(i, method) { $.each(['_widgetInit', 'option', '_trigger'], function(i, method) {
ok($.widget.prototype[method] == $.ui[widget].prototype[method], ok($.Widget.prototype[method] == $.ui[widget].prototype[method],
'should not override ' + method); 'should not override ' + method);
}); });
}); });
} }
function commonWidgetTests(widget, settings) { function commonWidgetTests(widget, settings) {
var options = [];
$.each(settings.defaults, function(option) {
options.push(option);
});
module(widget + ": common widget"); module(widget + ": common widget");
testWidgetDefaults(widget, settings.defaults); testWidgetDefaults(widget, settings.defaults);
testSettingOptions(widget, options);
testWidgetOverrides(widget); testWidgetOverrides(widget);
} }

View File

@ -0,0 +1,24 @@
<!doctype html>
<html lang="en">
<head>
<title>jQuery UI Widget Test Suite</title>
<script type="text/javascript" src="../../../jquery-1.3.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>
<link type="text/css" href="../testsuite.css" rel="stylesheet" />
<script type="text/javascript" src="../../../external/testrunner-r6588.js"></script>
<script type="text/javascript" src="../../jquery.simulate.js"></script>
<script type="text/javascript" src="../testsuite.js"></script>
<script type="text/javascript" src="widget.js"></script>
</head>
<body>
<div id="main">
</div>
</body>
</html>

168
tests/unit/widget/widget.js Normal file
View File

@ -0,0 +1,168 @@
/*
* widget unit tests
*/
(function($) {
module('widget factory', {
teardown: function() {
delete $.ui.testWidget;
}
});
test('widget creation', function() {
var myPrototype = {
_init: function() {},
creationTest: function() {}
};
$.widget('ui.testWidget', myPrototype);
ok($.isFunction($.ui.testWidget), 'constructor was created');
equals('object', typeof $.ui.testWidget.prototype, 'prototype was created');
equals($.ui.testWidget.prototype._init, myPrototype._init, 'init function is copied over');
equals($.ui.testWidget.prototype.creationTest, myPrototype.creationTest, 'random function is copied over');
equals($.ui.testWidget.prototype.option, $.Widget.prototype.option, 'option method copied over from base widget');
});
test('jQuery usage', function() {
expect(10);
var shouldInit = false;
$.widget('ui.testWidget', {
getterSetterVal: 5,
_init: function() {
ok(shouldInit, 'init called on instantiation');
},
methodWithParams: function(param1, param2) {
ok(true, 'method called via .pluginName(methodName)');
equals(param1, 'value1', 'parameter passed via .pluginName(methodName, param)');
equals(param2, 'value2', 'multiple parameter passed via .pluginName(methodName, param, param)');
return this;
},
getterSetterMethod: function(val) {
if (val) {
this.getterSetterVal = val;
} else {
return this.getterSetterVal;
}
}
});
shouldInit = true;
var elem = $('<div></div>').testWidget();
shouldInit = false;
var instance = elem.data('testWidget');
equals(typeof instance, 'object', 'instance stored in .data(pluginName)');
equals(instance.element[0], elem[0], 'element stored on widget');
var ret = elem.testWidget('methodWithParams', 'value1', 'value2');
equals(ret, elem, 'jQuery object returned from method call');
ret = elem.testWidget('getterSetterMethod');
equals(ret, 5, 'getter/setter can act as getter');
ret = elem.testWidget('getterSetterMethod', 30);
equals(ret, elem, 'getter/setter method can be chainable');
equals(instance.getterSetterVal, 30, 'getter/setter can act as setter');
});
test('direct usage', function() {
expect(9);
var shouldInit = false;
$.widget('ui.testWidget', {
getterSetterVal: 5,
_init: function() {
ok(shouldInit, 'init called on instantiation');
},
methodWithParams: function(param1, param2) {
ok(true, 'method called via .pluginName(methodName)');
equals(param1, 'value1', 'parameter passed via .pluginName(methodName, param)');
equals(param2, 'value2', 'multiple parameter passed via .pluginName(methodName, param, param)');
return this;
},
getterSetterMethod: function(val) {
if (val) {
this.getterSetterVal = val;
} else {
return this.getterSetterVal;
}
}
});
var elem = $('<div></div>')[0];
shouldInit = true;
var instance = new $.ui.testWidget({}, elem);
shouldInit = false;
equals($(elem).data('testWidget'), instance, 'instance stored in .data(pluginName)');
equals(instance.element[0], elem, 'element stored on widget');
var ret = instance.methodWithParams('value1', 'value2');
equals(ret, instance, 'plugin returned from method call');
ret = instance.getterSetterMethod();
equals(ret, 5, 'getter/setter can act as getter');
instance.getterSetterMethod(30);
equals(instance.getterSetterVal, 30, 'getter/setter can act as setter');
});
test('merge multiple option arguments', function() {
expect(1);
$.widget("ui.testWidget", {
_init: function() {
same(this.options, {
disabled: false,
option1: "value1",
option2: "value2",
option3: "value3",
option4: {
option4a: "valuea",
option4b: "valueb"
}
});
}
});
$("<div></div>").testWidget({
option1: "valuex",
option2: "valuex",
option3: "value3",
option4: {
option4a: "valuex"
}
}, {
option1: "value1",
option2: "value2",
option4: {
option4b: "valueb"
}
}, {
option4: {
option4a: "valuea"
}
});
});
test(".widget() - base", function() {
$.widget("ui.testWidget", {
_init: function() {}
});
var div = $("<div></div>").testWidget()
same(div[0], div.testWidget("widget")[0]);
});
test(".widget() - overriden", function() {
var wrapper = $("<div></div>");
$.widget("ui.testWidget", {
_init: function() {},
widget: function() {
return wrapper;
}
});
same(wrapper[0], $("<div></div>").testWidget().testWidget("widget")[0]);
});
})(jQuery);

View File

@ -1,51 +1,51 @@
<!doctype html> <!doctype html>
<html lang="en"> <html lang="en">
<head> <head>
<title>Accordion Visual Test : Accordion option autoHeight true</title> <title>Accordion Visual Test : Accordion option autoHeight true</title>
<link rel="stylesheet" href="../visual.css" type="text/css" /> <link rel="stylesheet" href="../visual.css" type="text/css" />
<link rel="stylesheet" href="../../../themes/base/ui.all.css" type="text/css"> <link rel="stylesheet" href="../../../themes/base/ui.all.css" type="text/css">
<script type="text/javascript" src="../../../jquery-1.3.2.js"></script> <script type="text/javascript" src="../../../jquery-1.3.2.js"></script>
<script type="text/javascript" src="../../../ui/jquery.ui.core.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.widget.js"></script>
<script type="text/javascript" src="../../../ui/jquery.ui.accordion.js"></script> <script type="text/javascript" src="../../../ui/jquery.ui.accordion.js"></script>
<script type="text/javascript"> <script type="text/javascript">
$(function() { $(function() {
$("#accordion").accordion({ $("#accordion").accordion({
fillSpace: true fillSpace: true
}); });
}) })
</script> </script>
</head> </head>
<body> <body>
<div style="height: 500px; width: 500px; border: 1px solid red;"> <div style="height: 500px; width: 500px; border: 1px solid red;">
<div id="accordion" style="width:490px;"> <div id="accordion" style="width:490px;">
<h3><a href="#">Accordion Header 1</a></h3> <h3><a href="#">Accordion Header 1</a></h3>
<div style="padding-top: 1em"> <div style="padding-top: 1em">
Accordion Content 1 Accordion Content 1
</div> </div>
<h3><a href="#">Accordion Header 2</a></h3> <h3><a href="#">Accordion Header 2</a></h3>
<div style="padding-top: 3em"> <div style="padding-top: 3em">
Accordion Content 2 Accordion Content 2
<p>paragraph</p> <p>paragraph</p>
<p>paragraph</p> <p>paragraph</p>
<p>paragraph</p> <p>paragraph</p>
<p>paragraph</p> <p>paragraph</p>
<p>paragraph</p> <p>paragraph</p>
<p>paragraph</p> <p>paragraph</p>
<p>paragraph</p> <p>paragraph</p>
</div> </div>
<h3><a href="#">Accordion Header 3</a></h3> <h3><a href="#">Accordion Header 3</a></h3>
<div style="padding-top: 0"> <div style="padding-top: 0">
Accordion Content 3 Accordion Content 3
<ul> <ul>
<li>list item</li> <li>list item</li>
<li>list item</li> <li>list item</li>
<li>list item</li> <li>list item</li>
</ul> </ul>
</div> </div>
</div> </div>
</div> </div>
</body> </body>
</html> </html>

View File

@ -1,74 +1,74 @@
<!doctype html> <!doctype html>
<html lang="en"> <html lang="en">
<head> <head>
<title>Accordion Visual Test : Accordion ticket #4322</title> <title>Accordion Visual Test : Accordion ticket #4322</title>
<link rel="stylesheet" href="../visual.css" type="text/css" /> <link rel="stylesheet" href="../visual.css" type="text/css" />
<link rel="stylesheet" href="../../../themes/base/ui.all.css" type="text/css"> <link rel="stylesheet" href="../../../themes/base/ui.all.css" type="text/css">
<script type="text/javascript" src="../../../jquery-1.3.2.js"></script> <script type="text/javascript" src="../../../jquery-1.3.2.js"></script>
<script type="text/javascript" src="../../../ui/jquery.ui.core.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.widget.js"></script>
<script type="text/javascript" src="../../../ui/jquery.ui.accordion.js"></script> <script type="text/javascript" src="../../../ui/jquery.ui.accordion.js"></script>
<style> <style>
p {margin: .5em 0;} p {margin: .5em 0;}
</style> </style>
<script type="text/javascript"> <script type="text/javascript">
$(function() { $(function() {
$("#accordion1, #accordion2").accordion(); $("#accordion1, #accordion2").accordion();
}) })
</script> </script>
</head> </head>
<body> <body>
<h1 class="ui-widget-header"><a href="http://dev.jqueryui.com/ticket/4322">#4322 - Accordion going smaller and smaller in IE 6</a></h1> <h1 class="ui-widget-header"><a href="http://dev.jqueryui.com/ticket/4322">#4322 - Accordion going smaller and smaller in IE 6</a></h1>
<div id="accordion1" style="width:200px"> <div id="accordion1" style="width:200px">
<h3><a href="#">Section 1</a></h3> <h3><a href="#">Section 1</a></h3>
<div> <div>
<p> <p>
Mauris mauris ante, blandit et, ultrices a, suscipit eget, quam. Integer Mauris mauris ante, blandit et, ultrices a, suscipit eget, quam. Integer
ut neque. Vivamus nisi metus, molestie vel, gravida in, condimentum sit ut neque. Vivamus nisi metus, molestie vel, gravida in, condimentum sit
amet, nunc. Nam a nibh. Donec suscipit eros. Nam mi. Proin viverra leo ut amet, nunc. Nam a nibh. Donec suscipit eros. Nam mi. Proin viverra leo ut
odio. Curabitur malesuada. Vestibulum a velit eu ante scelerisque vulputate. odio. Curabitur malesuada. Vestibulum a velit eu ante scelerisque vulputate.
</p> </p>
</div> </div>
<h3><a href="#">Section 2</a></h3> <h3><a href="#">Section 2</a></h3>
<div> <div>
<p> <p>
Sed non urna. Donec et ante. Phasellus eu ligula. Vestibulum sit amet Sed non urna. Donec et ante. Phasellus eu ligula. Vestibulum sit amet
purus. Vivamus hendrerit, dolor at aliquet laoreet, mauris turpis porttitor purus. Vivamus hendrerit, dolor at aliquet laoreet, mauris turpis porttitor
velit, faucibus interdum tellus libero ac justo. Vivamus non quam. In velit, faucibus interdum tellus libero ac justo. Vivamus non quam. In
suscipit faucibus urna. suscipit faucibus urna.
</p> </p>
</div> </div>
</div> </div>
content below content below
<div id="accordion2"> <div id="accordion2">
<h3><a href="#">Section 1</a></h3> <h3><a href="#">Section 1</a></h3>
<div> <div>
<p> <p>
Mauris mauris ante, blandit et, ultrices a, suscipit eget, quam. Integer Mauris mauris ante, blandit et, ultrices a, suscipit eget, quam. Integer
ut neque. Vivamus nisi metus, molestie vel, gravida in, condimentum sit ut neque. Vivamus nisi metus, molestie vel, gravida in, condimentum sit
amet, nunc. Nam a nibh. Donec suscipit eros. Nam mi. Proin viverra leo ut amet, nunc. Nam a nibh. Donec suscipit eros. Nam mi. Proin viverra leo ut
odio. Curabitur malesuada. Vestibulum a velit eu ante scelerisque vulputate. odio. Curabitur malesuada. Vestibulum a velit eu ante scelerisque vulputate.
</p> </p>
</div> </div>
<h3><a href="#">Section 2</a></h3> <h3><a href="#">Section 2</a></h3>
<div> <div>
<p> <p>
Sed non urna. Donec et ante. Phasellus eu ligula. Vestibulum sit amet Sed non urna. Donec et ante. Phasellus eu ligula. Vestibulum sit amet
purus. Vivamus hendrerit, dolor at aliquet laoreet, mauris turpis porttitor purus. Vivamus hendrerit, dolor at aliquet laoreet, mauris turpis porttitor
velit, faucibus interdum tellus libero ac justo. Vivamus non quam. In velit, faucibus interdum tellus libero ac justo. Vivamus non quam. In
suscipit faucibus urna. suscipit faucibus urna.
</p> </p>
</div> </div>
</div> </div>
content below content below
</body> </body>
</html> </html>

View File

@ -1,50 +1,50 @@
<!doctype html> <!doctype html>
<html lang="en"> <html lang="en">
<head> <head>
<title>Accordion Visual Test : Accordion ticket #4444</title> <title>Accordion Visual Test : Accordion ticket #4444</title>
<link rel="stylesheet" href="../visual.css" type="text/css" /> <link rel="stylesheet" href="../visual.css" type="text/css" />
<link rel="stylesheet" href="../../../themes/base/ui.all.css" type="text/css"> <link rel="stylesheet" href="../../../themes/base/ui.all.css" type="text/css">
<script type="text/javascript" src="../../../jquery-1.3.2.js"></script> <script type="text/javascript" src="../../../jquery-1.3.2.js"></script>
<script type="text/javascript" src="../../../ui/jquery.ui.core.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.widget.js"></script>
<script type="text/javascript" src="../../../ui/jquery.ui.accordion.js"></script> <script type="text/javascript" src="../../../ui/jquery.ui.accordion.js"></script>
<script type="text/javascript"> <script type="text/javascript">
$(function() { $(function() {
$("#accordion").accordion({ $("#accordion").accordion({
autoHeight: false autoHeight: false
}); });
}) })
</script> </script>
</head> </head>
<body> <body>
<h1 class="ui-widget-header"><a href="http://dev.jqueryui.com/ticket/4444">#4444 - Accordion Content disappears with autoHeight set to false in IE 6</a></h1> <h1 class="ui-widget-header"><a href="http://dev.jqueryui.com/ticket/4444">#4444 - Accordion Content disappears with autoHeight set to false in IE 6</a></h1>
<div id="accordion" > <div id="accordion" >
<h3><a href="#">Section 1</a></h3> <h3><a href="#">Section 1</a></h3>
<div > <div >
Accordion Content 1<br> Accordion Content 1<br>
<a href="#">Link Test #1</a> <a href="#">Link Test #1</a>
</div> </div>
<h3><a href="#">Section 2</a></h3> <h3><a href="#">Section 2</a></h3>
<div> <div>
<a href="#" >Accordion Content 2</a> <a href="#" >Accordion Content 2</a>
</div> </div>
<h3><a href="#">Section 3</a></h3> <h3><a href="#">Section 3</a></h3>
<div> <div>
<p>Accordion Content 3 </p> <p>Accordion Content 3 </p>
<ul> <ul>
<li>List item</li> <li>List item</li>
<li>List item</li> <li>List item</li>
<li>List item</li> <li>List item</li>
<li>List item</li> <li>List item</li>
<li>List item</li> <li>List item</li>
<li>List item</li> <li>List item</li>
<li>List item</li> <li>List item</li>
</ul> </ul>
</div> </div>
</div> </div>
</body> </body>
</html> </html>

View File

@ -0,0 +1,137 @@
<!DOCTYPE html>
<html lang="en">
<head>
<title>Button Visual push: Default</title>
<link rel="stylesheet" href="../visual.css" type="text/css" />
<link rel="stylesheet" href="../../../themes/base/ui.all.css" type="text/css">
<style type="text/css">
#toolbar { margin-top: 2em; padding:0.2em; }
#ops1, #ops2, #format, #mode { margin-right: 1em }
</style>
<script type="text/javascript" src="../../../jquery-1.3.2.js"></script>
<script type="text/javascript" src="../../../external/jquery.metadata.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.button.js"></script>
<script type="text/javascript">
$(function() {
var buttons = $('#push button, #check').button();
var buttonSets = $('#radio0, #radio1, #radio2, #ops1, #format, #ops2, #mode, #inputs, #anchors').buttonset();
buttons.add(buttonSets).click(function(event) {
var target = $(event.target);
if (target.closest('.ui-button').length) {
$("<div></div>")
.text("Clicked " + (target.text() || target.val()))
.appendTo("#log");
}
});
$("#disable-widgets").toggle(function() {
buttons.button("disable");
buttonSets.buttonset("disable");
}, function() {
buttons.button("enable");
buttonSets.buttonset("enable");
});
$("#toggle-widgets").toggle(function() {
buttons.button();
buttonSets.buttonset();
}, function() {
buttons.button("destroy");
buttonSets.buttonset("destroy");
}).click();
});
</script>
</head>
<body>
<div id="push">
<div>
No icon
<button>Simple button, only text</button>
<button class="ui-priority-secondary">Secondary priority button</button>
</div>
<br/>
<div>
With icon
<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button>
<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button>
<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button>
<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button>
</div>
</div>
<div id="toggle" style="margin-top: 2em;">
<input type="checkbox" id="check" /><label for="check">Toggle</label>
</div>
<div id="radio0" style="margin-top: 2em;">
<input type="radio" id="radio01" name="radio" checked="checked" /><label for="radio01">Choice 1</label>
<input type="radio" id="radio02" name="radio" /><label for="radio02">Choice 2</label>
<input type="radio" id="radio03" name="radio" /><label for="radio03">Choice 3</label>
</div>
<form>
<div id="radio1" style="margin-top: 2em;">
<input type="radio" id="radio11" name="radio" /><label for="radio11">Choice 1</label>
<input type="radio" id="radio12" name="radio" checked="checked" /><label for="radio12">Choice 2</label>
<input type="radio" id="radio13" name="radio" /><label for="radio13">Choice 3</label>
</div>
</form>
<form>
<div id="radio2" style="margin-top: 2em;">
<input type="radio" id="radio21" name="radio" /><label for="radio21">Choice 1</label>
<input type="radio" id="radio22" name="radio" /><label for="radio22">Choice 2</label>
<input type="radio" id="radio23" name="radio" checked="checked" /><label for="radio23">Choice 3</label>
</div>
</form>
<div id="toolbar" class="ui-widget-header ui-corner-all ui-helper-clearfix">
<span id="ops1">
<button class="{button:{icons:{primary:'ui-icon-folder-open'},text:false}}">Open</button>
<button class="{button:{icons:{primary:'ui-icon-disk'},text:false}}">Save</button>
<button class="{button:{icons:{primary:'ui-icon-trash'},text:false}}">Delete</button>
</span>
<span id="format">
<input type="checkbox" id="check1" /><label for="check1">B</label>
<input type="checkbox" id="check2" /><label for="check2">I</label>
<input type="checkbox" id="check3" /><label for="check3">U</label>
</span>
<span id="ops2">
<button class="{button:{icons:{primary:'ui-icon-print'},text:false}}">Print...</button>
<button class="{button:{icons:{primary:'ui-icon-mail-closed'},text:false}}">Mail to...</button>
</span>
<span id="mode">
<input type="radio" id="mode1" name="radio2" checked="checked" /><label for="mode1">Edit</label>
<input type="radio" id="mode2" name="radio2" /><label for="mode2">View</label>
</span>
</div>
<div id="inputs" style="margin-top: 2em;">
<input type="submit" value="Submit button" />
<input type="reset" value="Reset button" class="{button:{label:'Custom reset'}}" />
</div>
<div id="anchors" style="margin-top: 2em;">
<a href="#">Anchor 1</a>
<a href="#" class="{button:{icons:{primary:'ui-icon-print'},text:false}}">Anchor 2</a>
<a href="#" class="{button:{icons:{primary:'ui-icon-mail-closed'},text:false}}">Anchor 3</a>
<a href="#">Anchor 4</a>
</div>
<div style="margin-top: 2em;">
<button id="disable-widgets">Toggle disabled</button>
<button id="toggle-widgets">Toggle widget</button>
</div>
<div id="log"></div>
<script type="text/javascript" src="http://jqueryui.com/themeroller/themeswitchertool/"></script>
<script type="text/javascript">
$.fn.themeswitcher && $('<div></div>').css({
position: "absolute",
right: 10,
top: 10
}).appendTo(document.body).themeswitcher();
</script>
</body>
</html>

View File

@ -21,7 +21,7 @@
</script> </script>
</head> </head>
<body> <body>
<input />
<div id="dialog" title="Dialog Title"> <div id="dialog" title="Dialog Title">
<p> Dialog Content </p> <p> Dialog Content </p>
</div> </div>

View File

@ -21,7 +21,7 @@
</script> </script>
</head> </head>
<body> <body>
<input />
<div id="dialog" title="Dialog Title"> <div id="dialog" title="Dialog Title">
<p> Dialog Content </p> <p> Dialog Content </p>
</div> </div>

View File

@ -25,6 +25,7 @@
<h2>Widgets</h2> <h2>Widgets</h2>
<ul> <ul>
<li><a href="accordion/default.html">Accordion</a></li> <li><a href="accordion/default.html">Accordion</a></li>
<li><a href="button/default.html">Button</a></li>
<li><a href="datepicker/default.html">Datepicker</a></li> <li><a href="datepicker/default.html">Datepicker</a></li>
<li><a href="dialog/default.html">Dialog</a></li> <li><a href="dialog/default.html">Dialog</a></li>
<li><a href="progressbar/default.html">Progressbar</a></li> <li><a href="progressbar/default.html">Progressbar</a></li>

View File

@ -1,53 +1,53 @@
<!doctype html> <!doctype html>
<html lang="en"> <html lang="en">
<head> <head>
<title>Sortable Visual Test : Sortable ticket #4551</title> <title>Sortable Visual Test : Sortable ticket #4551</title>
<link rel="stylesheet" href="../visual.css" type="text/css" /> <link rel="stylesheet" href="../visual.css" type="text/css" />
<link rel="stylesheet" href="../../../themes/base/ui.all.css" type="text/css"> <link rel="stylesheet" href="../../../themes/base/ui.all.css" type="text/css">
<script type="text/javascript" src="../../../jquery-1.3.2.js"></script> <script type="text/javascript" src="../../../jquery-1.3.2.js"></script>
<script type="text/javascript" src="../../../ui/jquery.ui.core.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.widget.js"></script>
<script type="text/javascript" src="../../../ui/jquery.ui.mouse.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" src="../../../ui/jquery.ui.sortable.js"></script>
<script type="text/javascript"> <script type="text/javascript">
$(function() { $(function() {
$("#first, #second").sortable({ $("#first, #second").sortable({
connectWith: '.sortable' connectWith: '.sortable'
}).disableSelection(); }).disableSelection();
}); });
</script> </script>
<style type="text/css"> <style type="text/css">
.sortable { margin: 0; padding: 0; } .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; } .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; } #second div { background: #acc; }
</style> </style>
</head> </head>
<body> <body>
<h1 class="ui-widget-header"><a href="http://dev.jqueryui.com/ticket/4551">#4551 - Sortable connectWith fails if item is floated</a></h1> <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 id="first" class="sortable">
<div>1</div> <div>1</div>
<div>2</div> <div>2</div>
<div>3</div> <div>3</div>
<div>4</div> <div>4</div>
<div>5</div> <div>5</div>
<div>6</div> <div>6</div>
<div>7</div> <div>7</div>
<div>8</div> <div>8</div>
<div>9</div> <div>9</div>
<div>10</div> <div>10</div>
<div>11</div> <div>11</div>
<div>12</div> <div>12</div>
</div> </div>
<br style="clear:both;"> <br style="clear:both;">
<hr /> <hr />
<div id="second" class="sortable"> <div id="second" class="sortable">
<div>12</div> <div>12</div>
<div>14</div> <div>14</div>
</div> </div>
</body> </body>
</html> </html>

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.5 KiB

View File

@ -1,6 +1,7 @@
@import url("ui.core.css"); @import url("ui.core.css");
@import url("ui.accordion.css"); @import url("ui.accordion.css");
@import url("ui.button.css");
@import url("ui.datepicker.css"); @import url("ui.datepicker.css");
@import url("ui.dialog.css"); @import url("ui.dialog.css");
@import url("ui.progressbar.css"); @import url("ui.progressbar.css");

35
themes/base/ui.button.css Normal file
View File

@ -0,0 +1,35 @@
/* Button
----------------------------------*/
.ui-button { display: inline-block; position: relative; padding: 0; margin-right: .1em; text-decoration: none !important; cursor: pointer; text-align: center; zoom: 1; overflow: visible; } /* the overflow property removes extra width in IE */
.ui-button-icon-only { width: 2.2em; } /* to make room for the icon, a width needs to be set here */
button.ui-button-icon-only { width: 2.4em; } /* button elements seem to need a little more width */
.ui-button-icons-only { width: 3em; }
button.ui-button-icons-only { width: 3.2em; }
/*button text element */
.ui-button .ui-button-text { display: block; line-height: 1.4; }
.ui-button-text-only .ui-button-text { padding: .4em 1em; }
.ui-button-icon-only .ui-button-text, .ui-button-icons-only .ui-button-text { padding: .4em; text-indent: -9999999px; }
.ui-button-text-icon .ui-button-text, .ui-button-text-icons .ui-button-text { padding: .4em 1em .4em 1.8em; }
.ui-button-text-icons .ui-button-text { padding-right: 1.8em; }
/* no icon support for input elements, provide padding by default */
input.ui-button { padding: .4em 1em; }
/*button icon element(s) */
.ui-button-icon-only .ui-icon, .ui-button-text-icon .ui-icon, .ui-button-text-icons .ui-icon, .ui-button-icons-only .ui-icon { position: absolute; top: 50%; margin-top: -8px; }
.ui-button-icon-only .ui-icon { left: 50%; margin-left: -8px; }
.ui-button-text-icon .ui-icon-primary, .ui-button-text-icons .ui-icon-primary, .ui-button-icons-only .ui-icon-primary { left: .5em; }
.ui-button-text-icons .ui-button-icon-secondary, .ui-button-icons-only .ui-button-icon-secondary { right: .5em; }
/*button sets*/
.ui-button-set { margin-right: 7px; }
.ui-button-set .ui-button { margin-left: 0; margin-right: -.3em; }
/* workarounds */
button.ui-button::-moz-focus-inner { border: 0; padding: 0; } /* reset extra padding in Firefox */

View File

@ -186,6 +186,8 @@
.ui-icon-seek-next { background-position: -32px -160px; } .ui-icon-seek-next { background-position: -32px -160px; }
.ui-icon-seek-prev { background-position: -48px -160px; } .ui-icon-seek-prev { background-position: -48px -160px; }
.ui-icon-seek-end { background-position: -64px -160px; } .ui-icon-seek-end { background-position: -64px -160px; }
.ui-icon-seek-start { background-position: -80px -160px; }
/* ui-icon-seek-first is deprecated, use ui-icon-seek-start instead */
.ui-icon-seek-first { background-position: -80px -160px; } .ui-icon-seek-first { background-position: -80px -160px; }
.ui-icon-stop { background-position: -96px -160px; } .ui-icon-stop { background-position: -96px -160px; }
.ui-icon-eject { background-position: -112px -160px; } .ui-icon-eject { background-position: -112px -160px; }

View File

@ -1,23 +1,23 @@
/* Euskarako oinarria 'UI date picker' jquery-ko extentsioarentzat */ /* Euskarako oinarria 'UI date picker' jquery-ko extentsioarentzat */
/* Karrikas-ek itzulia (karrikas@karrikas.com) */ /* Karrikas-ek itzulia (karrikas@karrikas.com) */
jQuery(function($){ jQuery(function($){
$.datepicker.regional['eu'] = { $.datepicker.regional['eu'] = {
closeText: 'Egina', closeText: 'Egina',
prevText: '&#x3c;Aur', prevText: '&#x3c;Aur',
nextText: 'Hur&#x3e;', nextText: 'Hur&#x3e;',
currentText: 'Gaur', currentText: 'Gaur',
monthNames: ['Urtarrila','Otsaila','Martxoa','Apirila','Maiatza','Ekaina', monthNames: ['Urtarrila','Otsaila','Martxoa','Apirila','Maiatza','Ekaina',
'Uztaila','Abuztua','Iraila','Urria','Azaroa','Abendua'], 'Uztaila','Abuztua','Iraila','Urria','Azaroa','Abendua'],
monthNamesShort: ['Urt','Ots','Mar','Api','Mai','Eka', monthNamesShort: ['Urt','Ots','Mar','Api','Mai','Eka',
'Uzt','Abu','Ira','Urr','Aza','Abe'], 'Uzt','Abu','Ira','Urr','Aza','Abe'],
dayNames: ['Igandea','Astelehena','Asteartea','Asteazkena','Osteguna','Ostirala','Larunbata'], dayNames: ['Igandea','Astelehena','Asteartea','Asteazkena','Osteguna','Ostirala','Larunbata'],
dayNamesShort: ['Iga','Ast','Ast','Ast','Ost','Ost','Lar'], dayNamesShort: ['Iga','Ast','Ast','Ast','Ost','Ost','Lar'],
dayNamesMin: ['Ig','As','As','As','Os','Os','La'], dayNamesMin: ['Ig','As','As','As','Os','Os','La'],
weekHeader: 'Wk', weekHeader: 'Wk',
dateFormat: 'yy/mm/dd', dateFormat: 'yy/mm/dd',
firstDay: 1, firstDay: 1,
isRTL: false, isRTL: false,
showMonthAfterYear: false, showMonthAfterYear: false,
yearSuffix: ''}; yearSuffix: ''};
$.datepicker.setDefaults($.datepicker.regional['eu']); $.datepicker.setDefaults($.datepicker.regional['eu']);
}); });

View File

@ -1,23 +1,23 @@
/* Swiss-French initialisation for the jQuery UI date picker plugin. */ /* Swiss-French initialisation for the jQuery UI date picker plugin. */
/* Written Martin Voelkle (martin.voelkle@e-tc.ch). */ /* Written Martin Voelkle (martin.voelkle@e-tc.ch). */
jQuery(function($){ jQuery(function($){
$.datepicker.regional['fr-CH'] = { $.datepicker.regional['fr-CH'] = {
closeText: 'Fermer', closeText: 'Fermer',
prevText: '&#x3c;Préc', prevText: '&#x3c;Préc',
nextText: 'Suiv&#x3e;', nextText: 'Suiv&#x3e;',
currentText: 'Courant', currentText: 'Courant',
monthNames: ['Janvier','Février','Mars','Avril','Mai','Juin', monthNames: ['Janvier','Février','Mars','Avril','Mai','Juin',
'Juillet','Août','Septembre','Octobre','Novembre','Décembre'], 'Juillet','Août','Septembre','Octobre','Novembre','Décembre'],
monthNamesShort: ['Jan','Fév','Mar','Avr','Mai','Jun', monthNamesShort: ['Jan','Fév','Mar','Avr','Mai','Jun',
'Jul','Aoû','Sep','Oct','Nov','Déc'], 'Jul','Aoû','Sep','Oct','Nov','Déc'],
dayNames: ['Dimanche','Lundi','Mardi','Mercredi','Jeudi','Vendredi','Samedi'], dayNames: ['Dimanche','Lundi','Mardi','Mercredi','Jeudi','Vendredi','Samedi'],
dayNamesShort: ['Dim','Lun','Mar','Mer','Jeu','Ven','Sam'], dayNamesShort: ['Dim','Lun','Mar','Mer','Jeu','Ven','Sam'],
dayNamesMin: ['Di','Lu','Ma','Me','Je','Ve','Sa'], dayNamesMin: ['Di','Lu','Ma','Me','Je','Ve','Sa'],
weekHeader: 'Sm', weekHeader: 'Sm',
dateFormat: 'dd.mm.yy', dateFormat: 'dd.mm.yy',
firstDay: 1, firstDay: 1,
isRTL: false, isRTL: false,
showMonthAfterYear: false, showMonthAfterYear: false,
yearSuffix: ''}; yearSuffix: ''};
$.datepicker.setDefaults($.datepicker.regional['fr-CH']); $.datepicker.setDefaults($.datepicker.regional['fr-CH']);
}); });

View File

@ -1,23 +1,23 @@
/* Vietnamese initialisation for the jQuery UI date picker plugin. */ /* Vietnamese initialisation for the jQuery UI date picker plugin. */
/* Translated by Le Thanh Huy (lthanhhuy@cit.ctu.edu.vn). */ /* Translated by Le Thanh Huy (lthanhhuy@cit.ctu.edu.vn). */
jQuery(function($){ jQuery(function($){
$.datepicker.regional['vi'] = { $.datepicker.regional['vi'] = {
closeText: 'Đóng', closeText: 'Đóng',
prevText: '&#x3c;Trước', prevText: '&#x3c;Trước',
nextText: 'Tiếp&#x3e;', nextText: 'Tiếp&#x3e;',
currentText: 'Hôm nay', currentText: 'Hôm nay',
monthNames: ['Tháng Một', 'Tháng Hai', 'Tháng Ba', 'Tháng Tư', 'Tháng Năm', 'Tháng Sáu', monthNames: ['Tháng Một', 'Tháng Hai', 'Tháng Ba', 'Tháng Tư', 'Tháng Năm', 'Tháng Sáu',
'Tháng Bảy', 'Tháng Tám', 'Tháng Chín', 'Tháng Mười', 'Tháng Mười Một', 'Tháng Mười Hai'], 'Tháng Bảy', 'Tháng Tám', 'Tháng Chín', 'Tháng Mười', 'Tháng Mười Một', 'Tháng Mười Hai'],
monthNamesShort: ['Tháng 1', 'Tháng 2', 'Tháng 3', 'Tháng 4', 'Tháng 5', 'Tháng 6', monthNamesShort: ['Tháng 1', 'Tháng 2', 'Tháng 3', 'Tháng 4', 'Tháng 5', 'Tháng 6',
'Tháng 7', 'Tháng 8', 'Tháng 9', 'Tháng 10', 'Tháng 11', 'Tháng 12'], 'Tháng 7', 'Tháng 8', 'Tháng 9', 'Tháng 10', 'Tháng 11', 'Tháng 12'],
dayNames: ['Chủ Nhật', 'Thứ Hai', 'Thứ Ba', 'Thứ Tư', 'Thứ Năm', 'Thứ Sáu', 'Thứ Bảy'], dayNames: ['Chủ Nhật', 'Thứ Hai', 'Thứ Ba', 'Thứ Tư', 'Thứ Năm', 'Thứ Sáu', 'Thứ Bảy'],
dayNamesShort: ['CN', 'T2', 'T3', 'T4', 'T5', 'T6', 'T7'], dayNamesShort: ['CN', 'T2', 'T3', 'T4', 'T5', 'T6', 'T7'],
dayNamesMin: ['CN', 'T2', 'T3', 'T4', 'T5', 'T6', 'T7'], dayNamesMin: ['CN', 'T2', 'T3', 'T4', 'T5', 'T6', 'T7'],
weekHeader: 'Tu', weekHeader: 'Tu',
dateFormat: 'dd/mm/yy', dateFormat: 'dd/mm/yy',
firstDay: 0, firstDay: 0,
isRTL: false, isRTL: false,
showMonthAfterYear: false, showMonthAfterYear: false,
yearSuffix: ''}; yearSuffix: ''};
$.datepicker.setDefaults($.datepicker.regional['vi']); $.datepicker.setDefaults($.datepicker.regional['vi']);
}); });

View File

@ -14,7 +14,24 @@
(function($) { (function($) {
$.widget("ui.accordion", { $.widget("ui.accordion", {
options: {
active: 0,
animated: 'slide',
autoHeight: true,
clearStyle: false,
collapsible: false,
event: "click",
fillSpace: false,
header: "> li > :first-child,> :not(li):even",
icons: {
header: "ui-icon-triangle-1-e",
headerSelected: "ui-icon-triangle-1-s"
},
navigation: false,
navigationFilter: function() {
return this.href.toLowerCase() == location.href.toLowerCase();
}
},
_init: function() { _init: function() {
var o = this.options, self = this; var o = this.options, self = this;
@ -140,8 +157,8 @@ $.widget("ui.accordion", {
return this; return this;
}, },
_setData: function(key, value) { _setOption: function(key, value) {
$.widget.prototype._setData.apply(this, arguments); $.Widget.prototype._setOption.apply(this, arguments);
if (key == "active") { if (key == "active") {
this.activate(value); this.activate(value);
@ -422,24 +439,6 @@ $.widget("ui.accordion", {
$.extend($.ui.accordion, { $.extend($.ui.accordion, {
version: "@VERSION", version: "@VERSION",
defaults: {
active: 0,
animated: 'slide',
autoHeight: true,
clearStyle: false,
collapsible: false,
event: "click",
fillSpace: false,
header: "> li > :first-child,> :not(li):even",
icons: {
header: "ui-icon-triangle-1-e",
headerSelected: "ui-icon-triangle-1-s"
},
navigation: false,
navigationFilter: function() {
return this.href.toLowerCase() == location.href.toLowerCase();
}
},
animations: { animations: {
slide: function(options, additions) { slide: function(options, additions) {
options = $.extend({ options = $.extend({

247
ui/jquery.ui.button.js vendored Normal file
View File

@ -0,0 +1,247 @@
/*
* jQuery UI Button @VERSION
*
* Copyright (c) 2009 AUTHORS.txt (http://jqueryui.com/about)
* Dual licensed under the MIT (MIT-LICENSE.txt)
* and GPL (GPL-LICENSE.txt) licenses.
*
* http://docs.jquery.com/UI/Button
*
* Depends:
* jquery.ui.core.js
* jquery.ui.widget.js
*/
(function($) {
var lastActive,
baseClasses = "ui-button ui-widget ui-state-default ui-corner-all",
otherClasses = "ui-state-hover ui-state-active " +
"ui-button-icons-only ui-button-icon-only ui-button-text-icons ui-button-text-icon ui-button-text-only";
$.widget("ui.button", {
options: {
text: true,
label: null,
icons: {
primary: null,
secondary: null
}
},
_init: function() {
this._determineButtonType();
this.hasTitle = !!this.buttonElement.attr('title');
var self = this,
options = this.options,
toggleButton = this.type == 'checkbox' || this.type == 'radio',
hoverClass = 'ui-state-hover' + (!toggleButton ? ' ui-state-active' : '');
if (options.label === null) {
options.label = this.buttonElement.html();
}
this.buttonElement
.addClass(baseClasses)
.attr('role', 'button')
.bind("mouseenter.button", function() {
if (options.disabled) { return; }
$(this).addClass("ui-state-hover");
if (this == lastActive) {
$(this).addClass("ui-state-active");
}
})
.bind("mouseleave.button", function() {
if (options.disabled) { return; }
$(this).removeClass(hoverClass);
});
switch (this.type) {
case 'checkbox':
this.buttonElement.bind('click.button', function() {
if (options.disabled) { return; }
$(this).toggleClass("ui-state-active");
self.element
.attr("checked", !self.element[0].checked)
.click();
self.buttonElement.attr('aria-pressed', self.element[0].checked);
});
break;
case 'radio':
this.buttonElement.bind('click.button', function() {
if (options.disabled) { return; }
$(this).addClass("ui-state-active");
self.element
.attr("checked", true)
.click();
self.buttonElement.attr('aria-pressed', true);
var radio = self.element[0],
name = radio.name,
form = radio.form,
radios;
if (name) {
if (form) {
radios = $(form).find('[name=' + name + ']');
} else {
radios = $('[name=' + name + ']', radio.ownerDocument)
.filter(function() {
return !this.form;
});
}
radios
.not(radio)
.map(function() {
return $(this).button('widget')[0];
})
.removeClass('ui-state-active')
.attr('aria-pressed', false);
}
});
break;
default:
this.buttonElement
.bind("mousedown.button", function() {
if (options.disabled) { return; }
$(this).addClass("ui-state-active");
lastActive = this;
$(document).one('mouseup', function() {
lastActive = null;
});
})
.bind("mouseup.button", function() {
if (options.disabled) { return; }
$(this).removeClass("ui-state-active");
});
break;
}
this._resetButton();
},
_determineButtonType: function() {
this.type = this.element.is(':checkbox')
? 'checkbox'
: this.element.is(':radio')
? 'radio'
: this.element.is('input')
? 'input'
: 'button';
if (this.type == 'checkbox' || this.type == 'radio') {
this.buttonElement = $("[for=" + this.element.attr("id") + "]");
this.element.hide();
var checked = this.element.is(':checked');
if (checked) {
this.buttonElement.addClass('ui-state-active');
}
this.buttonElement.attr('aria-pressed', checked)
} else {
this.buttonElement = this.element;
}
},
widget: function() {
return this.buttonElement;
},
destroy: function() {
this.buttonElement
.removeClass(baseClasses + " " + otherClasses)
.removeAttr('role')
.removeAttr('aria-pressed')
.html(this.buttonElement.find(".ui-button-text").html());
if (!this.hasTitle) {
this.buttonElement.removeAttr('title');
}
if (this.type == 'checkbox' || this.type == 'radio') {
this.element.show();
}
$.Widget.prototype.destroy.call(this);
},
_setOption: function(key, value) {
$.Widget.prototype._setOption.apply(this, arguments);
this._resetButton();
},
_resetButton: function() {
if (this.type == 'input') {
if (this.options.label) {
this.element.val(this.options.label);
}
return;
}
var buttonElement = this.buttonElement,
buttonText = $("<span></span>")
.addClass("ui-button-text")
.html(this.options.label)
.appendTo(buttonElement.empty())
.text();
var icons = this.options.icons,
multipleIcons = icons.primary && icons.secondary;
if (icons.primary || icons.secondary) {
buttonElement.addClass("ui-button-text-icon" +
(multipleIcons ? "s" : ""));
if (icons.primary) {
buttonElement.prepend("<span class='ui-button-icon-primary ui-icon " + icons.primary + "'></span>");
}
if (icons.secondary) {
buttonElement.append("<span class='ui-button-icon-secondary ui-icon " + icons.secondary + "'></span>");
}
if (!this.options.text) {
buttonElement
.addClass(multipleIcons ? "ui-button-icons-only" : "ui-button-icon-only")
.removeClass("ui-button-text-icons ui-button-text-icon");
if (!this.hasTitle) {
buttonElement.attr("title", buttonText);
}
}
} else {
buttonElement.addClass("ui-button-text-only");
}
}
});
$.widget("ui.buttonset", {
_init: function() {
this.element.addClass("ui-button-set");
this.buttons = this.element.find(':button, :submit, :reset, :checkbox, :radio, a, .ui-button')
.button()
.map(function() {
return $(this).button('widget')[0];
})
.removeClass('ui-corner-all')
.filter(':first')
.addClass('ui-corner-left')
.end()
.filter(':last')
.addClass('ui-corner-right')
.end()
.end();
},
_setOption: function(key, value) {
if (key == 'disabled') {
this.buttons.button('option', key, value);
}
$.Widget.prototype._setOption.apply(this, arguments);
},
destroy: function() {
this.element.removeClass('ui-button-set');
this.buttons
.button("destroy")
.removeClass("ui-corner-left ui-corner-right");
$.Widget.prototype.destroy.call(this);
}
});
})(jQuery);

View File

@ -121,6 +121,11 @@ $.extend(Datepicker.prototype, {
if (this.debug) if (this.debug)
console.log.apply('', arguments); console.log.apply('', arguments);
}, },
// TODO rename to "widget" when switching to widget factory
_widgetDatepicker: function() {
return this.dpDiv;
},
/* Override the default settings for all instances of the date picker. /* Override the default settings for all instances of the date picker.
@param settings object - the new settings to use as defaults (anonymous object) @param settings object - the new settings to use as defaults (anonymous object)
@ -1674,7 +1679,7 @@ $.fn.datepicker = function(options){
} }
var otherArgs = Array.prototype.slice.call(arguments, 1); var otherArgs = Array.prototype.slice.call(arguments, 1);
if (typeof options == 'string' && (options == 'isDisabled' || options == 'getDate')) if (typeof options == 'string' && (options == 'isDisabled' || options == 'getDate' || options == 'widget'))
return $.datepicker['_' + options + 'Datepicker']. return $.datepicker['_' + options + 'Datepicker'].
apply($.datepicker, [this[0]].concat(otherArgs)); apply($.datepicker, [this[0]].concat(otherArgs));
if (options == 'option' && arguments.length == 2 && typeof arguments[1] == 'string') if (options == 'option' && arguments.length == 2 && typeof arguments[1] == 'string')

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

@ -9,6 +9,7 @@
* *
* Depends: * Depends:
* jquery.ui.core.js * jquery.ui.core.js
* jquery.ui.widget.js
* jquery.ui.draggable.js * jquery.ui.draggable.js
* jquery.ui.mouse.js * jquery.ui.mouse.js
* jquery.ui.position.js * jquery.ui.position.js
@ -17,20 +18,36 @@
*/ */
(function($) { (function($) {
var setDataSwitch = { var uiDialogClasses =
maxHeight: "maxHeight.resizable", 'ui-dialog ' +
maxWidth: "maxWidth.resizable", 'ui-widget ' +
minWidth: "minWidth.resizable" 'ui-widget-content ' +
}, 'ui-corner-all ';
uiDialogClasses =
'ui-dialog ' +
'ui-widget ' +
'ui-widget-content ' +
'ui-corner-all ';
$.widget("ui.dialog", { $.widget("ui.dialog", {
options: {
autoOpen: true,
stackfix: false,
buttons: {},
closeOnEscape: true,
closeText: 'close',
dialogClass: '',
draggable: true,
hide: null,
height: 'auto',
maxHeight: false,
maxWidth: false,
minHeight: 150,
minWidth: 150,
modal: false,
position: 'center',
resizable: true,
show: null,
stack: true,
title: '',
width: 300,
zIndex: 1000
},
_init: function() { _init: function() {
this.originalTitle = this.element.attr('title'); this.originalTitle = this.element.attr('title');
@ -149,6 +166,10 @@ $.widget("ui.dialog", {
return self; return self;
}, },
widget: function() {
return this.uiDialog;
},
close: function(event) { close: function(event) {
var self = this; var self = this;
@ -279,28 +300,11 @@ $.widget("ui.dialog", {
$.each(buttons, function() { return !(hasButtons = true); })); $.each(buttons, function() { return !(hasButtons = true); }));
if (hasButtons) { if (hasButtons) {
$.each(buttons, function(name, fn) { $.each(buttons, function(name, fn) {
$('<button type="button"></button>') var button = $('<button type="button"></button>')
.addClass(
'ui-state-default ' +
'ui-corner-all'
)
.text(name) .text(name)
.click(function() { fn.apply(self.element[0], arguments); }) .click(function() { fn.apply(self.element[0], arguments); })
.hover(
function() {
$(this).addClass('ui-state-hover');
},
function() {
$(this).removeClass('ui-state-hover');
}
)
.focus(function() {
$(this).addClass('ui-state-focus');
})
.blur(function() {
$(this).removeClass('ui-state-focus');
})
.appendTo(uiDialogButtonPane); .appendTo(uiDialogButtonPane);
($.fn.button && button.button());
}); });
uiDialogButtonPane.appendTo(self.uiDialog); uiDialogButtonPane.appendTo(self.uiDialog);
} }
@ -381,7 +385,7 @@ $.widget("ui.dialog", {
var myAt = [], var myAt = [],
offset = [0, 0]; offset = [0, 0];
position = position || $.ui.dialog.defaults.position; position = position || $.ui.dialog.prototype.options.position;
// deep extending converts arrays to objects in jQuery <= 1.3.2 :-( // deep extending converts arrays to objects in jQuery <= 1.3.2 :-(
// if (typeof position == 'string' || $.isArray(position)) { // if (typeof position == 'string' || $.isArray(position)) {
@ -426,18 +430,18 @@ $.widget("ui.dialog", {
}); });
}, },
_setData: function(key, value){ _setOption: function(key, value){
var self = this, var self = this,
uiDialog = self.uiDialog, uiDialog = self.uiDialog,
isResizable = uiDialog.is(':data(resizable)'),
resize = false; resize = false;
(setDataSwitch[key] && uiDialog.data(setDataSwitch[key], value));
switch (key) { switch (key) {
case "buttons": case "buttons":
self._createButtons(value); self._createButtons(value);
break; break;
case "closeText": case "closeText":
// convert whatever was passed in o a string, for text() to not throw up // convert whatever was passed in to a string, for text() to not throw up
self.uiDialogTitlebarCloseText.text("" + value); self.uiDialogTitlebarCloseText.text("" + value);
break; break;
case "dialogClass": case "dialogClass":
@ -458,15 +462,26 @@ $.widget("ui.dialog", {
case "height": case "height":
resize = true; resize = true;
break; break;
case "maxHeight":
(isResizable && uiDialog.resizable('option', 'maxHeight', value));
resize = true;
break;
case "maxWidth":
(isResizable && uiDialog.resizable('option', 'maxWidth', value));
resize = true;
break;
case "minHeight": case "minHeight":
(isResizable && uiDialog.resizable('option', 'minHeight', value));
resize = true;
break;
case "minWidth":
(isResizable && uiDialog.resizable('option', 'minWidth', value));
resize = true; resize = true;
break; break;
case "position": case "position":
self._position(value); self._position(value);
break; break;
case "resizable": case "resizable":
var isResizable = uiDialog.is(':data(resizable)');
// currently resizable, becoming non-resizable // currently resizable, becoming non-resizable
(isResizable && !value && uiDialog.resizable('destroy')); (isResizable && !value && uiDialog.resizable('destroy'));
@ -486,7 +501,7 @@ $.widget("ui.dialog", {
break; break;
} }
$.widget.prototype._setData.apply(self, arguments); $.Widget.prototype._setOption.apply(self, arguments);
(resize && self._size()); (resize && self._size());
}, },
@ -527,29 +542,6 @@ $.widget("ui.dialog", {
$.extend($.ui.dialog, { $.extend($.ui.dialog, {
version: "@VERSION", version: "@VERSION",
defaults: {
autoOpen: true,
stackfix: false,
buttons: {},
closeOnEscape: true,
closeText: 'close',
dialogClass: '',
draggable: true,
hide: null,
height: 'auto',
maxHeight: false,
maxWidth: false,
minHeight: 150,
minWidth: 150,
modal: false,
position: 'center',
resizable: true,
show: null,
stack: true,
title: '',
width: 300,
zIndex: 1000
},
uuid: 0, uuid: 0,
maxZ: 0, maxZ: 0,

View File

@ -14,8 +14,33 @@
*/ */
(function($) { (function($) {
$.widget("ui.draggable", $.extend({}, $.ui.mouse, { $.widget("ui.draggable", $.ui.mouse, {
options: {
addClasses: true,
appendTo: "parent",
axis: false,
connectToSortable: false,
containment: false,
cursor: "auto",
cursorAt: false,
grid: false,
handle: false,
helper: "original",
iframeFix: false,
opacity: false,
refreshPositions: false,
revert: false,
revertDuration: 500,
scope: "default",
scroll: true,
scrollSensitivity: 20,
scrollSpeed: 20,
snap: false,
snapMode: "both",
snapTolerance: 20,
stack: false,
zIndex: false
},
_init: function() { _init: function() {
if (this.options.helper == 'original' && !(/^(?:r|a|f)/).test(this.element.css("position"))) if (this.options.helper == 'original' && !(/^(?:r|a|f)/).test(this.element.css("position")))
@ -405,7 +430,7 @@ $.widget("ui.draggable", $.extend({}, $.ui.mouse, {
ui = ui || this._uiHash(); ui = ui || this._uiHash();
$.ui.plugin.call(this, type, [event, ui]); $.ui.plugin.call(this, type, [event, ui]);
if(type == "drag") this.positionAbs = this._convertPositionTo("absolute"); //The absolute position has to be recalculated after plugins if(type == "drag") this.positionAbs = this._convertPositionTo("absolute"); //The absolute position has to be recalculated after plugins
return $.widget.prototype._trigger.call(this, type, event, ui); return $.Widget.prototype._trigger.call(this, type, event, ui);
}, },
plugins: {}, plugins: {},
@ -419,37 +444,11 @@ $.widget("ui.draggable", $.extend({}, $.ui.mouse, {
}; };
} }
})); });
$.extend($.ui.draggable, { $.extend($.ui.draggable, {
version: "@VERSION", version: "@VERSION",
eventPrefix: "drag", eventPrefix: "drag"
defaults: $.extend({}, $.ui.mouse.defaults, {
addClasses: true,
appendTo: "parent",
axis: false,
connectToSortable: false,
containment: false,
cursor: "auto",
cursorAt: false,
grid: false,
handle: false,
helper: "original",
iframeFix: false,
opacity: false,
refreshPositions: false,
revert: false,
revertDuration: 500,
scope: "default",
scroll: true,
scrollSensitivity: 20,
scrollSpeed: 20,
snap: false,
snapMode: "both",
snapTolerance: 20,
stack: false,
zIndex: false
})
}); });
$.ui.plugin.add("draggable", "connectToSortable", { $.ui.plugin.add("draggable", "connectToSortable", {

View File

@ -9,6 +9,7 @@
* *
* Depends: * Depends:
* jquery.ui.core.js * jquery.ui.core.js
* jquery.ui.widget.js
* jquery.ui.draggable.js * jquery.ui.draggable.js
* jquery.ui.mouse.js * jquery.ui.mouse.js
* jquery.ui.widget.js * jquery.ui.widget.js
@ -16,7 +17,15 @@
(function($) { (function($) {
$.widget("ui.droppable", { $.widget("ui.droppable", {
options: {
accept: '*',
activeClass: false,
addClasses: true,
greedy: false,
hoverClass: false,
scope: 'default',
tolerance: 'intersect'
},
_init: function() { _init: function() {
var o = this.options, accept = o.accept; var o = this.options, accept = o.accept;
@ -51,14 +60,14 @@ $.widget("ui.droppable", {
return this; return this;
}, },
_setData: function(key, value) { _setOption: function(key, value) {
if(key == 'accept') { if(key == 'accept') {
this.accept = $.isFunction(value) ? value : function(d) { this.accept = $.isFunction(value) ? value : function(d) {
return d.is(value); return d.is(value);
}; };
} }
$.widget.prototype._setData.apply(this, arguments); $.Widget.prototype._setOption.apply(this, arguments);
}, },
_activate: function(event) { _activate: function(event) {
@ -139,16 +148,7 @@ $.widget("ui.droppable", {
$.extend($.ui.droppable, { $.extend($.ui.droppable, {
version: "@VERSION", version: "@VERSION",
eventPrefix: 'drop', eventPrefix: 'drop'
defaults: {
accept: '*',
activeClass: false,
addClasses: true,
greedy: false,
hoverClass: false,
scope: 'default',
tolerance: 'intersect'
}
}); });
$.ui.intersect = function(draggable, droppable, toleranceMode) { $.ui.intersect = function(draggable, droppable, toleranceMode) {

16
ui/jquery.ui.mouse.js vendored
View File

@ -12,7 +12,12 @@
*/ */
(function($) { (function($) {
$.ui.mouse = { $.widget("ui.mouse", {
options: {
cancel: ':input,option',
distance: 1,
delay: 0
},
_mouseInit: function() { _mouseInit: function() {
var self = this; var self = this;
@ -141,13 +146,6 @@ $.ui.mouse = {
_mouseDrag: function(event) {}, _mouseDrag: function(event) {},
_mouseStop: function(event) {}, _mouseStop: function(event) {},
_mouseCapture: function(event) { return true; } _mouseCapture: function(event) { return true; }
}; });
$.ui.mouse.defaults = {
cancel: ':input,option',
distance: 1,
delay: 0
};
})(jQuery); })(jQuery);

View File

@ -1,227 +1,217 @@
/* /*
* jQuery UI Position @VERSION * jQuery UI Position @VERSION
* *
* Copyright (c) 2009 AUTHORS.txt (http://jqueryui.com/about) * Copyright (c) 2009 AUTHORS.txt (http://jqueryui.com/about)
* Dual licensed under the MIT (MIT-LICENSE.txt) * Dual licensed under the MIT (MIT-LICENSE.txt)
* and GPL (GPL-LICENSE.txt) licenses. * and GPL (GPL-LICENSE.txt) licenses.
* *
* http://docs.jquery.com/UI/Position * http://docs.jquery.com/UI/Position
*/ */
(function($) { (function($) {
$.ui = $.ui || {}; $.ui = $.ui || {};
var horizontalPositions = /left|center|right/, var horizontalPositions = /left|center|right/,
horizontalDefault = 'center', horizontalDefault = 'center',
verticalPositions = /top|center|bottom/, verticalPositions = /top|center|bottom/,
verticalDefault = 'center', verticalDefault = 'center',
_position = $.fn.position; _position = $.fn.position;
$.fn.position = function(options) { $.fn.position = function(options) {
if (!options || !options.of) { if (!options || !options.of) {
return _position.apply(this, arguments); return _position.apply(this, arguments);
} }
var target = $(options.of), // make a copy, we don't want to modify arguments
collision = (options.collision || 'flip').split(' '), options = $.extend({}, options);
offset = options.offset ? options.offset.split(' ') : [0, 0],
targetWidth, var target = $(options.of),
targetHeight, collision = (options.collision || 'flip').split(' '),
basePosition; offset = options.offset ? options.offset.split(' ') : [0, 0],
targetWidth,
if (options.of.nodeType === 9) { targetHeight,
targetWidth = target.width(); basePosition;
targetHeight = target.height();
basePosition = { top: 0, left: 0 }; if (options.of.nodeType === 9) {
} else if (options.of.scrollTo && options.of.document) { targetWidth = target.width();
targetWidth = target.width(); targetHeight = target.height();
targetHeight = target.height(); basePosition = { top: 0, left: 0 };
basePosition = { top: target.scrollTop(), left: target.scrollLeft() }; } else if (options.of.scrollTo && options.of.document) {
} else if (options.of.preventDefault) { targetWidth = target.width();
// force left top to allow flipping targetHeight = target.height();
options.at = 'left top'; basePosition = { top: target.scrollTop(), left: target.scrollLeft() };
targetWidth = targetHeight = 0; } else if (options.of.preventDefault) {
basePosition = { top: options.of.pageY, left: options.of.pageX }; // force left top to allow flipping
} else { options.at = 'left top';
targetWidth = target.outerWidth(); targetWidth = targetHeight = 0;
targetHeight = target.outerHeight(); basePosition = { top: options.of.pageY, left: options.of.pageX };
basePosition = target.offset(); } else {
} targetWidth = target.outerWidth();
targetHeight = target.outerHeight();
// force my and at to have valid horizontal and veritcal positions basePosition = target.offset();
// if a value is missing or invalid, it will be converted to center }
$.each(['my', 'at'], function() {
var pos = (options[this] || '').split(' '); // force my and at to have valid horizontal and veritcal positions
pos = pos.length == 1 // if a value is missing or invalid, it will be converted to center
? horizontalPositions.test(pos[0]) $.each(['my', 'at'], function() {
? pos.concat([verticalDefault]) var pos = (options[this] || '').split(' ');
: verticalPositions.test(pos[0]) pos = pos.length == 1
? [horizontalDefault].concat(pos) ? horizontalPositions.test(pos[0])
: [horizontalDefault, verticalDefault] ? pos.concat([verticalDefault])
: pos; : verticalPositions.test(pos[0])
pos[0] = horizontalPositions.test(pos[0]) ? pos[0] : horizontalDefault; ? [horizontalDefault].concat(pos)
pos[1] = verticalPositions.test(pos[1]) ? pos[1] : verticalDefault; : [horizontalDefault, verticalDefault]
options[this] = pos; : pos;
}); pos[0] = horizontalPositions.test(pos[0]) ? pos[0] : horizontalDefault;
pos[1] = verticalPositions.test(pos[1]) ? pos[1] : verticalDefault;
// normalize collision option options[this] = pos;
if (collision.length == 1) { });
collision[1] = collision[0];
} // normalize collision option
if (collision.length == 1) {
// normalize offset option collision[1] = collision[0];
offset[0] = parseInt(offset[0], 10) || 0; }
if (offset.length == 1) {
offset[1] = offset[0]; // normalize offset option
} offset[0] = parseInt(offset[0], 10) || 0;
offset[1] = parseInt(offset[1], 10) || 0; if (offset.length == 1) {
offset[1] = offset[0];
switch (options.at[0]) { }
case 'right': offset[1] = parseInt(offset[1], 10) || 0;
basePosition.left += targetWidth;
break; switch (options.at[0]) {
case horizontalDefault: case 'right':
basePosition.left += targetWidth / 2; basePosition.left += targetWidth;
break; break;
} case horizontalDefault:
basePosition.left += targetWidth / 2;
switch (options.at[1]) { break;
case 'bottom': }
basePosition.top += targetHeight;
break; switch (options.at[1]) {
case verticalDefault: case 'bottom':
basePosition.top += targetHeight / 2; basePosition.top += targetHeight;
break; break;
} case verticalDefault:
basePosition.top += targetHeight / 2;
basePosition.left += offset[0]; break;
basePosition.top += offset[1]; }
return this.each(function() { basePosition.left += offset[0];
var elem = $(this), basePosition.top += offset[1];
elemWidth = elem.outerWidth(),
elemHeight = elem.outerHeight(), return this.each(function() {
position = $.extend({}, basePosition), var elem = $(this),
over, elemWidth = elem.outerWidth(),
myOffset, elemHeight = elem.outerHeight(),
atOffset; position = $.extend({}, basePosition),
over,
switch (options.my[0]) { myOffset,
case 'right': atOffset;
position.left -= elemWidth;
break; switch (options.my[0]) {
case horizontalDefault: case 'right':
position.left -= elemWidth / 2; position.left -= elemWidth;
break; break;
} case horizontalDefault:
position.left -= elemWidth / 2;
switch (options.my[1]) { break;
case 'bottom': }
position.top -= elemHeight;
break; switch (options.my[1]) {
case verticalDefault: case 'bottom':
position.top -= elemHeight / 2; position.top -= elemHeight;
break; break;
} case verticalDefault:
position.top -= elemHeight / 2;
$.each(['left', 'top'], function(i, dir) { break;
($.ui.position[collision[i]] && }
$.ui.position[collision[i]][dir](position, {
targetWidth: targetWidth, $.each(['left', 'top'], function(i, dir) {
targetHeight: targetHeight, ($.ui.position[collision[i]] &&
elemWidth: elemWidth, $.ui.position[collision[i]][dir](position, {
elemHeight: elemHeight, targetWidth: targetWidth,
offset: offset, targetHeight: targetHeight,
my: options.my, elemWidth: elemWidth,
at: options.at elemHeight: elemHeight,
})); offset: offset,
}); my: options.my,
at: options.at
(options.stackfix !== false && $.fn.stackfix && elem.stackfix()); }));
// the by function is passed the offset values, not the position values });
// we'll need the logic from the .offset() setter to be accessible for
// us to calculate the position values to make the by option more useful (options.stackfix !== false && $.fn.stackfix && elem.stackfix());
($.isFunction(options.by) ? options.by.call(this, position) : elem.offset(position)); elem.offset($.extend(position, { using: options.using }));
}); });
}; };
$.ui.position = { $.ui.position = {
fit: { fit: {
left: function(position, data) { left: function(position, data) {
var over = position.left + data.elemWidth - $(window).width() - $(window).scrollLeft(); var over = position.left + data.elemWidth - $(window).width() - $(window).scrollLeft();
position.left = over > 0 ? position.left - over : Math.max(0, position.left); position.left = over > 0 ? position.left - over : Math.max(0, position.left);
}, },
top: function(position, data) { top: function(position, data) {
var over = position.top + data.elemHeight - $(window).height() - $(window).scrollTop(); var over = position.top + data.elemHeight - $(window).height() - $(window).scrollTop();
position.top = over > 0 ? position.top - over : Math.max(0, position.top); position.top = over > 0 ? position.top - over : Math.max(0, position.top);
} }
}, },
flip: { flip: {
left: function(position, data) { left: function(position, data) {
if (data.at[0] == 'center') if (data.at[0] == 'center')
return; return;
var over = position.left + data.elemWidth - $(window).width() - $(window).scrollLeft(), var over = position.left + data.elemWidth - $(window).width() - $(window).scrollLeft(),
myOffset = data.my[0] == 'left' ? -data.elemWidth : data.my[0] == 'right' ? data.elemWidth : 0, myOffset = data.my[0] == 'left' ? -data.elemWidth : data.my[0] == 'right' ? data.elemWidth : 0,
offset = -2 * data.offset[0]; offset = -2 * data.offset[0];
position.left += position.left < 0 ? myOffset + data.targetWidth + offset : over > 0 ? myOffset - data.targetWidth + offset : 0; position.left += position.left < 0 ? myOffset + data.targetWidth + offset : over > 0 ? myOffset - data.targetWidth + offset : 0;
}, },
top: function(position, data) { top: function(position, data) {
if (data.at[1] == 'center') if (data.at[1] == 'center')
return; return;
var over = position.top + data.elemHeight - $(window).height() - $(window).scrollTop(), var over = position.top + data.elemHeight - $(window).height() - $(window).scrollTop(),
myOffset = data.my[1] == 'top' ? -data.elemHeight : data.my[1] == 'bottom' ? data.elemHeight : 0, myOffset = data.my[1] == 'top' ? -data.elemHeight : data.my[1] == 'bottom' ? data.elemHeight : 0,
atOffset = data.at[1] == 'top' ? data.targetHeight : -data.targetHeight, atOffset = data.at[1] == 'top' ? data.targetHeight : -data.targetHeight,
offset = -2 * data.offset[1]; offset = -2 * data.offset[1];
position.top += position.top < 0 ? myOffset + data.targetHeight + offset : over > 0 ? myOffset + atOffset + offset : 0; position.top += position.top < 0 ? myOffset + data.targetHeight + offset : over > 0 ? myOffset + atOffset + offset : 0;
} }
} }
}; };
// offset setter from jQuery 1.4
// the following functionality is planned for jQuery 1.4 if (!$.offset.setOffset) {
// based on http://plugins.jquery.com/files/offset.js.txt $.offset.setOffset = function( elem, options ) {
$.fn.extend({ // set position first, in-case top/left are set even on static elem
_offset: $.fn.offset, if ( /static/.test( jQuery.curCSS( elem, 'position' ) ) ) {
offset: function(newOffset) { elem.style.position = 'relative';
return !newOffset ? this._offset() : this.each(function() { }
var elem = $(this), var curElem = jQuery( elem ),
// we need to convert static positioning to relative positioning curOffset = curElem.offset(),
isRelative = /relative|static/.test(elem.css('position')), curTop = parseInt( jQuery.curCSS( elem, 'top', true ), 10 ) || 0,
hide = elem.css('display') == 'none'; curLeft = parseInt( jQuery.curCSS( elem, 'left', true ), 10) || 0,
props = {
(isRelative && elem.css('position', 'relative')); top: (options.top - curOffset.top) + curTop,
(hide && elem.show()); left: (options.left - curOffset.left) + curLeft
};
var offset = elem.offset(),
delta = { if ( 'using' in options ) {
left : parseInt(elem.css('left'), 10), options.using.call( elem, props );
top: parseInt(elem.css('top'), 10) } else {
}; curElem.css( props );
}
// in case of 'auto' };
delta.left = !isNaN(delta.left)
? delta.left var _offset = $.fn.offset;
: isRelative $.fn.offset = function( options ) {
? 0 var elem = this[0];
: this.offsetLeft; if ( !elem || !elem.ownerDocument ) { return null; }
delta.top = !isNaN(delta.top) if ( options ) {
? delta.top return this.each(function() {
: isRelative $.offset.setOffset( this, options );
? 0 });
: this.offsetTop; }
return _offset.call(this);
// allow setting only left or only top };
if (newOffset.left || newOffset.left === 0) { }
elem.css('left', newOffset.left - offset.left + delta.left);
} })(jQuery);
if (newOffset.top || newOffset.top === 0) {
elem.css('top', newOffset.top - offset.top + delta.top);
}
(hide && elem.hide());
});
}
});
})(jQuery);

View File

@ -14,7 +14,9 @@
(function($) { (function($) {
$.widget("ui.progressbar", { $.widget("ui.progressbar", {
options: {
value: 0
},
_init: function() { _init: function() {
this.element this.element
@ -51,7 +53,7 @@ $.widget("ui.progressbar", {
this.valueDiv.remove(); this.valueDiv.remove();
$.widget.prototype.destroy.apply(this, arguments); $.Widget.prototype.destroy.apply(this, arguments);
return this; return this;
}, },
@ -61,11 +63,11 @@ $.widget("ui.progressbar", {
return this._value(); return this._value();
} }
this._setData('value', newValue); this._setOption('value', newValue);
return this; return this;
}, },
_setData: function(key, value) { _setOption: function(key, value) {
switch (key) { switch (key) {
case 'value': case 'value':
@ -75,7 +77,7 @@ $.widget("ui.progressbar", {
break; break;
} }
$.widget.prototype._setData.apply(this, arguments); $.Widget.prototype._setOption.apply(this, arguments);
}, },
@ -111,10 +113,7 @@ $.widget("ui.progressbar", {
}); });
$.extend($.ui.progressbar, { $.extend($.ui.progressbar, {
version: "@VERSION", version: "@VERSION"
defaults: {
value: 0
}
}); });
})(jQuery); })(jQuery);

View File

@ -14,8 +14,25 @@
*/ */
(function($) { (function($) {
$.widget("ui.resizable", $.extend({}, $.ui.mouse, { $.widget("ui.resizable", $.ui.mouse, {
options: {
alsoResize: false,
animate: false,
animateDuration: "slow",
animateEasing: "swing",
aspectRatio: false,
autoHide: false,
containment: false,
ghost: false,
grid: false,
handles: "e,s,se",
helper: false,
maxHeight: null,
maxWidth: null,
minHeight: 10,
minWidth: 10,
zIndex: 1000
},
_init: function() { _init: function() {
var self = this, o = this.options; var self = this, o = this.options;
@ -498,29 +515,11 @@ $.widget("ui.resizable", $.extend({}, $.ui.mouse, {
}; };
} }
})); });
$.extend($.ui.resizable, { $.extend($.ui.resizable, {
version: "@VERSION", version: "@VERSION",
eventPrefix: "resize", eventPrefix: "resize"
defaults: $.extend({}, $.ui.mouse.defaults, {
alsoResize: false,
animate: false,
animateDuration: "slow",
animateEasing: "swing",
aspectRatio: false,
autoHide: false,
containment: false,
ghost: false,
grid: false,
handles: "e,s,se",
helper: false,
maxHeight: null,
maxWidth: null,
minHeight: 10,
minWidth: 10,
zIndex: 1000
})
}); });
/* /*

View File

@ -14,8 +14,14 @@
*/ */
(function($) { (function($) {
$.widget("ui.selectable", $.extend({}, $.ui.mouse, { $.widget("ui.selectable", $.ui.mouse, {
options: {
appendTo: 'body',
autoRefresh: true,
distance: 0,
filter: '*',
tolerance: 'touch'
},
_init: function() { _init: function() {
var self = this; var self = this;
@ -243,17 +249,10 @@ $.widget("ui.selectable", $.extend({}, $.ui.mouse, {
return false; return false;
} }
})); });
$.extend($.ui.selectable, { $.extend($.ui.selectable, {
version: "@VERSION", version: "@VERSION"
defaults: $.extend({}, $.ui.mouse.defaults, {
appendTo: 'body',
autoRefresh: true,
distance: 0,
filter: '*',
tolerance: 'touch'
})
}); });
})(jQuery); })(jQuery);

View File

@ -19,8 +19,18 @@
// (how many times can you page up/down to go through the whole range) // (how many times can you page up/down to go through the whole range)
var numPages = 5; var numPages = 5;
$.widget("ui.slider", $.extend({}, $.ui.mouse, { $.widget("ui.slider", $.ui.mouse, {
options: {
animate: false,
distance: 0,
max: 100,
min: 0,
orientation: 'horizontal',
range: false,
step: 1,
value: 0,
values: null
},
_init: function() { _init: function() {
var self = this, o = this.options; var self = this, o = this.options;
@ -462,9 +472,9 @@ $.widget("ui.slider", $.extend({}, $.ui.mouse, {
}, },
_setData: function(key, value) { _setOption: function(key, value) {
$.widget.prototype._setData.apply(this, arguments); $.Widget.prototype._setOption.apply(this, arguments);
switch (key) { switch (key) {
case 'disabled': case 'disabled':
@ -594,22 +604,11 @@ $.widget("ui.slider", $.extend({}, $.ui.mouse, {
} }
})); });
$.extend($.ui.slider, { $.extend($.ui.slider, {
version: "@VERSION", version: "@VERSION",
eventPrefix: "slide", eventPrefix: "slide"
defaults: $.extend({}, $.ui.mouse.defaults, {
animate: false,
distance: 0,
max: 100,
min: 0,
orientation: 'horizontal',
range: false,
step: 1,
value: 0,
values: null
})
}); });
})(jQuery); })(jQuery);

View File

@ -14,7 +14,31 @@
*/ */
(function($) { (function($) {
$.widget("ui.sortable", $.extend({}, $.ui.mouse, { $.widget("ui.sortable", $.ui.mouse, {
options: {
appendTo: "parent",
axis: false,
connectWith: false,
containment: false,
cursor: 'auto',
cursorAt: false,
dropOnEmpty: true,
forcePlaceholderSize: false,
forceHelperSize: false,
grid: false,
handle: false,
helper: "original",
items: '> *',
opacity: false,
placeholder: false,
revert: false,
scroll: true,
scrollSensitivity: 20,
scrollSpeed: 20,
scope: "default",
tolerance: "intersect",
zIndex: 1000
},
_init: function() { _init: function() {
var o = this.options; var o = this.options;
@ -1000,7 +1024,7 @@ $.widget("ui.sortable", $.extend({}, $.ui.mouse, {
}, },
_trigger: function() { _trigger: function() {
if ($.widget.prototype._trigger.apply(this, arguments) === false) { if ($.Widget.prototype._trigger.apply(this, arguments) === false) {
this.cancel(); this.cancel();
} }
}, },
@ -1018,35 +1042,11 @@ $.widget("ui.sortable", $.extend({}, $.ui.mouse, {
}; };
} }
})); });
$.extend($.ui.sortable, { $.extend($.ui.sortable, {
version: "@VERSION", version: "@VERSION",
eventPrefix: "sort", eventPrefix: "sort"
defaults: $.extend({}, $.ui.mouse.defaults, {
appendTo: "parent",
axis: false,
connectWith: false,
containment: false,
cursor: 'auto',
cursorAt: false,
dropOnEmpty: true,
forcePlaceholderSize: false,
forceHelperSize: false,
grid: false,
handle: false,
helper: "original",
items: '> *',
opacity: false,
placeholder: false,
revert: false,
scroll: true,
scrollSensitivity: 20,
scrollSpeed: 20,
scope: "default",
tolerance: "intersect",
zIndex: 1000
})
}); });
})(jQuery); })(jQuery);

45
ui/jquery.ui.tabs.js vendored
View File

@ -16,12 +16,31 @@
var tabId = 0; var tabId = 0;
$.widget("ui.tabs", { $.widget("ui.tabs", {
options: {
add: null,
ajaxOptions: null,
cache: false,
cookie: null, // e.g. { expires: 7, path: '/', domain: 'jquery.com', secure: true }
collapsible: false,
disable: null,
disabled: [],
enable: null,
event: 'click',
fx: null, // e.g. { height: 'toggle', opacity: 'toggle', duration: 200 }
idPrefix: 'ui-tabs-',
load: null,
panelTemplate: '<div></div>',
remove: null,
select: null,
show: null,
spinner: '<em>Loading&#8230;</em>',
tabTemplate: '<li><a href="#{href}"><span>#{label}</span></a></li>'
},
_init: function() { _init: function() {
this._tabify(true); this._tabify(true);
}, },
_setData: function(key, value) { _setOption: function(key, value) {
if (key == 'selected') { if (key == 'selected') {
if (this.options.collapsible && value == this.options.selected) { if (this.options.collapsible && value == this.options.selected) {
return; return;
@ -625,27 +644,7 @@ $.widget("ui.tabs", {
}); });
$.extend($.ui.tabs, { $.extend($.ui.tabs, {
version: '@VERSION', version: '@VERSION'
defaults: {
add: null,
ajaxOptions: null,
cache: false,
cookie: null, // e.g. { expires: 7, path: '/', domain: 'jquery.com', secure: true }
collapsible: false,
disable: null,
disabled: [],
enable: null,
event: 'click',
fx: null, // e.g. { height: 'toggle', opacity: 'toggle', duration: 200 }
idPrefix: 'ui-tabs-',
load: null,
panelTemplate: '<div></div>',
remove: null,
select: null,
show: null,
spinner: '<em>Loading&#8230;</em>',
tabTemplate: '<li><a href="#{href}"><span>#{label}</span></a></li>'
}
}); });
/* /*

160
ui/jquery.ui.widget.js vendored
View File

@ -20,25 +20,54 @@ $.fn.remove = function() {
return _remove.apply(this, arguments); return _remove.apply(this, arguments);
}; };
// $.widget is a factory to create jQuery plugins $.widget = function(name, base, prototype) {
// taking some boilerplate code out of the plugin code
$.widget = function(name, prototype) {
var namespace = name.split(".")[0], var namespace = name.split(".")[0],
fullName; fullName;
name = name.split(".")[1]; name = name.split(".")[1];
fullName = namespace + '-' + name; fullName = namespace + '-' + name;
if (!prototype) {
prototype = base;
base = $.Widget;
}
// create selector for plugin // create selector for plugin
$.expr[':'][fullName] = function(elem) { $.expr[':'][fullName] = function(elem) {
return !!$.data(elem, name); return !!$.data(elem, name);
}; };
// create plugin method $[namespace] = $[namespace] || {};
$[namespace][name] = function(options, element) {
// allow instantiation without initializing for simple inheritance
(arguments.length && this._widgetInit(options, element));
};
var basePrototype = new base();
// we need to make the options hash a property directly on the new instance
// otherwise we'll modify the options hash on the prototype that we're
// inheriting from
// $.each(basePrototype, function(key, val) {
// if ($.isPlainObject(val)) {
// basePrototype[key] = $.extend({}, val);
// }
// });
basePrototype.options = $.extend({}, basePrototype.options);
$[namespace][name].prototype = $.extend(true, basePrototype, {
namespace: namespace,
widgetName: name,
widgetEventPrefix: $[namespace][name].prototype.widgetEventPrefix || name,
widgetBaseClass: fullName
}, prototype);
$.widget.bridge(name, $[namespace][name]);
};
$.widget.bridge = function(name, object) {
$.fn[name] = function(options) { $.fn[name] = function(options) {
var isMethodCall = (typeof options == 'string'), var isMethodCall = (typeof options == 'string'),
args = Array.prototype.slice.call(arguments, 1), args = Array.prototype.slice.call(arguments, 1),
returnValue = this; returnValue = this;
// allow multiple hashes to be passed on init // allow multiple hashes to be passed on init
options = !isMethodCall && args.length options = !isMethodCall && args.length
? $.extend.apply(null, [true, options].concat(args)) ? $.extend.apply(null, [true, options].concat(args))
@ -61,99 +90,102 @@ $.widget = function(name, prototype) {
} }
}) })
: this.each(function() { : this.each(function() {
($.data(this, name) || ($.data(this, name) || $.data(this, name, new object(options, this)));
$.data(this, name, new $[namespace][name](this, options))._init());
})); }));
return returnValue; return returnValue;
}; };
// create widget constructor
$[namespace] = $[namespace] || {};
$[namespace][name] = function(element, options) {
var self = this;
this.namespace = namespace;
this.widgetName = name;
this.widgetEventPrefix = $[namespace][name].eventPrefix || name;
this.widgetBaseClass = fullName;
this.options = $.extend(true, {},
$.widget.defaults,
$[namespace][name].defaults,
$.metadata && $.metadata.get(element)[name],
options);
this.element = $(element)
.bind('setData.' + name, function(event, key, value) {
if (event.target == element) {
return self._setData(key, value);
}
})
.bind('getData.' + name, function(event, key) {
if (event.target == element) {
return self._getData(key);
}
})
.bind('remove.' + name, function() {
return self.destroy();
});
};
// add widget prototype
$[namespace][name].prototype = $.extend({}, $.widget.prototype, prototype);
}; };
$.widget.prototype = { $.Widget = function(options, element) {
_init: function() {}, // allow instantiation without initializing for simple inheritance
destroy: function() { (arguments.length && this._widgetInit(options, element));
this.element.removeData(this.widgetName) };
.removeClass(this.widgetBaseClass + '-disabled' + ' ' + this.namespace + '-state-disabled')
.removeAttr('aria-disabled');
return this; $.Widget.prototype = {
widgetName: 'widget',
widgetEventPrefix: '',
options: {
disabled: false
},
_widgetInit: function(options, element) {
// $.widget.bridge stores the plugin instance, but we do it anyway
// so that it's stored even before the _init function runs
this.element = $(element).data(this.widgetName, this);
this.options = $.extend(true, {},
this.options,
// DEPRECATED: move defaults to prototype.options
$[this.namespace][this.widgetName].defaults,
$.metadata && $.metadata.get(element)[this.widgetName],
options);
// TODO: use bind's scope option when moving to jQuery 1.4
var self = this;
this.element.bind('remove.' + this.widgetName, function() {
self.destroy();
});
(this._init && this._init(options, element));
},
destroy: function() {
this.element
.unbind('.' + this.widgetName)
.removeData(this.widgetName);
this.widget()
.unbind('.' + this.widgetName)
.removeAttr('aria-disabled')
.removeClass(
this.widgetBaseClass + '-disabled ' +
this.namespace + '-state-disabled');
},
widget: function() {
return this.element;
}, },
option: function(key, value) { option: function(key, value) {
var options = key, var options = key,
self = this; self = this;
if (arguments.length === 0) {
// don't return a reference to the internal hash
return $.extend({}, self.options);
}
if (typeof key == "string") { if (typeof key == "string") {
if (value === undefined) { if (value === undefined) {
return this._getData(key); return this.options[key];
} }
options = {}; options = {};
options[key] = value; options[key] = value;
} }
$.each(options, function(key, value) { $.each(options, function(key, value) {
self._setData(key, value); self._setOption(key, value);
}); });
return self; return self;
}, },
_getData: function(key) { _setOption: function(key, value) {
return this.options[key];
},
_setData: function(key, value) {
this.options[key] = value; this.options[key] = value;
if (key == 'disabled') { if (key == 'disabled') {
this.element this.widget()
[value ? 'addClass' : 'removeClass']( [value ? 'addClass' : 'removeClass'](
this.widgetBaseClass + '-disabled' + ' ' + this.widgetBaseClass + '-disabled' + ' ' +
this.namespace + '-state-disabled') this.namespace + '-state-disabled')
.attr("aria-disabled", value); .attr("aria-disabled", value);
} }
return this;
}, },
enable: function() { enable: function() {
this._setData('disabled', false); return this._setOption('disabled', false);
return this;
}, },
disable: function() { disable: function() {
this._setData('disabled', true); return this._setOption('disabled', true);
return this;
}, },
_trigger: function(type, event, data) { _trigger: function(type, event, data) {
@ -181,9 +213,7 @@ $.widget.prototype = {
} }
}; };
$.widget.defaults = { // DEPRECATED: use the plugin's parent widget instead of $.widget
disabled: false $.widget.prototype = $.Widget.prototype;
};
})(jQuery); })(jQuery);