Examples TOCexamples

Template ITX static

$Date: 2005/07/25 11:53:55 $

 Table of contents

Introduction

This example requires :

This example will run a progress meter embedded into a template file.

Template engine is IT(X), but you could use any others template engine.

On lines 17 thru 32, there is your user-callback (function myFunctionHandler), where you do what you want. This callback is attached on progress bar at line 80.

Inside this callback, we will show a custom string (build at line 31) at 25% (lines 22 to 24), at 50% (lines 25 to 27), at 100% (lines 28 to 30).

As for all demos, to smooth animation, i've added a sleep method at line 19. Delay depends on value set by setAnimSpeed method at line 75. In real world, you have to do a long task, so delay (sleep) is unnecesary.

Tips: to build custom string, you don't forget to set lines 78 and 79.

Depending of your template engine, you should :

Before to run the progress meter at line 107.

Note: usage of quickform is only to show you how to dynamic change look and feel of progress meter.

[Top]

 Render options

Here are options to build the progress bar cells (count=10 filled in natural way): 
active-color   = #7B7B88
inactive-color = #D0D0D0
width          = 10
HTML_Progress_UI::setCellAttributes()
Here are options to build the progress bar string : 
width            = 320
font-size        = 10
align            = left
valign           = bottom
background-color = #D0D0D0
HTML_Progress_UI::setStringAttributes()
Here are options to build the progress bar itself: 
width  = 320
HTML_Progress_UI::setProgressAttributes()

[Top]

 Output

Screenshot

[Top]

 PHP source syntax highlight

  1. <?php
  2. /**
  3.  * Display a horizontal progress meter
  4.  * embedded into a ITX template system file.
  5.  *
  6.  * @version    $Id: itxstatic.php,v 1.2 2005/07/25 11:53:55 farell Exp $
  7.  * @author     Laurent Laville <pear@laurent-laville.org>
  8.  * @package    HTML_Progress
  9.  * @subpackage Examples
  10.  */
  11.  
  12. require_once 'HTML/QuickForm.php';
  13. require_once 'HTML/QuickForm/Renderer/ITStatic.php';
  14. require_once 'HTML/Template/ITX.php';
  15. require_once 'HTML/Progress.php';
  16.  
  17. function myFunctionHandler($progressValue, &$bar)
  18. {
  19.     $bar->sleep();
  20.     $str = ' ';
  21.  
  22.     if ($progressValue > 25) {
  23.         $str = ' - DB schema generated';
  24.     }
  25.     if ($progressValue > 50) {
  26.         $str = ' - Config file created';
  27.     }
  28.     if ($progressValue == 100) {
  29.         $str = ' - All done !';
  30.     }
  31.     $bar->setString( sprintf("Installation in progress ... %01s%s %s", $progressValue, '%', $str) );
  32. }
  33.  
  34. $tpl = new HTML_Template_ITX('.');
  35. $tpl->loadTemplateFile('installing.html');
  36.  
  37. $vars = array (
  38.     "L_SETUP_APP_TITLE"    => "SW4P",
  39.     "L_APPNAME"            => basename(__FILE__),
  40.     "L_APPCOPYRIGHT"       => "&copy 2003 SW4P Team ",
  41. );
  42. $tpl->setVariable($vars);
  43.  
  44. $form = new HTML_QuickForm('form');
  45. $form->addElement('submit', 'launch', 'Launch', 'style="width:100px;"');
  46.  
  47. $styles = array('none' => 'none',
  48.     'solid'  => 'solid',
  49.     'dashed' => 'dashed',
  50.     'dotted' => 'dotted',
  51.     'inset'  => 'inset',
  52.     'outset' => 'outset'
  53. );
  54. $form->addElement('select','border','border style:',$styles);
  55.  
  56. $colors = array('#FFFFFF' => 'white', '#0000FF'=> 'blue', '#7B7B88' => '#7B7B88');
  57. $form->addElement('select','color','border color:',$colors);
  58.  
  59. $defaultValues['border'] = 'solid';
  60. $defaultValues['color']  = '#7B7B88';
  61. $form->setDefaults($defaultValues);
  62.  
  63. if ($form->validate()) {
  64.     $arr = $form->getElementValue('border');
  65.     $border = $arr[0];
  66.     $arr = $form->getElementValue('color');
  67.     $color = $arr[0];
  68. } else {
  69.     $border = $defaultValues['border'];
  70.     $color  = $defaultValues['color'];
  71. }
  72.  
  73.  
  74. $bar = new HTML_Progress();
  75. $bar->setAnimSpeed(200);
  76. $bar->setIncrement(10);
  77. $bar->setBorderPainted(true);
  78. $bar->setStringPainted(true);          // get space for the string
  79. $bar->setString('');                   // but don't paint it
  80. $bar->setProgressHandler('myFunctionHandler');
  81.  
  82. $ui =& $bar->getUI();
  83. $ui->setCellAttributes('active-color=#7B7B88 inactive-color=#D0D0D0 width=10');
  84. $ui->setBorderAttributes(array(
  85.     'width' => 2,
  86.     'color' => $color,
  87.     'style' => $border
  88. ));
  89. $ui->setStringAttributes(array(
  90.     'width' => 320,
  91.     'font-size' => 10,
  92.     'align' => 'left',
  93.     'valign' => 'bottom',
  94.     'background-color' => '#D0D0D0'  // make it transparent, see style #MainWindow
  95. ));
  96. $ui->setProgressAttributes('width=320');
  97.  
  98. $tpl->setVariable("L_STYLESHEET", $bar->getStyle() );
  99. $tpl->setVariable("L_JAVASCRIPT", $ui->getScript() );
  100. $tpl->setVariable("L_PROGRESS_BAR", $bar->toHtml() );
  101.  
  102. $renderer = new HTML_QuickForm_Renderer_ITStatic($tpl);
  103. $form->accept($renderer);
  104.  
  105. $tpl->show();
  106.  
  107. $bar->run();
  108. $bar->display();  // to display the last custom string
  109. ?>

[Top]