$Date: 2004/04/18 13:25:44 $
This example will run a polygonal (rectangle 6x4) ProgressBar filled in natural way.
Cell coordinates are pre-computed but free x-y-grid coordinates are also possible. Percent text info is centered on a white background area of 90 pixels width, at bottom side of polygonal shape.
[Top]
Build the progress bar
require_once 'HTML/Progress.php'; $bar = new HTML_Progress(); $bar->setAnimSpeed(100); $bar->setIncrement(10); $ui =& $bar->getUI(); $ui->setStringAttributes('valign=bottom align=center width=90 height=30'); $ui->setOrientation(HTML_PROGRESS_POLYGONAL); $ui->setCellAttributes(array( 'width' => 15, 'height' => 15, 'active-color' => 'red', 'inactive-color' => 'orange', ) ); $ui->setCellCoordinates(6,4); // Rectangle 6x4
Loop to run the progress
do { $bar->display(); if ($bar->getPercentComplete() == 1) { break; // the progress bar has reached 100% } // your user-process should be put HERE ! $bar->incValue(); } while(1);
[Top]
valign = bottom align = center width = 90 height = 30
active-color = red inactive-color = orange width = 15 height = 15
[Top]
[Top]
Run the script below :
<?php require_once 'HTML/Progress.php'; $bar = new HTML_Progress(); $bar->setAnimSpeed(100); $bar->setIncrement(10); $ui =& $bar->getUI(); $ui->setStringAttributes('valign=bottom align=center width=90 height=30'); $ui->setOrientation(HTML_PROGRESS_POLYGONAL); $ui->setCellAttributes(array( 'width' => 15, 'height' => 15, 'active-color' => 'red', 'inactive-color' => 'orange', ) ); $ui->setCellCoordinates(6,4); // Rectangle 6x4 ?> <html> <head> <title>Basic Rectangle ProgressBar example</title> <style type="text/css"> <!-- <?php echo $bar->getStyle(); ?> // --> </style> <script type="text/javascript"> <!-- <?php echo $ui->getScript(); ?> //--> </script> </head> <body> <?php echo $bar->toHtml(); do { $bar->display(); if ($bar->getPercentComplete() == 1) { break; // the progress bar has reached 100% } $bar->incValue(); } while(1); ?> </body> </html>
[Top]