From 1dff64b5beb0d102b29f75de7af4ebb47b6daf2c Mon Sep 17 00:00:00 2001
From: mDeflotte <maxence.deflotte@prestashop.com>
Date: Mon, 5 Dec 2011 14:08:13 +0000
Subject: [PATCH] // New template for the blocklayered

---
 modules/blocklayered/blocklayered-15.css | 150 +++++++++++++++++++++
 modules/blocklayered/blocklayered.css    | 159 +++++++++++++++--------
 modules/blocklayered/blocklayered.js     |  26 +++-
 modules/blocklayered/blocklayered.php    |  47 +++----
 modules/blocklayered/blocklayered.tpl    |  54 ++++----
 modules/blocklayered/delete.gif          | Bin 0 -> 213 bytes
 6 files changed, 326 insertions(+), 110 deletions(-)
 create mode 100644 modules/blocklayered/blocklayered-15.css
 create mode 100644 modules/blocklayered/delete.gif

diff --git a/modules/blocklayered/blocklayered-15.css b/modules/blocklayered/blocklayered-15.css
new file mode 100644
index 000000000..33eb0df38
--- /dev/null
+++ b/modules/blocklayered/blocklayered-15.css
@@ -0,0 +1,150 @@
+#enabled_filters {
+	margin: 0 0 10px 0;
+	background: #eee;
+	padding: 5px;
+}
+#enabled_filters .layered_subtitle {
+	font-weight: bold;
+	font-size: 12px;
+}
+#enabled_filters ul li {padding:2px 0}
+#enabled_filters li a {
+	float: right;
+	display: inline-block;
+	height: 12px;
+	width: 12px;
+	text-indent: -5000px;
+	/*background: url(../../../img/icon/delete.gif) no-repeat 0 0 transparent;*/
+	background: url(./delete.gif) no-repeat 0 0 transparent;
+	cursor: pointer;
+}
+#layered_block_left .layered_close {
+	float: right;
+	padding-right: 5px;
+}
+#layered_block_left .layered_subtitle {
+	display: inline-block;
+	font-weight: bold;
+	font-size: 12px;
+}
+#layered_block_left ul {
+	clear: both;
+	padding: 5px 0;
+}
+#layered_block_left ul  li {padding:2px 0}
+#layered_block_left ul li label {cursor: pointer;}
+#layered_block_left div.block_content {
+}
+#layered_block_left ul {
+	padding-left: 0;
+}
+#layered_block_left ul li {
+	list-style-type: none;
+}
+#layered_block_left div > form > div > div {
+	margin-top: 5px;
+}
+#layered_block_left #enabled_filters , #layered_url_filter_block{
+	font-size: 10px;
+	padding-bottom: 10px;
+	margin-bottom: 5px;
+	margin-top: 0px;
+	border-bottom: 1px dotted #CCC;
+}
+#layered_block_left #enabled_filters ul li {
+	margin-left: 0;
+	padding-left: 0;
+}
+
+
+/* Style moved form the template to the css  */
+
+#layered_block_left #enabled_filters ul li:hover {
+	background: inherit;
+	color: inherit;
+}
+#layered_block_left #enabled_filters a {
+	text-decoration: none;
+	color: red;
+}
+#layered_block_left ul li:hover {
+}
+#layered_block_left ul li input.checkbox {
+	vertical-align: middle;
+	margin-left: 2px;
+}
+#layered_block_left ul li .disabled {
+	color: #666;
+}
+#layered_block_left .color-option {
+	 border: 1px solid #666666;
+	 height: 16px;
+	 margin-left: 0;
+	 padding: 0;
+	 width: 16px;
+}
+#layered_block_left .nomargin a {
+	display: inline;
+}
+#layered_form .select {
+	width: 165px;
+}
+#layered_form .color-option {
+	margin-left: 0;
+	width: 16px;
+	height: 16px;
+	padding:0;
+	border: 1px solid #666;
+}
+#layered_form  .color-option.on {
+	border: 1px solid red;
+}
+#layered_form input[type=radio] {
+	margin-left: 2px;
+	vertical-align: middle;
+}
+.layered_price_range {
+	margin-left: 7px;
+}
+.layered_price_range_unit {
+	margin-right: 7px;
+}
+.layered_slider_container {
+	margin: 6px 0 6px 7px; width: 91%;
+}
+.layered_slider {
+	margin-top:5px;
+}
+.layered_input_range_min {
+	width:30px;
+}
+.layered_input_range_max {
+	width:40px;
+}
+.layered_list_selected {
+	font-weight: bold;
+}
+.layered_list {
+	display: block;
+	cursor: pointer;
+}
+.layered_list:hover {
+	font-weight: bold;
+}
+.layered_ajax_loader p {
+	margin: 20px 0;
+	text-align: center;
+}
+.hide-action {
+	text-align: center;
+	text-align: right;
+	display: block;
+	cursor: pointer;
+}
+.hide-action:hover {
+	font-weight: bold;
+}
+#layered_form div div ul {
+	max-height: 200px;
+	overflow-x: auto;
+}
diff --git a/modules/blocklayered/blocklayered.css b/modules/blocklayered/blocklayered.css
index 0286ed87c..6c91d2961 100644
--- a/modules/blocklayered/blocklayered.css
+++ b/modules/blocklayered/blocklayered.css
@@ -1,56 +1,29 @@
-/* Bloc layered */
-#enabled_filters {
-	margin:5px 0 10px 0;
-	padding:5px;
-	background:#eee
-}
-#enabled_filters .layered_subtitle {
-	font-weight:bold;
-	font-size:12px
-}
-#enabled_filters ul li {padding:2px 0}
-#enabled_filters li a.del {
-	float: right;
-   display: inline-block;
-   height: 12px;
-   width: 12px;
-	text-indent:-5000px;
-	background:url(../../../img/icon/delete.gif) no-repeat 0 0 transparent;
-	cursor:pointer
-}
-
-.blockfilter {margin:5px 0}
-.blockfilter .layered_close {
-	float: right;
-   display: inline-block;
-   height: 12px;
-   width: 12px;
-	text-indent:-5000px;
-	background:url(../../../img/icon/delete.gif) no-repeat 0 0 transparent;
-	cursor:pointer
-}
-.blockfilter .layered_subtitle {
-	display: inline-block;
-	font-weight: bold;
-	font-size: 12px;
-}
-.blockfilter ul {
-	clear:both;
-	padding:5px 0;
-	border-bottom:1px dotted #ccc
-}
-.blockfilter ul  li {padding:2px 0}
-.blockfilter ul li label {cursor: pointer;}
-
-
-
-/*
 #layered_block_left div.block_content {
 	padding: 6px;
 }
 
 #layered_block_left ul {
 	padding-left: 0;
+	max-height: 120px;
+	overflow-y: auto;
+	overflow-x: hidden;
+	padding-left: 1px;
+	padding-right: 1px;
+}
+
+#layered_form > div > div {
+	border-bottom: 1px dotted #CCCCCC;
+	padding-bottom: 5px;
+	margin-bottom: 5px;
+}
+
+#layered_block_left .hide-action {
+	display: block;
+	text-align: right;
+	padding-right: 5px;
+}
+#layered_block_left .hide-action:hover {
+	text-decoration: underline;
 }
 
 #layered_block_left ul li {
@@ -59,11 +32,9 @@
 	list-style-type: none;
 }
 
-#layered_block_left #enabled_filters , #layered_url_filter_block{
+#layered_block_left #enabled_filters , #layered_url_filter_block {
 	font-size: 10px;
-	padding-bottom: 10px;
-	margin-bottom: 5px;
-	border-bottom: 1px dotted #CCC;
+	padding-bottom: 5px;
 }
 
 #layered_block_left #enabled_filters ul li {
@@ -71,6 +42,8 @@
 	padding-left: 0;
 }
 
+
+/* Style moved form the template to the css  */
 #layered_block_left #enabled_filters ul li:hover {
 	background: inherit;
 	color: inherit;
