Examples TOCexamples

Square

$Date: 2005/07/25 11:19:41 $

 Table of contents

Introduction

This example requires :


This example will run a polygonal (square 3x3) ProgressBar.

Cell coordinates are pre-computed (line 31) but free x-y-grid coordinates are also possible. Percent text info is centered on a white background area of 30 pixels width, at top side of polygonal shape.

Lines 34 thru 56 allows to rotate cell coordinates list and start at different origin.

[Top]

 Render options

Here are options to build this progress bar string (percent text info):
valign = top
align  = center
height = 30
HTML_Progress_UI::setStringAttributes()
Here are options to build the progress bar cells :
width  = 20
height = 20
HTML_Progress_UI::setCellAttributes()

[Top]

 Output

Screenshot

[Top]

 PHP source syntax highlight

  1. <?php
  2. /**
  3.  * Basic Square Progress example.
  4.  *
  5.  * <b>start</b> parameter could be equal to:
  6.  * - 'topleft'     = beginning at top left corner (default)
  7.  * - 'topright'    = beginning at top right corner
  8.  * - 'bottomright' = beginning at bottom right corner
  9.  * - 'bottomleft'  = beginning at bottom left corner
  10.  *
  11.  * @version    $Id: square.php,v 1.2 2005/07/25 11:19:41 farell Exp $
  12.  * @author     Laurent Laville <pear@laurent-laville.org>
  13.  * @package    HTML_Progress
  14.  * @subpackage Examples
  15.  */
  16.  
  17. require_once 'HTML/Progress.php';
  18.  
  19. $s = isset($_GET['start']) ? $_GET['start'] : 'topleft';
  20.  
  21. $bar = new HTML_Progress();
  22. $bar->setAnimSpeed(100);
  23. $bar->setIncrement(10);
  24.  
  25. $ui =& $bar->getUI();
  26. $ui->setStringAttributes('valign=top align=center height=30');
  27. $ui->setOrientation(HTML_PROGRESS_POLYGONAL);
  28. $ui->setCellAttributes('width=20 height=20');
  29. $w = 3;
  30. $h = 3;
  31. $ui->setCellCoordinates($w,$h);          // square 3x3
  32. $coord = $ui->getCellCoordinates();
  33.  
  34. switch (strtolower($s)) {
  35.  case 'topright':
  36.      for ($i=1; $i<$w; $i++) {
  37.          $shift = array_shift($coord);
  38.          array_push($coord, $shift);
  39.      }
  40.      break;
  41.  case 'bottomright':
  42.      for ($i=1; $i<($w+$h-1); $i++) {
  43.          $shift = array_shift($coord);
  44.          array_push($coord, $shift);
  45.      }
  46.      break;
  47.  case 'bottomleft':
  48.      for ($i=1; $i<$w; $i++) {
  49.          $pop = array_pop($coord);
  50.          array_unshift($coord, $pop);
  51.      }
  52.      break;
  53.  case 'topleft':
  54.  default:
  55.      break;
  56. }
  57. $ui->setCellCoordinates($w, $h, $coord);
  58. ?>
  59. <html>
  60. <head>
  61. <title>Basic Square ProgressBar example</title>
  62. <style type="text/css">
  63. <!--
  64. <?php echo $bar->getStyle(); ?>
  65.  
  66. body {
  67.     background-color: #FFFFFF;
  68.     color: #000000;
  69.     font-family: Verdana, Arial;
  70. }
  71.  
  72. a:visited, a:active, a:link {
  73.     color: navy;
  74. }
  75. // -->
  76. </style>
  77. <script type="text/javascript">
  78. <!--
  79. <?php echo $ui->getScript(); ?>
  80. //-->
  81. </script>
  82. </head>
  83. <body>
  84.  
  85. <?php
  86. echo $bar->toHtml();
  87. $bar->run();
  88. ?>
  89.  
  90. </body>
  91. </html>

[Top]