layout + checks on callback!

Author: waralex

README.md

@@ -12,10 +12,10 @@ import Pkg; Pkg.add("Dash")
 ### Basic application
 
 ```jldoctest
-julia> import HTTP
 julia> using Dash
-julia> app = dash("Test app", external_stylesheets = ["https://codepen.io/chriddyp/pen/bWLwgP.css"]) do
-    html_div() do
+julia> app = dash("Test app", external_stylesheets = ["https://codepen.io/chriddyp/pen/bWLwgP.css"])
+ 
+julia> app.layout = html_div() do
         html_h1("Hello Dash"),
         html_div("Dash.jl: Julia interface for Dash"),
         dcc_graph(
@@ -29,9 +29,7 @@ julia> app = dash("Test app", external_stylesheets = ["https://codepen.io/chridd
             )
         )
     end
-end
-julia> handler = make_handler(app, debug = true)
-julia> HTTP.serve(handler, HTTP.Sockets.localhost, 8080)
+julia> run_server(app, "0.0.0.0", 8080)
 ```
 * The `DashApp` struct represent dashboard application.
 * To make `DashApp` struct use `dash(layout_maker::Function, name::String;  external_stylesheets::Vector{String} = Vector{String}(), url_base_pathname="/", assets_folder::String = "assets")`` where `layout_maker` is a function with signature ()::Component
@@ -47,19 +45,20 @@ __Once you have run the code to create the Dashboard, go to `http://127.0.0.1:80
 
 ### Basic Callback
 ```jldoctest
-julia> import HTTP
+
 julia> using Dash
-julia> app = dash("Test app", external_stylesheets = ["https://codepen.io/chriddyp/pen/bWLwgP.css"]) do
-    html_div() do
+julia> app = dash("Test app", external_stylesheets = ["https://codepen.io/chriddyp/pen/bWLwgP.css"])
+
+julia> app.layout = html_div() do
         dcc_input(id = "my-id", value="initial value", type = "text"),
         html_div(id = "my-div")        
     end
-end
+
 julia> callback!(app, callid"my-id.value => my-div.children") do input_value
     "You've entered $(input_value)"
 end
-julia> handler = make_handler(app, debug = true)
-julia> HTTP.serve(handler, HTTP.Sockets.localhost, 8080)
+julia> run_server(app, "0.0.0.0", 8080)
+
 ```
 * You can make your dashboard interactive by register callbacks for changes in frontend with function ``callback!(func::Function, app::Dash, id::CallbackId)``
 * Inputs and outputs (and states, see below) of callback are described by struct `CallbackId` which can easily created by string macro `callid""`
@@ -68,21 +67,20 @@ julia> HTTP.serve(handler, HTTP.Sockets.localhost, 8080)
 
 ### States and Multiple Outputs
 ```jldoctest
-julia> import HTTP
 julia> using Dash
-julia> app = dash("Test app", external_stylesheets = ["https://codepen.io/chriddyp/pen/bWLwgP.css"]) do
-    html_div() do
+julia> app = dash("Test app", external_stylesheets = ["https://codepen.io/chriddyp/pen/bWLwgP.css"])
+ 
+julia> app.layout = html_div() do
         dcc_input(id = "my-id", value="initial value", type = "text"),
         html_div(id = "my-div"),
         html_div(id = "my-div2")        
     end
-end
+
 julia> callback!(app, callid"{my-id.type} my-id.value => my-div.children, my-div2.children") do state_value, input_value
     "You've entered $(input_value) in input with type $(state_value)",
     "You've entered $(input_value)"
 end
-julia> handler = make_handler(app, debug = true)
-julia> HTTP.serve(handler, HTTP.Sockets.localhost, 8080)
+julia> run_server(app, "0.0.0.0", 8080)
 ```
 * For multiple output callback must return any collection with element for each output
 
@@ -115,11 +113,12 @@ app.layout = html.Div(children=[....])
 
 * Dash.jl:
 ```julia
-app = dash("Test", external_stylesheets=external_stylesheets) do
-   html_div() do
+app = dash("Test", external_stylesheets=external_stylesheets) 
+
+app.layout = html_div() do
     ......
    end
-end
+
 ```
 ### callbacks:
 * python:

src/Dash.jl

