<%@ taglib uri="http://java.sun.com/jsf/html" prefix="h"%>
<%@ taglib uri="http://java.sun.com/jsf/core" prefix="f"%>
<%@ taglib uri="http://richfaces.org/a4j" prefix="a4j"%>
<%@ taglib uri="http://richfaces.org/rich" prefix="rich"%>

<f:subview id="treeSubviewID">
		<a4j:outputPanel ajaxRendered="true">
			<h:messages />
		</a4j:outputPanel>

		<rich:tree id="tree" switchType="#{bean.switchType}" value="#{bean.data}" var="data" selectedClass="#{style.selectedClass}" styleClass="#{style.styleClass}" style="#{style.style}" highlightedClass="#{style.highlightedClass}" 
			nodeFace="#{data.name != 'param-value' ? 'input' : 'text'}" changeExpandListener="#{bean.onExpand}"
			nodeSelectListener="#{bean.onSelect}" binding="#{bean.tree}" onselected="window.status='selectedNode: '+event.selectedNode;"
			onexpand="window.status='expandedNode: '+event.expandedNode" oncollapse="window.status='collapsedNode: '+ event.collapsedNode"
			ajaxSubmitSelection="true" reRender="outputText, selectOneListbox" preserveModel="none" dragIndicator="treeIndicator"
			immediate="false" acceptedTypes="file1" dragType="#{bean.dragOn ? 'file1' : ''}" iconCollapsed="#{bean.iconCollapsed}"
			iconExpanded="#{bean.iconExpanded}" iconLeaf="#{bean.iconLeaf}" icon="#{bean.icon}" dropListener="#{bean.processDrop}"
			onclick="#{event.onclick}" ondblclick="#{event.ondblclick}" ondragend="#{event.ondragend}" ondragenter="#{event.ondragenter}" ondragexit="#{event.ondragexit}" ondragstart="#{event.ondragstart}" ondrop="#{event.ondrop}" ondropend="#{event.ondropend}" onkeydown="#{event.onkeydown}" onkeypress="#{event.onkeypress}" onkeyup="#{event.onkeyup}" onmousedown="#{event.onmousedown}" onmousemove="#{event.onmousemove}" onmouseout="#{event.onmouseout}" onmouseover="#{event.onmouseover}" onmouseup="#{event.onmouseup}" onbeforedomupdate="#{event.onbeforedomupdate}" oncomplete="#{event.oncomplete}" ondropout="#{event.ondropout}" ondropover="#{event.ondropover}">

			<f:facet name="icon">
				<h:outputText value="icon" rendered="#{bean.renderFacets}" />
			</f:facet>
			<f:facet name="iconLeaf">
				<h:outputText value="leaf" rendered="#{bean.renderFacets}" />
			</f:facet>
			<f:facet name="iconExpanded">
				<h:outputText value="expanded" rendered="#{bean.renderFacets}" />
			</f:facet>
			<f:facet name="iconCollapsed">
				<h:outputText value="collapsed" rendered="#{bean.renderFacets}" />
			</f:facet>

			<rich:dndParam name="treeParam" value="Tree Parameter" />
			<rich:dndParam name="accept" value="accept" />

			<rich:treeNode type="input" dropListener="#{bean.processDrop}"
				oncollapse="Element.removeClassName(event['treeItem'].getElement(), 'colored')"
				onexpand="Element.addClassName(event['treeItem'].getElement(), 'colored')" 
				onbeforedomupdate="#{event.onbeforedomupdate}" onclick="#{event.onclick}" oncomplete="#{event.oncomplete}" oncontextmenu="#{event.oncontextmenu}" ondblclick="#{event.ondblclick}" ondragend="#{event.ondragend}" ondragenter="#{event.ondragenter}" ondragexit="#{event.ondragexit}" ondragstart="#{event.ondragstart}" ondrop="#{event.ondrop}" ondropend="#{event.ondropend}" ondropout="#{event.ondropout}" ondropover="#{event.ondropover}" onkeydown="#{event.onkeydown}" onkeypress="#{event.onkeypress}" onkeyup="#{event.onkeyup}" onmousedown="#{event.onmousedown}" onmousemove="#{event.onmousemove}" onmouseout="#{event.onmouseout}" onmouseover="#{event.onmouseover}" onmouseup="#{event.onmouseup}" onselected="#{event.onselected}">
				<h:outputText value="#{data} : " />
				<h:inputText value="#{data.name}" required="true" styleClass="inputs">
				</h:inputText>

				<rich:dndParam name="nodeParam" value="Node Parameter" />

			</rich:treeNode>
			<rich:treeNode type="text" nodeClass="customNode" acceptedTypes="file2" onselected="return false;">
				<h:outputText value="#{data}" />
			</rich:treeNode>
		</rich:tree>

		<f:verbatim>
			<br />
		</f:verbatim>

		<h:outputText value="Enter path to expand:" />
		<h:inputText value="#{bean.pathToExpand}">
			<a4j:support event="onchange" reRender="tree" action="#{bean.expandNode}" />
		</h:inputText>

		<rich:separator></rich:separator>

		<h:panelGrid columns="2">
			<h:outputText value="Change tree switchType:" />
			<h:selectOneRadio value="#{bean.switchType}" onclick="submit()">
				<f:selectItem itemLabel="client" itemValue="client" />
				<f:selectItem itemLabel="server" itemValue="server" />
				<f:selectItem itemLabel="ajax" itemValue="ajax" />
			</h:selectOneRadio>

			<h:outputText value="Drag switch:" />
			<h:selectBooleanCheckbox value="#{bean.dragOn}" onchange="submit();"></h:selectBooleanCheckbox>

			<h:outputText value="Render facets:" />
			<h:selectBooleanCheckbox value="#{bean.renderFacets}" onchange="submit();"></h:selectBooleanCheckbox>

			<h:commandButton value="#{bean.commandButtonCaption}" actionListener="#{bean.changeIcons}" />
		</h:panelGrid>

		<f:verbatim>
			<br />
			<br />
		</f:verbatim>

		<rich:tree id="testTree" var="_data" switchType="ajax" ajaxSubmitSelection="true" preserveModel="none" value="#{bean.data1}"
			nodeSelectListener="#{bean.onSelectInc}" nodeFace="node">
			<rich:treeNode type="node">
				<h:outputText value="#{_data}" />
			</rich:treeNode>
		</rich:tree>
		<rich:separator></rich:separator>
		<h:outputText value="Tree without treeNode:"></h:outputText>
		<rich:separator></rich:separator>

		<rich:tree switchType="client" style="width:300px" value="#{pathwayBean.pathwayTree}" var="item" nodeFace="#{item.type}">
			<rich:treeNode type="library">
				<h:outputText value="#{item.type}" />
			</rich:treeNode>
			<rich:treeNode type="pathway">
				<h:outputText value="#{item.name}" />
			</rich:treeNode>
			<rich:treeNode type="organism">
				<h:outputText value="#{item.name}" />
			</rich:treeNode>
		</rich:tree>

		<rich:spacer></rich:spacer>
</f:subview>
