Busy Class - Fuse Documentation

Jump to:
Table of Contents

Marks a UX node as busy.

There are several cases where we need to perform some background task, for instance fetching data over the network or performing some expensive computation. Busy can be used to coorindate this busy activity between JavaScript and UX.

We often want to be able to signal to our view (UX) that our data is not yet ready for display. Marking a node as busy will activate any WhileBusy triggers on it. This is the same mechanism used to indicate that an image is loading.

Examples

Loading data

We might wish to display a loading indicator while making an HTTP request.

<Panel>
    <WhileBusy>
        <Text Value="Loading..."/>
    </WhileBusy>
    <Busy IsActive="false" ux:Name="busy"/>
    <JavaScript>
        exports.startLoad = function() {
            busy.activate()
            fetch( "http://example.com/some/data" ).then( function(response) {
                //use the response
                busy.deactivate()
            }).catch(function(err) {
                //make sure to disable the busy status here as well
                busy.deactivate()
            })
        }
    </JavaScript>
    <Activated Handler="{startLoad}"/>
</Panel>

This example starts loading data when the page is activated. The Loading... text will be shown while it is loading, and removed once it is completed.

The Navigator waits for a busy page to finish preparing before navigating to it. We can use Busy to ensure our bindings our done before this happens.

<Page>
    <Busy Activity="Preparing" On="ParameterChanged" ux:Name="busy"/>
    <JavaScript>
        exports.name = Observable()
        this.Parameter.onValueChanged( module, function(v) {
            exports.name.value = v.name
            busy.deactivate()
        })
    </JavaScript>
    <Text Value="{name}"/>
</Page>

Location

Namespace: Fuse.Triggers
Package: Fuse.Triggers 2.9.1

Show Uno properties and methods

Interface of Busy

activate() js

Activates the busy task, setting the parent node as busy. If the busy task is already active then it remains active.

Activity : BusyTaskActivity ux

How the node will be marked as busy.

Busy Constructor uno

Creates a new Busy

deactivate() js

Deactivates the busy task.

IsActive : bool ux

Whether the Node is marked busy or not.

On : BusyOn ux

When this task is automatically activated.

Inherited from Node

Add(Binding) uno

Bindings : IList of Binding ux

The list of bindings belonging to this node.

ContextParent : Node uno

The context parent is the semantic parent of this node. It is where non-UI structure should be resolved, like looking for the DataContext, a Navigation, or other semantic item.

FindByType<T> : T uno

FindNodeByName(Selector, Predicate<Node> (Node)) : Node uno

Finds the first node with a given name that satisfies the given acceptor. The serach algorithm works as follows: Nodes in the subtree are matched first, then it matches the nodes in the subtrees ofthe ancestor nodes by turn all the way to the root. If no matching node is found, the function returns null.

GetNearestAncestorOfType<T> : T uno

Insert(int, Binding) uno

IsRootingCompleted : bool uno

Whether rooting for this node is completed. Returns false if unrooting has started.

IsRootingStarted : bool uno

Whether rooting of this node has started. Note that even if this property returns true, rooting may not yet be completed for the node. See also IsRootingCompleted.

Name : Selector ux

Run-time name of the node. This property is automatically set using the ux:Name attribute.

NextSibling<T> : T uno

Returns the next sibling node of the given type.

OnDataChanged(string, object) uno

OnRooted uno

If you override OnRooted you must call base.OnRooted() first in your derived class. No other processing should happen first, otherwise you might end up in an undefined state.