How to Roll Back Changes using Subversion

Jacob Wright
March 13th, 2008

A question I’ve often gotten is “How do I roll back some changes I made in Subversion?” I’m the company expert in Subversion here at mediaRAIN (another one of my hats) so I thought I’d answer the question one more time.

Subversion is great as it allows you to track every change you’ve made and go back to a previous version if needed. Sometimes you only need to go back to an earlier revision temporarily (for example to tag the project at that point). But other times you (or that lousy co-worker who left on vacation yesterday!) have introduced bugs or committed something you shouldn’t have. Now you need to roll back the broken revision(s). Looking at TortoiseSVN’s menu or going through the list of command-line options you’ll see … gasp! … subversion forgot a roll-back feature! How could they do that?! Isn’t that one of the main reasons for using a versioning system like Subversion?

(more…)

How to listen to Flash events that don’t bubble

Jacob Wright
March 3rd, 2008

I learned a little trick the other week and thought I’d share. Sometimes you might need to listen to a non-bubbling event “up the chain” somewhere, but of course, since it is not bubbling, that can be hard. The trick is that event events that don’t have bubbling still have the capture phase, so if you flip that capture flag to true in the event listener then you can now listen to any events dispatched by any child views whether they are bubbling or not.

Example:

// listen for some event (this one is even custom) that does not bubble
// make sure to set true on capture
stage.addEventListener(”customNonBubbling”, myListener, true);

<mx:Button id=”myButton” click=”dispatchEvent(new Event(’customNonBubbling’))”/>

Note: this only works on display objects as far as I know. Capture and bubbling don’t apply to objects that are not on the display list.

Hacking the Flex SDK

Jacob Wright
March 3rd, 2008

The Flex SDK is finally fully open-source. So I thought I’d have a little fun and implement my own Binding classes to be used when using the [Bindable] metadata tag in an ActionScript 3 project.

The first thing I did of course was to checkout the Flex SDK from subversion. They’ve got instructions on doing all that in their wiki. The wiki also has some great instructions for downloading and installing ANT and the other things you’ll need to build the SDK. Look further down on the previously linked to page in the section “Building and testing.”

Once I had the project checked out I downloaded ANT per the Mac-specific instructions on the wiki. I the ran `source setup.sh` and then `ant -q main` just like they said and voila! I had built my own SDK. Of course, it was basically the same as the one already installed with Flex Builder.

