Anyone who is interested, pls, find below our Busy Indicator Spinner implementation for CSHTML5 based on http://spin.js.org/ (pure javascript) code:
Code: Select all
// Class properties:
object csharpObject_targetForBusyIndicator = null; //e.g. <TextBlock Text=" " x:Name="busyIndikator" /> // it will host busy indicator as a parent of spinner child. Note: you should use another XAML control as well (not only TextBlock).
object csharpObjectBusyIndicator = null;
int DelayAfterCallBusySpinner = 50; // e.g. 15 - 100ms, you need it to give some time for spinner to spin-up because of single threaded nature of javascript.
// Initialization somewhere under appropriate method, e.g. at Page_Loaded()
await CSHTML5.Interop.LoadJavaScriptFile("ms-appx:///yourNamespace/javascripts/spin.js"); // create a 'javascripts' folder under your project and add spin.js to it. note: you should use spin.min.js and modify the code accordingly. Download the JS file from http://spin.js.org/
csharpObject_targetForBusyIndicator = CSHTML5.Interop.GetDiv(busyIndikator);
// Start busy indicator -spinning:
csharpObjectBusyIndicator = CSHTML5.Interop.ExecuteJavaScript(
@"new Spinner({color:'#000', lines: 10, fps: 20, hwaccel: true}).spin()"); // for full parameter list, check the http://spin.js.org
CSHTML5.Interop.ExecuteJavaScriptAsync(@"$0.appendChild($1.el)",
csharpObject_targetForBusyIndicator, csharpObjectBusyIndicator);
// Stop busy indicator:
CSHTML5.Interop.ExecuteJavaScriptAsync(@"$0.stop()", csharpObjectBusyIndicator);
// small but very important note on usage: under async method when you start spinner give some time to spinner to spin up call the following line immediately AFTER busy indicator started:
await Task.Delay(DelayAfterCallBusySpinner); // e.g. 50ms
// it needed if you do something like a WCF server call after starting busy indicator -which is the normal case
I hope it help others,
Best Regards,
Péter