[1.7] Run Javascript on Facet filter update?

[fortuner]

Hello!

I'm trying to make the countdown for special price on PS1.7.2 in Classic theme.

Everything works fine except Facet filter pages (which is expected ).

Before facet filter use

The countdown works in every page except you use Facet filter.

 

After facet filter use

I didn't find anything related to facet filter update or page reload in javascript.

So how do I run my countdown after facet filter reloads page?

Thanks!!!

[Scully]

We haven't an idea how exactely to have implemented your countdown. And it's difficult to debug your screenshots. From a guess I would say your javascript isn't loaded or not fired anymore after faceted filter has been used.

[fortuner]

We haven't an idea how exactely to have implemented your countdown. And it's difficult to debug your screenshots. From a guess I would say your javascript isn't loaded or not fired anymore after faceted filter has been used.

Well, it's obvious

I've found the workaround, but it seems to me a bit lame.

In /classic/_dev/js/listing.js 

add the code, which fires countdown after facets filter used (and of course compile it with Webpack afterwards):

function updateProductListDOM (data) {
  $('#search_filters').replaceWith(data.rendered_facets);
  $('#js-active-search-filters').replaceWith(data.rendered_active_filters);
  $('#js-product-list-top').replaceWith(data.rendered_products_top);
  $('#js-product-list').replaceWith(data.rendered_products);
  $('#js-product-list-bottom').replaceWith(data.rendered_products_bottom);

  let productMinitature = new ProductMinitature();
  productMinitature.init();
  
// The code below fires the countdown
    $('[data-countdown]').each(function() {
      var $this = $(this), finalDate = $(this).data('countdown');
      $this.countdown(finalDate, function(event) {
        $(this).find(".days").html(event.strftime('%D'));
        $(this).find(".hours").html(event.strftime('%H'));
        $(this).find(".mins").html(event.strftime('%M'));
        $(this).find(".secs").html(event.strftime('%S'));
      });
    });

}

I'd like to make more elegant solution. For example save this function to object and call it with one string, or something better, but my JS skills are as lame as the code I've posted above

So, If you know how to solve this, please help