Friday, January 22, 2010

Flex Spring BlazeDS Integration (on public web server)

This won't be a post about how to integrate Flex and Spring. Actually I intended to be one, but several days ago James Ward posted this tutorial on how easy it is to do with Flash Builder 4 so I thought it won't be necessary.

Edit:  you can checkout the new post of how to upload files with Flex and Spring

What I will show is how to upload our project to a free Java and Tomcat host to test it, connect our Flex application to it and show this example here. I've been looking for such free hosting and the only thing I've found (if there are any others please comment) is eatj.com that provides a free trial limited up to 50 MBs of storage and every 6 hours the server is restarted, but for testing is fine.


I assume that you already created your Spring project based on the tutorial. I've added small changes for the current example, if you want the source of the example get it from here. Now right click on the project -> Export -> WAR file and select where to export it.
Now we log into our account in eatj.com and upload the war file, restart the server and this is it.

Now for the Flex part, although I haven't used the Data Wizards from Flash Builder (as I've had small problems) I did it the old fashioned way and the source is:

<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" 
         xmlns:s="library://ns.adobe.com/flex/spark" 
         xmlns:mx="library://ns.adobe.com/flex/halo" minWidth="1024" minHeight="768"
         applicationComplete="remoteObject.addMessage(null, null, null)">
  <fx:Script>
    <![CDATA[
      import mx.controls.Alert;
    ]]>
  </fx:Script>
  <fx:Declarations>
    <s:RemoteObject id="remoteObject" destination="myService" fault="Alert.show(event.fault.message);">
      <s:channelSet>
        <s:ChannelSet>
          <s:AMFChannel uri="http://maverix77.s215.eatj.com/spring-flex-server/messagebroker/amf"/>
        </s:ChannelSet>
      </s:channelSet>
    </s:RemoteObject>
  </fx:Declarations>
  
  <mx:DataGrid x="0" dataProvider="{remoteObject.addMessage.lastResult}" width="402" y="0">
    <mx:columns>
      <mx:DataGridColumn dataField="sender"/>
      <mx:DataGridColumn dataField="text"/>
      <mx:DataGridColumn dataField="date"/>
    </mx:columns>
  </mx:DataGrid>
  <mx:Form x="10" y="160" width="252" height="142">
    <mx:FormHeading label="Leave new message" width="206"/>
    <mx:FormItem label="Your name">
      <s:TextInput id="nameInput"/>
    </mx:FormItem>
    <mx:FormItem label="Message text">
      <s:TextInput id="messageInput"/>
    </mx:FormItem>
    <s:Button click="{remoteObject.addMessage(nameInput.text, messageInput.text, new Date())}" label="Send"/>
  </mx:Form>
</s:Application>


Yep that is Flex 4, my first Flex 4 app in my blog :)

So now we compile it and we have our swf. For this example I will upload it to http://sites.google.com/ which I use to publish my files to.
There is one last thing to do, to create and configure a crossdomain.xml on our server.

We create on out local machine crossdomain.xml looking like:

<?xml version="1.0"?>
<!DOCTYPE cross-domain-policy 
  SYSTEM "http://www.macromedia.com/xml/dtds/cross-domain-policy.dtd">
<cross-domain-policy>
   <allow-access-from domain="*.googlegroups.com" />
</cross-domain-policy>

The weakness here is that everyone from *.googlegroups.com can connect, but as this is an example it is not a problem, and I don't think someone will be that interested :)

Now with your favorite ftp client, connect it to host: s215.eatj.com port:21 your account's username and password. Navigate to /webapps/ROOT and copy the crossdomain.xml there.

Click here to see the result. EDIT: Unfortunately the eatj trial account shuts down the server 6 hours after it was started. That's why sometimes you wont be able to connect to the server

Source code:
spring-flex-server
FlexSpring

Thursday, January 7, 2010

It's that time again. Mountain View

Hello!
First of all I'd like to wish Happy New Year!
I have a present for you (well it's actually for me but you can benefit)
Last winter I went to a ski/snowboard sale, with no particular reason, and whatta you know I got home with a snowboard, pair of shoes, bindings and everything. The next day I was already conquering the Vitosha mounatin. That was when I rode snowboard for the first time of my life. And whole season I was so thrilled of how cool is that so whenever I had a chance I went to the mountain to snowboard. So here comes another season, and I will not miss a chance to hop on the lift.
But unfortunately the weather here in Bulgaria is very strange. At new year's eve the temperature was 12°C when 3 days before that it was -10°C. So to go to the mountain you have to know if the weather there is ok and is it ride-able (able to ride :P ). You can always check some websites see what the weather is, other to see web cams of the resorts, but why not have a small application that checks this for you. For that purpose what could be better than an Air application. So I sat one day and decided to create an application showing the weather condition for the next few days, and whether you should go and ride or go and waste time because of the bad weather. Here for all you ski/snowboard/snow/mountain lovers I present you MountainView.



MountainView provides 3-day weather information and live images from webcams for these ski resorts: Vitosha, Bansko, Borovets, Pamporovo. I'd like to thank http://www.snow-forecast.com/ for providing the weather feed, which I personally think is the most correct forecast. I would also like to thank www.skivitosha.com, www.banskoski.com, www.borovets-bg.com, winter.pamporovoresort.com and www.bulgaria-hotels.com for providing maps and webcam images of the resorts.

Download MountainView

So grab it, play with it. Please comment you thoughts
MountainView is created with Adobe Flex. Check out the source code from here