help me raise money for battle-knight , its a game :)

Please click the link below and help me earn 3 silver coins.

http://s6.battleknight.co.uk/index.php?loc=hire&ref=MTMwNzAx

Pasting Code in Blogspot

I hate writing html by hand, and to write html to display java/as/flex code in a page, is very painful. I was searching for a tool which would generate the html for me, escape all symbols to html tags. And i found this, and it works like a charm. I thought i would list it here, would be helpful for a trespasser.

I used this tool to paste code for my blog "programmtic skins in Flex Builder" and it worked great. Just a matter of 5 seconds.

Programmatic Skinning in Flex Builder 3

Flex is the "HOT" technology these days. Apart from the technology, performance and other advantages behind it, for end users it is very pleasing to look at. When it comes to look and feel, pretty much everything can be done using Javascript too, but flex was developed particularly for "Rich" applications, so it makes creating rich user interfaces easy for the developer. Not to mention, its more efficient and more maintainable for the developer. Flex Builder for Flex is pretty much the Visual Studio for ASP.NET (lot of differences and lot of similarities here). Flex Builder really makes working with Flex easier. And by default, adobe provides a lot of components, which you can use to layout using Flex Builder. Using these components is fine, until you need a different component. Flex also provides support to create custom components and skin them programatically (there are also other ways).

There are a lot of articles and blogs online which talk about how to write programmatic skins, but these skins can only be seen when the Flex application actually runs. What do I need to do if I want to see the applied programmatic skin in the Flex Builder Design view, so i can play around with my layout?

There are some steps that need to be followed. And what better way there is to show the examples? I wish this blogging site supported code snippets, but it doesnt , so i will provide links to code.

The Application mxml is ProgrammaticSkinning.mxml and the skin classes are FlatColorRectangleSkin.as , FlatColorRoundedRectangleSkin.as, GradientRectangleSkin.as and NodeSkin.mxml.

The custom class is Node.as and the style sheet is styles.css. The code in these classes is straight forward, so i wont explain them all. But Node.as and NodeSkin.mxml are special.

1. Node.as should be put in a different library project, if this class exists in the same project, the skins wont be rendered in Flex Builder design view. I dont know the reason for this, if anybody knows, please let me know.

2. Node class in order to support skins, has to override updateDisplayList method, get the SkinClass, create an instance of the class, set the skin Name , set stylename on the skin to this(for the skin to inherit all style properties from the component), set the size of the skin to the component or appropriate (we want the size of skin to be grater than 0, to be able to see it), and add the skin as a child.

3. If anyone wants to use Degrafa for skinning, look at NodeSkin.mxml. This is my favourite. We can use Degrafa tags to define our tags.

That said, we can create our custom components, style them in any way we want, use them in Flex Builder, drag-n-drop in Flex Builder design view and play with the layout.

Also, here is a component you can extend form if you want your component to be skinnable.

package charts
{
import flash.display.DisplayObject;
import flash.events.MouseEvent;

import mx.core.IFlexDisplayObject;
import mx.core.UIComponent;
import mx.effects.Zoom;
import mx.effects.easing.Bounce;
import mx.styles.ISimpleStyleClient;

public class SkinnableComponent extends UIComponent
{
 private var zoomAll:Zoom = new Zoom();

 public function SkinnableComponent()
 {
  scaleX = 0.5;
  scaleY = 0.5;
  addEventListener(MouseEvent.ROLL_OVER, doZoom);
  addEventListener(MouseEvent.ROLL_OUT, doZoom);
 
  zoomAll.zoomWidthTo = 1;
  zoomAll.zoomHeightTo =1;
  zoomAll.zoomWidthFrom = 0.5;
  zoomAll.zoomHeightFrom = 0.5;
 }

 protected override function updateDisplayList(unscaledWidth:Number,
                                      unscaledHeight:Number):void
 {
        showSkin("upSkin");
  }

 protected function showSkin(skinName:String):void
    {
        var skinClass:Class = Class(getStyle(skinName));
        var skin:IFlexDisplayObject = IFlexDisplayObject(getChildByName(skinName));

        if (!skin)
        {         
            if (skinClass)
            {
                skin = IFlexDisplayObject(new skinClass());
                skin.name = skinName;
    (skin as ISimpleStyleClient).styleName = this;
                addChild(DisplayObject(skin));
                skin.setActualSize(unscaledWidth, unscaledHeight);
            }
        }

    }
  
    protected function doZoom(event:MouseEvent):void
 {
          if (zoomAll.isPlaying)
              zoomAll.reverse();
          else
              zoomAll.play([event.target], event.type == MouseEvent.ROLL_OUT ? true : false);
      }

}
}