@@ -86,7 +59,31 @@
 	color: #FFF;
 }
 
+#layered_block_left ul li label {
+	cursor: pointer;
+}
 
+#layered_block_left ul li.nomargin {
+	margin-left: 0;
+}
+
+#layered_block_left span.layered_subtitle {
+	float: left;
+	font-weight: bold;
+	font-size: 12px;
+	display: block;
+	margin-bottom: 4px;
+}
+
+#layered_block_left span.layered_close a { text-decoration: none; }
+
+#layered_block_left span.layered_close {
+	float: right;
+	font-weight: bold;
+	font-size: 12px;
+	display: block;
+	margin-bottom: 4px;
+}
 
 #layered_block_left ul li input.checkbox {
 	vertical-align: middle;
@@ -96,4 +93,62 @@
 #layered_block_left ul li .disabled {
 	color: #666;
 }
-*/
\ No newline at end of file
+#product_list .warning {
+	margin-top: 13px;
+}
+
+#layered_form .select {
+	width: 165px;
+}
+#layered_form .color-option {
+	margin-left: 0;
+	width: 16px;
+	height: 16px;
+	padding:0;
+	border: 1px solid #666;
+}
+#layered_form  .color-option.on {
+	border: 1px solid red;
+}
+#layered_form input[type=radio] {
+	margin-left: 2px;
+	vertical-align: middle;
+}
+.layered_price_range {
+	margin-left: 7px;
+}
+.layered_price_range_unit {
+	margin-right: 7px;
+}
+.layered_slider_container {
+	margin: 6px 0 6px 6px; width: 93%;
+}
+.layered_slider {
+	margin-top:5px;
+}
+.layered_input_range_min {
+	width:30px;
+}
+.layered_input_range_max {
+	width:40px;
+}
+.layered_list_selected {
+	font-weight: bold;
+}
+.layered_ajax_loader p {
+	margin: 20px 0;
+	text-align: center;
+}
+.hide-action {
+	text-align: center;
+	text-align: right;
+	display: block;
+	cursor: pointer;
+}
+.hide-action:hover {
+	font-weight: bold;
+}
+#layered_form div div ul {
+	max-height: 200px;
+	overflow-x: auto;
+}
diff --git a/modules/blocklayered/blocklayered.js b/modules/blocklayered/blocklayered.js
index 53c3a4092..1b0e714d9 100644
--- a/modules/blocklayered/blocklayered.js
+++ b/modules/blocklayered/blocklayered.js
@@ -45,7 +45,13 @@ $(document).ready(function()
 	});
 	
 	// Click on checkbox
