mirror of
https://github.com/jquery/jquery-ui.git
synced 2025-01-07 20:34:24 +00:00
- removed 1.6 branch
- changed version in tags/1.5.2 to 1.5.2 - merged trunk with 1.6
This commit is contained in:
Paul Bakaus
parent
cf48fc7ee4
commit
4e06fa6304
27
tests/autocomplete.html
Normal file
27
tests/autocomplete.html
Normal file
@ -0,0 +1,27 @@
|
||||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
|
||||
<html>
|
||||
<head>
|
||||
|
||||
<link rel="stylesheet" href="qunit/testsuite.css" type="text/css" media="screen">
|
||||
|
||||
<script type="text/javascript" src="../jquery-1.2.6.js"></script>
|
||||
<script type="text/javascript" src="../ui/ui.core.js"></script>
|
||||
<script type="text/javascript" src="../ui/ui.autocomplete.js"></script>
|
||||
|
||||
<script type="text/javascript" src="qunit/testrunner.js"></script>
|
||||
<script type="text/javascript" src="simulate/jquery.simulate.js"></script>
|
||||
|
||||
<script type="text/javascript" src="autocomplete.js"></script>
|
||||
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<h1>jQuery - Autocomplete Test Suite</h1>
|
||||
<div id="main" style="display: none">
|
||||
|
||||
</div>
|
||||
|
||||
<ol id="tests"></ol>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
6
tests/autocomplete.js
Normal file
6
tests/autocomplete.js
Normal file
@ -0,0 +1,6 @@
|
||||
test("highlighter", function() {
|
||||
equals( jQuery.Autocompleter.defaults.highlight("Peter", "Pe"), "<strong>Pe</strong>ter" );
|
||||
equals( jQuery.Autocompleter.defaults.highlight("Peter <em><Pan></em>", "Pe"), "<strong>Pe</strong>ter <em><Pan></em>" );
|
||||
equals( jQuery.Autocompleter.defaults.highlight("Peter <em><Pan></em>", "a"), "Peter <em><P<strong>a</strong>n></em>" );
|
||||
equals( jQuery.Autocompleter.defaults.highlight("Peter <em>(<Pan>)</em>", "(<P"), "Peter <em><strong>(<P</strong>an>)</em>" );
|
||||
});
|
||||
BIN
tests/images/bg.gif
Normal file
BIN
tests/images/bg.gif
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.1 KiB |
BIN
tests/images/clock.png
Normal file
BIN
tests/images/clock.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 24 KiB |
BIN
tests/images/progress-bg.gif
Normal file
BIN
tests/images/progress-bg.gif
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 834 B |
108
tests/visual/magnifier.html
Normal file
108
tests/visual/magnifier.html
Normal file
@ -0,0 +1,108 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
|
||||
<head>
|
||||
<meta http-equiv="Content-Language" content="en" />
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
|
||||
<title>Magnifier Demo</title>
|
||||
|
||||
<style type="text/css">
|
||||
|
||||
body,html {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
font-family: Arial;
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
div.playground {
|
||||
height: 150px;
|
||||
}
|
||||
|
||||
#example1 img,
|
||||
#example2 img,
|
||||
#example3 img,
|
||||
#example4 img {
|
||||
float:left;
|
||||
}
|
||||
|
||||
</style>
|
||||
<script type="text/javascript" src="../../jquery-1.2.6.js"></script>
|
||||
<script type="text/javascript" src="../../ui/ui.core.js"></script>
|
||||
<script type="text/javascript" src="../../ui/ui.magnifier.js"></script>
|
||||
|
||||
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<h2>1. Default, no options</h2>
|
||||
<div class="playground">
|
||||
<div id='example1' class="ui-wrapper example" style="width: 580px; padding: 20px;">
|
||||
<img src="../images/clock.png" width="48" alt="" />
|
||||
<img src="../images/clock.png" width="48" alt="" />
|
||||
<img src="../images/clock.png" width="48" alt="" />
|
||||
<img src="../images/clock.png" width="48" alt="" />
|
||||
<img src="../images/clock.png" width="48" alt="" />
|
||||
<img src="../images/clock.png" width="48" alt="" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<h2>2. Magnification set to 1.5 (default: 2)</h2>
|
||||
<div class="playground">
|
||||
<div id='example2' class="ui-wrapper example" style="width: 580px; padding: 20px;">
|
||||
<img src="../images/clock.png" width="48" alt="" />
|
||||
<img src="../images/clock.png" width="48" alt="" />
|
||||
<img src="../images/clock.png" width="48" alt="" />
|
||||
<img src="../images/clock.png" width="48" alt="" />
|
||||
<img src="../images/clock.png" width="48" alt="" />
|
||||
<img src="../images/clock.png" width="48" alt="" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<h2>3. Advanced example: overlap: true, zIndex: 10, opacity: { min: 0.6, max: 1 }, baseline: -1</h2>
|
||||
<div class="playground">
|
||||
<div id='example3' class="ui-wrapper example" style="width: 580px; padding: 20px;">
|
||||
<img src="../images/clock.png" width="48" alt="" />
|
||||
<img src="../images/clock.png" width="48" alt="" />
|
||||
<img src="../images/clock.png" width="48" alt="" />
|
||||
<img src="../images/clock.png" width="48" alt="" />
|
||||
<img src="../images/clock.png" width="48" alt="" />
|
||||
<img src="../images/clock.png" width="48" alt="" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<h2>4. Advanced example: The direction doesn't have to be horizontal!</h2>
|
||||
<div class="playground">
|
||||
<div id='example4' class="ui-wrapper example" style="width: 150px; padding: 20px; height: 150px;">
|
||||
<img src="../images/clock.png" width="48" alt="" />
|
||||
<img src="../images/clock.png" width="48" alt="" />
|
||||
<img src="../images/clock.png" width="48" alt="" />
|
||||
<img src="../images/clock.png" width="48" alt="" />
|
||||
<img src="../images/clock.png" width="48" alt="" />
|
||||
<img src="../images/clock.png" width="48" alt="" />
|
||||
<img src="../images/clock.png" width="48" alt="" />
|
||||
<img src="../images/clock.png" width="48" alt="" />
|
||||
<img src="../images/clock.png" width="48" alt="" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script type="text/javascript">
|
||||
if(!window.console) {
|
||||
window.console = {
|
||||
log: function() {
|
||||
alert(arguments[0]);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
$(window).bind("load",function(){
|
||||
|
||||
$('#example1').magnifier();
|
||||
$('#example2').magnifier({ magnification: 1.5 });
|
||||
$('#example3').magnifier({ magnification: 1.5, overlap: true, zIndex: 10, opacity: { min: 0.6, max: 1 }, baseline: -1 });
|
||||
$('#example4').magnifier({ magnification: 1.5, overlap: true, zIndex: 10, opacity: { min: 0.6, max: 1 }, distance: 30 });
|
||||
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
256
tests/visual/progressbar.html
Normal file
256
tests/visual/progressbar.html
Normal file
@ -0,0 +1,256 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
|
||||
<head>
|
||||
<meta http-equiv="Content-Language" content="en" />
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
|
||||
<title>ProgressBar Test Page</title>
|
||||
<script type="text/javascript" src="../../jquery-1.2.6.js"></script>
|
||||
<script type="text/javascript" src="../../ui/ui.core.js"></script>
|
||||
<script type="text/javascript" src="../../ui/ui.resizable.js"></script>
|
||||
<script type="text/javascript" src="../../ui/ui.draggable.js"></script>
|
||||
<script type="text/javascript" src="../../ui/ui.progressbar.js"></script>
|
||||
|
||||
<style type="text/css" media="all">
|
||||
|
||||
body
|
||||
{
|
||||
background: #fff;
|
||||
font-family: Arial;
|
||||
}
|
||||
|
||||
#log {
|
||||
right:0px;
|
||||
top:0px;
|
||||
background-color:#FAFCFE;
|
||||
border:1px solid #DFE8F6;
|
||||
height:400px;
|
||||
width:300px;
|
||||
position:absolute;
|
||||
overflow:auto;
|
||||
}
|
||||
|
||||
/* ProgressBar */
|
||||
|
||||
.ui-progressbar {
|
||||
width: 400px; height: 20px;
|
||||
border: 1px #ccc solid;
|
||||
background:#E0E8F3 url(../images/bg.gif) repeat-x scroll 0%;
|
||||
position:relative;
|
||||
}
|
||||
|
||||
.ui-progressbar-wrap {
|
||||
position: relative;
|
||||
height: auto;
|
||||
width: auto;
|
||||
line-height: 18px;
|
||||
_line-height: 16px;
|
||||
}
|
||||
|
||||
.ui-progressbar-bar {
|
||||
background:#9CBFEE url(../images/progress-bg.gif) repeat-x scroll left center;
|
||||
border-bottom:1px solid #7FA9E4;
|
||||
border-right:1px solid #7FA9E4;
|
||||
border-top:1px solid #D1E4FD;
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
.ui-progressbar-text {
|
||||
color:#fff;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
font-size: 11px;
|
||||
font-weight: bold;
|
||||
padding-left: 5px;
|
||||
}
|
||||
|
||||
.ui-progressbar-text-back {
|
||||
color:#000;
|
||||
padding-top: 1px;
|
||||
padding-bottom: 1px;
|
||||
padding-right: 1px;
|
||||
}
|
||||
|
||||
.ui-progressbar-disabled {
|
||||
opacity:.5;
|
||||
filter:Alpha(Opacity=50);
|
||||
}
|
||||
|
||||
|
||||
/* custom */
|
||||
.ui-progressbar-text.right-align {
|
||||
text-align: right;
|
||||
padding: 0 5px 0 0;
|
||||
}
|
||||
.ui-progressbar-inner-custom {
|
||||
background: url(../images/custom-bar.gif) repeat-x scroll left center;
|
||||
border-bottom:1px solid #EFEFEF;
|
||||
border-right:0pt none;
|
||||
border-top:1px solid #BEBEBE;
|
||||
height:15px;
|
||||
}
|
||||
|
||||
.ui-hidden {
|
||||
left:-10000px;
|
||||
position:absolute;
|
||||
top:-10000px;
|
||||
visibility:hidden;
|
||||
}
|
||||
|
||||
</style>
|
||||
</head>
|
||||
<body >
|
||||
|
||||
<h1>jQuery - ProgressBar</h1>
|
||||
|
||||
<div id="log">log</div>
|
||||
|
||||
|
||||
<div id='p1'></div><br>
|
||||
|
||||
<button id="p1-create">Create</button>
|
||||
<button id="p1-destroy" onclick="$('#p1').progressbar('destroy');">destroy</button>
|
||||
<button id="p1-start" onclick="$('#p1').progressbar('start');">Start</button>
|
||||
<button id="p1-stop" onclick="$('#p1').progressbar('stop');">Stop</button>
|
||||
<button id="p1-pause" onclick="$('#p1').progressbar('reset');">reset</button>
|
||||
<button id="p1-enable" onclick="$('#p1').progressbar('enable');">enable</button>
|
||||
<button id="p1-disable" onclick="$('#p1').progressbar('disable');">disable</button>
|
||||
<button id="p1-progress" onclick="$('#p1').progressbar('progress', 50);">progress to 50</button>
|
||||
<button id="p1-progress" onclick="$('#p1').progressbar('text', 'Textchanged!');">Change text</button>
|
||||
|
||||
<br><br>
|
||||
|
||||
<div id='p2'></div><br>
|
||||
|
||||
<button id="p2-create">Create</button>
|
||||
<button id="p2-destroy" onclick="$('#p2').progressbar('destroy');">destroy</button>
|
||||
<button id="p2-start" onclick="$('#p2').progressbar('start');">Start</button>
|
||||
<button id="p2-stop" onclick="$('#p2').progressbar('stop');">Stop</button>
|
||||
<button id="p2-pause" onclick="$('#p2').progressbar('reset');">reset</button>
|
||||
<button id="p2-enable" onclick="$('#p2').progressbar('enable');">enable</button>
|
||||
<button id="p2-disable" onclick="$('#p2').progressbar('disable');">disable</button>
|
||||
<button id="p2-progress" onclick="$('#p2').progressbar('progress', 40);">progress to 50</button>
|
||||
|
||||
<br><br>
|
||||
|
||||
<div id='p3'></div><br>
|
||||
|
||||
<button id="p3-create">Create</button>
|
||||
<button id="p3-destroy" onclick="$('#p3').progressbar('destroy');">destroy</button>
|
||||
<button id="p3-start" onclick="$('#p3').progressbar('start');">Start</button>
|
||||
<button id="p3-stop" onclick="$('#p3').progressbar('stop');">Stop</button>
|
||||
<button id="p3-pause" onclick="$('#p3').progressbar('reset');">reset</button>
|
||||
<button id="p3-enable" onclick="$('#p3').progressbar('enable');">enable</button>
|
||||
<button id="p3-disable" onclick="$('#p3').progressbar('disable');">disable</button>
|
||||
<button id="p3-progress" onclick="$('#p3').progressbar('progress', $('#p3-value').val());">progress to</button>
|
||||
<input type="text" id="p3-value" value="35"/>
|
||||
|
||||
<br><br>
|
||||
|
||||
<button id="p2-startall" onclick="$('#p2, #p1, #p3').progressbar('start');">Start All</button>
|
||||
<button id="p2-stopall" onclick="$('#p2, #p1, #p3').progressbar('stop');">Stop All</button>
|
||||
<button id="p2-stopall" onclick="$('#p2, #p1, #p3').progressbar('reset');">Reset All</button>
|
||||
|
||||
<script>
|
||||
|
||||
$(function() {
|
||||
|
||||
$('#p1-create').click(function() {
|
||||
|
||||
$('#p1').progressbar({
|
||||
|
||||
text: 'jQuery ProgressBar waiting...',
|
||||
|
||||
//addClass: 'ui-progressbar-inner-custom teste',
|
||||
|
||||
//textClass: 'right-align',
|
||||
|
||||
//align: 'right',
|
||||
|
||||
wait: 'loop',
|
||||
|
||||
duration: 2000,
|
||||
|
||||
stepping: 3,
|
||||
|
||||
progress: function(range, ui) {
|
||||
//console.log(ui.pixelRange);
|
||||
//console.log(range);
|
||||
//ui.instance.text('Waiting...');
|
||||
},
|
||||
|
||||
stop: function(s, ui) {
|
||||
//console.log('stop:' + ui.instance.inprogress);
|
||||
},
|
||||
|
||||
start: function() {
|
||||
console.log('user start');
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
}).trigger("click");
|
||||
|
||||
|
||||
$('#p2-create').click(function() {
|
||||
|
||||
$('#p2').progressbar({
|
||||
|
||||
range: true,
|
||||
|
||||
wait: 2000,
|
||||
|
||||
duration:1000,
|
||||
|
||||
stepping: 5,
|
||||
|
||||
progress: function(range, ui) {
|
||||
//console.log(ui.pixelRange);
|
||||
//console.log(range);
|
||||
},
|
||||
|
||||
stop: function(s, ui) {
|
||||
//console.log('stop:' + ui.instance.inprogress);
|
||||
},
|
||||
|
||||
start: function() {
|
||||
//console.log('user start');
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
}).trigger("click");
|
||||
|
||||
|
||||
$('#p3-create').click(function() { $('#p3').progressbar({
|
||||
|
||||
duration: 2000,
|
||||
|
||||
stepping: 30,
|
||||
|
||||
stop: function(s, ui) {
|
||||
console.log('stop:' + ui.instance.inProgress);
|
||||
},
|
||||
progress: function(range, ui) {
|
||||
//console.log(ui.pixelRange);
|
||||
//console.log(range);
|
||||
},
|
||||
start: function() {
|
||||
console.log('user start');
|
||||
}
|
||||
}); }).trigger('click');
|
||||
|
||||
});
|
||||
|
||||
if(!window.console) {
|
||||
window.console = {
|
||||
log: function() {
|
||||
$('#log').append(arguments[0]+"<br>");
|
||||
$('#log').scrollTop(999999);
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
45
tests/visual/spinner.html
Normal file
45
tests/visual/spinner.html
Normal file
@ -0,0 +1,45 @@
|
||||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
|
||||
<title>Untitled Document</title>
|
||||
<script type="text/javascript" src="../../jquery-1.2.6.js"></script>
|
||||
<script type="text/javascript" src="../../ui/ui.core.js"></script>
|
||||
<script type="text/javascript" src="../../ui/ui.spinner.js"></script>
|
||||
|
||||
|
||||
<script>
|
||||
$(document).ready(function(){
|
||||
|
||||
$("input").spinner();
|
||||
|
||||
|
||||
});
|
||||
</script>
|
||||
|
||||
<style type="text/css">
|
||||
body {
|
||||
background:#fff;
|
||||
color:#333;
|
||||
font-size:11px;
|
||||
font-family:"lucida grande", tahoma, verdana, arial, sans-serif;
|
||||
}
|
||||
|
||||
.ui-spinner-down, .ui-spinner-up {
|
||||
background: #999;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.ui-spinner {
|
||||
border: 1px solid black;
|
||||
}
|
||||
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
<input type="text" id="input" />
|
||||
|
||||
</body>
|
||||
</html>
|
||||
130
tests/visual/tree.html
Normal file
130
tests/visual/tree.html
Normal file
@ -0,0 +1,130 @@
|
||||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
|
||||
<title>Untitled Document</title>
|
||||
|
||||
<script type="text/javascript" src="../../jquery-1.2.6.js"></script>
|
||||
<script type="text/javascript" src="../../ui/ui.core.js"></script>
|
||||
<script type="text/javascript" src="../../ui/ui.draggable.js"></script>
|
||||
<script type="text/javascript" src="../../ui/ui.droppable.js"></script>
|
||||
<script type="text/javascript" src="../../ui/ui.resizable.js"></script>
|
||||
<script type="text/javascript" src="../../ui/ui.sortable.js"></script>
|
||||
|
||||
|
||||
<script>
|
||||
$(document).ready(function(){
|
||||
|
||||
|
||||
$.widget("ui.tree", {
|
||||
init: function() {
|
||||
|
||||
var self = this;
|
||||
|
||||
this.element.sortable({
|
||||
items: this.options.sortOn,
|
||||
placeholder: "ui-tree-placeholder",
|
||||
start: function() {
|
||||
$(this).data("sortable").placeholder.hide();
|
||||
$(this).data("sortable").refreshPositions(true);
|
||||
},
|
||||
stop: function() {
|
||||
var self = $(this).data("sortable");
|
||||
$(self.options.items, self.element).css("border-top", "0").css("border-bottom", "0");
|
||||
},
|
||||
sortIndicator: function(e, item, append, hardRefresh) {
|
||||
|
||||
append ? append[0].appendChild(this.placeholder[0]) : item.item[0].parentNode.insertBefore(this.placeholder[0], (this.direction == 'down' ? item.item[0] : item.item[0].nextSibling));
|
||||
|
||||
$(this.options.items, this.element).css("border-top", "0").css("border-bottom", "0");
|
||||
item.item.css("border-"+(this.direction == "down" ? "top" : "bottom"), "2px solid black");
|
||||
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
|
||||
//Make certain nodes droppable
|
||||
$(this.options.dropOn, this.element).droppable({
|
||||
accept: this.options.sortOn,
|
||||
hoverClass: this.options.hoverClass,
|
||||
//tolerance: "pointer",
|
||||
over: function() {
|
||||
$(self.options.sortOn, self.element).css("border-top", "0").css("border-bottom", "0");
|
||||
},
|
||||
drop: function(e, ui) {
|
||||
$(this).parent().find("ul").append(ui.draggable);
|
||||
self.element.data("sortable")._noFinalSort = true;
|
||||
}
|
||||
});
|
||||
|
||||
}
|
||||
});
|
||||
|
||||
$.extend($.ui.tree, {
|
||||
defaults: {
|
||||
sortOn: "*",
|
||||
dropOn: "div",
|
||||
hoverClass: "ui-tree-hover"
|
||||
}
|
||||
});
|
||||
|
||||
$("ul.sortable").tree({
|
||||
sortOn: "li",
|
||||
dropOn: "div",
|
||||
hoverClass: "hover"
|
||||
});
|
||||
|
||||
|
||||
|
||||
});
|
||||
</script>
|
||||
|
||||
<style type="text/css">
|
||||
body {
|
||||
background:#fff;
|
||||
color:#333;
|
||||
font-size:11px;
|
||||
font-family:"lucida grande", tahoma, verdana, arial, sans-serif;
|
||||
}
|
||||
|
||||
.hover {
|
||||
background: green;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.placeholder {
|
||||
display: none;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
<ul class="sortable">
|
||||
<li>Item 1</li>
|
||||
<li><div>Item 2</div>
|
||||
<ul>
|
||||
<li>Sub Item 1</li>
|
||||
<li>Sub Item 3</li>
|
||||
<li>Sub Item 4</li>
|
||||
<li>Sub Item 5</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li>Item 3</li>
|
||||
<li>Item 4</li>
|
||||
<li><div>Item 2</div>
|
||||
<ul>
|
||||
<li>Sub Item 1</li>
|
||||
<li>Sub Item 3</li>
|
||||
<li>Sub Item 4</li>
|
||||
<li>Sub Item 5</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li>Item 6</li>
|
||||
<li>Item 7</li>
|
||||
<li>Item 8</li>
|
||||
</ul>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
48
themes/jquery.autocomplete.css
Normal file
48
themes/jquery.autocomplete.css
Normal file
@ -0,0 +1,48 @@
|
||||
.ui-autocomplete-results {
|
||||
padding: 0px;
|
||||
border: 1px solid black;
|
||||
background-color: white;
|
||||
overflow: hidden;
|
||||
z-index: 99999;
|
||||
}
|
||||
|
||||
.ui-autocomplete-results ul {
|
||||
width: 100%;
|
||||
list-style-position: outside;
|
||||
list-style: none;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.ui-autocomplete-results li {
|
||||
margin: 0px;
|
||||
padding: 2px 5px;
|
||||
cursor: default;
|
||||
display: block;
|
||||
/*
|
||||
if width will be 100% horizontal scrollbar will apear
|
||||
when scroll mode will be used
|
||||
*/
|
||||
/*width: 100%;*/
|
||||
font: menu;
|
||||
font-size: 12px;
|
||||
/*
|
||||
it is very important, if line-height not setted or setted
|
||||
in relative units scroll will be broken in firefox
|
||||
*/
|
||||
line-height: 16px;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.ui-autocomplete-loading {
|
||||
background: white url('indicator.gif') right center no-repeat;
|
||||
}
|
||||
|
||||
.ui-autocomplete-odd {
|
||||
background-color: #eee;
|
||||
}
|
||||
|
||||
.ui-autocomplete-over {
|
||||
background-color: #0A246A;
|
||||
color: white;
|
||||
}
|
||||
775
ui/ui.autocomplete.js
Normal file
775
ui/ui.autocomplete.js
Normal file
@ -0,0 +1,775 @@
|
||||
/*
|
||||
* Autocomplete - jQuery plugin 1.0.1
|
||||
*
|
||||
* Copyright (c) 2007 Dylan Verheul, Dan G. Switzer, Anjesh Tuladhar, Jörn Zaefferer
|
||||
*
|
||||
* 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.autocomplete.js 5698 2008-05-27 13:53:30Z paul.bakaus $
|
||||
*
|
||||
*/
|
||||
|
||||
;(function($) {
|
||||
|
||||
|
||||
$.widget("ui.autocomplete", {
|
||||
|
||||
init: function() {
|
||||
|
||||
$.extend(this.options, {
|
||||
delay: this.options.url ? $.Autocompleter.defaults.delay : 10,
|
||||
max: !this.options.scroll ? 10 : 150,
|
||||
highlight: this.options.highlight || function(value) { return value; }, // if highlight is set to false, replace it with a do-nothing function
|
||||
formatMatch: this.options.formatMatch || this.options.formatItem // if the formatMatch option is not specified, then use formatItem for backwards compatibility
|
||||
});
|
||||
|
||||
new $.Autocompleter(this.element[0], this.options);
|
||||
|
||||
},
|
||||
|
||||
result: function(handler) {
|
||||
return this.element.bind("result", handler);
|
||||
},
|
||||
search: function(handler) {
|
||||
return this.element.trigger("search", [handler]);
|
||||
},
|
||||
flushCache: function() {
|
||||
return this.element.trigger("flushCache");
|
||||
},
|
||||
setData: function(key, value){
|
||||
return this.element.trigger("setOptions", [{ key: value }]);
|
||||
},
|
||||
destroy: function() {
|
||||
return this.element.trigger("unautocomplete");
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
|
||||
$.Autocompleter = function(input, options) {
|
||||
|
||||
var KEY = {
|
||||
UP: 38,
|
||||
DOWN: 40,
|
||||
DEL: 46,
|
||||
TAB: 9,
|
||||
RETURN: 13,
|
||||
ESC: 27,
|
||||
COMMA: 188,
|
||||
PAGEUP: 33,
|
||||
PAGEDOWN: 34,
|
||||
BACKSPACE: 8
|
||||
};
|
||||
|
||||
// Create $ object for input element
|
||||
var $input = $(input).attr("autocomplete", "off").addClass(options.inputClass);
|
||||
if(options.result) $input.bind('result.autocomplete', options.result);
|
||||
|
||||
var timeout;
|
||||
var previousValue = "";
|
||||
var cache = $.Autocompleter.Cache(options);
|
||||
var hasFocus = 0;
|
||||
var lastKeyPressCode;
|
||||
var config = {
|
||||
mouseDownOnSelect: false
|
||||
};
|
||||
var select = $.Autocompleter.Select(options, input, selectCurrent, config);
|
||||
|
||||
var blockSubmit;
|
||||
|
||||
// prevent form submit in opera when selecting with return key
|
||||
$.browser.opera && $(input.form).bind("submit.autocomplete", function() {
|
||||
if (blockSubmit) {
|
||||
blockSubmit = false;
|
||||
return false;
|
||||
}
|
||||
});
|
||||
|
||||
// only opera doesn't trigger keydown multiple times while pressed, others don't work with keypress at all
|
||||
$input.bind(($.browser.opera ? "keypress" : "keydown") + ".autocomplete", function(event) {
|
||||
// track last key pressed
|
||||
lastKeyPressCode = event.keyCode;
|
||||
switch(event.keyCode) {
|
||||
|
||||
case KEY.UP:
|
||||
event.preventDefault();
|
||||
if ( select.visible() ) {
|
||||
select.prev();
|
||||
} else {
|
||||
onChange(0, true);
|
||||
}
|
||||
break;
|
||||
|
||||
case KEY.DOWN:
|
||||
event.preventDefault();
|
||||
if ( select.visible() ) {
|
||||
select.next();
|
||||
} else {
|
||||
onChange(0, true);
|
||||
}
|
||||
break;
|
||||
|
||||
case KEY.PAGEUP:
|
||||
event.preventDefault();
|
||||
if ( select.visible() ) {
|
||||
select.pageUp();
|
||||
} else {
|
||||
onChange(0, true);
|
||||
}
|
||||
break;
|
||||
|
||||
case KEY.PAGEDOWN:
|
||||
event.preventDefault();
|
||||
if ( select.visible() ) {
|
||||
select.pageDown();
|
||||
} else {
|
||||
onChange(0, true);
|
||||
}
|
||||
break;
|
||||
|
||||
// matches also semicolon
|
||||
case options.multiple && $.trim(options.multipleSeparator) == "," && KEY.COMMA:
|
||||
case KEY.TAB:
|
||||
case KEY.RETURN:
|
||||
if( selectCurrent() ) {
|
||||
// stop default to prevent a form submit, Opera needs special handling
|
||||
event.preventDefault();
|
||||
blockSubmit = true;
|
||||
return false;
|
||||
}
|
||||
break;
|
||||
|
||||
case KEY.ESC:
|
||||
select.hide();
|
||||
break;
|
||||
|
||||
default:
|
||||
clearTimeout(timeout);
|
||||
timeout = setTimeout(onChange, options.delay);
|
||||
break;
|
||||
}
|
||||
}).focus(function(){
|
||||
// track whether the field has focus, we shouldn't process any
|
||||
// results if the field no longer has focus
|
||||
hasFocus++;
|
||||
}).blur(function() {
|
||||
hasFocus = 0;
|
||||
if (!config.mouseDownOnSelect) {
|
||||
hideResults();
|
||||
}
|
||||
}).click(function() {
|
||||
// show select when clicking in a focused field
|
||||
if ( hasFocus++ > 1 && !select.visible() ) {
|
||||
onChange(0, true);
|
||||
}
|
||||
}).bind("search", function() {
|
||||
// TODO why not just specifying both arguments?
|
||||
var fn = (arguments.length > 1) ? arguments[1] : null;
|
||||
function findValueCallback(q, data) {
|
||||
var result;
|
||||
if( data && data.length ) {
|
||||
for (var i=0; i < data.length; i++) {
|
||||
if( data[i].result.toLowerCase() == q.toLowerCase() ) {
|
||||
result = data[i];
|
||||
break;
|
||||
}
|
||||
}
|
||||
}
|
||||
if( typeof fn == "function" ) fn(result);
|
||||
else $input.trigger("result", result && [result.data, result.value]);
|
||||
}
|
||||
$.each(trimWords($input.val()), function(i, value) {
|
||||
request(value, findValueCallback, findValueCallback);
|
||||
});
|
||||
}).bind("flushCache", function() {
|
||||
cache.flush();
|
||||
}).bind("setOptions", function() {
|
||||
$.extend(options, arguments[1]);
|
||||
// if we've updated the data, repopulate
|
||||
if ( "data" in arguments[1] )
|
||||
cache.populate();
|
||||
}).bind("unautocomplete", function() {
|
||||
select.unbind();
|
||||
$input.unbind();
|
||||
$(input.form).unbind(".autocomplete");
|
||||
});
|
||||
|
||||
|
||||
function selectCurrent() {
|
||||
var selected = select.selected();
|
||||
if( !selected )
|
||||
return false;
|
||||
|
||||
var v = selected.result;
|
||||
previousValue = v;
|
||||
|
||||
if ( options.multiple ) {
|
||||
var words = trimWords($input.val());
|
||||
if ( words.length > 1 ) {
|
||||
v = words.slice(0, words.length - 1).join( options.multipleSeparator ) + options.multipleSeparator + v;
|
||||
}
|
||||
v += options.multipleSeparator;
|
||||
}
|
||||
|
||||
$input.val(v);
|
||||
hideResultsNow();
|
||||
$input.trigger("result", [selected.data, selected.value]);
|
||||
return true;
|
||||
}
|
||||
|
||||
function onChange(crap, skipPrevCheck) {
|
||||
if( lastKeyPressCode == KEY.DEL ) {
|
||||
select.hide();
|
||||
return;
|
||||
}
|
||||
|
||||
var currentValue = $input.val();
|
||||
|
||||
if ( !skipPrevCheck && currentValue == previousValue )
|
||||
return;
|
||||
|
||||
previousValue = currentValue;
|
||||
|
||||
currentValue = lastWord(currentValue);
|
||||
if ( currentValue.length >= options.minChars) {
|
||||
$input.addClass(options.loadingClass);
|
||||
if (!options.matchCase)
|
||||
currentValue = currentValue.toLowerCase();
|
||||
request(currentValue, receiveData, hideResultsNow);
|
||||
} else {
|
||||
stopLoading();
|
||||
select.hide();
|
||||
}
|
||||
};
|
||||
|
||||
function trimWords(value) {
|
||||
if ( !value ) {
|
||||
return [""];
|
||||
}
|
||||
var words = value.split( options.multipleSeparator );
|
||||
var result = [];
|
||||
$.each(words, function(i, value) {
|
||||
if ( $.trim(value) )
|
||||
result[i] = $.trim(value);
|
||||
});
|
||||
return result;
|
||||
}
|
||||
|
||||
function lastWord(value) {
|
||||
if ( !options.multiple )
|
||||
return value;
|
||||
var words = trimWords(value);
|
||||
return words[words.length - 1];
|
||||
}
|
||||
|
||||
// fills in the input box w/the first match (assumed to be the best match)
|
||||
// q: the term entered
|
||||
// sValue: the first matching result
|
||||
function autoFill(q, sValue){
|
||||
// autofill in the complete box w/the first match as long as the user hasn't entered in more data
|
||||
// if the last user key pressed was backspace, don't autofill
|
||||
if( options.autoFill && (lastWord($input.val()).toLowerCase() == q.toLowerCase()) && lastKeyPressCode != KEY.BACKSPACE ) {
|
||||
// fill in the value (keep the case the user has typed)
|
||||
$input.val($input.val() + sValue.substring(lastWord(previousValue).length));
|
||||
// select the portion of the value not typed by the user (so the next character will erase)
|
||||
$.Autocompleter.Selection(input, previousValue.length, previousValue.length + sValue.length);
|
||||
}
|
||||
};
|
||||
|
||||
function hideResults() {
|
||||
clearTimeout(timeout);
|
||||
timeout = setTimeout(hideResultsNow, 200);
|
||||
};
|
||||
|
||||
function hideResultsNow() {
|
||||
var wasVisible = select.visible();
|
||||
select.hide();
|
||||
clearTimeout(timeout);
|
||||
stopLoading();
|
||||
if (options.mustMatch) {
|
||||
// call search and run callback
|
||||
$input.autocomplete("search", function (result){
|
||||
// if no value found, clear the input box
|
||||
if( !result ) {
|
||||
if (options.multiple) {
|
||||
var words = trimWords($input.val()).slice(0, -1);
|
||||
$input.val( words.join(options.multipleSeparator) + (words.length ? options.multipleSeparator : "") );
|
||||
}
|
||||
else
|
||||
$input.val( "" );
|
||||
}
|
||||
}
|
||||
);
|
||||
}
|
||||
if (wasVisible)
|
||||
// position cursor at end of input field
|
||||
$.Autocompleter.Selection(input, input.value.length, input.value.length);
|
||||
};
|
||||
|
||||
function receiveData(q, data) {
|
||||
if ( data && data.length && hasFocus ) {
|
||||
stopLoading();
|
||||
select.display(data, q);
|
||||
autoFill(q, data[0].value);
|
||||
select.show();
|
||||
} else {
|
||||
hideResultsNow();
|
||||
}
|
||||
};
|
||||
|
||||
function request(term, success, failure) {
|
||||
if (!options.matchCase)
|
||||
term = term.toLowerCase();
|
||||
var data = cache.load(term);
|
||||
// recieve the cached data
|
||||
if (data && data.length) {
|
||||
success(term, data);
|
||||
// if an AJAX url has been supplied, try loading the data now
|
||||
|
||||
} else if( (typeof options.url == "string") && (options.url.length > 0) ){
|
||||
|
||||
var extraParams = {
|
||||
timestamp: +new Date()
|
||||
};
|
||||
$.each(options.extraParams, function(key, param) {
|
||||
extraParams[key] = typeof param == "function" ? param() : param;
|
||||
});
|
||||
|
||||
$.ajax({
|
||||
// try to leverage ajaxQueue plugin to abort previous requests
|
||||
mode: "abort",
|
||||
// limit abortion to this input
|
||||
port: "autocomplete" + input.name,
|
||||
dataType: options.dataType,
|
||||
url: options.url,
|
||||
data: $.extend({
|
||||
q: lastWord(term),
|
||||
limit: options.max
|
||||
}, extraParams),
|
||||
success: function(data) {
|
||||
var parsed = options.parse && options.parse(data) || parse(data);
|
||||
cache.add(term, parsed);
|
||||
success(term, parsed);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
else if (options.source && typeof options.source == 'function') {
|
||||
var resultData = options.source(term);
|
||||
var parsed = (options.parse) ? options.parse(resultData) : resultData;
|
||||
|
||||
cache.add(term, parsed);
|
||||
success(term, parsed);
|
||||
} else {
|
||||
// if we have a failure, we need to empty the list -- this prevents the the [TAB] key from selecting the last successful match
|
||||
select.emptyList();
|
||||
failure(term);
|
||||
}
|
||||
};
|
||||
|
||||
function parse(data) {
|
||||
var parsed = [];
|
||||
var rows = data.split("\n");
|
||||
for (var i=0; i < rows.length; i++) {
|
||||
var row = $.trim(rows[i]);
|
||||
if (row) {
|
||||
row = row.split("|");
|
||||
parsed[parsed.length] = {
|
||||
data: row,
|
||||
value: row[0],
|
||||
result: options.formatResult && options.formatResult(row, row[0]) || row[0]
|
||||
};
|
||||
}
|
||||
}
|
||||
return parsed;
|
||||
};
|
||||
|
||||
function stopLoading() {
|
||||
$input.removeClass(options.loadingClass);
|
||||
};
|
||||
|
||||
};
|
||||
|
||||
$.Autocompleter.defaults = {
|
||||
inputClass: "ui-autocomplete-input",
|
||||
resultsClass: "ui-autocomplete-results",
|
||||
loadingClass: "ui-autocomplete-loading",
|
||||
minChars: 1,
|
||||
delay: 400,
|
||||
matchCase: false,
|
||||
matchSubset: true,
|
||||
matchContains: false,
|
||||
cacheLength: 10,
|
||||
max: 100,
|
||||
mustMatch: false,
|
||||
extraParams: {},
|
||||
selectFirst: true,
|
||||
formatItem: function(row) { return row[0]; },
|
||||
formatMatch: null,
|
||||
autoFill: false,
|
||||
width: 0,
|
||||
multiple: false,
|
||||
multipleSeparator: ", ",
|
||||
highlight: function(value, term) {
|
||||
return value.replace(new RegExp("(?![^&;]+;)(?!<[^<>]*)(" + term.replace(/([\^\$\(\)\[\]\{\}\*\.\+\?\|\\])/gi, "\\$1") + ")(?![^<>]*>)(?![^&;]+;)", "gi"), "<strong>$1</strong>");
|
||||
},
|
||||
scroll: true,
|
||||
scrollHeight: 180
|
||||
};
|
||||
|
||||
$.extend($.ui.autocomplete, {
|
||||
defaults: $.Autocompleter.defaults
|
||||
});
|
||||
|
||||
$.Autocompleter.Cache = function(options) {
|
||||
|
||||
var data = {};
|
||||
var length = 0;
|
||||
|
||||
function matchSubset(s, sub) {
|
||||
if (!options.matchCase)
|
||||
s = s.toLowerCase();
|
||||
var i = s.indexOf(sub);
|
||||
if (i == -1) return false;
|
||||
return i == 0 || options.matchContains;
|
||||
};
|
||||
|
||||
function add(q, value) {
|
||||
if (length > options.cacheLength){
|
||||
flush();
|
||||
}
|
||||
if (!data[q]){
|
||||
length++;
|
||||
}
|
||||
data[q] = value;
|
||||
}
|
||||
|
||||
function populate(){
|
||||
if( !options.data ) return false;
|
||||
// track the matches
|
||||
var stMatchSets = {},
|
||||
nullData = 0;
|
||||
|
||||
// no url was specified, we need to adjust the cache length to make sure it fits the local data store
|
||||
if( !options.url ) options.cacheLength = 1;
|
||||
|
||||
// track all options for minChars = 0
|
||||
stMatchSets[""] = [];
|
||||
|
||||
// loop through the array and create a lookup structure
|
||||
for ( var i = 0, ol = options.data.length; i < ol; i++ ) {
|
||||
var rawValue = options.data[i];
|
||||
// if rawValue is a string, make an array otherwise just reference the array
|
||||
rawValue = (typeof rawValue == "string") ? [rawValue] : rawValue;
|
||||
|
||||
var value = options.formatMatch(rawValue, i+1, options.data.length);
|
||||
if ( value === false )
|
||||
continue;
|
||||
|
||||
var firstChar = value.charAt(0).toLowerCase();
|
||||
// if no lookup array for this character exists, look it up now
|
||||
if( !stMatchSets[firstChar] )
|
||||
stMatchSets[firstChar] = [];
|
||||
|
||||
// if the match is a string
|
||||
var row = {
|
||||
value: value,
|
||||
data: rawValue,
|
||||
result: options.formatResult && options.formatResult(rawValue) || value
|
||||
};
|
||||
|
||||
// push the current match into the set list
|
||||
stMatchSets[firstChar].push(row);
|
||||
|
||||
// keep track of minChars zero items
|
||||
if ( nullData++ < options.max ) {
|
||||
stMatchSets[""].push(row);
|
||||
}
|
||||
};
|
||||
|
||||
// add the data items to the cache
|
||||
$.each(stMatchSets, function(i, value) {
|
||||
// increase the cache size
|
||||
options.cacheLength++;
|
||||
// add to the cache
|
||||
add(i, value);
|
||||
});
|
||||
}
|
||||
|
||||
// populate any existing data
|
||||
setTimeout(populate, 25);
|
||||
|
||||
function flush(){
|
||||
data = {};
|
||||
length = 0;
|
||||
}
|
||||
|
||||
return {
|
||||
flush: flush,
|
||||
add: add,
|
||||
populate: populate,
|
||||
load: function(q) {
|
||||
if (!options.cacheLength || !length)
|
||||
return null;
|
||||
/*
|
||||
* if dealing w/local data and matchContains than we must make sure
|
||||
* to loop through all the data collections looking for matches
|
||||
*/
|
||||
if( !options.url && options.matchContains ){
|
||||
// track all matches
|
||||
var csub = [];
|
||||
// loop through all the data grids for matches
|
||||
for( var k in data ){
|
||||
// don't search through the stMatchSets[""] (minChars: 0) cache
|
||||
// this prevents duplicates
|
||||
if( k.length > 0 ){
|
||||
var c = data[k];
|
||||
$.each(c, function(i, x) {
|
||||
// if we've got a match, add it to the array
|
||||
if (matchSubset(x.value, q)) {
|
||||
csub.push(x);
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
return csub;
|
||||
} else
|
||||
// if the exact item exists, use it
|
||||
if (data[q]){
|
||||
return data[q];
|
||||
} else
|
||||
if (options.matchSubset) {
|
||||
for (var i = q.length - 1; i >= options.minChars; i--) {
|
||||
var c = data[q.substr(0, i)];
|
||||
if (c) {
|
||||
var csub = [];
|
||||
$.each(c, function(i, x) {
|
||||
if (matchSubset(x.value, q)) {
|
||||
csub[csub.length] = x;
|
||||
}
|
||||
});
|
||||
return csub;
|
||||
}
|
||||
}
|
||||
}
|
||||
return null;
|
||||
}
|
||||
};
|
||||
};
|
||||
|
||||
$.Autocompleter.Select = function (options, input, select, config) {
|
||||
var CLASSES = {
|
||||
ACTIVE: "ui-autocomplete-over"
|
||||
};
|
||||
|
||||
var listItems,
|
||||
active = -1,
|
||||
data,
|
||||
term = "",
|
||||
needsInit = true,
|
||||
element,
|
||||
list;
|
||||
|
||||
// Create results
|
||||
function init() {
|
||||
if (!needsInit)
|
||||
return;
|
||||
element = $("<div/>")
|
||||
.hide()
|
||||
.addClass(options.resultsClass)
|
||||
.css("position", "absolute")
|
||||
.appendTo(document.body);
|
||||
|
||||
list = $("<ul/>").appendTo(element).mouseover( function(event) {
|
||||
if(target(event).nodeName && target(event).nodeName.toUpperCase() == 'LI') {
|
||||
active = $("li", list).removeClass(CLASSES.ACTIVE).index(target(event));
|
||||
$(target(event)).addClass(CLASSES.ACTIVE);
|
||||
}
|
||||
}).click(function(event) {
|
||||
$(target(event)).addClass(CLASSES.ACTIVE);
|
||||
select();
|
||||
// TODO provide option to avoid setting focus again after selection? useful for cleanup-on-focus
|
||||
input.focus();
|
||||
return false;
|
||||
}).mousedown(function() {
|
||||
config.mouseDownOnSelect = true;
|
||||
}).mouseup(function() {
|
||||
config.mouseDownOnSelect = false;
|
||||
});
|
||||
|
||||
if( options.width > 0 )
|
||||
element.css("width", options.width);
|
||||
|
||||
needsInit = false;
|
||||
}
|
||||
|
||||
function target(event) {
|
||||
var element = event.target;
|
||||
while(element && element.tagName != "LI")
|
||||
element = element.parentNode;
|
||||
// more fun with IE, sometimes event.target is empty, just ignore it then
|
||||
if(!element)
|
||||
return [];
|
||||
return element;
|
||||
}
|
||||
|
||||
function moveSelect(step) {
|
||||
listItems.slice(active, active + 1).removeClass(CLASSES.ACTIVE);
|
||||
movePosition(step);
|
||||
var activeItem = listItems.slice(active, active + 1).addClass(CLASSES.ACTIVE);
|
||||
if(options.scroll) {
|
||||
var offset = 0;
|
||||
listItems.slice(0, active).each(function() {
|
||||
offset += this.offsetHeight;
|
||||
});
|
||||
if((offset + activeItem[0].offsetHeight - list.scrollTop()) > list[0].clientHeight) {
|
||||
list.scrollTop(offset + activeItem[0].offsetHeight - list.innerHeight());
|
||||
} else if(offset < list.scrollTop()) {
|
||||
list.scrollTop(offset);
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
function movePosition(step) {
|
||||
active += step;
|
||||
if (active < 0) {
|
||||
active = listItems.size() - 1;
|
||||
} else if (active >= listItems.size()) {
|
||||
active = 0;
|
||||
}
|
||||
}
|
||||
|
||||
function limitNumberOfItems(available) {
|
||||
return options.max && options.max < available
|
||||
? options.max
|
||||
: available;
|
||||
}
|
||||
|
||||
function fillList() {
|
||||
list.empty();
|
||||
var max = limitNumberOfItems(data.length);
|
||||
for (var i=0; i < max; i++) {
|
||||
if (!data[i])
|
||||
continue;
|
||||
var formatted = options.formatItem(data[i].data, i+1, max, data[i].value, term);
|
||||
if ( formatted === false )
|
||||
continue;
|
||||
var li = $("<li/>").html( options.highlight(formatted, term) ).addClass(i%2 == 0 ? "ui-autocomplete-even" : "ui-autocomplete-odd").appendTo(list)[0];
|
||||
$.data(li, "ui-autocomplete-data", data[i]);
|
||||
}
|
||||
listItems = list.find("li");
|
||||
if ( options.selectFirst ) {
|
||||
listItems.slice(0, 1).addClass(CLASSES.ACTIVE);
|
||||
active = 0;
|
||||
}
|
||||
// apply bgiframe if available
|
||||
if ( $.fn.bgiframe )
|
||||
list.bgiframe();
|
||||
}
|
||||
|
||||
return {
|
||||
display: function(d, q) {
|
||||
init();
|
||||
data = d;
|
||||
term = q;
|
||||
fillList();
|
||||
},
|
||||
next: function() {
|
||||
moveSelect(1);
|
||||
},
|
||||
prev: function() {
|
||||
moveSelect(-1);
|
||||
},
|
||||
pageUp: function() {
|
||||
if (active != 0 && active - 8 < 0) {
|
||||
moveSelect( -active );
|
||||
} else {
|
||||
moveSelect(-8);
|
||||
}
|
||||
},
|
||||
pageDown: function() {
|
||||
if (active != listItems.size() - 1 && active + 8 > listItems.size()) {
|
||||
moveSelect( listItems.size() - 1 - active );
|
||||
} else {
|
||||
moveSelect(8);
|
||||
}
|
||||
},
|
||||
hide: function() {
|
||||
element && element.hide();
|
||||
listItems && listItems.removeClass(CLASSES.ACTIVE)
|
||||
active = -1;
|
||||
$(input).triggerHandler("autocompletehide", [{}, { options: options }], options["hide"]);
|
||||
},
|
||||
visible : function() {
|
||||
return element && element.is(":visible");
|
||||
},
|
||||
current: function() {
|
||||
return this.visible() && (listItems.filter("." + CLASSES.ACTIVE)[0] || options.selectFirst && listItems[0]);
|
||||
},
|
||||
show: function() {
|
||||
var offset = $(input).offset();
|
||||
element.css({
|
||||
width: typeof options.width == "string" || options.width > 0 ? options.width : $(input).width(),
|
||||
top: offset.top + input.offsetHeight,
|
||||
left: offset.left
|
||||
}).show();
|
||||
|
||||
if(options.scroll) {
|
||||
list.scrollTop(0);
|
||||
list.css({
|
||||
maxHeight: options.scrollHeight,
|
||||
overflow: 'auto'
|
||||
});
|
||||
|
||||
if($.browser.msie && typeof document.body.style.maxHeight === "undefined") {
|
||||
var listHeight = 0;
|
||||
listItems.each(function() {
|
||||
listHeight += this.offsetHeight;
|
||||
});
|
||||
var scrollbarsVisible = listHeight > options.scrollHeight;
|
||||
list.css('height', scrollbarsVisible ? options.scrollHeight : listHeight );
|
||||
if (!scrollbarsVisible) {
|
||||
// IE doesn't recalculate width when scrollbar disappears
|
||||
listItems.width( list.width() - parseInt(listItems.css("padding-left")) - parseInt(listItems.css("padding-right")) );
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
$(input).triggerHandler("autocompleteshow", [{}, { options: options }], options["show"]);
|
||||
|
||||
},
|
||||
selected: function() {
|
||||
var selected = listItems && listItems.filter("." + CLASSES.ACTIVE).removeClass(CLASSES.ACTIVE);
|
||||
return selected && selected.length && $.data(selected[0], "ui-autocomplete-data");
|
||||
},
|
||||
emptyList: function (){
|
||||
list && list.empty();
|
||||
},
|
||||
unbind: function() {
|
||||
element && element.remove();
|
||||
}
|
||||
};
|
||||
};
|
||||
|
||||
$.Autocompleter.Selection = function(field, start, end) {
|
||||
if( field.createTextRange ){
|
||||
var selRange = field.createTextRange();
|
||||
selRange.collapse(true);
|
||||
selRange.moveStart("character", start);
|
||||
selRange.moveEnd("character", end);
|
||||
selRange.select();
|
||||
} else if( field.setSelectionRange ){
|
||||
field.setSelectionRange(start, end);
|
||||
} else {
|
||||
if( field.selectionStart ){
|
||||
field.selectionStart = start;
|
||||
field.selectionEnd = end;
|
||||
}
|
||||
}
|
||||
field.focus();
|
||||
};
|
||||
|
||||
})(jQuery);
|
||||
117
ui/ui.history.js
Normal file
117
ui/ui.history.js
Normal file
@ -0,0 +1,117 @@
|
||||
/*
|
||||
* jQuery UI History
|
||||
*
|
||||
* Copyright (c) 2008 Klaus Hartl (stilbuero.de)
|
||||
* Dual licensed under the MIT (MIT-LICENSE.txt)
|
||||
* and GPL (GPL-LICENSE.txt) licenses.
|
||||
*
|
||||
* http://docs.jquery.com/UI/History
|
||||
*
|
||||
* Revision: $Id: ui.history.js 5218 2008-04-09 20:08:24Z rdworth $
|
||||
*/
|
||||
;(function($) {
|
||||
|
||||
// if the UI scope is not availalable, add it
|
||||
$.ui = $.ui || {};
|
||||
|
||||
// TODO lazy loading singleton
|
||||
$.ui.hmanager = new function() {
|
||||
var states = {}, def = function() {};
|
||||
|
||||
var $window = $(window), hash = location.hash;
|
||||
|
||||
function getState() {
|
||||
return hash.replace('#', '');
|
||||
}
|
||||
|
||||
var iframe;
|
||||
// var keepHistoryIn = iframe || window;
|
||||
|
||||
return {
|
||||
|
||||
enable: function() {
|
||||
|
||||
if ($.browser.msie && parseInt($.browser.version) < 8) {
|
||||
$(function() {
|
||||
// create hidden iframe for hash change tracking
|
||||
iframe = $('<iframe id="ui-history-iframe" style="display: none;"></iframe>').
|
||||
prependTo(document.body)[0];
|
||||
|
||||
// create initial history entry
|
||||
iframe.contentWindow.document.open();
|
||||
iframe.contentWindow.document.close();
|
||||
|
||||
if (getState())
|
||||
iframe.contentWindow.document.location.hash = getState();
|
||||
|
||||
});
|
||||
}
|
||||
|
||||
$window.bind('hashchange', function(e) {
|
||||
// Prevent IE 8 from fireing an event twice,
|
||||
// one from true event, one from trigger...
|
||||
if (!iframe && hash == location.hash || iframe && hash == iframe.contentWindow.document.location.hash)
|
||||
return false;
|
||||
|
||||
if ($.browser.msie && parseInt($.browser.version) < 8) {
|
||||
hash = iframe.contentWindow.document.location.hash;
|
||||
}
|
||||
else
|
||||
hash = location.hash;
|
||||
|
||||
if (getState())
|
||||
states[getState()]();
|
||||
else
|
||||
// TODO invoke default
|
||||
;
|
||||
});
|
||||
|
||||
if (!($.browser.msie && parseInt($.browser.version) >= 8)) {
|
||||
setInterval(
|
||||
($.browser.msie ?
|
||||
function() {
|
||||
if (hash != iframe.contentWindow.document.location.hash)
|
||||
$window.trigger('hashchange');
|
||||
} :
|
||||
function() {
|
||||
if (hash != location.hash)
|
||||
$window.trigger('hashchange');
|
||||
else
|
||||
// Do the history.length check hack for Safari 2
|
||||
;
|
||||
}
|
||||
)
|
||||
, 200
|
||||
);
|
||||
}
|
||||
|
||||
},
|
||||
|
||||
add: function(state, handler) {
|
||||
states[state] = handler;
|
||||
},
|
||||
|
||||
go: function(state) {
|
||||
if (state) {
|
||||
if ($.browser.msie && parseInt($.browser.version) < 8) {
|
||||
iframe.contentWindow.document.open();
|
||||
iframe.contentWindow.document.close();
|
||||
iframe.contentWindow.document.location.hash = state;
|
||||
}
|
||||
location.hash = state;
|
||||
$window.trigger('hashchange');
|
||||
}
|
||||
else
|
||||
console.log('TODO do default state');
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
};
|
||||
|
||||
$.ui.history = function() {
|
||||
var args = Array.prototype.slice.call(arguments, 1);
|
||||
$.ui.hmanager[arguments[0]].apply($.ui.hmanager, args);
|
||||
};
|
||||
|
||||
})(jQuery);
|
||||
175
ui/ui.magnifier.js
Normal file
175
ui/ui.magnifier.js
Normal file
@ -0,0 +1,175 @@
|
||||
(function($) {
|
||||
|
||||
$.widget("ui.magnifier", {
|
||||
init: function() {
|
||||
|
||||
var self = this, o = this.options;
|
||||
this.items = [];
|
||||
this.element.addClass("ui-magnifier");
|
||||
if(!(/^(r|a)/).test(this.element.css("position"))) this.element.css("position", "relative");
|
||||
|
||||
this.pp = this.element.offset();
|
||||
|
||||
$(o.items, this.element).each(function() {
|
||||
|
||||
self.items.push([
|
||||
this,
|
||||
$(this).offset(),
|
||||
[$(this).width(),$(this).height()],
|
||||
(o.overlap ? $(this).position() : null)
|
||||
]);
|
||||
|
||||
if(o.opacity)
|
||||
$(this).css('opacity', o.opacity.min);
|
||||
|
||||
});
|
||||
|
||||
if(o.overlap) {
|
||||
for(var i=0;i<this.items.length;i++) {
|
||||
//Absolutize
|
||||
$(this.items[i][0]).css({
|
||||
position: "absolute",
|
||||
top: this.items[i][3].top,
|
||||
left: this.items[i][3].left
|
||||
});
|
||||
};
|
||||
}
|
||||
|
||||
this.identifier = ++$.ui.magnifier.counter;
|
||||
$(document).bind("mousemove.magnifier"+this.identifier, function(e) {
|
||||
if(!self.disabled) self.magnify.apply(self, [e]);
|
||||
});
|
||||
|
||||
if(o.click) {
|
||||
this.element.bind('click.magnifier', function(e) {
|
||||
if(!self.disabled) o.click.apply(this, [e, { options: self.options, current: self.current[0], currentOffset: self.current[1] }]);
|
||||
});
|
||||
}
|
||||
|
||||
},
|
||||
|
||||
|
||||
destroy: function() {
|
||||
this.reset();
|
||||
this.element
|
||||
.removeClass("ui-magnifier")
|
||||
.removeClass("ui-magnifier-disabled")
|
||||
.unbind(".magnifier");
|
||||
$(document).unbind("mousemove.magnifier"+this.identifier);
|
||||
},
|
||||
disable: function() {
|
||||
this.reset();
|
||||
this.element.addClass("ui-magnifier-disabled");
|
||||
this.options.disabled = true;
|
||||
},
|
||||
reset: function(e) {
|
||||
|
||||
var o = this.options, c, distance = 1;
|
||||
|
||||
for(var i=0; i < this.items.length; i++) {
|
||||
|
||||
c = this.items[i];
|
||||
|
||||
$(c[0]).css({
|
||||
width: c[2][0],
|
||||
height: c[2][1],
|
||||
top: (c[3] ? c[3].top : 0),
|
||||
left: (c[3] ? c[3].left : 0)
|
||||
});
|
||||
|
||||
if(o.opacity)
|
||||
$(c[0]).css('opacity', o.opacity.min);
|
||||
|
||||
if(o.zIndex)
|
||||
$(c[0]).css("z-index", "");
|
||||
|
||||
}
|
||||
|
||||
},
|
||||
magnify: function(e) {
|
||||
|
||||
var p = [e.pageX,e.pageY], o = this.options, c, distance = 1;
|
||||
this.current = this.items[0];
|
||||
|
||||
//Compute the parents distance, because we don't need to fire anything if we are not near the parent
|
||||
var overlap = ((p[0] > this.pp.left-o.distance && p[0] < this.pp.left + this.element[0].offsetWidth + o.distance) && (p[1] > this.pp.top-o.distance && p[1] < this.pp.top + this.element[0].offsetHeight + o.distance));
|
||||
if(!overlap) return false;
|
||||
|
||||
for(var i=0;i<this.items.length;i++) {
|
||||
|
||||
c = this.items[i];
|
||||
|
||||
var olddistance = distance;
|
||||
if(!o.axis) {
|
||||
distance = Math.sqrt(
|
||||
Math.pow(p[0] - ((c[3] ? this.pp.left : c[1].left) + parseInt(c[0].style.left,10)) - (c[0].offsetWidth/2), 2)
|
||||
+ Math.pow(p[1] - ((c[3] ? this.pp.top : c[1].top ) + parseInt(c[0].style.top,10)) - (c[0].offsetHeight/2), 2)
|
||||
);
|
||||
} else {
|
||||
if(o.axis == "y") {
|
||||
distance = Math.abs(p[1] - ((c[3] ? this.pp.top : c[1].top ) + parseInt(c[0].style.top,10)) - (c[0].offsetHeight/2));
|
||||
} else {
|
||||
distance = Math.abs(p[0] - ((c[3] ? this.pp.left : c[1].left) + parseInt(c[0].style.left,10)) - (c[0].offsetWidth/2));
|
||||
}
|
||||
}
|
||||
|
||||
if(distance < o.distance) {
|
||||
|
||||
this.current = distance < olddistance ? this.items[i] : this.current;
|
||||
|
||||
if(!o.axis || o.axis != "y") {
|
||||
$(c[0]).css({
|
||||
width: c[2][0]+ (c[2][0] * (o.magnification-1)) - (((distance/o.distance)*c[2][0]) * (o.magnification-1)),
|
||||
left: (c[3] ? (c[3].left + o.verticalLine * ((c[2][1] * (o.magnification-1)) - (((distance/o.distance)*c[2][1]) * (o.magnification-1)))) : 0)
|
||||
});
|
||||
}
|
||||
|
||||
if(!o.axis || o.axis != "x") {
|
||||
$(c[0]).css({
|
||||
height: c[2][1]+ (c[2][1] * (o.magnification-1)) - (((distance/o.distance)*c[2][1]) * (o.magnification-1)),
|
||||
top: (c[3] ? c[3].top : 0) + (o.baseline-0.5) * ((c[2][0] * (o.magnification-1)) - (((distance/o.distance)*c[2][0]) * (o.magnification-1)))
|
||||
});
|
||||
}
|
||||
|
||||
if(o.opacity)
|
||||
$(c[0]).css('opacity', o.opacity.max-(distance/o.distance) < o.opacity.min ? o.opacity.min : o.opacity.max-(distance/o.distance));
|
||||
|
||||
} else {
|
||||
|
||||
$(c[0]).css({
|
||||
width: c[2][0],
|
||||
height: c[2][1],
|
||||
top: (c[3] ? c[3].top : 0),
|
||||
left: (c[3] ? c[3].left : 0)
|
||||
});
|
||||
|
||||
if(o.opacity)
|
||||
$(c[0]).css('opacity', o.opacity.min);
|
||||
|
||||
}
|
||||
|
||||
if(o.zIndex)
|
||||
$(c[0]).css("z-index", "");
|
||||
|
||||
}
|
||||
|
||||
if(this.options.zIndex)
|
||||
$(this.current[0]).css("z-index", this.options.zIndex);
|
||||
|
||||
}
|
||||
|
||||
|
||||
});
|
||||
|
||||
$.extend($.ui.magnifier, {
|
||||
counter: 0,
|
||||
defaults: {
|
||||
distance: 150,
|
||||
magnification: 2,
|
||||
baseline: 0,
|
||||
verticalLine: -0.5,
|
||||
items: "> *"
|
||||
}
|
||||
});
|
||||
|
||||
})(jQuery);
|
||||
195
ui/ui.progressbar.js
Normal file
195
ui/ui.progressbar.js
Normal file
@ -0,0 +1,195 @@
|
||||
/*
|
||||
* jQuery UI ProgressBar
|
||||
*
|
||||
* Copyright (c) 2008 Eduardo Lundgren (braeker)
|
||||
* Dual licensed under the MIT (MIT-LICENSE.txt)
|
||||
* and GPL (GPL-LICENSE.txt) licenses.
|
||||
*
|
||||
* http://docs.jquery.com/UI/ProgressBar
|
||||
*
|
||||
* Depends:
|
||||
* ui.base.js
|
||||
*
|
||||
* Revision: $Id: ui.progressbar.js 5196 2008-04-04 12:52:32Z braeker $
|
||||
*/
|
||||
;(function($) {
|
||||
|
||||
$.widget("ui.progressbar", {
|
||||
init: function() {
|
||||
|
||||
var self = this, o = this.options, text = o.text ? o.text : (o.range ? '0%' : '');;
|
||||
this.element.addClass("ui-progressbar");
|
||||
|
||||
$.extend(o, {
|
||||
stepping: o.stepping > 100 ? 100 : o.stepping
|
||||
});
|
||||
|
||||
$.extend(this, {
|
||||
_step: 0,
|
||||
rangeValue: 0,
|
||||
threads: {},
|
||||
|
||||
wrapper: $("<div class='ui-progressbar-wrap'></div>"),
|
||||
bar: $("<div class='ui-progressbar-bar ui-hidden'></div>").css({
|
||||
width: '0px', overflow: 'hidden', zIndex: 100
|
||||
}),
|
||||
textElement: $("<div class='ui-progressbar-text'></div>").html(text).css({
|
||||
width: '0px', overflow: 'hidden'
|
||||
}),
|
||||
textBg: $("<div class='ui-progressbar-text ui-progressbar-text-back'></div>").html(text).css({
|
||||
width: this.element.css('width')
|
||||
})
|
||||
|
||||
});
|
||||
|
||||
this.wrapper
|
||||
.append(this.bar.append(this.textElement), this.textBg)
|
||||
.appendTo(this.element);
|
||||
|
||||
},
|
||||
|
||||
plugins: {},
|
||||
ui: function(e) {
|
||||
return {
|
||||
instance: this,
|
||||
options: this.options,
|
||||
step: this._step,
|
||||
rangeValue: this.rangeValue,
|
||||
pixelRange: this.pixelRange
|
||||
};
|
||||
},
|
||||
propagate: function(n,e) {
|
||||
$.ui.plugin.call(this, n, [e, this.ui()]);
|
||||
this.element.triggerHandler(n == "progressbar" ? n : ["progressbar", n].join(""), [e, this.ui()], this.options[n]);
|
||||
},
|
||||
destroy: function() {
|
||||
this.reset();
|
||||
|
||||
this.element
|
||||
.removeClass("ui-progressbar ui-progressbar-disabled")
|
||||
.removeData("progressbar").unbind(".progressbar")
|
||||
.find('.ui-progressbar-wrap').remove();
|
||||
},
|
||||
enable: function() {
|
||||
this.element.removeClass("ui-progressbar-disabled");
|
||||
this.disabled = false;
|
||||
if(this.inProgress) this.start();
|
||||
},
|
||||
disable: function() {
|
||||
this.element.addClass("ui-progressbar-disabled");
|
||||
this.disabled = true;
|
||||
this.clearThreads();
|
||||
},
|
||||
start: function() {
|
||||
|
||||
if (this.disabled) return false;
|
||||
this.inProgress = true;
|
||||
|
||||
var self = this, o = this.options, el = this.element;
|
||||
this.clearThreads();
|
||||
|
||||
if (typeof o.wait == 'number' && !self.waitThread)
|
||||
self.waitThread = setTimeout(function() {
|
||||
clearInterval(self.waitThread);
|
||||
self.waitThread = null;
|
||||
}, o.wait);
|
||||
|
||||
var frames = Math.ceil(100/o.stepping) || 0, ms = o.duration/frames || 0,
|
||||
|
||||
render = function(step, t) {
|
||||
//clearInterval(t);
|
||||
|
||||
self.progress(o.stepping * step);
|
||||
// on end
|
||||
if (step >= frames) {
|
||||
self.stop();
|
||||
|
||||
if (self.waitThread || o.wait == 'loop') {
|
||||
self._step = 0;
|
||||
self.start();
|
||||
}
|
||||
}
|
||||
};
|
||||
var from = this._step, _step = (this._step - (from - 1));
|
||||
|
||||
/*for(var step = from; step <= frames; step++) {
|
||||
var interval = (step - (from - 1)) * ms;
|
||||
this.threads[step] = setTimeout(render(step, this.threads[step]), interval);
|
||||
}*/
|
||||
|
||||
this.threads[0] = setInterval(function() {
|
||||
render(_step++);
|
||||
}, ms);
|
||||
|
||||
this.propagate('start');
|
||||
return false;
|
||||
},
|
||||
clearThreads: function() {
|
||||
$.each(this.threads, function(s, t) { clearInterval(t); });
|
||||
this.threads = {};
|
||||
},
|
||||
stop: function() {
|
||||
|
||||
if (this.disabled) return false;
|
||||
var o = this.options, self = this;
|
||||
|
||||
this.clearThreads();
|
||||
this.propagate('stop');
|
||||
|
||||
this.inProgress = false;
|
||||
return false;
|
||||
|
||||
},
|
||||
reset: function() {
|
||||
|
||||
if (this.disabled) return false;
|
||||
this._step = 0;
|
||||
this.rangeValue = 0;
|
||||
this.inProgress = false;
|
||||
this.clearThreads();
|
||||
this.progress(0);
|
||||
this.bar.addClass('ui-hidden');
|
||||
return false;
|
||||
|
||||
},
|
||||
progress: function(range) {
|
||||
|
||||
var o = this.options, el = this.element, bar = this.bar;
|
||||
if (this.disabled) return false;
|
||||
|
||||
range = parseInt(range, 10);
|
||||
this.rangeValue = this._fixRange(range);
|
||||
this.pixelRange = Math.round( ((this.rangeValue/100)||0) * (el.innerWidth() - (el.outerWidth() - el.innerWidth()) - (bar.outerWidth() - bar.innerWidth())) );
|
||||
|
||||
this.bar.removeClass('ui-hidden');
|
||||
|
||||
var css = { width: this.pixelRange + 'px' };
|
||||
this.bar.css(css);
|
||||
this.textElement.css(css);
|
||||
|
||||
if (!o.text && o.range) this.text(this.rangeValue + '%');
|
||||
this.propagate('progress', this.rangeValue);
|
||||
return false;
|
||||
},
|
||||
text: function(text) {
|
||||
this.textElement.html(text);
|
||||
},
|
||||
_fixRange: function(range) {
|
||||
var o = this.options;
|
||||
this._step = Math.ceil(range/o.stepping);
|
||||
this.rangeValue = Math.round(o.stepping * this._step);
|
||||
this.rangeValue = (this.rangeValue) >= 100 ? 100 : this.rangeValue;
|
||||
return this.rangeValue;
|
||||
}
|
||||
});
|
||||
|
||||
$.ui.progressbar.defaults = {
|
||||
duration: 3000,
|
||||
stepping: 1,
|
||||
text: '',
|
||||
range: true,
|
||||
addClass: '',
|
||||
textClass: ''
|
||||
};
|
||||
|
||||
})(jQuery);
|
||||
@ -234,20 +234,26 @@ $.widget("ui.sortable", $.extend({}, $.ui.mouse, {
|
||||
|
||||
var self = that || this, o = self.options;
|
||||
|
||||
if(o.placeholder.constructor == String) {
|
||||
if(!o.placeholder || o.placeholder.constructor == String) {
|
||||
var className = o.placeholder;
|
||||
o.placeholder = {
|
||||
element: function() {
|
||||
return $('<div></div>').addClass(className)[0];
|
||||
var el = $(document.createElement(self.currentItem[0].nodeName)).addClass(className || "ui-sortable-placeholder")[0];
|
||||
if(!className) { el.style.visibility = "hidden"; el.innerHTML = self.currentItem[0].innerHTML; };
|
||||
return el;
|
||||
},
|
||||
update: function(i, p) {
|
||||
p.css(i.offset()).css({ width: i.outerWidth(), height: i.outerHeight() });
|
||||
update: function(container, p) {
|
||||
if(className) return;
|
||||
if(!p.height()) { p.height(self.currentItem.innerHeight()); };
|
||||
if(!p.width()) { p.width(self.currentItem.innerWidth()); };
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
self.placeholder = $(o.placeholder.element.call(self.element, self.currentItem)).appendTo('body').css({ position: 'absolute' });
|
||||
o.placeholder.update.call(self.element, self.currentItem, self.placeholder);
|
||||
self.placeholder = $(o.placeholder.element.call(self.element, self.currentItem)).appendTo(self.currentItem.parent());
|
||||
self.currentItem.before(self.placeholder);
|
||||
o.placeholder.update(self, self.placeholder);
|
||||
|
||||
},
|
||||
contactContainers: function(e) {
|
||||
for (var i = this.containers.length - 1; i >= 0; i--){
|
||||
@ -271,18 +277,13 @@ $.widget("ui.sortable", $.extend({}, $.ui.mouse, {
|
||||
if(!itemWithLeastDistance && !this.options.dropOnEmpty) //Check if dropOnEmpty is enabled
|
||||
continue;
|
||||
|
||||
//We also need to exchange the placeholder
|
||||
if(this.placeholder) this.placeholder.remove();
|
||||
if(this.containers[i].options.placeholder) {
|
||||
this.containers[i].createPlaceholder(this);
|
||||
} else {
|
||||
this.placeholder = null;;
|
||||
}
|
||||
|
||||
this.currentContainer = this.containers[i];
|
||||
itemWithLeastDistance ? this.rearrange(e, itemWithLeastDistance, null, true) : this.rearrange(e, null, this.containers[i].element, true);
|
||||
itemWithLeastDistance ? this.options.sortIndicator.call(this, e, itemWithLeastDistance, null, true) : this.options.sortIndicator.call(this, e, null, this.containers[i].element, true);
|
||||
this.propagate("change", e); //Call plugins and callbacks
|
||||
this.containers[i].propagate("change", e, this); //Call plugins and callbacks
|
||||
|
||||
//Update the placeholder
|
||||
this.options.placeholder.update(this.currentContainer, this.placeholder);
|
||||
|
||||
}
|
||||
|
||||
@ -335,9 +336,8 @@ $.widget("ui.sortable", $.extend({}, $.ui.mouse, {
|
||||
this.refreshPositions();
|
||||
|
||||
//Create and append the visible helper
|
||||
this.helper = typeof o.helper == 'function' ? $(o.helper.apply(this.element[0], [e, this.currentItem])) : this.currentItem.clone();
|
||||
this.helper = typeof o.helper == 'function' ? $(o.helper.apply(this.element[0], [e, this.currentItem])) : (o.helper == "original" ? this.currentItem : this.currentItem.clone());
|
||||
if (!this.helper.parents('body').length) $(o.appendTo != 'parent' ? o.appendTo : this.currentItem[0].parentNode)[0].appendChild(this.helper[0]); //Add the helper to the DOM if that didn't happen already
|
||||
this.helper.css({ position: 'absolute', clear: 'both' }).addClass('ui-sortable-helper'); //Position it absolutely and add a helper class
|
||||
|
||||
/*
|
||||
* - Position generation -
|
||||
@ -377,8 +377,16 @@ $.widget("ui.sortable", $.extend({}, $.ui.mouse, {
|
||||
|
||||
//If o.placeholder is used, create a new element at the given position with the class
|
||||
this.helperProportions = { width: this.helper.outerWidth(), height: this.helper.outerHeight() };//Cache the helper size
|
||||
if(o.placeholder) this.createPlaceholder();
|
||||
|
||||
|
||||
if(o.helper == "original") {
|
||||
this._storedCSS = { position: this.currentItem.css("position"), top: this.currentItem.css("top"), left: this.currentItem.css("left"), clear: this.currentItem.css("clear") };
|
||||
}
|
||||
|
||||
if(o.helper != "original") this.currentItem.hide(); //Hide the original, won't cause anything bad this way
|
||||
this.helper.css({ position: 'absolute', clear: 'both' }).addClass('ui-sortable-helper'); //Position it absolutely and add a helper class
|
||||
this.createPlaceholder();
|
||||
|
||||
//Call plugins and callbacks
|
||||
this.propagate("start", e);
|
||||
this.helperProportions = { width: this.helper.outerWidth(), height: this.helper.outerHeight() };//Recache the helper size
|
||||
@ -416,10 +424,6 @@ $.widget("ui.sortable", $.extend({}, $.ui.mouse, {
|
||||
];
|
||||
}
|
||||
}
|
||||
|
||||
//Set the original element visibility to hidden to still fill out the white space
|
||||
if(this.options.placeholder != 'clone')
|
||||
this.currentItem.css('visibility', 'hidden');
|
||||
|
||||
//Post 'activate' events to possible containers
|
||||
if(!noActivation) {
|
||||
@ -518,13 +522,13 @@ $.widget("ui.sortable", $.extend({}, $.ui.mouse, {
|
||||
if(!intersection) continue;
|
||||
|
||||
if(this.items[i].item[0] != this.currentItem[0] //cannot intersect with itself
|
||||
&& this.currentItem[intersection == 1 ? "next" : "prev"]()[0] != this.items[i].item[0] //no useless actions that have been done before
|
||||
&& !contains(this.currentItem[0], this.items[i].item[0]) //no action if the item moved is the parent of the item checked
|
||||
&& this.placeholder[intersection == 1 ? "next" : "prev"]()[0] != this.items[i].item[0] //no useless actions that have been done before
|
||||
&& !contains(this.placeholder[0], this.items[i].item[0]) //no action if the item moved is the parent of the item checked
|
||||
&& (this.options.type == 'semi-dynamic' ? !contains(this.element[0], this.items[i].item[0]) : true)
|
||||
) {
|
||||
|
||||
this.direction = intersection == 1 ? "down" : "up";
|
||||
this.rearrange(e, this.items[i]);
|
||||
this.options.sortIndicator.call(this, e, this.items[i]);
|
||||
this.propagate("change", e); //Call plugins and callbacks
|
||||
break;
|
||||
}
|
||||
@ -543,7 +547,8 @@ $.widget("ui.sortable", $.extend({}, $.ui.mouse, {
|
||||
|
||||
},
|
||||
rearrange: function(e, i, a, hardRefresh) {
|
||||
a ? a[0].appendChild(this.currentItem[0]) : i.item[0].parentNode.insertBefore(this.currentItem[0], (this.direction == 'down' ? i.item[0] : i.item[0].nextSibling));
|
||||
|
||||
a ? a[0].appendChild(this.placeholder[0]) : i.item[0].parentNode.insertBefore(this.placeholder[0], (this.direction == 'down' ? i.item[0] : i.item[0].nextSibling));
|
||||
|
||||
//Various things done here to improve the performance:
|
||||
// 1. we create a setTimeout, that calls refreshPositions
|
||||
@ -556,9 +561,7 @@ $.widget("ui.sortable", $.extend({}, $.ui.mouse, {
|
||||
window.setTimeout(function() {
|
||||
if(counter == self.counter) self.refreshPositions(!hardRefresh); //Precompute after each DOM insertion, NOT on mousemove
|
||||
},0);
|
||||
|
||||
if(this.options.placeholder)
|
||||
this.options.placeholder.update.call(this.element, this.currentItem, this.placeholder);
|
||||
|
||||
},
|
||||
mouseStop: function(e, noPropagation) {
|
||||
|
||||
@ -568,10 +571,7 @@ $.widget("ui.sortable", $.extend({}, $.ui.mouse, {
|
||||
|
||||
if(this.options.revert) {
|
||||
var self = this;
|
||||
var cur = self.currentItem.offset();
|
||||
|
||||
//Also animate the placeholder if we have one
|
||||
if(self.placeholder) self.placeholder.animate({ opacity: 'hide' }, (parseInt(this.options.revert, 10) || 500)-50);
|
||||
var cur = self.placeholder.offset();
|
||||
|
||||
$(this.helper).animate({
|
||||
left: cur.left - this.offset.parent.left - self.margins.left + (this.offsetParent[0] == document.body ? 0 : this.offsetParent[0].scrollLeft),
|
||||
@ -588,6 +588,15 @@ $.widget("ui.sortable", $.extend({}, $.ui.mouse, {
|
||||
},
|
||||
clear: function(e, noPropagation) {
|
||||
|
||||
//We first have to update the dom position of the actual currentItem
|
||||
if(!this._noFinalSort) this.placeholder.before(this.currentItem);
|
||||
this._noFinalSort = null;
|
||||
|
||||
if(this.options.helper == "original")
|
||||
this.currentItem.css(this._storedCSS).removeClass("ui-sortable-helper");
|
||||
else
|
||||
this.currentItem.show();
|
||||
|
||||
if(this.domPosition.prev != this.currentItem.prev().not(".ui-sortable-helper")[0] || this.domPosition.parent != this.currentItem.parent()[0]) this.propagate("update", e, null, noPropagation); //Trigger update callback if the DOM position has changed
|
||||
if(!contains(this.element[0], this.currentItem[0])) { //Node was moved out of the current element
|
||||
this.propagate("remove", e, null, noPropagation);
|
||||
@ -614,9 +623,10 @@ $.widget("ui.sortable", $.extend({}, $.ui.mouse, {
|
||||
return false;
|
||||
}
|
||||
|
||||
$(this.currentItem).css('visibility', '');
|
||||
if(this.placeholder) this.placeholder.remove();
|
||||
this.helper.remove(); this.helper = null;
|
||||
this.propagate("beforeStop", e, null, noPropagation);
|
||||
|
||||
this.placeholder.remove();
|
||||
if(this.options.helper != "original") this.helper.remove(); this.helper = null;
|
||||
this.propagate("stop", e, null, noPropagation);
|
||||
|
||||
return true;
|
||||
@ -627,7 +637,7 @@ $.widget("ui.sortable", $.extend({}, $.ui.mouse, {
|
||||
$.extend($.ui.sortable, {
|
||||
getter: "serialize toArray",
|
||||
defaults: {
|
||||
helper: "clone",
|
||||
helper: "original",
|
||||
tolerance: "guess",
|
||||
distance: 1,
|
||||
delay: 0,
|
||||
@ -638,7 +648,8 @@ $.extend($.ui.sortable, {
|
||||
items: '> *',
|
||||
zIndex: 1000,
|
||||
dropOnEmpty: true,
|
||||
appendTo: "parent"
|
||||
appendTo: "parent",
|
||||
sortIndicator: $.ui.sortable.prototype.rearrange
|
||||
}
|
||||
});
|
||||
|
||||
@ -652,7 +663,7 @@ $.ui.plugin.add("sortable", "cursor", {
|
||||
if (t.css("cursor")) ui.options._cursor = t.css("cursor");
|
||||
t.css("cursor", ui.options.cursor);
|
||||
},
|
||||
stop: function(e, ui) {
|
||||
beforeStop: function(e, ui) {
|
||||
if (ui.options._cursor) $('body').css("cursor", ui.options._cursor);
|
||||
}
|
||||
});
|
||||
@ -663,7 +674,7 @@ $.ui.plugin.add("sortable", "zIndex", {
|
||||
if(t.css("zIndex")) ui.options._zIndex = t.css("zIndex");
|
||||
t.css('zIndex', ui.options.zIndex);
|
||||
},
|
||||
stop: function(e, ui) {
|
||||
beforeStop: function(e, ui) {
|
||||
if(ui.options._zIndex) $(ui.helper).css('zIndex', ui.options._zIndex);
|
||||
}
|
||||
});
|
||||
@ -674,7 +685,7 @@ $.ui.plugin.add("sortable", "opacity", {
|
||||
if(t.css("opacity")) ui.options._opacity = t.css("opacity");
|
||||
t.css('opacity', ui.options.opacity);
|
||||
},
|
||||
stop: function(e, ui) {
|
||||
beforeStop: function(e, ui) {
|
||||
if(ui.options._opacity) $(ui.helper).css('opacity', ui.options._opacity);
|
||||
}
|
||||
});
|
||||
|
||||
114
ui/ui.spinner.js
Normal file
114
ui/ui.spinner.js
Normal file
@ -0,0 +1,114 @@
|
||||
(function($) {
|
||||
|
||||
$.widget("ui.spinner", {
|
||||
init: function() {
|
||||
|
||||
//Initialize needed constants
|
||||
var self = this;
|
||||
this.element.addClass("ui-spinner");
|
||||
this.element[0].value = this.options.start;
|
||||
|
||||
var pickerHeight = this.element.innerHeight() / 2 - parseInt(this.element.css("borderTopWidth"),10) - 2;
|
||||
this.element
|
||||
.wrap("<div>")
|
||||
.parent()
|
||||
.css({
|
||||
position: this.element.css("position") == "static" ? "relative" : this.element.css("position"),
|
||||
left: this.element.css("left"),
|
||||
top: this.element.css("top"),
|
||||
width: this.element.outerWidth(),
|
||||
height: this.element.outerHeight()
|
||||
})
|
||||
.css("float", this.element.css("float"))
|
||||
.prepend('<div class="ui-spinner-up"></div>')
|
||||
.find("div.ui-spinner-up")
|
||||
.bind("mousedown", function() { if(!self.counter) self.counter = 1; self.mousedown(100, "up"); })
|
||||
.bind("mouseup", function(e) { self.counter = 0; if(self.timer) window.clearInterval(self.timer); self.element[0].focus(); self.propagate("change", e); })
|
||||
.css({ height: pickerHeight, top: parseInt(this.element.css("borderTopWidth"),10)+1, right: parseInt(this.element.css("borderRightWidth"),10)+1 })
|
||||
.end()
|
||||
.append('<div class="ui-spinner-down"></div>')
|
||||
.find("div.ui-spinner-down")
|
||||
.bind("mousedown", function() { if(!self.counter) self.counter = 1; self.mousedown(100, "down"); })
|
||||
.bind("mouseup", function(e) { self.counter = 0; if(self.timer) window.clearInterval(self.timer); self.element[0].focus(); self.propagate("change", e); })
|
||||
.css({ height: pickerHeight, bottom: parseInt(this.element.css("borderBottomWidth"),10)+1, right: parseInt(this.element.css("borderRightWidth"),10)+1 })
|
||||
.end()
|
||||
;
|
||||
|
||||
this.element
|
||||
.bind("keydown.spinner", function(e) {
|
||||
if(!self.counter) self.counter = 1;
|
||||
self.keydown.call(self, e);
|
||||
})
|
||||
.bind("keyup.spinner", function(e) {
|
||||
self.counter = 0;
|
||||
self.cleanUp();
|
||||
self.propagate("change", e);
|
||||
})
|
||||
;
|
||||
|
||||
},
|
||||
plugins: {},
|
||||
constrain: function() {
|
||||
if(this.options.min != undefined && this.element[0].value < this.options.min) this.element[0].value = this.options.min;
|
||||
if(this.options.max != undefined && this.element[0].value > this.options.max) this.element[0].value = this.options.max;
|
||||
},
|
||||
cleanUp: function() {
|
||||
this.element[0].value = this.element[0].value.replace(/[^0-9\-]/g, '');
|
||||
this.constrain();
|
||||
},
|
||||
down: function(e) {
|
||||
if(isNaN(parseInt(this.element[0].value,10))) this.element[0].value = this.options.start;
|
||||
this.element[0].value -= (this.options.incremental && this.counter > 100 ? (this.counter > 200 ? 100 : 10) : 1) * this.options.stepping;
|
||||
this.constrain();
|
||||
if(this.counter) this.counter++;
|
||||
this.propagate("spin", e);
|
||||
},
|
||||
up: function(e) {
|
||||
if(isNaN(parseInt(this.element[0].value,10))) this.element[0].value = this.options.start;
|
||||
this.element[0].value = parseFloat(this.element[0].value) + (this.options.incremental && this.counter > 100 ? (this.counter > 200 ? 100 : 10) : 1) * this.options.stepping;
|
||||
this.constrain();
|
||||
if(this.counter) this.counter++;
|
||||
this.propagate("spin", e);
|
||||
},
|
||||
mousedown: function(i, d) {
|
||||
var self = this;
|
||||
i = i || 100;
|
||||
if(this.timer) window.clearInterval(this.timer);
|
||||
this.timer = window.setInterval(function() {
|
||||
self[d]();
|
||||
if(self.counter > 20) self.mousedown(20, d);
|
||||
}, i);
|
||||
},
|
||||
keydown: function(e) {
|
||||
if(e.keyCode == 38 || e.keyCode == 39) this.up(e);
|
||||
if(e.keyCode == 40 || e.keyCode == 37) this.down(e);
|
||||
if(e.keyCode == 36) this.element[0].value = this.options.min || this.options.start; //Home key goes to min, if defined, else to start
|
||||
if(e.keyCode == 35 && this.options.max != undefined) this.element[0].value = this.options.max; //End key goes to maximum
|
||||
},
|
||||
ui: function(e) {
|
||||
return {
|
||||
instance: this,
|
||||
options: this.options,
|
||||
element: this.element
|
||||
};
|
||||
},
|
||||
propagate: function(n,e) {
|
||||
$.ui.plugin.call(this, n, [e, this.ui()]);
|
||||
return this.element.triggerHandler(n == "spin" ? n : "spin"+n, [e, this.ui()], this.options[n]);
|
||||
},
|
||||
destroy: function() {
|
||||
if(!$.data(this.element[0], 'spinner')) return;
|
||||
this.element
|
||||
.removeClass("ui-spinner ui-spinner-disabled")
|
||||
.removeData("spinner")
|
||||
.unbind(".spinner");
|
||||
}
|
||||
});
|
||||
|
||||
$.ui.spinner.defaults = {
|
||||
stepping: 1,
|
||||
start: 0,
|
||||
incremental: true
|
||||
};
|
||||
|
||||
})(jQuery);
|
||||
@ -1 +1 @@
|
||||
1.5.2pre
|
||||
1.6pre
|
||||
Loading…
Reference in New Issue
Block a user