stoimen.com/blog

web developing

Archive for October, 2009

object and embed tag position in IE

What is OK?

If you’ve written at least once the OBJECT and EMBED tags, without copy/paste you may have been noticed that the place of the EMBED tag is a bit strange. Actually after the OBJECT tag, comes the PARAM sequence, that simply defines different parameters for the flash movie.

And what looks strange?

The strange thing in all this is that the EMBED tag, which in fact is only one, instead of the case with all the parameters of the OBJECT, is displayed just before the closing of the OJBECT tag.

Experimenting …

What if the embed tag is outside of the OBJECT opening and closing tags. Actually only IE understands this as a problem. Than it displays the move twice!

That’s why the place of the EMBED is just before closing the OBJECT tag. In that case MSIE doesn’t “see” the EMBED and displays everything correctly!

What if you’d like to pass an object to Flex

To continue the topic of my previous post I’m just going to add that there’s a native way to pass objects from JavaScript to Flex’s actionscript.

I’m not going to describe how to structure a object in JavaScript and/or Flex. Let’s go directly to the example.

The function in .js file should return something that is object in JavaScript:

.js file

function getObject() {
    return { foo : 'bar', zoo : 'tar' };
}

(more…)

ActionScript and the rest of the world

In the past, when ActionScript v2 was widely used, the most common way to interact with the other parts of the web application, whether a page refresh, redirect or JavaScript method call was the as2 method getURL. With the simple getURL(‘javascript:someJSMethod…’) the flash movie called the JS function and everything was OK.

Now in ActionScript v3 where everything looks and it is different, everything about communication between JS and Flash/Flex is done by ExternalInterface. The communication can be done in both directions. From JS to Flash and vice versa.

The ExternalInterface.call

There are two simple methods implemented by ExternalInteface. The first one is addCallback and the second one is call. Here I’m going to write a little more about the second one.

The most common usage is:

ExternalInterface.call('jsMethod');

where jsMethod is, as you can guess, a JavaScript method. Something like:

test.js

function jsMethod() { alert('test') };

A bit different, but yet again simple, is the call to a js function with parameters:

ExternalInterface.call('jsMethod', param1, param2);

where the javascript function can be:

function jsMethod(param1, param2) { alert(param1) };

But what I was writing about is really tricky. What if the jsMethod returns a value? Than in the .js file you’ve the following method:

function jsMethod() { return 'foo bar' };

and when you try this:

var str:String = ExternalInterface.call('jsMethod');
Alert.show(str);

you get the alert box with the string ‘foo bar’.

Where to use it?

Well this is really useful, because you get the response within the call method, only with the .call instead with .call and than .addCallback. The problem of course appears when you try to use it with AJAX call. Than even if the function returns in the success method of the AJAX call the flash doesn’t get the response.

Than you simply implement the communication with both .call and .addCallback!

Zend Framework custom URLs

URL organization in Zend Framework

As you may know in ZF the urls are strictly organized. First you’ve the module, if you use modules. If there is only one module, and it is normally the default one, you omit the module name from the url. Than comes the controller name, the action name in that particular controller and than separate by / the url continues with key value pairs of the get parameters.

Of course to make this all work, you’d need to setup a simple .htaccess file just to rewrite all this to the index.php file which than parses the $_SERVER['REQUEST_URI'] to collect all the data he need about which controller, which action and what parameters to call.

That’s pretty simple. If you’ve the following URL /user/profile/name/john.smith you may suppose that Zend Framework calls the “user” controller, “profile” action with get parameter “name” which equals to “john.smith”. In a traditional PHP style old school URL this can look like this:

?controller=user&action=profile&name=john.smith

Why I need such long URL?

The problem is that Zend reads all this, parses it and than returns the correct output. But however not always this is what we want, right? I’d like to have custom url for the profile page. Why should I need both profile and name in my URL, I’d prefer a URL like this: /user/john.smith. (more…)

The sample app

In my last post from the event driven programming with jQuery series, I simply will post a sample application. In my previous post I showed up the use case for a tab panel, which can be done typically with no custom events, and almost every developer would do it that way, but however just for the purpose of this series I’ll separate the logic into two modules. One for the tabs and one for the content. Thus you can separate the application into two simple apps into two different pages, and they will continue to work correctly.

In fact most of the large JavaScript applications use that technique and I was inspired to write these posts from one talk of Nicholas Zakas, a Yahoo! front end developer, where he uses YUI, of course. But anyway this technique can be done with everyone of the major JS libraries like jQuery.

You can see the demo and the source here.

If there are any questions about it, don’t hesitate to post your questions and I’ll be glad to help.