cshold · August 20, 2021 06:47 · NickSal24 · Feb 12, 2018
diff --git a/supply-collection-sidebar b/supply-collection-sidebar
 {% comment %}

  A customized sidebar for this theme. If advanced tagging is enabled in
  theme settings, prepend your tags with "group" names (E.g. BRAND_) and your
  collection page will create groups of tags to sort by.

  Expansion of https://gist.github.com/darryn/8047749

 {% endcomment %}

 {% comment %}
  The code below relies on the advanced-tag-loop snippet.
  The snippet is already included in snippets/breadrumbs.liquid
  because it is needed there too, but if you remove
  breadcrumbs you need to include this:

  {% include 'advanced-tag-loop' %}
 {% endcomment %}

 {% if settings.advanced_tags %}
  {% if collection.all_tags.size > 0 %}

    <div class="grid-uniform">
      {% comment %}
        Loop through tag categories
      {% endcomment %}
      {% for cat_item in cat_array %}
        {% comment %}
          Ignore if tag category is empty
        {% endcomment %}
        {% unless cat_item == '' %}
        <div class="grid-item small--one-half medium--one-third">
          <h3>{{ cat_item }}</h3>
          <ul class="collection-filters">
            {% comment %}
              Loop through collection tags
            {% endcomment %}
            {% for custom_tag in collection.all_tags %}
              {% if custom_tag contains cat_item %}
                {% comment %}
                  Strip out tag category prefix and add/remove link for tag filtering
                {% endcomment %}
                {% if current_tags contains custom_tag %}
                  <li class="advanced-filter active-filter" data-group="{{ cat_item }}" data-handle="{{ custom_tag | handleize }}">{{ custom_tag | remove: cat_item | remove: '_' | link_to_remove_tag: custom_tag }}</li>
                {% else %}
                  <li class="advanced-filter" data-group="{{ cat_item }}">{{ custom_tag | remove: cat_item | remove: '_' | link_to_add_tag: custom_tag }}</li>
                {% endif %}
              {% endif %}
            {% endfor %}
          </ul>
        </div>
        {% endunless %}
      {% endfor %}
    </div>

    <script>
    $(function() {
      var currentTags = '{{current_tags}}',
          filters = $('.advanced-filter'),
          activeTag,
          activeHandle;

      filters.each(function() {
        var el = $(this),
            group = el.data('group'),
            isActive = el.hasClass('active-filter');
      });

      filters.on('click', function(e) {
        var el = $(this),
            group = el.data('group'),
            url = el.find('a').attr('href');

        // Continue as normal if we're clicking on the active link
        if ( el.hasClass('active-filter') ) {
          return;
        }

        // Get active group link (unidentified if there isn't one)
        activeTag = $('.active-filter[data-group="'+ group +'"]');

        // If a tag from this group is already selected, remove it from the new tag's URL and continue
        if ( activeTag && activeTag.data('group') === group ) {
          e.preventDefault();
          activeHandle = activeTag.data('handle') + '+';

          // Create new URL without the currently active handle
          url = url.replace(activeHandle, '');

          window.location = url;
        }
      });
    });
    </script>

  {% endif %}
 {% else %}
  <h3>Tags</h3>
  {% if template contains 'collection' and collection.all_tags.size > 0 %}

    {% comment %}
      Provide a 'catch-all' link at the top of the list,
      we'd check against the collection.handle, product type, and vendor.
    {% endcomment %}
    <ul>
      <li{% unless current_tags %} class="active-filter"{% endunless %}>

        {% comment %}
          Good for /collections/all collection and regular collections
        {% endcomment %}
        {% if collection.handle %}
          <a href="/collections/{{ collection.handle }}">Everything in {{ collection.title }}</a>

        {% comment %}
          Good for automatic type collections
        {% endcomment %}
        {% elsif collection.current_type %}
          <a href="{{ collection.current_type | url_for_type }}">Everything in {{ collection.title }}</a>

        {% comment %}
          Good for automatic vendor collections
        {% endcomment %}
        {% elsif collection.current_vendor %}
          <a href="{{ collection.current_vendor | url_for_vendor }}">Everything in {{ collection.title }}</a>

        {% endif %}
      </li>

      {% comment %}
        And for the good stuff, loop through the tags themselves.
        Strip the prepended categories if they happen to exist.
      {% endcomment %}
      {% for tag in collection.all_tags %}
        {% assign is_advanced_tag = false %}
        {% for cat_item in cat_array %}
          {% unless cat_item == '' %}
            {% if tag contains cat_item %}
              {% assign is_advanced_tag = true %}
              {% if current_tags contains tag %}
                <li class="active-filter">{{ tag | remove: cat_item | remove: '_' }}</li>
              {% else %}
                <li>{{ tag | remove: cat_item | remove: '_' | link_to_tag: tag }}</li>
              {% endif %}
            {% endif %}

          {% endunless %}
        {% endfor %}

        {% if is_advanced_tag == false %}
          {% if current_tags contains tag %}
            <li class="active-filter">{{ tag }}</li>
          {% else %}
            <li>{{ tag | link_to_tag: tag }}</li>
          {% endif %}
        {% endif %}
      {% endfor %}

    </ul>

  {% else %}
    <p>Add tags to your products for this list to build itself.</p>
  {% endif %}
 {% endif %}