How to update two widgets on some event

[kmiernik]

I can't figure how to update more than one widget on some event. A simplified model of my program is as follow:

• there are some plotted data
• user selects range with rangepicker
• plot is updated with vertical lines with positions according to rangepicker selection
• sum of data within the selected range is calculated and a textbox display this value

Here is working example. Problem is that observables in function map! are passed as values and cannot be changed within the function.

using Interact
using Blink
using GRUtils

function plot_data(limits, data_x, data_y, textsum)
    l = limits[1]
    r = limits[2]
    fig = Figure((640, 480), "pix")
    plot(data_x, data_y, "-o", markersize=0.2)
    hold(true)
    plot([l, l], [minimum(data_y)-1, maximum(data_y)+1], "r--",
        linewidth=2)
    plot([r, r], [minimum(data_y)-1, maximum(data_y)+1], "g--", 
        linewidth=2)
    ylim(0, maximum(data_y) + 1)
    s = sum(data_y[l+1:r-1])
    # How to update textsum?
    # textsum[] = string(s)
    fig
end

plt = Observable{Any}(dom"div"())
data_x = Observable{Any}(0:1000)
data_y = Observable{Any}(rand(0:100, length(data_x[])))

limits = rangepicker(0:1000)
textsum = textbox("")
throttle(1.0, limits)

map!(plot_data, plt, limits, data_x, data_y, textsum)

ui = dom"div"(plt, limits, textsum)
w = Window()
body!(w, ui)