This would be awesome if it worked and was included. Perhaps going with the window.postMessage and falling back to hash tag communication could be an improvement. Check out http://archive.plugins.jquery.com/project/postmessage - it purports support for "postmessage is tested on Safari 4, WebKit (Nightlies), Chrome 4, Firefox 3, IE8, IE7 and Opera 10.10."

It could solve your Chrome issues.

Hello, Owen!

Thank you for reply, but this jquery plugin for working requires Jquery both in the widget's iframe and on the client's site, and we can't guarantee this.

Anyway, webkit issue not with postMessage or location hash polling - as i see, this code can't correctly calculate iframe's height.

I have some ideas how to fix it, i will try it today in my free time.

Sorry for my bad english

I fixed webkit issue (new JS files attached) and now it work correctly if FF, IE 9 and Chrome. I not tested it in ie <9 and other browsers.

Very cool. I hope this can be included in piwik as the iframe widget embedding at the moment with the variable row count feature requires either a very tall iframe or risk truncation.

We can consider include it in Piwik. How exactly should it be used? can you please post a screenshot of a tall iframe example?

Also is the code under GPL license? please confirm. Thanks!

Hi, matt!

In my project i am using piwik to automatically provide detailed statistics for my users.

I wrote article about it:
http://translate.google.com/translate?sl=ru&tl=en&js=n&prev=_t&hl=ru&ie=UTF-8&layout=2&eotf=1&u=http%3A%2F%2Fhabrahabr.ru%2Fpost%2F111999%2F&act=url (google translate from russian)

In user's presonal page i want to show widgets, but i need to add a few widgets in a column.

By default, on the piwik widget's page it create html code with iframe's height 350px:
http://demo.piwik.org/index.php?module=Widgetize&action=index&idSite=7&period=day&date=yesterday

But it's too little, and many widget's can't show all content in this little place.

Now we can do 3 things: add additional height to iframes (for example, setup height to 600 px - but if user will choose 500 rows to show - it will be too little height anyway, and if i will place widgets in column it will be too big white place between widgets)

Next way is change scrolling="no" to scrolling="yes" - user will can to see all the widget's content, but with scrolling

And the last way is the adding iframe auto height feature. I created the demo-page with all three ways:
[http://ultra-stat.ru/test.html]

You can see, that the problem with default height, how it works with scrolling and with auto-height.

About the GPL - i have answer from author of this code (i little modified it, so now code have two authors - me and Kazi Manzur Rashid, http://kazimanzurrashid.com)

He said:

It is a bit old code and I am  not sure how to release it under gpl, you can do whatever you like to do with i gave no issue with that.

So i think you can release it under GPL license with no problems.

Thank you for the details! this looks cool and I didn't know it was possible to do this.

I found this blog post about it: http://css-tricks.com/cross-domain-iframe-resizing/

the big problem with this solution is that it breaks the hash tag functionnality on the host website. This is not so good. There are other solutions pointed out in the comments, maybe these would be better?

Regarding the integration I see it done this way:

• Below each widget in "Widgets" screen, add a checkbox "Resize the iframe automatically". When checked, the Embed iframe code would be updated to contain the .js include.

Let me know if you can test the other solutions to do iframe resizing without breaking the back button. Thanks!

Hi, Matt!

I will try postMessage solution today in my free time
http://postmessage.freebaseapps.com/

If could be good solution in modern browsers, and it will break hash tag only in old browsers (i.e. IE7)

About your way of the integration - it will be great.
May be, near this checkbox we can add warning about hash tag trouble in old browsers.

Attachment: new files
js.rar

I modified my code using postmessage, and now it works better in modern browsers. I can't test it in ie7 and other old browsers cos i don't have it. May be somebody can test it, i am very grateful for it.

May be, you can improve my JS code, it may be not optimal cos i'm not JS coder, but it works.

New Frame.js, FrameManager.js, postmessage.js and iframe.tpl included.

You need modify widget's code: now it need FrameManager.js and postmessage.js to working, and you need add

onload="FrameManager.registerFrame(this)"
``` and some equals id and name attributes to each iframe.

You can see how it works on my test page ([http://ultra-stat.ru/test.html])

Attachment: js files and iframe.tpl
js.2.rar

I improved my js code - now it's more clean and better.

See js.2.rar and demo page: http://ultra-stat.ru/test.html

Thanks it looks really good!!

Code review:

• did you test on all browsers?
• could you put the 2 files into 1 to minimize http requests?
• is there any other problem that you can think of with this solution?
  • for example, did you test it does not break the back button on a page that has hash tags #test in the URL used for navigation?
• since you seem keen to get it in trunk, it would really help if you could submit the patch for the UI modification of Piwik widgetize.
  • Proposal: a new checkbox that would modify the iframe embed.
  • The checkbox would read "Automatically resize Iframe to the ideal height."
  • related code is in: https://github.com/piwik/piwik/blob/master/plugins/Widgetize/templates/widgetize.js and https://github.com/piwik/piwik/blob/master/plugins/Widgetize/templates/index.tpl

@iskander thanks for the last patch - any update on the possible changes to make it into core? it would be great to have it for the next release planned in 1 week ! cheers

No reply yet from Iskander, but we are still interested to commit this change to SVN :)

see #10460