Behold Model-Glue users! MG+AJAX Made easy
I just released a new improved version of ajaxCFC for the Model Glue framework. Now it's even easier to add Ajax to your robust ColdFusion MVC applications. I modified the Echo Example and added a Contact Manager Example to show how it works. All open source and included in the ajaxCFC download. The contact manager example is the same that comes with Model-Glue, using the same controller, models, and views ... slighly Ajaxified :)
[Updated] IMPORTANT NOTE: The XML Socket works on port 1225, so if you're behind some firewall preventing that traffic you will not see the refreshes. I am still working on some port 80 proxy, but for this experiment just open that port.
btw, I will be demonstrating all this at the upcoming Spring Conference, this week.
If that wasn't enough, included is also the next level of Web 2.0 applications; a mash-up of ColdFusion / Model Glue / ajaxCFC / XML Binary Sockets / CF Event Gateways... This combinations allows you to only for your presentation layer to interact with the server in the background, but also for the server to push data to the clients. No more Ajax pulls every 3 seconds interval, now the server can just broadcast the command to all clients. I shall call it Apocalypse. ;)
I modified the Contact Manager example that comes with model glue to use Ajax and Socket servers... now every time anyone adds/edits/deletes a contact all clients' views will get updates... just imagine the possibilities. Just try it yourself... open two browsers and see them interact.
I will try to briefly explain the framework the best I can.
First, you need the BER version of the model glue framework; Joe still hasn't officially released MG v1.1.
Now, the framework consists of a model: ajax.cfc, some JavaScripts included in the views/js folder, and a rendering view ajaxResponse.cfm. That's it...
How do it work...
The examples that come with Model-Glue use a private Layout hanlder, so I just added two more: AjaxLayout and SocketLayout... Now every time you need to respond an Ajax request you use the AjaxLayout, and if you want to broadcast something through the socket, you use the SocketLayout.
I modified the controllers init and OnRequestStart to parse the Ajax request... once it gets to your controllers handler all Ajax vars will be sent to you as regular event values, which you can get with getValue. There's not much more you need to know there...
Your controller will do its thing and set vars to be used in modelglue.xml ... now, here's the beauty ... when you use the AjaxResponse renderer your views will modify DIV Layers, or anything with the view's ID ... For example, if your body has a container calls contentForm, once you render a view with that name, all content will get placed inside that DIV...
If you need to run scripts you can use a reserved view name: 'script'. If you create a view with that name, all code inside that view will get evaluated in the client side. I modified the Echo Example to use this method so you can see what I mean.
The socket implementation is still in alpha mode... I just finished the prototype today... how does it work?!
I added a 1px Flash movie that weights only 1k that all it does is to open a socket connection to a ColdFusion Event Gateway. I rewrote the XML Binary sockets that comes with CFMX7 to better suite the Flash XML Socket protocol. I also added a few methods such as onConnect and onDisconnect. Anyways, when you need to talk to the server to do it through Ajax, but if the server needs to talk to you, it will do it through the XML Gateway. The beauty is that you do not need to modify anything or create any custom handler for it ... The flash movie uses FS Command to communicate with JavaScript and triggers the same calls the Ajax response would, so the same rendering in the server works for either method.
I included the org.gonda.socket.jar file, which would have to be registered as a custom event gateway to make the contact manager example to work. Just point your JVM class path where the file is, restart ColdFusion, and register a new gateway:
Name: FlashSocket
Class: org.gonda.socket.SocketGateway
Then create a new instance and call it 'flashSocket1'. I provided the cfg file in the example too.
In the main view, both IP and port are passed to the Flash file as FlashParams... will easily see how to modify it.
I know, you are thinking it's too much, but it's not THAT complicated ... and it's well worth it ...
Ok, so what is the catch? There are a couple of issue I still need to work on ... one) The socket binds itself to an IP and port, and I don't want to create a new socket for every application.. especially if I need to open a new IP on my firewall every time ... two) firewall... yes, I need to find a way to perform http tunneling, or to detect that it was blocked on run time to shift all socket calls to Ajax.
I know it's not crystal clear, but I wanted to get it out there and get people thinking ... I'll try to document it better this week before the conference.
[Updated] IMPORTANT NOTE: The XML Socket works on port 1225, so if you're behind some firewall preventing that traffic you will not see the refreshes. I am still working on some port 80 proxy, but for this experiment just open that port.
btw, I will be demonstrating all this at the upcoming Spring Conference, this week.
If that wasn't enough, included is also the next level of Web 2.0 applications; a mash-up of ColdFusion / Model Glue / ajaxCFC / XML Binary Sockets / CF Event Gateways... This combinations allows you to only for your presentation layer to interact with the server in the background, but also for the server to push data to the clients. No more Ajax pulls every 3 seconds interval, now the server can just broadcast the command to all clients. I shall call it Apocalypse. ;)
I modified the Contact Manager example that comes with model glue to use Ajax and Socket servers... now every time anyone adds/edits/deletes a contact all clients' views will get updates... just imagine the possibilities. Just try it yourself... open two browsers and see them interact.
I will try to briefly explain the framework the best I can.
First, you need the BER version of the model glue framework; Joe still hasn't officially released MG v1.1.
Now, the framework consists of a model: ajax.cfc, some JavaScripts included in the views/js folder, and a rendering view ajaxResponse.cfm. That's it...
How do it work...
The examples that come with Model-Glue use a private Layout hanlder, so I just added two more: AjaxLayout and SocketLayout... Now every time you need to respond an Ajax request you use the AjaxLayout, and if you want to broadcast something through the socket, you use the SocketLayout.
I modified the controllers init and OnRequestStart to parse the Ajax request... once it gets to your controllers handler all Ajax vars will be sent to you as regular event values, which you can get with getValue. There's not much more you need to know there...
Your controller will do its thing and set vars to be used in modelglue.xml ... now, here's the beauty ... when you use the AjaxResponse renderer your views will modify DIV Layers, or anything with the view's ID ... For example, if your body has a container calls contentForm, once you render a view with that name, all content will get placed inside that DIV...
If you need to run scripts you can use a reserved view name: 'script'. If you create a view with that name, all code inside that view will get evaluated in the client side. I modified the Echo Example to use this method so you can see what I mean.
The socket implementation is still in alpha mode... I just finished the prototype today... how does it work?!
I added a 1px Flash movie that weights only 1k that all it does is to open a socket connection to a ColdFusion Event Gateway. I rewrote the XML Binary sockets that comes with CFMX7 to better suite the Flash XML Socket protocol. I also added a few methods such as onConnect and onDisconnect. Anyways, when you need to talk to the server to do it through Ajax, but if the server needs to talk to you, it will do it through the XML Gateway. The beauty is that you do not need to modify anything or create any custom handler for it ... The flash movie uses FS Command to communicate with JavaScript and triggers the same calls the Ajax response would, so the same rendering in the server works for either method.
I included the org.gonda.socket.jar file, which would have to be registered as a custom event gateway to make the contact manager example to work. Just point your JVM class path where the file is, restart ColdFusion, and register a new gateway:
Name: FlashSocket
Class: org.gonda.socket.SocketGateway
Then create a new instance and call it 'flashSocket1'. I provided the cfg file in the example too.
In the main view, both IP and port are passed to the Flash file as FlashParams... will easily see how to modify it.
I know, you are thinking it's too much, but it's not THAT complicated ... and it's well worth it ...
Ok, so what is the catch? There are a couple of issue I still need to work on ... one) The socket binds itself to an IP and port, and I don't want to create a new socket for every application.. especially if I need to open a new IP on my firewall every time ... two) firewall... yes, I need to find a way to perform http tunneling, or to detect that it was blocked on run time to shift all socket calls to Ajax.
I know it's not crystal clear, but I wanted to get it out there and get people thinking ... I'll try to document it better this week before the conference.
TrackBacks
Rob Got It Working !!!
Rob Gonda has gotten an implementation of data push working with ColdFusion. It's pretty slick in the way that it talks to the XML Socket. Go over to his site and take a look at it....
Rob Gonda has gotten an implementation of data push working with ColdFusion. It's pretty slick in the way that it talks to the XML Socket. Go over to his site and take a look at it....
Tracked by Info Accelerator | Tracked on 3/20/06 3:15 PM
Rob Gonda's Ajax + Push in Model-Glue
Wow - this is pretty slick. By using his AjaxCFC, an event gateway, and a tiny Flash movie as a conduit, Rob Gonda has come up with a way to do *push* in Model-Glue via Ajax. That...is...pretty...slick!
Wow - this is pretty slick. By using his AjaxCFC, an event gateway, and a tiny Flash movie as a conduit, Rob Gonda has come up with a way to do *push* in Model-Glue via Ajax. That...is...pretty...slick!
Tracked by clearsoftware.net | Tracked on 3/21/06 9:17 AM
Rob Gonda - Hero of the day
Looking at the header over at Rob Gondas blog one must wonder if he think himself some kind of super hero. Well today he has proven his position as such - at least in my eyes. The MG+Ajax examples he has posted is truly cool stuff.
Looking at the header over at Rob Gondas blog one must wonder if he think himself some kind of super hero. Well today he has proven his position as such - at least in my eyes. The MG+Ajax examples he has posted is truly cool stuff.
Tracked by Waterswing Blog | Tracked on 3/21/06 9:48 AM
Trackback URL for this entry:
http://www.robgonda.com/blog/trackback.cfm?1617217E-3048-7431-E42B302C6D8C2B42
http://www.robgonda.com/blog/trackback.cfm?1617217E-3048-7431-E42B302C6D8C2B42









