I am trying to do expand and collapse event with slow effect. But I didn't get any solution?

See:

Is there a way to implement the safeFrame to be responsive? if so, can you provide an example on how I can achieve this? Right now, all the content just gets hidden, if I resize the browser.

I've written my safeFrame tag to render in a .html page when called from the browser. This is working fine, however when I am trying to convert the .html file into .js file I am also convering the content of the .html file i.e. my safeFrame tag in javaScript language too.

However the challenge I am facing is that when I am converting the safeFrame tag into a .js file and trying to render it through

I am watching an error. I know a safeFrame can't be loaded inside another safeFrame, however in this case trying to load the safeFrame through a .js file doesn't mean its creating a frame.

Can anyone help me here?

I get the above error as it expects data to be a string but in my case is coming in as an object from the PostMessage. And running .indexOf on a non-string throws an error.
Is there any way to counter this?
potentially, data could be stringified so its certain to be a string? or typeof data could be ascertained prior to make sure it is a string before running the indexOf method..

https://github.com/InteractiveAdvertisingBureau/safeframe/blob/master/src/js/ext/ext.js line 492 in _handle_msg() in the SafeFrames implementation currently cancels the postMessage event, always, as per this comment above _handle_msg():

    /**
     * Handle onmessage HTML5 x-domain events. We always cancel the event
     * never allowing it to go to other listeners besides our own, as we don't allow HTML5 messaging
     * beyond us and the publisher / host.
     * [...]
    */

This has the side effect of preventing any ad server's third-party script loaded into the safe-framed hosted environment (e.g., into http://sourceforge.net/p/safeframes/wiki/Home/) from installing its own IFRAME and postMessage-based protocol to shield code developed by a third-party developer from the parent page environment it is loaded into (irrespective of whether it is a safeFrame or non-safeFrame environment).

Is there any reason this is being prevented by cancelling the postMessage event? Would it be acceptable to move the dom.evtCncl() into the innermost "if" block, thereby only cancelling the bubbling up if the event is one generated by our own parent and matching our own "guid", and let other users of postMessage continue to work?

reported by:
Stephen Liu [email protected]

Basically, IE 11 sometimes hasn't init'ed fully when SafeFrames are constructed and has some flag values incorrect. Full thread below.

Sean Snider
Nov 13 (3 days ago)

to Stephen, me
That flag is basically checking for postMessage support.
We do a check up front at the start, looking for the postMessage function,
and also sending a message through it once at start (to ensure it really works).

That extra step is done b/c some versions of IE 7 actually do have a postMessage
function but it's non-functional. . (or of course if some site is trying
to override it in some way). (Note IE8 is the minmum on the open-source
repro, there are solutions / we have them for IE7 and lower but that's
not open-sourced b/c it's kinda nasty).

But since the postMessage func is psuedo-async (depends on the browser),
we may not end up getting through our check before you have started the render.

When we start the render, there's a bunch of flags sent in to tell us about
the environment and what to do. . . and so since that flag is not there, it
doesn't assume that it can send messages back up to the host. . .and hence your issue.

However. . I believe that problem is already fixed in the latest SourceForge
builds. . .so you might check there. . .and also if it's still a problem
I can tell you how to change the code to either do a different kind of check
or just ignore it. . .

Sean

From: Stephen Liu [email protected]
To: [email protected]
Sent: Friday, November 13, 2015 12:50 AM
Subject: About safeframe on IE

Dear Sean,
I am using safeframe for a while, but I found out an issue. Everything is working but sometimes on IE, expand() in ext.js is not working.
This is due to the can_use_html5 under _send_msg() returning null. I further investigated, can_use_html5 comes from the safeframe's window.name. Sometimes it just missing but sometimes not.
I want to know more about the purpose of 'html5' key. And how to 100% set it to '1' when using IE (PS: personally I dont use IE, but some clients in my website still use it. Just want to take care of them. Thx)

Regards,
Wing Liu
Developer

Tag based ads correctly update the meta object to an internal PosMeta object. Scripted ads created with a javascript call to new $sf.host.PosConfig(id, adConfig, meta); are not fixed. They come to the ad as [object Object]

According to the 1.0.1 version of the spec, for $.sf.expand(),

Tweening or animation is not supported in the SafeFrame so any animation must be processed by the external party within the container and call this method whenever it needs to expand to its maximum size.

However, in the creative_test.html example page, there's a transition set in the styles:

#topAdWrapper div, #topAdWrapper div iframe {
    transition: width 0.4s ease-in-out, height 0.4s;
}

Coupled with the alignment changes made by ext.js, this causes a leftward expanding ad with its own animation to jump to the left while expanding, giving a false impression that there is a problem with the creative.

(Ed)
Hi all,

I hope everyone is doing well. We've gotten a little further with Safe Iframes and working with MOAT, our viewability vendor, to see if we can implement on Mobile Mail for viewability - and then move forward with expandables and more usage.

However, MOAT, is still finding a problem with the $sf.ext.geom().par variable not getting updated in IE 11 when scrolling.

I've updated my code to the latest version as you suggested and you can find this at:

http://browsertest.web.aol.com/ads/safe071415/safeTest110.html

This isn't a show-stopper as MOAT says they can work around this but wanted to raise this up as not sure what future problems this may cause.

(Sean)
Ah it's at the bottom and the doc height is coming in late, which is what I think
is happening on that test page, and perhaps why the standard impl is not always
getting updated right, I vaguely remember having some issue with that in the past.

In the docs (under the PosConfig section), one of the fields is css Style-sheet text or a URI to a CSS file that defines additional CSS to be used inside the SafeFrame iframe. Default value is "". How do I implement this for the host to pass down font styles and css so that the ext can use it? And how do I access this from $sf.ext if the host were able to pass down these files?

The "par" property of the geom object is broken.

Code is calling attr instead of _attr (alias to $sf.lib.dom.attr).

Missing from: http://www.iab.net/media/file/SafeFramesSpec.pdf

• $sf.ext.supports().bg
• $sf.ext.supports().pin
• $sf.ext.geom().par

Is this possible to set sandbox to the frame?

How do you feel about publishing this project on NPM? It be great for personal development when trying to install safeframe rather than having to download via Git / Tarballs etc.

Thanks

I've found the way to send messagefrom iframe to parent, through using $sf.ext.message and posMessageCallback, but I cannot find a way to send a message from parent window to iframe.

I find one method in host.js, as you can see the below.

	/**
	 * Send a message to a child iframe.
	 *
	 * @name $sf.lib.dom.msghost.send
	 * @public
	 * @static
	 * @function
	 * @param {string} tgtID The HTML id attribute of the iframe element for which to send a message
	 * @param {string} data The string of data to send to the given iframe
	 * @returns {boolean} Whether or not message was send succesfully (note that this does not mean message was handled / recevied, only that sending was ok).
	 *
	*/

	function send_msg_to_child_iframe(tgtID, data)

Also, method of use (that I'm gussing)

$sf.lib.dom.msghost.send("leftAdPlacement", "myMessageText");

It looks like what I intended, but I still don't know how iframe gets message from parent.
(I'm concerning the alternative way using #9 if there's no way.)

Any help will be great.
Thx.