Comments, advices and help are always welcome.

Comet Style Requests and continuations

Let me start the introduction to this post by quoting an excerpt from an article "

• GMail’s GTalk integration
• Jot Live
• Renkoo
• cgi:irc
• Meebo

So what makes these apps special? What makes them different from other things that might at first glance appear similar? Fundamentally, they all use long-lived HTTP connections to reduce the latency with which messages are passed to the server. In essence, they do not poll the server occasionally. Instead the server has an open line of communication with which it can push data to the client.

The architecture relies on a view of data which is event driven on both sides of the HTTP connection"

The above style of communication is now widely used in Flex, but it is not "long-lived Http". So is this style of communication possible in Http? Sure with Comet style requests we can have long lived requests so that ajax clients, apart form polling, can also enjoy the "server-push" data. But what about the effects of this long lived Http connections? How does the server (servlet container) handle these requests?

It is considered that "thread-per-request" is a better model than "thread-per-connection", when serving thousands of clients simulataneously (not for serving max requests per second). But with long lived connections, the "thread-per-request" model doesnt hold good. Consider a thousand ajax clients haing long lived connections toa server. With "thread-per-request" model, the server will run out of threads to process new requests. So a new approach is needed on the server side, if Comet style requests are to be supported scalably.

One of the new approaches is "Continuations". If continuations is a new term for any, whats the best site to check for its meaning other than wikipedia? This link gives an excellent introduction to continuations (atleast to me, i didnt find any page which describes the concept in such accurate simple words) .

Now the greedy question is "Can i use it in Java? Can i use it to develop web applications in Java?". Yes! Jetty supports continuations on the server side. For more information, visit their wiki site.

The basic idea is to have long lived connections, but to used threads effeciently. Continuations seem to support that, they only allocate threads to these long-lived connections when an event occurs, threads don't waste time waiting for blocking IO etc.

I also found an article on continuations in Rife and scalability with Terracota.
Also Scala, has support for continuations. But more on that in an other post.

FlexSprite

FlexSprite is defined like this "public class FlexSprite extends Sprite". As far as Sprite goes, the docs quote that

" The Sprite class is a basic display list building block: a display list node that can display graphics and can also contain children.

A Sprite object is similar to a movie clip, but does not have a timeline. Sprite is an appropriate base class for objects that do not require timelines. For example, Sprite would be a logical base class for user interface (UI) components that typically do not use the timeline.

The Sprite class is new in ActionScript 3.0. It provides an alternative to the functionality of the MovieClip class, which retains all the functionality of previous ActionScript releases to provide backward compatibility."

It would be handy to know the difference between movieclip, timelines and Sprite, but thats for an another post.

And FlexSprite adds extends Sprite to override the toString() method. It overrides the toString() method to return a string indicating the location of the object within the hierarchy of DisplayObjects in the application.

It iterates through the parent heirarchy untill it reaches the stage object and returns the object location heirarchy.

Migration to Flex 3

declaration of style conflicts with previous version !

If you see the above error when compiling your flex 3 application, then it is most probably because you are compiling your project linked to a swc file that is compiled in flex 2. To solve the above problem, find out the swc's or library project's your project is depending on, and compile those projects and files using flex 3.

Flex MXML, Functions and Nested Functions

In my previous post Anonymous Functions in Flex, I mentioned about the inconsistent behaviour of nested functions. I decided to dvelve deeper and see if it was a bug or if i was missing something. I started out with the language specification, which was very disappointing, still, had some information on how functions in actionscript behave.

The following lines are taken from the specification document :

/**********************************************************************************

Function objects have a property named prototype whose value is used to initialize the intrinsic delegate property of the objects it creates. The prototype property has a default value of a new instance of the class Object. Building on the previous example:

function A() { this.x = 10 }
function B() {}
B.prototype = new A
var o = new B
trace(o.x)     // traces 10

The value of o is an instance of B, which delegates to an instance of A, which has a property named x with value of 10.

Constructor methods inside of a class are also used to create objects. But, unlike constructor functions, constructor methods create objects with a set of fixed properties (traits) associated with its class and a delegate that is also an instance of its class.

class A {
var x
function A() { this.x = 10 }
}
var o = new A
trace(o.x)     // traces 10

There are some subtle differences between the preceding example and the one involving a function constructor:

• x is a fixed property of each instance of A rather than a dynamic property.
• A.prototype is an instance of A rather than an instance of Object.
• The expression A(expr) does not call the function A defined in class A. It results in an explicit conversion of the value of expr to the type A.

Class methods are functions that are defined with the static attribute inside of a class definition. A class method cannot be used as a constructor and does not define the this reference. Class methods are in the scope of the class object in which they are defined.

Instance methods are functions that are defined without the static attribute and inside a class definition. Instance methods are associated with an instance of the class in which they are defined. Instance methods can override or implement inherited class or interface methods and always have a value bound to this.

The value of this in an instance method is the value of the instance the method belongs to.

************************************************************************************/

