bigup401 has asked for the wisdom of the Perl Monks concerning the following question:

i have tried to look around the proper way of progressbar in html. bt no good information i have been playing around with progrssbar in commandline bt not in cgi. as they say perl is good for open source bt web apps not easy too much time to take and alot tests

any idea or simple. i appreciate


if (execute code){
# execute code to run
}
while (the code is runing ) {
# show the progress .. show the progressbar from 1
}
elsif (the code has finished running) {
#stop the progressbar at 100%
}
else (the code has not executed) {
# dont let the progressbar to run
}


print "Content-type: text/html\n\n";
print <<START_HTML;

<!DOCTYPE html>
<html>
<style>
#myProgress {
  width: 100%;
  background-color: #ddd;
}

#myBar {
  width: 1%;
  height: 30px;
  background-color: #4CAF50;
}
</style>
<body>

<h1>JavaScript Progress Bar</h1>

<div id="myProgress">
  <div id="myBar"></div>
</div>

<br>
<button onclick="move()">Click Me</button> 

<script>
function move() {
  var elem = document.getElementById("myBar");   
  var width = 1;
  var id = setInterval(frame, 10);
  function frame() {
    if (width >= 100) {
      clearInterval(id);
    } else {
      width++; 
      elem.style.width = width + '%'; 
    }
  }
}
</script>

</body>
</html>
START_HTML

[download]

Replies are listed 'Best First'.
Re: cgi progressbar
by crusty_collins (Friar) on Feb 21, 2017 at 13:58 UTC
    While this piece of code is a spinner, not a progress bar .
    This is waiting for a log file to end 
    sub waitForCmd {
    my $href        = shift(@_);

    # wait for the file
    #
    sleep 1    while ( ! -e "$href->{settings}->{runfolder}/$href->{se
+ttings}->{logfile}" );

    open( FH ,'<', "$href->{settings}->{runfolder}/$href->{settings}->
+{logfile}" );

    # keep track of spinner
    #
    my @sails = map { "\b$_" } qw{- \ | /};
    my $sail = 0;

    # now search each line for job completed
    #
    FILE:
    for (;;) {
        while (<FH>) { 

            print $sails[$sail++ % @sails] ;            

            last FILE, if ( $_ =~ /Stopping AppMonitor Connector/ );
        }
        seek(FH, 0, 1);
    }

close (FH);
return;
}

    [download]
    "We can't all be happy, we can't all be rich, we can't all be lucky – and it would be so much less fun if we were. There must be the dark background to show up the bright colours." Jean Rhys (1890-1979)
[reply]
[d/l]
Re: cgi progressbar
by Anonymous Monk on Feb 21, 2017 at 12:19 UTC
[reply]

Back to Seekers of Perl Wisdom