After Yahoo Maps collaboration, here is another example of enabling collaboration in a Flex application using the publish/subscribe messaging infrastructure of BlazeDS.
This example demonstrates “collaborative forms” (or “collaborative data entry”). Users in different locations can fill in forms “together” in a real-time and in-context collaboration session: changes made by one user are automatically reflected in the other users application.
Testing the hosted version
- Access http://coenraets.org/collabforms/collabforms.html on two different machines or in two browser windows on the same machine.
- Click “Create Session” (bottom left) in one browser: a collaboration session is created with a unique collaboration session id.
- Enter this collaboration session id in the other browser and click “Join Session”.
- Change the selected Accordion tab in one browser, and notice that the Accordion in the other browser is automatically synchronized.
- Enter data in one browser and notice that the information is automatically synchronized in the other browser.
- On the Employment History tab, add a few companies (including start date, end date, and salary) and notice that the employment history list is automatically synchronized in the other browser.
You can right-click the application and select View Source or click here to see the source code of the application.
Notes:
- The way a collaboration session is actually started may vary depending on the application. In this example, one user creates a collaboration session, and shares the collaboration session id (via email, IM, etc…) with people he/she wants to collaborate with. In other use cases, the collaboration session could start automatically. For example, in a call center scenario, a user might click a “Live Help” button which would result in the creation of a support ticket appearing in the Support Reps application. A support rep could then take ownership of the ticket and enter a collaboration session using, for example, the ticket id as the collaboration session id. I will post a call center version of this example in the coming days.
- In this example, the synchronization is performed using pub/sub messaging. You could also use the Data Management Service available with LiveCycle Data Services to automatically keep data in sync between multiple clients.
- The hosted version of the application first tries to connect to the server using RTMP (available only as part of LCDS), and falls back to “long AMF polling” or regular AMF polling if the RTMP connection fails.
Local installation instructions:
- Install BlazeDS. You can download the BlazeDS turnkey server (a version of Tomcat with BlazeDS preinstalled) here.
- If you don’t already have a channel called “my-longpolling-amf”, open {blazeds-install-dir}/tomcat/webapps/samples/WEB-INF/flex/services-config.xml and add an AMF long polling channel defined as follows:
<channel-definition id="my-longpolling-amf" class="mx.messaging.channels.AMFChannel"> <endpoint url="http://{server.name}:{server.port}/{context.root}/messagebroker/amflongpolling" class="flex.messaging.endpoints.AMFEndpoint"/> <properties> <polling-enabled>true</polling-enabled> <polling-interval-seconds>5</polling-interval-seconds> <wait-interval-millis>60000</wait-interval-millis> <client-wait-interval-millis>1</client-wait-interval-millis> <max-waiting-poll-requests>200</max-waiting-poll-requests> </properties> </channel-definition> - Open WEB-INF/messaging-config.xml and add the following destination:
<destination id="mortgage"> <channels> <channel ref="my-longpolling-amf"/> <channel ref="my-polling-amf"/> </channels> </destination>
- (Re)start the BlazeDS turnkey server.
- Download the source code of the Mortgage Application here.
- Create a Flex Builder project for the Flex application (collabforms). Make sure you configure your Flex Builder project to work with BlazeDS. To read instructions on how to set up a Flex Builder project that works with BlazeDS, make sure your BlazeDS turnkey server is started, and click here.
- Compile the application.
- Open the Flex application in two browser windows (to simulate two users in different locations) and test the application as described above (in “Testing the hosted version”).
Cool example !!!
Blaze DS + Flex SDK + J2EE = The best openSource solution
Just awesome! I love it.
Christophe, Is there a way around having to edit the messaging-config.xml file everytime someone adds a Flex application that uses messaging?
I can see where an admin will get real tired having to do this every day.
Gary, you can dynamically (with Java code instead of xml) create a messaging destination without having to modify messaging-config.xml. This can either be done via an AbstractBootstrapService (that gets called as the server starts up) or with a Java class that can be called via RemoteObject.
Is the BlazeDS subtopic filtering done on the client side or the server side? If its on the client side, wouldnt that expose serious security issues?
Vijay,
The filtering is done at the server-side.
Christophe
What should I do to get this example working in Granite DS?
Hi,
First of all, thank you for your blog, this is a mine of information.
However, I’ve got 2 questions :
- What’s the difference between polling and long-polling and pushing technologies ?
- How can I use pushing with AMF ?
Thanks for all in advance.
Mathieu,
Damon has a good blog post that answers your questions in detail:
http://www.dcooper.org/Blog/client/index.cfm?mode=entry&entry=8E1439AD-4E22-1671-58710DD528E9C2E7
I already read this artcile but I can’t understand some details (I’m not English). I come back to it and read it again trying to understand better.
Thank you for reply.
Hi,
I enjoy so much this example. Thanks a lot for providing it ! I used this source to build my own “collaborative form” application.
With the accordion, no problem… but I’m now trying to integer it into a “wizard” form navigation based on HBox element, inspired by the example there :http://blog.kevinhoyt.org/2007/02/18/thoughts-on-accordion-usability/
No problem for propertyChange events, data is copied, but I can’t manage to exchange forms view when the wizard pages switches (you’re using IndexChangedEvent with the accordion but this event is not applicable to HBox…)
here is a sample of code :
Any idea ?
I hope you’ll understand my English (sorry…) and my problem…
Thanks a lot if you can help !
Oops, It seems like posting source code is not allowed.
Just another thing (one post, one subject…)
There is a problem with the DateField property which has random results… The binding seems to have a problem, only the session initiator can change it. When the person who join the session try to modify it, the old date immediately goes back… (I tried various ways, everytime the same result).
Have a nice evening
Good morning,
I finally found myself issues for my two previous problems.
Here is the way I solved the DateChosser binding problem :
- In the Model, I declare the “Date” property as a String :
public var dateNaissance:String = “”;
- In the forms, I’ve put a DateField component binding its text attribute :
And finally the binding of the DateChooser.text with the model text variable :
There may exist a better way, but I hope this could help !
I just discovered your updated version, which I found so exciting. Waiting for the source code to be published ! Thanks again.
Hi Cristophe,
thanks for this great example.
Don’t know what it’s like in the US right know but a example about mortgages is daring
Quote of Edgar who says it right :
Blaze DS + Flex SDK + J2EE = The best openSource solution
hey
thank you for sharing this website
application always gives a bug in firefox
after some time:
flash player version 9,0,124,0
firefox 2.0.0.14 (windows xp)
–> unhandled exception in browser
(+”debug in visual studio?” question)
Just for those who want to have a Coldfusion version of this app :
in the messaging-config.xml, just ad this :
to the end of the document…
Restart the Coldfusion server
and all works fine !
regards
ok.. no source codes here, so go to Adobe Devnet Christophe article at :
http://www.adobe.com/devnet/flex/articles/data_entry.html
hey
thank you for sharing this website
thank you for sharing this website
This looks really awesome, great transparency-style. I also want to thank you, as we are searching for new ideas and styles to improve our homepage.
it’s not work on my mochine ,and on the FlashPlayer 10!!!!
There may exist a better way, but I hope this could help !
I just discovered your updated version, which I found so exciting. Waiting for the source code to be published ! Thanks again.
Hi all,
i am a coldfusion developer and a flex aspirant. i want to know how we can integrate flex with blazeds and coldfusion. i dont know much abt blazeds. Can i make a chat applicatin in coldfusion with blazeds support and integrate in a flex site? is that possible? any tutorial links would be helpful..thnx..
This is a new thing for me, but i am glad that i came hear and make a know about this subscribe messaging infrastructure for data entry.
Hi all,
i am a coldfusion developer and a flex aspirant
Thanks a lot if you can help !
This appears good information shared in this post.
Trying to figure out php, I know coldfusion is powerful.
Да,несогласен с предыдущими высказываниями
) Bye
Thank you! I really like this. If want buy? I recommend this site: http://www.diymyhair.com. They are a good seller.
Hi! I was surfing and found your blog post… nice! I love your blog.
Cheers! Sandra. R.
Sign: yyams Hello!!! punht and 843dhursyvpxd and 7004 My Comments: Cool!
Sign: gfndc Hello!!! cbatx and 6399ckxbucncks and 5857 : I like your blog. cool post!
In this example is your web server using livecycle or blazeds? I ask b/c using my localhost (I only have blazeds setup) I cannot get this example to work. Other samples (gmaps, etc.) work but not this one.
Thanks for this demo. And might I add, this is a very helpful site. Keep it up!
Interesting article about collaboration, as an application developer it is always great to see new technology emerging. Is this a good system to use for Open Source type items that would be readily available from the Web? In-other-words, how secure is it?
firstly thanks for the good info on this blog, some of the comments have also help me out, all of this for simply stumbling across this blog
The top panel of you website shows up all out of whack! i’m using IE if it helps.