Need Locate button in embedded self-hosted Shortlist

438
4
Jump to solution
07-20-2017 12:20 PM
TobiasFimpel
Occasional Contributor

I am required to embedd a storymap that has a locate button. By default storymaps do not show the locate button when embedded in another page (via an <iframe> element).

I am working with the Shortlist template . I am self-hosting the code. Where in the code could I change the logic so that it allows me to add the locate button when it is embedded in another page?

In a previous version of this template I could change the js code (viewer-min.js) where it checks for the condition window.top !== window.self  but in the latest version (2.3.2) this same change does not lead to the location button being displayed in an <iframe> element any longer. I am not sure why.

I'd appreciate your help. Thanks.

0 Kudos
1 Solution

Accepted Solutions
MarkCooney
Occasional Contributor III

Hi Tobias,

It looks like you have both the source code and the production minified code in your hosted app, so the original code that blocks the locate button from showing in embedded is still being loaded from the source code.  If you remove the source code files, and only retain the production minified code with your alterations, the locate button should appear.

Mark

View solution in original post

0 Kudos
4 Replies
OwenGeo
Esri Frequent Contributor

Hi Tobias -- Per the notes on that feature's checkbox, the Locate button will only work if the story is being accessed over https (in your case both your customized story and the parent page must be https). This is a web security policy enforced by browsers (see here for more info). Is that the issue?

Owen Evans
Lead Product Engineer | StoryMaps
0 Kudos
TobiasFimpel
Occasional Contributor

Thank you for your reply Owen. I double-checked and everything is https, both in my storymap as well as in the webpage I am embedding it in.

How can I modify the template code so it disregards the second requirement ("...the story is not embedded.")?

0 Kudos
MarkCooney
Occasional Contributor III

Hi Tobias,

It looks like you have both the source code and the production minified code in your hosted app, so the original code that blocks the locate button from showing in embedded is still being loaded from the source code.  If you remove the source code files, and only retain the production minified code with your alterations, the locate button should appear.

Mark

View solution in original post

0 Kudos
TobiasFimpel
Occasional Contributor

Hi  Mark,

the odd thing is that when I only retain the production minified code with my alterations the app breaks because it then (as soon as I make my alterations) makes calls for the source code files...which of course aren't there unless I put them there. I'm not sure why that is.

But your suggestion led me to look in the right place and make my alterations in the source code files. My immediate problem is solved, thank you so much!!

0 Kudos