Asger Laursen

This morning I wanted to check out my financial wellbeing or the opposite at least. So I logged into my home-banking account, and selected the overview. This morning things was different, and not related to my actual monetary situation, but due to the nice animating charting component which folded out and showed me a graphical overview.

I was pretty amazed and thrilled for various reasons, first of, the use of the Flash Platform in a banking application is always a great manifest of what is going on; the Flash Platform has made it’s transition from an animation - banner add - micro site - video player -only platform to a state where it is also an enterprise platform. This statement; “Flash Platform is an enterprise platform” is not new at all, I know I for one have preached it to clients over and over the past couple of years, but still, seeing Flash Player used in a home banking app, was a great testimony. As we all know (especially in these times marked in history as “the financial crises”) banks are watching their money with every means there is. So Flash running inside my home banking is a sign of belief and acceptance of the Flash Platform as secure, reliable and suited for enterprise solutions.

Another reason for my happiness as related to a high level view on the RIA sphere I live and work in. I’ve only had a few different banks in my life, so I can’t answer for all of them, but on thing which have been similar to all of them, has been the definition of “overview” when wanting to see your account. The visual presentation of this has always been a refresh of the page followed by a list of dated entries; deposits and withdrawals, and that was it. You could then scroll up and down, and select a new period, and your page would refresh and show a new list, with entries within the new set of calendar boundaries. To see your accounts evolution visually in a graphical chart, first of gives a much nicer overview, you can easily see what’s going on from month to month, or day to day. Being able to easily see the curve of your monetary situation or a comparison between deposits and withdrawals is of great value. When setting the granularity of the graph or the time span in general, no page refresh was needed, the graph just transitioned to its new state, reflecting the data model behind. This was *really* great! A field (at least in Denmark it is) so conservative as the banking sector, implementing a Richness in their Internet Applications is a good step forward and manifest of RIA being a valid use case for better end user experience.

In summery onne might rephrase this to; “One small step for Rich Internet Applications, one giant leap for Home Banking Applications”

Cheers

Asger

Flex, Random Thoughts Banking, RIA

What happend - the motivation
As you might now Flex Builder just got a renaming to the much more coherent Flash Builder.
On of the arguments in favor of the renaming is of cause to lower the misunderstandings between what is Flash, what is Flex, and what is Flex builder.

The Problem
New people in the Flash Platform world is often confused about what is what, when talking about Flex and the Builder tool. This renaming will of cause help solve this in the future. But what about the past? What about all these articles, pages, tutorials etc online which still interchangeably uses Flex and Flex Builder without making a differ?

The Solution
Enter Flash Builder Browser. - your way to see the future, while reading yesterdays news!
Flash Builder Browser is an easy to use browser which alters the content you read, so you wont get confused!
Start getting into the Flash Platform loop with the Flash Builder Browser!

Examples and code
Her is how the world looked yesterday:

And here is how the world looks trough Flash Builder Browser:

Get your own copy of Flash Builder Browser and start seeing the world as it is!
Download AIR application here

Get Involved
Here is the source code, giving you the option to start creating, modifying and improving the Flash Builder Browser.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25

<?xml version="1.0" encoding="utf-8"?>
<s:WindowedApplication width="900" height="900" xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:s="library://ns.adobe.com/flex/spark" xmlns:mx="library://ns.adobe.com/flex/halo">
	<s:creationComplete>
		address.text = "http://www.adobe.com/products/flex/"
		browser.location = address.text;
	</s:creationComplete>
	<s:VGroup verticalCenter="0" horizontalCenter="0" height="90%" width="90%">
 
	<s:HGroup width="100%" height="30">
		<s:TextInput width="100%" id="address" />
		<s:Button label="Go" id="goBtn">
			<s:click>
			browser.location = address.text;
			</s:click>
		</s:Button>
	</s:HGroup>
	<mx:HTML width="100%" height="100%" id="browser">
		<mx:htmlRender>
				var flashBuilderPattern:RegExp = /(flex)(®)? +(builder|plugin|plug in)/ig
				if(browser.htmlLoader.window.document.body)
					browser.htmlLoader.window.document.body.innerHTML = String(browser.htmlLoader.window.document.body.innerHTML).replace(flashBuilderPattern,"Flash$2  $3");
		</mx:htmlRender>
	</mx:HTML>
	</s:VGroup>
</s:WindowedApplication>

Happy Coding

UPDATE:
Actually realized that I’d put the regexp code in the htmlRender event, which is not the best place, as it gets called over and over, and could make the browser malfunctioning.
So, even though this post is nothing more than a practical joke, I updated the source, and added some extra things to the usability! (note to self; find a hobby).

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57

<?xml version="1.0" encoding="utf-8"?>
<s:WindowedApplication width="900" height="900" xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:s="library://ns.adobe.com/flex/spark" xmlns:mx="library://ns.adobe.com/flex/halo">
 
	<fx:Script>
		<![CDATA[
			import mx.managers.CursorManager;
 
			private function goToUrl():void
			{
				browser.location = "http://"+address.text;
			}
		]]>
	</fx:Script>
 
	<s:states>
		<mx:State name="idle" />
		<mx:State name="loading" />
	</s:states>
 
	<s:creationComplete>
		address.text = "www.adobe.com/products/flex/"
		goToUrl();
	</s:creationComplete>
 
	<s:VGroup verticalCenter="0" horizontalCenter="0" height="90%" width="90%">
		<s:SimpleText text="Page Loaded">
			<s:text.loading>Loading page...</s:text.loading>
		</s:SimpleText>
 
	<s:HGroup width="100%" height="30">
		<s:SimpleText text="http://" fontSize="16" fontWeight="bold" />
		<s:TextInput width="100%" id="address" text="{browser.location.replace('http://','')}" enter="goToUrl()" />
		<s:Button label="Go" id="goBtn">
			<s:click>
				goToUrl();
			</s:click>
		</s:Button>
	</s:HGroup>
 
	<mx:HTML width="100%" height="100%" id="browser">
		<mx:complete>
				if(browser.htmlLoader.window.document.body)
				{
					var flashBuilderPattern:RegExp = /(flex)(®)? +(builder|plugin|plug in)/ig
					trace("laver vi søgning???");
					browser.htmlLoader.window.document.body.innerHTML = String(browser.htmlLoader.window.document.body.innerHTML).replace(flashBuilderPattern,"Flash$2  $3");
				}
				currentState = "idle";
		</mx:complete>
 
		<mx:locationChange>
			currentState = "loading";
		</mx:locationChange>
 
	</mx:HTML>
	</s:VGroup>
</s:WindowedApplication>

And of cause the AIR application has been updated as well.

And this I hope is the end of this post *ever*

Download AIR application here

Uncategorized Flash Builder, Funny, Joke, Renaming