I R Spatial

Creating in Memory BitMaps from a single image file.

2009-11-11T11:48:00.000-08:00

I found this today while looking up information on the new Flex 4 Layout classes. This guy has a single .png file with a bunch of cards on it that he wants to use as individual images in his application. I was pretty impressed with the code, mainly because I had never really thought about it and it's an easy solution.

protected function application1_creationCompleteHandler(event:FlexEvent):void
{
  loader = new Loader();
  loader.contentLoaderInfo.addEventListener( Event.COMPLETE, loaderComplete );
  loader.load( new URLRequest( "cards.png" ) );
}
    
/**
* Extract each card in the deck into their own object
* The object includes a label (rank of suit) and a Bitmap image of the card
*/
protected function loaderComplete( event:Event ):void
{
  var suitsIdx:Number = 0;
  var ranksIdx:Number = 0;
  var cardWidth:Number = 79;
  var cardHeight:Number = 123;
  var a:Array = [];
  var img:BitmapData;
        
  var d:BitmapData = Bitmap( loader.content ).bitmapData;

  for ( var i:int = 0; i < 52; i++ )
  {
     img = new BitmapData( cardWidth, cardHeight );
     img.copyPixels( d, new Rectangle( ranksIdx * cardWidth, suitsIdx * 
         cardHeight, cardWidth, cardHeight ), new Point( 0, 0 ) );
     img.draw( img, new Matrix() );
     a.push( new Bitmap( img ) );
            
     if ( i == 12 || i == 25 || i == 38 )
     {                    
          suitsIdx++;
          ranksIdx = 0;
     }
     else
     {
          ranksIdx++;
     }
  }
        
  list.dataProvider = new ArrayCollection(a);
  list.selectedIndex = 25;
}

Getting Behind!

2009-11-06T11:04:00.000-08:00

Wow I've really fallen off of keeping updates on here. It's been really busy here at 3-GIS over the past six or so months. We're doing a ton of extensions for our base product and continuing to push our Flex applications to do more than nature intended.

One of the cool things we've done in recent months is release a product called Mapper in a joint venture with another company. You can check it out here tucuxisoftware.com just don't ask me to explain the company name.

I think I dropped off the blog updates when I switched over my main development machine to a Mac. I got busy at that point figuring out everything about it and lost track of doing updates.

In the Adobe world this month's user group meeting we talked about Photoshop to Catalyst to Flash Builder. You can find the post about it here. You may have to be a member to see it, let me know if anyone has any issues.

The other hot topic right now is Google Wave! I've been playing around with it for the last couple of weeks. I'm still not sure what the total value of it is going to be. If anyone is reading this and would like an invite just let me know. I have 10 invites open to the first 10 people to comment here!

FlashVars

2009-03-16T11:15:00.000-07:00

I'm currently overseeing a project where our main application is being embedded into another web application. As part of this we needed to be able to pass information from an external source into our app, so we turned to Flash Vars. I'm not going to lie, it was a pain in the butt to figure out how to get them to work. I looked at a number of different examples, all of which failed, before I finally found one that steered me in the right direction, and even it had me doing edits in two or three places that were not necessary. In the end it was pretty simple (of course). Just open up your index.template.html for your application. You are going to edit the AC_FL_RunContent, but be careful because it's in two places, one for if the client didn't have the right flash player and one (the second one) for if they did. You need to edit this second one. Mine ended up looking something like this:

AC_FL_RunContent(
"src", "${swf}",
"width", "${width}",
"height", "${height}",
"align", "middle",
"id", "${application}",
"quality", "high",
"bgcolor", "${bgcolor}",
"name", "${application}",
"allowScriptAccess","sameDomain",
"type", "application/x-shockwave-flash",
"pluginspage", "http://www.adobe.com/go/getflashplayer",
"FlashVars", "MyToken="+token+"&a="+aVariable+"&b="+bVariable+""
);

Then to access the Flash Vars from Flex:

var paramObj:Object = Application.application.parameters;

var mapperToken:String = paramObj.MyToken;
var outsideA:String = paramObj.a;
var outsideB:String = paramObj.b;

And that was it. I of course check to make sure none of them are null etc. so that the application can still work stand alone. All in all it was a ton of ferreting around for the information and easy to do once I found this. Hope it helps someone else out.

Flex 3 for Education

2009-01-28T10:52:00.000-08:00

Sorry no updates for a while on here. Listening to the Tech Wednesday for the Flex SDK today though they said a couple of things that I thought were worth posting on.

Flex 4 will be delivered in Q4 of 2009 with open beta in the second quarter.
Adobe gives Flex Builder 3 Profesional away to students, faculty, and any employees!

Get that free Flex Builder here!

Adobe + ESRI = LOVE?

2008-12-12T06:45:00.000-08:00

Bouncing around the Adobe site this morning I came across a large 'Now developing on Flex' area with the ESRI logo as one of those listed. This article was linked and includes excerpts from an interview with Mansour Raad of the ESRI Flex API team among others. It's an nice to know that Adobe has taken notice of all the interest from the GIS community.

Working with data in Flex

2008-11-25T07:30:00.000-08:00

This session was led by James Ward. I was somewhat familiar with him having found a couple of interesting posts on his blog in the past about easing functions in Flex. He focused mainly on what you should use to store and move your data under different circumstances. He briefly discussed the Tour de Flex AIR application which everyone in the session was given a copy of on a nice 1gb thumb drive. Tour de Flex shows how to use a myriad of components, both built in Flex components and third party ones. I was of course interested in playing with the mapping APIs included from Google, MapQuest and Yahoo Maps.

Next we talked about different ways to send your data over the wire from the server to the client. James has a great Flex application available online which allows you to test out all of the different options. Of course AMF (Remote Objects) was basically the fastest. It did seem to get beaten by Data Services using Flex Paging though, but that's what you pay for with Blaze DS I suppose. The application is quite nice and allows you to send rows across from a server side database.

He followed that presentation by giving a few other examples that boil down to things to be careful of when dealing with large amounts of data. With XML there is a memory overhead which can become significant with large amounts of data and can cause performance issues.

