Progress bar / text info během scriptu v Nette

Tímto způsobem, jak si již napsal, to „logicky“ fungovat nemůže, protože z pohledu životního cyklu aplikace se jedna o jeden request/životní cyklus, kde je pouze jeden request a jedna response.

Aby si nějakou takovou informaci mohl v prohlížeči vykreslovat, tak bys ten složitý/dlouho běžící loop musel spustit někde na pozadí (třeba CRONem) a někam si ukládat mezistavy v jednotlivých cyklech.
V prohlížeči si pak volal ajaxem nějaký handle, který bude vracet číselný status dané operace a ty jej jen vykreslíš.

Složitější varianta by byla s využitím nějakého AJAX push engine, který by ti ten progres v browseru updatoval v browseru sám (odpadlo by ti to AJAX volání handle v intervalech – funguje to obdobně, jako push notifikace na iOS a Androidu) – jeden z nejznámějších je třeba: http://ape-project.org/ – ale jsou jich mraky jiných a je na tobě, který by sis vybral.

Já to dělám tak že v requestu ve kterým mi běží nějaký dlouhý cyklus nechávám cachovat soubor nebo do redisu jeho progress. Druhy ajax request který běží souběžně s tím prvním mi jen načítá ty data z cache v nějakým intervalu a tím pak vypočítavá délku progress barů. Je to trochu hodně psaního, ale docela to funguje lepší než ten flush() který mi přijde že není moc spolehlivý.

Použil bych sockety a z PHP procesu pushoval do klienta informace o průběhu.

@MW jak pisu, je potreba nastavit X veci, aby nedochazelo k zadnymu bufferovani ani komprimovani. nevim, co vse bude potreba u apache, hledej.. Ale tohle jsem psal spis jako zajimavost, lepsi bude pouzit nekterou z jinych uvedenych moznosti

musíš to terminovat jinak ti to pojede dále. ale osobně bych to hodil když už tak do payloadu a poslal JSON output.

public function handleProgress()
{
	$this->payload->data = $this->getSession('progress')->val;
	$this->sendPayload(); // toto ti odešle json response
}

v JS potom

success: function(data) {
                $("#progress").html(data.data);
                if(data.data<10){
                    getProgress();
                }
            }

Editoval Lukeluha (19. 6. 2015 21:01)

Tak kdyby někdo mel zajem, toto je funkcni verze. Budu rad za jakekoliv návrhy na zlepseni :)
Diky

latte:

<script type='text/javascript'>
    //Start the long running process

    function runScript(){
    document.getElementById('progress').style.visibility = 'visible';
    document.getElementById('actionbutton').innerHTML = 'Pracuji...';
    document.getElementById('actionbutton').setAttribute('disabled', 'disabled');

    $.ajax({
        url: {link longScript!},
        success: function(data) {
        }
    });
    getProgress();
    }

    function clearSession(){
    $.ajax({
        url: {link clearSession!}
    });
    }

    //Start receiving progress
    function getProgress(){
        $.ajax({
            url: {link progress!},
            success: function(data) {
                $('#progressinfo').html('Začínám...');
                if(data.data > 0) {
                    $('#progressinfo').html(data.data+ '%');
                }
                if(data.data < 100){
                    $('.progress-bar').css('width', data.data+'%').attr('aria-valuenow', data.data);
                    getProgress();
                }
                if(data.data === 100){
                $('.progress-bar').css('width', '100%').attr('aria-valuenow', 100);
                $('#progressinfo').html('Hotovo');
                clearSession();
                document.getElementById('actionbutton').innerHTML = 'Spustit znovu';
                document.getElementById('actionbutton').removeAttribute('disabled');
                }
            }
        });
    }
</script>

<div id=progress class='progress progress-striped' style='width: 400px; visibility: hidden;'>
    <div class='progress-bar' role='progressbar' aria-valuenow='0' aria-valuemin='0' aria-valuemax='100'>
        <div id='progressinfo'></div>
    </div>
</div><br />

<button id="actionbutton" type="submit" class="btn btn-warning btn-small" onclick="runScript()">Spustit akci</button><br /><br />

a presenter:

public function handleLongScript() {

            sleep(1);
            $session = $this->getSession();
            $progress = $session->getSection('progress');
            $progress->val = 0;
            $session->close();

            for($i=0;$i<=100;$i++){

            $session = $this->getSession();
            $progress = $session->getSection('progress');
            $progress->val = $i;
            $session->close();
            usleep(1000);
            }
            $i = 0;
    }

    public function handleProgress() {
         $this->payload->data = $this->getSession('progress')->val;
         $this->sendPayload();
    }

    public function handleClearSession() {
        $session = $this->getSession();
        $progress = $session->getSection('progress');

        $this->payload->data = NULL;
        $progress->remove();
        $session->close();
    }

No JS není zrovna moje domena a priznam se, ze se me to jinak nepodarilo.
Zkousel jsem klasicky selector $(), ale zaboha to neslo…

Asi by si to zaslouzilo upravit, aby to bylo spravne.. nevim co je lepsi… ale na to moje JS znalosti nedosahuji…