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>
<html lang="en">
<head>
<title>jQuery UI Datepicker - Dates in other months</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.datepicker.js"></script>
<link type="text/css" href="../demos.css" rel="stylesheet" />
<script type="text/javascript">
$(function() {
$("#datepicker").datepicker({showOtherMonths: true, selectOtherMonths: true});
});
</script>
</head>
<body>
<div class="demo">
<p>Date: <input type="text" id="datepicker"></p>
</div><!-- End demo -->
<div class="demo-description">
<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>
</div><!-- End demo-description -->
</body>
</html>
<!doctype html>
<html lang="en">
<head>
<title>jQuery UI Datepicker - Dates in other months</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.datepicker.js"></script>
<link type="text/css" href="../demos.css" rel="stylesheet" />
<script type="text/javascript">
$(function() {
$("#datepicker").datepicker({showOtherMonths: true, selectOtherMonths: true});
});
</script>
</head>
<body>
<div class="demo">
<p>Date: <input type="text" id="datepicker"></p>
</div><!-- End demo -->
<div class="demo-description">
<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>
</div><!-- End demo-description -->
</body>
</html>

View File

@ -1,35 +1,35 @@
<!doctype html>
<html lang="en">
<head>
<title>jQuery UI Datepicker - Show week of the year</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.datepicker.js"></script>
<link type="text/css" href="../demos.css" rel="stylesheet" />
<script type="text/javascript">
$(function() {
$("#datepicker").datepicker({showWeek: true, firstDay: 1});
});
</script>
</head>
<body>
<div class="demo">
<p>Date: <input type="text" id="datepicker"></p>
</div><!-- End demo -->
<div class="demo-description">
<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
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>
</div><!-- End demo-description -->
</body>
</html>
<!doctype html>
<html lang="en">
<head>
<title>jQuery UI Datepicker - Show week of the year</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.datepicker.js"></script>
<link type="text/css" href="../demos.css" rel="stylesheet" />
<script type="text/javascript">
$(function() {
$("#datepicker").datepicker({showWeek: true, firstDay: 1});
});
</script>
</head>
<body>
<div class="demo">
<p>Date: <input type="text" id="datepicker"></p>
</div><!-- End demo -->
<div class="demo-description">
<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
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>
</div><!-- End demo-description -->
</body>
</html>

View File

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

View File

