[Shale Wiki] Update of "UsingTree2" by ChrisSchulz

[Apache Wiki]

Dear Wiki user,

You have subscribed to a wiki page or wiki category on "Shale Wiki" for change 
notification.

The following page has been changed by ChrisSchulz:
http://wiki.apache.org/shale/UsingTree2

New page:
A simple t:tree2 example as jsp:root-include looks like this (originally from 
[http://www.irian.at/myfaces/tree2.jsf] with TreeBacker as managed bean):

{{{
<jsp:root xmlns:jsp="http://java.sun.com/JSP/Page"; version="2.0"
          xmlns:f="http://java.sun.com/jsf/core";
          xmlns:h="http://java.sun.com/jsf/html";
          xmlns:t="http://myfaces.apache.org/tomahawk"; 
          xmlns:c="http://shale.apache.org/clay";>

   <f:view>
        <h:form id="vps">
            <t:tree2 id="clientTree" showLines="false" showRootNode="false" 
showNav="true" value="[EMAIL PROTECTED]" var="vpStrukturNode" 
varNodeToggler="vpT" clientSideToggle="false" imageLocation="/img" 
javascriptLocation="src" preserveToggle="false">
                <f:facet name="foo-folder">
                    <h:panelGroup>
                        <h:outputText value="#{vpStrukturNode.description}" 
styleClass="nodeFolder"/>
                    </h:panelGroup>
                </f:facet>
                <f:facet name="bar-folder">
                    <h:panelGroup>
                        <h:outputText value="#{vpStrukturNode.description}" 
styleClass="nodeFolder"/>
                    </h:panelGroup>
                </f:facet>
                <f:facet name="person">
                    <h:panelGroup>
                    <h:outputText value="#{vpStrukturNode.description}"/>
                    </h:panelGroup>
                </f:facet>
                <f:facet name="dynamic-person">
                    <h:panelGroup>
                    <h:outputText value="#{vpStrukturNode.description}"/>
                    </h:panelGroup>
                </f:facet>
                <f:facet name="document">
                    <h:panelGroup>
                    <h:outputText value="#{vpStrukturNode.description}"/>
                    </h:panelGroup>
                </f:facet>
            </t:tree2>
        </h:form>
    </f:view>   
</jsp:root>
}}}

As real clay-component (defined in clay-config.xml) it would look like the 
following:

{{{
   ...
   <view>
   ...
      <component...>
      ...
        <element renderId="1" jsfid="t:tree2">
               <attributes>
                   <set name="id" value="clientTree"/>
                   <set name="showLines" value="false"/>
                   <set name="showRootNode" value="false"/>
                   <set name="showNav" value="true"/>
                   <set name="value" value="[EMAIL PROTECTED]"/>
                   <set name="var" value="vpStrukturNode"/> 
                   <set name="varNodeToggler" value="vpT"/>
                   <set name="clientSideToggle" value="false"/>
                   <set name="imageLocation" value="/img"/>
                   <set name="javascriptLocation" value="src"/>
                   <set name="preserveToggle" value="false"/>
               </attributes>
                <element renderId="1" jsfid="panelGroup" facetName="foo-folder" 
>                       
                <element renderId="1" jsfid="outputText">
                      <attributes>
                         <set name="value" 
value="#{vpStrukturNode.description}" />
                         <set name="styleClass" value="nodeFolder" />
                      </attributes>
                </element>
                </element>
                <element renderId="2" jsfid="panelGroup" facetName="bar-folder" 
>
                <element renderId="1" jsfid="outputText">
                      <attributes>
                         <set name="value" 
value="#{vpStrukturNode.description}" />
                         <set name="styleClass" value="nodeFolder" />
                      </attributes>
                </element>
                </element>
                <element renderId="3" jsfid="panelGroup" facetName="person" >
                <element renderId="1" jsfid="outputText">
                      <attributes>
                         <set name="value" 
value="#{vpStrukturNode.description}" />
                      </attributes>
                </element>
                </element>
                <element renderId="4" jsfid="panelGroup" 
facetName="dynamic-person" >
                <element renderId="1" jsfid="outputText">
                      <attributes>
                         <set name="value" 
value="#{vpStrukturNode.description}" />
                      </attributes>
                </element>
                </element>
                <element renderId="5" jsfid="panelGroup" facetName="document" >
                <element renderId="1" jsfid="outputText">
                      <attributes>
                         <set name="value" 
value="#{vpStrukturNode.description}" />
                      </attributes>
                </element>
                </element>
        </element>
      ...
      </component...>

   ...
   </view>
   ...
}}}