Safari can't find templates?

[murtaugh]

I'm not sure when, but my store locator has started throwing the "Could not load plugin templates." error in Safari. Everything still works as expected in Chrome/FF/Mobile Safari.

Any idea what might be causing this?

[bjorn2404]

Hello,

Does it happen consistently? I've had a couple of people mention this but it seemed to be intermittent for them. I haven't been able to replicate it so I'm not sure if it's a certain version, some kind of server loading issue (templates are loaded with AJAX) or potentially a bug with the browser. For an easy workaround you could try using inline Handlebar templates with the listTemplateID and infowindowTemplateID plugin settings. The second example on the Handlebars website is how you would do the inline templates (copy from the template files in dist/assets/js/plugins/storeLocator/templates and set the ID). For example:

<script id="listTemplate" type="text/x-handlebars-template">
{{#location}}
<li data-markerid="{{markerid}}">
    <div class="list-label">{{marker}}</div>
    <div class="list-details">
        <div class="list-content">
            <div class="loc-name">{{name}}</div>
            <div class="loc-addr">{{address}}</div> 
            <div class="loc-addr2">{{address2}}</div> 
            <div class="loc-addr3">{{city}}{{#if city}},{{/if}} {{state}} {{postal}}</div>
            <div class="loc-phone">{{phone}}</div>
            <div class="loc-web"><a href="{{web}}" target="_blank">{{niceURL web}}</a></div>
            {{#if distance}}<div class="loc-dist">{{distance}} {{length}}</div>
            <div class="loc-directions"><a href="https://maps.google.com/maps?saddr={{origin}}&amp;daddr={{address}} {{address2}} {{city}}, {{state}} {{postal}}" target="_blank">Directions</a></div>{{/if}}
        </div>
    </div>
</li>
{{/location}}
</script>

<script id="infoTemplate" type="text/x-handlebars-template">
{{#location}}
<div class="loc-name">{{name}}</div>
<div>{{address}}</div>
<div>{{address2}}</div>
<div>{{city}}{{#if city}},{{/if}} {{state}} {{postal}}</div>
<div>{{hours1}}</div>
<div>{{hours2}}</div>
<div>{{hours3}}</div>
<div>{{phone}}</div>
<div><a href="{{web}}" target="_blank">{{niceURL web}}</a></div>
{{/location}}
</script>

[murtaugh]

It does happen consistently. My (uninformed) guess is that it started happening in Safari 9.

Thanks for the info, I'll try to inline the templates.

[murtaugh]

Here's a weird thing: the plugin can find the templates in Safari when it's loaded in Shopify's theme previewer (it's presented in an iframe).

[bjorn2404]

Interesting. Does the same thing happen for you with Safari on the demo files? http://bjornblog.com/storelocator/v2/ It seem to work fine with Safari 9 on my end. If you have an example link I could see that might be helpful.

[DavidKarasek]

I am also having this same error and it is also with a shopify site. It appears to be intermittent. I actually have not verified it myself, but I have seen screen shots of it verified on multiple different computers. Seems to be specific to Safari in my case.

http://www.northernemeralds.com/pages/locator

That is the page where the plugin is used.

[bjorn2404]

@DavidKarasek Any additional info by chance other than Safari? Like browser version, OS version etc?

[cosmomathieu]

I also ran into this issue. I was using a vhost of local.storelocator... When I changed the name of the vhost to storelocator.local (which loads as http://storelocator.local in a browser) and reloaded the script, the error went away.

Could this be the possible culprit? Handlebars.registerHelper('niceURL', function(url) { if(url){ return url.replace('https://', '').replace('http://', ''); } }); Line 168 of jquery.storelocator.js

My guess is that the iframe loaded the code from a base url of /sitename (http:/sitename) or something. I am now running into the following error after resolving this one: Error: Geocode was not successful for the following reason: REQUEST_DENIED I'll create a separate issue for that one.