Loading ...
Sorry, an error occurred while loading the content.

39290Re: Problem with flex (.swf) inside a panel in Firefox

Expand Messages
  • aniad
    Oct 14, 2008
      Hi,

      The .swf is a fairly complicated widget and splitting it is not a
      simple, or perhaps even viable solution for us.

      I also tried the shim idea over the iframe with the same bad results.
      I also tried setting up the panel with an iframe. So the panel has a
      div, which has an iframe. The iframe references an html which in turn
      loads the .swf. This resulted in even more bizarre behavior, where
      dragging the panel over the iframe or any other part of the layout
      would "wipe out" the display of the .swf, meaning the .swf's parts
      over those areas would cease to render all together.

      Of course the issue at heart is that not only does the .swf reload
      after the `overflow' style of the panel's div is changed, but if the
      .swf subsequently creates new controls (buttons, pulldowns, etc) these
      will not work again, thus rendering the "overflow fix" somewhat mute
      as subsequently setting the panel's `overflow' style again is a NOP,
      and even if it weren't it would cause a reload again.

      I understand you are busy, but I will TREMENDOUSLY appreciate if you
      keep looking into this as we would REALLY like to find a solution
      which would allow us to use panels with flex over iframes.

      Thank you, and with your permission I might `poke' you again next week…
      Ania.

      --- In ydn-javascript@yahoogroups.com, "Satyen Desai" <sdesai@...> wrote:
      >
      > Hi,
      >
      > I did take another look at it and attempted a DIV shim based
      solution to cover the iframe, as an alternate approach, but that did
      not help.
      >
      > On the swf side of things, I was wondering if you might want to
      evaluate a solution which split the state from the UI, so you can
      store the state in another swf (which has no UI and doesn't need to be
      reloaded), or in JS.
      >
      > That would free you up to reload the swf which renders the UI,
      whenever you need to work around the FF/iframe overlap issue and
      restore it's state from JS/the other swf. NOTE: My swf knowledge is
      fairly limited, so not sure how big/small a task this is. I believe
      this is something we do for the Charts component to resolve the reload
      issue.
      >
      > Will continue to dig, but am a little short on time this week.
      >
      > - Satyen
      > ________________________________________
      > From: ydn-javascript@yahoogroups.com
      [mailto:ydn-javascript@yahoogroups.com] On Behalf Of aniad
      > Sent: Monday, October 13, 2008 10:12 AM
      > To: ydn-javascript@yahoogroups.com
      > Subject: [ydn-javascript] Re: Problem with flex (.swf) inside a
      panel in Firefox
      >
      > Hi,
      >
      > I don't mean to push on this, but I'm kind of stuck on this... Did you
      > have a chance to look at this?
      >
      > Thank you,
      > Ania.
      >
      > --- In ydn-javascript@yahoogroups.com, "Satyen Desai" <sdesai@> wrote:
      > >
      > > Hi,
      > >
      > > Been away from a computer for a few days. Will follow up on this
      > > thread once I've had a chance to replicate your test.
      > >
      > > Regards,
      > > Satyen
      > >
      > > --- In ydn-javascript@yahoogroups.com, "aniad" <aniad@> wrote:
      > > >
      > > > Satyen,
      > > >
      > > > Here are some additional observations: when I bring up the panel
      > > > w/.swf, change the div's style which will cause the .swf to
      reload so
      > > > in my test case I reinitialize the flex again, at the end of all
      that
      > > > I get a working dialog/panel with swf. Then I close the panel
      (ie put
      > > > if off screen). Some subsequent user interaction changes the
      state of
      > > > things and the panel is made visible again, but because the state of
      > > > things has changed the .swf will display a different version of
      > > > buttons and controls. Unfortunately, those new buttons/controls are
      > > > again unresponsive. Setting div's style again acts like a nop at
      this
      > > > point because the style has already been set, I suppose.
      > > >
      > > > ANY help/ideas to accomplish being able to put swf in a panel,
      keep it
      > > > active by hiding it off screen and have responsive buttons/controls
      > > > over an iframe will be extremely appreciated.
      > > >
      > > > Ania.
      > > >
      > > > --- In ydn-javascript@yahoogroups.com, "aniad" <aniad@> wrote:
      > > > >
      > > > > Yes, this is in your modified file. So, if you seperate the
      > showing of
      > > > > the panel from setting the overflow attrib of the panel into 2
      > > > > functions like this:
      > > > >
      > > > > function showPanel()
      > > > > {
      > > > > gToolPanel.cfg.setProperty ("fixedcenter", true );
      > > > > gToolPanel.center();
      > > > > }
      > > > >
      > > > > function fixOverflow()
      > > > > {
      > > > > if (YAHOO.env.ua.gecko &&
      > > > > navigator.userAgent.toLowerCase().indexOf("macintosh") == -1)
      > > > > {
      > > > > // On the mac, Panel already applies it's own set of
      > > > > overflow management to Panel,
      > > > > // to prevent scrollbar bleedthrough.
      > > > > YAHOO.util.Dom.setStyle("flexWrapperDiv", "overflow",
      > > > "auto");
      > > > > }
      > > > > }
      > > > >
      > > > > And then add a 5th button:
      > > > > <button onclick="fixOverflow();">5): click to fix
      > > > > overflow, see flex repaint</button>
      > > > >
      > > > > and then do button 1, button 2, button 3 and finally button 5,
      > you'll
      > > > > see the flex totally repaint/reload.
      > > > >
      > > > > The reload messes us up, as the first, originally instantiated
      > version
      > > > > of flex has a state already set. Basically the .swf in panel
      > talks to
      > > > > other parts of the UI, which depend on that .swf but in turn the
      > .swf
      > > > > gets a 'state' from those other parts. So, when it reloads all is
      > > > lost...
      > > > >
      > > > > Thank you again for looking into this. I've been working on this
      > > > > problem for quite a while now and truly appreciate your help!
      > > > >
      > > > > Ania.
      > > > >
      > > > >
      > > > >
      > > > > --- In ydn-javascript@yahoogroups.com, "Satyen Desai" <sdesai@>
      > wrote:
      > > > > >
      > > > > > >> first .setStyle does it. Can you think of any other work
      around
      > > > which
      > > > > > would not involve a reload of the flex?
      > > > > >
      > > > > > Is this with the updated file I provided below or with your
      > original
      > > > > zip? Also any specific version of FF/OS?
      > > > > >
      > > > > > >> p.s. What I also noted, is that when the panel is hidden
      and I
      > > > bring
      > > > > > up Firebug (f12) the panel "spontaneously" becomes visible...
      > > any idea
      > > > > > about that?
      > > > > >
      > > > > > I believe this may be because in your original code you had
      > > > > "fixedcenter" set to true, which will attempt to center the Panel
      > > > > whenever the window is resized. In my modified version, I just
      > changed
      > > > > this to invoke panel.center() when it's shown.
      > > > > >
      > > > > > Regards,
      > > > > > Satyen
      > > > > > ________________________________________
      > > > > > From: ydn-javascript@yahoogroups.com
      > > > > [mailto:ydn-javascript@yahoogroups.com] On Behalf Of aniad
      > > > > > Sent: Thursday, October 02, 2008 3:58 PM
      > > > > > To: ydn-javascript@yahoogroups.com
      > > > > > Subject: [ydn-javascript] Re: Problem with flex (.swf) inside a
      > > > > panel in Firefox
      > > > > >
      > > > > > Hi Satyen,
      > > > > >
      > > > > > Thank you so much for your reply.
      > > > > >
      > > > > > I'm still working on this... turns out that setting the style
      > on the
      > > > > > div causes a RELOAD of the flex widget, which is something we
      > > are very
      > > > > > much trying to avoid. In addition, after it reloads the flex's
      > > > > > external interfaces seem unresponsive... You can see that reload
      > > when
      > > > > > you create the panel, then the layout (which hides the
      panel) then
      > > > > > show the panel which will come back blank then paints the
      > .swf. What
      > > > > > I don't quite understand is that from there on it seems fine.
      > > Meaning
      > > > > > that subsequent hide/show don't cause the reload, it is as if
      > > only the
      > > > > > first .setStyle does it. Can you think of any other work around
      > > which
      > > > > > would not involve a reload of the flex?
      > > > > >
      > > > > > Ania.
      > > > > >
      > > > > > p.s. What I also noted, is that when the panel is hidden and I
      > bring
      > > > > > up Firebug (f12) the panel "spontaneously" becomes visible...
      > > any idea
      > > > > > about that?
      > > > > >
      > > > > > a.
      > > > > >
      > > > > > --- In ydn-javascript@yahoogroups.com, "Satyen Desai" <sdesai@>
      > > wrote:
      > > > > > >
      > > > > > > Hi,
      > > > > > > Thanks for the detailed example page.
      > > > > > >
      > > > > > > Try using the following version of your page:
      > > > > > >
      > > > > > >
      > > > > >
      > > > >
      > > >
      > >
      >
      http://yuiblog.com/sandbox/yui/v250/examples/container/panelOverIframe.html
      > > > > > >
      > > > > > > (Your swf isn't hosted at the above location, so you'll
      need to
      > > > > > download it and try it out locally)
      > > > > > >
      > > > > > > The main change is to applying overflow:auto to the
      > > flashWrapperDiv.
      > > > > > >
      > > > > > > Some notes:
      > > > > > >
      > > > > > > * I found that I had to apply overflow:auto dynamically
      through
      > > > > > > script as opposed to using static CSS - probably a "redraw"
      > issue.
      > > > > > >
      > > > > > > * We apply overflow:auto to the Panel shadow, for FF/Mac
      > > already to
      > > > > > > deal with scrollbar bleed through issues, so the fix was only
      > > > > > > required for FF/Win.
      > > > > > >
      > > > > > > The other minor changes are just to get the height set
      > correctly.
      > > > > > >
      > > > > > > Tried it across FF2, FF3 on WinXP/MacOS and seems to work
      fine,
      > > > > > aside from the fact that the swf is not re-drawn when
      dragging in
      > > > > > FF2/MacOS for step 1 of your repro example (which can
      probably be
      > > > > > resolved also, if it's a real part of your application)
      > > > > > >
      > > > > > > Let me know how it goes.
      > > > > > >
      > > > > > > Regards,
      > > > > > > Satyen
      > > > > > >
      > > > > > > ________________________________________
      > > > > > > From: ydn-javascript@yahoogroups.com
      > > > > > [mailto:ydn-javascript@yahoogroups.com] On Behalf Of aniad
      > > > > > > Sent: Thursday, October 02, 2008 9:45 AM
      > > > > > > To: ydn-javascript@yahoogroups.com
      > > > > > > Subject: [ydn-javascript] Re: Problem with flex (.swf)
      inside a
      > > > > > panel in Firefox
      > > > > > >
      > > > > > > Here is a link to a zip file which has a simple .html and a
      > simple
      > > > > > > .swf file which demonstrate the problem (I have also included
      > > > the code
      > > > > > > for the .swf file in case you need it).
      > > > > > >
      > > > > > >
      > https://download.amberpoint.com/forYahoo/SwfOverIframe_Problem.zip
      > > > > > > Username: Yahoo
      > > > > > > Password: bug4yahoo
      > > > > > >
      > > > > > > As you will see in the text in the .html, the problem is
      > very much
      > > > > > > linked to the order in which items are created. However,
      we have
      > > > > > > certain dependencies between the .swf and other items on the
      > page
      > > > > > > therefore need to create the panel w/.swf first.
      > > > > > >
      > > > > > > Ania.
      > > > > > >
      > > > > > > --- In ydn-javascript@yahoogroups.com, "aniad" <aniad@> wrote:
      > > > > > > >
      > > > > > > > Eric,
      > > > > > > >
      > > > > > > > Changing the wmode helped a little. The mouse tracks
      correctly
      > > > when
      > > > > > > > the panel is dragged around over most of the screen areas,
      > > > > however it
      > > > > > > > still is unresponsive when the panel is over an iframe.
      > I'll put
      > > > > > > > together simple example of this problem.
      > > > > > > > Ania.
      > > > > > > >
      > > > > > > > btw, did you have a chance to look at
      > > > > > > >
      > > http://tech.groups.yahoo.com/group/ydn-javascript/message/38440? I
      > > > > > > > posted simple nested layout code which demonstrates the
      > 'invalid
      > > > > > > > argument' error.
      > > > > > > > a.
      > > > > > > >
      > > > > > > > --- In ydn-javascript@yahoogroups.com, Eric Miraglia
      > <miraglia@>
      > > > > > wrote:
      > > > > > > > >
      > > > > > > > > Ania,
      > > > > > > > >
      > > > > > > > > Here's what our Flash experts say:
      > > > > > > > >
      > > > > > > > > My suggestion would be to check the wmode of their SWF
      > embed.
      > > > > This
      > > > > > > > > sounds like a longstanding issue with the plugin version
      > > of the
      > > > > > > player
      > > > > > > > > when the wmode is set to transparent or opaque.
      Changing the
      > > > wmode
      > > > > > > to
      > > > > > > > > window should fix it. If that is not the case, they'll
      > need to
      > > > > > > send a
      > > > > > > > > link or their code and I can take a look.
      > > > > > > > >
      > > > > > > > > See if wmode solves your problem; if not, please send
      a link
      > > > > to the
      > > > > > > > > page where you're having the problem.
      > > > > > > > >
      > > > > > > > > Regards,
      > > > > > > > > Eric
      > > > > > > > >
      > > > > > > > >
      > > > > > > > > On Sep 30, 2008, at 3:45 PM, aniad wrote:
      > > > > > > > >
      > > > > > > > > > We have a nested full screen layout. In the `bottom'
      part
      > > > of the
      > > > > > > > > > inner layout (which is in the `center' of the outer
      > > layout) we
      > > > > > > have a
      > > > > > > > > > tabs control. Each tab creates an iframe into which a
      > > page is
      > > > > > > > > > displayed, depending on what is selected elsewhere in
      > > the UI.
      > > > > > > > > >
      > > > > > > > > > When the user clicks a button a panel is made visible
      > which
      > > > > has a
      > > > > > > > > > <div> inside which a .swf file is rendered. The swf
      has a
      > > > > > number of
      > > > > > > > > > controls, buttons and drop boxes with which the user
      > > > interacts.
      > > > > > > > > >
      > > > > > > > > > The problem (FF only, works correctly in IE):
      > > > > > > > > > When the panel with .swf is visible the mouse is not
      > tracked
      > > > > > > properly
      > > > > > > > > > within the swf. The portions of the panel/swf that
      > > overlay the
      > > > > > > iframe
      > > > > > > > > > displayed in the bottom/tabs portion do not track the
      > mouse
      > > > > > > properly,
      > > > > > > > > > thus appearing unresponsive. Right clicking in the .swf
      > > > > shows the
      > > > > > > > > > standard flex context menu way off from where the
      > mouse was
      > > > > > clicked.
      > > > > > > > > > Dragging the panel around the screen exaggerates the
      > > > problem of
      > > > > > > > > > tracking the mouse, even allowing the flex context
      menu to
      > > > > appear
      > > > > > > > > > entirely outside of the panel/swf area. The problem
      > does not
      > > > > > seem to
      > > > > > > > > > be contained to the panel being over an iframe.
      > Dragging the
      > > > > > > panel so
      > > > > > > > > > that it sits on top of other parts of the layout (with
      > > simple
      > > > > > html)
      > > > > > > > > > also has issues. There is another flex control always
      > > > > displayed in
      > > > > > > > > > one of the parts of the layout. Dragging the panel
      to that
      > > > > part of
      > > > > > > > > > the screen always tracks the mouse correctly within the
      > > > > panel that
      > > > > > > > > > sits directly on top of that other flex widget.
      > > > > > > > > >
      > > > > > > > > > Are there any known problems of hosting a .swf inside a
      > > panel
      > > > > > in FF?
      > > > > > > > > > As mentioned before, this does not happen in IE.
      > > > > > > > > >
      > > > > > > > > > Ania.
      > > > > > > > > >
      > > > > > > > > >
      > > > > > > > > >
      > > > > > > > >
      > > > > > > >
      > > > > > >
      > > > > >
      > > > >
      > > >
      > >
      >
    • Show all 17 messages in this topic