You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
138 lines
4.0 KiB
138 lines
4.0 KiB
<html> |
|
<head> |
|
|
|
<script type="text/javascript"> |
|
var djConfig = {isDebug: true, debugAtAllCosts: true }; |
|
</script> |
|
<script type="text/javascript" src="../../../dojo.js"></script> |
|
<script type="text/javascript"> |
|
delete dojo["profile"]; |
|
dojo.require("dojo.profile"); |
|
|
|
dojo.require("dojo.widget.*"); |
|
dojo.require("dojo.widget.TreeV3"); |
|
dojo.require("dojo.widget.TreeNodeV3"); |
|
dojo.require("dojo.widget.TreeBasicControllerV3"); |
|
dojo.require("dojo.widget.TreeDndControllerV3"); |
|
dojo.require("dojo.widget.TreeDisableWrapExtension"); |
|
dojo.hostenv.writeIncludes(); |
|
</script> |
|
<script type="text/javascript"> |
|
|
|
var nodeCount = 0; |
|
var nodeCountMax = 500; |
|
dojo.addOnLoad(function(){ |
|
var depth = 0; |
|
|
|
|
|
function addChildren(title) { |
|
//dojo.debug("addChildren title "+title); |
|
|
|
depth++; |
|
|
|
var children = []; |
|
for (var i=1; i<=5; i++) { |
|
|
|
var t = title+'.'+i; |
|
var node = {title: t}; |
|
|
|
children.push(node); |
|
nodeCount++ |
|
if (nodeCount >= nodeCountMax) break; |
|
} |
|
|
|
var i=1; |
|
dojo.lang.forEach(children, function(child) { |
|
var t = title+'.'+i; |
|
i++; |
|
|
|
// first node is always folder for tests |
|
if (nodeCount<nodeCountMax && ( |
|
depth==1 && child === children[0] || depth<5 && Math.random()>0.3 ) |
|
) { |
|
//dojo.debug("add child "+t); |
|
child.children = addChildren(t); |
|
} |
|
}); |
|
|
|
|
|
//dojo.debug("out "+nodeOrTree); |
|
|
|
depth--; |
|
|
|
return children; |
|
} |
|
|
|
controller = dojo.widget.createWidget("TreeBasicControllerV3"); |
|
dndcontroller = dojo.widget.createWidget("TreeDndControllerV3", { controller: controller }); |
|
disableWrap = dojo.widget.createWidget("TreeDisableWrapExtension"); |
|
|
|
dojo.profile.start("createTree"); |
|
tree = dojo.widget.createWidget("TreeV3", { |
|
listeners: [controller.widgetId,dndcontroller.widgetId,disableWrap.widgetId], |
|
DndAcceptTypes: "firstTree", |
|
widgetId: "firstTree", |
|
DndMode:"between;onto" |
|
}); |
|
dojo.profile.end("createTree"); |
|
|
|
document.body.appendChild(tree.domNode); |
|
|
|
|
|
dojo.profile.start("prepareNodes"); |
|
var nodes = addChildren('node ', tree); |
|
dojo.profile.end("prepareNodes"); |
|
|
|
dojo.profile.start("addNodes"); |
|
|
|
tree.setChildren(nodes); |
|
dojo.profile.end("addNodes"); |
|
|
|
dojo.debug("Nodes total: "+nodeCount); |
|
|
|
|
|
}); |
|
|
|
function expandAllStart() { |
|
dojo.profile.start("expandAll + timeouts"); |
|
} |
|
|
|
function expandAllEnd() { |
|
dojo.profile.end("expandAll + timeouts"); |
|
alert("expandAll finished"); |
|
} |
|
|
|
</script> |
|
</head> |
|
<body> |
|
|
|
<div style="display:none"> |
|
<!-- IE has a bug: it reloads all dynamically resolved images, no matter, is it |
|
new Image() or CSS background. If you don't specify images like that, |
|
it will reload them every time a node is expanded --> |
|
<img src="../../../src/widget/templates/images/TreeV3/i.gif"> |
|
<img src="../../../src/widget/templates/images/TreeV3/i_half.gif"> |
|
<img src="../../../src/widget/templates/images/TreeV3/expand_minus.gif"> |
|
<img src="../../../src/widget/templates/images/TreeV3/expand_plus.gif"> |
|
<img src="../../../src/widget/templates/images/TreeV3/expand_leaf.gif"> |
|
<img src="../../../src/widget/templates/images/TreeV3/i_long.gif"> |
|
<img src="../../../src/widget/templates/images/TreeV3/document.gif"> |
|
<img src="../../../src/widget/templates/images/TreeV3/open.gif"> |
|
<img src="../../../src/widget/templates/images/TreeV3/closed.gif"> |
|
</div> |
|
|
|
|
|
<h4>Test drag'n'drop & lazy creation & batch expand stuff</h4> |
|
|
|
<input type="button" value="Expand first node to level 2" onClick="controller.expandToLevel(tree.children[0],2)"/> |
|
<input type="button" value="Expand tree to level 2" onClick="controller.expandToLevel(tree,2)"/> |
|
<input type="button" value="Expand all with callback at finish" onClick="expandAllStart();controller.expandAll(tree,expandAllEnd)"/> |
|
<br/> |
|
<input type="button" value="Collapse all nodes" onClick="controller.collapseAll(tree)"/> |
|
<br/> |
|
<input type="button" value="Clone first node and append to tree" onClick="tree.addChild(tree.children[0].clone(true))"> |
|
<br/> |
|
|
|
<input type="button" value="dump profile" onClick="dojo.profile.dump(true)"> |
|
</body> |
|
</html>
|
|
|