1 files changed, 130 insertions, 0 deletions
diff --git a/tests/visual/tree.html b/tests/visual/tree.html
new file mode 100644
index 000000000..a2c2e14d0
--- /dev/null
+++ b/tests/visual/tree.html
@@ -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>
+\ No newline at end of file