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

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

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

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

View File

@ -0,0 +1,38 @@
<!doctype html>
<html>
<head>
<title>Menu Static Test : Default</title>
<link rel="stylesheet" href="../static.css" type="text/css" />
<link rel="stylesheet" href="../../../themes/base/ui.base.css" type="text/css" />
<link rel="stylesheet" href="../../../themes/base/ui.theme.css" type="text/css" title="ui-theme" />
<script type="text/javascript" src="../../../jquery-1.3.2.js"></script>
<script type="text/javascript" src="../static.js"></script>
</head>
<body>
<ul role="menu" aria-activedescendant="ui-active-menuitem" class="ui-menu ui-widget ui-widget-content ui-corner-bottom">
<li class="ui-menu-item" role="menuitem"><a href="#" tabindex="-1" class="ui-corner-all">Aberdeen</a></li>
<li class="ui-menu-item" role="menuitem" id="ui-active-menuitem"><a href="#" tabindex="-1" class="ui-state-hover ui-corner-all">Ada</a></li>
<li class="ui-menu-item" role="menuitem"><a href="#" tabindex="-1" class="ui-corner-all">Adamsville</a></li>
<li class="ui-menu-item" role="menuitem"><a href="#" tabindex="-1" class="ui-corner-all">Addyston</a></li>
<li class="ui-menu-item" role="menuitem"><a href="#" tabindex="-1" class="ui-corner-all">Adelphi</a></li>
<li class="ui-menu-item" role="menuitem"><a href="#" tabindex="-1" class="ui-corner-all">Adena</a></li>
<li class="ui-menu-item" role="menuitem"><a href="#" tabindex="-1" class="ui-corner-all">Adrian</a></li>
<li class="ui-menu-item" role="menuitem"><a href="#" tabindex="-1" class="ui-corner-all">Akron</a></li>
<li class="ui-menu-item" role="menuitem"><a href="#" tabindex="-1" class="ui-corner-all">Albany</a></li>
<li class="ui-menu-item" role="menuitem"><a href="#" tabindex="-1" class="ui-corner-all">Alexandria</a></li>
<li class="ui-menu-item" role="menuitem"><a href="#" tabindex="-1" class="ui-corner-all">Alger</a></li>
<li class="ui-menu-item" role="menuitem"><a href="#" tabindex="-1" class="ui-corner-all">Alledonia</a></li>
<li class="ui-menu-item" role="menuitem"><a href="#" tabindex="-1" class="ui-corner-all">Alliance</a></li>
<li class="ui-menu-item" role="menuitem"><a href="#" tabindex="-1" class="ui-corner-all">Alpha</a></li>
<li class="ui-menu-item" role="menuitem"><a href="#" tabindex="-1" class="ui-corner-all">Alvada</a></li>
<li class="ui-menu-item" role="menuitem"><a href="#" tabindex="-1" class="ui-corner-all">Alvordton</a></li>
<li class="ui-menu-item" role="menuitem"><a href="#" tabindex="-1" class="ui-corner-all">Amanda</a></li>
<li class="ui-menu-item" role="menuitem"><a href="#" tabindex="-1" class="ui-corner-all">Amelia</a></li>
<li class="ui-menu-item" role="menuitem"><a href="#" tabindex="-1" class="ui-corner-all">Amesville</a></li>
</ul>
</body>
</html>

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

@ -204,7 +204,7 @@ test('offset', function() {
same($('#elx').offset(), { top: 57, left: 45 }, 'with units'); same($('#elx').offset(), { top: 57, left: 45 }, 'with units');
}); });
test('by', function() { test('using', function() {
expect(6); expect(6);
var count = 0, var count = 0,
@ -221,7 +221,7 @@ test('by', function() {
my: 'left top', my: 'left top',
at: 'left top', at: 'left top',
of: '#parentx', of: '#parentx',
by: function(position) { using: function(position) {
same(this, elems[count], 'correct context for call #' + count); same(this, elems[count], 'correct context for call #' + count);
same(position, expectedPosition, 'correct position for call #' + count); same(position, expectedPosition, 'correct position for call #' + count);
count++; count++;

View File

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

View File

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

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

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

View File

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

View File

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

View File

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

View File

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

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.5 KiB

View File

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

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

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

View File

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

View File

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

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

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

View File

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

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

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

View File

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

View File

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

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

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

View File

@ -22,6 +22,9 @@ $.fn.position = function(options) {
return _position.apply(this, arguments); return _position.apply(this, arguments);
} }
// make a copy, we don't want to modify arguments
options = $.extend({}, options);
var target = $(options.of), var target = $(options.of),
collision = (options.collision || 'flip').split(' '), collision = (options.collision || 'flip').split(' '),
offset = options.offset ? options.offset.split(' ') : [0, 0], offset = options.offset ? options.offset.split(' ') : [0, 0],
@ -138,10 +141,7 @@ $.fn.position = function(options) {
}); });
(options.stackfix !== false && $.fn.stackfix && elem.stackfix()); (options.stackfix !== false && $.fn.stackfix && elem.stackfix());
// the by function is passed the offset values, not the position values elem.offset($.extend(position, { using: options.using }));
// 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));
}); });
}; };
@ -178,50 +178,40 @@ $.ui.position = {
} }
}; };
// 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
};
// the following functionality is planned for jQuery 1.4 if ( 'using' in options ) {
// based on http://plugins.jquery.com/files/offset.js.txt options.using.call( elem, props );
$.fn.extend({ } else {
_offset: $.fn.offset, curElem.css( props );
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')); var _offset = $.fn.offset;
(hide && elem.show()); $.fn.offset = function( options ) {
var elem = this[0];
var offset = elem.offset(), if ( !elem || !elem.ownerDocument ) { return null; }
delta = { if ( options ) {
left : parseInt(elem.css('left'), 10), return this.each(function() {
top: parseInt(elem.css('top'), 10) $.offset.setOffset( this, options );
}; });
}
// in case of 'auto' return _offset.call(this);
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);

View File

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

View File

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

View File

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

View File

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

View File

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

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

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

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

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