<html>
<head>
<title>Dojo Toolkit - ProgressBar test</title>
<meta http-equiv="content-type"
content="text/html; charset=ISO-8859-1">
<style type="text/css">
@import url("style/main.css");
</style>
<script type="text/javascript">
var djConfig = {isDebug: true, debugAtAllCosts: false};
</script>
<script type="text/javascript" src="../../dojo.js">
</script>
<script type="text/javascript">
dojo.require("dojo.widget.ProgressBar");
dojo.require("dojo.io.*");
dojo.require("dojo.io.IframeIO");
</script>
<script type="text/javascript">
dojo.addOnLoad(go);
function go(){
var theBar = dojo.widget.byId("testBar");
dojo.event.connect(dojo.byId("start"), "onclick", dojo.lang.hitch(theBar,theBar.startAnimation));
dojo.event.connect(dojo.byId("stop"), "onclick", dojo.lang.hitch(theBar,theBar.stopAnimation));
dojo.byId("test").value="";
dojo.byId("progressValue").focus();
dojo.byId("progressValue").value = dojo.widget.byId("setTestBar").getProgressValue();
dojo.byId("maxProgressValue").value = dojo.widget.byId("setTestBar").getMaxProgressValue();
dojo.event.connect(dojo.byId("test"), "onkeyup", keyUpHandler);
dojo.event.connect(dojo.byId("set"), "onclick", setParameters);
// loadFile();
}
function loadFile(){
var bArgs = {
url: "http://armadillo:8080/Dojotoolkit/trunk/tests/widget/grossofile.txt",
mimetype: "text/plain",
method: "POST",
handle: function(type, data, evt){
var str="";
// for (var i in data){
// str+=i + " ---> " + data[i]+"\n";
// }
window.alert(type);
}
}
dojo.io.bind(bArgs);
}
function setParameters(){
dojo.widget.byId("setTestBar").setMaxProgressValue(dojo.byId("maxProgressValue").value, true);
dojo.widget.byId("setTestBar").setProgressValue(dojo.byId("progressValue").value, true);
dojo.widget.byId("setTestBar").render();
}
function keyUpHandler(){
dojo.widget.byId("testBar").setProgressValue(dojo.byId("test").value.length);
dojo.widget.byId("testBarInt").setProgressValue(dojo.byId("test").value.length);
dojo.widget.byId("testBar2").setProgressValue(dojo.byId("test").value.length);
dojo.widget.byId("smallTestBar").setProgressValue(dojo.byId("test").value.length);
}
</script>
</head>
<body>
<h3>Test 1</h3>
Progress Value <input type="text" name="progressValue" id="progressValue" />
<br />
Max Progress Value <input type="text" name="maxProgressValue" id="maxProgressValue" />
<br />
<input type="button" name="set" id="set" value="set!" />
<br />
<div width="400" hasText="true"
maxProgressValue="200" id="setTestBar" progressValue="20" dojoType="ProgressBar"></div>
<br />
<br />
<h3>Test 2</h3>
Write here: <input type="text" value="" name="test" maxlength="256" id="test" style="width:300"/>
<br />
<br />
<div width="400" hasText="true"
maxProgressValue="256" id="testBar" duration="2000" dojoType="ProgressBar"></div>
<input type="button" name="start" id="start" value="start" />
<input type="button" name="stop" id="stop" value="stop" />
<br />
Small, without text and background image:
<br />
<div width="440" height="10" frontBarClass="simpleFrontBar" hasText="false" isVertical="false"
maxProgressValue="256" id="smallTestBar" dojoType="ProgressBar"></div>
<br />
Only Integer values:
<div showOnlyIntegers="true" width="400" hasText="true" isVertical="false"
maxProgressValue="256" id="testBarInt" dojoType="ProgressBar"></div>
<br />
<div style="position:absolute;top:70px;left:530px">
Vertical:
<div progressValue="0" height="420" frontBarClass="h-frontBar" width="50" hasText="true" isVertical="true"
maxProgressValue="256" id="testBar2" dojoType="ProgressBar"></div>
</div>
</body>
</html>