Archive

Archive for the ‘Flex development’ Category

Displaying elevation with Axiis – example

October 29th, 2009 admin No comments

Axiis is the open source data visualization framework Tom Gonzalez talked about at Adobe Max earlier this month. Watch his presentation here. At this session Tom announced the release of Beta 1.0 of the library which is built upon Flex 3.

I recently finished and deployed a complete rewrite of the map mashup RunningMap.com which uses Axiis to display elevation data in a line graph. After seeing his presentation 360|Flex last May I decided to give the (then alpha) Axiis framework a try. Upgrading to the Beta 1.0 release was painless and immediately I noticed the drawing performance of the graph went from slow(ish) (which actually was not a bad effect) to instantaneous.

Connecting my data source to the graph was a challenge and I had to use the debugger to get the data wrapped “just right”. I put together an example that illustrates:

  • use of Axiis LineSeriesGroup
  • wrapping an array collection “just right” so it can be bound as a data source
  • overlaying the graph on a map
  • setting the data tip using a function

The live example is here which is source view enabled.

Axiis line graph example

Categories: Flash development, Flex development Tags:

Setting dataprovider for Axiis line graph

August 28th, 2009 admin 1 comment

I am building a widget to show routes for Runningmap.com and thought I would give Axiis a try for the elevation graph. The examples show a couple techniques for connecting a cvs formatted or xml source file as the data source for the graph. Connecting my ArrayCollection of value objects stumped me however. Tom Gonzalez was kind enough to guide me to the solution which was to wrap the collection in just the right way so that Axiis could get at the data. The rest was, as I expected, magic.

Wrapping the collection looked like this:

Actionscript:
  1. protected function handleNewMapData(p_evt:Event):void{
  2. var wrapper:Object = new Object();
  3. wrapper.plots = model.routePoints;
  4. var dataCollection:ArrayCollection = new ArrayCollection();
  5. dataCollection.addItem(wrapper);
  6. dataProvider = dataCollection;
  7. dc.invalidateDisplayList();
  8. }

Then set the "plotCollection" and "dataField" properties in the LineSeriesGroup:

Actionscript:
  1. <axiis:DataCanvas
  2.     width="90%"
  3.     height="50"
  4.     y="15"
  5.     id="dc"
  6.     horizontalCenter="0">
  7.     <axiis:layouts>
  8.         <groupings:LineSeriesGroup
  9.             verticalScale="{vScale}"
  10.             id="myLineGroup"
  11.             x="0"
  12.             y="0"
  13.             height="{dc.height}"
  14.             width="{dc.width-10}"
  15.             plotCollection="plots"
  16.             dataProvider = "{dataProvider}"
  17.             dataField="elevation"
  18.             />
  19.     </axiis:layouts>
  20. </axiis:DataCanvas>

And here it is:

Map did not load
Categories: Flex development, Runningmap Tags:

AS3 casting String to Number?

July 6th, 2009 Randy 1 comment

Converting FlashVars parameters to properties is an example where you are forced to deal with strings and sometimes these values need to be numbers. I have been annoyed with with my own inconsistencies with how I test to see if the FlashVar casts correctly or should be rejected (because it had a character other than a number in the string). I was discovering that some techniques were giving false negatives. So I spent some time of trying to establish a best practice.

I considered these four techniques for casting a string to a Number:

  1. parseInt("1234");
  2. new Number("1234");
  3. "1234" as Number;
  4. Number("1234");

Below is the AS3 code and the trace results which I used to base my conclusions here.

Results:
Using "as Number" to cast a string to a Number looks like bad news to me. All other techniques preformed as expected. Casting a string such as "foo" using "as Number" to cast is to a strongly typed variable results with a false value when isNaN() is applied to it. This is the false negative I mentioned before. Even casting the string "1337" using "as Number" results in the value 0 which not only fails the falsies ternary test but is wrong.

Conclusions

  • don't use "as Number" to cast a string to a Number.
  • Using a "falsies ternary test" is not a great approach for string to number validation since "0" is a valid number and will correctly fail this test. Maybe that works well for your logic anyhow.

Discussion
Casting is perhaps the wrong term since I am converting a primitive to an object which isn't true polymorphism, but perhaps string is being treated as an object.

I talked to Ryan Frishberg at the recent 360|Flex in Indianapolis about this. Ryan works on the Flex SDK team at Adobe. He said that "new Number('foo')" make use of conversion methods that are not available to the technique "'foo' as Number" which will evaluate to null since this casting is not possible. String can't be a Number. Ok, that is the d'oh moment for me. Should know better.

