WaitCursor: Difference between revisions

From NSB App Studio
Jump to navigation Jump to search
No edit summary
 
(4 intermediate revisions by the same user not shown)
Line 1: Line 1:
WaitCursor true|'''false'''|cursorStyle|filename
WaitCursor true|'''false'''|cursorStyle|filename<br>
NSB.WaitCursor(true|'''false'''|cursorStyle|filename)


[[File:Ajax-loader.gif]]
[[File:Ajax-loader.gif]]
Line 16: Line 17:
</pre>
</pre>


== Example (Basic) ==
The Waitcursor will only take effect when your app pauses processing. If you set it just before a hard loop or a synchronous [[Ajax]] call, it will not be invoked until that operation finishes. Use [[SetTimeout|SetTimeout]] to start the hard loop or asynchronous Ajax.


<pre>
== Example ==
Rem WaitCursor Example
WaitCursor True
</pre>
Show WaitCursor while processing
<pre>
Rem Show WaitCursor while processing
WaitCursor True
SetTimeout(myCalculation,0)


Sub myCalculation()
<tabber>
  For i=1 To 500000
JavaScript=
  Next
<syntaxhighlight lang="JavaScript">
  WaitCursor False
// Simple Waitcursor
End Sub
Button1.onclick = function() {
    NSB.WaitCursor(true);
    Button1.disabled = true;
    Button2.disabled = false;
};


</pre>
Button2.onclick = function() {
    NSB.WaitCursor(false);
    Button1.disabled = false;
    Button2.disabled = true;
};


== Example (JavaScript) ==
<pre>
// Cursor Example with Delay
// Cursor Example with Delay


Line 77: Line 76:
preProcessing(); //this runs all code prior to the delay
preProcessing(); //this runs all code prior to the delay
NSB.Print("This line ignores the delay also");
NSB.Print("This line ignores the delay also");
</syntaxhighlight>
|-|
BASIC=
<syntaxhighlight lang="vb.net">
Rem WaitCursor Example
WaitCursor True


</pre>
'Show WaitCursor while processing
 
Rem Show WaitCursor while processing
WaitCursor True
SetTimeout(myCalculation,0)
 
Sub myCalculation()
  For i=1 To 500000
  Next
  WaitCursor False
End Sub</syntaxhighlight>
</tabber>


== Output ==
== Output ==

Latest revision as of 17:41, 3 April 2020

WaitCursor true|false|cursorStyle|filename
NSB.WaitCursor(true|false|cursorStyle|filename)

Description

Set WaitCursor to true to display a wait cursor. The design of the cursor depends on the browser and whether you are running on a mobile device. Set it to false to turn the WaitCursor off again. The WaitCursor state will change when your app goes into an inactive state. It will not change while your app is processing.

If you are running on a non-touchscreen device, a number of cursorStyles are built in. They are: alias, all-scroll, auto, cell, context-menu, col-resize, copy, crosshair, default, e-resize, ew-resize, help, move, n-resize, ne-resize, nesw-resize, ns-resize, nw-resize, nwse-resize, no-drop, none, not-allowed, pointer, progress, row-resize, s-resize, se-resize, sw-resize, text, URL, vertical-text, w-resize, wait, zoom-in, zoom-out, initial, inherit. Call WaitCursor False to hide it again.

You can also give the name of a gif file. You can create your own custom WaitCursors at http://www.ajaxload.info. Remember to also add the name of the file to the manifest. If you give a name, it will display on both touch and non touchscreen devices. Call WaitCursor False to hide it again.

The default wait cursor is a file named ajax-loader.gif. If you are using any jQuery Mobile controls, it is added to your manifest by default. If you are not using jQuery Mobile, add this line to 'manifest' in Project Properties:

nsb/images/ajax-loader.gif

The Waitcursor will only take effect when your app pauses processing. If you set it just before a hard loop or a synchronous Ajax call, it will not be invoked until that operation finishes. Use SetTimeout to start the hard loop or asynchronous Ajax.

Example

// Simple Waitcursor
Button1.onclick = function() {
    NSB.WaitCursor(true);
    Button1.disabled = true;
    Button2.disabled = false;
};

Button2.onclick = function() {
    NSB.WaitCursor(false);
    Button1.disabled = false;
    Button2.disabled = true;
};

// Cursor Example with Delay

sleep=function(ms) {
  //used for delay to avoid loop that uses up CPU
  var caller = sleep.caller;
  if (caller.sleepTimer) { 
    delete caller.sleepTimer;
    return true;
  }
  caller.sleepTimer = window.setTimeout (function () {
    caller.apply ([]);
  },ms);
  return false;
}

delayPostProcessing=function(ms) {
  /* if you need a delayed response, put all post processing in this function
   * anything outside this function will execute prior to the delay even if it
   * comes after calling this function */

  document.body.style.cursor = 'wait'; //busy style cursor during delay
  NSB.Print("Cursor changed to busy");
  if (!sleep (ms)) return;
  document.body.style.cursor = ''; //normal cursor
  NSB.Print("Cursor restored to normal");
  NSB.Print("Continue processing inside the wrapper after delay");
  NSB.Print("... and continue processing inside the wrapper");
}

preProcessing=function() {
  //do your pre-processing before delay here
  var delayMS=5000; //5000 ms equates to 5 seconds
  NSB.Print("After processing this line, cause delay of " + (delayMS/1000).toString() + " seconds");
  delayPostProcessing(delayMS); //force delay now
  NSB.Print("This line ignores the delay");
}

preProcessing(); //this runs all code prior to the delay
NSB.Print("This line ignores the delay also");

Rem WaitCursor Example
WaitCursor True

'Show WaitCursor while processing

Rem Show WaitCursor while processing
WaitCursor True
SetTimeout(myCalculation,0)

Sub myCalculation()
  For i=1 To 500000
  Next
  WaitCursor False
End Sub

Output