<%@ 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="panelMenuSubviewID">
		<rich:panelMenu id="panelMenuID"  disabled="#{panelMenu.disabled}" width="#{panelMenu.width}" selectedChild="thisChild"
			expandSingle="#{panelMenu.expandSingle}" mode="#{panelMenu.mode}" value="PanelMenu" rendered="#{panelMenu.rendered}"
			iconCollapsedGroup="#{panelMenu.icon.collapsedGroup}" iconCollapsedTopGroup="#{panelMenu.icon.collapsedTopGroup}"
			iconDisabledGroup="#{panelMenu.icon.disabledGroup}" iconDisabledItem="#{panelMenu.icon.disabledItem}"
			iconExpandedGroup="#{panelMenu.icon.expandedGroup}" iconExpandedTopGroup="#{panelMenu.icon.expandedTopGroup}"
			iconItem="#{panelMenu.icon.item}" iconTopDisabledItem="#{panelMenu.icon.disabledItem}"
			iconTopDisableGroup="#{panelMenu.icon.disabledGroup}" iconTopItem="#{panelMenu.icon.topItem}"
			iconGroupPosition="#{panelMenu.iconGroupPosition}" iconGroupTopPosition="#{panelMenu.iconGroupTopPosition}"
			iconItemPosition="#{panelMenu.iconItemPosition}" iconItemTopPosition="#{panelMenu.iconItemTopPosition}" styleClass="sPanel"
			onclick="" ondblclick="" ongroupcollapse="" ongroupexpand="" onitemhover="" onkeydown="" onkeypress="" onkeyup=""
			onmousedown="" onmousemove="" onmouseout="" onmouseover="" onmouseup="">

			<rich:panelMenuItem label="Item 1(Test event)" onclick="showEvent('onclickInputID', 'onclick work!')"
				ondblclick="showEvent('ondblclickInputID', 'ondblclick work!')" onkeydown="showEvent('onkeydownInputID', 'onkeydown work!')"
				onkeypress="showEvent('onkeypressInputID', 'onkeypress work!')" onkeyup="showEvent('onkeyupInputID', 'onkeyup work!')"
				onmousedown="showEvent('onmousedownInputID', 'onmousedown work!')" onmousemove="showEvent('onmousemoveInputID', 'onmousemove work!')"
				onmouseout="showEvent('onmouseoutInputID', 'onmouseout work!')" onmouseover="showEvent('onmouseoverInputID', 'onmouseover work!')"
				onmouseup="showEvent('onmouseupInputID', 'onmouseup work!')"></rich:panelMenuItem>
			<rich:panelMenuItem disabled="true" iconDisabled="/pics/ajax_stoped.gif">
				<h:outputText value="Disabled Item" />
			</rich:panelMenuItem>
			<rich:panelMenuItem label="Item Image">
				<h:graphicImage value="/pics/item.png"></h:graphicImage>
			</rich:panelMenuItem>
			<rich:panelMenuItem>
				<h:outputText value="Item4" />
			</rich:panelMenuItem>
			<rich:panelMenuItem label="CheckBox">
				<h:selectBooleanCheckbox value="false"></h:selectBooleanCheckbox>
			</rich:panelMenuItem>
			<rich:panelMenuItem>
				<h:outputText value="CheckBox 2"></h:outputText>
				<h:selectBooleanCheckbox value="false"></h:selectBooleanCheckbox>
			</rich:panelMenuItem>
			<rich:panelMenuItem label="Action" onmousedown="alert('OnMouseDown');"></rich:panelMenuItem>

			<rich:panelMenuGroup label="Group 1">
				<rich:panelMenuItem label="Item 1" disabled="true"></rich:panelMenuItem>
				<rich:panelMenuItem label="Item 1 (action)" onmousedown="alert('OnMouseDown');"></rich:panelMenuItem>
				<rich:panelMenuItem label="Item 2"></rich:panelMenuItem>

				<rich:panelMenuGroup label="Group 1_1  (align)" align="#{panelMenu.align}">
					<rich:panelMenuItem label="Imem 1_1">
						<h:inputText value="#{panelMenu.inputText}"></h:inputText>
					</rich:panelMenuItem>

					<rich:panelMenuItem label="Item 1_2"></rich:panelMenuItem>

					<rich:panelMenuGroup label="Group 1_1_1">
						<rich:panelMenuItem label="Item 1 (action)" onmousedown="alert('OnMouseDown');"></rich:panelMenuItem>
						<rich:panelMenuItem label="Item 2"></rich:panelMenuItem>
					</rich:panelMenuGroup>

					<rich:panelMenuGroup label="Group 1_1_2">
						<rich:panelMenuItem label="Item 1"></rich:panelMenuItem>
						<rich:panelMenuItem label="Item 2"></rich:panelMenuItem>
						<rich:panelMenuItem label="Item 3"></rich:panelMenuItem>
						<rich:panelMenuItem label="Item 4"></rich:panelMenuItem>
					</rich:panelMenuGroup>
				</rich:panelMenuGroup>

				<rich:panelMenuGroup label="Group 1_2 (disabled, action)" disabled="true" onmousedown="alert('Disabled');">
					<rich:panelMenuItem label="Item 1_2_1"></rich:panelMenuItem>
				</rich:panelMenuGroup>

				<rich:panelMenuGroup label="Group 1_3">
					<rich:panelMenuItem label="Item 1_3_1"></rich:panelMenuItem>
					<rich:panelMenuItem label="Item 1_3_1"></rich:panelMenuItem>

					<rich:panelMenuGroup label="Group disabled" disabled="true">
					</rich:panelMenuGroup>
				</rich:panelMenuGroup>

			</rich:panelMenuGroup>

			<rich:panelMenuGroup label="Group 2 ">
				<rich:panelMenuItem label="Item 2_1"></rich:panelMenuItem>

				<rich:panelMenuGroup label="Group 2_2">
					<rich:panelMenuItem label="Item 1"></rich:panelMenuItem>
					<rich:panelMenuItem label="Item 2"></rich:panelMenuItem>
				</rich:panelMenuGroup>

				<rich:panelMenuItem label="Item 1"></rich:panelMenuItem>
				<rich:panelMenuItem label="Item 2"></rich:panelMenuItem>
			</rich:panelMenuGroup>

			<rich:panelMenuGroup label="Group 3">
				<rich:panelMenuItem label="Item 3_1">
					<f:verbatim>
						<br />
						text <br />
						text <br />
						text
					</f:verbatim>
				</rich:panelMenuItem>
				<rich:panelMenuItem label="Item 3_2">
					<h:graphicImage value="/pics/benq.jpg" width="150px" height="100px"></h:graphicImage>
				</rich:panelMenuItem>
				<rich:panelMenuItem label="Item 3_3"></rich:panelMenuItem>
			</rich:panelMenuGroup>
		</rich:panelMenu>

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

		<h:outputText id="info"
			value="Expand Mode: #{panelMenu.mode}, Disabled: #{!panelMenu.disabled}, Align: #{panelMenu.align}, Tab Index: #{panelMenu.tabIndex}"></h:outputText>
		<!-- triangleUp triangle triangleDown disc chevron chevronUp chevronDown grid -->
		<f:verbatim>
			<br />
		</f:verbatim>

		<rich:panelMenu id="panelMenuID2" expandMode="#{panelMenu.mode}" disabled="#{!panelMenu.disabled}" width="#{panelMenu.width}"
			selectedChild="thisChild" styleClass="body">
			<rich:panelMenuGroup label="Group 1 (tabIdex, my Image)" tabindex="#{panelMenu.tabIndex}" align="#{panelMenu.align}">
				<rich:panelMenuGroup label="Group 1_1 (tabIndex)" tabindex="#{panelMenu.tabIndex}">
					<rich:panelMenuGroup label="Group 1_1_1 (tabIndex)" tabindex="#{panelMenu.tabIndex}">
						<rich:panelMenuItem label="Item 1"></rich:panelMenuItem>
						<rich:panelMenuItem label="Item 2"></rich:panelMenuItem>
					</rich:panelMenuGroup>
				</rich:panelMenuGroup>

				<rich:panelMenuGroup label="Group 1_2 (tabIndex)" tabindex="#{panelMenu.tabIndex}">
					<rich:panelMenuGroup label="Group 1_2_1 (tabIndex)" tabindex="#{panelMenu.tabIndex}">
						<rich:panelMenuItem label="Item (icon)" icon="#{icon.iconItem}"></rich:panelMenuItem>
						<rich:panelMenuItem label="Item (iconDisabled)" iconDisabled="#{icon.iconHeader}"></rich:panelMenuItem>
						<rich:panelMenuItem label="Item (icon)" disabled="true" icon="#{icon.iconItem}"></rich:panelMenuItem>
						<rich:panelMenuItem label="Item (iconDisabled)" disabled="true" iconDisabled="#{icon.iconItem}"></rich:panelMenuItem>
					</rich:panelMenuGroup>
					<rich:panelMenuItem label="Item (icon)" icon="#{icon.iconItem}"></rich:panelMenuItem>
					<rich:panelMenuItem label="Item (icon)" icon="#{icon.iconItem}"></rich:panelMenuItem>
					<rich:panelMenuItem label="Item "></rich:panelMenuItem>
				</rich:panelMenuGroup>

				<rich:panelMenuGroup label="Group 1_3" align="#{panelMenu.align}" iconCollapsed="#{icon.iconCollapse}"
					iconExpanded="#{icon.iconExpand}" iconDisabled="#{icon.disabled}">
					<rich:panelMenuItem label="Item 1"></rich:panelMenuItem>
					<rich:panelMenuItem label="Item 2"></rich:panelMenuItem>
					<rich:panelMenuItem label="Item 3"></rich:panelMenuItem>
				</rich:panelMenuGroup>

				<!-- triangleUp triangle triangleDown disc chevron chevronUp chevronDown grid -->
				<rich:panelMenuItem label="Item (disc)" icon="disc"></rich:panelMenuItem>
				<rich:panelMenuItem label="Item (grid)" icon="grid"></rich:panelMenuItem>
				<rich:panelMenuGroup label="Group" iconCollapsed="triangleDown" iconExpanded="triangleUp" iconDisabled="triangle">
					<rich:panelMenuGroup label="Group" iconCollapsed="chevronDown" iconExpanded="chevronUp" iconDisabled="chevron">
						<rich:panelMenuItem label="Item (disc)" icon="disc"></rich:panelMenuItem>
						<rich:panelMenuItem label="Item (grid)" iconDisabled="grid"></rich:panelMenuItem>
						<rich:panelMenuItem label="Item (grid)" icon="grid"></rich:panelMenuItem>
						<rich:panelMenuItem label="Item (disc)" iconDisabled="disc"></rich:panelMenuItem>
					</rich:panelMenuGroup>
					<rich:panelMenuItem label="Item (icon)" icon="#{icon.iconItem}"></rich:panelMenuItem>
					<rich:panelMenuItem label="Item (icon)" icon="#{icon.iconItem}"></rich:panelMenuItem>
					<rich:panelMenuItem label="Item "></rich:panelMenuItem>
				</rich:panelMenuGroup>

				<rich:panelMenuGroup label="Group 1_3" iconCollapsed="chevronDown" iconExpanded="chevronUp" iconDisabled="chevron">
					<rich:panelMenuItem label="Item 1"></rich:panelMenuItem>
					<rich:panelMenuItem label="Item 2"></rich:panelMenuItem>
					<rich:panelMenuItem label="Item 3"></rich:panelMenuItem>
				</rich:panelMenuGroup>
			</rich:panelMenuGroup>
		</rich:panelMenu>
</f:subview>