It's problematic though, because it fails to report a run-time or compile-time error.

Actionscript:
  1. var n1a:Number = parseInt("foo");
  2. var n2a:Number = new Number("foo");
  3. var n3a:Number = "foo" as Number;
  4. var n4a:Number = Number("foo");
  5.  
  6. var n1b = parseInt("foo");
  7. var n2b = new Number("foo");
  8. var n3b = "foo" as Number;
  9. var n4b = Number("foo");
  10.  
  11. var n1c:Number = parseInt("1337");
  12. var n2c:Number = new Number("1337");
  13. var n3c:Number = "1337" as Number;
  14. var n4c:Number = Number("1337");
  15.  
  16. trace (".............. strong typed 'foo'");
  17. trace ("n1a: " + n1a);
  18. trace ("n2a: " + n2a);
  19. trace ("n3a: " + n3a);
  20. trace ("n4a: " + n4a);
  21. trace (".............. not strong typed 'foo'");
  22. trace ("n1b: " + n1b);
  23. trace ("n2b: " + n2b);
  24. trace ("n3b: " + n3b);
  25. trace ("n4b: " + n4b);
  26. trace (".............. Strong typed '1337'");
  27. trace ("n1c: " + n1c);
  28. trace ("n2c: " + n2c);
  29. trace ("n3c: " + n3c);
  30. trace ("n4c: " + n4c);
  31. trace (".............. isNaN n1");
  32. trace ("n1a: " + isNaN(n1a));
  33. trace ("n1b: " + isNaN(n1b));
  34. trace ("n1c: " + isNaN(n1c));
  35.  
  36. trace (".............. isNaN n2");
  37. trace ("n2a: " + isNaN(n2a));
  38. trace ("n2b: " + isNaN(n2b));
  39. trace ("n2c: " + isNaN(n2c));
  40.  
  41. trace (".............. isNaN n3");
  42. trace ("n3a: " + isNaN(n3a));
  43. trace ("n3b: " + isNaN(n3b));
  44. trace ("n3c: " + isNaN(n3c));
  45.  
  46. trace (".............. isNaN n4");
  47. trace ("n4a: " + isNaN(n4a));
  48. trace ("n4b: " + isNaN(n4b));
  49. trace ("n4c: " + isNaN(n4c));
  50.  
  51. trace (".............. falsies ternary test");
  52. (n1a)?trace("n1a: true"):trace("n1a: false");
  53. (n2a)?trace("n2a: true"):trace("n2a: false");
  54. (n3a)?trace("n3a: true"):trace("n3a: false");
  55. (n4a)?trace("n4a: true"):trace("n4a: false");
  56.  
  57. (n1b)?trace("n1b: true"):trace("n1b: false");
  58. (n2b)?trace("n2b: true"):trace("n2b: false");
  59. (n3b)?trace("n3b: true"):trace("n3b: false");
  60. (n4b)?trace("n4b: true"):trace("n4b: false");
  61.  
  62. (n1c)?trace("n1c: true"):trace("n1c: false");
  63. (n2c)?trace("n2c: true"):trace("n2c: false");
  64. (n3c)?trace("n3c: true"):trace("n3c: false");
  65. (n4c)?trace("n4c: true"):trace("n4c: false");

CODE:
  1. .............. strong typed 'foo'
  2. n1a: NaN
  3. n2a: NaN
  4. n3a: 0         //unexpected
  5. n4a: NaN
  6. .............. not strong typed 'foo'
  7. n1b: NaN
  8. n2b: NaN
  9. n3b: null    //unexpected
  10. n4b: NaN
  11. .............. Strong typed '1337'
  12. n1c: 1337
  13. n2c: 1337
  14. n3c: 0        //unexpected
  15. n4c: 1337
  16. .............. isNaN test
  17. n1a: true
  18. n2a: true
  19. n3a: false    //unexpected
  20. n4a: true
  21. n1b: true
  22. n2b: true
  23. n3b: false    //unexpected
  24. n4b: true
  25. n1c: false
  26. n2c: false
  27. n3c: false
  28. n4c: false
  29. .............. falsies ternary test
  30. n1a: false
  31. n2a: false
  32. n3a: false
  33. n4a: false
  34. n1b: false
  35. n2b: false
  36. n3b: false
  37. n4b: false
  38. n1c: true
  39. n2c: true
  40. n3c: false    //unexpected
  41. n4c: true

