Reading .sol (SharedObjects) created by Browser Flex App in a new AIR Application - Seamless integration? Web & Desktop?

    One of the requirements was to provide seamless integration between the browser flex application serving the client needs when the network is on vs an AIR Application as an offline system when the network turns off. But the requirement isnt straight as you think. What it says is, When network is connected the end user will be using flex browser application by navigating to the URL which downloads a lot of data on to the client machine from the server which periodically gets updated based on the data-change on the server. This is stored as client side SharedObjects through the browser ran flex app. Now when the network turns off, the end user would launch the offline system that should read through earlier created sharedobjects while network was on and work through it. AIR App should also be able to write a shared object containing data required to be parsed through the browser flex app when launched (when network is back)...

    This kind of sounds so wierd to me. After hearing the requirement, i was like WHAT?? But then i started to see through different ways of achieving it. With Browser Sandbox Security, browser flex app always can get hold of SO (Shared objects) created through SharedObject.getLocal(). Even if we were to understand and agree to one common location that AIR Could understandably read, keeping the location parameter excluded for a whole lot of argument... The Important thing is to consider serialize and de-serialize a FileStream read ByteArray into AS Objects that can be natively used in the code. Well, more to that is the SharedObjects written through the browser flex app could also carry complex data structures which could carry more information rather than a simple data->name/value

   While doing the research, i went through a lot of google search - .minerva was exactly doing what i was looking for but its not open to go through the bits of it and tweak to get it working !!

• Link to AMF 3 Specification document
• Format of a Shared Object
• Open Source Flash
• Storing Custom AMF Objects for AIR App Storage

• Reading ByteArrays either from Web or AIR app (I couldnt connect through it well)

• Reading and Writing a ByteArray - Flex Docs (on zip file formats) & also here
• AIR App Named .minerva (this is exactly what i was intending to do, but after installing .minerva i didnt open up some of my other .sol files even though they were good)
• Link to AMF-PHP Open Source porting link

• Persistence Storage with .SOL (shared objects), a just like that content.

• SharedObject API doc
• AMF Serializer/deserializer for java/flex - Google Code
• Granite DS (what they claim is alternative to LCDS)

Here is a sample code demoing the problem:

 

Browser Flex App creates a shared object (typed ClazzTest.as containing two public variables value1 and value2 of type string)

<?xml version="1.0" encoding="utf-8"?> <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute"> <mx:Script> <![CDATA[ import com.arun.ClazzTest; import flash.net.registerClassAlias; private function generateWebFlexSharedObjects():void { var clazzTest:ClazzTest = new ClazzTest(); clazzTest.value1 = 'Value1'; clazzTest.value2 = 'Value2'; registerClassAlias('com.arun.ClazzTest',ClazzTest); var so:SharedObject = SharedObject.getLocal("cachename"); var b:ByteArray = new ByteArray(); b.objectEncoding = ObjectEncoding.AMF3; b.writeObject(clazzTest); so.data.clazzTest = clazzTest; so.flush(); } ]]> </mx:Script> <mx:Button label="Generate SO" click="generateWebFlexSharedObjects()"/> </mx:Application>

AIR App code that tries to read the shared object created by the browser flex app above.. (for now assume that the object location is hardcoded)