-	$('#layered_form input, #layered_form select').live('keyup', function()
+	$('#layered_form input[type=checkbox], #layered_form input[type=radio], #layered_form select').live('change', function()
+	{
+		reloadContent();
+	});
+	
+	// Changing content of an input text
+	$('#layered_form input.layered_input_range').live('keyup', function()
 	{
 		if ($(this).attr('timeout_id'))
 			window.clearTimeout($(this).attr('timeout_id'));
@@ -196,7 +202,7 @@ function cancelFilter()
 	{
 		if ($(this).attr('rel').search(/_slider$/) > 0)
 		{
-			if ($('#'+$(this).attr('rel')).lenght)
+			if ($('#'+$(this).attr('rel')).length)
 			{
 				$('#'+$(this).attr('rel')).slider('values' , 0, $('#'+$(this).attr('rel')).slider('option' , 'min' ));
 				$('#'+$(this).attr('rel')).slider('values' , 1, $('#'+$(this).attr('rel')).slider('option' , 'max' ));
@@ -210,8 +216,16 @@ function cancelFilter()
 		}
 		else
 		{
-			$('#'+$(this).attr('rel')).attr('checked', false);
-			$('#layered_form input[name='+$(this).attr('rel')+']:hidden').remove();
+			if ($('option#'+$(this).attr('rel')).length)
+			{
+				$('#'+$(this).attr('rel')).parent().val('');
+			}
+			else
+			{
+				$('#'+$(this).attr('rel')).attr('checked', false);
+				$('.'+$(this).attr('rel')).attr('checked', false);
+				$('#layered_form input[name='+$(this).attr('rel')+']:hidden').remove();
+			}
 		}
 		reloadContent();
 		e.preventDefault();
@@ -302,9 +316,7 @@ function reloadContent(params_plus)
 		dataType: 'json',
 		success: function(result)
 		{
-			$('#layered_block_left').after('<div id="tmp_layered_block_left"></div>').remove();
-			if (result.filtersBlock)
-				$('#tmp_layered_block_left').html(result.filtersBlock).attr('id', 'layered_block_left');
+			$('#layered_block_left').replaceWith(result.filtersBlock);
 			
 			$('.category-product-count').html(result.categoryCount);
 
diff --git a/modules/blocklayered/blocklayered.php b/modules/blocklayered/blocklayered.php
index de686b139..c291ff203 100644
--- a/modules/blocklayered/blocklayered.php
+++ b/modules/blocklayered/blocklayered.php
@@ -1099,7 +1099,7 @@ class BlockLayered extends Module
 			$this->context->controller->addJS(($this->_path).'blocklayered.js');
 			$this->context->controller->addJS(_PS_JS_DIR_.'jquery/jquery-ui-1.8.10.custom.min.js');
 			$this->context->controller->addJQueryUI('ui.slider');
-			$this->context->controller->addCSS(($this->_path).'blocklayered.css', 'all');
+			$this->context->controller->addCSS(($this->_path).'blocklayered-15.css', 'all');
 			$this->context->controller->addJQueryPlugin('scrollTo');
 		}
 		else
@@ -1557,21 +1557,6 @@ class BlockLayered extends Module
 				 'search'  => $this->l('Search a category')
 			);
 			
-			if (version_compare(_PS_VERSION_,'1.5','>'))
-			{
-				$this->context->controller->addJQueryPlugin('fancybox');
-				$this->context->controller->addJQueryUI('ui.sortable');
-				$this->context->controller->addJQueryUI('ui.draggable');
-				$this->context->controller->addJQueryUI('effects.transfer');
-			}
-			else
-			{
-				$html .= '<script type="text/javascript" src="'.__PS_BASE_URI__.'js/jquery/jquery-ui-1.8.10.custom.min.js"></script>
-				<script type="text/javascript" src="'.__PS_BASE_URI__.'js/jquery/jquery.fancybox-1.3.4.js"></script>
-				<link type="text/css" rel="stylesheet" href="'.__PS_BASE_URI__.'css/jquery.fancybox-1.3.4.css" />';
-				
-			}
-			
 			$html .= Helper::renderAdminCategorieTree($trads, $selectedCat, 'categoryBox');
 			
 			$html .= '
@@ -1593,8 +1578,24 @@ class BlockLayered extends Module
 					</div>
 				</div>
 				<div class="clear"></div>
-				<hr size="1" noshade />
-				<script type="text/javascript">
+				<hr size="1" noshade />';
+				
+			if (version_compare(_PS_VERSION_,'1.5','>'))
+			{
+				$this->context->controller->addJQueryPlugin('fancybox');
+				$this->context->controller->addJQueryUI('ui.sortable');
+				$this->context->controller->addJQueryUI('ui.draggable');
+				$this->context->controller->addJQueryUI('effects.transfer');
+			}
+			else
+			{
+				$html .= '<script type="text/javascript" src="'.__PS_BASE_URI__.'js/jquery/jquery-ui-1.8.10.custom.min.js"></script>
+					<script type="text/javascript" src="'.__PS_BASE_URI__.'js/jquery/jquery.fancybox-1.3.4.js"></script>
+					<link type="text/css" rel="stylesheet" href="'.__PS_BASE_URI__.'css/jquery.fancybox-1.3.4.css" />';
+				
+			}
+			
+			$html .= '<script type="text/javascript">
 					
 					function updLayCounters()
 					{
@@ -1720,7 +1721,8 @@ class BlockLayered extends Module
 								updElements(0, 0);
 							},
 							\'onComplete\': function() {
-							/*	if($(\'#categories-treeview li#1\').attr(\'cleaned\'))
+							'.(version_compare(_PS_VERSION_,'1.5','<') ? '
+								if($(\'#categories-treeview li#1\').attr(\'cleaned\'))
 									return;
 								if($(\'#categories-treeview li#1\').attr(\'cleaned\', true))
 								$(\'#categories-treeview li#1\').removeClass(\'static\');
@@ -1729,10 +1731,10 @@ class BlockLayered extends Module
 								$(\'#categories-treeview li#1\').
 									removeClass(\'collapsable lastCollapsable\').
 									addClass(\'last static\');
-								$(\'.hitarea\').click(function(it)
+								$(\'.hitarea\').live(\'click\', function(it)
 								{
 									$(this).parent().find(\'> .category_label\').click();
-								});*/
+								});' : '').'
 							}
 						});
 
