{{#results}}
<div class="result">
    {{#addToPlannerWithHeartDesign}}
    <span class="add-to-planner-heart {{#isAddedToPlanner}}added{{/isAddedToPlanner}}" data-page-id="{{id}}" aria-hidden="true">
        <span class="circle">
            <span class="selected-background"></span>
            <span class="fas fa-heart"></span>
        </span>
    </span>
    {{/addToPlannerWithHeartDesign}}
    {{#hasExternalLink}}
    <a class="target-link" href="{{externalLink}}" style="cursor:pointer" onclick="javascript:targetLinkFunction(this, event, '{{externalLink}}', '{{externalLinkTarget}}')">
        <div class="product-background-image">
            <div class="featured {{promoTextClass}}">{{promoText}}</div>
            <img class="product-image {{imageCropFocus}}" src="{{imageUrl}}" alt="{{imageAlt}}" loading="lazy" />
        </div>
        <div class="image-overlay"></div>
        {{#showChiclets}}
        <ul class="image-overlay-chiclets">
            {{#showChicletsFor}}
            {{#class}}
            <li class="chiclet" data-name="{{name}}">
                <span class="icon {{class}}" aria-label="{{name}}" {{#imageUrl}}style="{{{imageUrl}}}"{{/imageUrl}}></span>
            </li>
            {{/class}}
            {{/showChicletsFor}}
        </ul>
        {{/showChiclets}}
        <span class="target-link-copy">
            <div class="target-link-title-wrapper">
                <span id="{{id}}-link-title" class="target-link-title">{{name}}</span>
            </div>
            <p class="target-link-text">{{subtitle}}</p>
        </span>
        {{#hasButtonCtaText}}
        <div class="target-link-button-cta-wrapper">
            <span aria-labelledby="{{id}}-link-title" class="target-link-button-cta linkbtnlight" onclick="javascript:targetLinkFunction(this, event, '{{externalLink}}', '{{externalLinkTarget}}')">{{buttonCtaText}}</span>
        </div>
        {{/hasButtonCtaText}}
    </a>
    {{/hasExternalLink}}
    {{^hasExternalLink}}
    <a class="target-link" href="{{targetUrl}}" style="cursor:pointer" onclick="javascript:targetLinkFunction(this, event , '{{targetUrl}}', '{{externalLinkTarget}}')">
        <div class="product-background-image">
            <div class="featured {{promoTextClass}}">{{promoText}}</div>
            <img class="product-image {{imageCropFocus}}" src="{{imageUrl}}" alt="{{imageAlt}}" loading="lazy" />
        </div>
        <div class="image-overlay"></div>
        {{#showChiclets}}
        <ul class="image-overlay-chiclets">
            {{#showChicletsFor}}
            {{#class}}
            <li class="chiclet" data-name="{{name}}">
                <span class="icon {{class}}" aria-label="{{name}}" {{#imageUrl}}style="{{{imageUrl}}}"{{/imageUrl}}></span>
            </li>
            {{/class}}
            {{/showChicletsFor}}
        </ul>
        {{/showChiclets}}
        <div class="result-bottom">
            <span class="target-link-copy {{#addToPlannerWithClipboardDesign}}{{#id}}with-planner{{/id}}{{/addToPlannerWithClipboardDesign}}">
                <div class="target-link-title-wrapper">
                    <span id="{{id}}-link-title" class="target-link-title">{{name}}</span>
                </div>
                <p class="target-link-text">{{subtitle}}</p>
            </span>
            {{#id}}
            {{#hasButtonCtaText}}
            <span aria-labelledby="{{id}}-link-title" class="target-link-button-cta linkbtnlight" onclick="javascript:targetLinkFunction(this, event, '{{targetUrl}}', '{{externalLinkTarget}}')">{{buttonCtaText}}</span>
            {{/hasButtonCtaText}}
            {{#addToPlannerWithClipboardDesign}}
            <span class="add-to-planner {{#isAddedToPlanner}}added{{/isAddedToPlanner}}" data-page-id="{{id}}" aria-hidden="true">
                <div class="side-planner">
                    <div class="side-planner-icon">
                        <span class="side-icon icon {{#isAddedToPlanner}}ico-circle_check{{/isAddedToPlanner}}{{^isAddedToPlanner}}ico-planner{{/isAddedToPlanner}}"></span>
                    </div>
                    <div class="side-planner-text">
                        {{^isAddedToPlanner}}{{buttonAdd}}{{/isAddedToPlanner}}
                        {{#isAddedToPlanner}}{{buttonAdded}}{{/isAddedToPlanner}}
                    </div>
                </div>
                {{#isAddedToPlanner}}
                <span class="text icon ico-circle_check">{{buttonAdded}}</span>
                {{/isAddedToPlanner}}
                {{^isAddedToPlanner}}
                <span class="text icon ico-planner">{{buttonAdd}}</span>
                {{/isAddedToPlanner}}
            </span>
            {{/addToPlannerWithClipboardDesign}}
            {{/id}}
        </div>
    </a>
    {{/hasExternalLink}}
</div>
{{/results}}
{{^results}}
<h3 class="no-results">{{noresults}}</h3>
{{/results}}

<script type="text/javascript">

    function targetLinkFunction(el, event, targetUrl, target) {
        event.preventDefault();
        var addToPlanner = el.getElementsByClassName('add-to-planner');

        for (var i = 0; i < addToPlanner.length; i++) {
            if (addToPlanner[i].contains(event.target)) {
                return;
            }
        }

        var cssClass = event.target.class || event.target.className || '';
        if (cssClass !== "text-wrap" && cssClass.indexOf("add-to-planner") === -1) {
            var openTarget = target || '_self';
            if (event.metaKey || event.ctrlKey) {
                openTarget = '_blank';
            }
            window.open(targetUrl, openTarget);
        }
    }

    //# sourceURL=activityresults.results.html.js
</script>