For AMF (surely nothing is bad about AMF! It's a binary, no parsing required, way to send data!) he said to watch out for circular references and the overhead you accept for the use of binding. Sounds like a no big deal thing to me but maybe Adobe pays him to get people to consider buying Blaze DS?

One last thing he talked about was something I had assumed but never really quantified. He built a quick Flex application which loaded 100,000 objects into an Array and the same objects into an ArrayCollection. It took the Array a mere 100 milliseconds to complete where the ArrayCollection took 1.4 seconds! So if you are dealing with large amounts of data and want your application to be fast, watch out for those ArrayCollections.

Flash Security Model

2008-11-24T14:21:00.001-08:00

We all know that security is one of the most important parts of any enterprise solution. That said, it's also dead boring. Deneb Meketa led this session and opened with a line very similar to that so I don't feel bad saying it. Before I get into some of what we went over in this session here is a nice video that overviews the first day and general session.

Now that you're excited let's talk security. In order to make this fairly brief I'm mainly going to just go over the five basic security rules Deneb gave us and if I think of anything for each of them I'll expound.

Rule 1: Use least privilege

When creating your cross domain files etc. never use an allowDomain="*". It may be a bit of a pain to actually enumerate the domains allowed to access your stuff but it's much better than being hacked.

Rule 2: Validate Input

You never know what someone might try to stick into the stream as input so validate it on the client side and on the server side.

Rule 3: Deploy HTTPS Consistently

Don't mix HTTP and HTTPS. All you will do is expose holes in your security.

Rule 4: Prototype Early

I thought this was an interesting rule for the Flash Security Model but as he explained a bit more it made perfect sense. If you don't prototype early there may be something you plan on doing which simply isn't allowed within the Security Model. If you prototype that stuff early and find out it won't work you may be able to find an easy way around it. If you wait until the end it may be a nightmare.

Rule 5: Keep Track of Security Changes

The last thing you want is the CEO walking up to you and saying, "Internet Explorer upgraded my Flash Player and now none of our stuff works. What did you break?" Believe me, I know.

Tuesday General Session of MAX

2008-11-24T12:57:00.000-08:00

The General Session on Tuesday was led by Tim Buntell, the Sr. Product Manager for Flex Builder. They walked through a lot of functionality with Tim as Agent B doing a James Bond inspired walk-thru the 'lab' to look at all of the cool new stuff. It was definitely entertaining.

There were a few things that really caught my attention (besides the James Bond theme) during this session. One was Project Alchemy. This technology allows you to take C/C++ code and recompile it into ActionScript! Think of all that C/C++ code bouncing around the web that Flex developers can not take advantage of! They showed an example of a NES emulator running in Flash player as well as a Quake Player. That was pretty awesome to see. I can't wait to take advantage of some C/C++ code!

Something else that I'm sure many people will be excited to hear is that there is an IDE coming out for Cold Fusion called Bolt. It will be built off of Eclipse just like Flex Builder and from the little they talked about it I think it will be a nice change for Cold Fusion developers.

Now how is this for a shell shocker: There is a new plugin for VS 2008 called Tofino that allows you to create Flex applications/front ends for your projects! That's right, you can develop a Flex application in Visual Studio! If anyone gives this a try please let me know. It didn't seem to be that big of a deal to anyone at MAX but I think it was because most of them have never even used Visual Studio. I'd like to hear how well it performs and integrates with a normal .NET workflow.

Intro to Thermo and Gumbo

2008-11-24T12:18:00.000-08:00

My last session on Monday was about Thermo (Adobe Catalyst) and Gumbo (Flex 4) and was led by Ryan Stewart.

This was a great session and he went over a ton of stuff that will be in Catalyst as well as going through an end to end example of taking a Photoshop file, importing it into Catalyst, marking up the parts as components, and then importing the resulting file into Flex as a project. When you open a Photoshop file in catalyst and mark the different parts as components and insert your transistions etc. what gets saved is an fxp file. This is basically just a zipped up flex project file! This was a nice way to show the story they have developed for the use of the Adobe products and I have to admit I was blown away.

Among other things of note, we were told that the first public beta would be in the first quarter of 2009. There is a new merge tool for Flex Builder which allows you to pull changes in from Flex Catalyst which is nice if you have developers and designers working on a project at the same time.

Something that really got me excited is the new Services Explorer in Fx. It allows you to select remote objects you wish to use and automatically creates strongly typed classes for you! That means you can treat them as normal objects (type checking and all) without having to go through it all on your own anymore. I'm really excited about this since we use remote objects a great deal.

Another nice addition to Fx is the Network Monitor which allows you to watch all network traffic between your Flex application and the Server. They have also included Flex Unit Support which allows you to generate test suites and auto-generate unit tests for your code! Of course you still have to fill in some of the actual test part but the skeleton is created for you. This is going to make life for us at 3-GIS much better.

One last thing he didn't spend much time on but which I'm interested in seeing is Templates. Basically if there is a standard way you build out classes or functions you can now save these as templates (boiler plate code) and stamp them down wherever they are needed. This could be a big time saver for anyone like us that uses a standard framework that requires a lot of the same basic code being written every time you add a new feature, screen or component.

I would tell you how I've found working with these features so far but unfortunately the preview disc they gave us was for Mac only and I'm stuck with a Windows box. The release for Windows though is supposed to be coming out early next year.

Real Time Collaboration Apps with Flex and Cocomo

2008-11-21T11:53:00.000-08:00

Monday afternoon I was able to attend this session of MAX led by Nigel Pegg. The first thing he mentioned is a free collaborative tool they have created using Cocomo called Connect Now. It's a pretty durn nice piece of software especially for small/medium size companies and includes video/audio streaming capabilities. Cocomo is described as a PaaS (Platform as a Service) built for real time collaboration. The Cocomo SDK for Flex is designed to make it simple to share areas and inputs. I have signed up for a developer license but haven't had a chance to really play with it yet. I'll post back here about it once I have had a chance to do so. They allow the sharing of inputs etc. with a Batton property, basically when someone has control of an input no one else can get access to it until they are finished. Cocomo rooms (using the developer license) can be built to share user status, roles, webcams, VoIP (using the Speex Codec), documents, media etc. It even allows direct client to client streaming as of flash 10.

The Cocomo Dev Console (which is where you go once you sign in using your account) allows you to configure rooms, enter rooms, etc. For more information go here and read the FAQ!

Looking Ahead at the Next Version of Flex

2008-11-21T09:18:00.000-08:00

This was the first regular session of MAX I attended. It was led by Ely Greenfield whose blog I check from time to time. He was talking about Flex Gumbo (Flex 4) and to some degree Flex Catalyst (formerly known as Thermo).

There are a lot of changes in Flex 4 which are necessary strictly for Catalyst to work correctly and he spent a large portion of time on them. For those of you who don't know (and I didn't before this conference) Catalyst allows a designer to take a user interface they have mocked up in Photoshop, import it into Catalyst, mark parts as 'button' or 'scroll bar' and even set transitions and animations, and then save all of their changes as a Flex Project! This means that developers can be handed a nice intuitive user interface and simply do what they do best, put in all of the business logic, without being worried about color schemes and glossy buttons.

