Better late than never, right? Figured its high time I posted my slides from my 360MAX presentation “Continuous Build Systems: Start to Finish”. This was a severely live demo heavy presentation so there is a lot of information that doesn’t ride on the slides – but don’t worry because I’ll be making a screencast including all the examples I covered.
Occasionally I do leave my comfy Flex Builder IDE and venture into less code-friendly waters…mainly the Flash IDE itself. CS4 has a slew of new features for docking and collapsing windows but writing code is still quite difficult. Of course there is the existence of FlashDevelop and the potential to write pure AS3 projects in Flex Builder, but those can hardly replace the Flash IDE when it comes to timeline animation. Flash CS4 ships with a workspace named “Coder” which unfortunately doesn’t show nearly enough of the script to be useful. I took some time the other day to create a custom workspace I appropriately titled “Devsigner”. It makes life a little easier for those of us who need to write code in Flash CS4 by giving you a big script window, and enough of a stage window to arrange things when needed. You can also use F4 to hide all panels and show a fullscreen stage if need be.
Here’s a shot of the layout.
And here’s the layout file.
Devsigner.zip
Once extracted its just a plain XML file that needs to be dropped in your “Workspaces” folder in the Flash CS4 Configuration directory. See below for OS specific locations.
Mac: /[USER]/Library/Application Support/Adobe/Flash CS4/en/Configuration/Workspace
Windows: \Documents and Settings\[USER]\Local Settings\Application Data\Adobe\Flash CS4\Configuration\Workspace
The Flex 4 SDK is an ever evolving thing, and the SDK team announced not too long ago that some not so trivial architectural changes still needed to happen in order for the old mx components and the new spark components could co-exist peacefully. The recent open iteration meeting showed that these measures are well underway. That being said, for those of you trying to keep on the up and up, cutting your teeth on the version of the SDK that comes with Flash Builder 4 by default can potentially lead you down a path no longer traveled. In basic terms, things are changing fairly rapidly in the SDK so unless you want to get left in the dust you need to be keeping an eye on the way things are changing. The best way to do this of course is to check-out the the bleeding edge SDK source direct from Subversion and configure Flash Builder 4 to use it in your sample projects.
The first thing you need to do is grab the SDK source. The means to do so is pretty clearly documented here at the Adobe Open Source Site
Once you have the edge build checked out, there’s one step that you need to complete before you point Flash Builder 4 at your new SDK. The open source SDK doesn’t include the java MXMLC libs that Eclipse needs to compile your project. You’ll need to find these in the Flex 4 SDK folder that ships with Flash Builder, which is in the application directory under the “sdk” folder.
Now copy these to the “libs” folder in your new SDK. Note that your Subversion client will see these as new files in the check-out but this won’t prevent you from updating the SDK.
Now back in Flash Builder, highlight your project, right click and select “Properties” and then go down to the “Flex Compiler” screen.
Then click the button at the top right of this screen that says “Configure Flex SDK’s”
Now you’ll just add a new SDK, name it “Bleeding Edge Flex4 SDK” or something similar, and point it at the edge SDK that you recently checked out.
Now you’re done! Just don’t forget to update the project properties on your existing projects so that they point to your new edge build.
This is from an open discussion with Lee Brimlow a few days back.
For some time I’ve been complaining about the lack of some very critical features in AIR that would make it a contender against “real” desktop development frameworks (Coccoa, .Net, Python etc). He couldn’t spill the details, but at least one of these will be an AIR 2.0 feature. I’m glad to see that Adobe is thinking the same things I am.
Back on the 27th of July my Twitter account was compromised. Twitter, as massive as it now is, is inevitably subject to countless brute force dictionary attacks. Just my luck, someone managed to gain access to my account and began to post advertisements. Apparently they had posted the exact same thing on a great number of accounts that they had taken control of. Being that I’m always connected to the internet through some means it didn’t take me long to realize what had happened and I immediately changed the password on the account. The damage was minimal and I resumed normal Twitter activities for the next to days until I received a message from Twitter:
“Your account was suspended for cross-posting duplicate tweets across multiple accounts, a violation of our terms of service and the Twitter Rules that we take very seriously. Your account will remain suspended for a minimum of one week; you may petition for reinstatement on or after August 5, 2009.”
Mind you, this was two entire days later. I actually got three duplicates of this email, which was indicative of their poor support system even though I didn’t know it at the time. I contacted support making a case that my account was compromised and that I was development community memeber who has been using Twitter since it 2006 when it was called Twittr. I never heard back. In fact I double checked on my requests into the “ZenDesk” ticketing system only to see that they had already been marked as resolved and closed without so much as a comment or any actual resolution. I then tried to issue a number of additional support tickets and realized that they AUTOMATICALLY marked themselves as resolved the moment you submit them. Through some miracle I was able to get an open ticket into the system and it has been pending assignment to an operator for ten days now.
Case and point, Twitter support is a complete joke. The more I read about and mistaken mass suspensions, support issues, and consider your bad track record for downtime the more I wonder about whether Twitter will be able to make the shift into an actual revenue generating company. Currently it isn’t able to sustain its own service. This should be a very disheartening prospect for bandwagon venture capitalists who are funneling big dollars into the Twitter for its trending potential. I wonder if the VC’s who are giving TweetDeck 3.2mil for continued development, or any of the other Twitter apps that are being mysteriously funded, are aware of the shaky foundation their livelihood rests upon.
Twitter, you’ve managed to creative perhaps the biggest social media platform to succeed instant messaging: get your shit together. As with the saturation of your service you have accepted the responsibility to make it stable and supported. History makes quick work of social media sites that explode on the scene and are poorly maintained. Consider the failures of Myspace and the ultimately victorious Facebook. Remember how great life was for Yahoo before Google? Be careful that you aren’t laying the foundation for your replacement. And VC’s, start looking for the new Twitter now.
For the most part people don’t really think too hard about passing arguments into a function in AS3. There isn’t any funny business like you would find low level languages like C++ where you have to manually specify whether that argument is an address, reference, or a bit-wise copy of what is being passed in. This is really a good thing because the less manual memory management you do in a language the less likely you are to creative gaping memory leaks in a project. However, there comes a time when you really need to do a bit-wise copy of an object in order to get a completely fresh copy. In the ActionScript realm I hear this often referred to as a “Deep Copy”. In any event, here’s a scenario and the subsequent solution.
You have a DataGrid that is binding to an ArrayCollection. You want to pass a select set of those items on to a command. In some cases the command doesn’t need to massage the data any further and perhaps does something as simple as sending it off to a remote service method to be stored in a database. However, assume that command is a “Duplicate” command that takes a set of items and saves them back to the disk. Once you pass the selected items in you want to append the string “_Duplicate” at the end so as to not confused these with the original instance. This is where the issue comes in. Since the default argument behavior in AS3 is pass by reference when you append “_Duplicate” it will append it back to the original item that your DataGrid is binding to and you will see “MyItem_Duplicate” in the list.
In this case what you want to do is send a new copy of the selected items that bear no relation to the original DataProvider so that they can be edited and written back to the disk. How do you do this you ask?
There just so happens to be a utility just for this sort of thing called ObjectUtil (mx.utils.ObjectUtil). So to get a fresh copy of your object in question do this:
var freshCopy:ArrayCollection = ArrayCollection( ObjectUtil.clone(dataProvider) );
Now you’re free to change this collection however you want and leave the original collection in tact. Where our Duplicate command is concerned we can now edit the names to append “_Duplicate” and write them back the disk without contaminating our original objects or having the controls that bind to them display the undesired changes as we make them.
Some marketing videos of the project I’ve been working on for the last 7 months have recently been upload to YouTube so I guess its officially safe for me to share this with the public.
So what is it? A project is called AdArchitect built for PointRoll. It’s an AIR application that severely simplifies the creation of rich media advertisements. Pretty ground breaking stuff if you’re a media agency.
Here’s the videos:
Build a Rich Media Creative using AdArchitect's CreativeManager
Build a Custom Demo Page using AdArchitect's Creative Manager
(Yes, I know. Internet ads aren’t always the most popular thing, but don’t let try and keep opinions to a minimum here)
It’s Official. I’ll be giving a talk at Adobe MAX 2009 entitled:
“Creating Workflow tools for the Flash IDE”.
October 6 at 01:30PM
This should actually read “Creating Flex Based Workflow tools for the Flash IDE”, but that bit got lost in translation somehow. The session will cover using Flex to extend the Flash IDE in the form of Flex applications running custom panel windows. If you were to look at Flash panels over the years they’re typically built purely in Flash using a very limited Flash component set. Worst of all, they don’t have a liquid layout. Of course Flex has layout management, but the framework also makes it easier to create complex applications to help automate your daily tasks. From there you can do things like integrate online content consumable through web services, communicate back with online systems (be they task or asset management systems), and automate the manipulation of items on your documents stage.
Keep an eye out as I may be posting more details in the weeks to come, and if you’re planning to stop by, let me know :)
Read more…
Thibault Imbert’s post earlier today showed how the use of the new Vector class in Flash Player 10 could significantly speed up the AS3CoreLib JPEGEncoder class. Coincidentally I’m working on a project right now that uses JPEGEncoder to save an image of a web page so naturally I switched the old array version out for the vector version. The images captured are typically around 1000×2880 so I need to be able to prevent any locking up of the flash player and provide progress for the encoding. That being said, I’ve put together a mash-up of the original asynchronous JPEGEncoder class with the new Vector based one.
As with the previous version the actual speed of the asynchronous encoder is dependent on the number of pixels you can crunch per iteration. The higher you set it the faster it will be, but if you set it too high you’ll run into latency issues much like you do with the standard encoder and larger images.
If anyone cares to test the effect the asynchronous addition has on the speed of the vector encoder I’d love to hear the results – but I don’t have time at the moment :)
(You’ll find a new class under “util” which includes the Vector optimizations)
This can actually be done with any component that implements IBitMapDrawable, but I’m going to show you how it can be done with an HTML component specifically because, well, its cool. Feel free to use it to capture images of your web creations for portfolio purposes (in fact, I think I might just polish this up and make an real app to do just that).
To do this we just need an HTML component from which we can generate bitmap data using the BitmapData.draw() function. The bitmap data can then be encoded into a JPG ByteArray using the JPG encoder class available in AS3CoreLib. Once we’ve done that its just a matter of using a FStream to write those bytes to a File object with the appropriate extension (.jpg in this case). My example here writes the image to the desktop, but just a bit more code you could browse for a custom save location.
<?xml version="1.0" encoding="utf-8"?> <mx:WindowedApplication xmlns:mx="http://www.adobe.com/2006/mxml" layout="vertical" verticalScrollPolicy="off" horizontalScrollPolicy="off" width="1024" height="768" paddingLeft="0" paddingRight="0" paddingBottom="0" paddingTop="5" backgroundColor="#000000"> <mx:Script> <![CDATA[ import mx.managers.CursorManager; import mx.controls.Alert; import com.adobe.images.JPGEncoder; import flash.display.Bitmap; import flash.display.BitmapData; import flash.utils.ByteArray; import flash.filesystem.File; import flash.filesystem.FileMode; import flash.filesystem.FileStream; private function takeSnapShot() : void { var snapShot:File = File.desktopDirectory; snapShot = snapShot.resolvePath("AIRSnapshot.jpg"); var fStream:FileStream = new FileStream(); fStream.open(snapShot, FileMode.WRITE); var bitMapData:BitmapData = new BitmapData(htmlContent.width, htmlContent.height, false); var encoder:JPGEncoder = new JPGEncoder(80); var rawBytes:ByteArray = encoder.encode(bitMapData); fStream.writeBytes(rawBytes, 0, rawBytes.length); fStream.close(); Alert.show("Snapshot Saved to Desktop"); } ]]> </mx:Script> <mx:Button label="Take Snapshot" click="takeSnapShot()" color="#FFFFFF"/> <mx:HTML id="htmlContent" location="http://devote.your.life.auricom.com" width="100%" height="100%"/> </mx:WindowedApplication>
Hit this link link download the source and try it out.