I then started digging into the code and found in the sdk/modules/compiler/src/java/flex2/compiler/as3/binding/BindableProperty.vm template file that is used for the auto-generated binding code. I took out some of the imports, changed the [Bindable(event="propertyChange")] on line 62 to [Bindable(event="${entry.propertyName}Change")], and changed every place it had dispatchEvent(PropertyCha…. to dispatchEvent(new Event(”${entry.propertyName}Change”). This will allow my binding class that just looks for {propertyName}”Change” event for binding instead of using the expensive describeType function.

Next, I compiled the whole SDK and had issues, because the Flex framework needs to use the old binding. SO DON’T DO THAT. After backtracking and fixing things up I changed to the sdk/modules/compiler/ directory and THEN ran `ant -q main`. Now my mxmlc will use the new binding template but the old framework SWCs weren’t compiled wrong with it.

To check out the new generated classes compile your project using `mxmlc Main.as -keep`. That creates a folder called “generated” that has all those classes including your new bindable changes in it. Now in Flex Builder, you can add a your new SDK and compile your own projects. Haven’t had time to actually test this out yet and I’ve gotta run, but let me know if you get it working.

Flight Stealth, a Flex Component Alternative

Jacob Wright
February 7th, 2008

The first question you probably have after seeing the title of this post is “why would you make an alternative to Flex?” Or perhaps, “how could you even think of competing with Flex?” Honestly, we aren’t trying to compete. This will be open source. And alternatives are always nice to have. We could talk about how difficult it can be to extend the Flex components, how limited the styling is, or how Flex makes complicated things easy and easy things complicated, but the fact of the matter is we just thought building an alternative would be fun.

Now, that being said, I think we’re going to have a KILLER alternative to Flex. We (Tyler Wright, my twin, and I) have been wanting to do something like this for awhile. After hearing Ely Greenfield’s Flex roadmap presentation at MAX we got all excited about it again. Much of what was presented there are things we’ve had in mind and wanting to build. I’ve been working on a proof-of-concept over the last few weeks, although we’ve worked on it off and on for a couple of years, and we are definitely headed in the right direction. I’ll list here a bunch of the stuff we’ve got worked out so far.

(more…)

Flex or the Server, What’s Your Focus?

Jacob Wright
January 26th, 2008

I’ve been thinking deeply about how applications are architected. Tyler and I put together a MVC framework which we’ve been reluctant to release because he’s not sure if it’s quite right or if it’s different enough from other frameworks, and because I don’t have time to put it up and document it. So we’ve been brainstorming on how it might be better.

I’ve decided that there are two main focuses when designing a Flex application, and it results in two different kinds of frameworks. There is Flex-focused applications and server-focused applications. The difference between these two applications is the location of the majority of domain logic.

In Flex-focused applications you have a full domain model with methods and properties and relationships between the models. There is a lot of logic on the Flex side that is not presentation logic.

In server-focused applications Flex takes on a view role. This is where value objects are used the most. More calls are probably made to the server because the Flex app needs to know what to do next or to display next. The Flex app contains mostly presentation logic.

Right now I think most of the popular frameworks are server-focused. Value objects are abundantly used. A ModelLocator is used because the model on the Flex side is pretty flat.

Right now I mostly do Flex-focused development. Not because I am not as comfortable on the server, but because the applications I make are things like image editors, document creators, etc. and not dashboards into server views. Right now I need a different kind of framework. Right now I need something other than Cairngorm or PureMVC.

Flex WISHED It Supported CSS

Jacob Wright
January 17th, 2008

I was reading a post about the Top 10 Flex Misconceptions and read in the 2nd section that "Flex also uses CSS for styling of components / applications."

I know since day one Adobe has listed CSS styling as a feature of Flex. But anyone who has used CSS to style a web page knows that Flex does not support CSS. It supports, well, SS.

CSS stands for Cascading Style Sheets. Flex is missing the "Cascading" part of it. CSS is all about using a style sheet to describe the "presentation of the document" (World Wide Web Consortium CSS1). Because of the limited amount of the CSS standard that Flex supports, you really can't define that without a LOT of verbosity.

Let's take some examples of what I'd LIKE to do in Flex, sometimes I can, sometimes I can't. I'd like to set the colors in my scrollbar buttons. Well, I can do this by using the many styles defined in ScrollBar such as upArrowUpSkin, upArrowOverSkin, and upArrowDownSkin. I had to look up the styles for ScrollBar to see if I could do that. Buttons have some nice styles that let you set the background color, but I can't access that so I'll have to replace the skin entirely.

ScrollBar {
  upArrowUpSkin: Embed("myUpArrowUp.png");
... etc.
}

Now if I wanted to change those colors for this area of my app or that area, or for popups only etc. I'd have to go through and make sure each ScrollBar had a styleName that I could then use in the stylesheet for that. Here's what you SHOULD be able to do with CSS:

#certainPartOfMyApp ScrollBar Button.up {
  background-gradient-colors: #999, #555;
}
#certainPartOfMyApp ScrollBar Button.down {
  background-gradient-colors: #555, #999;
}

Beautiful! Flex component developers didn't need to add a style on the ScrollBar component for every conceivable style that one might want to change for its buttons. With real CSS you can access them because the selectors allow your styles to cascade down to all scrollbars under the component with an ID of certainPartOfMyApp. I could have had one definition to style ALL buttons under that ScrollBar, but decided to use the styleNames which might be in place if Flex supported this to style each button separately.

Now if you were to use CSS pseudo selectors (e.g. a:hover) and mapped them to a component's "state" then you could really get going. Say your main application has several states in which different areas of the APP are viewable.

/* setting the state of the app will automatically change what Canvas
is showing. Good-bye ViewStack! */

#app Canvas {
  visible: false;
}
#app:login #loginScreen {
  visible: true;
}
#app:catalog #catalogScreen {
  visible: true;
}
#app:checkout #checkoutScreen {
  visible: true;
}

/* We should even be able to set the width/height/x/y in styles shouldn't we? Not just top, left, bottom, and right */
#catalogScreen .leftColumn {
  width: 200;
}
#catalogScreen .rightColumn {
  width: 100%;
}
#catalogScreen:addToCart .leftColumn {
  width: 100%;
}
#catalogScreen:addToCart .rightColumn {
  width: 200;
}

Now when I change the state of my app a different view is presented. And when I change the state of my catalogScreen the columns change their size, perhaps throwing an effect in there for smoothness could be part of the CSS as well.

I've put together a full implementation of CSS2 as far as the format is concerned and the selectors etc. It doesn't use the box model etc. that HTML uses, but I'll post a demo of it up here soon. It will of necessity use my own components because there is no way to integrate it into the existing Flex styling framework. I've looked, I've tried. :)

Vote For CSS!

If enough of us ask for it Adobe will give it to us. It's already too late to include in Flex 3 which should be coming out soon, but now is the time to be asking for big changes like this for Flex 4. Go sign up and vote for this feature in Adobe's bug base.

« Previous PageNext Page »