iFrame-Resizer with Raphael.js

[SFPink]

Hello,

I've been using your resizing code for a while now which works fantastic on modern browsers. I have been using it along side Raphael.js again no problems on newer browsers.

However on older browsers such as IE 8 <, Opera 12

I'm getting an error which is essentially breaking the Raphael.js. I'm not sure if anything can be done but I'll post up what I can and maybe you can shed some light on this subject.

I'm not familiar with window.requestAnimationFrame but was wondering if a conflict could occur with these libraries.

This is the error (This may or may not help):

Uncaught exception: RangeError: Maximum recursion depth exceededError thrown at line 10, column 30558 in (a, b) in https://localhost:44300/Scripts/Circles/raphael.js:
return b = M.call(b), "finite" == b ? !Yz : "array" == b ? a instanceof Array : "" == b && null === a || b == typeof a && null !== a || "object" == b && a === Object(a) || "array" == b && Array.isArray && Array.isArray(a) || W.call(a).slice(8, -1).toLowerCase() == b
called from line 21, column 6147 in (b, d) in https://localhost:44300/Scripts/Circles/raphael.js:
if (null == d && c.is(b, "string"))
called from line 14, column 35059 in () in https://localhost:44300/Scripts/Circles/raphael.js:
n.attr(o), function (a, c, d) { setTimeout(function () { b("raphael.anim.frame." + a, c, d) }) }(n.id, n, e.anim)
called from line 56, column 4 in (callback) in https://localhost:44300/Scripts/src/iframeResizer.js:
callback();
called from line 14, column 35650 in () in https://localhost:44300/Scripts/Circles/raphael.js:
c.svg && n && n.paper && n.paper.safari(), ic.length && jc(kc)
called from line 56, column 4 in (callback) in https://localhost:44300/Scripts/src/iframeResizer.js:
callback();
called from line 14, column 35650 in () in https://localhost:44300/Scripts/Circles/raphael.js:
c.svg && n && n.paper && n.paper.safari(), ic.length && jc(kc)
called from line 56, column 4 in (callback) in https://localhost:44300/Scripts/src/iframeResizer.js:
callback();
called from line 14, column 35650 in () in https://localhost:44300/Scripts/Circles/raphael.js:
c.svg && n && n.paper && n.paper.safari(), ic.length && jc(kc)
called from line 56, column 4 in (callback) in https://localhost:44300/Scripts/src/iframeResizer.js:
callback();

[davidjbradshaw]

What's the log output from iFrame-resizer look like?

[SFPink]

The error displayed above fires before the log shows anything, the log will display this in the console after.

[iFrameSizer][Host page] IFrame scrolling disabled for DashboardPanel
iframeResizer.js:63

[iFrameSizer][Host page][init] Sending init msg to iframe (DashboardPanel:8:false:true:32:true:true:0 0 150px:offset:null:null)
iframeResizer.js:63

[iFrameSizer][Host page] IFrame scrolling disabled for DashboardPanel
iframeResizer.js:63

[iFrameSizer][Host page][init] Sending init msg to iframe (DashboardPanel:8:false:true:32:true:true:0 0 150px:offset:null:null)

[davidjbradshaw]

Hmm, then I expect the issue is with the other lib I'm afraid.

[SFPink]

Okay, thanks for your input.

[davidjbradshaw]

On last point, I find it odd that the log message gets repeated like that, are you calling it twice?

[SFPink]

There is a chance that it is initially called twice.

Reason being i'm using this in an ASP.net project. The Resize code stops working after an update panel does a postback therefore a Rebind function is fired on load of each postback. Therefore theres a chance that the Rebind function and initialise function are both firing.

EDIT: That was the case, it fired in both Initialise and Rebind. I've fixed this however the issue still persists.

[SFPink]

In Raphael.js we found this line of code:

jc = a.requestAnimationFrame || a.webkitRequestAnimationFrame || a.mozRequestAnimationFrame || a.oRequestAnimationFrame || a.msRequestAnimationFrame || function (a) { setTimeout(a, 16) }

when we chop it down to this: jc = function (a) { setTimeout(a, 16) } it seems to fix it

[davidjbradshaw]

Oh I understand the issue now. I think if you load Raphael.js first it might fix this, as you don't really want to make that change if you don't have to.

I'll make my code play nicer when I get some time next week.

[davidjbradshaw]

PS this might be of interest to you.

https://developer.mozilla.org/en/docs/Web/API/window.requestAnimationFrame

[SFPink]

I give this a try and let you know the result.

[davidjbradshaw]

Should be fixed now, try v2.4.7 and let me know if it works.

[SFPink]

I've just updated however on IE 9 the iFrame seems to continually resize.

[davidjbradshaw]

Can you send me a link I can look at please.