Targeting an Iframe

[crisward]

My toolbar is in the main document, and I wish to edit a div inside an iframe.

Passing the element into the constructor seems to work and content editable is applied. However invokeElement doesn't seem to apply the style.

Do I need to pass the iframes window or document to medium. If so, how?

Many thanks, nice api btw..

[robertleeplummerjr]

Can you put up a gist to reproduce?

On Thu, Feb 12, 2015 at 8:02 AM, Cris Ward notifications@github.com wrote:

My toolbar is in the main document, and I wish to edit a div inside an iframe.

Passing the element into the constructor seems to work and content editable is applied. However invokeElement doesn't seem to apply the style.

Do I need to pass the iframes window or document to medium. If so, how?

Many thanks, nice api btw..

— Reply to this email directly or view it on GitHub https://github.com/jakiestfu/Medium.js/issues/137.

Robert Plummer

[crisward]

You should be able to edit here http://codepen.io/crisward/pen/yyvBmL?editors=101

Thanks in advance for your help with this.

[robertleeplummerjr]

working: https://gist.github.com/robertleeplummerjr/b2570d1e97871bf66595 Just drop it into the root of Medium.js to play with.

On Thu, Feb 12, 2015 at 11:19 AM, Cris Ward notifications@github.com wrote:

You should be able to edit here http://codepen.io/crisward/pen/yyvBmL?editors=101

Thanks in advance for your help with this.

— Reply to this email directly or view it on GitHub https://github.com/jakiestfu/Medium.js/issues/137#issuecomment-74099930.

Robert Plummer

[crisward]

Thanks for your very promt help with this. I downloaded and tried the code you supplied and it works in firefox 39 on mac, but not in safari or chrome within the iframe. It changes the whole text not just the seleted portion, but I'm guessing that's .select() call on the edit area.

In chrome and safari, div works as expect, iframe, nothing, also no console errors.

[boomyjee]

medium.js is written so it uses global window object through the code. It should use this.element's window instead in most cases. so, you have 3 options: 1) monkey patch invoke like this: Medium.Element.prototype.invoke = function () { ... } using element's window instead of global w var doc = this.element.ownerDocument; var w = doc.parentWindow || doc.defaultView;

2) rewrite whole medium using the above and make a pull request here 3) wait until Robert will do it by himself

[crisward]

Thanks.

[nrkn]

Hi - I am using Medium to do the same thing as you (toolbar on host page calling invoke on content in iframe) and it is working fine here in both Firefox and Chrome - so it is possible - unfortunately I'm super busy with deadline so I can't look at what we're doing differently to each other, but please know that it can be done - gut feeling without looking at code is that I'm initialising medium in the iframe and passing that medium reference back to the host

[nrkn]

I took a minute to look into it, this works in Firefox and Chrome:

https://gist.github.com/nrkn/00491cdb982072fb9193