<?xml version="1.0" encoding="utf-8"?>
<modification>
    <name>AJAX live search</name>
    <code>ajax-live-search</code>
    <version>2.1.0.2</version>
    <author>Denise (rei7092@gmail.com)</author>
    <link>http://www.jindolure.com/</link>
    <file path="catalog/controller/common/header.php">
        <operation>
            <search>
               <![CDATA[$data['search'] = $this->load->controller('common/search');]]>
            </search>
            <add position="after"><![CDATA[
                $data['live_search_status'] = $this->config->get('live_search_status');
                $data['live_search_show_image'] = $this->config->get('live_search_show_image');
                $data['live_search_show_price'] = $this->config->get('live_search_show_price');
                $data['live_search_show_description'] = $this->config->get('live_search_show_description');
            ]]>
            </add>
        </operation>
    </file>
    
    <file path="catalog/view/theme/*/template/common/header.tpl">
        <operation>
            <search>
               <![CDATA[</head>]]>
            </search>
            <add position="before">
            <![CDATA[
            <?php if ($live_search_status):?>
            <link rel="stylesheet" type="text/css" href="catalog/view/theme/default/stylesheet/live_search.css" />
			<script type="text/javascript"><!--
				var live_search = {
					selector: '#search',
					text_no_matches: 'No matches.',
					height: '50px',
					delay: 400
				}

				$(document).ready(function() {
					var html = '';
					html += '<div id="live-search">';
					html += '	<ul>';
					html += '	</ul>';
					html += '</div>';

					$(live_search.selector).after(html);
					$('input[name=\'search\']').autocomplete({
						'source': function(request, response) {
							if ($(live_search.selector + ' input[type=\'text\']').val() == '') {
								$('#live-search').css('display','none');
							}
							else{
								var html = '';
								html += '<li style="text-align: center;height:10px;">';
								html +=		'	<img class="loading" src="catalog/view/theme/default/image/loading.gif" />';
								html +=	'</li>';
								$('#live-search ul').html(html);
								$('#live-search').css('display','block');
							}
							var filter_name = $(live_search.selector + ' input[type=\'text\']').val();

							if (filter_name.length>0) {
								$.ajax({
									url: 'index.php?route=product/live_search&filter_name=' +  encodeURIComponent(request),
									dataType: 'json',
									success: function(products) {
										$('#live-search ul li').remove();
										if (!$.isEmptyObject(products)) {
											var show_image = <?php echo $live_search_show_image;?>;
											var show_price = <?php echo $live_search_show_price;?>;
											var show_description = <?php echo $live_search_show_description;?>;

											$.each(products, function(index,product) {
												var html = '';
												
												html += '<li>';
												html += '<a href="' + product.url + '" title="' + product.name + '">';
												if(product.image && show_image){
													html += '	<div class="product-image"><img alt="' + product.name + '" src="' + product.image + '"></div>';
												}
												html += '	<div class="product-name">' + product.name ;
												if(show_description){
													html += '<p>' + product.extra_info + '</p>';
												}
												html += '</div>';
												if(show_price){
													if (product.special) {
														html += '	<div class="product-price"><span class="special">' + product.price + '</span><span class="price">' + product.special + '</span></div>';
													} else {
														html += '	<div class="product-price"><span class="price">' + product.price + '</span></div>';
													}
												}
												html += '<span style="clear:both"></span>';
												html += '</a>';
												html += '</li>';
												$('#live-search ul').append(html);
											});
										} else {
											var html = '';
											html += '<li style="text-align: center;height:10px;">';
											html +=		live_search.text_no_matches;
											html +=	'</li>';

											$('#live-search ul').html(html);
										}
										$('#live-search ul li').css('height',live_search.height);
										$('#live-search').css('display','block');
										return false;
									}
								});
							}
						},
						'select': function(product) {
							$('input[name=\'search\']').val(product.name);
						}
					});

					$(document).bind( "mouseup touchend", function(e){
					  var container = $('#live-search');
					  if (!container.is(e.target) && container.has(e.target).length === 0)
					  {
					    container.hide();
					  }
					});
				});
			//--></script>
			<?php endif;?>
            ]]>
            </add>
        </operation>
    </file>
</modification>