@@ -3273,8 +3275,7 @@ class BlockLayered extends Module
 		`type` ENUM(\'category\',\'id_feature\',\'id_attribute_group\',\'quantity\',\'condition\',\'manufacturer\',\'weight\',\'price\') NOT NULL,
 		`position` INT(10) UNSIGNED NOT NULL,
 		`filter_type` int(10) UNSIGNED NOT NULL DEFAULT 0,
-		`filter_show_limit` int(10) UNSIGNED NOT NULL DEFAULT 0;
-		
+		`filter_show_limit` int(10) UNSIGNED NOT NULL DEFAULT 0,
 		PRIMARY KEY (`id_layered_category`),
 		KEY `id_category` (`id_category`,`type`)
 		) ENGINE=MyISAM DEFAULT CHARSET=latin1 AUTO_INCREMENT=1;'); /* MyISAM + latin1 = Smaller/faster */
diff --git a/modules/blocklayered/blocklayered.tpl b/modules/blocklayered/blocklayered.tpl
index 34e60b362..75c71c744 100644
--- a/modules/blocklayered/blocklayered.tpl
+++ b/modules/blocklayered/blocklayered.tpl
@@ -51,7 +51,7 @@ param_product_url = '';
 										{if $smarty.foreach.f_values.first}
 											<li>
 												<a href="#" rel="layered_{$filter.type}_slider" title="{l s='Cancel' mod='blocklayered'}">x</a>
