Skip to content

Instantly share code, notes, and snippets.

@csavoronin
Created September 22, 2022 10:47
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save csavoronin/38e49097b4ef6c036ea4a12bcd5c4b22 to your computer and use it in GitHub Desktop.
Save csavoronin/38e49097b4ef6c036ea4a12bcd5c4b22 to your computer and use it in GitHub Desktop.
[!] UI/UX: Product filters: Collapsed filters were expanded after page reload. Fixed.
diff --git a/design/themes/responsive/templates/blocks/product_filters/original.tpl b/design/themes/responsive/templates/blocks/product_filters/original.tpl
index a58cb7c5dbb..06544e0523c 100644
--- a/design/themes/responsive/templates/blocks/product_filters/original.tpl
+++ b/design/themes/responsive/templates/blocks/product_filters/original.tpl
@@ -33,15 +33,9 @@
{if $filter.display == "N"}
{* default behaviour of cm-combination *}
{assign var="collapse" value=true}
- {if $smarty.cookies.$cookie_name_show_filter}
- {assign var="collapse" value=false}
- {/if}
{else}
{* reverse behaviour of cm-combination *}
{assign var="collapse" value=false}
- {if $smarty.cookies.$cookie_name_show_filter}
- {assign var="collapse" value=true}
- {/if}
{/if}
{$reset_url = ""}
diff --git a/js/tygh/product_filters.js b/js/tygh/product_filters.js
index 83f905c553e..4a28ad8ae43 100644
--- a/js/tygh/product_filters.js
+++ b/js/tygh/product_filters.js
@@ -142,6 +142,26 @@
});
}
+ function restoreVariantsState($productFilters) {
+ $('.cm-save-state', $productFilters).each(function () {
+ var $elem = $(this);
+ var id = $elem.attr('id');
+ var prefix = 'sw_';
+
+ if (!id.startsWith(prefix)) {
+ return;
+ }
+
+ var combination_id = id.substr(prefix.length);
+
+ if (!$.cookie.get(combination_id) || $elem.hasClass('cm-ss-reverse') && !$elem.hasClass('open')) {
+ return;
+ }
+
+ $.toggleCombination($elem);
+ });
+ }
+
function saveFilteredTablesState($container) {
filtered_tables_state = {};
@@ -384,6 +404,10 @@
$.ceEvent('on', 'ce.commoninit', function (context) {
var $productFilters = $('.cm-product-filters', context);
+ if (context.is('.cm-product-filters')) {
+ $productFilters = $productFilters.add(context);
+ }
+
initSlider(context);
if (context && (context.is(document) || context.hasClass('cm-product-filters'))) {
@@ -413,6 +437,7 @@
restoreDropdownsState(context);
restoreFilteredTablesState(context);
restoreCursorState();
+ restoreVariantsState($productFilters);
var $color_filter_selectors = context.find('[data-cm-product-color-filter="true"]:has(.cm-product-filters-checkbox:enabled)');
if ($color_filter_selectors.length) {
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment