<?xml version="1.0" encoding="iso-8859-1"?>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>
Chapter 9. Quick Start with HTML_Progress2_Generator
</title>
<link rel="stylesheet" href="book.css" type="text/css" />
<meta name="generator" content="DocBook XSL Stylesheets V1.69.1" />
<link rel="start" href="index.html" title="HTML_Progress2 Manual" />
<link rel="up" href="pt02.html" title=
"Part II. Getting Started" />
<link rel="prev" href="ch08s04.html" title=
"Sigma template engine integration " />
<link rel="next" href="ch09s02.html" title="Default render and css skin" />
<style type="text/css">
/*<![CDATA[*/
body {
background-color: white;
color: black;
}
:link { color: #0000FF }
:visited { color: #840084 }
:active { color: #0000FF }
col.c4 {text-align: left}
div.c3 {margin-left: 0.5in; margin-right: 0.5in;}
h2.c2 {clear: both}
p.c1 {font-weight: bold}
/*]]>*/
</style>
</head>
<body>
<table class="progress2Header">
<tr>
<td>
<img src="img/pear_progress2.gif" align="left" alt=
"PEAR Progress2 logo" />
<h1>
HTML_Progress2 : The Definitive Guide
</h1>
<div class="navheader">
<table width="100%" summary="Navigation header">
<tr>
<th colspan="3" align="center">
Chapter 9. Quick Start with
HTML_Progress2_Generator
</th>
</tr>
<tr>
<td width="20%" align="left">
<a accesskey="p" href="ch08s04.html">Prev</a>
</td>
<th width="60%" align="center">
Part II. Getting Started
</th>
<td width="20%" align="right">
<a accesskey="n" href="ch09s02.html">Next</a>
</td>
</tr>
</table>
</div>
</td>
</tr>
</table>
<div class="chapter" lang="en">
<div class="titlepage">
<h2 class="title">
<a name="developers.generator"></a>Chapter 9. Quick Start
with HTML_Progress2_Generator
</h2>
</div>
<div class="toc">
<p class="c1">
Table of Contents
</p>
<dl>
<dt>
<span class="sect1"><a href=
"ch09.html#generator.basic.concept">Basic concept</a></span>
</dt>
<dt>
<span class="sect1"><a href="ch09s02.html">Default render and css
skin</a></span>
</dt>
<dt>
<span class="sect1"><a href="ch09s03.html">Template
integration</a></span>
</dt>
</dl>
</div>
<p>
The <span class="bold"><strong>HTML_Progress2_Generator</strong></span>
class allow to build your own progress bar and save PHP and/or CSS
basic code for later use. Renders are customizable by <a class=
"external" href=
"http://pear.php.net/manual/en/package.html.html-quickform.intro-renderers.php"
title=
"http://pear.php.net/manual/en/package.html.html-quickform.intro-renderers.php">
QF rendering system</a> and external stylesheet.
</p>
<p>
In two following examples, we will learn how to change the skin easily,
and integrate HTML_Progress2_Generator with your favorite template
engine.
</p>
<div class="sect1" lang="en">
<div class="titlepage">
<h2 class="title c2">
<a name="generator.basic.concept"></a>Basic concept
</h2>
</div>
<p>
Design pattern apply the same HTML_QuickForm_Renderer architecture.
So it's easy to change presentation of a progress generator. External
stylesheets give more options (color, font, ...) to customize look
and feel of your own progress generator.
</p>
<div class="note c3">
<table border="0" summary="Note">
<tr>
<td rowspan="2" align="center" valign="top" width="48">
<img alt="[Note]" src="img/admons/note.png" />
</td>
<th align="left">
Note
</th>
</tr>
<tr>
<td align="left" valign="top">
Usage of external stylesheet is only available since version
2.1.0
</td>
</tr>
</table>
</div>
<p>
There are 8 renderers available since release 3.1.1 of QuickForm. The
following template engines are directly suported: <span class=
"simplelist">Smarty, HTML_Template_Sigma, HTML_Template_IT</span>,
and also with packages <span class="simplelist">HTML_Page2,
HTML_QuickForm_Renderer_Tableless</span>
</p>
<p>
Among these 5 renderers (Default, HTMLPage2, ITDynamic,
SmartyDynamic, Tableless), we will have a look on all basic concepts
with 2 examples in next sections: <span class="simplelist">default
render and css skin, template integration</span>.
</p>
<div class="qandaset">
<dl>
<dt>
1. <a href="ch09.html#id4791423">Resume of uses</a>
</dt>
<dd>
<dl>
<dt>
1.1. <a href="ch09.html#id4791428">You want to use default QF
renderer</a>
</dt>
<dt>
1.2. <a href="ch09.html#id4791494">You want to use Smarty</a>
</dt>
<dt>
1.3. <a href="ch09.html#id4791571">You want to use IT[x] or
Sigma</a>
</dt>
<dt>
1.4. <a href="ch09.html#id4793825">You want to use the QF
Tableless renderer</a>
</dt>
</dl>
</dd>
</dl>
<table border="0" summary="Q and A Set">
<col class="c4" width="1%" />
<tbody>
<tr class="qandadiv">
<td align="left" valign="top" colspan="2">
<h4 class="title">
<a name="id4791423"></a>1. Resume of uses
</h4>
</td>
</tr>
<tr class="toc">
<td align="left" valign="top" colspan="2">
<dl>
<dt>
1.1. <a href="ch09.html#id4791428">You want to use
default QF renderer</a>
</dt>
<dt>
1.2. <a href="ch09.html#id4791494">You want to use
Smarty</a>
</dt>
<dt>
1.3. <a href="ch09.html#id4791571">You want to use IT[x]
or Sigma</a>
</dt>
<dt>
1.4. <a href="ch09.html#id4793825">You want to use the QF
Tableless renderer</a>
</dt>
</dl>
</td>
</tr>
<tr class="question">
<td align="left" valign="top">
<a name="id4791428"></a><a name="id4791430"></a><b>1.1.</b>
</td>
<td align="left" valign="top">
<span class="bold"><strong>You want to use default QF
renderer</strong></span>
</td>
</tr>
<tr class="answer">
<td align="left" valign="top"></td>
<td align="left" valign="top">
<p>
Use this driver:
</p>
<div class="variablelist">
<dl>
<dt>
<span class="term">Default</span>
</dt>
<dd>
<p>
ressource is : <code class=
"filename">HTML/Progress2/Generator/Default.php</code>
</p>
<p>
default stylesheet is : <code class=
"filename">{data_dir}/HTML_Progress2/default.css</code>
</p>
</dd>
</dl>
</div>
<div class="tip c3">
<table border="0" summary="Tip">
<tr>
<td rowspan="2" align="center" valign="top" width="48">
<img alt="[Tip]" src="img/admons/tip.png" />
</td>
<th align="left">
Tip
</th>
</tr>
<tr>
<td align="left" valign="top">
No need to include the driver,
HTML_Progress2_Generator do it itself.
</td>
</tr>
</table>
</div>
</td>
</tr>
<tr class="question">
<td align="left" valign="top">
<a name="id4791494"></a><a name="id4791496"></a><b>1.2.</b>
</td>
<td align="left" valign="top">
<span class="bold"><strong>You want to use
Smarty</strong></span>
</td>
</tr>
<tr class="answer">
<td align="left" valign="top"></td>
<td align="left" valign="top">
<p>
Use this driver:
</p>
<div class="variablelist">
<dl>
<dt>
<span class="term">SmartyDynamic</span>
</dt>
<dd>
<p>
ressource is : <code class=
"filename">HTML/Progress2/Generator/SmartyDynamic.php</code>
</p>
<p>
default stylesheet is : <code class=
"filename">{data_dir}/HTML_Progress2/smartydynamic.css</code>
</p>
<p>
template root dir is : <code class=
"filename">.</code> (current dir)
</p>
<p>
template cache dir is : <code class=
"filename">cache/</code>
</p>
<p>
template filename is : <code class=
"filename">smarty-dynamic.tpl</code>
</p>
</dd>
</dl>
</div>
</td>
</tr>
<tr class="question">
<td align="left" valign="top">
<a name="id4791571"></a><a name="id4791573"></a><b>1.3.</b>
</td>
<td align="left" valign="top">
<span class="bold"><strong>You want to use IT[x] or
Sigma</strong></span>
</td>
</tr>
<tr class="answer">
<td align="left" valign="top"></td>
<td align="left" valign="top">
<p>
Use this driver:
</p>
<div class="variablelist">
<dl>
<dt>
<span class="term">ITDynamic</span>
</dt>
<dd>
<p>
ressource is : <code class=
"filename">HTML/Progress2/Generator/ITDynamic.php</code>
</p>
<p>
default stylesheet is : <code class=
"filename">{data_dir}/HTML_Progress2/itdynamic.css</code>
</p>
<p>
template root dir is : <code class=
"filename">.</code> (current dir)
</p>
<p>
template cache dir is : <code class=
"filename">cache/</code>
</p>
<p>
template filename is : <code class=
"filename">itdynamic.html</code>
</p>
</dd>
</dl>
</div>
</td>
</tr>
<tr class="question">
<td align="left" valign="top">
<a name="id4793825"></a><a name="id4793828"></a><b>1.4.</b>
</td>
<td align="left" valign="top">
<span class="bold"><strong>You want to use the QF Tableless
renderer</strong></span>
</td>
</tr>
<tr class="answer">
<td align="left" valign="top"></td>
<td align="left" valign="top">
<div class="note c3">
<table border="0" summary="Note">
<tr>
<td rowspan="2" align="center" valign="top" width="48">
<img alt="[Note]" src="img/admons/note.png" />
</td>
<th align="left">
Note
</th>
</tr>
<tr>
<td align="left" valign="top">
HTML_QuickForm_Renderer_Tableless is only available
since version 2.1.0
</td>
</tr>
</table>
</div>
<p>
Use this driver:
</p>
<div class="variablelist">
<dl>
<dt>
<span class="term">Tableless</span>
</dt>
<dd>
<p>
ressource is : <code class=
"filename">HTML/Progress2/Generator/Tableless.php</code>
</p>
<p>
default stylesheet is : <code class=
"filename">{data_dir}/HTML_Progress2/tableless.css</code>
</p>
</dd>
</dl>
</div>
</td>
</tr>
</tbody>
</table>
</div>
<p>
Explains on {data_dir} reference :
</p>
<div class="note c3">
<table border="0" summary="Note">
<tr>
<td rowspan="2" align="center" valign="top" width="48">
<img alt="[Note]" src="img/admons/note.png" />
</td>
<th align="left">
Note
</th>
</tr>
<tr>
<td align="left" valign="top">
<p>
<span class="bold"><strong>Where is the PEAR HTML_Progress2
data directory ?</strong></span>
</p>
<p>
On command line, enter <strong class="userinput"><code>pear
config-show</code></strong>, and have a look on <span class=
"bold"><strong>data_dir</strong></span> definition.
HTML_Progress2 is one of its subdirectories.
</p>
</td>
</tr>
</table>
</div>
</div>
</div>
<table class="progress2Footer">
<tr>
<td align="left">
HTML_Progress2 : The Definitive Guide
</td>
<td align="right">
v 2.4.0 : April 20, 2007
</td>
</tr>
</table>
<div class="navfooter">
<hr />
<table width="100%" summary="Navigation footer">
<tr>
<td width="40%" align="left">
<a accesskey="p" href="ch08s04.html">Prev</a>
</td>
<td width="20%" align="center">
<a accesskey="u" href="pt02.html">Up</a>
</td>
<td width="40%" align="right">
<a accesskey="n" href="ch09s02.html">Next</a>
</td>
</tr>
<tr>
<td width="40%" align="left" valign="top">
Sigma template engine integration
</td>
<td width="20%" align="center">
<a accesskey="h" href="index.html">Home</a>
</td>
<td width="40%" align="right" valign="top">
Default render and css skin
</td>
</tr>
</table>
</div>
</body>
</html>
distrib
>
Mandriva
>
2010.0
>
i586
>
media
>
contrib-release
>
by-pkgid
>
89346381d9fb64d9ee8827de5f073355
>
files
>
29