-												{$filter.name|escape:html:'UTF-8'}{l s=':'} 
+												{$filter.name|escape:html:'UTF-8'}{l s=':' mod='blocklayered'}
 												{$filter.values[0]|escape:html:'UTF-8'}{$filter.unit|escape:html:'UTF-8'} - 
 												{$filter.values[1]|escape:html:'UTF-8'}{$filter.unit|escape:html:'UTF-8'}
 											</li>
@@ -96,7 +96,7 @@ param_product_url = '';
 										{/if}
 										<label for="layered_{$filter.type_lite}_{$id_value}"{if !$value.nbr} class="disabled"{else}{if isset($filter.is_color_group) && $filter.is_color_group} name="layered_{$filter.type_lite}_{$id_value}" class="layered_color" rel="{$id_value}_{$filter.id_key}"{/if}{/if}>
 											{if !$value.nbr}
-											{$value.name|escape:html:'UTF-8'}{if $layered_show_qties}<span> (0)</span>{/if}</a>
+											{$value.name|escape:html:'UTF-8'}{if $layered_show_qties}<span> ({$value.nbr})</span>{/if}</a>
 											{else}
 											<a href="{$value.link}" rel="{$value.rel}">{$value.name|escape:html:'UTF-8'}{if $layered_show_qties}<span> ({$value.nbr})</span>{/if}</a>
 											{/if}
@@ -110,11 +110,11 @@ param_product_url = '';
 											<input class="radio color-option {if isset($value.checked) && $value.checked}on{/if}" type="button" name="layered_{$filter.type_lite}_{$id_value}" rel="{$id_value}_{$filter.id_key}" id="layered_id_attribute_group_{$id_value}" {if !$value.nbr} value="X" disabled="disabled"{/if} style="background: {if isset($value.color)}{if file_exists($smarty.const._PS_ROOT_DIR_|cat:"/img/co/$id_value.jpg")}url(img/co/{$id_value}.jpg){else}{$value.color}{/if}{else}#CCC{/if};"/>
 											{if isset($value.checked) && $value.checked}<input type="hidden" name="layered_{$filter.type_lite}_{$id_value}" value="{$id_value}" />{/if}
 										{else}
-											<input type="radio" class="radio" name="layered_{$filter.type_lite}_{$id_value}" id="layered_{$filter.type_lite}{if $id_value || $filter.type == 'quantity'}_{$id_value}{/if}" value="{$id_value}{if $filter.id_key}_{$filter.id_key}{/if}"{if isset($value.checked)} checked="checked"{/if}{if !$value.nbr} disabled="disabled"{/if} /> 
+											<input type="radio" class="radio layered_{$filter.type_lite}_{$id_value}" name="layered_{$filter.type_lite}{if $filter.id_key}_{$filter.id_key}{/if}" id="layered_{$filter.type_lite}{if $id_value || $filter.type == 'quantity'}_{$id_value}{if $filter.id_key}_{$filter.id_key}{/if}{/if}" value="{$id_value}{if $filter.id_key}_{$filter.id_key}{/if}"{if isset($value.checked)} checked="checked"{/if}{if !$value.nbr} disabled="disabled"{/if} /> 
 										{/if}
 										<label for="layered_{$filter.type_lite}_{$id_value}"{if !$value.nbr} class="disabled"{else}{if isset($filter.is_color_group) && $filter.is_color_group} name="layered_{$filter.type_lite}_{$id_value}" class="layered_color" rel="{$id_value}_{$filter.id_key}"{/if}{/if}>
 											{if !$value.nbr}