Categories: Flash development, Flex development Tags:

Encryption and licensing with Nitro-LM

May 27th, 2009 Randy 1 comment

I recently attended a 3-day "entrepreneur bootcamp" where angel investors taught how to pitch an idea to angel investors for investment capital. One of the first things they will want to know is how you protect your intellectual property. In the case of software, protection of algorithms is key and in the case of Flex your software secrets are protected from a right click "view source" since the application is contained within a compiled swf. Tools are available, however, that allow you to easily decompile the swf and look at the goodies inside.

Simplified Logic Inc has a product that uses a private key encryption method that stops decompilation of the swf. They also have developed a backend system that can manage licenses to your application. I have been developing a Flex application for use in teaching anatomy to students at the technical institute I work at. It has proven to be a powerful tool and there is opportunity to license this application to other institutions, but there is no infrastructure to do this. I have built a proof of concept using Nitro-LM to show that we can deploy this application on the web using a Software as a Service model without creating much of a deployment infrastructure on our end beyond what we already have in place.

The NitroAdmin AIR app is used to set up and manage the encryption and licenses. Videos and examples show how to integrate the system into your Flex app but I think they need to do a bit more work around this ... perhaps a "wizard" or video that shows from start to finish the basic setup. It still took a bit of handholding to get me up and running (thanks Andrew). The proof of concept is doing its job of proving this works in a way that is unobtrusive to users. Now all that is left is the easy part: to build a business model around my application and then go out and sell it. That is someone else's job.

Simplified Logic was a major sponsor of the recent 360 Flex conference in Indianapolis. I want to say thanks to them for supporting this event. It was a good one and I enjoyed the environs.

Categories: Flash development, Flex development Tags:

360 Flex Indy was outstanding

May 20th, 2009 Randy 1 comment

The conference in Indianapolis was fantastic and the sponge is full. Met so many fellow developers. Was accused of stalking Adobe employees, but I only said hi to Matt Chotin once. So much to experiment with. FlexUnit 4 is important. Degrafa looks compelling. Will definitely look into Axiis data visualization library. I am intrigued by Maté as a framework. OpenFlux ... Yes!!!! ESRI has a new free mapping API ... BAM. Lazy loading datagrid using cacheing and synchronization (props to Zach Pinter) ... I need that. According to Jeff Tapper's 7 golden rules of how not to code in Flex, I should have been fired 7 times. RSL's! RSLs! RSLs! But my favorite session was by Doug McCune. He talked about stuff that re-inspired him as a developer.

This slide is about how Flex application development became a job, and nothing much more than that.

Doug McCune at 360flex Indy

Doug's live demo on head tracking in Flash. He showed an application that can be used for "Safe Sexting". You can do whatever you want on the video and your face will be tracked and blurred. Big laughs on this one.

IMG_0042

Doug had a unique take on how to push the concept of Augmented Reality. He gave himself boobs in this live demo.

IMG_0044

Categories: Flex development Tags:

Watching trace statements when running Flash content in the browser

April 2nd, 2009 Randy 2 comments

As Flash and Flex applications get more complex the ability to watch trace statements while running the application in a browser is invaluable. This is how I do it (in OSX):

1) find your mm.cfg file. Mine is located here: ~username/mm.cfg (substitute "username" with your real username)

2) open it in a text editor and add these lines:

CODE:
  1. ErrorReportingEnable=1
  2. TraceOutputFileEnable=1
  3. MaxWarnings=0

3) open a terminal window and add this to your .profile file.

CODE:
  1. alias trace=tail\ -f\ "/Users/username/Library/Preferences/Macromedia/Flash\ Player/Logs/flashLog.txt"

To watch your browser throw trace statements, just open a terminal window and type "trace" and they will now appear in the terminal window.

Sorting XMLListCollection and case sensitivity

February 23rd, 2009 Randy No comments

Consider this xml:

Actionscript:
  1. var myImageXML:XML =
  2.     <image>
  3.         <term text="New Term 498"/>
  4.         <term text="a new term 550"/>
  5.         <term text="a new term"/>
  6.         <term text="New Term 668"/>
  7.      </image>

You can create an xmlListCollection and then sort the collection based on the term text.

Actionscript:
  1. import mx.collections.SortField;
  2. import mx.collections.Sort;
  3.            
  4. var terms:XMLListCollection = new XMLListCollection(myImageXML..term);
  5. var sort:Sort = new Sort();
  6. var sortField:SortField = new SortField("@text");
  7. sort.fields = [sortField];
  8. terms.sort = sort;
  9. terms.refresh();