It also means that the designer can make changes to the UI at any time without having to bother the developer. The designer simply reopens the project in Catalyst, makes the necessary changes, and saves them and the next time the developer opens his project the new UI will be in place without having bothered his code.

All of this is accomplished via the new Spark Architecture from Adobe which basically divorces visual components from their data and behavior. Don't worry about your old projects not working though because Adobe has created a new set of components (FxComponents) to take advantage of this new architecture, so all of the old components will still behave the same as always.

The way this data is passed around adobe products (Photoshop, Catalyst, etc) is through a new interaction language called FXG, a graphics format based upon MXML, which all Adobe products can read.

Flex Catalyst is a completely declaritive language (think mxml) and adds a few new metadata tages like SkinPart and SkinStates which help define things like parts of buttons and the states of those buttons.

There is also a new MXML Graphics library containing things like Fill and Stroke. These graphics objects are 1st class citizens in flex, making them usable just like any other object. This includes a new GraphicElement which is a graphics base class created purely for the purpose of rendering graphics and improving performance.

The new FlexText objects allow more liberties with text within a Flex application. This includes fading and rotating among others. Flex now has a very powerful ability to produce top quality text which is one of the reasons the NY Times is developing an AIR application.

There has been an effort to make states easier to understand inside of MXML by putting an inState property on components instead of the old state tree. This is one case where you can not use new and old styles together. A file must use one or the other.

A number of other small changes were discussed, including that if you wish to add non-visual components to your mxml you can't simply add a tag but must wrap it inside of a tag. Otherwise non visual components will be left out.

Other changes include:

Container tag has changed to Group
List class is now DataGroup class/tag
3D effects now built in! (FX:Rotate3D)
2-way data binding! (value='@{bindvalue}')
increased compiler performance! (2x-5x faster)

We were given a latest and up-to-datest copy of the new Flex Builder and Flex Catalyst but unfortunately it was for Mac only and those of us in the Windows world will have to carry on a bit longer (January or February) before we can play with both of these together.

Max 2008

2008-11-21T08:39:00.000-08:00

So I got the chance to go to the Adobe MAX conference this year in San Francisco. It was a Monday-Wednesday (November 17-19) affair in the downtown area of the city. I've been to a number of different conferences at this point in my career but this one definitely stands out as unique. The location was nice and it had all of the standard elements of a conference: general sessions, labs, lectures, swag, etc.

The atmosphere however was a surprise to me. Instead of your normal business conference atmosphere (think lots of stuffy old guys shuffling around a large room) it was more like Lollapalooza. There were gaming stations (both console and computer) spread throughout the conference, lots of give-aways like PS3s and notebook computers, and the average age of attendees had to be about 27. There was also an interesting mix of Designers and Developers, two groups who don't traditionally walk in the same circles but it seemed to work just fine at MAX.

The general session Monday started at 9:30 a.m. Free breakfast started at 7 a.m. so naturally I got there at about 7:01 After I filled myself to capacity I went up to the third floor where the general session was going to be and figured I would get a good seat since I was almost an hour early. I was told that the session didn't start until 9:30 however and so I couldn't come in.

