ScriptUi - Buttons not responsive with a palette

Question

After many attempts I managed to create a working custom progress bar, even if customizing it with the OnDraw command, it flickers (I still don't understand why, maybe it could be the continuous redraw with the update command).
I wanted to add a button that would stop the progress bar (then also the script), and maybe add a warning message, however I ran into a problem.
It seems that the buttons don't respond to clicks, either while the progress bar is advancing or on a normal palette.
On a dialog it works, on palette and window it doesn't.
I suspect it's because, to keep a palette open in photoshop, it has to be busy, otherwise it closes. This causes me to be unable to press the button.
I tried everything I could think of, but nothing worked.
There is a way to implement this?
Here is a sample of my code:

    progressbar (100);
    for ( var e = 0; e < 100; e++ ) {
        progressbar.progress ();
        }
    progressbar.close ();

    function progressbar (total) {
        var win = new Window ("palette", undefined, undefined, {closeButton: false, borderless: true});
        win.orientation = "row";
        var barheight = 15;
        var halfbarheight = barheight / 2;
        var barwidth = 500;
        var bar = win.add ("progressbar", [0, 0, barwidth, barheight], 0, total);
        bar.onDraw = function () {
            with (bar) {
                graphics.drawOSControl ();
                graphics.newPath ();
                graphics.moveTo (halfbarheight, 0);
                for (var a = 0; a < Math.PI; a += Math.PI / 100) {
                    graphics.lineTo ((-halfbarheight * Math.sin (a)) + halfbarheight, (-halfbarheight * Math.cos (a)) + halfbarheight);
                    }
                graphics.lineTo (halfbarheight + (bar.value * ((barwidth - barheight) / total)), barheight);
                for (var b = 0; b < Math.PI; b += Math.PI / 100) {
                    graphics.lineTo ((halfbarheight * Math.sin (b)) + halfbarheight + (bar.value * ((barwidth - barheight) / total)), (halfbarheight * Math.cos (b)) + halfbarheight);
                    }
                graphics.lineTo (halfbarheight, 0);
                graphics.closePath ();
                graphics.fillPath (graphics.newBrush (graphics.BrushType.SOLID_COLOR, [0.25, 0.83, 0.1]));
                }
            }
        var close = win.add ("iconbutton", [0, 0, 15, 15]);
        close.onDraw = function (event) {
            with (close) {
                graphics.drawOSControl ();
                graphics.ellipsePath (0, 0, size[0], size[1]);
                graphics.fillPath (graphics.newBrush (graphics.BrushType.SOLID_COLOR, [0.6, 0, 0]));
                if (event.mouseOver) {
                    graphics.fillPath (graphics.newBrush (graphics.BrushType.SOLID_COLOR, [0.85, 0, 0]));
                    }
                }
            }
        close.onClick = function () {
            progressbar.close ();
            return;
            }
        progressbar.close = function () {
            win.close ();
            }
        progressbar.progress = function () {
            bar.value++;
            $.sleep (100);
            win.update ();
            }
        win.show ();
        }

Answer 1

I'm not sure what you're trying to do. So, just in case, here is how I used to build a progressbar (with a text area and the button 'Cancel'):

var iterations = 10;

// show the progress bar
var bar = new Window('palette', 'Progress...');
var stat = bar.add('statictext', undefined, '');
stat.characters = 80;
var progressbar = bar.add('progressbar', [15,15,600,35], 0, iterations);

var bar_visible = true;
var button = bar.add('button', undefined, 'Cancel');
button.onClick = function() { bar.close(); bar_visible = false; }

bar.center();
bar.show();

var counter = 0;
for (var i=0; i<iterations; i++) {
    if (bar_visible == false) break;

    // update the progress bar
    counter++;
    progressbar.value = counter;
    stat.text = 'Processed ' + counter + ' from ' + iterations;
    bar.update();

    alert(counter); // <------- do stuff
}

// close the progress bar
bar.close();

Note: this example works fine on Windows, but on macOS the alert window blocks the button 'Cancel'. I used the alert window just to show the concept. Otherwise the 'Cancel' button works fine on macOS: it closes the palette and breaks the loop.