Introducing the Swiz [URLMapping] Metadata Processor
Swiz 1.0 has introduced the ability to create your own custom metadata processors. Although the 1.0 release is fairly new, many custom processors have already been developed by members of the Flex community. I thought I'd take a stab at creating a metadata processor that simplifies adding deep linking support to your application.
The metadata processor I've created is called URLMapping which allows you to easily map URLs to methods. Here's a simple example:
[URLMapping( url="/helloWorld" )]
public function sayHelloWorld():void
{
model.msg = "Hello world!";
}
The URL Mapping processor will automatically start listening for URL changes. For the above example, any time the URL changes to flexapp.html#/helloWorld the sayHelloWorld() method will automatically get called. Also, since url is the default metadata argument, the following example works exactly the same:
[URLMapping( "/helloWorld" )]
public function sayHelloWorld():void
{
model.msg = "Hello world!";
}
You can also use parts of the URL as parameters:
[URLMapping( "/hello/{0}" )]
public function sayHello( name:String ):void
{
model.msg = "Hello " + name + "!";
}
And optionally change the browser window title when the URL changes:
[URLMapping( url="/hello/{0}", title="Hello {0}!" )]
public function sayHello( name:String ):void
{
model.msg = "Hello " + name + "!";
}
Lastly, [URLMapping] also works in reverse with the help of the Swiz [Mediate] metadata. In this example the URL will change to /hello/Ryan and the browser window title to "Hello Ryan!" when the HelloEvent.HELLO event is dispatched:
[URLMapping( url="/hello/{0}", title="Hello {0}!" )]
[Mediate( event="HelloEvent.HELLO", properties="name" )]
public function sayHello( name:String ):void
{
model.msg = "Hello " + name + "!";
}
And then dispatch the event:
<s:TextInput id="nameInput" text="Ryan" />
<s:Button label="Say Hello" click="dispatchEvent( new HelloEvent( HelloEvent.HELLO, nameInput.text ) )" />
[URLMapping] Getting Started Resources
I've created a simple Customer App example, with view source enabled, to show how you could use [URLMapping] in a full application.
Recent Posts
- Introducing the Swiz [URLMapping] Metadata Processor
- Skinning MinimalComps with Degrafa
- Using MXML without Flex (Example and Source)
- Here’s 5 3D Layouts for Flex 4
- OpenFlux Independant From Flex
Categories
- 360Flex
- Anywhere.FM
- Club Penguin
- DataGrid
- Degrafa
- Disney
- Flex
- FluxCharts
- Google AdSense
- MinimalComps
- MXML
- MySQL
- OpenFlux
- PayPal
- PlexiGlass
- SEO
- Uncategorized
March 26th, 2010 - 11:31
Looks sweet dude! Great work.
March 26th, 2010 - 12:50
That’s a great one. I don’t want to start the ‘which framework is the right one’-discussion here, but I’m still thinking about which one fits my needs best: swiz or robotlegs. The ‘processor thing’ is a point for swiz.
March 26th, 2010 - 20:11
Fan-tas-tic!!!
VELO
March 27th, 2010 - 07:52
AWESOME!!! Can’t wait to use this!
March 29th, 2010 - 02:23
Ryan, what do you think about Swiz in general ? Is this a good platform for building a large-scale Flex applications ? Or it is suitable for small to medium sized better? Currently, I’m using PureMVC and it works well for large apps.
March 29th, 2010 - 05:54
Mico: Yeah, I’ve been using Swiz on all my projects lately. It’s a great framework that is definitely suitable for large-scale Flex applications.
March 29th, 2010 - 11:56
Nice work Ryan, I have used Swiz for some projects (pre version 1) but have been using Robotlegs lately. With metadata tags like [urlmapping] added to the mix Swiz is certainly on my radar for upcoming projects.
May 14th, 2010 - 11:46
After manually dealing with DeepLinks on several projects, this is really excellent. What a useful processor!
Thank you,
THomasB
February 18th, 2011 - 04:24
Ryan,
URLMapping is excellent, and simplifies most of the use cases.
There is one use case where using the URLMapping tag can be a bit tricky.
Imagine you have a business method that you are sure that is only called internally by your application if a certain condition is applied (example: the user is logged in).
You want that the call to that method (via [EventHandler]) changes the URL, but you don’t want the reverse: if the user fills up the url, you want the method to be only called if a condition applies (i.e. The user is Logged In).
For solving this case, I would recommend adding a new argument to URLMapping: “direction = [fromBrowser; toBrowser; both]“. It would indicate if that tag 1- Listens ONLY to URL changes calling the method; 2- Updates ONLY the URL 3- Does both things. This way, the following would be possible:
[EventHandler("BusinessEvent.DO_OPERATION")]
[URLMapping(“/myOperation”, direction=”toBrowser”)
public function doBusinessOperation():void { }
[URLMapping(“/myOperation”, direction=”fromBrowser”)
public function tryToDoBusinessOperation():void
{
if (condition) dispatchEvent(new BusinessEvent(BusinessEvent.DO_OPERATION))
}
Want we could use URLMapping like before, by using the direction=”both”, which would be default argument.
What do you think?