<?xml version="1.0" encoding="UTF-8"?>
<f:root 
	xmlns:f="http://ajax4jsf.org/cdk/template" 
	xmlns:c=" http://java.sun.com/jsf/core" 
	xmlns:ui=" http://ajax4jsf.org/cdk/ui"
	xmlns:u=" http://ajax4jsf.org/cdk/u"
	xmlns:jsp=" http://ajax4jsf.org/cdk/jsp"
	xmlns:x=" http://ajax4jsf.org/cdk/x"
	baseclass="org.richfaces.renderkit.InplaceInputBaseRenderer"
	class="org.richfaces.renderkit.html.InplaceInputRenderer"
	component="org.richfaces.component.UIInplaceInput"> 
	
	
	<h:styles>css/inplaceinput.xcss</h:styles>
	<h:scripts>
			new org.ajax4jsf.javascript.PrototypeScript(),
			scripts/inplaceinput.js,
			scripts/utils.js
	</h:scripts>
	<f:resource var="saveIcon" name="org.richfaces.renderkit.html.images.SaveControlIcon"/>
	<f:resource var="cancelIcon" name="org.richfaces.renderkit.html.images.CancelControlIcon"/>
	<f:resource var="spacer" name="images/spacer.gif"/>
		
 	
	<f:clientid var="clientId" />
	<jsp:scriptlet>
		<![CDATA[
		Object value = component.getSubmittedValue();         
		if (value == null) {         
			value = component.getValue();
		}	
		Object fieldValue = value;
	   	value = getConvertedStringValue(context, component,value);
	   	if (value == null || value.equals("")) {
	   		fieldValue = "";
	   		String defaultValue = (String)component.getAttributes().get("defaultLabel"); 
	   		if(defaultValue == null || defaultValue.equals("")) {
	   		 	defaultValue = "\u00a0\u00a0\u00a0";    
	   		}
	   		value = defaultValue; 
	   	}
	   	
	   	variables.setVariable("value", value);
	   	variables.setVariable("fieldValue", fieldValue);
	   	
	   	String saveIcon =  (String)component.getAttributes().get("saveControlIcon");
	   	if (saveIcon != null && saveIcon.length() != 0 ) {
	   		variables.setVariable("saveIcon", saveIcon);
	   	}
	   	
	   	String cancelIcon =  (String)component.getAttributes().get("cancelControlIcon");
	   	if (cancelIcon != null && cancelIcon.length() != 0 ) {
	   		variables.setVariable("cancelIcon", cancelIcon);
	   	}
	   	
	   	String controlClass = (String)component.getAttributes().get("controlClass");
	   	variables.setVariable("controlClass", controlClass);
	   	String controlHoverClass = (String)component.getAttributes().get("controlHoverClass"); 
	   	variables.setVariable("controlHoverClass", controlHoverClass);
	   	String controlPressedClass = (String)component.getAttributes().get("controlPressedClass"); 
	   	variables.setVariable("controlPressedClass", controlPressedClass);
		
	   	String layout = (String)component.getAttributes().get("layout");
	   	if (layout != null && layout.length() != 0) {
	   		if (!layout.equals("block")) {
	   			layout = "inline";
	   		}
	   	} else {
			layout = "inline";
	   	}
		
	   	if (layout.equals("inline")) {
	   		   	
	   	]]>
	</jsp:scriptlet>
		<span id="#{clientId}" class='rich-inplace rich-inplace-view #{component.attributes["styleClass"]}'
			  x:passThruWithExclusions="id,styleClass,class,style">
	<jsp:scriptlet>
	   	} else {
	</jsp:scriptlet>
		<div id="#{clientId}" class='rich-inplace rich-inplace-view #{component.attributes["viewClass"]} #{component.attributes["styleClass"]}'
			  x:passThruWithExclusions="id,styleClass,class,style">
	<jsp:scriptlet>
	   	} 
	</jsp:scriptlet>		  
	
		<input id="#{clientId}tabber" type="button" value="" style="width: 1px; position: absolute; left: -32767px;" tabindex='#{component.attributes["tabindex"]}'/>
		<input id='#{clientId}tempValue'
			   class='rich-inplace-field' 
			   style='display:none;' 
			   type='text'
			   autocomplete="off"
			   value='#{fieldValue}'
			   onchange='#{component.attributes["onchange"]}'
			   onselect='#{component.attributes["onselect"]}'
			   onblur='#{component.attributes["onblur"]}'
			   onfocus='#{component.attributes["onfocus"]}'
			   onclick='#{component.attributes["oninputclick"]}'
			   ondblclick='#{component.attributes["oninputdblclick"]}'
			   onkeydown='#{component.attributes["oninputkeydown"]}'
			   onkeypress='#{component.attributes["oninputkeypress"]}'
			   onkeyup='#{component.attributes["oninputkeyup"]}'
			   onmousedown='#{component.attributes["oninputmousedown"]}'
			   onmousemove='#{component.attributes["oninputmousemove"]}'
			   onmouseout='#{component.attributes["oninputmouseout"]}'
			   onmouseover='#{component.attributes["oninputmouseover"]}'
			   onmouseup='#{component.attributes["oninputmouseup"]}'
			   
			   />
		<input id='#{clientId}value' name='#{clientId}value' type='hidden' value='#{fieldValue}'/>
		<div id="#{clientId}bar" class="rich-inplace-input-controls-set" style="display:none;">
			<jsp:scriptlet>
				<![CDATA[
				 if (isControlsFacetExists(context, component)) {
				     encodeControlsFacet(context, component);
				 } else {
				]]>
			</jsp:scriptlet>
			<div id="#{clientId}btns_shadow" class="rich-inplace-shadow">
				<table class="rich-inplace-shadow-size" cellspacing="0" cellpadding="0" border="0">
					<tbody>
						<tr>
							<td class="rich-inplace-shadow-tl">
								<img width="10" height="1" border="0" alt="" src="#{spacer}"/>
							</td>
							<td class="rich-inplace-shadow-tr">
								<img width="1" height="10" border="0" alt="" src="#{spacer}"/>
							</td>
						</tr>
						<tr>
							<td class="rich-inplace-shadow-bl">
								<img width="1" height="10" border="0" alt="" src="#{spacer}"/>
							</td>
							<td class="rich-inplace-shadow-br">
								<img width="10" height="1" border="0" alt="" src="#{spacer}"/>
							</td>
						</tr>
					</tbody>
				</table>
			</div>
			
			<div id="#{clientId}buttons" style="position:relative;">
				<input id='#{clientId}ok' class='rich-inplace-control #{controlClass}' 
					   type='image' 
					   onmouseup="this.className='rich-inplace-control #{controlClass}'"
					   onmouseout="this.className='rich-inplace-control #{controlClass}'"
					   onmousedown="this.className='rich-inplace-control-press #{controlPressedClass}'"
					   onmouseover="this.className='rich-inplace-control #{controlHoverClass}'"
					   src='#{saveIcon}'/>
				<input id='#{clientId}cancel' class='rich-inplace-control #{controlClass}' 
					   type='image' 
					   onmouseup="this.className='rich-inplace-control #{controlClass}'"
					   onmouseout="this.className='rich-inplace-control #{controlClass}'" 
					   onmousedown="this.className='rich-inplace-control-press  #{controlPressedClass}'"
					   onmouseover="this.className='rich-inplace-control #{controlHoverClass}'"
					   src='#{cancelIcon}'/>
			</div>
			<jsp:scriptlet>
				<![CDATA[
				 }
				 ]]>
			</jsp:scriptlet>
			<script type="text/javascript">
		
			#{this:encodeScriptAttributes(context, component)};
			#{this:encodeScriptEvents(context, component)};
			#{this:encodeInplaceInputCss(context, component)};
		
			var inplaceInput = new Richfaces.InplaceInput('#{clientId}', '#{clientId}tempValue', '#{clientId}value', '#{clientId}tabber', 
													  attributes, events, classes, ['#{clientId}bar', 
													  '#{clientId}ok', '#{clientId}cancel', '#{clientId}buttons','#{clientId}btns_shadow']);
		</script>			
		</div>
		#{value}
			
	<jsp:scriptlet>

	
	   	if (!layout.equals("inline")) {
	</jsp:scriptlet>	
		</div>
	<jsp:scriptlet>	
	   	} else {
	</jsp:scriptlet>
		</span>
	<jsp:scriptlet>
	   	}
	</jsp:scriptlet>
</f:root>	