If you are developing with WSPBuilder and have started a project with a workflow do yourself a big favor.
Edit your .csproj file and add an import statement for the workflow foundation. Find the following line in a C# project or the vb equivalent "<Import Project=”$(MSBuildBinPath)\Microsoft.CSharp.targets” />" and add this line after it.
<Import Project=”$(MSBuildExtensionsPath)\Microsoft\Windows Workflow Foundation\v3.0\Workflow.Targets” />
At a minimum it will allow you to use declarative conditions. If you don't add this you'll have to use code conditions in your while loops.
Monday, December 28, 2009
Wednesday, December 16, 2009
Gears Turning - Javascript setTimeout
A common challenge is to present the user with a progress bar or animated gif during a long running script. Sounds really easy, before the long running script set the style of an animated gif from none to inline and start the script. We all know what happens next, a frozen gif. The best way to get around this is to use the setTimeout function to allow the browser to return and let the gif move. The example below uses setTimeout to set up a recursive call to give us the needed user feedback.
To try out the sample add a CEWP to a webpart page and paste the included script. If you don't have a SharePoint site, add the script to a html page and get an animated gif here.
To try out the sample add a CEWP to a webpart page and paste the included script. If you don't have a SharePoint site, add the script to a html page and get an animated gif here.
<div id="gears" style="display:none">
<img src="/_layouts/IMAGES/GEARS_AN.GIF"></img></br></br>
</div>
<div id="done" style="display:none">
<span>Long Running Done</span></br></br>
</div>
<input type="button" value="Start Long Process" onclick="longRunning()"></input>
<script type="text/javascript">
var i, length, data
length = 1500;
data = [];
//random numbers to sort
for (i = 0; i < length; i++) {
data[i] = Math.floor(Math.random() * length);
}
function sort () {
i = 0;
function inner() {
var j, value;
//do the sorting
for (j = length; j > i; j--) {
if (data[j] < data[j - 1]) {
value = data[j];
data[j] = data[j - 1];
data[j - 1] = value;
}
}
i++;
//let the browser "breath" so the gears will turn
if (i < length) {
//to see the browser freeze swap these
setTimeout(function(){inner();},0);
//inner();
}
else{
//done hide the gears
document.getElementById("gears").style.display = "none";
document.getElementById("done").style.display = "block";
}
};
inner();
}
function longRunning(){
//show gears
document.getElementById("gears").style.display = "block";
//call the long running process
setTimeout(function(){sort();},2000);
}
</script>
<img src="/_layouts/IMAGES/GEARS_AN.GIF"></img></br></br>
</div>
<div id="done" style="display:none">
<span>Long Running Done</span></br></br>
</div>
<input type="button" value="Start Long Process" onclick="longRunning()"></input>
<script type="text/javascript">
var i, length, data
length = 1500;
data = [];
//random numbers to sort
for (i = 0; i < length; i++) {
data[i] = Math.floor(Math.random() * length);
}
function sort () {
i = 0;
function inner() {
var j, value;
//do the sorting
for (j = length; j > i; j--) {
if (data[j] < data[j - 1]) {
value = data[j];
data[j] = data[j - 1];
data[j - 1] = value;
}
}
i++;
//let the browser "breath" so the gears will turn
if (i < length) {
//to see the browser freeze swap these
setTimeout(function(){inner();},0);
//inner();
}
else{
//done hide the gears
document.getElementById("gears").style.display = "none";
document.getElementById("done").style.display = "block";
}
};
inner();
}
function longRunning(){
//show gears
document.getElementById("gears").style.display = "block";
//call the long running process
setTimeout(function(){sort();},2000);
}
</script>
Labels:
Javascript Recursion Gears IE
Subscribe to:
Posts (Atom)