-												{$value.name|escape:html:'UTF-8'}{if $layered_show_qties}<span> (0)</span>{/if}</a>
+												{$value.name|escape:html:'UTF-8'}{if $layered_show_qties}<span> ({$value.nbr})</span>{/if}</a>
 											{else}
 												<a href="{$value.link}" rel="{$value.rel}">{$value.name|escape:html:'UTF-8'}{if $layered_show_qties}<span> ({$value.nbr})</span>{/if}</a>
 											{/if}
@@ -123,9 +123,10 @@ param_product_url = '';
 								{/foreach}
 							{else}
 								<select class="select" {if $filter.filter_show_limit > 1}multiple="multiple" size="{$filter.filter_show_limit}"{/if}>
+									<option value="">{l s='No filters' mod='blocklayered'}</option>
 									{foreach from=$filter.values key=id_value item=value}
 										<option style="color: {if isset($value.color)}{$value.color}{/if}" id="layered_id_attribute_group_{$id_value}" value="{$id_value}_{$filter.id_key}" {if isset($value.checked) && $value.checked}selected="selected"{/if}>
-											{$value.name|escape:html:'UTF-8'}{if $layered_show_qties}<span> (0)</span>{/if}</a>
+											{$value.name|escape:html:'UTF-8'}{if $layered_show_qties}<span> ({$value.nbr})</span>{/if}</a>
 										</option>
 									{/foreach}
 								</select>
@@ -133,8 +134,8 @@ param_product_url = '';
 						{else}
 							{if $filter.filter_type == 0}
 								<label for="{$filter.type}">{l s='Range:' mod='blocklayered'}</label> <span id="layered_{$filter.type}_range"></span>
-								<div style="margin: 6px 0 6px 6px; width: 93%;">
-									<div style="margin-top:5px;" class="layered_slider" id="layered_{$filter.type}_slider"></div>
+								<div class="layered_slider_container">
+									<div class="layered_slider" id="layered_{$filter.type}_slider"></div>
 								</div>
 								<script type="text/javascript">
 								{literal}
@@ -159,11 +160,11 @@ param_product_url = '';
 								{/literal}
 								</script>
 							{else if $filter.filter_type == 1}
-								<li>
-									{l s='From' mod='blocklayered'} <input class="layered_{$filter.type}_range" id="layered_{$filter.type}_range_min" type="text" value="{$filter.values[0]}" style="width:30px;"/>
-									<span class="layered_price_range_unit">{$filter.unit}</span>
-									{l s='to' mod='blocklayered'} <input class="layered_{$filter.type}_range" id="layered_{$filter.type}_range_max" type="text" value="{$filter.values[1]}" style="width:40px;"/>
-									<span class="layered_price_range_unit">{$filter.unit}</span>
+								<li class="nomargin">
+									{l s='From' mod='blocklayered'} <input class="layered_{$filter.type}_range layered_input_range_min layered_input_range" id="layered_{$filter.type}_range_min" type="text" value="{$filter.values[0]}"/>
+									<span class="layered_{$filter.type}_range_unit">{$filter.unit}</span>
+									{l s='to' mod='blocklayered'} <input class="layered_{$filter.type}_range layered_input_range_max layered_input_range" id="layered_{$filter.type}_range_max" type="text" value="{$filter.values[1]}"/>
+									<span class="layered_{$filter.type}_range_unit">{$filter.unit}</span>
 									<script type="text/javascript">
 									{literal}
 										$('#layered_{/literal}{$filter.type}{literal}_range_min').attr('limitValue', {/literal}{$filter.min}{literal});
@@ -173,30 +174,27 @@ param_product_url = '';
 								</li>
 							{else}
 								{foreach $filter.list_of_values as $values}
