FXWidget part 2

Published Monday, August 20, 2007 at 12:05 PM .
This morning I put together a new build of FXWidget. This build leverages an inner IFRAME to preload the SWF file before Flash Player detection and writing the OBJECT/EMBED tags. Again the goal of FXWidget is to keep everything self contained and reduce adding an element of Flex on any webpage by adding a simple DIV.

Here are the FXWidget and the new Flex HTML Template for review:

DOWNLOAD FXWidget Flex Builder Project

SAMPLES (VIEW HTML SOURCE):
Full Banner
Half Banner
Rectangle
Vertical Rectangle
Large Rectangle
Medium Rectange
Skyscraper

Ideally I would like to get FXWidget working like so:

<script src="FXWidget.js"/>
<div id="Rectangle_div">
   <script>
      new FXWidget({
         swf:"Rectangle.swf",
         name:"Rectangle",
         width:180,
         height:90,
         background:#ffffff,
         major:9,
         preload:true
      });
   </script>
</div>


Also this morning Beau Scott posted his version of FXWidget that uses the AJAX Prototype framework and an AJAX call to cache the SWF file.

More to come!

Ted :)

10 Responses to “ FXWidget part 2 ”

# Blogger Beau Scott

(sorry for the delete, I didn't finish my comment)

Wouldn't there be two instances of the same SWF running if you're using an iframe and embedding it into your app?

However, your vision of where to take the could would be a very elegant approach.

Good stuff, Tim!

Beau  

# Blogger Ted Patrick

The IFRAME and all inner DIV contents are overwritten when the IFRAME contents load via onload. I like your use of AJAX for caching the SWF given the cached elements are never in the browser DOM just in memory js. I wanted to stay neutral on AJAX frameworks in this intial stage but I am a fan of both Prototype and JQuery.

I want to iterate in plain view here and be open about how this should work. Ideally we will come to an agreed direction and really solve the problem well.

Cheers,

Ted :)  

# Blogger Beau Scott

Wow, how many mistakes can one make in a sing reply? That "could" should be "code", and Tim should be Ted... so sorry. This is what happens when you blog with distractions -- should be illegal.

Anyway, would you want to keep the SWFObject code (maybe just extend it) or would you want to mimic the same behavior in a standalone. My preference would be to just include it, but then you're building more dependencies (like using Prototype).

Beau  

# Anonymous Scott

Nice work Ted. One problem, none of the examples work in Safari.  

# Anonymous Mozilla By

Hi Ted! Nice work.
Maybe does it make sense to reserve some space for a banner? Something like:
div id="${application}_div" style="width:${width};height:${height}"
Thanks,
— MB  

# Blogger Ted Patrick

Scott,

Can you post your specific browser version number and OS version. Earlier versions of safari are problematic.

It works great on safari for me.

Ted  

# Anonymous Scott

Safari Version 2.0.4 (419.3)

OSX 10.4.10  

# Blogger Tony

Just a note: I have a html page with an embedded flex widget. The widget gets some context from the page to run correctly, so I need to debug in the page context too. I basically look for the debug query string and put out the debug version of the swf instead of the regular.

I found that when I ran a version with the debug swf referenced in the iframe and the refresh function, the iframe debug swf connected to the debugger and was then overwritten, which disconnected from the debugger. Took me a while to figure out why that was happening.

If you have a set up similar to this, put the regular swf in the iframe and the debug version in the refresh function.

Good stuff, Ted.... thanks!  

# Anonymous Andres Santos

Hi Ted... i was wondering if there is a way to retrieve the list children because i get stuck with the numChildren, for example if a component is a Container and it has other components inside it becomes kinda difficul to navigate untill the list of numChildren finishes.... well thanx for your great blog :-D  

# Anonymous Anonymous

Ted:

I added a simple p tag with some text after the ending div tag in the index html template. The text doesn't appear. I cannot get anything to appear after the closing div tag. When I view source on the html the p tag is there with its text. This happens in both IE 6 and FireFox 2.

Bruce Phillips  

Post a Comment

[image]


Jobs


Flex Jobs
city, state, zip


© 2008 Ted On Flash


You are viewing a mobilized version of this site...
View original page here

Mobilized by Mowser Mowser