dojox
Version:
Dojo eXtensions, a rollup of many useful sub-projects and varying states of maturity – from very stable and robust, to alpha and experimental. See individual projects contain README files for details.
188 lines (171 loc) • 5.86 kB
HTML
<html>
<head>
<title>Drop Indicator place test</title>
<script type="text/javascript" src="../../../../../dojo/dojo.js" data-dojo-config="isDebug: true, parseOnLoad: true"></script>
<script type="text/javascript">
dojo.require("doh.runner");
dojo.require("dojo.parser");
dojo.require("dojox.mdnd.AreaManager");
dojo.require("dojox.mdnd.DropIndicator");
dojo.require("dojox.mdnd.dropMode.VerticalDropMode");
dojo.addOnLoad(function(){
var size = {'w':100,'h':100};
var mgr = dojox.mdnd.AreaManager.areaManager();
var dropIndicator = mgr._dropIndicator;
mgr.areaClass = "dndArea";
mgr.dragHandleClass="dragHandle";
mgr.registerByClass();
var area1, area2, area3,item;
area1 = dojo.byId("area1");
area2 = dojo.byId("area2");
item = dojo.byId("item1");
doh.register("DropIndicatorPlace",
[
{
// Test to place drop indicator into area 1
// with no node references. In this case the drop
// indicator is displayed at the end of the area
name:"TestPlaceDropIndicatorNoPlace",
runTest: function(t){
var diNode = dropIndicator.place(area1,null,size);
// retrieve drop indicator which must be at the end
var node = area1.getElementsByTagName("div")[4];
//check that DropIndicator is at good position
doh.assertEqual(diNode,node);
doh.assertEqual("dropIndicator",node.className);
//check content node size
doh.assertEqual(100,dojo.contentBox(node).h);
}
},
{ /**
* Test to place drop indicator into area 1
* with place0 node reference. In this case the drop
* indicator is displayed at the begenning
*
*/
name:"TestPlaceDropIndicatorPlace0",
runTest: function(t){
var place0 = dojo.byId("place0");
var diNode = dropIndicator.place(area1,place0,size);
// retrieve drop indicator which must be at the first position
var node = area1.getElementsByTagName("div")[0];
//check that DropIndicator is present
doh.assertEqual(diNode,node);
doh.assertEqual("dropIndicator",node.className);
//check node size
doh.assertEqual(100,dojo.contentBox(node).h);
}
},
{ /**
* Test to place drop indicator into area 1
* with place2 node reference. In this case the drop
* indicator is displayed at the begenning
*
*/
name:"TestPlaceDropIndicatorPlace2",
runTest: function(t){
var place0 = dojo.byId("place2");
var diNode = dropIndicator.place(area1,place0,size);
// retrieve drop indicator which must be at the first position
var node = area1.getElementsByTagName("div")[2];
//check that DropIndicator is present
doh.assertEqual(diNode,node);
doh.assertEqual("dropIndicator",node.className);
//check node size
doh.assertEqual(100,dojo.contentBox(node).h);
}
},
{ /**
* Test to place drop indicator into area 1
* with bad node reference (using item). In this case the drop
* indicator is displayed at the begenning
*
*/
name:"TestPlaceDropIndicatorNoPlace",
runTest: function(t){
var a1BeginSize = area1.getElementsByTagName("div").length;
var a2BeginSize = area2.getElementsByTagName("div").length;
var diNode = dropIndicator.place(area1,item,size);
// get elements number after placement
var a1EndSize = area1.getElementsByTagName("div").length;
var a2EndSize = area2.getElementsByTagName("div").length;
//check that none child added to the 2 areas and diNode is null
doh.assertEqual(null,diNode);
doh.assertEqual(a1BeginSize, a1EndSize);
doh.assertEqual(a2BeginSize, a2EndSize);
}
},
{ /**
* Test removing dropIndicator
*/
name:"TestRemoveDropIndicator",
runTest: function(t){
var listDropIndicator = dojo.query(".dropIndicator");
// check that there's only one dromIndicator
doh.assertEqual(1,listDropIndicator.length);
// remove the drop indicator
dropIndicator.remove();
// check that there's none drop indicator
listDropIndicator = dojo.query(".dropIndicator");
doh.assertEqual(0,listDropIndicator.length);
}
},
{ /**
* Test removing dropIndicator that is not present in the document
*/
name:"TestRemoveDropIndicatorNonExisting",
runTest: function(t){
var listDropIndicator = dojo.query(".dropIndicator");
// check that there's no drop indicator present
doh.assertEqual(0,listDropIndicator.length);
// remove the drop indicator
dropIndicator.remove();
// check that there's none drop indicator present
listDropIndicator = dojo.query(".dropIndicator");
doh.assertEqual(0,listDropIndicator.length);
}
}
]
);
doh.run();
});
//--------------------------------------
</script>
<style type="text/css">
.area{
position:absolute;
top:10px;
border:5px solid #AAA;
background-color:#DDD;
margin:0;
padding:0;
}
#area1{
left:10px;
width : 300px;
}
#area2{
left:330px;
width : 100px;
height:300px;
}
.placeNode{
width:100%;
height:75px;
}
</style>
</head>
<body class="orange">
<div id="area2" class="dndArea area">
<div style="background-color:white" id="item1">tested item</div>
</div>
<div id="area1" class="dndArea area">
<div id="place0" class="placeNode"></div>
<div id="place1" class="placeNode"></div>
<div id="place2" class="placeNode"></div>
<div id="place3" class="placeNode"></div>
</div>
</body>
</html>