-									<li onclick="$('#layered_{$filter.type}_range_min').val({$values[0]});$('#layered_{$filter.type}_range_max').val({$values[1]});reloadContent();" style="{if $filter.values[1] == $values[1] && $filter.values[0] == $values[0]}font-weight: bold;{/if}">
+									<li class="nomargin" onclick="$('#layered_{$filter.type}_range_min').val({$values[0]});$('#layered_{$filter.type}_range_max').val({$values[1]});reloadContent();" class="{if $filter.values[1] == $values[1] && $filter.values[0] == $values[0]}layered_list_selected{/if} layered_list">
 										- {l s='From' mod='blocklayered'} {$values[0]} {$filter.unit} {l s='to' mod='blocklayered'} {$values[1]} {$filter.unit}
 									</li>
 								{/foreach}
 								<li style="display: none;">
-									<input class="layered_{$filter.type}_range" id="layered_{$filter.type}_range_min" type="hidden" value="{$filter.values[0]}" style="width:30px;"/>
-									<input class="layered_{$filter.type}_range" id="layered_{$filter.type}_range_max" type="hidden" value="{$filter.values[1]}" style="width:40px;"/>
+									<input class="layered_{$filter.type}_range" id="layered_{$filter.type}_range_min" type="hidden" value="{$filter.values[0]}"/>
+									<input class="layered_{$filter.type}_range" id="layered_{$filter.type}_range_max" type="hidden" value="{$filter.values[1]}"/>
 								</li>
 							{/if}
-								<script type="text/javascript">
-								{literal}
-									$(document).ready(function()
-									{
-										$('.layered_{/literal}{$filter.type}{literal}').show();
-									});
-								{/literal}
-								</script>
 						{/if}
-						</ul>
 						{if count($filter.values) > $filter.filter_show_limit && $filter.filter_show_limit > 0 && $filter.filter_type != 2}
 							<span class="hide-action more">{l s='Show more' mod='blocklayered'}</span>
 							<span class="hide-action less">{l s='Show less' mod='blocklayered'}</span>
 						{/if}
+						</ul>
 					</div>
+					<script type="text/javascript">
+					{literal}
+						$('.layered_{/literal}{$filter.type}{literal}').show();
+					{/literal}
+					</script>
 					{/if}
 				{/foreach}
 			</div>
@@ -213,7 +211,7 @@ param_product_url = '';
 		</form>
 	</div>
 	<div id="layered_ajax_loader" style="display: none;">
-		<p style="margin: 20px 0; text-align: center;"><img src="{$img_ps_dir}loader.gif" alt="" /><br />{l s='Loading...' mod='blocklayered'}</p>
+		<p><img src="{$img_ps_dir}loader.gif" alt="" /><br />{l s='Loading...' mod='blocklayered'}</p>
 	</div>
 </div>
 {else}
@@ -223,9 +221,9 @@ param_product_url = '';
 			<input type="hidden" name="id_category_layered" value="{$id_category_layered}" />
 		</form>
 	</div>
-	<div id="layered_ajax_loader" style="display: none;">
-		<p style="margin: 20px 0; text-align: center;"><img src="{$img_ps_dir}loader.gif" alt="" /><br />{l s='Loading...' mod='blocklayered'}</p>
+	<div style="display: none;">
+		<p style=""><img src="{$img_ps_dir}loader.gif" alt="" /><br />{l s='Loading...' mod='blocklayered'}</p>
 	</div>
 </div>
 {/if}
-<!-- /Block layered navigation module -->
\ No newline at end of file
+<!-- /Block layered navigation module -->
diff --git a/modules/blocklayered/delete.gif b/modules/blocklayered/delete.gif
new file mode 100644
index 0000000000000000000000000000000000000000..6d186d193983f580cabf7efec6597a6905675718
GIT binary patch
literal 213
zcmZ?wbhEHb<YC}pI3mmt5Eyj+($$Ago@;4odHeYK`T2*2g<rXTD>x+N^}A1V=PjHy
zXP&C6s;8%yo4fmu-~TUNxnX2vq@bYi|NnmmB7ovg7DfgJVFn$LT9BO#tU(V{wAc<y
zbZKz)KH1l+U=<|1Gw`)fSBT0450*(99wHo`Pd+p_$hAv1H71+o3kkpb$&tX$@bvP{
hy^LaZ3nq9>&`~py_FKMaZ;bWTl*9tXdrFE7)&RJ*L#hA(

literal 0
HcmV?d00001