<?xml version="1.0" encoding="utf-8"?> <mx:WindowedApplication xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" width="500" height="422"> <mx:Script> <![CDATA[ import flash.utils.getQualifiedClassName; import flash.utils.describeType; import mx.controls.Alert; import mx.utils.ObjectUtil; private function readBrowserFlexCache():void { var path:String = "C:\\Documents and Settings\\amadas\\Application Data\\Macromedia\\Flash Player\\#SharedObjects\\5RP3MMUQ\\#localhost\\BrowserFlexSharedObjects\\bin-debug\\BrowserFlexSharedObjects.swf\\cachename.sol"; var solFile:File = new File(path); txtOutput.htmlText = 'File Exists ? ' + solFile.exists + '\n'; var fileStream:FileStream = new FileStream(); fileStream.openAsync(solFile, FileMode.READ); txtOutput.htmlText += 'File Bytes Available : ' + fileStream.bytesAvailable + '\n'; var bytes:ByteArray = new ByteArray(); fileStream.readBytes(bytes, 0, fileStream.bytesAvailable); txtOutput.htmlText += 'Bytes Read = ' + bytes.bytesAvailable; bytes.objectEncoding = ObjectEncoding.AMF3; //trace(describeType(bytes.readObject()).toXMLString()); //var objInfo:Object = ObjectUtil.getClassInfo(bytes); var obj:Object = bytes.readObject(); //trace(getQualifiedClassName(obj)); if(obj != null) { Alert.show('Object retrieved !! '); } fileStream.close(); } ]]> </mx:Script> <mx:Button label="Read SO" click="readBrowserFlexCache()" x="23" y="30" width="146"/> <mx:TextArea x="23" y="80" width="452" height="259" id="txtOutput"/> </mx:WindowedApplication>

The above AIR App code doesnt work. Its just the way i wish it would. But i believe we need to go through the entire signature of SharedObject and read the bytestream in the way SharedObject is defined as an entirety like header, body etc. I just looked at the Serializer and Deserializer in AMF-PHP and that just gives me some idea. Trying to do this entirely might take a long time than to get it just working quickly... I am still on a hunt !! ------------------------------------------ If someone is looking out for a quick solution where in you wont have enough time to write an AMF object parser, you can follow my quick solution. We lowered the IE settings to allow scripting, there by i invoke a javascript function which writes the data to the flat xml file in the client machine from the flex application through ActiveXObject(), and these flat .xml files are read by the AIR app later on. Atleast this seems to work fine for me until i converge on a right solution !!

Flashplayer ScriptTimeOutError, A Script has executed longer than 15 seconds

While doing Load testing of the flex application we've developed, we hit upon this scenario where our test load data was so huge that optimizing DB queries, webservice logic, client logic took us more than 60 seconds which is the maximum timeout limit Flashplayer can be increased to.

To find a solution to the problem, I have googled around and found some interesting articles.

• Arno Van Oordt (Joy with script timeout period),
• flex coders emailing list archives, and more,
• some other forums,
• Tallest on switchonthecode
• Flash Player API for ScriptTimeOutError
• etc..

When the load data is so huge, and you are tired of optimizing code just to fit in the 60 seconds time intervel before the timeout error is thrown by flash player... I tried to workaround it with a solution that will run for enough time without freezing / breaking your load data...

Here is the sample Flex code that would throw the Flashplayer script timeout error.

<?xml version="1.0" encoding="utf-8"?> <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute"> <mx:Script> <![CDATA[ private var i:Number = 0; private function startInfinite():void { while(++i > 0) { //txtArea.htmlText = i + '\n'; } } ]]> </mx:Script> <mx:VBox> <mx:Button label="hang me" click="startInfinite()" /> <mx:TextArea id="txtArea" /> </mx:VBox> </mx:Application>

Error message -

My Solution to this problem is to workaround by giving flashplayer a breathing time. This is however not a full-fledged code but would completely give you an idea on what i am trying to achieve. The below code would run a timer for say 100 milli-seconds and execute your piece of code which you think is consuming more time... say if you are iterating over 10,000 items with a lot of data or something similar... This solution would run a timer and call it over and over until your job execution is done, when you delete the listener and proceed further with your logic. This way flashplayer break due to heavy load is taken care of. Flash player would get a breathing time to perform any UI operations if any meanwhile. In my actual code at work, i display a popup modal window before the timeconsuming operation begins that displays - "Please wait, while we are processing the data", and i remove the modal dialog once the entire process is done. This way end user feels that he has a feedback from the app and even if it were to take a bit more time, this solution will scale for you even if your load were to increase in more numbers...

