case
21May/106

FlashBuilder network issue

Like most of my articles here, I try to post solutions for unusual problems I encounter now and then that may help someone someday. And this one almost made me scream.

So here's the story. My DEV environment (http://dev/) is a Virtual Host mapped in the Windows host file to point to a sandboxed directory somewhere on my hard drive. The Flex project I'm building uses a RemoteObject and tries to communicate with a AMFPHP gateway to do it's stuff. All good till here.

The weird part is that when I try to run the app, even though my flash is coming from the DEV host and the path to the gateway points to the same DEV host, the AMF calls either failed with a security exception or if they worked, they were extremely slow. The delay between a service call and a response/error was somewhere between 6 and 10 seconds.

Why oh why !? The AMFPHP Browser app that comes with the package works just fine so my app was at fault somehow. Tried some investigations and thanks to Firebug I found the vital clue.

It seems that my app was trying to make the connection to the gateway through http://localhost:37813/. WTF ?? I didn't had any reference to 'localhost' in my code, yet the app was trying to connect using that address for some reason. And quite often, the crossdomain.xml failed to load resulting in a security error.

So what in the world is the problem then ? Well, Flash Builder seems to be the problem (and me for not RTFM).

It seems that if you compile your swf with Network Monitor active, which you may not realize, especially if the window is not even opened, you have just told your swf to redirect all traffic to localhost:37813. It will compile the redirect info into your flash. Traffic may work if you have Flash Builder debugger running but try to deploy that somewhere. Heh.

All you have to do is turn network monitor off. Recompile your swf. Redeploy.

Ta da !

28Apr/102

Serialize JavaScript object to JSON

Recently, on a project I was working, I needed a function to serialize a JavaScript object and all I could find online were scripts and jquery plugins for serializing a html form. Then, I found this, a script that takes advantage of the .toSource() method available in Gecko-based browsers and for the rest of them plain old recursion. But it does the trick as expected and I'm pretty sure someone else might need it.

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
function serialize(_obj) {
   if (_obj != undefined && typeof _obj.toSource !== 'undefined' && typeof _obj.callee === 'undefined') {
      return _obj.toSource();
   }
   switch (typeof _obj) {
      case 'number':
      case 'boolean':
      case 'function':
         return _obj;
         break;
      case 'string':
          return '"' + _obj.replace(/"/mg, "'") + '"';
          break;
      case 'object':
          var str;
          if (_obj.constructor === Array || typeof _obj.callee !== 'undefined') {
              str = '[';
              var i, len = _obj.length;
              for (i = 0; i < len-1; i++) { str += Utils.serialize(_obj[i]) + ','; }
              str += Utils.serialize(_obj[i]) + ']';
          } else {
              str = '{';
              var key;
              for (key in _obj) { str += key + ':' + Utils.serialize(_obj[key]) + ','; }
              str = str.replace(/\,$/, '') + '}';
          }
          return str;
          break;
      default:
          return '""';
          break;
      }
}

To deserialize it, just use eval().

Also, if you need the same thing for your Flash/Flex Actionscript3 project, here is a class for that as well -> Click Me.

Cheers!

11Mar/108

Neural networks in ActionScript 3

Neural Network"An artificial neural network (ANN), usually called "neural network" (NN), is a mathematical model or computational model that tries to simulate the structure and/or functional aspects of biological neural networks. It consists of an interconnected group of artificial neurons and processes information using a connectionist approach to computation. In most cases an ANN is an adaptive system that changes its structure based on external or internal information that flows through the network during the learning phase. Neural networks are non-linear statistical data modeling tools. They can be used to model complex relationships between inputs and outputs or to find patterns in data." (Wikipedia)

Multi Layer PerceptronSo, repetition is the mother of all learning they say. You damn right it is. And you can do it in AS3 of course. Not the fastest choice out there but that's not the point. NN's are usually not that fast but they're useful in so many ways.

So, here is my implementation of a neural network multi-layer-perceptron made in AS3, set to learn a simple XOR problem. It uses 2 inputs neurons , 2 hidden layers, each having 2 neurons and one output neuron. It takes about 2 seconds to train it using 10.000 epochs, but then you can save a snapshot of the NN memory as a byteArray, save it to the server and load it back again in an instant without requiring a new training.  I didn't take the time to thoroughly document the classes just yet but I'm sure you'll find them pretty easy to use.

Some reading material:
http://en.wikipedia.org/wiki/Artificial_neural_network
http://fbim.fh-regensburg.de/~saj39122/jfroehl/diplom/e-index.html (this is great)
http://www.ai-junkie.com/ann/evolved/nnt1.html

Sources and Download


1Feb/106

Create Flex/AS3 applications for Mobile Devices

elips-studio-3-boxYup! Flex Apps on your mobile. And I'm not talking about Flash Lite and you won't need CS5 either.
ELIPS Studio converts the Flex code in native code for Windows Mobile, Symbian, Android, iPhone and mass-market mobiles. It's still beta and you have to register for a beta account to get it but I think will do wonders for the mobile dev. world.

And in their words:

"ELIPS Studio 3 is a plug-in for Adobe Flex Builder, a widely used IDE for internet & desktop application. Our plug-in allows Flex to go mobile!

The product offers a mobile-optimized Flex Framework, plus numerous Flex extensions, including mobile UI components & access to mobile device features (voice call, SMS, access to calendar and contacts, to the camera, etc.)

The product includes a form-factor device simulator allowing you to see your application behavior on different devices. It also includes a network simulator allowing to generate calls, SMS, etc."

So..get it while it's hot 🙂

15Jan/100

Adding ellipsis points in a TextArea component in Flex

The goal here is to use a TextArea component to display some text that doesn't quite fit in the specified region and ellipsis points (...) should be showed to let user know the text is trimmed. Standard stuff right ? But Flex doesn't do it by itself and I thought someone might look for this.

My problem was with a Flex app that uses i18n and in some languages the text didn't fit the box, the scroll bar policy was off and user had no idea there was more text in there and didn't had the possibility to scroll further. Anyway, here it is :

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
	<mx :Script>
		< ![CDATA[
 
			[Bindable]
			private var text : String = 'The quick brown fox jumped over the lazy dog. ' +
						    'The quick brown fox jumped over the lazy dog. ' +
						    'The quick brown fox jumped over the lazy dog. ' +
						    'The quick brown fox jumped over the lazy dog. ' +
						    'The quick brown fox jumped over the lazy dog. ';
 
			private function trim(text : String) : String
			{
				box.text = text;
				box.validateNow();
				if(box.maxVerticalScrollPosition > 0) {
					text = text.replace("...", "");
					text = text.substr(0, text.length - 1) + "...";
				} else {
					return text
				}
				return trim(text);
			}
 
		]]>
	</mx>
 
	<mx :TextArea id="box"
		verticalScrollPolicy="off"
		width="250"
		height="50"
		wordWrap="true"
		text="{trim(this.text)}"
		paddingBottom="0"
		editable="false" />

Flex Output