topic Re: Any plans to make Single app responsive? in Integration, Extension & APIs

Any plans to make Single app responsive?

Thu, 23 Mar 2017 07:43:51 GMT

Hi all,

I'm integrating my dashboard sheet using single app and iframe.

However that's not even nearly as good in responsive rendering as if I use full app in iframe.

- On one hand I have single app which problem is lack of responsive rendering,

- On the other hand I can use full app which is really responsive, but has navigation bar which allows user to browse hub, go to another sheet, etc. And this is a huge problem as I would like the user to see only one sheet in readonly mode.

Is there any way to make single app responsive?

Any way to hide top bar when using it in iframe?

Re: Any plans to make Single app responsive?

Alexander_Thor — Thu, 23 Mar 2017 23:34:18 GMT

Sadly that is the nature of iframes, so our objects will scale to the available size when the page was first rendered.
There are workarounds, we make use of pym.js (Pym.js: Embed iframes responsively) from NPR heavily for our deployments. So the parent page will notify the iframe when it's height and width has changed and then our resize handlers should fire accordingly.

Re: Any plans to make Single app responsive?

Fri, 24 Mar 2017 18:58:27 GMT

Hi Alexander.

Is the problem really has anything to do with iframe? Could you explain a bit please? I'm not sure I understand unfortunately. If I host the regular app (not single) in the same iframe, everything renders responsively.

So, when I resize iframe, its content layout is changed correctly which is not the case for single app.

http://localhost:4848/single/?appid=<myappid>&sheet=Yqwnms&opt=nointeraction&select=clearall- renders incorrectly with iframe resize. Content visualizations are scaled and layout stays the same

http://localhost:4848/sense/app/<myappid>/sheet/Yqwnms/state/analysis - renders correctly with iframe resize and layout is updated fine but contains toolbar allowing user to explore hub or edit sheets.

Re: Any plans to make Single app responsive?

rbartley — Tue, 28 May 2019 09:42:14 GMT

Hi Alexander,

On the Pym.js page it refers to adding code to the child page. since we are using the single API, we have no control over the content of the iframe. Could you please provide a stripped down example of using Pym.js in this context?

Regards,

Richard

Re: Any plans to make Single app responsive?

newuser — Fri, 22 Apr 2022 17:48:12 GMT

@Alexander_Thor , do you have a full example of using Pym.js when using iFrame in a SharePoint web part?