@@ -27,7 +27,7 @@ Julia backend for [Plotly Dash](https://github.com/plotly/dash)
 
 # Examples
 ```julia
-import HTTP
+
 using Dash
 app = dash("Test", external_stylesheets=["https://codepen.io/chriddyp/pen/bWLwgP.css"]) do
     html_div() do
@@ -55,7 +55,7 @@ callback!(app, callid"graphTitle.value => graph.figure") do value
     )
 end
 handle = make_handler(app, debug = true)
-HTTP.serve(handle, HTTP.Sockets.localhost, 8080)
+run_server(handle, HTTP.Sockets.localhost, 8080)
 ```
 
 # Available components

src/app.jl

@@ -3,9 +3,9 @@ const IdProp = Tuple{Symbol, Symbol}
 struct CallbackId
     state ::Vector{IdProp}
     input ::Vector{IdProp}
-    output ::Vector{IdProp}
-    
+    output ::Vector{IdProp}    
 end
+
 CallbackId(;input ::Union{Vector{IdProp}, IdProp},
             output ::Union{Vector{IdProp}, IdProp},
             state ::Union{Vector{IdProp}, IdProp} = Vector{IdProp}()
@@ -68,14 +68,14 @@ function layout!(app::DashApp, component::Component)
     Components.collect_with_ids!(app.layout, app.callable_components)
 end
 
-get_layout(app::DashApp) = Base.getfield(app, :layout).component
+getlayout(app::DashApp) = Base.getfield(app, :layout).component
 
 function Base.setproperty!(app::DashApp, name::Symbol, value)
     name == :layout ? layout!(app, value) : Base.setfield!(app, name, value)
 end
 
 function Base.getproperty(app::DashApp, name::Symbol)
-    name == :layout ? get_layout(app) : Base.getfield(app, name)
+    name == :layout ? getlayout(app) : Base.getfield(app, name)
 end
 
 
@@ -210,6 +210,23 @@ end
 
 """
 function callback!(func::Function, app::DashApp, id::CallbackId; pass_changed_props = false)    
+    
+    check_callback(func, app, id, pass_changed_props)
+    
+    out_symbol = Symbol(output_string(id))
+        
+    push!(app.callbacks, out_symbol => Callback(func, id, pass_changed_props))
+end
+
+
+function check_callback(func::Function, app::DashApp, id::CallbackId, pass_changed_props)
+
+    
+
+    isempty(id.input) && error("The callback method requires that one or more properly formatted inputs are passed.")
+
+    length(id.output) != length(unique(id.output)) && error("One or more callback outputs have been duplicated; please confirm that all outputs are unique.")
+
     for out in id.output
         if any(x->out in x.id.output, values(app.callbacks))
             error("output \"$(out)\" already registered")
@@ -219,8 +236,13 @@ function callback!(func::Function, app::DashApp, id::CallbackId; pass_changed_pr
     foreach(x->check_idprop(app,x), id.state)
     foreach(x->check_idprop(app,x), id.input)
     foreach(x->check_idprop(app,x), id.output)
-    
-    out_symbol = Symbol(output_string(id))
-        
-    push!(app.callbacks, out_symbol => Callback(func, id, pass_changed_props))
+
+    args_count = length(id.state) + length(id.input)
+    pass_changed_props && (args_count+=1)
+
+    !hasmethod(func, NTuple{args_count, Any}) && error("Callback function don't have method with proper arguments")
+
+    for id_prop in id.input
+        id_prop in id.output && error("Circular input and output arguments were found. Please verify that callback outputs are not also input arguments.")
+    end
 end

test/core.jl

@@ -163,6 +163,30 @@ end
         return "v_$(value)"
     end
 
+    @test_throws ErrorException callback!(app, callid"{my-id.value} my-id.value => my-id.value") do value
+        return "v_$(value)"
+    end
+
+    @test_throws ErrorException callback!(app, callid"my-div.children, my-id.value => my-id.value") do value
+        return "v_$(value)"
+    end
+    @test_throws ErrorException callback!(app, callid"my-id.value => my-div.children, my-id.value") do value
+        return "v_$(value)"
+    end
+
+    @test_throws ErrorException callback!(app, callid" => my-div2.title, my-id.value") do value
+        return "v_$(value)"
+    end
+
+    @test_throws ErrorException callback!(app, callid"my-id.value => my-div2.title, my-div2.title") do value
+        return "v_$(value)"
+    end
+
+    @test_throws ErrorException callback!(app, callid"my-id.value => my-div2.title") do 
+        return "v_"
+    end
+    
+
     app = dash("Test app") do
         html_div() do
             dcc_input(id = "my-id", value="initial value", type = "text"),

test/dev.jl

@@ -96,5 +96,5 @@ callback!(app, callid"""basic-interactions.relayoutData => relayout-data.childre
     pretty_json(relayout_data)
 end
 
-run_server(app)
+run_server(app, "0.0.0.0", 8080; debug=true)
 end