<?xml version="1.0"?>
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
	xmlns:eat="http://msqr.us/xsd/ieat"
	xmlns:xweb="http://msqr.us/xsd/jaxb-web"
	exclude-result-prefixes="eat xweb">
	
    <!-- imports -->
	<xsl:import href="tmpl/default-layout.xsl"/>
	
	<!-- layout variables -->
	<xsl:variable name="layout.global.nav.page" select="'search'"/>
	
	<!-- helper vars -->
	<xsl:variable name="searchResults" select="xweb:x-data/xweb:x-model/eat:search-results"/>
	<xsl:variable name="searchCriteria" select="$searchResults/eat:recipe-criteria"/>
	
	<xsl:template match="xweb:x-data" mode="page-title">
		<xsl:choose>
			<xsl:when test="$searchResults/@mode = 'ingredient'">
				<xsl:value-of select="key('i18n','recipe-search-by-ingredient.title')"/>
			</xsl:when>
			<xsl:otherwise>
				<xsl:value-of select="key('i18n','recipe-search.title')"/>
			</xsl:otherwise>
		</xsl:choose>
	</xsl:template>
	
	<xsl:template match="xweb:x-data" mode="page-head-content">
		<xsl:choose>
			<xsl:when test="$searchResults/@mode = 'ingredient'">
				<link rel="stylesheet" type="text/css" href="{$web-context}/css/jquery.autocomplete.css" media="screen" />
				<script type="text/javascript" src="{$web-context}/js/jquery-1.3.2.js" xml:space="preserve"> </script>
				<script type="text/javascript" src="{$web-context}/js/jquery.ajaxQueue.js" xml:space="preserve"> </script>
				<script type="text/javascript" src="{$web-context}/js/jquery.autocomplete.js" xml:space="preserve"> </script>
				<script type="text/javascript" src="{$web-context}/js/xweb-locale.js" xml:space="preserve"> </script>
				<script type="text/javascript" src="{$web-context}/js/ieat-util.js" xml:space="preserve"> </script>
				<script type="text/javascript" src="{$web-context}/js/ingredient-search.js" xml:space="preserve"> </script>
			</xsl:when>
			<xsl:when test="$searchResults/@mode = 'advanced'">
				<script type="text/javascript" src="{$web-context}/js/jquery-1.3.2.js" xml:space="preserve"> </script>
				<script type="text/javascript" src="{$web-context}/js/jquery.ajaxQueue.js" xml:space="preserve"> </script>
				<script type="text/javascript" src="{$web-context}/js/xweb-locale.js" xml:space="preserve"> </script>
				<script type="text/javascript" src="{$web-context}/js/ieat-util.js" xml:space="preserve"> </script>
				<script type="text/javascript" src="{$web-context}/js/advanced-search.js" xml:space="preserve"> </script>
				<script type="text/javascript" xml:space="preserve">
					<xsl:comment>
					var numAdvancedCriteria = <xsl:value-of select="count($searchCriteria/eat:advanced)"/>;
					if ( numAdvancedCriteria == 0 ) {
						numAdvancedCriteria++;
					}
					
					var advancedCriteria = [
						<xsl:apply-templates select="$searchCriteria/eat:advanced" mode="data"/>
						];
					
					function init() {
						for ( var i = 0; i &lt; numAdvancedCriteria; i++ ) {
							initAdvancedSearchRow(i);
						}
					}
					
					window.onload = init;
					//</xsl:comment>
				</script>
			</xsl:when>
		</xsl:choose>
	</xsl:template>
	
	<xsl:template match="xweb:x-data" mode="action-links">
		<xsl:choose>
			<xsl:when test="not($searchResults/@mode) or $searchResults/@mode = 'simple'">
				<xsl:value-of select="key('i18n','link.recipe.search.simple')"/>
			</xsl:when>
			<xsl:otherwise>
				<a href="{$web-context}{$ctx/xweb:path}?mode=simple" title="{key('i18n','link.recipe.search.simple.title')}">
					<xsl:value-of select="key('i18n','link.recipe.search.simple')"/>
				</a>
			</xsl:otherwise>
		</xsl:choose>
		<xsl:text> - </xsl:text>
		<xsl:choose>
			<xsl:when test="$searchResults/@mode = 'ingredient'">
				<xsl:value-of select="key('i18n','link.recipe.search.ingredients')"/>
			</xsl:when>
			<xsl:otherwise>
				<a href="{$web-context}{$ctx/xweb:path}?mode=ingredient" title="{key('i18n','link.recipe.search.ingredients.title')}">
					<xsl:value-of select="key('i18n','link.recipe.search.ingredients')"/>
				</a>
			</xsl:otherwise>
		</xsl:choose>
		<xsl:if test="$acting-user">
			<xsl:text> - </xsl:text>
			<xsl:choose>
				<xsl:when test="$searchResults/@mode = 'advanced'">
					<xsl:value-of select="key('i18n','link.recipe.search.advanced')"/>
				</xsl:when>
				<xsl:otherwise>
					<a href="{$web-context}{$ctx/xweb:path}?mode=advanced" title="{key('i18n','link.recipe.search.advanced.title')}">
						<xsl:value-of select="key('i18n','link.recipe.search.advanced')"/>
					</a>
				</xsl:otherwise>
			</xsl:choose>
		</xsl:if>
	</xsl:template>
	
	<xsl:template match="xweb:x-data" mode="page-body">
		<div class="intro">
			<xsl:choose>
				<xsl:when test="$searchResults/@mode = 'ingredient'">
					<xsl:value-of select="key('i18n','recipe-search-by-ingredient.intro')" 
						disable-output-escaping="yes" />
				</xsl:when>
				<xsl:when test="$searchResults/@mode = 'advanced'">
					<xsl:value-of select="key('i18n','recipe-search-advanced.intro')" 
						disable-output-escaping="yes" />
				</xsl:when>
				<xsl:otherwise>
					<xsl:value-of select="key('i18n','recipe-search.intro')" 
						disable-output-escaping="yes"/>
				</xsl:otherwise>
			</xsl:choose>
		</div>
        
		<xsl:choose>
			<xsl:when test="$searchResults/@mode = 'ingredient'">
				<xsl:apply-templates select="." mode="search-for-recipes-by-ingredient"/>
			</xsl:when>
			<xsl:when test="$searchResults/@mode = 'advanced'">
				<xsl:apply-templates select="." mode="search-for-recipes-advanced"/>
			</xsl:when>
			<xsl:otherwise>
				<xsl:apply-templates select="." mode="search-for-recipes"/>
			</xsl:otherwise>
		</xsl:choose>
    </xsl:template>

	<xsl:template match="xweb:x-data" mode="search-for-recipes">
		<form method="post" action="{$web-context}{$ctx/xweb:path}">
			<table class="form">
				<tr>
					<th>
						<xsl:value-of select="key('i18n','query.displayName')"/>
					</th>
					<td colspan="3">
						<input type="text" name="criteria.simpleQuery" value="{$searchCriteria/eat:simpleQuery}"/>
					</td>
				</tr>
				<tr>
					<th/>
					<td>
						<input type="submit" value="{key('i18n','search.displayName')}"/>
					</td>
				</tr>
			</table>
			<input type="hidden" name="criteria.mode" value="simple"/>
		</form>
		<script type="text/javascript" xml:space="preserve">
			document.forms[0].elements['criteria.simpleQuery'].focus();
		</script>
		<xsl:if test="$searchCriteria">
			<xsl:apply-templates select="$searchResults" mode="search-for-recipes"/>
		</xsl:if>
	</xsl:template>

	<xsl:template match="xweb:x-data" mode="search-for-recipes-by-ingredient">	
		<form method="post" action="{$web-context}{$ctx/xweb:path}">
			<!-- 
				Recipe ingredients
			-->
			
			<div class="formLabel">
				<xsl:value-of select="key('i18n','recipe.ingredients.displayName')"/>:
			</div>

			<table class="form" id="ingredient_table">
				<xsl:for-each select="$searchCriteria/eat:ingredient">
					<xsl:call-template name="recipe-ingredient"/>
				</xsl:for-each>
				<xsl:if test="not($searchCriteria/eat:ingredient)">
					<xsl:call-template name="recipe-ingredient">
						<xsl:with-param name="index" select="0"/>
					</xsl:call-template>
				</xsl:if>
				<tr id="ingredient_add_row">
					<td>
						<a href="#" 
							id="ingredient_add_link"
							title="{key('i18n','recipe.ingredients.add')}" class="plus">
							<span class="alt">
								<xsl:value-of select="key('i18n','recipe.ingredients.add')"/>
							</span>
						</a>
					</td>
					<td></td>
				</tr>
			</table>
					
			<table class="form">
				<tr>
					<th/>
					<td>
						<input type="submit" value="{key('i18n','search.displayName')}"/>
						<xsl:text> </xsl:text>
						<input type="submit" name="_cancel" value="{key('i18n','cancel.displayName')}"/>
					</td>
				</tr>
			</table>
			<input type="hidden" name="criteria.mode" value="ingredient"/>
		</form>
		<xsl:if test="$searchCriteria">
			<xsl:apply-templates select="$searchResults" mode="search-for-recipes"/>
		</xsl:if>
	</xsl:template>
	
	<xsl:template match="xweb:x-data" mode="search-for-recipes-advanced">
		<form method="post" action="{$web-context}{$ctx/xweb:path}" id="advancedSearchForm">
			<table id="criteria_table" class="form">
				<tbody>
					<xsl:for-each select="$searchCriteria/eat:advanced">
						<xsl:call-template name="advanced-criteria"/>
					</xsl:for-each>
					<xsl:if test="not($searchCriteria/eat:advanced)">
						<xsl:call-template name="advanced-criteria">
							<xsl:with-param name="index" select="0"/>
						</xsl:call-template>
					</xsl:if>
					<tr id="criteria_add_row">
						<td colspan="3">
							<a href="javascript:addAdvancedSearchCriteria()" 
								title="{key('i18n','recipe.search.advanced.criteria.add')}" 
								class="plus">
								<span class="alt">
									<xsl:value-of select="key('i18n','recipe.search.advanced.criteria.add')"/>
								</span>
							</a>
						</td>
					</tr>	
		        </tbody>
			</table>
			<div>
				<input type="submit" value="{key('i18n','search.displayName')}"/>
			</div>
			<input type="hidden" name="criteria.mode" value="advanced"/>
		</form>
		<script type="text/javascript" xml:space="preserve">
			document.forms[0].elements['criteria.advanced[0].type'].focus();
		</script>
		<xsl:if test="$searchCriteria">
			<xsl:apply-templates select="$searchResults" mode="search-for-recipes"/>
		</xsl:if>
	</xsl:template>

    <xsl:template match="eat:recipe" mode="search-for-recipes">
    		<li>
    			<a>
    				<xsl:attribute name="href">
    					<xsl:value-of select="$web-context"/>
    					<xsl:text>/recipe.do?recipeId=</xsl:text>
    					<xsl:value-of select="@recipeId"/>
    					<xsl:text>&amp;criteria.mode=</xsl:text>
    					<xsl:value-of select="preceding-sibling::eat:recipe-criteria/@mode"/>
    					<xsl:text>&amp;criteria.simpleQuery=</xsl:text>
    					<xsl:value-of select="preceding-sibling::eat:recipe-criteria/eat:simpleQuery"/>
    				</xsl:attribute>
    				<xsl:value-of select="eat:name"/>
    			</a>
    			<p>
    				<xsl:apply-templates select="eat:excerpt"/>
    			</p>
    		</li>
	</xsl:template>

	<xsl:template name="recipe-ingredient">
    	<xsl:param name="index"/>
    	<xsl:variable name="row-index">
    		<xsl:choose>
    			<xsl:when test="string-length($index) &gt; 0">
    				<xsl:value-of select="$index"/>
    			</xsl:when>
    			<xsl:otherwise>
    				<xsl:value-of select="position() - 1"/>
    			</xsl:otherwise>
    		</xsl:choose>
    	</xsl:variable>
		<tr valign="middle" class="recipe-ingredient">
			<xsl:if test="not(self::eat:ingredient) or position() = 1">
				<xsl:attribute name="id">ingredient_row</xsl:attribute>
			</xsl:if>
			<td>
				<!--select name="criteria.ingredient[{$row-index}].ingredient.ingredientId">
					<option value="0"></option>
					<xsl:for-each select="$aux/eat:ui/eat:ingredient">
						<xsl:call-template name="ingredient-ingredient">
							<xsl:with-param name="ingredient" select="$me"/>
						</xsl:call-template>
					</xsl:for-each>
				</select-->
				<input type="text" 
					name="criteria.ingredient[{$row-index}].ingredient.name" 
					id="criteria.ingredient[{$row-index}].ingredient.name" 
					class="ingredient-autocomplete"
					value="{eat:ingredient/eat:name}" />
				<input type="hidden" 
					name="criteria.ingredient[{$row-index}].ingredient.ingredientId"
					id="criteria.ingredient[{$row-index}].ingredient.ingredientId">
					<xsl:attribute name="value">
						<xsl:choose>
							<xsl:when test="number(eat:ingredient/@ingredientId) &gt; 0">
								<xsl:value-of select="eat:ingredient/@ingredientId"/>
							</xsl:when>
							<xsl:otherwise>0</xsl:otherwise>
						</xsl:choose>
					</xsl:attribute>
				</input>
			</td>
			<td>
				<input type="checkbox" name="criteria.ingredient[{$row-index}].optional"
					value="true">
					<xsl:if test="@optional = 'true'">
						<xsl:attribute name="checked">checked</xsl:attribute>
					</xsl:if>
				</input>
			</td>
			<td>
				<a href="#"
					title="{key('i18n','recipe.ingredients.remove')}" class="minus">
					<xsl:if test="not(self::eat:ingredient) or position() = 1">
						<xsl:attribute name="style">display: none</xsl:attribute>
					</xsl:if>
					<span class="alt">
						<xsl:value-of select="key('i18n','recipe.ingredients.remove')"/>
					</span>
				</a>
			</td>
		</tr>
	</xsl:template>

	<xsl:template name="ingredient-ingredient">
		<xsl:param name="ingredient"/>
		<option value="{@ingredientId}">
			<xsl:if test="@ingredientId = $ingredient/eat:ingredient/@ingredientId">
				<xsl:attribute name="selected">selected</xsl:attribute>
			</xsl:if>
			<xsl:value-of select="eat:name"/>
		</option>
	</xsl:template>
	
	<xsl:template name="advanced-criteria">
	    	<xsl:param name="index"/>
	    	<xsl:variable name="row-index">
	    		<xsl:choose>
	    			<xsl:when test="string-length($index) &gt; 0">
	    				<xsl:value-of select="$index"/>
	    			</xsl:when>
	    			<xsl:otherwise>
	    				<xsl:value-of select="position() - 1"/>
	    			</xsl:otherwise>
	    		</xsl:choose>
	    	</xsl:variable>
	    	<xsl:variable name="me" select="."/>
		<tr>
			<xsl:if test="not(self::eat:advanced) or position() = 1">
				<xsl:attribute name="id">criteria_row</xsl:attribute>
			</xsl:if>
			<td>
				<select name="criteria.advanced[{$row-index}].type">
					<xsl:text> </xsl:text>
				</select>
				
				<select name="criteria.advanced[{$row-index}].op">
					<xsl:text> </xsl:text>
				</select>
				
				<select name="criteria.advanced[{$row-index}].choice">
					<xsl:text> </xsl:text>
				</select>
				
				<input type="text" name="criteria.advanced[{$row-index}].query" />
			</td>
			<td>
				<input type="checkbox" name="criteria.advanced[{$row-index}].required"
					value="true"/>
			</td>
			<td>
				<a href="javascript:removeAdvancedSearchCriteria({$row-index})"
					title="{key('i18n','recipe.search.advanced.criteria.remove')}" class="minus">
					<xsl:if test="not(self::eat:advanced) or position() = 1">
						<xsl:attribute name="style">display: none</xsl:attribute>
					</xsl:if>
					<span class="alt">
						<xsl:value-of select="key('i18n','recipe.search.advanced.criteria.remove')"/>
					</span>
				</a>
			</td>
		</tr>
	</xsl:template>
	
	<xsl:template match="eat:advanced" mode="data">
		<xsl:text>['</xsl:text>
		<xsl:value-of select="@type"/>
		<xsl:text>',</xsl:text>
		<xsl:value-of select="@op"/>
		<xsl:text>,'</xsl:text>
		<xsl:value-of select="@choice"/>
		<xsl:text>','</xsl:text>
		<xsl:value-of select="eat:query"/>
		<xsl:text>',</xsl:text>
		<xsl:choose>
			<xsl:when test="@required = 'true'">
				<xsl:text>true</xsl:text>
			</xsl:when>
			<xsl:otherwise>
				<xsl:text>false</xsl:text>
			</xsl:otherwise>
		</xsl:choose>
		<xsl:text>]</xsl:text>
		<xsl:if test="position()!=last()">
			<xsl:text>,
			</xsl:text>
		</xsl:if>
	</xsl:template>

</xsl:stylesheet>
