[richfaces-svn-commits] JBoss Rich Faces SVN: r629 - trunk/docs/userguide/en/modules.
richfaces-svn-commits at lists.jboss.org
richfaces-svn-commits at lists.jboss.org
Thu May 3 09:12:30 EDT 2007
Author: afedosik
Date: 2007-05-03 09:12:30 -0400 (Thu, 03 May 2007)
New Revision: 629
Removed:
trunk/docs/userguide/en/modules/togglePanel_table.xml
trunk/docs/userguide/en/modules/toolBarGroup_table.xml
trunk/docs/userguide/en/modules/toolBar_table.xml
trunk/docs/userguide/en/modules/treeNode_table.xml
trunk/docs/userguide/en/modules/tree_table.xml
Log:
Deleted: trunk/docs/userguide/en/modules/togglePanel_table.xml
===================================================================
--- trunk/docs/userguide/en/modules/togglePanel_table.xml 2007-05-03 11:01:08 UTC (rev 628)
+++ trunk/docs/userguide/en/modules/togglePanel_table.xml 2007-05-03 13:12:30 UTC (rev 629)
@@ -1,328 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<section id="togglePanel"><?dbhtml filename="togglePanel.html" ?>
- <title><rich:togglePanel></title>
- <sectioninfo>
-
- <keywordset>
-
- <keyword>togglePanel</keyword>
-
- </keywordset>
-
- </sectioninfo>
- <section>
-
- <para>A wrapper component with named facets, where every facet is shown after activation of
- the corresponding <property>toggleControl</property>
- (the other is hidden).</para>
-
- <figure>
-
- <title>TogglePanel component</title>
-
- <mediaobject>
-
- <imageobject>
-
- <imagedata fileref="images/togglePanel.gif"/>
-
- </imageobject>
-
- </mediaobject>
-
- </figure>
-
- </section>
- <section>
-
- <title>Key Features</title>
-
- <itemizedlist>
-
- <listitem>Support for any content inside</listitem>
-
- <listitem>Three modes of facets switching
- <itemizedlist>
-
- <listitem>Server</listitem>
-
- <listitem>Client</listitem>
-
- <listitem>Ajax</listitem>
-
- </itemizedlist>
-
- </listitem>
-
- <listitem>Controls for <property>togglePanel</property> can be everywhere in layout</listitem>
-
- </itemizedlist>
-
- </section>
- <table>
- <title>rich:togglePanel attributes</title>
- <tgroup cols="2">
- <thead>
- <row>
- <entry>Attribute Name</entry>
- <entry>Description</entry>
- </row>
- </thead>
- <tbody>
- <row>
- <entry>binding</entry>
- <entry>The attribute takes a value-binding expression for a component property of
-a backing bean</entry>
- </row>
- <row>
- <entry>converter</entry>
- <entry>converter</entry>
- </row>
- <row>
- <entry>id</entry>
- <entry>Every component may have a unique id that is automatically created if
- omitted</entry>
- </row>
- <row>
- <entry>immediate</entry>
- <entry>immediate</entry>
- </row>
- <row>
- <entry>initialState</entry>
- <entry>It contains a name of the first active facet</entry>
- </row>
- <row>
- <entry>rendered</entry>
- <entry>If "false", this component is rendered.</entry>
- </row>
- <row>
- <entry>required</entry>
- <entry>required</entry>
- </row>
- <row>
- <entry>stateOrder</entry>
- <entry>Names of the facets in the switching order. If
- ToggleControl doesn't contain information about a next facet to
- be shown it is switched corresponding to this
- attribute</entry>
- </row>
- <row>
- <entry>switchType</entry>
- <entry>Facets switch algorithm: "client", "server"(default), "ajax".</entry>
- </row>
- <row>
- <entry>valid</entry>
- <entry>valid</entry>
- </row>
- <row>
- <entry>validator</entry>
- <entry>validator</entry>
- </row>
- <row>
- <entry>value</entry>
- <entry>The initial value to set when rendered for the first time.
- It contains information about an active facet</entry>
- </row>
- <row>
- <entry>valueChangeListener</entry>
- <entry>valueChangeListener</entry>
- </row>
- </tbody>
- </tgroup>
- </table>
- <sectioninfo>
-
- <keywordset>
-
- <keyword>facet</keyword>
-
- <keyword>rich:togglePanel</keyword>
-
- <keyword>HtmlTogglePanel</keyword>
-
- </keywordset>
-
- </sectioninfo>
- <section>
-
- <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.TogglePanel</entry>
-
- </row>
-
- <row>
-
- <entry>component-class</entry>
-
- <entry>org.richfaces.component.html.HtmlTogglePanel</entry>
-
- </row>
-
- <row>
-
- <entry>component-family</entry>
-
- <entry>org.richfaces.TogglePanel</entry>
-
- </row>
-
- <row>
-
- <entry>renderer-type</entry>
-
- <entry>org.richfaces.TogglePanelRenderer</entry>
-
- </row>
-
- <row>
-
- <entry>tag-class</entry>
-
- <entry>org.richfaces.taglib.TogglePanelTag</entry>
-
- </row>
-
- </tbody>
-
- </tgroup>
-
- </table>
-
- </section>
- <section>
-
- <title>Creating the Component with a Page Tag</title>
-
- <para>To create it on a page, use the following syntax: </para>
-
- <programlisting role="XML">...
- <rich:togglePanel>
- <f:facet name="first">
- ...
- </f:facet>
- <f:facet name="second">
- ...
- </f:facet>
- ...
- </rich:togglePanel>
- ...
- <!--//Set of the toggleControls somewhere on the page.-->
-...
-</programlisting>
-
- </section>
- <section>
-
- <title>Creating the Component Dynamically Using Java</title>
-
- <programlisting role="JAVA">...
-org.richfaces.component.html.HtmlTogglePanel myPanel = new org.richfaces.component.html.HtmlTogglePanel();
-...
-</programlisting>
-
- </section>
- <section>
-
- <title>Details of Usage</title>
-
- <para>As it was mentioned above, <property>togglePanel</property> splits content into named
- facets that rendered and processed when a click performed on controls linked to this <property>togglePanel</property>
- (either switched on the client or send requests on the server for switching).</para>
-
- <para>The initial component state is defined with <emphasis role="italic">
- <property>"initialState"</property>
- </emphasis> attribute, where a facet name that is shown at first is defined.</para>
-
- <note>
- <title>Note:</title>
-It's also possible to define an <property>"empty"</property> facet to implement the functionality as
-drop-down panels have and make the facet active when no content is required to be rendered.</note>
-
- <para>Switching mode could be defined with the <emphasis role="italic">
- <property>"switchType"</property>
- </emphasis> attribute with three possible
- parameters:</para>
-
- <itemizedlist>
-
- <listitem>
- Server (DEFAULT)<para>The common submission is performed around <property>togglePanel</property> and a page is completely rendered on a called panel. Only one at a time panel is uploaded onto the client side.</para>
-
- </listitem>
-
- <listitem>
- Ajax<para>AJAX form submission is performed around the panel, content of the called panel is
- uploaded on an AJAX request and additionally specified elements in the <emphasis role="italic">
- <property>"reRender"</property>
- </emphasis> attribute are rendered. Only one at a time panel is uploaded on the client side.</para>
-
- </listitem>
-
- <listitem>
- Client<para>
- All panels are uploaded on the client side. The switching from the active to the hidden panel
- is performed with client JavaScript.</para>
-
- </listitem>
-
- </itemizedlist>
-
- <para>"Facets" switching order could be defined on
- the side of <emphasis role="bold">
- <property><rich:toggleControl></property>
- </emphasis> component or on the panel. On the side of the togglePanel it's possible to define facets switching order with the <emphasis role="italic">
- <property>"stateOrder"</property>
- </emphasis> attribute. The facets names are enumerated in
- such an order that they are rendered when a control is clicked, as it's not defined where
- to switch beforehand.</para>
-
- <programlisting role="XML"><rich:togglePanel id="panel"
- initialState="panelB" switchType="client"
- stateOrder="panelA,panelB,panelC">
- <f:facet name="panelA">
- ...
- </f:facet>
- <f:facet name="panelB">
- ...
- </f:facet>
- <f:facet name="panelC">
- ...
- </f:facet>
-</rich:togglePanel>
-<rich:toggleControl for="panel" value="Switch"/>
-</programlisting>
-
- <para>The example shows a <property>togglePanel</property> initial state when the second facet (panelB) is rendered and successive switching from the first to the second happens.</para>
-
- </section>
- <section>
-
- <title>Look and Feel Customization</title>
-
- <para>The component doesn't have its own representation rendering only content of its facets, thus all look and feel is set only for content.</para>
-
- </section>
-</section>
\ No newline at end of file
Deleted: trunk/docs/userguide/en/modules/toolBarGroup_table.xml
===================================================================
--- trunk/docs/userguide/en/modules/toolBarGroup_table.xml 2007-05-03 11:01:08 UTC (rev 628)
+++ trunk/docs/userguide/en/modules/toolBarGroup_table.xml 2007-05-03 13:12:30 UTC (rev 629)
@@ -1,379 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<section id="toolBarGroup"><?dbhtml filename="toolBarGroup.html" ?>
- <title><rich:toolBarGroup></title>
- <sectioninfo>
-
- <keywordset>
-
- <keyword>toolBarGroup</keyword>
-
- </keywordset>
-
- </sectioninfo>
- <section>
-
- <para>A group of items inside a tool bar.</para>
-
- <figure>
-
- <title>ToolbarGroup with items on it</title>
-
- <mediaobject>
-
- <imageobject>
-
- <imagedata fileref="images/toolbarGroup.gif"/>
-
- </imageobject>
-
- </mediaobject>
-
- </figure>
-
- </section>
- <section>
-
- <title>Key Features</title>
-
- <itemizedlist>
-
- <listitem>Fully skinnable with its child items</listitem>
-
- <listitem>Grouping bar content</listitem>
-
- <listitem>Easily place content on either side of tool bar using a predefined group layout</listitem>
-
- <listitem>Predefined separators for menu items and groups</listitem>
-
- <listitem>Any content inside</listitem>
-
- </itemizedlist>
-
- </section>
- <table>
- <title>rich:toolBarGroup attributes</title>
- <tgroup cols="2">
- <thead>
- <row>
- <entry>Attribute Name</entry>
- <entry>Description</entry>
- </row>
- </thead>
- <tbody>
- <row>
- <entry>binding</entry>
- <entry>The attribute takes a value-binding expression for a component property of
-a backing bean</entry>
- </row>
- <row>
- <entry>id</entry>
- <entry>Every component may have a unique id that is automatically created if
- omitted</entry>
- </row>
- <row>
- <entry>itemSeparator</entry>
- <entry>"A separator for the items in a group. Possible
- values are "none", "line", "square", "disc" and "grid"."</entry>
- </row>
- <row>
- <entry>location</entry>
- <entry>"A location of a group on a menu bar. Possible values are "left" and "right"."</entry>
- </row>
- <row>
- <entry>rendered</entry>
- <entry>If "false", this component is rendered.</entry>
- </row>
- <row>
- <entry>separatorClass</entry>
- <entry>"A CSS class to be applied to menu bar group separators."</entry>
- </row>
- <row>
- <entry>style</entry>
- <entry>CSS style(s) is/are to be applied when this component is rendered</entry>
- </row>
- <row>
- <entry>styleClass</entry>
- <entry>Corresponds to the HTML class attribute</entry>
- </row>
- </tbody>
- </tgroup>
- </table>
- <sectioninfo>
-
- <keywordset>
-
- <keyword>items</keyword>
-
- <keyword>rich:toolBarGroup</keyword>
-
- <keyword>HtmlToolBarGroup</keyword>
-
- </keywordset>
-
- </sectioninfo>
- <section>
-
- <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.ToolBarGroup</entry>
-
- </row>
-
- <row>
-
- <entry>component-class</entry>
-
- <entry>org.richfaces.component.html.HtmlToolBarGroup</entry>
-
- </row>
-
- <row>
-
- <entry>component-family</entry>
-
- <entry>org.richfaces.ToolBarGroup</entry>
-
- </row>
-
- <row>
-
- <entry>renderer-type</entry>
-
- <entry>org.richfaces.ToolBarGroupRenderer</entry>
-
- </row>
-
- <row>
-
- <entry>tag-class</entry>
-
- <entry>org.richfaces.taglib.ToolBarGroupTag</entry>
-
- </row>
-
- </tbody>
-
- </tgroup>
-
- </table>
-
- </section>
- <section>
-
- <title>Creating the Component with a Page Tag</title>
-
- <para>To create it on a page, use the following syntax: </para>
-
- <programlisting role="XML"><rich:toolBar>
- ...
- <rich:toolBarGroup>
- <!--...Set of action or other JSF components-->
- </rich:toolBarGroup>
- ...
- <rich:toolBarGroup>
- <!--...Set of action or other JSF components-->
- </rich:toolBarGroup>
- ...
-</rich:toolBar>
-</programlisting>
-
- </section>
- <section>
-
- <title>Creating the Component Dynamically Using Java</title>
-
- <programlisting role="JAVA">...
-org.richfaces.component.html.HtmlToolBarGroup myToolBarGroup = new org.richfaces.component.html.HtmlToolBarGroup();
-...
-</programlisting>
-
- </section>
- <section>
-
- <title>Details of Usage</title>
-
- <para>A <property>toolBarGroup</property> is a wrapper component that groups <property>toolBar</property> content and facilitates creation of menu and tool bars. All components defined inside are located on a stylized bar with a possibility to group, arrange on the both bar sides, and place predefined separators between them.</para>
-
- <para>Separators are located between components with the help of the <emphasis role="italic">
- <property>"itemSeparator"</property>
- </emphasis> attribute with four
- predefined values:</para>
-
- <itemizedlist>
-
- <listitem>
- none
- </listitem>
-
- <listitem>
- line
- </listitem>
-
- <listitem>
- square
- </listitem>
-
- <listitem>
- disc
- </listitem>
-
- </itemizedlist>
-
- <para>To control the group location inside, use the <emphasis role="italic">
- <property>"location"</property>
- </emphasis> attribute with left (DEFAULT) and right values.</para>
-
- <para>
- <emphasis role="bold">Example:</emphasis>
- </para>
-
- <programlisting role="XML"><rich:toolBar itemSeparator="disc" width="500">
- <rich:toolBarGroup itemSeparator="line">
- <h:commandLink value="Command 1.1"/>
- <h:commandLink value="Command 2.1"/>
- </rich:toolBarGroup>
- <rich:toolBarGroup itemSeparator="line" location="right">
- <h:commandLink value="Command 1.2"/>
- <h:commandLink value="Command 2.2"/>
- </rich:toolBarGroup>
- </rich:toolBar>
-</programlisting>
-
- <para>The code result is the following:</para>
-
- <figure>
-
- <title>Stylized toolBarGroup</title>
-
- <mediaobject>
-
- <imageobject>
-
- <imagedata fileref="images/toolBar3.gif"/>
-
- </imageobject>
-
- </mediaobject>
-
- </figure>
-
- </section>
- <section>
-
- <title>Look and Feel Customization</title>
-
- <para>For skinnability implementation the components use a <emphasis role="italic">
- <property>style class redefinition method</property>
- </emphasis>.</para>
-
- <para>Default style classes are mapped on <emphasis role="italic">
- <property>skin parameters</property>.</emphasis>
- </para>
-
- <para>To redefine appearance of all toolBarGroups at once, there are two ways:</para>
-
- <itemizedlist>
-
- <listitem>to redefine corresponding skin parameters</listitem>
-
- <listitem>to add <emphasis role="italic">
- <property>style classes</property>
- </emphasis> used by the toolBarGroup to your page stylesheets</listitem>
-
- </itemizedlist>
-
- <table>
-
- <title>Skin parameters redefinition</title>
-
- <tgroup cols="2">
-
- <thead>
-
- <row>
-
- <entry>Skin parameters for the toolBarGroup component</entry>
-
- <entry>Corresponding CSS parameters</entry>
-
- </row>
-
- </thead>
-
- <tbody>
-
- <row>
-
- <entry>headerSizeFont</entry>
-
- <entry>font-size</entry>
-
- </row>
-
- <row>
-
- <entry>headTextColor</entry>
-
- <entry>color</entry>
-
- </row>
-
- <row>
-
- <entry>headerFamilyFont</entry>
-
- <entry>font-family</entry>
-
- </row>
-
- </tbody>
-
- </tgroup>
-
- </table>
-
- </section>
- <section>
-
- <title>Definition custom style classes</title>
-
- <para>On generating, the component substitutes the default class rich-toolbar-item into
- <emphasis role="italic">
- <property>style class</property>
- </emphasis> of a generated component, i.e.
-to redefine at once all <property>toolBarGroups</property> appearance on a page, redefine this class in your CSS.</para>
-
- <para>The component also has the standard attribute style and <emphasis role="italic">
- <property>style class</property>
- </emphasis> that could redefine an
- appearance of particular component variants.
- </para>
-
- <para>It's necessary to define a class according to the corresponding name, so as an
-
-appearance of all <property>toolBarGroups</property> on a page is changed at once.</para>
-
- </section>
-</section>
\ No newline at end of file
Deleted: trunk/docs/userguide/en/modules/toolBar_table.xml
===================================================================
--- trunk/docs/userguide/en/modules/toolBar_table.xml 2007-05-03 11:01:08 UTC (rev 628)
+++ trunk/docs/userguide/en/modules/toolBar_table.xml 2007-05-03 13:12:30 UTC (rev 629)
@@ -1,374 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<section id="toolBar"><?dbhtml filename="toolBar.html" ?>
- <title><rich:toolBar></title>
- <sectioninfo>
-
- <keywordset>
-
- <keyword>toolBar</keyword>
-
- </keywordset>
-
- </sectioninfo>
- <section>
-
- <para>A horizontal bar with Action items on it that accepts any JSF components as children.</para>
-
- <figure>
-
- <title>Toolbar with action items</title>
-
-
- <mediaobject>
-
- <imageobject>
-
- <imagedata fileref="images/toolBarMain.gif"/>
-
- </imageobject>
-
- </mediaobject>
-
- </figure>
-
- </section>
- <section>
-
- <title>Key Features</title>
-
- <itemizedlist>
-
- <listitem>Skinnable menu panel and child items</listitem>
-
- <listitem>Standard top menu bar that can be used in accordance with a menu component</listitem>
-
- <listitem>Grouping bar content</listitem>
-
- <listitem>Easily place content on any side of a menu bar using predefined group layout</listitem>
-
- <listitem>Predefined separators for menu items and groups</listitem>
-
- <listitem>Any content inside</listitem>
-
- </itemizedlist>
-
- </section>
- <table>
- <title>rich:toolBar attributes</title>
- <tgroup cols="2">
- <thead>
- <row>
- <entry>Attribute Name</entry>
- <entry>Description</entry>
- </row>
- </thead>
- <tbody>
- <row>
- <entry>binding</entry>
- <entry>The attribute takes a value-binding expression for a component property of
-a backing bean</entry>
- </row>
- <row>
- <entry>contentClass</entry>
- <entry>A CSS style is to be applied to each element of tool bar content.
- Use this style, for example, to setup parameters of the font.</entry>
- </row>
- <row>
- <entry>contentStyle</entry>
- <entry>A CSS style is to be applied to each element of tool bar content.</entry>
- </row>
- <row>
- <entry>height</entry>
- <entry>A height of a bar in pixels. If a height is not defined,
- a bar height depends of the "headerFontSize" skin parameter.</entry>
- </row>
- <row>
- <entry>id</entry>
- <entry>Every component may have a unique id that is automatically created if
- omitted</entry>
- </row>
- <row>
- <entry>itemSeparator</entry>
- <entry>A separator between items on a bar. Possible values
- are none, line, square, disc and grid.</entry>
- </row>
- <row>
- <entry>rendered</entry>
- <entry>If "false", this component is rendered.</entry>
- </row>
- <row>
- <entry>separatorClass</entry>
- <entry>A CSS class to be applied to menu bar group separators.
- Use this property, for example, to setup parameters of a font.</entry>
- </row>
- <row>
- <entry>style</entry>
- <entry>CSS style(s) is/are to be applied when this component is rendered</entry>
- </row>
- <row>
- <entry>styleClass</entry>
- <entry>Corresponds to the HTML class attribute</entry>
- </row>
- <row>
- <entry>width</entry>
- <entry>A width of a bar that can be defined in pixels or as percentage. The default value is 100%.</entry>
- </row>
- </tbody>
- </tgroup>
- </table>
- <sectioninfo>
-
- <keywordset>
-
- <keyword>bar</keyword>
-
- <keyword>rich:toolBar</keyword>
-
- <keyword>HtmlToolBar</keyword>
-
- </keywordset>
-
- </sectioninfo>
- <section>
-
- <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.ToolBar</entry>
-
- </row>
-
- <row>
-
- <entry>component-class</entry>
-
- <entry>org.richfaces.component.html.HtmlToolBar</entry>
-
- </row>
-
- <row>
-
- <entry>component-family</entry>
-
- <entry>org.richfaces.ToolBar</entry>
-
- </row>
-
- <row>
-
- <entry>renderer-type</entry>
-
- <entry>org.richfaces.ToolBarRenderer</entry>
-
- </row>
-
- <row>
-
- <entry>tag-class</entry>
-
- <entry>org.richfaces.taglib.ToolBarTag</entry>
-
- </row>
-
- </tbody>
-
- </tgroup>
-
- </table>
-
- </section>
- <section>
-
- <title>Creating the Component with a Page Tag</title>
-
- <para>To create it on a page, use the following syntax: </para>
-
- <programlisting role="XML"><rich:toolBar>
- <!--//...Set of action or other JSF components-->
-</rich:toolBar>
-</programlisting>
-
- </section>
- <section>
-
- <title>Creating the Component Dynamically Using Java</title>
-
- <programlisting role="JAVA">...
-org.richfaces.component.html.HtmlToolBar myToolBar = new org.richfaces.component.html.HtmlToolBar();
-...
-</programlisting>
-
- </section>
- <section>
-
- <title>Details of Usage</title>
-
- <para>A <property>toolBar</property> is a wrapper component that facilitates creation of menu and
- <property>tool bars</property>. All components defined inside are located on a stylized bar with possibility to group,
- arrange on the both bar sides, and place predefined separators between them.</para>
-
- <para>Grouping and an input side definition is described for <property>toolBarGroup</property> that defines this
- functionality.</para>
-
- <para>Separators are located between components with the help of the <emphasis role="italic">
- <property>"itemSeparator"</property>
- </emphasis> attribute
- with four predefined values:</para>
-
- <itemizedlist>
-
- <listitem>
- none
- </listitem>
-
- <listitem>
- line
- </listitem>
-
- <listitem>
- square
- </listitem>
-
- <listitem>
- disc
- </listitem>
-
- </itemizedlist>
-
- <para>For example, when settting a separator of a disc type, the following result is produced:</para>
-
- <figure>
-
- <title>Toolbar with a "disc" separator</title>
-
-
- <mediaobject>
-
- <imageobject>
-
- <imagedata fileref="images/toolBar2.gif"/>
-
- </imageobject>
-
- </mediaobject>
-
- </figure>
-
- <para>Moreover, for <property>toolBar</property> style
- <emphasis role="italic">
- <property>"width"</property>
- </emphasis> and <emphasis role="italic">
- <property>"height"</property>
- </emphasis> attributes
- are placed above all.</para>
-
- </section>
- <section>
-
- <title>Look and Feel Customization</title>
-
- <para>For skinnability implementation the components use a <emphasis role="italic">
- <property>style class redefinition method</property>
- </emphasis>.</para>
-
- <para>Default style classes are mapped on <emphasis role="italic">
- <property>skin parameters</property>.</emphasis>
- </para>
-
- <para>To redefine appearance of all toolBars at once, there are two ways:</para>
-
- <itemizedlist>
-
- <listitem>to redefine corresponding skin parameters</listitem>
-
- <listitem>to add <emphasis role="italic">
- <property>style classes</property>
- </emphasis> used by the toolBar to your page stylesheets</listitem>
-
- </itemizedlist>
-
- <table>
-
- <title>Skin parameters redefinition</title>
-
- <tgroup cols="2">
-
- <thead>
-
- <row>
-
- <entry>Skin parameters for the toolbar component</entry>
-
- <entry>Corresponding CSS parameters</entry>
-
- </row>
-
- </thead>
-
- <tbody>
-
- <row>
-
- <entry>tableBorderColor</entry>
-
- <entry>border-color</entry>
-
- </row>
-
- <row>
-
- <entry>headerBackgroundColor</entry>
-
- <entry>background-color</entry>
-
- </row>
-
- </tbody>
-
- </tgroup>
-
- </table>
-
- </section>
- <section>
-
- <title>Definition custom style classes</title>
-
- <para>On generating, the component substitutes the default class rich-toolbar-exterior
- into <emphasis role="italic">
- <property>style class</property>
- </emphasis>
- of a generated component, i.e. to redefine at once all <property>toolBars</property> appearance
- on a page, redefine this class in your CSS.</para>
-
- <para>The component also has the standard attributes <emphasis role="italic">
- <property>"style"</property>
- </emphasis> and
- <emphasis role="italic">
- <property>"styleClass"</property>
- </emphasis> that could redefine an
- appearance of a particular component variants.</para>
-
- </section>
-</section>
\ No newline at end of file
Deleted: trunk/docs/userguide/en/modules/treeNode_table.xml
===================================================================
--- trunk/docs/userguide/en/modules/treeNode_table.xml 2007-05-03 11:01:08 UTC (rev 628)
+++ trunk/docs/userguide/en/modules/treeNode_table.xml 2007-05-03 13:12:30 UTC (rev 629)
@@ -1,559 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<section id="treeNode"><?dbhtml filename="treeNode.html" ?>
- <title><rich:treeNode></title>
- <sectioninfo>
-
- <keywordset>
-
- <keyword>treeNode</keyword>
-
- </keywordset>
-
- </sectioninfo>
- <section>
-
- <para>A component is used for designing templates for nodes definition.</para>
-
- <figure>
-
- <title>TreeNode component</title>
-
- <mediaobject>
-
- <imageobject>
-
- <imagedata fileref="images/tree1.gif"/>
-
- </imageobject>
-
- </mediaobject>
-
- </figure>
-
- </section>
- <section>
-
- <title>Key Features</title>
-
- </section>
- <table>
- <title>rich:treeNode attributes</title>
- <tgroup cols="2">
- <thead>
- <row>
- <entry>Attribute Name</entry>
- <entry>Description</entry>
- </row>
- </thead>
- <tbody>
- <row>
- <entry>acceptedTypes</entry>
- <entry>List of drag types to be processd by the current drop zone.</entry>
- </row>
- <row>
- <entry>ajaxSubmitSelection</entry>
- <entry>An algorithm of AJAX request submission. "inherit", "true", "false" values are possible</entry>
- </row>
- <row>
- <entry>binding</entry>
- <entry>binding</entry>
- </row>
- <row>
- <entry>changeExpandListener</entry>
- <entry>changeExpandListener</entry>
- </row>
- <row>
- <entry>dragIndicator</entry>
- <entry>Id of the dragIndicator component used as drag operation cursor.</entry>
- </row>
- <row>
- <entry>dragListener</entry>
- <entry>dragListener</entry>
- </row>
- <row>
- <entry>dragType</entry>
- <entry>Key of a drag object. It's used to define a necessity of processing the current dragged element on the drop zone side</entry>
- </row>
- <row>
- <entry>dragValue</entry>
- <entry>Data to be sent to the drop zone after a drop event.</entry>
- </row>
- <row>
- <entry>dropListener</entry>
- <entry>dropListener</entry>
- </row>
- <row>
- <entry>dropValue</entry>
- <entry>Data to be processed after a drop event.</entry>
- </row>
- <row>
- <entry>highlightedClass</entry>
- <entry>Corresponds to the HTML class attribute. Applied to highlighted node</entry>
- </row>
- <row>
- <entry>icon</entry>
- <entry>The icon for node</entry>
- </row>
- <row>
- <entry>iconCollapsed</entry>
- <entry>The icon for collapsed node</entry>
- </row>
- <row>
- <entry>iconExpanded</entry>
- <entry>The icon for expanded node</entry>
- </row>
- <row>
- <entry>iconLeaf</entry>
- <entry>iconLeaf</entry>
- </row>
- <row>
- <entry>id</entry>
- <entry>id</entry>
- </row>
- <row>
- <entry>nodeClass</entry>
- <entry>Name of node CSS class</entry>
- </row>
- <row>
- <entry>nodeSelectListener</entry>
- <entry>nodeSelectListener</entry>
- </row>
- <row>
- <entry>oncontextmenu</entry>
- <entry>JavaScript handler to be called on right click.
- Returning false prevents default browser context menu from being displayed</entry>
- </row>
- <row>
- <entry>ondragend</entry>
- <entry>A JavaScript event handler called after a drag operation.</entry>
- </row>
- <row>
- <entry>ondragenter</entry>
- <entry>A JavaScript event handler called on enter draggable object to zone.</entry>
- </row>
- <row>
- <entry>ondragexit</entry>
- <entry>A JavaScript event handler called after a drag object leaves zone.</entry>
- </row>
- <row>
- <entry>ondragstart</entry>
- <entry>A JavaScript event handler called before drag object.</entry>
- </row>
- <row>
- <entry>ondrop</entry>
- <entry>It's an event that is called when something is dropped on a drop zone</entry>
- </row>
- <row>
- <entry>ondropend</entry>
- <entry>A Javascript handler for event fired on a drop even the drop for a given type is not available</entry>
- </row>
- <row>
- <entry>rendered</entry>
- <entry>rendered</entry>
- </row>
- <row>
- <entry>reRender</entry>
- <entry>Id[s] (in format of call UIComponent.findComponent()) of components, rendered in case of AjaxRequest caused by this component. Can be single id, comma-separated list of Ids, or EL Expression with array or Collection</entry>
- </row>
- <row>
- <entry>selectedClass</entry>
- <entry>Corresponds to the HTML class attribute. Applied to selected node</entry>
- </row>
- <row>
- <entry>type</entry>
- <entry>A node type.</entry>
- </row>
- <row>
- <entry>typeMapping</entry>
- <entry>Map between a draggable type and an indicator name on zone. it's defined with the pair (drag type:indicator name))</entry>
- </row>
- </tbody>
- </tgroup>
- </table>
- <sectioninfo>
-
- <keywordset>
-
- <keyword>node</keyword>
-
- <keyword>rich:treeNode</keyword>
-
- <keyword>HtmlTreeNode</keyword>
-
- </keywordset>
-
- </sectioninfo>
- <section>
-
- <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.TreeNode</entry>
-
- </row>
-
- <row>
-
- <entry>component-class</entry>
-
- <entry>org.richfaces.component.html.HtmlTreeNode</entry>
-
- </row>
-
- <row>
-
- <entry>component-family</entry>
-
- <entry>org.richfaces.TreeNode</entry>
-
- </row>
-
- <row>
-
- <entry>renderer-type</entry>
-
- <entry>org.richfaces.TreeNodeRenderer</entry>
-
- </row>
-
- <row>
-
- <entry>tag-class</entry>
-
- <entry>org.richfaces.taglib.TreeNodeTag</entry>
-
- </row>
-
- </tbody>
-
- </tgroup>
-
- </table>
-
- </section>
- <section>
-
- <title>Creating the Component with a Page Tag</title>
-
- <para>To create it on a page, use the following syntax: </para>
-
- <programlisting role="XML">...
- <rich:tree ... faceNode="simpleNode">
- <rich:treeNode type="simpleNode">
- <!--Tree node data displaying template-->
- </rich:treeNode>
- </rich:tree>
-...
-</programlisting>
-
- </section>
- <section>
-
- <title>Dynamical Creation from Java Code</title>
-
- <programlisting role="JAVA">...
-org.richfaces.component.html.HtmlTreeNode myPanel = new org.richfaces.component.html.HtmlTreeNode();
-...
-</programlisting>
-
- </section>
- <section>
-
- <title>Details of Usage</title>
-
- </section>
- <section>
-
- <title>Look and Feel Customization</title>
-
- <para>As it has been mentioned above, <property>treeNode</property> defines a template for nodes
- rendering in a tree. Thus, during XML document rendering (a web.xml application) as a tree, the
- following nodes output (passed via var="data" on a tree) happens:</para>
-
- <programlisting role="XML">
-<rich:tree ... faceNode="simpleNode" ... value="#{bean.data}" var="data">
- <rich:treeNode type="simpleNode">
- <h:outputText value="context-param:"/>
- <h:inputText value="#{data.name}"/>
- </rich:treeNode>
-</rich:tree >
-</programlisting>
-
- <figure>
-
- <title>Nodes output</title>
-
- <mediaobject>
-
- <imageobject>
-
- <imagedata fileref="images/tree2.gif"/>
-
- </imageobject>
-
- </mediaobject>
-
- </figure>
-
- <para>Hence, outputText outputs the "context-param" string and then the input is output for
- the data.name element of this node.</para>
-
- <para>Different nodes for rendering could be defined depending on some conditions on the tree level.
- Each condition represents some rendering template. To get more information on various <property>treeNodes</property>
- definition for nodes,
- <ulink url="tree.html">see the tree component chapter</ulink>.</para>
-
- <para>Switching between expanded/collapsed modes is also managed on the tree level and defined
- in <ulink url="tree.html">the corresponding section</ulink>.</para>
-
- <para>Default nodes of the tree level as well as ones defined with the <property>treeNodes</property> component could
- send AJAX requests when selected with the mouse, it's managed with the
- <emphasis role="italic">
- <property>"ajaxSubmitSelection"</property>
- </emphasis> attribute
- (true/false).</para>
-
- </section>
- <section>
-
- <title>Built-in Drag and Drop</title>
-
- <para>The main information on Drag and Drop operations is given in
- <ulink url="tree.html">the corresponding paragraph</ulink> of
- the <property>tree</property> component chapter. It's only necessary to mention that each node could also be a Drag
- element as well as a Drop container, i.e. the container and the element have all attributes,
- listeners and ways of behavior similar to the ones of the <emphasis role="bold">
- <property><rich:draggable></property>
- </emphasis> and <emphasis role="bold">
- <property><rich:dropZone></property>
- </emphasis> components
- simultaneously.</para>
- </section>
- <section>
-
- <title>Events Handling</title>
-
- <para>Just as Drag and Drop operations it corresponds to the one described on
- <ulink url="tree.html">the tree component level</ulink> for a default Node.</para>
-
- </section>
- <section>
-
- <title>Look and Feel Customization</title>
-
- <para>For skinnability implementation the components use a <emphasis role="italic">
- <property>style class redefinition method</property>
- </emphasis>.</para>
-
- <para>Default style classes are mapped on <emphasis role="italic">
- <property>skin parameters</property>.</emphasis>
- </para>
-
- <para>To redefine appearance of all treeNodes at once, there are two ways:</para>
-
- <itemizedlist>
-
- <listitem>to redefine corresponding skin parameters</listitem>
-
- <listitem>to add <emphasis role="italic">
- <property>style classes</property>
- </emphasis> used by the treeNode to your page stylesheets</listitem>
-
- </itemizedlist>
-
- </section>
- <section>
-
- <title>Skin parameters redefinition:</title>
-
- <table>
-
- <title>Default skins for treeNode element</title>
-
- <tgroup cols="2">
-
- <thead>
-
- <row>
-
- <entry>Default skins for treeNode element</entry>
-
- <entry>Properties corresponding to CSS parameter</entry>
-
- </row>
-
- </thead>
-
- <tbody>
-
- <row>
-
- <entry>panelTextColor</entry>
-
- <entry>color</entry>
-
- </row>
-
- <row>
-
- <entry>preferableDataSizeFont </entry>
-
- <entry>font-size</entry>
-
- </row>
-
- <row>
-
- <entry>preferableDataFamilyFont</entry>
-
- <entry>font-family</entry>
-
- </row>
-
- </tbody>
-
- </tgroup>
-
- </table>
-
- <table>
-
- <title>Skin parameters for selected Node element</title>
-
- <tgroup cols="2">
-
- <thead>
-
- <row>
-
- <entry>Skin parameters for selected Node element</entry>
-
- <entry>Properties corresponding to CSS parameter</entry>
-
- </row>
-
- </thead>
-
- <tbody>
-
- <row>
-
- <entry>headerBackgroundColor</entry>
-
- <entry>background-color</entry>
-
- </row>
-
- <row>
-
- <entry>headerBackgroundColor</entry>
-
- <entry>background-color</entry>
-
- </row>
-
- <row>
-
- <entry>headTextColor</entry>
-
- <entry>color</entry>
-
- </row>
-
- </tbody>
-
- </tgroup>
-
- </table>
-
- <table>
-
- <title>Skin parameters for mouseovered Node element</title>
-
- <tgroup cols="2">
-
- <thead>
-
- <row>
-
- <entry>Skin parameters for mouseovered Node element</entry>
-
- <entry>Properties corresponding to CSS parameter</entry>
-
- </row>
-
- </thead>
-
- <tbody>
-
- <row>
-
- <entry>selectControlColor</entry>
-
- <entry>color</entry>
-
- </row>
-
- </tbody>
-
- </tgroup>
-
- </table>
-
- <para>Hence, to change look and fell of all <property>treeNodes</property> components on an application, change these
- parameters values.</para>
-
- </section>
- <section>
-
- <title>Definition custom style classes:</title>
-
- <para>The following classes are applied to a node element in three states: default, marked,
- mouseovered:</para>
-
- <itemizedlist>
-
- <listitem>rich-tree-node</listitem>
-
- <listitem>rich-tree-node-selected</listitem>
-
- <listitem>rich-tree-node-highlighted</listitem>
-
- </itemizedlist>
-
- <para>Hence, in order to change an appearance of all <property>treeNodes</property> on a page,
- declare and customize the above-mentioned classes in your CSS.</para>
-
- <para>It is also possible to change look and feel of specific <property>treeNodes</property>
- with the help of defining for them
- <emphasis role="italic">
- <property>"selectedClass"</property>
- </emphasis>
- and <emphasis role="italic">
- <property>"highlightedClass"</property>
- </emphasis>
- attributes by their specific classes.</para>
-
- </section>
-</section>
\ No newline at end of file
Deleted: trunk/docs/userguide/en/modules/tree_table.xml
===================================================================
--- trunk/docs/userguide/en/modules/tree_table.xml 2007-05-03 11:01:08 UTC (rev 628)
+++ trunk/docs/userguide/en/modules/tree_table.xml 2007-05-03 13:12:30 UTC (rev 629)
@@ -1,656 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<section id="tree"><?dbhtml filename="tree.html" ?>
- <title><rich:tree></title>
- <sectioninfo>
-
- <keywordset>
-
- <keyword>tree</keyword>
-
- </keywordset>
-
- </sectioninfo>
- <section>
-
- <para>A component for a tree-like presentation of data. It includes built-in drag and drop
- support for its child elements.</para>
-
- <figure>
-
- <title>Expanded tree with child elements</title>
-
- <mediaobject>
-
- <imageobject>
-
- <imagedata fileref="images/tree1.gif"/>
-
- </imageobject>
-
- </mediaobject>
-
- </figure>
-
- </section>
- <section>
-
- <title>Key Features</title>
-
- </section>
- <table>
- <title>rich:tree attributes</title>
- <tgroup cols="2">
- <thead>
- <row>
- <entry>Attribute Name</entry>
- <entry>Description</entry>
- </row>
- </thead>
- <tbody>
- <row>
- <entry>acceptedTypes</entry>
- <entry>List of drag types to be processd by the current drop zone.</entry>
- </row>
- <row>
- <entry>ajaxSubmitSelection</entry>
- <entry>If true, an Ajax request to be submit when selecting node</entry>
- </row>
- <row>
- <entry>binding</entry>
- <entry>The attribute takes a value-binding expression for a component property of
-a backing bean</entry>
- </row>
- <row>
- <entry>changeExpandListener</entry>
- <entry>changeExpandListener</entry>
- </row>
- <row>
- <entry>componentState</entry>
- <entry>componentState</entry>
- </row>
- <row>
- <entry>dragIndicator</entry>
- <entry>dragIndicator</entry>
- </row>
- <row>
- <entry>dragListener</entry>
- <entry>dragListener</entry>
- </row>
- <row>
- <entry>dragType</entry>
- <entry>Key of a drag object. It's used to define a necessity of processing the current dragged element on the drop zone side</entry>
- </row>
- <row>
- <entry>dragValue</entry>
- <entry>Data to be sent to the drop zone after a drop event.</entry>
- </row>
- <row>
- <entry>dropListener</entry>
- <entry>dropListener</entry>
- </row>
- <row>
- <entry>dropValue</entry>
- <entry>Data to be processed after a drop event.</entry>
- </row>
- <row>
- <entry>highlightedClass</entry>
- <entry>Corresponds to the HTML class attribute. Applied to highlighted node</entry>
- </row>
- <row>
- <entry>icon</entry>
- <entry>The icon for node</entry>
- </row>
- <row>
- <entry>iconCollapsed</entry>
- <entry>The icon for collapsed node</entry>
- </row>
- <row>
- <entry>iconExpanded</entry>
- <entry>The icon for expanded node</entry>
- </row>
- <row>
- <entry>iconLeaf</entry>
- <entry>iconLeaf</entry>
- </row>
- <row>
- <entry>id</entry>
- <entry>Every component may have a unique id that is automatically created if
- omitted</entry>
- </row>
- <row>
- <entry>immediate</entry>
- <entry>A flag indicating that this component value must be
- converted and validated immediately (during an
- Apply Request Values phase), rather than waiting until a
- Process Validations phase</entry>
- </row>
- <row>
- <entry>nodeFace</entry>
- <entry>Node face facet name</entry>
- </row>
- <row>
- <entry>nodeSelectListener</entry>
- <entry>nodeSelectListener</entry>
- </row>
- <row>
- <entry>oncollapse</entry>
- <entry>An action to be fired when collapsing a node</entry>
- </row>
- <row>
- <entry>ondragend</entry>
- <entry>A JavaScript event handler called after a drag operation.</entry>
- </row>
- <row>
- <entry>ondragenter</entry>
- <entry>A JavaScript event handler called on enter draggable object to zone.</entry>
- </row>
- <row>
- <entry>ondragexit</entry>
- <entry>A JavaScript event handler called after a drag object leaves zone.</entry>
- </row>
- <row>
- <entry>ondragstart</entry>
- <entry>A JavaScript event handler called before drag object.</entry>
- </row>
- <row>
- <entry>ondrop</entry>
- <entry>It's an event that is called when something is dropped on a drop zone</entry>
- </row>
- <row>
- <entry>ondropend</entry>
- <entry>A Javascript handler for event fired on a drop even the drop for a given type is not available</entry>
- </row>
- <row>
- <entry>onexpand</entry>
- <entry>An action to be fired when expanding a node</entry>
- </row>
- <row>
- <entry>onselected</entry>
- <entry>An action to be fired when selecting a node</entry>
- </row>
- <row>
- <entry>preserveDataInRequest</entry>
- <entry>If true, data is preserved in a request</entry>
- </row>
- <row>
- <entry>preserveModel</entry>
- <entry>It can be "state", "request", "none". The default is "request"</entry>
- </row>
- <row>
- <entry>rendered</entry>
- <entry>If "false", this component is rendered.</entry>
- </row>
- <row>
- <entry>reRender</entry>
- <entry>Id[s] (in format of call UIComponent.findComponent()) of components, rendered in case of AjaxRequest caused by this component. Can be single id, comma-separated list of Ids, or EL Expression with array or Collection</entry>
- </row>
- <row>
- <entry>selectedClass</entry>
- <entry>Corresponds to the HTML class attribute. Applied to selected node</entry>
- </row>
- <row>
- <entry>showConnectingLines</entry>
- <entry>If true, connecting lines are show</entry>
- </row>
- <row>
- <entry>style</entry>
- <entry>CSS style(s) is/are to be applied when this component is rendered</entry>
- </row>
- <row>
- <entry>styleClass</entry>
- <entry>Corresponds to the HTML class attribute</entry>
- </row>
- <row>
- <entry>switchType</entry>
- <entry>Tree switch algorithm: "client", "server", "ajax"</entry>
- </row>
- <row>
- <entry>treeDataLocator</entry>
- <entry/>
- </row>
- <row>
- <entry>typeMapping</entry>
- <entry>Map between a draggable type and an indicator name on zone. it's defined with the pair (drag type:indicator name))</entry>
- </row>
- <row>
- <entry>value</entry>
- <entry>value</entry>
- </row>
- <row>
- <entry>var</entry>
- <entry>var</entry>
- </row>
- </tbody>
- </tgroup>
- </table>
- <sectioninfo>
-
- <keywordset>
-
- <keyword>presentation of data</keyword>
-
- <keyword>rich:tree</keyword>
-
- <keyword>HtmlTree</keyword>
-
- </keywordset>
-
- </sectioninfo>
- <section>
-
- <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.Tree</entry>
-
- </row>
-
- <row>
-
- <entry>component-class</entry>
-
- <entry>org.richfaces.component.html.HtmlTree</entry>
-
- </row>
-
- <row>
-
- <entry>component-family</entry>
-
- <entry>org.richfaces.Tree</entry>
-
- </row>
-
- <row>
-
- <entry>renderer-type</entry>
-
- <entry>org.richfaces.TreeRenderer</entry>
-
- </row>
-
- <row>
-
- <entry>tag-class</entry>
-
- <entry>org.richfaces.taglib.TreeTag</entry>
-
- </row>
-
- </tbody>
-
- </tgroup>
-
- </table>
-
- </section>
- <section>
-
- <title>Creating the Component with a Page Tag</title>
-
- <para>To create it on a page, use the following syntax: </para>
-
- <programlisting role="XML">...
- <rich:tree>
- <!--Set of the Tree nodes-->
- </rich:tree>
-...
-</programlisting>
-
- </section>
- <section>
-
- <title>Creating the Component Dynamically Using Java</title>
-
- <programlisting role="JAVA">...
-org.richfaces.component.html.HtmlTree myPanel = new org.richfaces.component.html.HtmlTree();
-...
-</programlisting>
-
- </section>
- <section>
-
- <title>Details of Usage</title>
-
- <para>As it has been mentioned above the tree component allows to render any tree-like structure
- of data.</para>
-
- <para>A bean property is passed into a tree <property>value</property> attribute. The property keeps the
- structure of a org.richfaces.component.TreeNode type. (You may look at this interface description in APIdoc) The default classes for lists building of a TreeNodeImpl type (it
- implements a TreeNode interface) for an XML structure XmlNodeData and XmlTreeDataBuilder are
- implemented in the tree component. Hence, in order to provide your own class for TreeNode, it's
- necessary only to implement this interface, i.e. the <emphasis role="italic">
- <property>"var"</property>
- </emphasis> attribute contains
- a name providing an access to data defined with value. </para>
-
- <para>For data output, named <property>tree</property> nodes elements are used. Each element, for
- example depending on its definition, could be rendered with markup defined in one of
- <property>tree</property> nodes. It's defined with the
- <emphasis role="italic">
- <property>"nodeFace"</property>
- </emphasis>
- attribute that contains treeNode name for elements rendering. </para>
-
- <para>On the screenshot there are examples of nodes defined with different templates on the
- following conditions</para>
-
- <programlisting role="JAVA">nodeFace="#{data.name != 'param-value' ? 'input' : 'text'}"
-</programlisting>
-
- <figure>
-
- <title>Different nodes of tree</title>
-
-
- <mediaobject>
-
- <imageobject>
-
- <imagedata fileref="images/tree2.gif"/>
-
- </imageobject>
-
- </mediaobject>
-
- </figure>
-
- <para>Switching on nodes opening/closing (expanded/collapsed) could be implemented in three modes. It could be specified
- in the <emphasis role="italic">
- <property>"switchType"</property>
- </emphasis> attribute. </para>
-
- <itemizedlist>
-
- <listitem>AJAX - request onto the server is used for switching </listitem>
-
- <listitem>Server - custom requests onto the server are used for switching</listitem>
-
- <listitem>Client - all data is uploaded onto the server, the switching is implemented with a
- client script</listitem>
-
- </itemizedlist>
-
- <para>Common selecting allows also to activate AJAX requests with the
- <emphasis role="italic">
- <property>"ajaxSubmitSelection"</property>
- </emphasis>
- attribute (true/false).</para>
-
- <para>To set a model saving during requests, use the
- <emphasis role="italic">
- <property>"preserveModel"</property>
- </emphasis>attribute with
- state, request (default) and none values. The attribute is used for cashing data between requests
- in state or request. The
- <emphasis role="italic">
- <property>"treeDataLocator"</property>
- </emphasis> attribute
- defines a class providing an access to cashed data according to the ids saved in state/request
- on recovery or cashing data saving the Id on caching.</para>
-
- </section>
- <section>
-
- <title>Built-In Drag and Drop</title>
-
- <para>The tree component functionality provides a built-in support for Drag and Drop operations.
- The main usage principles are the same as for Rich Faces Drag and Drop wrapper components. Hence,
- to get additional information on the topic, read the corresponding chapters:
- <ulink url="dndParam.html">
- <emphasis role="italic">
- <property>"rich:dndParam"</property>,</emphasis>
- </ulink>
-
- <ulink url="dragSupport.html">
- <emphasis role="italic">
- <property>"rich:dragSupport"</property>,</emphasis>
- </ulink>
-
- <ulink url="dragIndicator.html">
- <emphasis role="italic">
- <property>"rich:dragIndicator"</property>,</emphasis>
- </ulink>
-
- <ulink url="dropSupport.html">
- <emphasis role="italic">
- <property>"rich:dropSupport"</property>.</emphasis>
- </ulink>
-
- <property>Tree nodes</property> could be drag or drop elements, so tree has both attributes
- groups.</para>
-
- <table>
-
- <title>Drag attributes description</title>
-
- <tgroup cols="2">
-
- <thead>
-
- <row>
-
- <entry>dragValue</entry>
-
- <entry>Element value drag passing into processing after a Drop event.</entry>
-
- </row>
-
- </thead>
-
- <tbody>
-
- <row>
-
- <entry>dragIndicator</entry>
-
- <entry>An indicator component id.</entry>
-
- </row>
-
- <row>
-
- <entry>dragType</entry>
-
- <entry>A drag zone name used to define whether processing is necessary with a Drop zone or
- not.</entry>
-
- </row>
-
- </tbody>
-
- </tgroup>
-
- </table>
-
- <table>
-
- <title>Drop attributes description</title>
-
- <tgroup cols="2">
-
- <thead>
-
- <row>
-
- <entry>dropValue</entry>
-
- <entry>Element value drop passed into processing after Drop events .</entry>
-
- </row>
-
- </thead>
-
- <tbody>
-
- <row>
-
- <entry>dropListener</entry>
-
- <entry>A listener that processes a drop event. </entry>
-
- </row>
-
- <row>
-
- <entry>acceptedTypes</entry>
-
- <entry>Drag zone names allowed to be processed with a drop zone.</entry>
-
- </row>
-
- <row>
-
- <entry>typeMapping</entry>
-
- <entry>Drag zones names mapping on the corresponding drop zone parameters.</entry>
-
- </row>
-
- </tbody>
-
- </tgroup>
-
- </table>
-
- </section>
- <section>
-
- <title>Events handling</title>
-
- <para>Listeners classes that process events on server side are defined with the help:</para>
-
- <itemizedlist>
-
- <listitem>nodeSelectListener is called during request sending on a node selecting event (if request sending on this
- event is defined)</listitem>
-
- <listitem>dropListener processes Drop event</listitem>
-
- <listitem>changeExpandListener processes expand/collapse event of a tree node</listitem>
-
- </itemizedlist>
-
- <para>Moreover, to add e.g. some JavaScript effects, client events defined on it are used:</para>
-
- <itemizedlist>
-
- <listitem>onexpand - expand node event</listitem>
-
- <listitem>oncollapse - collapse node event</listitem>
-
- <listitem>ondragexit - element passing out from tree zone event</listitem>
-
- <listitem>ondragstart - drag start event</listitem>
-
- <listitem>ondragend - drag end event (drop event)</listitem>
-
- <listitem>ondragenter - dragged element appearing on tree event</listitem>
-
- </itemizedlist>
-
- </section>
- <section>
-
- <title>Look and Feel Customization</title>
-
- <para>For skinnability implementation the components use a <emphasis role="italic">
- <property>style class redefinition method</property>
- </emphasis>.</para>
-
- <para>Default style classes are mapped on <emphasis role="italic">
- <property>skin parameters</property>.</emphasis>
- </para>
-
- <para>To redefine appearance of all trees at once, there are two ways:</para>
-
- <itemizedlist>
-
- <listitem>to redefine corresponding skin parameters</listitem>
-
- <listitem>to add <emphasis role="italic">
- <property>style classes</property>
- </emphasis> used by the tree to your page stylesheets</listitem>
-
- </itemizedlist>
-
- </section>
- <section>
-
- <title>Skin parameters redefinition:</title>
-
- <para>There is only one skin parameter for the <property>tree</property> since
- <emphasis role="bold">
- <property><rich:tree></property>
- </emphasis>
- itself is a wrapper component for <property>tree</property> nodes. Look and feel is
- described in details in the <ulink url="treeNode.html">"treeNode" chapter</ulink>.</para>
-
- <table>
-
- <title>Skin parameters for wrapper element</title>
-
- <tgroup cols="2">
-
- <thead>
-
- <row>
-
- <entry>Skin parameters for wrapper element</entry>
-
- <entry>Properties corresponding to CSS parameter</entry>
-
- </row>
-
- </thead>
-
- <tbody>
-
- <row>
-
- <entry>overAllBackground</entry>
-
- <entry>background-color </entry>
-
- </row>
-
- </tbody>
-
- </tgroup>
-
- </table>
-
- </section>
- <section>
-
- <title>Definition custom style classes:</title>
-
- <para>The <property>tree</property> also has only one predefined Style Class responsible
- for displaying a wrapper element of the <property>tree</property> - <emphasis role="bold">
- <property><rich:tree></property>
- </emphasis>
- redefining of which will change look and feel of all <property>trees</property> on the page.</para>
-
- </section>
-</section>
\ No newline at end of file
More information about the richfaces-svn-commits
mailing list