Author: atsebro
Date: 2009-09-11 10:37:11 -0400 (Fri, 11 Sep 2009)
New Revision: 15541
Modified:
branches/community/3.3.X/docs/userguide/en/src/main/docbook/included/rich_panel.xml
branches/community/3.3.X/docs/userguide/en/src/main/docbook/included/rich_panelBar.xml
Log:
RF-7804: Rich Output component group description review --> rich:panelBar
Modified:
branches/community/3.3.X/docs/userguide/en/src/main/docbook/included/rich_panel.xml
===================================================================
---
branches/community/3.3.X/docs/userguide/en/src/main/docbook/included/rich_panel.xml 2009-09-11
14:36:34 UTC (rev 15540)
+++
branches/community/3.3.X/docs/userguide/en/src/main/docbook/included/rich_panel.xml 2009-09-11
14:37:11 UTC (rev 15541)
@@ -24,7 +24,7 @@
<para>May have header</para>
</listitem>
<listitem>
- <para>Has customizable look and feel </para>
+ <para>Has customizable look and feel</para>
</listitem>
</itemizedlist>
</section>
Modified:
branches/community/3.3.X/docs/userguide/en/src/main/docbook/included/rich_panelBar.xml
===================================================================
---
branches/community/3.3.X/docs/userguide/en/src/main/docbook/included/rich_panelBar.xml 2009-09-11
14:36:34 UTC (rev 15540)
+++
branches/community/3.3.X/docs/userguide/en/src/main/docbook/included/rich_panelBar.xml 2009-09-11
14:37:11 UTC (rev 15541)
@@ -1,58 +1,52 @@
<section role="NotInToc" id="rich_panelBar">
- <title>
- <
- rich:panelBar
- >
- <emphasis role="since">
- <superscript> available since <emphasis
role="version">3.0.0</emphasis>
- </superscript>
- </emphasis>
- </title>
- <section>
- <title>Description</title>
- <para>
- <property>panelBar</property> is used for grouping any content which
is loaded on the client
- side and appears as groups divided on child panels after the header is
clicked.</para>
- <figure>
- <title>
- <emphasis role="bold">
- <property><rich:panelBar></property>
- </emphasis> with content inside</title>
- <mediaobject>
- <imageobject>
- <imagedata fileref="images/panelBar_init.png"/>
- </imageobject>
- </mediaobject>
- </figure>
- </section>
- <section>
- <title>Key Features</title>
- <itemizedlist>
- <listitem>
- <para>Skinnable slide panel and child items</para>
- </listitem>
- <listitem>
- <para>Groups any content inside each panel</para>
- </listitem>
- </itemizedlist>
- </section>
- <section>
- <title>Details of Usage</title>
- <para>As it was mentioned <link
linkend="panelBar">above</link>,
- <property>panelBar</property> is used for grouping any content on
the client, thus its
- customization deals only with specification of sizes and styles for
rendering.</para>
- <para>
- <emphasis>
- <property>"width"</property>
- </emphasis> and <emphasis>
- <property>"height"</property>
- </emphasis> (both are 100% on default) attributes stand
apart.</para>
- <para>Style attributes are described further.</para>
- <para>
- <property>panelBar</property> could contain any number of child
- <property>panelBarItem</property> components inside, which
content is uploaded onto the
- client and headers are controls to open the corresponding child
element.</para>
- <!--para>
+ <title> < rich:panelBar > <emphasis
role="since">
+ <superscript> available since <emphasis
role="version">3.0.0</emphasis>
+ </superscript>
+ </emphasis>
+ </title>
+ <section>
+ <title>Description</title>
+ <para>
+ The component is used for grouping any content which is loaded on the
client side and appears as groups divided on child panels after the header is
clicked.</para>
+ <figure>
+ <title>
+ <emphasis role="bold">
+
<property><rich:panelBar></property>
+ </emphasis> with content inside</title>
+ <mediaobject>
+ <imageobject>
+ <imagedata
fileref="images/panelBar_init.png"/>
+ </imageobject>
+ </mediaobject>
+ </figure>
+ </section>
+ <section>
+ <title>Key Features</title>
+ <itemizedlist>
+ <listitem>
+ <para>May have any content inside</para>
+ </listitem>
+ <listitem>
+ <para>Has customizable look and feel</para>
+ </listitem>
+ </itemizedlist>
+ </section>
+ <section>
+ <title>Details of Usage</title>
+ <para>
+ The component groups page contents into notional blocks.
+ Borders separate this content visually from the rest of page.
+ The <emphasis
role="bold"><property><rich:panelBar></property></emphasis>
could contain any number of items (<emphasis
role="bold"><property><rich:panelBarItem></property></emphasis>
inside),
+ with their own headers that control opening and closing features.
+ </para>
+ <para>
+ In contrast to <emphasis
role="bold"><property><rich:panel></property></emphasis>
the component has
<emphasis><property>"width"</property></emphasis>
+ and
<emphasis><property>"height"</property></emphasis>
attributes that control it size (by default thaey both has 100%).
+ </para>
+
+
+
+ <!--para>
The <emphasis>
<property>"label"</property>
</emphasis> attribute is a generic attribute.
@@ -66,99 +60,179 @@
for <code>"ShortConverter.SHORT"</code>.
</para-->
- </section>
- <section>
- <title>Reference Data</title>
- <para>
- <ulink url="&tlddoc;rich/panelBar.html">Table of
- <rich:panelBar>
- attributes</ulink>.
- </para>
- <table>
- <title>Component Identification Parameters </title>
- <tgroup cols="2">
- <thead>
- <row>
- <entry>Name</entry>
- <entry>Value</entry>
- </row>
- </thead>
- <tbody>
- <row>
- <entry>component-type</entry>
- <entry>org.richfaces.PanelBar</entry>
- </row>
- <row>
- <entry>component-class</entry>
- <entry>org.richfaces.component.html.HtmlPanelBar</entry>
- </row>
- <row>
- <entry>component-family</entry>
- <entry>org.richfaces.PanelBar</entry>
- </row>
- <row>
- <entry>renderer-type</entry>
- <entry>org.richfaces.PanelBarRenderer</entry>
- </row>
- <row>
- <entry>tag-class</entry>
- <entry>org.richfaces.taglib.PanelBarTag</entry>
- </row>
- </tbody>
- </tgroup>
- </table>
- <table id="tab_pB">
- <title>Class name that define a component appearance</title>
- <tgroup cols="2">
- <thead>
- <row>
- <entry>Class name</entry>
- <entry>Class description</entry>
- </row>
- </thead>
- <tbody>
- <row>
- <entry>rich-panelbar</entry>
- <entry>Defines styles for a wrapper <div>
element of a
- component</entry>
- </row>
- </tbody>
- </tgroup>
- </table>
- <table>
- <title>Style component classes</title>
- <tgroup cols="2">
- <thead>
- <row>
- <entry>A class attribute</entry>
- <entry>A component element defined by an
attribute</entry>
- </row>
- </thead>
- <tbody>
- <row>
- <entry>styleClass</entry>
- <entry>Applicable to a whole component (together with
headers)</entry>
- </row>
- <row>
- <entry>headerClass</entry>
- <entry>Applicable to a header element</entry>
- </row>
- <row>
- <entry>contentClass</entry>
- <entry>Applicable to a content </entry>
- </row>
- </tbody>
- </tgroup>
- </table>
- You can find all necessary information about style classes redefinition in
- <link linkend="customstyles">Definition of Custom Style
Classes</link>
- section.
- </section>
- <section>
- <title>Relevant Resources Links</title>
- <para>
- <ulink
url="http://livedemo.exadel.com/richfaces-demo/richfaces/panelBar.js...
the component LiveDemo page</ulink> you can see the example of <emphasis
role="bold">
- <property><rich:panelBar></property>
- </emphasis> usage and sources for the given example. </para>
- </section>
-</section>
\ No newline at end of file
+ </section>
+ <section>
+ <title>Reference Data</title>
+ <para>
+ <ulink url="&tlddoc;rich/panelBar.html">Table of
<rich:panelBar> attributes</ulink>. </para>
+ <table>
+ <title>Component Identification Parameters </title>
+ <tgroup cols="2">
+ <thead>
+ <row>
+ <entry>Name</entry>
+ <entry>Value</entry>
+ </row>
+ </thead>
+ <tbody>
+ <row>
+ <entry>component-type</entry>
+ <entry>org.richfaces.PanelBar</entry>
+ </row>
+ <row>
+ <entry>component-class</entry>
+
<entry>org.richfaces.component.html.HtmlPanelBar</entry>
+ </row>
+ <row>
+ <entry>component-family</entry>
+ <entry>org.richfaces.PanelBar</entry>
+ </row>
+ <row>
+ <entry>renderer-type</entry>
+
<entry>org.richfaces.PanelBarRenderer</entry>
+ </row>
+ <row>
+ <entry>tag-class</entry>
+
<entry>org.richfaces.taglib.PanelBarTag</entry>
+ </row>
+ </tbody>
+ </tgroup>
+ </table>
+ <table id="tab_pB">
+ <title>Style classes (selectors) and mapped skin
parameters</title>
+ <tgroup cols="2">
+ <thead>
+ <row>
+ <entry>Class name</entry>
+ <entry>Description</entry>
+ <entry>Skin parameter</entry>
+ <entry>CSS property</entry>
+ </row>
+ </thead>
+ <tbody>
+ <row>
+ <entry>.rich-panelbar</entry>
+ <entry>Defines styles for wrapper
<div> element of a component</entry>
+ <entry>headerBackgroundColor</entry>
+ <entry>border-color</entry>
+ </row>
+ <row>
+ <entry
morerows="2">.rich-panelbar-content</entry>
+ <entry morerows="2">Defines styles
for panelBar content</entry>
+ <entry>preferableDataFamilyFont</entry>
+ <entry>font-family</entry>
+ </row>
+ <row>
+ <entry>preferableDataSizeFont</entry>
+ <entry>font-size</entry>
+ </row>
+ <row>
+ <entry>generalTextColor</entry>
+ <entry>color</entry>
+ </row>
+ <row>
+ <entry
morerows="4">.rich-panelbar-header</entry>
+ <entry morerows="4">Defines styles
for panelBar header</entry>
+ <entry>headerBackgroundColor</entry>
+ <entry>background-color</entry>
+ </row>
+ <row>
+ <entry>headerFamilyFont</entry>
+ <entry>font-family</entry>
+ </row>
+ <row>
+ <entry>headerSizeFont</entry>
+ <entry>font-size</entry>
+ </row>
+ <row>
+ <entry>headerWeightFont</entry>
+ <entry>font-weight</entry>
+ </row>
+ <row>
+ <entry>headerTextColor</entry>
+ <entry>color</entry>
+ </row>
+
+ <row>
+ <entry
morerows="4">.rich-panelbar-header-act</entry>
+ <entry morerows="4">Defines styles
for panelBar active header</entry>
+ <entry>headerBackgroundColor</entry>
+ <entry>background-color</entry>
+ </row>
+ <row>
+ <entry>headerFamilyFont</entry>
+ <entry>font-family</entry>
+ </row>
+ <row>
+ <entry>headerSizeFont</entry>
+ <entry>font-size</entry>
+ </row>
+ <row>
+ <entry>headerWeightFont</entry>
+ <entry>font-weight</entry>
+ </row>
+ <row>
+ <entry>headerTextColor</entry>
+ <entry>color</entry>
+ </row>
+ <row>
+ <entry>.rich-panelbar-interior</entry>
+ <entry>Defines styles for panelBar
content</entry>
+ <entry>generalBackgroundColor</entry>
+ <entry>background-color</entry>
+ </row>
+
+ </tbody>
+ </tgroup>
+ </table>
+
+ <table>
+ <title>Internal style classes (selectors)</title>
+ <tgroup cols="2">
+ <thead>
+ <row>
+ <entry>Class name (selector)</entry>
+ <entry>Description</entry>
+ </row>
+ </thead>
+ <tbody>
+ <row>
+ <entry>.rich-panel-b</entry>
+ <entry>Defines styles for panelBar
content</entry>
+ </row>
+ <row>
+ <entry>.rich-panelbar-content</entry>
+ <entry>Defines styles for panelBar
content</entry>
+ </row>
+ <row>
+ <entry>.rich-panel-header</entry>
+ <entry>Defines styles for active header
element</entry>
+ </row>
+ <row>
+ <entry>.rich-panel-header-act</entry>
+ <entry>Defines styles for header
element</entry>
+ </row>
+ <row>
+ <entry>.rich-panelbar-interior</entry>
+ <entry>Defines styles for panelBar
content</entry>
+ </row>
+
+ </tbody>
+ </tgroup>
+ </table>
+
+ <para>
+ You can find all necessary information about style classes redefinition
in <link linkend="customstyles">Definition of Custom Style
Classes</link> section.
+ </para>
+ </section>
+
+ <section>
+ <title>Relevant Resources Links</title>
+ <para>
+ Visit <ulink
url="http://livedemo.exadel.com/richfaces-demo/richfaces/panelBar.js...
page</ulink> at RichFaces LiveDemo for examples of component usage and their
sources.
+ </para>
+ <para>
+ If you have any questions or ideas regarding the <emphasis
role="bold"><property><rich:panel></property></emphasis>
tell about them at the <ulink
url="http://www.jboss.com/index.html?module=bb&op=viewtopic&...
Users Forum</ulink>.
+ </para>
+ </section>
+</section>