Having said that, consider the example below : (The examples below have syntax errors, i had to do so, r else the page would not display these tags properly, please correct them, if you r copy/pasting)

mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">

mx:Button id="ti" click="getText()" label="uhuh"/>
mx:Script>
                     ADD CDATA TAG HERE WHEN COMPILING
 import mx.core.UIComponent;
 import mx.controls.Alert;

 private var global_var:String = "global_var";

 private function getText():void
 {
  Alert.show("Level 1 : "+global_var+"\n\n"+this.ti.label);
  var inner1:Function = function():void
   {
    Alert.show("Level 2 : "+global_var+"\n\n"+this.ti.label)
    var inner2:Function = function():void
    {
     Alert.show("Level 3 : "+global_var+"\n\n"+this.ti.label);
    }
    inner2();
   };
  inner1();
 }

]]>
/mx:Script>
/mx:Application>

In the above example, getText() is a instance method, and the flex compiler sets this method's this reference to the Application instance. So, Level 1 is good, but the functions inner2 and inner3 are not instance methods and their this reference is not set to anything, we have to set it.
And how do we do it? We do it by calling the function, specifying the prototype object/target object for that function using call method. Below is a working example.

mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">

mx:Button id="ti" click="getText()" label="uhuh"/>
mx:Script>
                     ADD CDATA TAG HERE WHEN COMPILING
 import mx.core.UIComponent;
 import mx.controls.Alert;

 private var global_var:String = "global_var";

 private function getText():void
 {
  Alert.show("Level 1 : "+global_var+"\n\n"+this.ti.label);
  var inner1:Function = function():void
   {
    Alert.show("Level 2 : "+global_var+"\n\n"+this.ti.label)
    var inner2:Function = function():void
    {
     Alert.show("Level 3 : "+global_var+"\n\n"+this.ti.label);
    }
    inner2.call(this);
   };
  inner1.call(this);
 }

]]>
/mx:Script>
/mx:Application>

Notice inner2.call(this) and inner1.call(this)? But how come the inner functions access global_var variable, any explanation? In the Adobe Documentation, programming_actionscript3.pdf, Under section "Understanding variable scope", these lines are specified :

/*******************************************************************************
ActionScript variables, unlike variables in C++ and Java, do not have block-level scope. A
block of code is any group of statements between an opening curly brace ( { ) and a closing
curly brace ( } ). In some programming languages, such as C++ and Java, variables declared
inside a block of code are not available outside that block of code. This restriction of scope is
called block-level scope, and does not exist in ActionScript. If you declare a variable inside a
block of code, that variable will be available not only in that block of code, but also in any
other parts of the function to which the code block belongs.
*******************************************************************************/

The above answers our question, but the specification talks nothing about variable scopes. Its a relief to know there is a neat solution for the nested functions problem.

Anonymous "functions" in Flex

I will not start this post with an introduction to what an anonymous function is. I assume most of you already know it. So, i was very happy with the notion of Function being a type in action script. That means i can define a function type and create multiple copies of it, probably not that useful. But i can pass around functions to other functions, treat them as values and perform operations on functions, i can combine functions in a way we write mathematic functions on paper, probably not exactly like that, because actionscript does not support operator overloading. Forget operator loading, actionscript does not support function overloading, it also does not allow a constructor to be private. What is wierd is that, private constructors were supported untill actionscript 2, but discarded in actionscript 3.

So as an example, consider this

function action(condition:Fucntion, how:Function, preProcess:Function, postProcess:Function)
{
while(condition())
{
preProcess();
how();
postProcess();
}
}

It is not important how we implement this, the important point is the concept of abstracting the operations/functions and creating reusable functions, and avoid code duplication. There are many more advantages of treating functions as values, a similar concept in C++ is a function object or a functor, but those uses and advantages in a later blog.

So, actionscript provides a function type, and also supports anonymous functions which is great, BUT BUT, the anonymous functions are screwed up, their scopes are not at all consistent. When you refer to the variable "this" in a anonymous function, the result is not similar when you refer "this" in a function defined by name. so we cannot do this,