Thus began the wait. At about 9:32 a.m. they finally let the stampede of five thousand of us through the doors. I'm not sure what happened then, I don't know how many died, all I know is that I made it to a seat somehow. I ended up just to the right of the stage on the third row. As I walked down the isle the booming sound system pounded out recent rock hits so loudly that I could feel the bass in my chest. Up top were three giant wide screen displays placed next to each other with a panorama of Adobe images and video interviews. Once things got started the first person to come out went up to a turntable (that's right) and started a video/audio slide-show. It was one of the coolest things I've ever seen a serious geek do. When he scratched the turntables not only did it scratch the music but also the video. It basically went through a rundown of what Adobe was about, what was coming out, and how people were using the products etc. Like I said, it was pretty cool.

After that Kevin Lynch (CTO Adobe) came out and led most of the session, bringing on people from Disney, The NY Times, Google, and Maria Shriver (y'know the governator's wife) among others. They also breezed over all of things coming soon from Adobe including that next year will see the Flash Player 10 come to mobile devices as a full Flash Player! For those of you interested For those of you interested you can go to http://adobe.com/go/keynote to see a little more information about what went on. They are also supposed to have audio/video of actual sessions up at some point. I'll go over all of the sessions I attended along with my thoughts about them as I have time.

The Power of '\'

2008-11-10T05:34:00.000-08:00

I recently went through an ordeal attempting to use the Flex command line compiler for a project I was working on. After figuring out a series of fairly cryptic problems I got to one which made no sense. I was getting a ‘cannot find file’ error for an asset that I knew to be in the correct position. In fact the project would build just fine within Flex Builder. The file was an embedded image asset located at something like ‘…/assets/images/image.png’. I couldn’t figure out why it would have an issue. After searching the internet for about half an hour I came across the post of another blogger with the same problem. He said that adding a ‘/’ to the front of his embedded file names fixed all of his issues. Lo and behold it worked for me as well. I guess the Flex Builder compiler is smart enough to find the files with or without the ‘/’ but the command line compiler wasn’t built with the same intelligence. I’ve also seen the power of the ‘/’ in a couple of other places even within Flex Builder such as source paths remaining unfound without the ‘/’ in front.
Lesson Learned: When in doubt, add a ‘/’ to the front of the path.

Flex Builder Cryptic error message

2008-07-31T12:40:00.000-07:00

From time to time I find some fun errors in Flex Builder 3. Today for instance we were refactoring our framework project and moving some events and interfaces into our common library. All was going well until I renamed a folder (namespace) within Flex Builder to be singular (i.e. renaming dogs to dog).

Once I did this I got an error saying:

Cannot find source for class dogs.blah Location Unknown

My assumption was that this error was caused by the fact that many classes still referenced the dogs.blah class instead of dog.blah which was it's new name. After diligently fixing all of the references and package declarations within the project the error still occurred. Another developer sat with me and neither of us could figure it out, so I did what I always do in these situations, I Google'd it. And lo and behold I found the answer here.

Basically you need to go to the base directory of your project, open the .flexLibProperties file and remove or correct the bad class references.

This file contains an xml list of all classes to include in your project swc/swf file and for some reason doesn't update properly sometimes. I hope someone reads this and it helps them as much as the other post helped me.

Modular Test Driven Development

2008-07-17T11:00:00.001-07:00

So as I mentioned before we've decided to use FlexUnit to do test driven development in Flex for our latest project. We also want to do modular development in order to support Bundles as per the OSGi framework which I also mentioned before. In order to make these two things work together easily I wanted to be able to simply drop modules into a 'test runner' flex application and have it run all of the tests embedded within that module. Zach Smith, one of our new developers, whipped up a pretty nice test framework and test runner application which allows us to do just that.

For the test framework he extended the Flex Module class to make a TestModule class. All of the tests within your module are then registered with your TestModule. Below is an example registering a TemperatureConverterTest.

You'll notice the line 'this.testClassArray' which is the inherited property from the TestModule class. After that you drop the swf from your built module into the directory containing the test runner application, edit an xml file to register your module with the test runner, and run the application. The application is the basic FlexUnit built in interface.

I'm really pleased with the way this turned out and it's going to make unit testing fairly easy since we can do it all in one central location, and since it's a Flex application we can leave it on a central server and run it from anywhere within our internal network.

Creating ASDoc for your Flex application

2008-07-15T05:12:00.000-07:00

Since we're heading down the path of creating an actual product in Flex here I decided to look into ASDoc. Once I found the location of the asdoc.exe the whole experience was fairly painless. Above each of my classes and functions I've added a comment something like this:

/**
* Starts this class.
* Try to start this class.
*
* @throws MyError upon error of if the class was in an invalid state for this operation.
*/
function start():void

And then from a command prompt I typed:

C:\Program Files\Adobe\Flex Builder 3\sdks\3.0.0\bin>asdoc -doc-sources "C:\MyProject\src" -main-title "My OSGi Framework" -window-title "My Documentation" -output OSGI_ASDoc

after hitting enter I got this status message:

Loading configuration file C:\Program Files\Adobe\Flex Builder 3\sdks\3.0.0\fram
eworks\flex-config.xml

followed by a 'complete' message. The resulting html document looks much as you'd expect a Javadoc to look, with links to each class and package along with your comments. I'd suggest this to anyone trying to keep up with a fairly complex object model, especially if you will be having more than one person working on it.

Flex Holistic Lab Wrapup

2008-07-12T08:28:00.000-07:00

This past week in the ESRI Holistic lab was interesting as always. The Flex API is moving along nicely, now containing api toolbar functionalities, like the drawing toolbar, which really makes life easy for those of us doing redlining and more within the api. I already had a firm grasp of the framework’s intended uses and functionality so I ended up pinging the ESRI team most of the week with feature requests and programming framework questions.

The end result of this week’s testing is that I think I’ve managed to decide on a list of api, application, and programming frameworks that we will use in building our new software. For our prototype version of Network Express we used Fluorine, a .NET gateway technology, to handle all of our calls from/to the server and our Flex application. This was a natural choice for us as we’re mainly a .NET shop and it was easy to write all of our server side classes and web services quickly in C# and ASP.

Moving forward however it seems that if we stayed the course with Fluorine we’d be out on a limb all alone. No one on the ESRI Flex API team (I’m just gonna call them EFA team from now on) have even heard of Fluorine and a number of them come from Java teams within ESRI. As a result they tend to gravitate towards Java based technologies for their server side components. Add to this the fact that Adobe (the company that produces the Flex SDK and Flex Builder) has their own server side product, Blaze DS, which is built on top of a Java platform and it appears that peer pressure has forced our hand. The EFA team are comfortable with Blaze and have used it for several projects, and although they didn’t explicitly say “don’t use .NET!” the mere fact that if we had any technical issues we wouldn’t be able to lean on them for support makes it seem like a bad idea.

So I spent the week largely looking at Blaze DS, which works great actually, once you get used to coding all of your server components in Java. Luckily for me I spent a couple of years coding Java in the past and so it wasn’t too much of a stretch to brush up on my syntax enough to get a few things working.

Late one afternoon I was speaking with Ismael Chivite, the lead of the ArGIS Server group and a generally nice guy, about doing server side coding and he mentioned something that gave me an “aha” moment. He told me to be careful when using a server context to create objects because each time the context is used it makes a call back to touch the SOM machine. Whether you know what this means or not doesn’t really matter, the punch line is that I suddenly remembered our prototype doesn’t take any advantage of the distributed processing environment offered by ArcGIS server at all! We knew it would be necessary long term for the actual product to do so in order to provide a stable, scalable product but we had other things to worry about for the prototype so we let it go. At some point in all the worry of learning the new EFA, learning basic Flex best practices, and deciding on server side technologies and overall architectures and frameworks to use the fact that our current server side design was completely un-scalable had slipped my mind. So I added that to my list of to-dos.

Mid-day Thursday afternoon I finally got my Blaze DS setup working and talking back and forth with my Flex application. I found a great example here by a guy who had gone though my same issues, which was awesome. After I was confident with that I went back to the Java class I had written that morning to create a point feature in SDE using a server context, and consequentially a SOC process. Antony, one of the EFA team members found this site for me which really helped me past the last few issues I was having with it. Blaze DS is so fast in transmitting data back and forth from the server and the Flex application that I didn’t even do any debugging in my server side classes, I simply returned any errors they had to my Flex app and debugged through it. The response time was so fast that I had no problem doing it this way and less than an hour after I got Blaze up and running I was creating features in SDE through my Flex application.

Do’s and Don’ts of Server Context programming:

· Don’t simply ‘new’ your variables, you need to use the server context to create them. Otherwise you’ll end up with automation errors. This occurs because the objects need to be created within the context of the SOC process which will be running your code.

· Do release your server context in a ‘finally’ block or otherwise assure that it will always be released, otherwise you’ll end up bogging down your server when errors occur and the process sits around waiting to time out. This caused me several minutes frustration while I was initially debugging my server side code.

· Do follow all standard Arc Objects programming practices when using a server context. If you would start an edit operation in a standard Arc Objects application, start one in your server code.

Application Frameworks

We talked about several frameworks during the week and I took a hard look at three of them: Cairngorm, the M Framework, and Mate (pronounced like latte but with an m). Cairngorm is an application framework developed by the Adobe solutions developers and is designed to help teams create complex and robust applications without stepping on each other’s toes and getting bogged down with interdependencies and repeating code. The M Framework, named after Mansour Raad the lead EFA team guru, is the name Mansour jokingly gave the framework he uses when creating solutions for customers. It is basically a pared down version of Cairngorm in which he has left the parts that are useful to him and removed the parts that don’t actually give him any benefit and simply create extra overhead. In my opinion his framework is great for any small to medium project with a team of 1-3 developers, but I think you would miss some of the things you gain with full blown Cairngorm on larger projects. The last framework I looked at was Mate. It is the current flavor of the month in Flex frameworks and is generating a lot of buzz. I downloaded the framework and looked at some of their examples and I guess I am still reserving judgment although I think I’d have to say it’s not for me. It seems to be a slick, low maintenance framework though. It’s deemed as a framework for people who hate frameworks and I can definitely see that. For me though I just don’t think I’ll ever be working on the type of projects that it’s meant for, and as an Engineer at heart I love frameworks.

OSGi

The OSGi framework is an application framework for large Rich Internet Applications (RIA) which allows you to drop new components into the working directory of an application and have the app find and expose the new functionality immediately. Basically the way this works is that each new set of functionality you create for an application is wrapped up in a Bundle (IBundle). This Bundle can then be discovered by your base application when it is present, and the functionality it contains is exposed as services which are registered so that any other service can gain access to them. This means that if two related Bundles are present they may use one another to enhance their own functionality and if one of them is removed the other will continue to work but the available options may change. This is exactly what we want for Network Express and is also exactly the way our current field application works. You simply develop new functionality, drop it in the bin directory of our app, and boom, you can use that functionality within our existing application just like it was native.

Resolving OSGI and Cairngorm

So great, I have found two frameworks I want to use. Now how in the world am I going to use both of them on one project? Well first off, OSGi is a Java framework. That is, it was developed to work for Java based web applications. This being the case there isn’t really an official version of the framework for Flex. This is a mixed blessing for us. It means that we have to develop the framework on our own, and mesh it with the Flex notion of Modules (Modules are dynamically loadable swf files for Flex applications) and at the same time interweave it with the Cairngorm framework, which is based on Flex, although an official Flex 3 version of it has yet to see the light of day. The fact that Cairngorm is open source may end up being the saving grace for us in this situation but my initial feeling is that we’ll end up using Bundles from OSGI to encapsulate functionality which is built using Cairngorm, with one master Application Bundle that runs all of the rest.

Oh yes, and don’t forget that we will be using Test Driven Development (using FlexUnit) for each individual piece of functionality. I’m sure there are going to be even more intricacies I have yet to even consider, but hey, that’s the price of doing something new and hopefully cool.

Overall I’d say my week of testing was a big success. I managed to get a handle on using Server Contexts, learn and test the new pieces of the EFA, and begin to get a grip on how we’re going to manage to develop this whole mess. I’m sure it’s going to be busy over the next few weeks but I’ll do my best to keep our progress updated here and post any interesting problems/solutions we run into along the way.

Greetings from Redlands

2008-07-10T11:43:00.000-07:00

So I'm spending another week in Redlands, CA this week doing more testing of ESRI's new Flex API. I've got a lot of notes and things to go over here that I'll do over the next several days. A lot of what I'm dealing with now is deciding on the overall architecture of the product we plan on building on top of this new API. I'm dealing with application frameworks, server side technology, etc. I'll post about all of the ones I'm considering and what I like/dislike about all of them.

Google Street View Comes to Huntsville

2008-06-13T05:26:00.000-07:00

Google's street view vans have been running around Huntsville! Check it out and see if you can find my house, it's at the corner of Indian Creek and Kelly Springs in Harvest. It looks like they came through about three months or so ago because my old neighbor's car is in their driveway and they moved about three months ago. And before you say anything I know I need some landscaping, I'm planning to do that this summer.

2008 ESRI Dev Summit Code Entry

2008-05-30T13:15:00.000-07:00

For anyone interested, I entered the code challenge for the developer summit this past year. My entry can be found here and the interview they did with me about it during the dev summit is here. I know I sound a bit like an idiot, but what can you do? The code is built upon the old ArcWebServices flex api but most of it is still valid. It's a small flex program that does automated testing of your map services and gives you data in csv format based on the response times for pans and zooms. I think that the example link is broken but if anyone would like me to set it back up just let me know and I'd be happy to.

The 2008 ESRI Dev Summit

2008-05-28T06:55:00.000-07:00

I was fortunate enough to go the the ESRI Dev Summit in Palm Springs, CA this past March. It was a great place to learn all about the next release of ESRI software, meet with the actual developers, and learn tips and tricks and see actual code. Almost all of the sessions are now available online on the EDN Conferences page. Check it out, I'm sure it will be worth your time.

ESRI Holistic Lab: Flex API Day 3

2008-05-23T07:24:00.000-07:00

I got around to asking about two things I would really like to have in the Flex API on day three: Will there be a way to change the version I am seeing, and will there be a way to change the data frame that I am viewing? The answer here was pretty much what you would expect. If the REST API will support it then the Flex API will be able to do it, which means that it isn’t currently available. That means this will still be one area where the ArcServer WebADF will outshine Flex. There are of course ways to get around this. You can create a Map Service for each version you wish to see although that will potentially cause problems with far too many Map Services. As far as data frames go, the same applies, simply create separate map services for each data frame.

Built In Tasks

Having gotten the QueryTask to work on day two I decided to take a gander at the other built in tasks on my last day in the labs. The other two currently available are the Locate and Find tasks. They work similarly to the QueryTask, using the built-in support of the REST API to do their work. Neither of these tasks is currently bug free however so I was unable to satisfactorily test them.

Debugging

This leads me to the next thing I would like to go over, debugging your flex code. Here, especially when using native REST API calls, you can take serious advantage of the Services Explorer. This is typically located at http://serverName/ArcGIS/rest/services and from here you can view any of the MapServices setup for that server. You can also see what capabilities exist both for the service and each individual layer and even test them. The explorer also has links directly to the REST API documentation which can be invaluable.

The other priceless tool for debugging is an extension to Firefox called Firebug. Firebug allows you to see requests being made over your browser. You can then see the request, header, parameters, and the response. By right clicking on a request you can copy it and then paste it into your browser’s address bar and see the result in your browser. I was able to figure out several issues I had with the QueryTask by doing this and then manipulating the variables directly within my request. I wouldn’t recommend working with the Flex API without using Firebug or something similar.

Building an Extensible Framework

The original Flex API from ArcWebServices was built on a variation of OSGi www.osgi.org/ which is a dynamic module system originally created for Java. Using such a framework allows for seamless adding and removing of modules from an application without having to take it down. You can simply drop a new module into your framework on a server while the application is running and it will be discovered and its functionality made available.

Eclipse (the base application for Flex Builder) is built on top of the OSGi Spec. The basic idea is that each module you create must implement the IBundle and IBundleActivator interface. When a new module is discovered your application then casts it to an IBundleActivator, passing it a context (IBundleContext) and retrieves all of the services (IService) from the module. Now any other part of the application can find and use the services provided by this new module. There are several freely available OSGi frameworks. Knoplerfish ( http://www.knopflerfish.org/ ) and Felix ( http://felix.apache.org/ ) are two fairly uncomplicated and well known ones.

Transmitting Data

We also spent some time on the different ways to transmit data using Flex. There are three basic ways beyond Web Services which are available: Remote Objects, messaging, and data services. Adobe provides a free Blaze DS service which allows you to do the first two. If you want to do the third though, you’ll need to shell out $25,000 for the privilege. Each of these transmission types buy you something. Using remote objects allows you to transmit actual objects as binary over the wire, speeding things up considerably over the use of web services. Messaging allows clients to subscribe to a destination point on a server and then receive any messages that come from there. Data Services allows for things like ‘active rows’ where you are given and can manipulate a row from a database table that will automatically manipulate the row on the server and let other users of that row that it has changed. There are a lot of powerful uses I can think of for this last method which is probably why it is so expensive.

ESRI Holistic Lab: Flex API Day 2

2008-05-23T05:53:00.000-07:00

Day two for me consisted mainly of trying to get an extent QueryTask to work in order to do feature selections. I had already created a map service on my machine which exposed a set of utility data. My first task was to create a graphic to allow users to click and drag to create an extent for their selection. This was somewhat less straight forward than in the old ArcWebServices version of the Flex API as there is currently no easy way to draw an interactive extent on the map with no mouse handler interface and toolkits not yet implemented. One of the Flex API team members gave me a sample which got me jumpstarted however. In the end it was a case of simply hooking the mouse down, mouse move, and mouse up events. The tricky part was getting the extent rectangle to draw the way I wanted. I never really got it to look the way I wanted, but I did get it to work. The really nice thing about this is that using the new REST api available in 9.3 you can query on a layer with no custom web services. The query capability of the REST api is nicely wrapped up within the QueryTask object. I’ll not go into too many details about it because I don’t want to push the NDA I had to sign too far but the Task interface is going to make a lot of people happy, not to mention making their jobs easier when creating flex applications.

We also sat together as a group for a couple of hours in the morning and afternoon and talked about basic Flex programming dos and don’ts. Many of the following ideas come from the Cairngorm flex framework http://labs.adobe.com/wiki/index.php/Cairngorm

Code-behind

We started out by going over the basic GUI coding paradigm of code-behind and how it works in the Flex world. The best way to do this is to create your own Actionscript class, MyApp for instance, which has Application as a super class. You then create your base application mxml and have it subclass your MyApp Actionscript class. At this point you can put all of the code you need to run your application within its own actionscript class and keep it completely separated from the mxml gui tags. In order to access your gui items from your MyApp class you must declare a public variable within your class with the same name and type as the items within the mxml. So if you have a in mxml then you would need a public myLabel:Label declared within your MyApp to be able to access it.

The names that you give your objects now become very important because you will be coding the logic in a separate file from where the GUI is created. If you name your objects and event handlers poorly you will have trouble keeping up with what functions and items do what. Therefore it is good to not only give your objects meaningful names but to also follow a standard when naming your event handlers. Using the convention of objected_eventNameHandler() is the standard way of naming your event handlers and does a good job of concisely informing you on what it is (an event handler), what type of event it handles and for what object it does the handling.

Making use of Singletons

Cairngorm recommends creating a bindable singleton class which holds on to all of your application level information and allows any class to manipulate that class level data and always be sure that it is the correct version of the data. Making the class bindable also allows other classes to bind to these application level variables and be automatically updated when those values change. The Flex API team called this class the Model. We used a singleton class in our original Network Express prototype which definitely made life much easier but the one we were shown had a couple of advantages over the one we used previously. Chief among these was the ability to make sure that only one instance of the Model is ever created, and the ability to be certain there is only ever one instance of any given application level object.

The Flex Object Lifecycle

All objects which are created in the Flex world go through the same cycle when they are created. There are several events and functions which fire off that can be overloaded to allow you as the programmer to perform specific functions even before the CreationComplete event has fired.

New (Label) – the first step is the object instantiation is started.
PreInitialize – an event dispatched before any actual initialization takes place.
Setter – calls all Set functions
Initialize – another event dispatched to alert of actual initialization
CommitProperty – a function. Overriding this function will allow you to make changes to the object atomically, preventing flashes and other artifacts from occurring as properties are set.
CreateChildren – function which starts the Lifecycle on all children objects. This is another function which can be overridden.
Measure – Sets all of the width, height, etc.
UpdateDisplayList – function that adds the new object to the display list atomically.
CreationComplete – the final event which signals that the object is complete. This is called only once.

Simply knowing about this lifecycle opens a lot of possibilities, especially with the functions which can be overridden.

Tips:

1. Make sure to listen to the Load event on map objects as the CreationComplete event will fire well before any layers have actually been loaded. Trying to manipulate the map before the Load event will only cause you heartache, and errors. Each individual map layer will also fire a Load event.

2. Always call super on all overloaded functions. Failing to do so will keep the normal behavior from occurring.

For more information on the Flex lifecycle check out this document: http://livedocs.adobe.com/flex/2/docs/wwhelp/wwhimpl/common/html/wwhelp.htm?context=LiveDocs_Parts&file=00000492.html

Events

Let’s say you have an application with a VBox that contains a button. The display tree would look like: Application --> VBox --> Button. If you were too hook into the click event on this button then I’m sure you can guess that your function will be informed when the button is clicked. What you might not know however is that Every item in the display list starting at the top will receive a click event as well. This means that if you were to hook the click event on the VBox or the Application you would catch an event each time the button was clicked as well. So how does your function know if the event it catches was meant for it? The event object has target and currentTarget properties. The target property contains the id of the actual target of the event and the currentTarget property contains the id of the item in the display list currently receiving the event.

Events also have a phase. There are two event phases: capture and bubble. The capture phase occurs as the event is making its way down the display list looking for the target. If you need to cancel an event for some reason you would want to handle it during the capture phase. The bubble phase occurs on the way back up to the top of the display list. When a handler is added it will fire by default on the bubble phase. There is also a bubbles property on an event which is set to true by default.

Delegates and Unit Testing

During the afternoon of day 2 we sat down together and did a quick example application using Delegates which we then performed unit testing upon. Delegates take the idea of code-behind a step further. Once you have your mxml application and the code for it separated, you then perform all of the actual logic of your program via Commands. These commands are called by events in your code-behind which then in turn call their own Delegate classes which perform all of the actual work. The Commands are then in charge of making changes to application level data within your Model. Delegate classes are completely independent of the rest of your program, not caring how they are used as long as they receive their input in the correct form. The Delegates for your application can even be removed to separate swc libraries without causing any issues. This allows teams to break up tasks fairly easily and logically. One person can be in charge of creating the GUI for the application, another in charge of the code-behind application and commands, and yet another person or group can be in charge of creating the Delegates to actually perform the logic of the application.

Unit testing can be performed on Delegate classes very easily because they have well defined inputs and outputs. As long as a Delegate receives input in the correct format it doesn’t matter where it comes from. The unit testing framework we used was Flex Unit http://code.google.com/p/as3flexunitlib/ which is a free download and a very slick addition to your Flex environment which I highly recommend and plan to use myself.

Tips:

When your mxml application is compiled by the flex compiler it goes through several steps. First it is parsed into MXMLC and then it is translated into an actual actionscript (as3) file before being compiled into a swf. Now I know what you’re thinking, wouldn’t it be nice to see how flex natively converts all of those mxml tags into neat concise code? Well it turns out that you can. There is a compiler setting which allows you to tell the compiler to leave all of those as3 files behind instead of deleting them once it is finished, allowing you to learn all types of tips and tricks by seeing how the compiler creates all of that code.

Holistic Lab: Flex API Day 1

2008-05-21T06:52:00.000-07:00

Error Handling

This is obviously the first beta, and a closed beta at that, of the new Flex API so you expect a few rough edges. One of those is error handling. There are a few places where I would expect no error to be thrown but they are anyway, if a layer’s url property is set to an empty string then the next pan/zoom will throw an error, and a few places where you would like an error to be thrown to let you know something is wrong and it isn’t. The main place I can think of is when a tiling service fails you have no way of knowing this which caused some of the people here issues. I have no doubt these will be fixed going forward.

Authentication

There is no support currently for secured services. If you want to use one you must first add it to an mxd and then expose it as an unsecured map service in Arc Server. I did this with an IMS weather service and it worked just fine. This is something that will be added but hasn’t crept to the top of the development team’s list yet.

Slow/Dead Services

There are issues with services which are either slow to respond or have died. When a zoom occurs and a service doesn’t respond correctly the area on the screen which is coming from that service will behave weirdly, growing or shrinking out of proportion with the rest of the map. This caused a small set of data in Montgomery to eventually cover the entire South East US for me when I tested it by stopping the map service completely. In the case of extremely slow services this will eventually correct itself but it may take several minutes. This is something the team was working on fixing as the day progressed and may even now be dealt with.

Layering Services

Layering multiple services is now much smoother than it was with the old api. When you drop services on top of one another they now automatically leave the area not covered by their features transparent. This means that if I put a map service with gas mains on top of a service showing street data I can automatically see all of the data. This is a nice improvement from the past when you had to set transparency colors etc. to get this effect.

No More IMouseHandler!!

The IMouseHandler interface is gone with the wind. This made me sad mainly because we have created a number of mouse handlers to do various tasks for us. After talking it over with the development team however it seems there will be a new paradigm called Toolkits which will allow the same type of behavior along with (hopefully) even more flexibility...no pun intended.

TOC Control

One of the first tests I did was to recreate the table of contents control I had made with the old api. This is now much more straight forward. LayerInfo objects now come along with your layer when it is received from the rest api. This means you can immediately cycle through all of the layers, drop them in a VBox as checkboxes, and correctly check/uncheck them based upon the default visibility property. I was very pleased with the TOC control in both performance and ease of coding. The only issue that I saw was when switching the URL of my background layer there would be a flicker as the background turned momentarily white. I didn’t even notice it at first but when the Product Lead was watching me show the TOC control he commented on it. I’m not sure if this will get fixed to not redraw the background layer until the new source comes through but that would be a nice little adjustment.

Tips:

Use when debugging. Lots of useful information comes through here which can help you solve your issues.

Whenever you change the underlying map document for a map service be ready to also clear the REST cache. You can find the REST manager by going to http://servername/ArcGIS/rest/admin where the only option is currently to clear the cache or setup a schedule for it to be cleared. If you don’t do this and the api has already been used to get information on that map service then you will get some strange inconsistencies.

Traveling to the ESRI Holistic Lab

2008-05-19T19:52:00.000-07:00

I hate to start off this blog with an off topic post but I have to rant about this somewhere. I left Sunday morning at 6 am to head out to Redlands for the Flex API holistic lab this week. Everything went fine on the first leg. We arrived on time and I easily found my way to my next gate. Then the trouble started.

Let me start by saying this is the very first time I have ever attempted to fly American Airlines. I've flown many times with multiple airlines all over the states and over seas and nothing like this has ever happened before.

My 9:05 flight got delayed until 11 am and then canceled all together because of an apparent issue with one of the engines. Don't get me wrong, I'm glad they caught it, flying with a faulty engine is not my idea of a good time. From that point onward however things were just handled badly.

To begin with they lined all 300+ passengers up at the gate and had two people begin to reroute everyone. If those numbers don't seem bad enough already it took an average of ten minutes per passenger, and I was at the very back of the line. After about thirty five minutes someone from the airline came up and told us "if you will go to gate sixteen they have five people there that can help you". So the back thirty or so of us started the long walk to gate sixteen.

When we arrived fifteen minutes later to see the two people there staring off into space I was not pleased. We told one of the ladies what was going on and what we had been told and she told us we had to go out past security and go speak with the ticketing agents. Okay, not convenient but still faster than waiting in that other line. We all get outside and line up. There are five agents there but only three of them are willing to help us as the other two apparently had better things to do staring out into space.

After a few minutes I get my turn, I tell the lady what the issue is and she begins to help me. She tells me I can't go to my actual destination but I can go to an airport thirty miles away. That stinks but at least I can still make my destination. She puts me standby on the 11:45 flight and gets me a 'confirmed' ticket on the 3:15 flight which had my seat assignment and everything.

Now I went back through security, and rushed to the 11:45 gate to see if I have a chance, it was 11:05 when I got my ticket. When I make it to the gate they tell me that the boarding door was closed and so no new passengers may enter. That was a bummer but at least I had my ticket for the 3:15 flight. I bought some lunch, bought and read an entire magazine, and waited.

My 3:15 flight was delayed...of course. At 3:30 boarding began. Once they finally called my group I got in line and handed the attendant my boarding pass. He swiped it as I have seen many times before but this time something new happened: the scanner flashed red and beeped. I was pulled aside and asked to sit down while the other gate attendant tried to figure out the problem. Well it turns out the problem was that they had canceled my ticket! According to American Airlines I had left on the 1:45 flight to my original destination! The very flight I had been told was fully booked when I went out and talked to the ticket agent earlier in the day! So not only had my luggage gone with that flight but they had canceled my ticked for this flight, and they couldn't get me on it because it was full!!

After telling me he was sorry the gate agent booked me on a 10:15pm flight, still not to Ontario (my original destination) but to the 'close by' airport. He also can't actually issue me a ticket for it because according to their computers I already flew out of the airport. So I have to go back out to a ticketing agent again. Have I mentioned yet that I love American Airlines? So I go back out and go to get my ticket.

When I get there I let the lady at the counter know everything that has happened and what my current situation is regarding the fact that I'm actually still in the airport despite what the computer says. She managed to actually get me a confirmed ticket on a 4:55pm flight to the 'close by' airport, but it was already 4:05 at this point so I had to hurry. She also wasn't able to get me a seat assignment but assured me that they would give me one when I arrived. I ran to security, got threw there and then ran to the terminal train.

I managed to arrive at the gate as the last of the passengers were boarding and told the gate agent what the ticketing agent had said and handed her my ticket. She was not impressed. She told me that yes I was confirmed but I would have to wait until all of the other passengers were on before they could try to find me a seat. So I waited for fifteen minutes while they waited to see if anyone else would show up for the flight. Finally they actually printed me a boarding card and reluctantly allowed me to get on the plane. I hate American Airlines.

The flight went off without a hitch, as far as I know since I slept the entire time. After I got to the 'close by' airport I was told that it was a forty five minute drive when 'traffic is good'. I hopped on the super shuttle and a quick two hours later I was at the Ontario airport!

The only good thing I can say about the whole experience is that the airport actually managed to get my luggage to the hotel faster than me. The scariest part of the whole thing is that I still have the return trip to deal with. I won't even go into my issues with the rental car company here but it wasn't much better and was exactly what I needed to go along with all of my American Airlines fun.

Coming soon: The Flex API Holistic testing day 1 recap.