What threw me for a loop was the sort result (by term text value):

New Term 498
New Term 668
a new term
a new term 550

As it turns out the default value for the sort case insensitivity is false. To solve this, set the property in the SortField object:

Actionscript:
  1. sortField.caseInsensitive = true;

and the sort will happen as expected:

a new term
a new term 550
New Term 498
New Term 668

Categories: Flex development Tags: , , ,

E4X and namespaces

December 9th, 2008 Randy No comments

Recently I struggled with trying to figure out why I could not traverse loaded XML data using E4X. In one case it was a RSS feed and in another it was Timed Text data. What these data sets have in common is that they declare name spaces. Consider this xml data:

XML:
  1. <tt aaa:lang="en" xmlns="http://www.w3.org/2006/04/ttaf1" xmlns:tts="http://www.w3.org/2006/04/ttaf1#styling" xmlns:aaa="http://www.w3.org/XML/1998/namespace">
  2.   <head>
  3.     <styling>
  4.       <style id="1" tts:textAlign="right"/>
  5.       <style id="2" tts:color="transparent"/>
  6.       <style id="3" style="2" tts:backgroundColor="white"/>
  7.       <style id="4" style="2 3" tts:fontSize="20"/>
  8.     </styling>
  9.   </head>
  10.   <body>
  11.     <div aaa:lang="en">
  12.       <p begin="00:00:00.25" dur="00:00:03.25">Dreamweaver users now have access to Flash video. Didn't have it before.</p>
  13.       <p begin="00:00:04.20" dur="00:00:03.07">And if you were to talk to a Dreamweaver user about three or four years ago</p>
  14.     </div>
  15.   </body>
  16. </tt>

I see that it declares a couple namespaces but I thought since the "p" nodes do not. This ...

Actionscript:
  1. trace(timedTextXML..p);

yields nothing. Yet this ...

Actionscript:
  1. if (timedTextXML.namespace("") != undefined){
  2.       default xml namespace = timedTextXML.namespace("");
  3. }
  4. trace(timedTextXML..p);

works fine.

Categories: Flash development, Flex development Tags:

Adobe Max 2008

November 29th, 2008 flickr No comments


It has been a little over a week since we got back from San Francisco and the MAX conference. It has taken me this long to surface for air after getting caught up from being away. Adobe announced a dizzying amount of updates and initiatives. Serge Jespers has a list of most of them here: http://www.webkitchen.be/2008/11/22/weekly-blend-the-max-edition/. Let's just say that it will be a while before I can digest all of this.

The picture above (taken by Charles Freedman) shows the massive display that was set up for the keynotes. I have never seen anything like it before. When I walked into the hall, Icky Thump by White Stripes was playing through the incredible sound system and I could feel the thumps on my chest. I had goosebumps.

All Access to MAX

Read more...

Categories: Flash development, Flex development Tags:

Mark Logic 4.0 Geospacial Range Demo

November 1st, 2008 Randy No comments

Mark Logic tells me that anyone who cares about free text analytics will be very interested in this visualization, because it previously was not available in any product. The keyword here being Real-Time. A geospatial analysis of documents returned from a free text search, plotted in arbitrary geographic bounding boxes, calculated in real-time. No other product can do this is real-time. Try out the demo..

When the initial heatmap is displayed you can hold the ctrl/cmd button down and either click on a "bucket" or click-drag to zoom in on an area and have new buckets calculated.

This widget was part of the recent MarkLogic Server 4.0 release.

My role was that of Flex developer of the map visualization. Craig Schlegelmilch directed the project and wrote the middleware integration using Xquery. Owen Brierley wrote the javascript (html controls are continually updated with search results). Tanya Camp provided graphic design consultation. Craig and Tanya form the dynamic company Bucketduck Inc. and the overall project is a production of GystWorks.

Mark Logic 4.0 Geospacial Range Demo

Categories: Flash development, Flex development Tags:
Download Full Movie Online Street Kings download movie Behind Enemy Lines II: Axis of Evil download movie The Station Agent download movie Sister Act 2: Back in the Habit download movie Reversible Errors download movie Retrograde download movie Sister Act download movie Radio download movie Prince Valiant download movie Play dead download movie Cry for help download movie Witchboard download movie Conan the barbarian download movie Fire down below download movie Dadnapped download movie Groundhog day download movie