remoteObj.send(args,
function(event:ResultEvent):void
{
PopupManager.closePopup(this);
}
, fault_handler_function);

The above results in a runtime error. So we have to do this

remoteObj.send(args, result_handler, fault_handler_function);

private function result_handler(event:ResultEvent):void
{
PopupManager.removePopup(this);
}


Why this inconsistency, and why isnt this specified anywhere in the documentation. Is there a actionscript specification these people are working on? Is it avilable anywhere on the internet?

An update to this subject, the solution is posted here.

I did a quick search and i found the specification for actionscript 3. http://livedocs.adobe.com/specs/actionscript/3/wwhelp/wwhimpl/js/html/wwhelp.htm. Is this supposed to be the specification for a language, well, it doesnt at all look like it and it is a total waste. It looks like just an another tutorial.

MySql - Permissions

I spent a lot of time reading the official documentation and a lot of tutorials and blogs, but didnt find what i wanted, untill i found this article. The information is to the point and does not miss a single point.

Ian Gliffin is the man who wrote this, and he has a lot of articles on Mysql.

Code Generation - Good or Bad?

I am planning to put my thoughts about this subject on my blog. But wanted to know what people think about this in the meantime.

Please leave comments.

Flex Chops

If you are reading this blog, i would assume you are familiar with flex. So i wouldnt introduce you to flex. Nor would i like to point you to different articles on the web out there. I would like to share my thoughts of the Flex framework and its internals, as i make my way through the learning process.

Adobe Flex has some decent pdf's online to guide developers on how to get started, but the tutorials only get the developers to start, they dont help the developer to become an expert. There are some books on flex and actionscript and lots of them releasing soon, but most of the books dont teach you anything new. If you have some previous experience in an object oriented language, functional language and a language which supports dynamic typing, reading a majority of the books is a waste of time and money. One good book which is geared towards Flex develpment and best practices is Rich Internet Applications with Adobe Flex & Java. Of the 5 books that i have read on Flex and Actionscript, this book is my favourite and shows the best ways to develop flex components and applications. Also the book Foundation Actionscript 3.0 Animation: Making Things Move! provides a good insight into the basics of flash platform, the Stage compoenent, Timelines, frame events, etc.

Flex is a GUI framework, and flex is not only about MXML, its also about customizing business and layout components, and the knowledge about the internals of Flex framework is a must for a serious flex developer. So to learn the internals, i will follow the old saying "source code is the best documentation". I plan to write a series of articles on flex, sharing my thoughts. I will start with the FlexSprite and UIComponent classes, the base classes for all display compoents in flex.
Any comments/corrections are appreciated :).

Parellel Computation on Distributed Systems - Map-Reduce Paradigm

If you ever wonder how google does its fancy searching lightning fast, this should give an idea.
It is interesting how the idea was derived from Lisp(functional programming languages are good for computations with no state attached, am i right?) and iterators were used to read massive amounts of data. It again shows us that being equipped with knowledge about different programming languages and paradigms pays off.

Also if you are a Java developer, you are lucky. Because 90% of any functionality is implemented in terms of libraries and frameworks, and a simple search in google will reveal the java project. Apache has an implementation of Map-Reduce called Hadoop.

Also you might want to check out the different Java Frameworks that allow Grid Computing.

Basics on J2EE Clustering

I was looking for some information on what clustering is and how it can be used with J2EE. For people sharing the same interests, check out the links below

Abraham Kang writes elaborately about the basics of clustering, gives a good insight into different kinds of clustering and the clustering capabilties of different ApplicationServers. His list of advantages and disadvantages with different strategies is a highlight. Beware, the article is a little out of date ( writtten on 02/23/01), but the basics are solid.

Read his part II here to get the bigger picture on load balancing techniques and some tips (most of them already know these) on clustering.

An another introduction to clustering here.

An Introduction to OSGI.

An Introduction to OSGi on the Server Side by Daniel Rubio -- Daniel Rubio introduces OSGi, an environment that facilitates modularizing an application into smaller and more manageable pieces, with packaging, JVM, and class loader graph support.

Does somebody really know the pros and cons of JMX and OSGI?


I came across some interesting links on OSGI and Web Development, thought i would list them here.

Chris Aniszczyk discusses web development with Equinox HTTP Service.

If you want to check out how equinox can be used to develop visit Server-Side Equinox
and Equinox in a Servlet Container.

Neil Bartlett discusses about Eclipse Extensions and OSGI. This article is a must read for someone interested in knowing about Equinox, OSGI, OSGI Declarative Services and Spring OSGI. Gives a nice introduction and the rationale behind these technologies.