See the Solution here (Iterating based on a timer until execution is complete)...

<?xml version="1.0" encoding="utf-8"?> <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute"> <mx:Script> <![CDATA[ private var i:Number=0; private var mytimer:Timer=new Timer(100); private var isCodeRunning:Boolean=true; private var testIterateCount:Number = 0; private function timeBasedLoading():void { isCodeRunning=false; mytimer.addEventListener(TimerEvent.TIMER, startInfinite, false, 0, true); mytimer.start(); } private function startInfinite(event:TimerEvent):void { try { if (!isCodeRunning) { isCodeRunning=true; while (++i > 0) { //txtArea.htmlText = i + '\n'; } } } catch (e:ScriptTimeoutError) { isCodeRunning=false; //trace(e); // ScriptTimeoutError: Error #1502: A script has executed for longer // than 15 seconds testIterateCount++; //Arun:Break your logic after 5 iterations, //just a test... if(testIterateCount==5) { mytimer.stop(); mytimer.removeEventListener(TimerEvent.TIMER, startInfinite); } txtArea.htmlText+=i + '\n'; } } ]]> </mx:Script> <mx:VBox> <mx:Button label="hang me" click="timeBasedLoading()"/> <mx:TextArea id="txtArea"/> </mx:VBox> </mx:Application>

First Look at Flash Builder 4 (Beta1)

I wanted to list down my first feel of launch of FlashBuilder4-Beta1 and how it made different from FlexBuilder3. This post is not intended to list down all the differences between FlexBuilder4Beta1 and FlashBuilder3 but however, it is only intended to get the FIRST FEEL DIFFERENCE of your regular FlexBuilder3 and FlashBuilder4 Beta1

Name Change of FlexBuilder perspective to Flash - (Flash vs Flex Development, Flash Debug vs Flex Debugger, Flex Profiling vs Flash Profile)

New Start Page

First thing, you do is to right click on the Package Explorer and create a new project. As you rightclick you see new entry "Execute FlexUnit Tests". FlexUnit integrated into flex builder... New->Test Case Class, New-> Suite Class are also new entries.

New Panels - Data/Services, Network Monitor...

New Data-Connect wizards...

Blaze DS (integrated option)

Fx icon changed to f with new Flex 4 libraries

New Enhanced Package Explorer, Shows package view, Flex4 lib....

 AS Doc as soon as you try to open up type on the tag name through the code hinting dialog. ASDoc panel which shows docs. Its one of the best features that has been missing for a long time (ofcourse driven from java perspective - eclipse)

<mx:script> changed to <fx:script>

Auto-Generation of event handlers from within flex builder...auto-generated click event handler for the button..

AsDoc comment....

and a lot more....

Installing FlashBuilder4 Beta1 (Earlier FlexBuilder)

Step by Step - Installing Flash Builder Beta 1 (Earlier Flex Builder)

 

 

Flex SDK 4, Flash Builder 4, Flash Catalyst (earlier Thermo) - Beta1 Launch

     Well, old news first - Flex SDK 4, Flash Builder 4 (Earlier Flex Builder 3) and Flash Catalyst (Earlier called Thermo) are now available on labs.adobe.com for BETA1. I've atleast waited for this release since long. With Flash Catalyst, Adobe brings a lot to the community in terms of new roles - Flex Designer, Sr. Flex Designer, Flex Designer - Architect etc. - new opportunities adding new jobs to the market sunk in recession and above all, it takes Flex/Flash to a whole new dimension enchanting that no two applications in the market should look alike with the default halo theme... Explore the richness of each application, design appealing UIs that make your application uniquely shiny, and extra-ordinary... A lot is already said about already about whats new and all... some of them i came across are - sujit, tim buntel , matt chotin, whats new flex 4 - dev specs with examples, sean moore etc.