[richfaces-svn-commits] JBoss Rich Faces SVN: r4404 - trunk/docs/userguide/en/src/main/docbook/included.
richfaces-svn-commits at lists.jboss.org
richfaces-svn-commits at lists.jboss.org
Sat Dec 1 09:29:16 EST 2007
Author: artdaw
Date: 2007-12-01 09:29:16 -0500 (Sat, 01 Dec 2007)
New Revision: 4404
Modified:
trunk/docs/userguide/en/src/main/docbook/included/orderingList.xml
Log:
RF-1184 - fix the Deatils of Usage section of the orderingList component, add screenshot
Modified: trunk/docs/userguide/en/src/main/docbook/included/orderingList.xml
===================================================================
--- trunk/docs/userguide/en/src/main/docbook/included/orderingList.xml 2007-12-01 14:28:45 UTC (rev 4403)
+++ trunk/docs/userguide/en/src/main/docbook/included/orderingList.xml 2007-12-01 14:29:16 UTC (rev 4404)
@@ -62,8 +62,7 @@
<h:inputText value="#{item.name}" />
</rich:column>
<rich:orderingList>
-...
-]]></programlisting>
+...]]></programlisting>
</section>
<section>
<title>Creating the Component Dynamically Using Java</title>
@@ -74,8 +73,7 @@
<programlisting role="JAVA"><![CDATA[import org.richfaces.component.html.OrderingList;
...
HtmlOrderingList myOrderingList = new HtmlOrderingList();
-...
-]]></programlisting>
+...]]></programlisting>
</section>
<section>
<title>Details of Usage</title>
@@ -96,27 +94,27 @@
<!-- attributes of component orderingList -->
- <para> The <property>
- <emphasis>"value"</emphasis>
- </property> and <property>
- <emphasis>"var"</emphasis>
- </property> attributes are used to access the values of a list. </para>
+ <para> The <emphasis>
+ <property> "value"</property>
+ </emphasis> and <emphasis>
+ <property>"var" </property>
+ </emphasis> attributes are used to access the values of a list. </para>
- <para>The <property>
- <emphasis>"selection"</emphasis>
- </property> attribute is bound to a list, which stores a set of indexes for rows
+ <para>The <emphasis>
+ <property>"selection" </property>
+ </emphasis> attribute is bound to a list, which stores a set of indexes for rows
selected. If the index from a set is out of bounds, it should be ignored. </para>
- <para>Controls rendering is based on the<property>
- <emphasis>"controlsType"</emphasis>
- </property> attribute. Possible types are button, link, none.</para>
+ <para>Controls rendering is based on the <emphasis>
+ <property>"controlsType" </property>
+ </emphasis> attribute. Possible types are button, link, none.</para>
<para>
<emphasis role="bold">Example:</emphasis>
</para>
<programlisting role="XML"><![CDATA[...
-<rich:orderingList value="#{bean.simpleItems}" var="item" selection="#{bean.selection}" controlsType="link">
+<rich:orderingList value="#{bean.simpleItems}" var="item" selection="#{bean.selection}" controlsType="button">
<rich:column>
<f:facet name="header">
- <h:outputText value="Name" />
+ <h:outputText value="Cars" />
</f:facet>
<h:outputText value="#{item}" />
</rich:column>
@@ -127,14 +125,12 @@
<property><rich:orderingList></property>
</emphasis> component provides to use optional<emphasis>
<property>"caption"</property>
- </emphasis>, <property>
- <emphasis>"header"</emphasis>
- </property>(It's possible to define facet. It has two possible types of
- representation: sortable and non-sortable) and <property>
- <emphasis>"footer"</emphasis>
- </property> facets. </para>
+ </emphasis>, <emphasis>
+ <property>"header" </property>
+ </emphasis>(It's possible to define facet. It has two possible types of
+ representation: sortable and non-sortable) facets. </para>
- <!-- add screenshot-->
+ <!-- ADD SCREENSHOT-->
<para>Simple example is placed below.</para>
@@ -142,49 +138,53 @@
<emphasis role="bold">Example:</emphasis>
</para>
<programlisting role="XML"><![CDATA[...
-<rich:orderingList value="#{bean.simpleItems}" var="item" controlsType="link">
+<rich:orderingList value="#{bean.simpleItems}" var="item" controlsType="button" selection="#{bean.selection}">
<f:facet name="caption">
- <h:outputText value="Caption" />
+ <h:outputText value="Optional Caption Facet" />
</f:facet>
<h:outputText value="#{item}" />
<rich:column>
<f:facet name="header">
- <h:outputText value="Name" />
+ <h:outputText value="Cars" />
</f:facet>
- <h:outputText value="#{item}" />
+ <h:outputText value="#{item.name}" />
</rich:column>
+ <rich:column>
+ <f:facet name="header">
+ <h:outputText value="Price" />
+ </f:facet>
+ <h:outputText value="#{item.price}" />
+ </rich:column>
</rich:orderingList>
...]]></programlisting>
<!-- ordering control set-->
<para>The <emphasis role="bold">
<property><rich:orderingList></property>
- </emphasis> component provides the possibility to use <property>
- <emphasis>"ordering controls set"</emphasis>
- </property>, which performs reordering. Every control has possibility to be disabled. </para>
+ </emphasis> component provides the possibility to use <property>ordering controls set</property>, which performs reordering. Every control has possibility to be disabled. </para>
<para>
- <property>
- <emphasis>"topControl"</emphasis>
- </property>, <property>
- <emphasis>"topControlDisabled"</emphasis>
- </property>, <property>
- <emphasis>"bottomControl"</emphasis>
- </property>, <property>
- <emphasis>"bottomControlDisabled"</emphasis>
- </property>, <property>
- <emphasis>"upControl"</emphasis>
- </property>, <property>
- <emphasis>"upControlDisabled"</emphasis>
- </property>, <property>
- <emphasis>"downControl"</emphasis>
- </property>, <property>
- <emphasis>"downControlDisabled"</emphasis>
- </property> facets are used to replaces the default control with facets content. </para>
+ <emphasis>
+ <property> "topControl" </property>
+ </emphasis>, <emphasis>
+ <property>"topControlDisabled"</property>
+ </emphasis> , <emphasis>
+ <property> "bottomControl"</property>
+ </emphasis> , <emphasis>
+ <property> "bottomControlDisabled" </property>
+ </emphasis>, <emphasis>
+ <property> "upControl" </property>
+ </emphasis>, <emphasis>
+ <property> "upControlDisabled" </property>
+ </emphasis>, <emphasis>
+ <property> "downControl"</property>
+ </emphasis> , <emphasis>
+ <property> "downControlDisabled" </property>
+ </emphasis> facets are used to replaces the default control with facets content. </para>
<para>
<emphasis role="bold">Example:</emphasis>
</para>
- <programlisting role="XML"><![CDATA[...
-<rich:orderingList value="#{demoBean.items}" var="item" selection="#{bean.selection}" controlType="button">
+ <programlisting role="XML"><![CDATA[...
+<rich:orderingList value="#{bean.simpleItems}" var="item" controlsType="button" selection="#{bean.selection}">
<f:facet name="topControl">
<h:outputText value="Move to top">
</f:facet>
@@ -198,40 +198,35 @@
<h:outputText value="Move to bottom">
</f:facet>
<rich:orderingList>
-...
-]]></programlisting>
+...]]></programlisting>
-
-
-
-
<para>The position of the controls relatively to a list could be customized with <itemizedlist>
<listitem>
- <property>
- <emphasis>controlsPosition</emphasis>
- </property>attribute. Possible values: <itemizedlist>
+ <emphasis>
+ <property>"controlsPosition"</property>
+ </emphasis> attribute. Possible values: <itemizedlist>
<listitem>left - controls could be rendered to the left side of a list</listitem>
- <listitem>right(default) controls could be rendered to the right side of a
+ <listitem>right(default) - controls could be rendered to the right side of a
list </listitem>
<listitem>top - controls could be rendered above the list </listitem>
<listitem>bottom - controls could be rendered below the list </listitem>
</itemizedlist>
</listitem>
- <listitem><property>
- <emphasis>controlsHorizontalAlign</emphasis>
- </property>attribute. Possible values: <itemizedlist>
+ <listitem><emphasis>
+ <property> "controlsHorizontalAlign"</property>
+ </emphasis> attribute. Possible values: <itemizedlist>
<listitem>left - controls could be rendered to the left side of a list</listitem>
- <listitem>right(default) controls could be rendered to the right side of a
+ <listitem>right(default) - controls could be rendered to the right side of a
list</listitem>
<listitem>center - controls could be centered</listitem>
</itemizedlist>
</listitem>
- <listitem><property>
- <emphasis>controlsVerticalAlign </emphasis>
- </property>attribute. Possible values: <itemizedlist>
+ <listitem><emphasis>
+ <property> "controlsVerticalAlign" </property>
+ </emphasis> attribute. Possible values: <itemizedlist>
<listitem>top - controls could be rendered aligned to top side of a list </listitem>
<listitem>bottom - controls could be rendered aligned to bottom side of a
list </listitem>
@@ -241,15 +236,14 @@
</itemizedlist>
</listitem>
- <listitem><property>
- <emphasis>controlsLayout </emphasis>
- </property>attribute. Possible values: <itemizedlist>
+ <listitem><emphasis>
+ <property>"controlsLayout"</property>
+ </emphasis> attribute. Possible values: <itemizedlist>
<listitem>inline - controls defined one by one in line </listitem>
<listitem>block - controls defined in column </listitem>
<listitem/>
</itemizedlist>
</listitem>
-
</itemizedlist>
</para>
@@ -257,21 +251,21 @@
<property><rich:orderingList></property>
</emphasis> component has a possibility to hide any of the controls by pairs using
following attributes: <itemizedlist>
- <listitem><property>
- <emphasis>"orderControlsVisible"</emphasis>
- </property>attribute may have two values: true or false. If false
- "Up" and "Down" controls couldn't be
+ <listitem>
+ <emphasis>
+ <property>"orderControlsVisible"</property>
+ </emphasis> attribute may have two values: true or false. If false
+ <property>Up</property> and <property>Down</property> controls couldn't be
displayed.</listitem>
- <listitem><property>
- <emphasis>"fastOrderControlsVisible"</emphasis>
- </property>attribute may have two values: true or false. If false
- "Top" and "Bottom" controls couldn't be
- displayed</listitem>
+ <listitem>
+ <emphasis>
+ <property>"fastOrderControlsVisible"</property>
+ </emphasis> attribute may have two values: true or false. If false
+ <property>Top</property> and <property>Bottom</property> controls couldn't be
+ displayed.</listitem>
</itemizedlist>
</para>
-
-
<para>The component provides possibility to be customized using templating. The
customization could be performed by a layout definition nested into the component. 5
elements are provided to be defined inside template: {list}, {topControl},
@@ -280,7 +274,6 @@
</para>
<para>Example:</para>
<programlisting role="XML"><![CDATA[...
-
<rich:orderingList>
<h:panelGrid columns="2" columnClasses="class1 class2">
<h:outputText value="{list}"/>
@@ -292,25 +285,24 @@
</h:panelGroup>
</h:panelGrid>
</rich:orderingList>
-
- ...]]>
+...]]>
</programlisting>
<para>The <emphasis role="bold">
- <property><rich:orderingList></property>
- </emphasis> component provides the possibility to be customized using templating. The
+ <property><rich:orderingList></property>
+ </emphasis> component provides the possibility to be customized using templating. The
customization could be performed by layout definition nested to component.</para>
<para>5 elements could be provided to be defined inside template (all standard controls
- should also possible to use inside): list, topcontrol, bottomControl, downCotrol, upControl.</para>
- <para>The markup defined in the initial picture could be defined as in the following example.</para>
+ should also possible to use inside): list, topcontrol, bottomControl, downCotrol,
+ upControl.</para>
+ <para>The markup defined in the initial picture could be defined as in the following
+ example.</para>
<para>
<emphasis role="bold">Example:</emphasis>
</para>
<programlisting role="XML"><![CDATA[...
<rich:orderingList>
- <!-- All the columns-->
- ...
- <!-- All the columns-->
- <h:panelGrid columns="2" columnClasses="class1 class2">
+...
+ <h:panelGrid columns="2" columnClasses="class1 class2">
<h:outputText value="{list}"/>
<h:panelGroup>
<h:outputText value="{topControl}"/>
@@ -320,16 +312,11 @@
</h:panelGroup>
</h:panelGrid>
</rich:orderingList>
-
-...
-]]></programlisting>
-
-
+...]]></programlisting>
</section>
- <para>Keyboard usage</para>
<table>
- <title>Keyboard usage for elements selection TO DO</title>
+ <title>Keyboard usage for elements selection</title>
<tgroup cols="2">
<thead>
<row>
@@ -399,12 +386,12 @@
<para>All the changes uses the same rules that defined in requirement for ordering with
controls.</para>
- <section>
+ <section>
<title>JavaScript API</title>
<para> Controls are accessible for developer on client-side using controls attribute of
JavaScript component instance. The value of the attribute is an associative array of
- controls keyed by the following strings: "top",
- "up", "down", "bottom".</para>
+ controls keyed by the following strings: <property>top</property>,
+ <property>up</property>, <property>down</property>, <property>bottom</property>.</para>
<table>
<title>JavaScript API</title>
<tgroup cols="3">
@@ -521,15 +508,7 @@
<para>On the screenshot there are classes names that define styles for component elements.</para>
- <!-- screenshot -->
- <figure>
- <title>Style classes</title>
- <mediaobject>
- <imageobject>
- <imagedata fileref="" scalefit="1"/>
- </imageobject>
- </mediaobject>
- </figure>
+ <!-- ADD SCREENSHOT -->
<table>
<title>Classes names that define a rows representations</title>
@@ -628,13 +607,14 @@
</tgroup>
</table>
<para>In order to redefine styles for all <emphasis role="bold">
- <property><rich:orderingList></property>
- </emphasis> components on a page using CSS, it's enough to create classes with the same names and define necessary properties in them.
- </para>
- <para>To change styles of particular <emphasis role="bold">
<property><rich:orderingList></property>
- </emphasis> components, define your own style classes in the corresponding <emphasis role="bold">
+ </emphasis> components on a page using CSS, it's enough to create classes with the same
+ names and define necessary properties in them. </para>
+ <para>To change styles of particular <emphasis role="bold">
<property><rich:orderingList></property>
+ </emphasis> components, define your own style classes in the corresponding <emphasis
+ role="bold">
+ <property><rich:orderingList></property>
</emphasis> component attributes.</para>
</section>
</section>
More information about the richfaces-svn-commits
mailing list