@ -14,7 +14,7 @@
<script type="text/javascript" src="../../ui/jquery.ui.dialog.js"></script>
<link type="text/css" href="../demos.css" rel="stylesheet" />
<script type="text/javascript">
$.ui.dialog.defaults.stackfix = true;
$.ui.dialog.prototype.options.stackfix = true;
$(function() {
$("#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.widget.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.position.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.widget.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.position.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 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; }
.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; }
.validateTips { border: 1px solid transparent; padding: 0.3em; }
@ -112,29 +112,11 @@
$('#create-user').click(function() {
$('#dialog-form').dialog('open');
})
.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');
})
.mousedown(function() {
$(this).addClass("ui-state-active");
})
.mouseup(function() {
$(this).removeClass("ui-state-active");
});
$('#create-user')
.button()
.click(function() {
$('#dialog-form').dialog('open');
});
});
</script>
@ -181,7 +163,7 @@
</tbody>
</table>
</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 -->

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.widget.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.position.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.stackfix.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.dialog.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>
<dt>Widgets</dt>
<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="dialog/index.html">Dialog</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="../../ui/jquery.ui.core.js"></script>
<script type="text/javascript" src="../../ui/jquery.ui.widget.js"></script>
<script type="text/javascript" src="../../ui/jquery.ui.draggable.js"></script>
<script type="text/javascript" src="../../ui/jquery.ui.position.js"></script>
<link type="text/css" href="../demos.css" rel="stylesheet" />
@ -23,7 +22,7 @@
$.fn.position2 = function(options) {
return this.position($.extend({
of: window,
by: function(to) {
using: function(to) {
$(this).css({
top: to.top,
left: to.left
@ -33,27 +32,27 @@
}, options));
}
$.fn.left = function(by) {
$.fn.left = function(using) {
return this.position2({
my: "right middle",
at: "left middle",
offset: "25 0",
by: by
using: using
});
}
$.fn.right = function(by) {
$.fn.right = function(using) {
return this.position2({
my: "left middle",
at: "right middle",
offset: "-25 0",
by: by
using: using
});
}
$.fn.center = function(by) {
$.fn.center = function(using) {
return this.position2({
my: "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="../../ui/jquery.ui.core.js"></script>
<script type="text/javascript" src="../../ui/jquery.ui.widget.js"></script>
<script type="text/javascript" src="../../ui/jquery.ui.mouse.js"></script>
<script type="text/javascript" src="../../ui/jquery.ui.draggable.js"></script>
<script type="text/javascript" src="../../ui/jquery.ui.position.js"></script>
<link type="text/css" href="../demos.css" rel="stylesheet" />
@ -44,23 +45,23 @@
<script type="text/javascript">
$(function() {
function position(by) {
function position(using) {
$('.positionable').position({
of: $('#parent'),
my: $('#my_horizontal').val() + ' ' + $('#my_vertical').val(),
at: $('#at_horizontal').val() + ' '+ $('#at_vertical').val(),
offset: $('#offset').val(),
by: by,
using: using,
collision: $("#collision_horizontal").val() + ' ' + $("#collision_vertical").val()
});
}
$('.positionable').css("opacity", 0.5);
$(':input').bind('click keyup change', position);
$(':input').bind('click keyup change', function() { position(); });
$("#parent").draggable({
drag: position
drag: function() { position(); }
});
$('.positionable').draggable({

View File

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

View File

@ -1,66 +1,66 @@
<!doctype html>
<html lang="en">
<head>
<title>jQuery UI Slider - Snap to increments</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.mouse.js"></script>
<script type="text/javascript" src="../../ui/jquery.ui.tabs.js"></script>
<script type="text/javascript" src="../../ui/jquery.ui.slider.js"></script>
<link type="text/css" href="../demos.css" rel="stylesheet" />
<style type="text/css">
#demo-frame > div.demo { padding: 10px !important; }
</style>
<script type="text/javascript">
$(function() {
$("#tabs").tabs({
select: function(event, ui) {
$("#slider").slider("value", ui.index);
}
});
$("#slider").slider({
min: 0,
max: $("#tabs").tabs("length") - 1,
slide: function(event, ui) {
$("#tabs").tabs("select", ui.value);
}
});
});
</script>
</head>
<body>
<div class="demo">
<div id="slider" style="width:100px"></div>
<div id="tabs">
<ul>
<li><a href="#tabs-1">Nunc tincidunt</a></li>
<li><a href="#tabs-2">Proin dolor</a></li>
<li><a href="#tabs-3">Aenean lacinia</a></li>
</ul>
<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>
</div>
<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>
</div>
<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>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><!-- End demo -->
<div class="demo-description">
<p>Control tabs with a slider.</p>
</div><!-- End demo-description -->
</body>
</html>
<!doctype html>
<html lang="en">
<head>
<title>jQuery UI Slider - Snap to increments</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.mouse.js"></script>
<script type="text/javascript" src="../../ui/jquery.ui.tabs.js"></script>
<script type="text/javascript" src="../../ui/jquery.ui.slider.js"></script>
<link type="text/css" href="../demos.css" rel="stylesheet" />
<style type="text/css">
#demo-frame > div.demo { padding: 10px !important; }
</style>
<script type="text/javascript">
$(function() {
$("#tabs").tabs({
select: function(event, ui) {
$("#slider").slider("value", ui.index);
}
});
$("#slider").slider({
min: 0,
max: $("#tabs").tabs("length") - 1,
slide: function(event, ui) {
$("#tabs").tabs("select", ui.value);
}
});
});
</script>
</head>
<body>
<div class="demo">
<div id="slider" style="width:100px"></div>
<div id="tabs">
<ul>
<li><a href="#tabs-1">Nunc tincidunt</a></li>
<li><a href="#tabs-2">Proin dolor</a></li>
<li><a href="#tabs-3">Aenean lacinia</a></li>
</ul>
<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>
</div>
<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>
</div>
<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>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><!-- End demo -->
<div class="demo-description">
<p>Control tabs with a slider.</p>
</div><!-- End demo-description -->
</body>
</html>

View File

@ -1,59 +1,59 @@
<!doctype html>
<html lang="en">
<head>
<title>jQuery UI Tabs - Tabs at bottom</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.tabs.js"></script>
<link type="text/css" href="../demos.css" rel="stylesheet" />
<script type="text/javascript">
$(function() {
$("#tabs").tabs();
$(".tabs-bottom .ui-tabs-nav, .tabs-bottom .ui-tabs-nav > *")
.removeClass("ui-corner-all ui-corner-top")
.addClass("ui-corner-bottom");
});
</script>
<style>
#tabs { height: 200px; }
.tabs-bottom { position: relative; }
.tabs-bottom .ui-tabs-panel { height: 140px; overflow: auto; }
.tabs-bottom .ui-tabs-nav { position: absolute !important; left: 0; bottom: 0; right:0; padding: 0 0.2em 0.2em 0; }
.tabs-bottom .ui-tabs-nav li { margin-top: -2px !important; margin-bottom: 1px !important; border-top: none; border-bottom-width: 1px; }
.ui-tabs-selected { margin-top: -3px !important; }
</style>
</head>
<body>
<div class="demo">
<div id="tabs" class="tabs-bottom">
<ul>
<li><a href="#tabs-1">Nunc tincidunt</a></li>
<li><a href="#tabs-2">Proin dolor</a></li>
<li><a href="#tabs-3">Aenean lacinia</a></li>
</ul>
<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>
</div>
<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>
</div>
<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>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><!-- End demo -->
<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>
</div><!-- End demo-description -->
</body>
</html>
<!doctype html>
<html lang="en">
<head>
<title>jQuery UI Tabs - Tabs at bottom</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.tabs.js"></script>
<link type="text/css" href="../demos.css" rel="stylesheet" />
<script type="text/javascript">
$(function() {
$("#tabs").tabs();
$(".tabs-bottom .ui-tabs-nav, .tabs-bottom .ui-tabs-nav > *")
.removeClass("ui-corner-all ui-corner-top")
.addClass("ui-corner-bottom");
});
</script>
<style>
#tabs { height: 200px; }
.tabs-bottom { position: relative; }
.tabs-bottom .ui-tabs-panel { height: 140px; overflow: auto; }
.tabs-bottom .ui-tabs-nav { position: absolute !important; left: 0; bottom: 0; right:0; padding: 0 0.2em 0.2em 0; }
.tabs-bottom .ui-tabs-nav li { margin-top: -2px !important; margin-bottom: 1px !important; border-top: none; border-bottom-width: 1px; }
.ui-tabs-selected { margin-top: -3px !important; }
</style>
</head>
<body>
<div class="demo">
<div id="tabs" class="tabs-bottom">
<ul>
<li><a href="#tabs-1">Nunc tincidunt</a></li>
<li><a href="#tabs-2">Proin dolor</a></li>
<li><a href="#tabs-3">Aenean lacinia</a></li>
</ul>
<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>
</div>
<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>
</div>
<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>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><!-- End demo -->
<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>
</div><!-- End demo-description -->
</body>
</html>

View File

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

View File

@ -1,97 +1,97 @@
/**
* Cookie plugin
*
* Copyright (c) 2006 Klaus Hartl (stilbuero.de)
* Dual licensed under the MIT and GPL licenses:
* http://www.opensource.org/licenses/mit-license.php
* http://www.gnu.org/licenses/gpl.html
*
*/
/**
* Create a cookie with the given name and value and other optional parameters.
*
* @example $.cookie('the_cookie', 'the_value');
* @desc Set the value of a cookie.
* @example $.cookie('the_cookie', 'the_value', { expires: 7, path: '/', domain: 'jquery.com', secure: true });
* @desc Create a cookie with all available options.
* @example $.cookie('the_cookie', 'the_value');
* @desc Create a session cookie.
* @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
* used when the cookie was set.
*
* @param String name The name 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.
* @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 set to null or omitted, the cookie will be a session cookie and will not be retained
* 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 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
* require a secure protocol (like HTTPS).
* @type undefined
*
* @name $.cookie
* @cat Plugins/Cookie
* @author Klaus Hartl/klaus.hartl@stilbuero.de
*/
/**
* Get the value of a cookie with the given name.
*
* @example $.cookie('the_cookie');
* @desc Get the value of a cookie.
*
* @param String name The name of the cookie.
* @return The value of the cookie.
* @type String
*
* @name $.cookie
* @cat Plugins/Cookie
* @author Klaus Hartl/klaus.hartl@stilbuero.de
*/
jQuery.cookie = function(name, value, options) {
if (typeof value != 'undefined') { // name and value given, set cookie
options = options || {};
if (value === null) {
value = '';
options = $.extend({}, options); // clone object since it's unexpected behavior if the expired property were changed
options.expires = -1;
}
var expires = '';
if (options.expires && (typeof options.expires == 'number' || options.expires.toUTCString)) {
var date;
if (typeof options.expires == 'number') {
date = new Date();
date.setTime(date.getTime() + (options.expires * 24 * 60 * 60 * 1000));
} else {
date = options.expires;
}
expires = '; expires=' + date.toUTCString(); // use expires attribute, max-age is not supported by IE
}
// NOTE Needed to parenthesize options.path and options.domain
// in the following expressions, otherwise they evaluate to undefined
// in the packed version for some reason...
var path = options.path ? '; path=' + (options.path) : '';
var domain = options.domain ? '; domain=' + (options.domain) : '';
var secure = options.secure ? '; secure' : '';
document.cookie = [name, '=', encodeURIComponent(value), expires, path, domain, secure].join('');
} else { // only name given, get cookie
var cookieValue = null;
if (document.cookie && document.cookie != '') {
var cookies = document.cookie.split(';');
for (var i = 0; i < cookies.length; i++) {
var cookie = jQuery.trim(cookies[i]);
// Does this cookie string begin with the name we want?
if (cookie.substring(0, name.length + 1) == (name + '=')) {
cookieValue = decodeURIComponent(cookie.substring(name.length + 1));
break;
}
}
}
return cookieValue;
}
/**
* Cookie plugin
*
* Copyright (c) 2006 Klaus Hartl (stilbuero.de)
* Dual licensed under the MIT and GPL licenses:
* http://www.opensource.org/licenses/mit-license.php
* http://www.gnu.org/licenses/gpl.html
*
*/
/**
* Create a cookie with the given name and value and other optional parameters.
*
* @example $.cookie('the_cookie', 'the_value');
* @desc Set the value of a cookie.
* @example $.cookie('the_cookie', 'the_value', { expires: 7, path: '/', domain: 'jquery.com', secure: true });
* @desc Create a cookie with all available options.
* @example $.cookie('the_cookie', 'the_value');
* @desc Create a session cookie.
* @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
* used when the cookie was set.
*
* @param String name The name 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.
* @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 set to null or omitted, the cookie will be a session cookie and will not be retained
* 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 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
* require a secure protocol (like HTTPS).
* @type undefined
*
* @name $.cookie
* @cat Plugins/Cookie
* @author Klaus Hartl/klaus.hartl@stilbuero.de
*/
/**
* Get the value of a cookie with the given name.
*
* @example $.cookie('the_cookie');
* @desc Get the value of a cookie.
*
* @param String name The name of the cookie.
* @return The value of the cookie.
* @type String
*
* @name $.cookie
* @cat Plugins/Cookie
* @author Klaus Hartl/klaus.hartl@stilbuero.de
*/
jQuery.cookie = function(name, value, options) {
if (typeof value != 'undefined') { // name and value given, set cookie
options = options || {};
if (value === null) {
value = '';
options = $.extend({}, options); // clone object since it's unexpected behavior if the expired property were changed
options.expires = -1;
}
var expires = '';
if (options.expires && (typeof options.expires == 'number' || options.expires.toUTCString)) {
var date;
if (typeof options.expires == 'number') {
date = new Date();
date.setTime(date.getTime() + (options.expires * 24 * 60 * 60 * 1000));
} else {
date = options.expires;
}
expires = '; expires=' + date.toUTCString(); // use expires attribute, max-age is not supported by IE
}
// NOTE Needed to parenthesize options.path and options.domain
// in the following expressions, otherwise they evaluate to undefined
// in the packed version for some reason...
var path = options.path ? '; path=' + (options.path) : '';
var domain = options.domain ? '; domain=' + (options.domain) : '';
var secure = options.secure ? '; secure' : '';
document.cookie = [name, '=', encodeURIComponent(value), expires, path, domain, secure].join('');
} else { // only name given, get cookie
var cookieValue = null;
if (document.cookie && document.cookie != '') {
var cookies = document.cookie.split(';');
for (var i = 0; i < cookies.length; i++) {
var cookie = jQuery.trim(cookies[i]);
// Does this cookie string begin with the name we want?
if (cookie.substring(0, name.length + 1) == (name + '=')) {
cookieValue = decodeURIComponent(cookie.substring(name.length + 1));
break;
}
}
}
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
*
* Copyright (c) 2009 AUTHORS.txt (http://jqueryui.com/about)
* Dual licensed under the MIT (MIT-LICENSE.txt)
* and GPL (GPL-LICENSE.txt) licenses.
*
*/
;(function($) {
$.fn.extend({
simulate: function(type, options) {
return this.each(function() {
var opt = $.extend({}, $.simulate.defaults, options || {});
new $.simulate(this, type, opt);
});
}
});
$.simulate = function(el, type, options) {
this.target = el;
this.options = options;
if (/^drag$/.test(type)) {
this[type].apply(this, [this.target, options]);
} else {
this.simulateEvent(el, type, options);
}
}
$.extend($.simulate.prototype, {
simulateEvent: function(el, type, options) {
var evt = this.createEvent(type, options);
this.dispatchEvent(el, type, evt, options);
return evt;
},
createEvent: function(type, options) {
if (/^mouse(over|out|down|up|move)|(dbl)?click$/.test(type)) {
return this.mouseEvent(type, options);
} else if (/^key(up|down|press)$/.test(type)) {
return this.keyboardEvent(type, options);
}
},
mouseEvent: function(type, options) {
var evt;
var e = $.extend({
bubbles: true, cancelable: (type != "mousemove"), view: window, detail: 0,
screenX: 0, screenY: 0, clientX: 0, clientY: 0,
ctrlKey: false, altKey: false, shiftKey: false, metaKey: false,
button: 0, relatedTarget: undefined
}, options);
var relatedTarget = $(e.relatedTarget)[0];
if ($.isFunction(document.createEvent)) {
evt = document.createEvent("MouseEvents");
evt.initMouseEvent(type, e.bubbles, e.cancelable, e.view, e.detail,
e.screenX, e.screenY, e.clientX, e.clientY,
e.ctrlKey, e.altKey, e.shiftKey, e.metaKey,
e.button, e.relatedTarget || document.body.parentNode);
} else if (document.createEventObject) {
evt = document.createEventObject();
$.extend(evt, e);
evt.button = { 0:1, 1:4, 2:2 }[evt.button] || evt.button;
}
return evt;
},
keyboardEvent: function(type, options) {
var evt;
var e = $.extend({ bubbles: true, cancelable: true, view: window,
ctrlKey: false, altKey: false, shiftKey: false, metaKey: false,
keyCode: 0, charCode: 0
}, options);
if ($.isFunction(document.createEvent)) {
try {
evt = document.createEvent("KeyEvents");
evt.initKeyEvent(type, e.bubbles, e.cancelable, e.view,
e.ctrlKey, e.altKey, e.shiftKey, e.metaKey,
e.keyCode, e.charCode);
} catch(err) {
evt = document.createEvent("Events");
evt.initEvent(type, e.bubbles, e.cancelable);
$.extend(evt, { view: e.view,
ctrlKey: e.ctrlKey, altKey: e.altKey, shiftKey: e.shiftKey, metaKey: e.metaKey,
keyCode: e.keyCode, charCode: e.charCode
});
}
} else if (document.createEventObject) {
evt = document.createEventObject();
$.extend(evt, e);
}
if ($.browser.msie || $.browser.opera) {
evt.keyCode = (e.charCode > 0) ? e.charCode : e.keyCode;
evt.charCode = undefined;
}
return evt;
},
dispatchEvent: function(el, type, evt) {
if (el.dispatchEvent) {
el.dispatchEvent(evt);
} else if (el.fireEvent) {
el.fireEvent('on' + type, evt);
}
return evt;
},
drag: function(el) {
var self = this, center = this.findCenter(this.target),
options = this.options, x = Math.floor(center.x), y = Math.floor(center.y),
dx = options.dx || 0, dy = options.dy || 0, target = this.target;
var coord = { clientX: x, clientY: y };
this.simulateEvent(target, "mousedown", coord);
coord = { clientX: x + 1, clientY: y + 1 };
this.simulateEvent(document, "mousemove", coord);
coord = { clientX: x + dx, clientY: y + dy };
this.simulateEvent(document, "mousemove", coord);
this.simulateEvent(document, "mousemove", coord);
this.simulateEvent(target, "mouseup", coord);
},
findCenter: function(el) {
var el = $(this.target), o = el.offset();
return {
x: o.left + el.outerWidth() / 2,
y: o.top + el.outerHeight() / 2
};
}
});
$.extend($.simulate, {
defaults: {
speed: 'sync'
},
VK_TAB: 9,
VK_ENTER: 13,
VK_ESC: 27,
VK_PGUP: 33,
VK_PGDN: 34,
VK_END: 35,
VK_HOME: 36,
VK_LEFT: 37,
VK_UP: 38,
VK_RIGHT: 39,
VK_DOWN: 40
});
})(jQuery);
/*
* jquery.simulate - simulate browser mouse and keyboard events
*
* Copyright (c) 2009 AUTHORS.txt (http://jqueryui.com/about)
* Dual licensed under the MIT (MIT-LICENSE.txt)
* and GPL (GPL-LICENSE.txt) licenses.
*
*/
;(function($) {
$.fn.extend({
simulate: function(type, options) {
return this.each(function() {
var opt = $.extend({}, $.simulate.defaults, options || {});
new $.simulate(this, type, opt);
});
}
});
$.simulate = function(el, type, options) {
this.target = el;
this.options = options;
if (/^drag$/.test(type)) {
this[type].apply(this, [this.target, options]);
} else {
this.simulateEvent(el, type, options);
}
}
$.extend($.simulate.prototype, {
simulateEvent: function(el, type, options) {
var evt = this.createEvent(type, options);
this.dispatchEvent(el, type, evt, options);
return evt;
},
createEvent: function(type, options) {
if (/^mouse(over|out|down|up|move)|(dbl)?click$/.test(type)) {
return this.mouseEvent(type, options);
} else if (/^key(up|down|press)$/.test(type)) {
return this.keyboardEvent(type, options);
}
},
mouseEvent: function(type, options) {
var evt;
var e = $.extend({
bubbles: true, cancelable: (type != "mousemove"), view: window, detail: 0,
screenX: 0, screenY: 0, clientX: 0, clientY: 0,
ctrlKey: false, altKey: false, shiftKey: false, metaKey: false,
button: 0, relatedTarget: undefined
}, options);
var relatedTarget = $(e.relatedTarget)[0];
if ($.isFunction(document.createEvent)) {
evt = document.createEvent("MouseEvents");
evt.initMouseEvent(type, e.bubbles, e.cancelable, e.view, e.detail,
e.screenX, e.screenY, e.clientX, e.clientY,
e.ctrlKey, e.altKey, e.shiftKey, e.metaKey,
e.button, e.relatedTarget || document.body.parentNode);
} else if (document.createEventObject) {
evt = document.createEventObject();
$.extend(evt, e);
evt.button = { 0:1, 1:4, 2:2 }[evt.button] || evt.button;
}
return evt;
},
keyboardEvent: function(type, options) {
var evt;
var e = $.extend({ bubbles: true, cancelable: true, view: window,
ctrlKey: false, altKey: false, shiftKey: false, metaKey: false,
keyCode: 0, charCode: 0
}, options);
if ($.isFunction(document.createEvent)) {
try {
evt = document.createEvent("KeyEvents");
evt.initKeyEvent(type, e.bubbles, e.cancelable, e.view,
e.ctrlKey, e.altKey, e.shiftKey, e.metaKey,
e.keyCode, e.charCode);
} catch(err) {
evt = document.createEvent("Events");
evt.initEvent(type, e.bubbles, e.cancelable);
$.extend(evt, { view: e.view,
ctrlKey: e.ctrlKey, altKey: e.altKey, shiftKey: e.shiftKey, metaKey: e.metaKey,
keyCode: e.keyCode, charCode: e.charCode
});
}
} else if (document.createEventObject) {
evt = document.createEventObject();
$.extend(evt, e);
}
if ($.browser.msie || $.browser.opera) {
evt.keyCode = (e.charCode > 0) ? e.charCode : e.keyCode;
evt.charCode = undefined;
}
return evt;
},
dispatchEvent: function(el, type, evt) {
if (el.dispatchEvent) {
el.dispatchEvent(evt);
} else if (el.fireEvent) {
el.fireEvent('on' + type, evt);
}
return evt;
},
drag: function(el) {
var self = this, center = this.findCenter(this.target),
options = this.options, x = Math.floor(center.x), y = Math.floor(center.y),
dx = options.dx || 0, dy = options.dy || 0, target = this.target;
var coord = { clientX: x, clientY: y };
this.simulateEvent(target, "mousedown", coord);
coord = { clientX: x + 1, clientY: y + 1 };
this.simulateEvent(document, "mousemove", coord);
coord = { clientX: x + dx, clientY: y + dy };
this.simulateEvent(document, "mousemove", coord);
this.simulateEvent(document, "mousemove", coord);
this.simulateEvent(target, "mouseup", coord);
},
findCenter: function(el) {
var el = $(this.target), o = el.offset();
return {
x: o.left + el.outerWidth() / 2,
y: o.top + el.outerHeight() / 2
};
}
});
$.extend($.simulate, {
defaults: {
speed: 'sync'
},
VK_TAB: 9,
VK_ENTER: 13,
VK_ESC: 27,
VK_PGUP: 33,
VK_PGDN: 34,
VK_END: 35,
VK_HOME: 36,
VK_LEFT: 37,
VK_UP: 38,
VK_RIGHT: 39,
VK_DOWN: 40
});
})(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($) {
jQuery.ui.accordion.defaults.animated = false;
$.ui.accordion.prototype.options.animated = false;
function state(accordion) {
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() {
var list = $("#list1");
function icons(on) {
same($("#list1 span.ui-icon").length, on ? 3 : 0);
same( $("#list1").hasClass("ui-accordion-icons"), on );
same($("span.ui-icon", list).length, on ? 3 : 0);
same( list.hasClass("ui-accordion-icons"), on );
}
$("#list1").accordion();
list.accordion();
icons(true);
$("#list1").accordion("destroy").accordion({
list.accordion("destroy").accordion({
icons: false
});
icons(false);
$("#list1").accordion("option", "icons", $.ui.accordion.defaults.icons);
list.accordion("option", "icons", $.ui.accordion.prototype.options.icons);
icons(true);
$("#list1").accordion("option", "icons", false);
list.accordion("option", "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');
});
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);

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() {
var inp = init('#inp');
inp.focus();

View File

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

View File

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

View File

@ -3,15 +3,14 @@ var hasDuplicate = false;
function testWidgetDefaults(widget, defaults) {
var pluginDefaults = $.extend({},
$.widget.defaults,
$.ui[widget].defaults
$.ui[widget].prototype.options
);
// ensure that all defualts have the correct value
// ensure that all defaults have the correct value
test('defined defaults', function() {
$.each(defaults, function(key, val) {
if ($.isFunction(val)) {
ok(val !== undefined);
ok(val !== undefined, key);
return;
}
same(pluginDefaults[key], val, key);
@ -24,72 +23,21 @@ function testWidgetDefaults(widget, defaults) {
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) {
test('$.widget overrides', function() {
$.each(['option', '_getData', '_trigger'], function(i, method) {
ok($.widget.prototype[method] == $.ui[widget].prototype[method],
$.each(['_widgetInit', 'option', '_trigger'], function(i, method) {
ok($.Widget.prototype[method] == $.ui[widget].prototype[method],
'should not override ' + method);
});
});
}
function commonWidgetTests(widget, settings) {
var options = [];
$.each(settings.defaults, function(option) {
options.push(option);
});
module(widget + ": common widget");
testWidgetDefaults(widget, settings.defaults);
testSettingOptions(widget, options);
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>
<html lang="en">
<head>
<title>Accordion Visual Test : Accordion option autoHeight true</title>
<link rel="stylesheet" href="../visual.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="../../../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.accordion.js"></script>
<script type="text/javascript">
$(function() {
$("#accordion").accordion({
fillSpace: true
});
})
</script>
</head>
<body>
<div style="height: 500px; width: 500px; border: 1px solid red;">
<div id="accordion" style="width:490px;">
<h3><a href="#">Accordion Header 1</a></h3>
<div style="padding-top: 1em">
Accordion Content 1
</div>
<h3><a href="#">Accordion Header 2</a></h3>
<div style="padding-top: 3em">
Accordion Content 2
<p>paragraph</p>
<p>paragraph</p>
<p>paragraph</p>
<p>paragraph</p>
<p>paragraph</p>
<p>paragraph</p>
<p>paragraph</p>
</div>
<h3><a href="#">Accordion Header 3</a></h3>
<div style="padding-top: 0">
Accordion Content 3
<ul>
<li>list item</li>
<li>list item</li>
<li>list item</li>
</ul>
</div>
</div>
</div>
</body>
</html>
<!doctype html>
<html lang="en">
<head>
<title>Accordion Visual Test : Accordion option autoHeight true</title>
<link rel="stylesheet" href="../visual.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="../../../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.accordion.js"></script>
<script type="text/javascript">
$(function() {
$("#accordion").accordion({
fillSpace: true
});
})
</script>
</head>
<body>
<div style="height: 500px; width: 500px; border: 1px solid red;">
<div id="accordion" style="width:490px;">
<h3><a href="#">Accordion Header 1</a></h3>
<div style="padding-top: 1em">
Accordion Content 1
</div>
<h3><a href="#">Accordion Header 2</a></h3>
<div style="padding-top: 3em">
Accordion Content 2
<p>paragraph</p>
<p>paragraph</p>
<p>paragraph</p>
<p>paragraph</p>
<p>paragraph</p>
<p>paragraph</p>
<p>paragraph</p>
</div>
<h3><a href="#">Accordion Header 3</a></h3>
<div style="padding-top: 0">
Accordion Content 3
<ul>
<li>list item</li>
<li>list item</li>
<li>list item</li>
</ul>
</div>
</div>
</div>
</body>
</html>

View File

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

View File

@ -1,50 +1,50 @@
<!doctype html>
<html lang="en">
<head>
<title>Accordion Visual Test : Accordion ticket #4444</title>
<link rel="stylesheet" href="../visual.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="../../../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.accordion.js"></script>
<script type="text/javascript">
$(function() {
$("#accordion").accordion({
autoHeight: false
});
})
</script>
</head>
<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>
<div id="accordion" >
<h3><a href="#">Section 1</a></h3>
<div >
Accordion Content 1<br>
<a href="#">Link Test #1</a>
</div>
<h3><a href="#">Section 2</a></h3>
<div>
<a href="#" >Accordion Content 2</a>
</div>
<h3><a href="#">Section 3</a></h3>
<div>
<p>Accordion Content 3 </p>
<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>
</ul>
</div>
</div>
</body>
</html>
<!doctype html>
<html lang="en">
<head>
<title>Accordion Visual Test : Accordion ticket #4444</title>
<link rel="stylesheet" href="../visual.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="../../../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.accordion.js"></script>
<script type="text/javascript">
$(function() {
$("#accordion").accordion({
autoHeight: false
});
})
</script>
</head>
<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>
<div id="accordion" >
<h3><a href="#">Section 1</a></h3>
<div >
Accordion Content 1<br>
<a href="#">Link Test #1</a>
</div>
<h3><a href="#">Section 2</a></h3>
<div>
<a href="#" >Accordion Content 2</a>
</div>
<h3><a href="#">Section 3</a></h3>
<div>
<p>Accordion Content 3 </p>
<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>
</ul>
</div>
</div>
</body>
</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>
</head>
<body>
<input />
<div id="dialog" title="Dialog Title">
<p> Dialog Content </p>
</div>

View File

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

View File

@ -25,6 +25,7 @@
<h2>Widgets</h2>
<ul>
<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="dialog/default.html">Dialog</a></li>
<li><a href="progressbar/default.html">Progressbar</a></li>

View File

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

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.accordion.css");
@import url("ui.button.css");
@import url("ui.datepicker.css");
@import url("ui.dialog.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-prev { background-position: -48px -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-stop { background-position: -96px -160px; }
.ui-icon-eject { background-position: -112px -160px; }

View File

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

View File

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

View File

@ -1,23 +1,23 @@
/* Vietnamese initialisation for the jQuery UI date picker plugin. */
/* Translated by Le Thanh Huy (lthanhhuy@cit.ctu.edu.vn). */
jQuery(function($){
$.datepicker.regional['vi'] = {
closeText: 'Đóng',
prevText: '&#x3c;Trước',
nextText: 'Tiếp&#x3e;',
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',
'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',
'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'],
dayNamesShort: ['CN', 'T2', 'T3', 'T4', 'T5', 'T6', 'T7'],
dayNamesMin: ['CN', 'T2', 'T3', 'T4', 'T5', 'T6', 'T7'],
weekHeader: 'Tu',
dateFormat: 'dd/mm/yy',
firstDay: 0,
isRTL: false,
showMonthAfterYear: false,
yearSuffix: ''};
$.datepicker.setDefaults($.datepicker.regional['vi']);
});
/* Vietnamese initialisation for the jQuery UI date picker plugin. */
/* Translated by Le Thanh Huy (lthanhhuy@cit.ctu.edu.vn). */
jQuery(function($){
$.datepicker.regional['vi'] = {
closeText: 'Đóng',
prevText: '&#x3c;Trước',
nextText: 'Tiếp&#x3e;',
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',
'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',
'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'],
dayNamesShort: ['CN', 'T2', 'T3', 'T4', 'T5', 'T6', 'T7'],
dayNamesMin: ['CN', 'T2', 'T3', 'T4', 'T5', 'T6', 'T7'],
weekHeader: 'Tu',
dateFormat: 'dd/mm/yy',
firstDay: 0,
isRTL: false,
showMonthAfterYear: false,
yearSuffix: ''};
$.datepicker.setDefaults($.datepicker.regional['vi']);
});

View File

@ -14,7 +14,24 @@
(function($) {
$.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() {
var o = this.options, self = this;
@ -140,8 +157,8 @@ $.widget("ui.accordion", {
return this;
},
_setData: function(key, value) {
$.widget.prototype._setData.apply(this, arguments);
_setOption: function(key, value) {
$.Widget.prototype._setOption.apply(this, arguments);
if (key == "active") {
this.activate(value);
@ -422,24 +439,6 @@ $.widget("ui.accordion", {
$.extend($.ui.accordion, {
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: {
slide: function(options, additions) {
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)
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.
@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);
if (typeof options == 'string' && (options == 'isDisabled' || options == 'getDate'))
if (typeof options == 'string' && (options == 'isDisabled' || options == 'getDate' || options == 'widget'))
return $.datepicker['_' + options + 'Datepicker'].
apply($.datepicker, [this[0]].concat(otherArgs));
if (options == 'option' && arguments.length == 2 && typeof arguments[1] == 'string')

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

@ -9,6 +9,7 @@
*
* Depends:
* jquery.ui.core.js
* jquery.ui.widget.js
* jquery.ui.draggable.js
* jquery.ui.mouse.js
* jquery.ui.position.js
@ -17,20 +18,36 @@
*/
(function($) {
var setDataSwitch = {
maxHeight: "maxHeight.resizable",
maxWidth: "maxWidth.resizable",
minWidth: "minWidth.resizable"
},
uiDialogClasses =
'ui-dialog ' +
'ui-widget ' +
'ui-widget-content ' +
'ui-corner-all ';
var uiDialogClasses =
'ui-dialog ' +
'ui-widget ' +
'ui-widget-content ' +
'ui-corner-all ';
$.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() {
this.originalTitle = this.element.attr('title');
@ -149,6 +166,10 @@ $.widget("ui.dialog", {
return self;
},
widget: function() {
return this.uiDialog;
},
close: function(event) {
var self = this;
@ -279,28 +300,11 @@ $.widget("ui.dialog", {
$.each(buttons, function() { return !(hasButtons = true); }));
if (hasButtons) {
$.each(buttons, function(name, fn) {
$('<button type="button"></button>')
.addClass(
'ui-state-default ' +
'ui-corner-all'
)
var button = $('<button type="button"></button>')
.text(name)
.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);
($.fn.button && button.button());
});
uiDialogButtonPane.appendTo(self.uiDialog);
}
@ -381,7 +385,7 @@ $.widget("ui.dialog", {
var myAt = [],
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 :-(
// if (typeof position == 'string' || $.isArray(position)) {
@ -426,18 +430,18 @@ $.widget("ui.dialog", {
});
},
_setData: function(key, value){
_setOption: function(key, value){
var self = this,
uiDialog = self.uiDialog,
isResizable = uiDialog.is(':data(resizable)'),
resize = false;
(setDataSwitch[key] && uiDialog.data(setDataSwitch[key], value));
switch (key) {
case "buttons":
self._createButtons(value);
break;
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);
break;
case "dialogClass":
@ -458,15 +462,26 @@ $.widget("ui.dialog", {
case "height":
resize = true;
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":
(isResizable && uiDialog.resizable('option', 'minHeight', value));
resize = true;
break;
case "minWidth":
(isResizable && uiDialog.resizable('option', 'minWidth', value));
resize = true;
break;
case "position":
self._position(value);
break;
case "resizable":
var isResizable = uiDialog.is(':data(resizable)');
// currently resizable, becoming non-resizable
(isResizable && !value && uiDialog.resizable('destroy'));
@ -486,7 +501,7 @@ $.widget("ui.dialog", {
break;
}
$.widget.prototype._setData.apply(self, arguments);
$.Widget.prototype._setOption.apply(self, arguments);
(resize && self._size());
},
@ -527,29 +542,6 @@ $.widget("ui.dialog", {
$.extend($.ui.dialog, {
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,
maxZ: 0,

View File

@ -14,8 +14,33 @@
*/
(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() {
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.plugin.call(this, type, [event, ui]);
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: {},
@ -419,37 +444,11 @@ $.widget("ui.draggable", $.extend({}, $.ui.mouse, {
};
}
}));
});
$.extend($.ui.draggable, {
version: "@VERSION",
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
})
eventPrefix: "drag"
});
$.ui.plugin.add("draggable", "connectToSortable", {

View File

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

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

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

View File

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

View File

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

View File

@ -14,8 +14,25 @@
*/
(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() {
var self = this, o = this.options;
@ -498,29 +515,11 @@ $.widget("ui.resizable", $.extend({}, $.ui.mouse, {
};
}
}));
});
$.extend($.ui.resizable, {
version: "@VERSION",
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
})
eventPrefix: "resize"
});
/*

View File

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

View File

@ -19,8 +19,18 @@
// (how many times can you page up/down to go through the whole range)
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() {
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) {
case 'disabled':
@ -594,22 +604,11 @@ $.widget("ui.slider", $.extend({}, $.ui.mouse, {
}
}));
});
$.extend($.ui.slider, {
version: "@VERSION",
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
})
eventPrefix: "slide"
});
})(jQuery);

View File

@ -14,7 +14,31 @@
*/
(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() {
var o = this.options;
@ -1000,7 +1024,7 @@ $.widget("ui.sortable", $.extend({}, $.ui.mouse, {
},
_trigger: function() {
if ($.widget.prototype._trigger.apply(this, arguments) === false) {
if ($.Widget.prototype._trigger.apply(this, arguments) === false) {
this.cancel();
}
},
@ -1018,35 +1042,11 @@ $.widget("ui.sortable", $.extend({}, $.ui.mouse, {
};
}
}));
});
$.extend($.ui.sortable, {
version: "@VERSION",
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
})
eventPrefix: "sort"
});
})(jQuery);

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

@ -16,12 +16,31 @@
var tabId = 0;
$.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() {
this._tabify(true);
},
_setData: function(key, value) {
_setOption: function(key, value) {
if (key == 'selected') {
if (this.options.collapsible && value == this.options.selected) {
return;
@ -625,27 +644,7 @@ $.widget("ui.tabs", {
});
$.extend($.ui.tabs, {
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>'
}
version: '@VERSION'
});
/*

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

@ -20,25 +20,54 @@ $.fn.remove = function() {
return _remove.apply(this, arguments);
};
// $.widget is a factory to create jQuery plugins
// taking some boilerplate code out of the plugin code
$.widget = function(name, prototype) {
$.widget = function(name, base, prototype) {
var namespace = name.split(".")[0],
fullName;
name = name.split(".")[1];
fullName = namespace + '-' + name;
if (!prototype) {
prototype = base;
base = $.Widget;
}
// create selector for plugin
$.expr[':'][fullName] = function(elem) {
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) {
var isMethodCall = (typeof options == 'string'),
args = Array.prototype.slice.call(arguments, 1),
returnValue = this;
// allow multiple hashes to be passed on init
options = !isMethodCall && args.length
? $.extend.apply(null, [true, options].concat(args))
@ -61,99 +90,102 @@ $.widget = function(name, prototype) {
}
})
: this.each(function() {
($.data(this, name) ||
$.data(this, name, new $[namespace][name](this, options))._init());
($.data(this, name) || $.data(this, name, new object(options, this)));
}));
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 = {
_init: function() {},
destroy: function() {
this.element.removeData(this.widgetName)
.removeClass(this.widgetBaseClass + '-disabled' + ' ' + this.namespace + '-state-disabled')
.removeAttr('aria-disabled');
$.Widget = function(options, element) {
// allow instantiation without initializing for simple inheritance
(arguments.length && this._widgetInit(options, element));
};
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) {
var options = key,
self = this;
if (arguments.length === 0) {
// don't return a reference to the internal hash
return $.extend({}, self.options);
}
if (typeof key == "string") {
if (value === undefined) {
return this._getData(key);
return this.options[key];
}
options = {};
options[key] = value;
}
$.each(options, function(key, value) {
self._setData(key, value);
self._setOption(key, value);
});
return self;
},
_getData: function(key) {
return this.options[key];
},
_setData: function(key, value) {
_setOption: function(key, value) {
this.options[key] = value;
if (key == 'disabled') {
this.element
this.widget()
[value ? 'addClass' : 'removeClass'](
this.widgetBaseClass + '-disabled' + ' ' +
this.namespace + '-state-disabled')
.attr("aria-disabled", value);
}
return this;
},
enable: function() {
this._setData('disabled', false);
return this;
return this._setOption('disabled', false);
},
disable: function() {
this._setData('disabled', true);
return this;
return this._setOption('disabled', true);
},
_trigger: function(type, event, data) {
@ -181,9 +213,7 @@ $.widget.prototype = {
}
};
$.widget.defaults = {
disabled: false
};
// DEPRECATED: use the plugin's parent widget instead of $.widget
$.widget.prototype = $.Widget.prototype;
})(jQuery);