ReactiveTools

Definition of variables

Stipple.ReactiveTools.@in - Macro
@in(expr)

Declares a reactive variable that is public and can be written to from the UI.

Usage

@app begin
    @in N = 0
end

Stipple.ReactiveTools.@out - Macro
@out(expr)

Declares a reactive variable that is public and readonly.

Usage

@app begin
    @out N = 0
end

Stipple.ReactiveTools.@private - Macro
@private(expr)

Declares a non-reactive variable that cannot be accessed by UI code.

Usage

@app begin
    @private N = 0
end

Handlers and events

Stipple.ReactiveTools.@onchange - Macro
@onchange(var, expr)

Declares a reactive update such that when a reactive variable changes expr is executed.

Usage

This macro watches a list of variables and defines a code block that is executed when the variables change.

@app begin
    # reactive variables taking their value from the UI
    @in N = 0
    @in M = 0
    @out result = 0
    # reactive code to be executed when N changes
    @onchange N M begin
        result = 10*N*M
    end
end

Stipple.ReactiveTools.@onbutton - Macro
@onbutton

Declares a reactive update that executes expr when a button is pressed in the UI.

Usage Define a click event listener with @click, and the handler with @onbutton.

@app begin
    @in press = false
    @onbutton press begin
        println("Button presed!")
    end
end

ui() = btn("Press me", @click(:press))

@page("/", ui)

Stipple.ReactiveTools.@event - Macro
@event(event, expr)

Executes the code in expr when a specific event is triggered by a UI component.

Usage

Define an event trigger such as a click, keypress or file upload for a component using the @on macro. Then, define the handler for the event with @event.

Examples

Keypress:

@app begin
    @event :keypress begin
        println("The Enter key has been pressed")
    end
end

ui() =  textfield(class = "q-my-md", "Input", :input, hint = "Please enter some words", @on("keyup.enter", :keypress))

@page("/", ui)

=======

<q-input hint="Please enter some words" v-on:keyup.enter="function(event) { handle_event(event, 'keypress') }" label="Input" v-model="input" class="q-my-md"></q-input>

File upload:

@app begin
    @event :uploaded begin
        println("Files have been uploaded!")
    end
end

ui() = uploader("Upload files", url = "/upload" , method="POST", @on(:uploaded, :uploaded), autoupload=true)

route("/upload", method=POST) do
    # process uploaded files
end

@page("/", ui)
julia> print(ui())
<q-uploader url="/upload" method="POST" auto-upload v-on:uploaded="function(event) { handle_event(event, 'uploaded') }">Upload files</q-uploader>

Missing docstring for @notify.

App handling

Missing docstring for @init.
Stipple.ReactiveTools.@app - Macro
@app(expr)

Sets up and enables the reactive variables and code provided in the expression expr.

Usage

The code block passed to @app implements the app's logic, handling the states of the UI components and the code that is executed when these states are altered.

@app begin
   # reactive variables
   @in N = 0
   @out result = 0
   # reactive code to be executed when N changes
   @onchange N begin
     result = 10*N
   end
end

Missing docstring for @appname.
Stipple.ReactiveTools.@clear - Macro
@clear

Deletes all reactive variables and code in a model.


Stipple.ReactiveTools.@clear_vars - Macro
@clear_vars

Deletes all reactive variables in a model.


Stipple.ReactiveTools.@clear_handlers - Macro
@clear_handlers

Deletes all reactive code handlers in a model.


Stipple.ReactiveTools.@page - Macro
@page(url, view)

Registers a new page with source in view to be rendered at the route url.

Usage

@page("/", "view.html")

Table of Contents