Author: vkorluzhenko Date: 2007-07-16 08:53:19 -0400 (Mon, 16 Jul 2007) New Revision: 1628 Modified: trunk/docs/userguide/en/src/main/docbook/included/panel.xml trunk/docs/userguide/en/src/main/docbook/included/panelBarItem.xml trunk/docs/userguide/en/src/main/docbook/included/tab.xml Log: http://jira.jboss.com/jira/browse/RF-335 Modified: trunk/docs/userguide/en/src/main/docbook/included/panel.xml =================================================================== --- trunk/docs/userguide/en/src/main/docbook/included/panel.xml 2007-07-16 10:45:44 UTC (rev 1627) +++ trunk/docs/userguide/en/src/main/docbook/included/panel.xml 2007-07-16 12:53:19 UTC (rev 1628) @@ -141,6 +141,21 @@ <listitem> onmouseout </listitem> <listitem> etc. </listitem> </itemizedlist> + + <!--<para>The &quot;header&quot; attribute defines text to be represented. If you can use the + &quot;header&quot; facet, you can even not use the &quot;header&quot; attribute.</para> + <emphasis role="bold">Example:</emphasis> + <programlisting role="XML"><![CDATA[... + <rich:panel> + <f:facet name="header"> + <h:graphicImage value="/images/img1.gif"/> + </f:facet> + ... + <Any Content inside> + ... + </rich:panel> +... +]]></programlisting>--> </section> <section> Modified: trunk/docs/userguide/en/src/main/docbook/included/panelBarItem.xml =================================================================== --- trunk/docs/userguide/en/src/main/docbook/included/panelBarItem.xml 2007-07-16 10:45:44 UTC (rev 1627) +++ trunk/docs/userguide/en/src/main/docbook/included/panelBarItem.xml 2007-07-16 12:53:19 UTC (rev 1628) @@ -1,47 +1,47 @@ <?xml version='1.0' encoding='UTF-8'?> <section> -<sectioninfo> -<keywordset> -<keyword>item</keyword> -<keyword>rich:panelbaritem</keyword> -<keyword>HtmlPanelBar</keyword> -</keywordset> -</sectioninfo> - - <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.PanelBarItem</entry> - </row> - <row> - <entry>component-class</entry> - <entry>org.richfaces.component.html.HtmlPanelBarItem</entry> - </row> - <row> - <entry>component-family</entry> - <entry>org.richfaces.PanelBarItem</entry> - </row> - <row> - <entry>renderer-type</entry> - <entry>org.richfaces.PanelBarItemRenderer</entry> - </row> - <row> - <entry>tag-class</entry> - <entry>org.richfaces.taglib.PanelBarItemTag</entry> - </row> - </tbody> - </tgroup> - </table> - + <sectioninfo> + <keywordset> + <keyword>item</keyword> + <keyword>rich:panelbaritem</keyword> + <keyword>HtmlPanelBar</keyword> + </keywordset> + </sectioninfo> + + <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.PanelBarItem</entry> + </row> + <row> + <entry>component-class</entry> + <entry>org.richfaces.component.html.HtmlPanelBarItem</entry> + </row> + <row> + <entry>component-family</entry> + <entry>org.richfaces.PanelBarItem</entry> + </row> + <row> + <entry>renderer-type</entry> + <entry>org.richfaces.PanelBarItemRenderer</entry> + </row> + <row> + <entry>tag-class</entry> + <entry>org.richfaces.taglib.PanelBarItemTag</entry> + </row> + </tbody> + </tgroup> + </table> + <section> <title>Creating the Component with a Page Tag</title> <para>Here is a simple example as it might be used in a page: </para> @@ -75,38 +75,52 @@ </section> <section> <title>Details of Usage</title> - <para>As it was mentioned above, <property>panelBarItem</property> is used for grouping any content - inside within one <property>panelBar</property>, thus its customization deals only with specification of sizes and styles for rendering.</para> - <para>The only attribute to describe here is - <emphasis - -><property>&quot;label&quot;</property></emphasis> that specifies a text string in a component header.</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>As it was mentioned above, <property>panelBarItem</property> is used for grouping any + content inside within one <property>panelBar</property>, thus its customization deals only + with specification of sizes and styles for rendering.</para> + <para>The &quot;label&quot; attribute defines text to be represented. If you can use the + &quot;label&quot; facet, you can even not use the &quot;label&quot; attribute.</para> + <emphasis role="bold">Example:</emphasis> + <programlisting role="XML"><![CDATA[... + <rich:panelBarItem...> + <f:facet name="label"> + <h:graphicImage value="/images/img1.gif"/> + </f:facet> + ... + <!--Any Content inside--> + ... + </rich:panelBarItem> +... +]]></programlisting> + <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> </section> - <section> + <section> <title>Look-and-Feel Customization</title> - <para>For skinnability implementation the components use a <emphasis -><property>style class redefinition method</property></emphasis>.</para> - <para>Default style classes are mapped on <emphasis -><property>skin parameters</property>.</emphasis></para> - <para>To redefine appearance of all panelBarItem at once, there are two ways:</para> - <itemizedlist> - <listitem>to redefine corresponding skin parameters</listitem> - <listitem>to add <emphasis -><property>style classes</property></emphasis> used by the panelBarItem to your page style sheets</listitem> - </itemizedlist> - </section> - <section> - <title>Skin parameters redefinition</title> -<table> - <title>Skin parameters for the panel content appearance</title> + <para>For skinnability implementation the components use a <emphasis> + <property>style class redefinition method</property> + </emphasis>.</para> + <para>Default style classes are mapped on <emphasis><property>skin + parameters</property>.</emphasis></para> + <para>To redefine appearance of all panelBarItem at once, there are two ways:</para> + <itemizedlist> + <listitem>to redefine corresponding skin parameters</listitem> + <listitem>to add <emphasis> + <property>style classes</property> + </emphasis> used by the panelBarItem to your page style sheets</listitem> + </itemizedlist> + </section> + <section> + <title>Skin parameters redefinition</title> + <table> + <title>Skin parameters for the panel content appearance</title> <tgroup cols="2"> - <thead> - <row> - <entry>Skin parameters for a hint</entry> - <entry>CSS properties</entry> - </row> + <thead> + <row> + <entry>Skin parameters for a hint</entry> + <entry>CSS properties</entry> + </row> </thead> <tbody> <row> @@ -117,21 +131,21 @@ <entry>generalBackgroundColor</entry> <entry>background-color</entry> </row> - <row> + <row> <entry>border</entry> <entry>tableBorderColor</entry> </row> </tbody> </tgroup> </table> - <table> - <title>Parameters for panel header appearance</title> + <table> + <title>Parameters for panel header appearance</title> <tgroup cols="2"> - <thead> - <row> - <entry>Skin parameters</entry> - <entry>CSS properties</entry> - </row> + <thead> + <row> + <entry>Skin parameters</entry> + <entry>CSS properties</entry> + </row> </thead> <tbody> <row> @@ -141,26 +155,27 @@ </tbody> </tgroup> </table> - </section> - <section> + </section> + <section> <title>Definition custom style classes:</title> - <figure> - <title>PanelBarItem style classes</title> - <mediaobject> + <figure> + <title>PanelBarItem style classes</title> + <mediaobject> <imageobject> - <imagedata fileref="images/panelBar3.gif"/> + <imagedata fileref="images/panelBar3.gif"/> </imageobject> - </mediaobject> - </figure> -<para>There are two predefined classes for the <property>panelBarItem</property> shown on the screenshot and described in the table below</para> - <table> - <title>Predefined component skin class</title> + </mediaobject> + </figure> + <para>There are two predefined classes for the <property>panelBarItem</property> shown on the + screenshot and described in the table below</para> + <table> + <title>Predefined component skin class</title> <tgroup cols="2"> - <thead> - <row> - <entry>Class name</entry> - <entry>Class description</entry> - </row> + <thead> + <row> + <entry>Class name</entry> + <entry>Class description</entry> + </row> </thead> <tbody> <row> @@ -174,19 +189,18 @@ </tbody> </tgroup> </table> - <para>It&apos;s necessary to define a class according to the corresponding name, so as an - -appearance of all <property>panelBarItems</property> on a page is changed at once.</para> - <para>To change style peculiarities of the particular <property>panelBarItems</property>, - define your own style classes in the corresponding <property>panelBarItems</property> attributes.</para> -<table> - <title>Style component classes</title> + <para>It&apos;s necessary to define a class according to the corresponding name, so as an + appearance of all <property>panelBarItems</property> on a page is changed at once.</para> + <para>To change style peculiarities of the particular <property>panelBarItems</property>, define + your own style classes in the corresponding <property>panelBarItems</property> attributes.</para> + <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> + <row> + <entry>A class attribute</entry> + <entry>A component element defined by an attribute</entry> + </row> </thead> <tbody> <row> @@ -200,13 +214,15 @@ </tbody> </tgroup> </table> - <para><emphasis role="bold">Example:</emphasis></para> - <para>CSS code piece used on the page:</para> + <para> + <emphasis role="bold">Example:</emphasis> + </para> + <para>CSS code piece used on the page:</para> <para> <emphasis role="bold">Example:</emphasis> </para> -<programlisting role="XML"><![CDATA[... + <programlisting role="XML"><![CDATA[... .rich-panelbar-header{ font-size:14px; } @@ -215,12 +231,12 @@ } ... ]]></programlisting> -<para>The component is defined in the following way:</para> + <para>The component is defined in the following way:</para> <para> <emphasis role="bold">Example:</emphasis> </para> -<programlisting role="XML"><![CDATA[... + <programlisting role="XML"><![CDATA[... <rich:panelBar> <rich:panelBarItem contentClass="myClass"> ... @@ -228,8 +244,7 @@ </rich:panelBar> ... ]]></programlisting> -<para>Hence, a font size - of all <property>panelBarItem</property> headers is changed on a page as well as a font for the - particular <property>panelBarItem</property> content.</para> + <para>Hence, a font size of all <property>panelBarItem</property> headers is changed on a page + as well as a font for the particular <property>panelBarItem</property> content.</para> + </section> </section> -</section> \ No newline at end of file Modified: trunk/docs/userguide/en/src/main/docbook/included/tab.xml =================================================================== --- trunk/docs/userguide/en/src/main/docbook/included/tab.xml 2007-07-16 10:45:44 UTC (rev 1627) +++ trunk/docs/userguide/en/src/main/docbook/included/tab.xml 2007-07-16 12:53:19 UTC (rev 1628) @@ -73,8 +73,24 @@ <section> <title>Details of Usage</title> <para>The main component function is to define a content group that is rendered and processed when the <property>tab</property> is active, i.e. click on a <property>tab</property> causes switching onto a <property>tab</property> containing content corresponded to this <property>tab</property>.</para> -<para>A marker on a <property>tab</property> header defined with the <emphasis ><property>&quot;label&quot;</property></emphasis> attribute. Moreover, each <property>tab</property> could be disabled (switching on this <property>tab</property> is impossible) with the <emphasis ><property>&quot;disable&quot;</property></emphasis> attribute.</para> + <para>The &quot;label&quot; attribute defines text to be represented. If you can use the + &quot;label&quot; facet, you can even not use the &quot;label&quot; attribute.</para> + <emphasis role="bold">Example:</emphasis> + <programlisting role="XML"><![CDATA[... + <rich:tab> + <f:facet name="label"> + <h:graphicImage value="/images/img1.gif"/> + </f:facet> + ... + <!--Any Content inside--> + ... + </rich:tab> +... +]]></programlisting> + + <para>A marker on a <property>tab</property> header defined with the <emphasis ><property>&quot;label&quot;</property></emphasis> attribute. Moreover, each <property>tab</property> could be disabled (switching on this <property>tab</property> is impossible) with the <emphasis ><property>&quot;disable&quot;</property></emphasis> attribute.</para> + <para> <emphasis role="bold">Example:</emphasis> </para>