As a side note, I'll be intensively teaching this at the CFUnited Pre-conference classes... It's 8 hours of picking Rob's brain, heh ... see you guys there.
http://www.cfunited.com/classes06.cfm#CU214
Also I just signed up for your pre-CFUnited class last week. I am really looking forward to it.
~Dave
Just like for all of us, time is a scarce resource, and for that matter, I haven't playing much with Mach II. Actually, I don't use Model-Glue all that much either, but I like the way if flows... I just feel it :)
Whenever you feel you have time, just drop me an email and we'll chat about that. I have a feeling Sami may help too... he's being using MII for a long time now.
I've already asked my boss to attend your class. :D
I'll be contacting you soon!
Sami
BTW, DWR files are still "Version 1.76" in MG examples, but the core files were updated to 1.83 (as per engine.js in-line comment). Am I missed something?
svn://clearsoftware.net/clearsoftware.net
Few Questions (Requests?)
1. Any hope for persistent session variables on AJAX calls?
2. How about AJAX integration with FuseBox?
Thanks
Most of the links on this blog entry are bad.
Sami
Just been playing with you ajaxCFC and module glue code. Im having an issue trying to load external <InvalidTag> links on the fly ? is there a way to do this with AJAX / MG ?
I cann see that if i name my view 'script' then it will execute any inline script. and if i want to return HTML then it puts the content into the div.
but what if i want to do some lazy loading of External JS files ?
That's an excellent question. Thus far, I've used numerous lazy loading, but never with MG yet. The way I've been doing them is to actually open the js file with cffile and dump the content into a predefined name space. This technique works great if you OO all your js files using prototypes and objects, but it will not work for traditional js files. I have not tried loading them into the html head using dom because I've always assumed that it will only run on compile time, not run time.
I just saw your post in the MG list (thanks!), and I will try a few things in the next couple of days. If you have a good way to perform lazy loading without altering the JS files please share, and I'll find a good day to integrate it with the framework.
As a side note, even without ajax, loading js files using dom and attaching them in the html head does not work in every browser... you need to be careful with that.
Sorry for the delay.
As far as Fusebox (nothing personal Hal), I just hate it :) I heard Hal and Sean are doing a hell of a job with fusebox 6; they rewrote the entire engine and it's fully OOP now. I would be willing to give it a chance when it comes out. For the current fusebox, same answer as Mach II... I really dont have time for that, but I will be willing to provide 100% support for whoever brave enough to assume that job. I can setup test environments and provide access to my SVN. I will also advertise it in the ADJ and all conferences where I'm speaking. After it's done, it would be just awesome to release some benchmarks and examples running on all different frameworks ... that would be a great case study for CFU if we get it out on time.
So, who's willing to give it a try?!
Best,
~Rob
I saw there is some outside interest in a MACHII implementation. Sami and Dave mentioned they were interested. I'd like to see this happen and am volunteering.
Let me know what I can do to help.
DW
How is the MachII implementation coming?
I'd be glad to start on it
I exchanged a couple of emails with Sami a few weeks ago, but I haven't heard back. Drop me an email and I'll fw you what I sent him.
I've been heavily into Fusebox for close on 4 yrs now and started looking into Ajax last week. If you want, I'll put my hand up for the fuseboxifying an ajaxCFC implementation.
Just on the ajaxCFC zip. Unless I missed something in the installation notes, it needs a minor tweak to get working out of the box. It needs the references to 'blog/projects' removed from the modelgluesamples and of course the cfc mappings as well. Other than that it worked a treat :)
Also showing my in-experience with Javascript here but in your references to the form field (model-glue examples at least) you used a '$' sign. I googled and couldn't find an explanation of how this replaces a named reference to the field.
Cheers again for what you've done here mate, if I can help out let me know.
The modelglue examples are the only ones that need to modify paths... all the rest are relative. The MG framework requires you to use full mappings, for the xml and for the controllers ...
anyways, the $() function is nothing more than a glorified getElementById function ... it has improved functionality, and it's easier to write, heh ... not sure who came up with it, but it's being used in a number of different JS frameworks...
looking forward to work with all who volunteered.
Best,
~Rob
This is great stuff! I got it to work with the Modul Glue framework. I am trying to get it to work with the MachII version you posted in one of your latter postings with no luck. Would you happen to have a version of this already tested with SocketServer and Mach-II?
Would you happen to have the FLA of this Flash componenet?
Thanks In Advance,
Mike
http://www.robgonda.com/blog/files/robGonda/UserFi...
Enjoy