Friday, August 24, 2007
One thing we noticed was that many of our remoting calls were happening twice. This seemed a bit odd . Turns out RemoteObject has a very useful property called concurrency. For example setting concurrency to 'single' means that only one RemoteObject call is made at a time. Exactly what we needed.
I eventually realised the reason the RemoteObject was getting called twice was that I had a group of RadioButtons with a change event. Selecting one RadioButton changes both buttons in the group and consequently triggers two RemoteObject calls. I changed my change events to click events and the problem was doubly solved.
This small problem highlighted for me how important tools like ServiceCapture and Charles are for Flex work.
Wednesday, August 22, 2007
Our department has for many years used Quicktime as our standard for video production. There were many good reasons for this; the main one being quality and availability. But in the last 18 months the success of YouTube and Google video has made Flash video an almost standard for online delivery. Consequently we've been considering our options for moving towards Flash for future video development. But one of the sticking points has always been quality. The ability to play alternative video formats in Flash changes everything. There are still a few questions to answer before making any changes and we'll need to leave time for a non-beta release to trickle out to our audience. But this will definitely determine our future direction.
Saturday, August 18, 2007
If you are like me then you like to get rid of extraneous clutter in the applications you use. Therefore one of the first things I did after installing CS3 was to have a close look at what was available within each application and decide what wasn't needed and if it was possible to get rid of the things I wouldn't need.
Bridge opens with a long list of Favourites. Some of these feel more like marketing (i.e Start Meeting) than an actual feature. They are easy to get rid of you just right click and select "Remove From Favorites". One of the first things to go was Bridge Home. But today Alan Mussellman has a post "Bridge Home and Fireworks CS3" that got me to thinking I may have been a bit hasty in my decision to remove Bridge Home. But how do you get a banished favorite back. In the end it took me a while to work this out. I looked in all the menus and sub-menus, searched the help all with no luck. Finally I decided to look in preferences (win :Edit > Preferences; Mac : Bridge > Preferences). Under General preferences at the bottom of the page you'll find a list of the available top level favorites. Just tick the checkbox for the items you want to see.
If you want to add a folder to your favorites you can drag and drop it from the content pane to the favorites panel. This is useful for quickly accessing current project files.
Some of the default favorites are Flash pages (i.e. Bridge Home). So I guess there must be some way to add our own favorites pages using Flash/Flex. Now that could be really useful. I can think of a lot of conent I wouldn't mind accessing in Bridge. But a few quick tests show web pages being opened by the default browser and swf files getting opened by Flash (even after adding them to Favorites). Think I'll need to add this to my Research list.
Additional (19th August, 2007):It seems there is some information around relating to extending Bridge CS3. You can find a few examples at the Adobe - Bridge Exchange.
Wednesday, August 15, 2007
I was aware of Cairngorm long before I did any Flex work. But everything I've read says it's not worth the effort for smaller projects and I guess I consider our projects quite small. But when I started looking around the alternative frameworks they either seemed a bit immature or nearly as complex as Cairngorm (but without a strong support community). Consequently we've decided to bite the bullet and use this smaller project as a good place to start learning Cairngorm. To test the idea I built a really small module based project using Cairngorm. The first day was like pulling teeth, but each day after that it became easier and easier. I think the hardest thing about getting started with Cairngorm is there is no obvious starting point. There is an excellent series of six articles written long ago that provide a great insight into the thinking behind Cairngorm and some examples of how things are done. But it doesn't really explain all the elements and how they relate to each other. There are also a number of example applications over at Cairngormdocs that I highly recommend. But looking through these examples involved a lot of opening files and trying to make sense of how the different bits relate to each other. In the end it seemed there were quite a few balls to juggle and so I put together a small document defining our project structure with some notes on how the bits relate. Below are some outtakes from that document that might help fellow Cairngorm newbies. Now keep in mind I'm still a newbie myself so I'm probably off on a few points (I'd appreciate anyone who knows better correcting my mistakes so I'm not spreading mis-information). Each point looks at a typical folder you'll need for a Cairngorm project and their purpose :
- business : The business folder contains Services.mxml which defines all web service definitions (ie. HTTPService, remoteObject etc). Also add Delegate files here. Delgates initiate the service calls and listen and respond to results/faults.
- command : Create a Command for each action. Commands are called from the Views in response to user interaction. They could update the model directly or use a Delegate to make a service request.
- control : The Controller connects events to commands so that when the view dispatches an event through the CairngormEventDispatcher the relevant command is called. These connections are made using addCommand().
- event : define the custom events (that the control connects to a command) that will be called by the view to trigger commands.
- model : The Model stores all required state data. Bind views to the model properties so they reflect changes to the model. Update the model through commands or in response to Delegate results.
- view : The basis for all views in our project will be modules and hence in same folder as the main application file. But it still makes sense to encapsulate many view functions within their own components. These should be stored here.
- vo : Value Objects (vo's) represent more complex elements of the model. Store value object definitions here.
Monday, August 13, 2007
We'll also be taking a look at the second part of the Actionscript 3 video tutorial from Cartoon Smart.
If you're in the state, available and interested it will be great to see you there. The venue has a limited window of easy access so make sure you check out the access details (note : site still branded as MUV) before coming.
Thursday, August 09, 2007
The Quicktime API is broken down into 4 sections :
- Movie Commands
- Quicktime Properties
- Movie Properties
- Track Properties
var str = QT_GenerateOBJECTText_XHTML(src,'320','240',
var o = document.getElementById('qt');
o.innerHTML = str;
interval_ID = window.setInterval("qt_Status()",100);
var s = document.qt_mov.GetPluginStatus();I'm going to tell Flex that the movie has loaded by sending it the movies duration (in milliseconds) using the GetDuration method. Within Flex this value is used to set the HSliders maximum value :
if(s == "Complete")
//tell Flex app movies length
function get_qt_duration()You'll also notice in the status script that we setup another setInterval to regularly check the position of the movies playhead. We can get the time elapsed using GetTime. Within Flex we use this to set the HSliders value.
var d = document.qt_mov.GetDuration();
var o = document.getElementById('QT_SWF');
var d = document.qt_mov.GetTime();
var o = document.getElementById('QT_SWF');
function qt_play()It really doesn't get any simpler than methods called Play and Stop. The next thing we want to be able to do is drag the slider in Flex and then update the Quicktime movies position. We can do this using the setTime method. But there is a small problem. Setting the movies position stops the movie. So you need to follow setTime with a Play() command. But in our example we won't want it to play if the movie is paused. Hence the play_state variable in the last two functions. Now we only restart the movie if the play_state is true :
play_state = true;
play_state = false;
There is a lot more we could do with our Quicktime controller. But this is just a very basic proof of concept to check what is and isn't possible before moving onto the real application later in the year.
Wednesday, August 08, 2007
Tuesday, August 07, 2007
You can also add parameters (required by the js function) after the function name. ExternalInterface isn't available in all browsers so you should wrap this call in a conditional to check if ExternalInterface is available :
Friday, August 03, 2007
One question that came to mind as I browsed the Flickr images relates to how video sharing services respond to these events. To test this I used the same search terms on YouTube as had been used in Flickr. The contrast was amazing. There were no personal videos of the event on YouTube (except for headshot of some guy talking about how he heard about it). Every video was taken from the news. Why is this? Does it tell us something about the communities that use Flickr compared to YouTube? Does it tell us something about the quite different relationship with have to photographs as compared to video? Is it really just a reflection on the availablity of still cameras compared to video cameras. My guess is that it's a combination of all of these (and no doubt a few I haven't considered). What are your thoughts?
Wednesday, August 01, 2007
After making good progress developing my own LinkButton Fireworks Flex Component (FFC) I was keen to take this a bit further by extending one of the existing FFC's. The natural progression from the LinkButton was to take a look at the Button component. If you installed the Flex Style Explorer you can quickly have a play with the available style options for the Button. There are a number of styles that the LinkButton and Button share. But you'll quickly notice one big difference. The Button has a background (all states) with a gradient and you can change the gradients colors and alpha. The fill colors are controlled using the fillColors array. It looks something like this:
The first two values represent the colors for the up states top and bottom colors respectively. The second two values represent the colors for the over states top and bottom colors respectively. The down state is controlled by the themeColor. It turns out to be pretty easy to display changes to the fillColors values by setting the fills gradient.nodes color. The nodes is an array with the Button background having two nodes. You would set the color of one node like this :
var vals = Widget.elem.customData["currentValues"];
bg_obj = Widget.GetObjectByName("up_fill");
bg_obj.pathAttributes.fill.gradient.nodes.color = vals.value;
This was all good. But as I was working through these issues I finally came to an impasse. As you can see the fillColors property is an array. That's alright we can have an array. But to my knowledge we can't have an array with a color picker for each index. That means hand typing the colors and I was really aiming for better. The other option is to use four values and to combine them for MXML output. This may be an option and I'll probably explore this option. But this got me thinking. What would be great is if you could develop a Flash panel for individual components that shows inside the Symbol Properties and allows you to set properties using a GUI (ie. like the Flex Style Explorer). Ideally this swf just needs to exist alongside the graphic and jsf files for it to be used. So if Button.swf existed in your custom component folder it would become the components editor.