<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>FisheyeList Widget Demo</title>
<script type="text/javascript">
var djConfig = {
isDebug: true,
baseScriptUri: "../../",
forceXDomain: true,
xdWaitSeconds: 10
};
</script>
<script type="text/javascript" src="http://tagneto.org/dojo/xd/dojo.js"></script>
<script language="JavaScript" type="text/javascript">
dojo.registerModulePath("dojo", "http://tagneto.org/dojo/xd/src");
dojo.registerModulePath("dojo.widget", "src/widget");
dojo.require("dojo.widget.FisheyeList");
</script>
</head>
<body style="padding-left: 150px;">
<h1>Mixed XDomain and Local XHR Test Page</h1>
<p>
This test should succeed. It tests loading via xdomain,
but dojo.widget.* should be loaded locally. The fisheye widget should load successfully.
</p>
<p><b>IMPORTANT:</b> Change the domain name in the source of this file
to be the domain name that you want to test. You can change the paths too.
In this file /dojo/xd refers to a dojo installation that has run the xdgen
build command to build cross-domain compatible packages.
<p>HTML before</p>
<p>HTML before</p>
<p>HTML before</p>
<p>Liberal trigger: move the mouse anywhere near the menu and it will start to expand:</p>
<div dojoType="FisheyeList"
itemWidth="40" itemHeight="40"
itemMaxWidth="150" itemMaxHeight="150"
orientation="horizontal"
effectUnits="2"
itemPadding="10"
attachEdge="center"
labelEdge="bottom"
>
<div dojoType="FisheyeListItem"
id="item1"
onclick="alert('click on' + this.caption + '(from widget id ' + this.widgetId + ')!');"
caption="Item 1"
iconsrc="images/fisheye_1.png">
</div>
<div dojoType="FisheyeListItem"
caption="Item 2"
iconsrc="images/fisheye_2.png">
</div>
<div dojoType="FisheyeListItem"
caption="Item 3"
iconsrc="images/fisheye_3.png">
</div>
<div dojoType="FisheyeListItem"
iconsrc="images/fisheye_4.png">
</div>
<div dojoType="FisheyeListItem"
caption="Really Long Item Label"
iconsrc="images/fisheye_3.png">
</div>
<div dojoType="FisheyeListItem"
iconsrc="images/fisheye_2.png">
</div>
<div dojoType="FisheyeListItem"
iconsrc="images/fisheye_1.png">
</div>
</div>
<p>HTML after</p>
<p>HTML after</p>
<p>HTML after</p>
<p>This was has strict triggering, so you actually have to mouse over the menu to make it start moving:</p>
<div dojoType="FisheyeList"
itemWidth="40" itemHeight="40"
itemMaxWidth="150" itemMaxHeight="150"
orientation="horizontal"
effectUnits="2"
itemPadding="10"
attachEdge="center"
labelEdge="bottom"
conservativeTrigger="true"
>
<div dojoType="FisheyeListItem"
id="item1b"
onclick="alert('click on' + this.caption + '(from widget id ' + this.widgetId + ')!');"
caption="Item 1"
iconsrc="images/fisheye_1.png">
</div>
<div dojoType="FisheyeListItem"
caption="Item 2"
iconsrc="images/fisheye_2.png">
</div>
<div dojoType="FisheyeListItem"
caption="Item 3"
iconsrc="images/fisheye_3.png">
</div>
<div dojoType="FisheyeListItem"
iconsrc="images/fisheye_4.png">
</div>
<div dojoType="FisheyeListItem"
caption="Really Long Item Label"
iconsrc="images/fisheye_3.png">
</div>
<div dojoType="FisheyeListItem"
iconsrc="images/fisheye_2.png">
</div>
<div dojoType="FisheyeListItem"
iconsrc="images/fisheye_1.png">
</div>
</div>
</body>
</html>