Refresh buttons of a dialog confirm

[ffd8]

Curious if it's possible to only redraw/refresh the buttons of a dialog confirm box? The dialog consists of two states of buttons:

initially CLOSE ► RUN

if they press ► RUN, the buttons should become CLOSE ◼ STOP ► RE-RUN

Previously I was closing the dialog whenever ◼ STOP or ► RUN were pressed, so the next time the dialog box was opened, one would see the change... however it would be ideal to run/stop before closing. So I'm now preventing the buttons from closing the dialog (using the close to do that), wonder how to redraw/refresh either the entire dialog or just the buttons? Tried swapping the object property of buttons with variable version of itself, but no change.. the dialog sits within a function that also includes an ace-editor instance, so ideal if only buttons can be redrawn, but ok if the whole box gets redrawn.

This topic was brought up in #162 however that involved the afterOpen instead.

My buttons object looks like so (reduced to core functions for question):

buttons: 
    [{
        type: 'submit',
        text: settings.cocoding.uselocalcode ? '► RE-RUN' : '► RUN', // iconPlay
        className: 'cocoding-local-run',
        click: function updateCode () {
            settings.cocoding.uselocalcode = true;
            // *** here it should refresh buttons, with settings in place to show 'stop'
        }
    }
    , settings.cocoding.uselocalcode ? {
        type: 'stop',
        text: '◼ STOP',
        click: function updateCode () {
            settings.cocoding.uselocalcode = false;
            // *** here it should refresh buttons, with settings in place to hide 'stop'
        }
    } : {
        className: 'hide-button' // hide if unused
    }
    ,{
        type: 'close',
        text: 'CLOSE',
        click: function(){
            vex.close(localCodeVex);
        }
    }],
onSubmit: function(e) {
        e.preventDefault();
}

[ffd8]

Ok.. found a decent solution. Closing the dialog and reopening. Was having issues with how long it took to destroy the vex dialog (probably becauses of the fade out??) – but then in the advanced documenation found there's an afterClose() callback. Now I show a temp alert about refreshing while closing and reopening the dialog. Nevertheless, would be amazing if someone knew how to refresh or rebuild an existing and open vex dialog box...

Here's an abstracted example incase anyone runs into similar issue:

function cocodingLocalCode(){
    let reloadVex = false; // should refresh dialog

    let localCodeVex = vex.dialog.confirm({
        // guts of message, removed for abstracted sharing
        buttons: [
        {
            type: 'submit',
            text: settings.cocoding.uselocalcode ? '► RE-RUN' : '► RUN', // iconPlay
            className: 'cocoding-local-run',
            click: function updateCode () {
                settings.cocoding.uselocalcode = true;
                prepReload();
            }
        }
        , settings.cocoding.uselocalcode ? {
            type: 'stop',
            text: '◼ STOP',
            click: function updateCode () {
                settings.cocoding.uselocalcode = false;
                prepReload();
            }
        } : {
            className: 'hide-button' // hide if unused
        }
        ,{
            type: 'close',
            text: 'CLOSE',
            click: function(){
                vex.close(localCodeVex);
            }
        }],
        onSubmit: function(e) {
            e.preventDefault();
        },
        afterOpen: function(){
            // build ace-editor instance + tidy... removed for abstracted sharing
        },
        afterClose: function(){
            if(reloadVex){
                vex.closeAll();
                cocodingLocalCode(); // call self once fully removed
            }
        }
    })

    function prepReload(){
        // close self + launch temp alert about refreshing...
        reloadVex = true;
        vex.close(localCodeVex);
        vex.dialog.alert({
            unsafeMessage:'<div style="font-size:10pt;line-height:1.3em;font-style:italic;">Refreshing Sync Data...</div>',
            buttons:[]
        })
    }

}