A tutorial/howto for HTML_Progress - Part 6

August 6, 2003

By Laurent Laville

Template engine integration
- Horizontal Bar

Template engine integration

Horizontal Bar

In this example, you will need to install HTML_QuickForm and HTML_Template_Sigma packages if it's not yet done!

Check if packages are installed. On command line enter :

pear list

should give something like,

INSTALLED PACKAGES:
===================
PACKAGE              VERSION STATE
...
HTML_CSS             0.2.0   stable
HTML_Common          1.2.1   stable
HTML_Page            2.0.0b5 beta
HTML_Progress        0.5.0   stable
HTML_QuickForm       3.1     stable
HTML_Template_Sigma  1.0.1   stable
...

If it's not, then enter both command lines below :

pear install HTML_QuickForm-3.1.tgz

and,

pear install HTML_Template_Sigma-1.0.1.tgz

There are only 3 main operations to do; Do not forget it or it won't work!

We put the HTML progress bar code into a template variable called L_PROGRESS_BAR. See contents of file installing.html.
```
$tpl->setVariable("L_PROGRESS_BAR", $bar->toHTML());
```
We include on the new page created by HTML_Page package, the HTML_Progress internal JavaScript code.
```
$p->addScriptDeclaration( $bar->getScript() );
```
Get contents of parse template and merge it with your new page
```
$p->addBodyContent($tpl->get());
```
And finally display result as for all others examples
```
$p->display();
```

progress6.php

<?php 
/**
 * Display a loading bar from 0 to 100% increase by step of 10%
 * with custom configuration with a Template Engine 
 * 
 * @version    $Id: howto-part6.html,v 1.1 2003/08/06 15:59:12 Farell Exp $
 * @author     Laurent Laville <laurent.laville@worldonline.fr>
 * @package    HTML_Progress
 */

require_once ('HTML/QuickForm.php');
require_once ('HTML/QuickForm/Renderer/ITStatic.php');
require_once ('HTML/Template/Sigma.php');
require_once ('HTML/Progress/BarHorizontal.php');


$tpl = new HTML_Template_Sigma('.');
$tpl->loadTemplateFile('installing.html');
        
$vars = array (    
    "L_SETUP_APP_TITLE"    => "SW4P",
    "L_APPNAME"            => "My Template Sample",
    "L_APPCOPYRIGHT"       => "&copy 2003 SW4P Team "
);
$tpl->setVariable($vars);

$form = new HTML_QuickForm('form');
$form->addElement('button', 'cancel', 'Cancel', 'style="width:100px;" disabled="true"');

$layout = array(
    'width'            => '200px',
    'border-width'     => '2px',
    'border-color'     => '#7B7B88',
    'cell-width'       => '10px',
    'active-color'     => '#7B7B88',
    'inactive-color'   => '#D0D0D0'
);

$p = new HTML_Page();
$p->setTitle("PEAR::HTML_Progress - Example 6");
$p->setMetaData("author", "Laurent Laville");
$p->addStyleSheet("./styles.css");


$bar = new HTML_Progress_Bar_Horizontal('natural', &$p, $layout);
$bar->setText(true);

$tpl->setVariable("L_PROGRESS_BAR", $bar->toHTML());

$renderer =& new HTML_QuickForm_Renderer_ITStatic($tpl);
$form->accept($renderer);

$css = $bar->getStyle();
$css->setStyle('body', 'background-color', '#444444');
$p->addStyleDeclaration(&$css);
$p->addScriptDeclaration( $bar->getScript() );
$p->addBodyContent($tpl->get());
$p->display();

for ($i=0; $i<11; $i++) {
/*  You have to do something here  */
    $bar->display(10);
}

?>

This example will produce :

[Top]

back to main table of contents

$Id: howto-part6.html,v 1.1 2003/08/06 15:59:12 Farell Exp $

A tutorial/howto for HTML_Progress - Part 6

Table of Contents

Template engine integration

Horizontal Bar