Add progress bar to AlertWindow()

[dnaldoog]

Here is a way of creating a progress bar within an AlertWindow using an embedded uiComponent

• Tested on Ctrlr 5.3.201 and CtrlrX 5.6.33

The secret seems to be you have to declare the uiComponent as in 1 or 2 below, but not 3 otherwise crashes on both Ctrlr and CtrlX

1 PBAR=panel:getModulatorByName("pbar"):getComponent() -- declared in init
2 panel:getModulatorByName("pbar"):getComponent()
3 mw:addCustomComponent(panel:getComponent("pbar"))

I haven't yet been able to get the AlertWindow method addProgressBarComponent working.

init = function(--[[ CtrlrInstance --]] type)
	 progPerc=0
	PBAR=panel:getModulatorByName("pbar"):getComponent()

end
--
-- Called when a component needs repainting
-- @comp
-- @g    http://ctrlr.org/api/class_ctrlr_lua_graphics.html
--              see also http://www.rawmaterialsoftware.com/juce/api/classGraphics.html
--

paintPbar = function(--[[ CtrlrComponent --]] comp --[[ CtrlrComponent --]], g)
    g:fillAll(Colour(0xffffcc00)) -- background colour
    local w, h = comp:getWidth(), comp:getHeight()
    g:setColour(Colour(0xff99ccff)) -- progress bar colour
    local r = Rectangle(0, 0, w * progress, h)
    g:fillRect(r)
    g:setColour(Colour(0xff000000)) -- font colour
    g:setFont(13)
    r = Rectangle(comp:getLocalBounds()) -- centre text in component
    g:drawText(string.format("%s%%", progPerc), r, Justification(Justification.centred), true)
end

--
-- Called when a mouse is down on this component
--

alert = function(--[[ CtrlrComponent --]] comp --[[ MouseEvent --]], event)
    mw = AlertWindow("BULK DATA DUMP SAVE", "Save INTERNAL or CARD data to file?", AlertWindow.QuestionIcon)
    mw:addButton("INTERNAL ", 1, KeyPress(KeyPress.returnKey), KeyPress())
    mw:addButton("CARD", 2, KeyPress(), KeyPress())
    mw:addButton("Cancel", 0, KeyPress(KeyPress.escapeKey), KeyPress())
   -- mw:addProgressBarComponent(bar) not working
    if PBAR ~= nil then
    mw:addCustomComponent(PBAR)
    end
    mw:setEscapeKeyCancels(true)
    local ret = mw:runModalLoop()
    if ret == 1 then
        -- mw:setVisible(false)
		progress=0
        timercounter = 0
        timer:setCallback(1, TimerCallback)
        timer:startTimer(1, 600)
    elseif ret == 2 then
        utils.warnWindow("OPTION2", "Not set to do anything")
        mw:setVisible(false)
    else
        mw:setVisible(false)
    end
    --mw:setVisible(false)
end

TimerCallback = function(timerId)
    if timerId == 1 then
        timercounter = timercounter + 1

        progress = round(timercounter / #t, 3)
        console(string.format("%f %d %d", progress, timercounter, #t))
        	progPerc=progress*100
		PBAR:repaint()
        mw:repaint()
        if timercounter >= #t then
            timer:stopTimer(timerId)
	    progPerc=0
            mw:setVisible(false)
        end
    end
end

function round(num, numDecimalPlaces) -- rounding function
    local mult = 10 ^ (numDecimalPlaces or 0)
    return math.floor(num * mult + 0.5) / mult
end --function

addProgressBar_4.zip

[dnaldoog]

Here is an example of uiSlider in an AlertWindow:

Slider in popup_2_0.zip

[dnaldoog]

Here is another way using uiSlider as linearBar to emulate a progressBar.

ProgressBar Simple_1.0.panel.zip

[damiensellier]

That's nice! I'll use it on a panel.

[oldgearguy]

I am using the Progress bar example in an Alert dialog. So far, it's working well. (My 2 buttons are Start and Cancel)
Now I'm trying to add additional error handling (like if it never gets to 100% or the user presses Escape in the middle of it).

When the Alert window is up, what is runModalLoop() actually doing? Just waiting for a user to press a button?
If you start and during the progress, the user presses Esc, the Alert Window goes away, but the background timer process seems to continue.

How can I in the middle of the timer loops look for a key press and decide what to do?

There are different ways to display the progress bar, but my core question is - in the middle of a long process is there any general key handling capabilities that we can access?

[dnaldoog]

I would create a variable like killtimer = false in the init on panel load and a uiButton that just sets it to true in a callback function. In the timer you would do something like:

if killtimer then
    killtimer = false -- reset
    timer:stopTimer(timerId)
end

I'm not sure about error handling for when it never gets to 100% - you would need some sort of time out detection.

It looks like I have got a few Demo panels here:

[oldgearguy]

lol - it seems you always have a few demo panels out there. I started with your 4th example from the list above. Got the core plugged in and running in less than 1/2 hr. The rest of the morning has been battling edge cases, error handling, and Lexicon.

I was thinking of using a global timer similar to what I'm doing if a user tries to connect to the PCM 80 and the MIDI isn't right. In that case, I start a timer, send the Sync check, and if I get synced, I cancel the timer, otherwise the timer goes off and I pop up a sync error message and have them go to the MIDI menu to correct it.

I could do something similar for my data collection case. Using some sysex in a way the Lexicon guys may not have intended means I have to handle some weird situations. So, using an overarching timer again during the data collection does seem like the best way to go about it.

The kill switch idea is a good one. It looks like once the AlertWindow modalLoop() thing returns a button press, it's just a display at that point. I could overlay the Cancel button with my own and hook it in as you suggest.

Things to think about.

[oldgearguy]

I keep forgetting ...

Even though I probably haven't created any new cool uses of CtrlrX, here's a couple quick videos showing what I've been working on. If you do see anything of interest, I'll try to create a @dnaldoog worthy demo of it.

https://www.youtube.com/watch?v=oRm7ZE67ghc
https://www.youtube.com/watch?v=D0xgSU6rvQc