Pragmatic unit testing with JUnit

Here's a great slides about JUnit, Hamcrest, Parameterized Testing, JUnit Rules (Verifier, Timeout, etc), and also about naming classes.

Pragmatic unittestingwithj unit

View more presentations from liminescence.

MongoDB noSQL

Here's a great noSQL resource

MongoDB: tips, trick and hacks

View more presentations from Scott Hernandez.

implementing fastinfoset using CXF

I recently experimented with FastInfoset (FI) and I got it working using CXF. FastInfoset is a standard that specifies a binary encoding format for XML Information set. It aims to provide more efficient serialization than text-base XML format.

One can think of FI as gzip for XML, though FI aims to optimize both document size and processing performance, whereas gzip optimizes only the size. While the original formatting is lost, no information is lost in the conversion from XML to FI and back to XML.

The java implementation of FI is available as part of GlassFish project. ( https://fi.dev.java.net/ ).


1) In your pom.xml make sure you get the cxf version 2.2.7 or later (Thanks to Daniel and Igor for fixing the bug promptly) and add FI dependency:

<dependency>
<groupId>sun-fi</groupId>
<artifactId>FastInfoset</artifactId>
<version>1.2.2</version>
</dependency>

....

<repository>
<id>fastinfoset</id>
<url>http://repository.jboss.org/maven2</url>
</repository>


2) in your service add this annotation.

@Produces({"application/xml","application/fastinfoset" })


3) in your configuration, add the interceptor, customTypes for the JAXBElementProvider and define it in your service:


<bean id="fastInfosetOutInterceptor" class="org.apache.cxf.interceptor.FIStaxOutInterceptor" />
<bean id="fastInfosetInInterceptor" class="org.apache.cxf.interceptor.FIStaxInInterceptor" />

<util:list id="customTypes">
<value>application/xml</value>
<value>application/fastinfoset</value>
</util:list>

<bean id="jaxbProvider" class="org.apache.cxf.jaxrs.provider.JAXBElementProvider">
<property name="produceMediaTypes" ref="customTypes" />
<property name="consumeMediaTypes" ref="customTypes" />
</bean>


<!-- JAX-RS endpoint configuration -->
<jaxrs:server id="sampleService" address="/">
<jaxrs:serviceBeans>
<ref bean="sampleServiceBean" />
</jaxrs:serviceBeans>
<jaxrs:providers>
<ref bean="jaxbProvider" />
</jaxrs:providers>
<jaxrs:outInterceptors>
<ref bean="fastInfosetOutInterceptor" />
</jaxrs:outInterceptors>
<jaxrs:inInterceptors>
<ref bean="fastInfosetInInterceptor" />
</jaxrs:inInterceptors>
</jaxrs:server>


4) When testing, make sure you add Accept header variable with value “Application/fastinfoset”, before hitting the endpoint. (Using the browser will not work).

TO TEST:
curl -H "Accept: Application/fastinfoset" http://localhost:8080/services/samples/getSample?id=9
SampleResponse{??version@1????Samples????ResponseMetadata???Service???Name?Foo????URL?http://foo????Hostname?

You can also add a FireFox Add-on called “Poster”

Groovy Closure vs. javascript closure

Coming from a javascript and java background, i've learned to use the javascript closure to its full advantage, but when we used groovy (on grails) for our new system, I was surprise that the concept of closure in groovy is different.

The definition of closure in groovy (from groovy.codehaus.org) is that, a groovy Closure is like a "code block" or a method pointer. It is a piece of code that is defined and then executed at a later point. It has some special properties like implicit variables, support for currying and support for free variables (which we'll see later on). We'll ignore the nitty gritty details for now (see the formal definition if you want those) and look at some simple examples.

GROOVY CODE:

def myclosure = { println "hello world!" }

println "Executing the Closure:"
myclosure()                          //prints "hello world!"

The javascript closure is a functionality that marks a variable, that it will be use later. So even when it goes out of scope, the data is saved in the memory. Here's an example:

function SayHelloTo(name) {
  var greeting = 'Hello ' + name;
  var display = function() { alert(greeting); }
  return display;
}

var greet = new SayHelloTo("Aidan Thor");
greet();

This is simply defining a method with a local variable called "greeting" and another method inside called display, then it returns that method.

When you instantiate "SayHelloTo", and execute it ( "greet()"), you would think that it will throw an error, because "greeting" is out of scope, but actually it will not throw an error, because the method created a closure (knowing that "greeting" will be called later).

MVP with GWT

MVP stands for Model View Presenter. It is a front end architecture that separates your model (data object) and the view via presenter.

A detailed description can be found in this link (http://www.martinfowler.com/eaaDev/uiArchs.html) written by Martin Fowler. The post is focused on why it's appropriate to use MVP than MVC in GWT project, and how to implement it.

It is tough to decide whether to use MVP or MVC, because both designs solve the problem. One good example that separates the two is that with MVC, it's always the controller's responsibility to handle keyboard and mouse events, while with MVP the GUI component itself initially handle the user's input, and delegate the interpretation of that input to the presenter. (Consider Struts or Spring MVC vs. Flex/Flash ).



A good friend of mine said that MVP is particularly interesting in the context of GWT when doing TDD (Test Driven Development) or just thorough testing all round. The reason is that testing widgets and widget interactions is generally slow because you need to create a UI environment (hosted mode or web mode usually) to run your tests in. By moving your application logic into the Presenter, you end up with code that can be tested fairly fast (with mock widgets). Since the widgets are simple there's less to go wrong in this harder/slower to test area.



In my opinion, the richer your client framework is (e.g. Flex/Flash, Silverlight ) the more you should favor MVP.

Here are the steps you need to do in building MVP compliant project.


1) Define a Page object. The page object represents a web page. You can even make it more granular by defining a Form object.

public class Page extends Composite implements PageView {
   private presenter;

   public Page() {
        presenter = new PagePresenter(this);
        TextArea ta = new TextArea();
        ta.setCharacterWidth(80);
        ta.setVisibleLines(50);
        add(ta);

        Button b = new Button("Comment", new ClickHandler() {
            public void onClick(ClickEvent event) {
                presenter.submitComment(ta.getValue());
            }
        });
        add(b);

   } 
    //This method is defined in PageView, and its being called
    //by the presenter.
     public void updateView(String text) {
        Label commentLabel = new Label(text);
        add(commentLabel);
    }

}

Your page contains the presenter object, and it implements PageView.

2) Define your PageView interface. The PageView acts as a conduit between Page and the Presenter.

public interface PageView {

    public void updateView(String text);

}

3) Define your Presenter object. The presenter is the class that contains all the business logic. It has reference to the services.

public class PagePresenter {

    private PageView pageView;


    public PagePresenter(PageView pageView ) {
        this.pageView = pageView;
    }

    //You can use HasClickHandlers, Hastext or HasHTML, but I prefer just passing the
    // data, if you dont need any other functionalities.
    public void submitComment(String comment) {
        if(comment != null) {
            service.submitComment(comment);
            //Do service calls here. When done, call
            //pageView.updateView()
        }
    }
}

what's on GWT2.0 ??

Here are a few things that I was able to capture about GWT 2.0 during google i/o 2009.

with GWT 2.0, they have added RunAsync functionality. RunAsync gives you the ability to split your javascript into chunks of files. Which allows you, not to load the entire JS from the start.

They have added ClientBundle functionality. ClientBundle includes ImageBundle, ResourceBundle and CssResource (The killer feature). ImageBundle combines individual images into a single image in multiple dimensions. Simply lining up images left-to-right to create an image strip is sufficient. This will make fewer HTTP round-trips. This is what the code looks like:

Interface MyBundle extends ClientBundle {
    public static final MyBundle INSTANCE = GWT.create(MyBundle.class);

    @Source(“smiley.gif”)
    ImageResource smileyImage();

    @Source(“frowny.png”)
    ImageResource frownlyImage();

    @Source(“app_config.xml”)
    TextResource appConfig();

   @Source(“wordlist.txt”)
    ExternalTextResource wordlist();

  @Source("my.css")
  public CssResource css();

  @Source("config.xml")
  public TextResource initialConfiguration();

  @Source("manual.pdf")
  public DataResource ownersManual();
}

This is how you would use it:

  Window.alert(MyResources.INSTANCE.css().getText());
  Frame myFrame = new Frame(MyResources.INSTANCE.ownersManual().getURL());
TextResource configs = MyBundle.INSTANCE. InitialConfiguration();
String configXml = configs.getText();
Document doc = XMLParser.parse(configXml);

The CSSResource compiles CSS with an enhanced syntax. It defines and uses constants in CSS. E.g.

@define myBorder 8px;
@define myColor #FDD;
.error-border { border:myBorder solid:myColor; }

It also uses conditions for user agent, locale or anything.

/* Runtime evaluation in a static context */
@if (com.module.Foo.staticBooleanFunction()) {
  ... css rules ...
}

/* Compile-time evaluation */
@if   {
  ... css rules ...
}
@if user.agent safari gecko1_8 { ... }
@if locale en { ... }

/* Negation is supported */
@if !user.agent ie6 opera { ... }

GWT 2.0 have updated sets of Panel that fix the Layout. The example given is the new and improve DockPanel. It doesn’t run javascript during resize. Constraints-based layout similar to Cocoa on OSX.

GWT2.0 have added option in the compiler is: -XdisableClassMetaData. Calling obj.getClass() or clazz.getName() forces class objects and their names to be generated into javascript. It has Size, speed and obscurity benefits.

GWT2.0 added options in the compiler is: -XdisableCastChecking. Nobody actually catches ClassCastException in app code. (I hope you are not doing this):

Void makeItQuak(Animal animal) {
Try {
    ((Quaker) animal).quak();
}catch(ClassCastException c ) {
    Window.alert(“doesn’t quak!”);
}

The above example generates a call like this (compiled JS)

DynamicCast(animal, 2).quak();

But when the flag is turned on, you only get this:

animal.quak();

How does this help you? In real-world (and very large) google app:
-1% script size reduction
-10% speed improvement in performance-sensitive code.


GWT have added RPC blacklist. Tell the RPC subsystem to skip types that you know aren’t ever sent across the wire:

<extend-configuration-property name="”rpc.blacklist”" value="”com.example.client.WidgetList”">


-Added Client side stackTrace on some browsers.
Throwable#getStackTrace() actually does something sometimes )


-Added interfaces on JavaScript Overlay Types.

adding whitelist or blacklist option in maven GWT

If you are using Maven GWT plugin and find yourself lost in adding the whitelist or blacklist option in the configuration, do not worry, because it is not supported.

At first, I thought it's just another configuration tag, so i added:

<configuration>
<whitelist></whitelist>

But it didn't work. The solution is to add it in the runTarget tag. like this:

<properties>
<whitelist>" ^http[:][/][/]sample[.]net"</whitelist>
</properties>

<runtarget>com.sample.app/Sample.html -whitelist ${whitelist}</runtarget>


I hope this helps.

4 steps to add facebook connect (xfbml) to google web toolkit (GWT) app

Adding facebook connect (XFBML) to your Google web toolkit (GWT) application


This is a fast track tips on how to add facebook connect to your GWT based application.



Step 1: add a facebook application.
If you don't have the facebook application. Just login to facebook and search for the word "developer" in the search field of the menu bar.

http://screencast.com/t/43OHbcLl9

select developer and add/install it. Select "Set Up New Application" , select an application name, select agree then save changes.
The next page is the application configuration. take note of your API Key, because you will be using it. In the left menu bar, select "Connect".
in the connect URL, add your URL. (e.g. http://localhost:8888/com.sample.facebookApp/ ). localhost will work, because facebook connect will not
ping your server.



Step 2: adding the facebook connect library
open your .html file and add the facebook connect name space and the javscript library.


<html xmlns="http://www.w3.org/1999/xhtml" xmlns:fb="http://www.facebook.com/2008/fbml">

...

<body>
</body>
<script src="http://static.ak.connect.facebook.com/js/api_lib/v0.4/FeatureLoader.js.php" type="text/javascript">

Facebook said that its faster to add the script tab below the closing body tag.




Step 3: add Cross Domain Communication Channel in your GWT app.

create a file called "xd_receiver.html" or download the file from http://www.somethingtoputhere.com/xd_receiver.htm and save it to the
public diretory of your google web toolkit app. You will reference this file later in your code.


Step 4: adding the code in your EntryPoint.


a) Add a static final String called FB_API_KEY and XD_RECEIVER_URL.


public static final String FB_API_KEY = "YOUR_KEY_FROM_FROM_YOUR_FACEBOOK_APP";
public static final String XD_RECEIVER_URL = "/xd_receiver.html";


b) build init method. This method initialize the facebook connect in your app. You should call this method in your onModuleLoad()

  private static native String initFacebook(String apiKey, String xd_receiver_url)
 /*-{
     $wnd.FB_RequireFeatures(["XFBML"], function(){
     $wnd.FB.Facebook.init(apiKey, xd_receiver_url); 
     });
 }-*/;

c) Define the loginHandler. The login handler gets executed after a user login has login to facebook connect. This method should be called
in your onModuleLoad().

  private native void defineFbLoginHandler() /*-{
     var fbConn = this;
     $wnd.facebookConnectLogin = function() {
    //The "@com.sample.facebookApp.XfbmlPrototype" is the fully qualified name of your GWT app EntryPoint.
    //The renderFriendsList is the method that will be executed after you login. (aka. login handler).

     @com.sample.facebookApp.XfbmlPrototype::SESSION_KEY =  $wnd.FB.Facebook.apiClient.get_session().session_key;
     fbConn.@com.sample.facebookApp.XfbmlPrototype::onLoginHandler()();
 }
 }-*/;

 public void onLoginHandler() {
     Window.alert("Login is successful!!");
     //You can start adding XFBML comments here, like welcome notes, friend selector, etc.
 }

d) define a parseDomTree method. Since facebook XFBML is not standard, you need to execute a method for them to render.

  private static native void parseDomTree() /*-{
     $wnd.FB.XFBML.Host.parseDomTree();
  }-*/;

e) define your login button.

 private Widget makeFbLoginButton() {
     String fblogin = "";
     HTML html = new HTML(fblogin);
     return html;
 }

As you can see, in the onlogin we point it to "facebookConnectLogin()". This method is define in defineFbLoginHandler() method we created in step c.




To sum it all up, your onModuleLoad() method will look like this:

public void onModuleLoad() {
 FlowPanel loginPanel  = new FlowPanel();
 RootPanel.get().add(loginPanel);

 Widget fbLoginButton = makeFbLoginButton();
 loginPanel.add(fbLoginButton);

 initFacebook(FB_API_KEY, XD_RECEIVER_URL);
 defineFbLoginHandler();
}

Take note that facebook widgets doesn't render in Google Hosted mode. I tried DeferredCommand but it doesn't work. Make sure to compile and test it in a
browser.

Here's the link to all the facebook connect tags that are available: http://wiki.developers.facebook.com/index.php/XFBML

These are the books that I recommend:
1) GWT in Practice
2) GWT in Action
3) Google Web Toolkit Applications (Paperback)

busy life

It's been a year since my last post. I've been very busy working on a project that involves GWT, Grails and Android. Part of it, is that I got so busy with my personal life too.

With regards to the technology I'm using, it seems to me that there are lots of documentations, tutorials in the internet available already. So it doesn't make sense for me to post some introduction on these technologies since they can easily be found.

Although, I will post some methodology and technique that I find interesting when I get a chance.

Wicket IndicatingOrderByBorder component

Wicket have form components that displays a busy icon (like progress bar) whenever a button is clicked. They are the IndicatingAjaxButton, IndicatingAjaxFallbackLink, IndicatingAjaxLink and IndicatingAjaxSubmitButton objects.

What is not provided though is the indicating orderByBorder component. What is OrderByBorder in the first place? It's a component to use, if you want to sort your SortableDataProvider component.

Using the api OrderByBorder does the job well if your data is not big. But if you are sorting huge amount of data, its better to "Ajaxify" it. (For more information about Sorting Data View you can read it here: http://wicketstuff.org/wicket13/repeater/ ).

Here's the customize code for making your own Ajax OrderByBorder:

class IndicatingOrderByBorder extends AjaxFallbackOrderByBorder implements IAjaxIndicatorAware {

    private final WicketAjaxIndicatorAppender indicatorAppender = new WicketAjaxIndicatorAppender();
    private Form contactListForm;

    public IndicatingOrderByBorder(String id, String property, ISortStateLocator
            stateLocator, DataView dataView, Form contactListForm) {
 super(id, property, stateLocator);
 this.contactListForm = contactListForm;
 add(indicatorAppender);
    }

    @Override
    protected void onAjaxClick(AjaxRequestTarget target) { 
        target.addComponent(contactListForm); 
    }

    public String getAjaxIndicatorMarkupId() { 
        return indicatorAppender.getMarkupId(); 
    }
}

To learn that basic, you can read these books:
1) Pro Wicket
2) Wicket In Action (release date: July 2008)

Books I recommend

Wicket HTML Table implementation

This is how you implement an html table using Wicket framework. For those of you who are new to wicket, Wicket is a component-oriented Java web application framework. It’s very different from action-/request-based frameworks like Struts, WebWork, or Spring MVC where form submission ultimately translates to a single action. In Wicket, a user action typically triggers an event on one of the form components, which in turn responds to the event through strongly typed event listeners. (See wicket.apache.org).

This example shows how you render an html table that display person's data. (e.g. first name, last name and age ).

1) First you need to define your HTML.

<form wicket:id="personListForm">
  <table width="100%" border="0" >
    <tr>                    
   <th>First Name</th>
   <th>Last Name</th>
   <th>Email Address</th>
    </tr>
    <tr wicket:id="personList">                    
   <td wicket:id="firstName">[first]</td>
   <td wicket:id="lastName">[last]</td>
   <td wicket:id="email">[email]</td>
    </tr>
  </table>
</form>

2) In your java code where you have to define the form. You will need the following:

a) Define a dataProvider - You can implement the IDataProvider interface, and define its functions. Normally, the IDataProvider is an object
that has access to your backend service.

b) Define a model - You can implement IModel, or you can use the subclasses available. ContactDetachableModel, DetachableContactModel, StringResourceModel.
Why can't we just use the POJO directly from the backend service? Well, wicket will sometimes serialized the object to save memory when you move from one page to the other, and go back. All
object that you will need to display, have to be wrapped/implemented IModel.

//This is the POJO that you retrieve from your service.
class Person implements Serializable {
  private static final long serialVersionUID = 5934872279937101444L;
  private String firstName;
  private String lastName;
  private String email;
 
  //access methods here.
  //getters and setters not define.

}

A detachable modelin Wicket is a model that can get rid of a large portion of its state to reduce the amount of memory it takes up and to make it cheaper to serialize when replicating it in a clustered environment. When an object is in the detached state, it contains only somevery minimal nontransient state such as an object ID that can be used to reconstitute the object from a persistent data store. When a detached object is attached, some logic in the object uses this minimal state to reconstruct the full state of the object. This typically involves restoring fields from persistent storageusing a database persistence technology

//This is the Wicket Model 
public class DetachablePersonModel extends LodableDechableModel {
  //make it transient, so that it will not get serialized.
  private transient Person person;
  
  @Override
  public Object getObject() {
    return this.person;
  }
  ...

}



public class PersonDataProvider implements IDataProvider {

  public Iterator<Person> iterator(int first, int count) {
   Iterator<Person> iterator = null;
   iterator = getPersonService().retrieveEntirePerson(first,count);
   return iterator;
 }

  //Your model is used here.
  public IModel model(Object object) { return new DetachablePersonModel((Person)object); }
 
  public int size() {
    int size = 0;
    try {
      size =  getPersonService().retrieveEntirePerson().size();
    } catch (ServiceException e) { //implement exception here.}
 return size;
  }

}

c) Define a DataView - Data views aim to make it very simple to populate your repeating view from a database by utilizing IDataProvider to act as an interface between the database and the dataview.


Normally, you will implement DataView as an anonymous class, or an inner class, because the chances of reusing the class is minimal.

//define as inner class

private class PersonDataView extends DataView {

...
  @Override
  protected void populateItem(Item item) { 
    Person person = (Person) item.getModelObject();
 item.setModel(new CompoundPropertyModel(person));
 item.add(new Label("firstName"));
 item.add(new Label("lastName"));
 item.add(new Label("emal"));
  
  }
}

3) This is how you would define it in your page.

final Form persontListForm = new Form("personListForm");
final PersonDataProvider personDataProvider = new PersonDataProvider();
final DataView personDataView = new PersonDataView("personList", personDataProvider);
personDataView.setItemsPerPage(5);
persontListForm.add(contactListDataView);

For information regarding the objects used in this example visit:

http://people.apache.org/~tobrien/wicket/apidocs/index.html


Main wicket site:

wicket.apache.org

JavaScript Function Closure

Coming from a C++/JAVA background, it was hard for me to assimilate the concept of Function Closure in JavaScript. Now that I understand it, I'd like to share it here with you. Seriously, it's best explained by example than description. Here's an example.

var thingsToDo = {};

function initializeThingsToDo() {
  var food= {
      name: "Ramen",
      type: "Tokatsu"
  };
  thingsToDo.eat = function() {
      alert("I'm going to eat: " + food.name);
  }
}

//Execute
initializeThingsToDo();
thingsToDo.eat();

Okay, what did I do here? First, I created an empty (global) Object called "thingsToDo", then I added a global function called "initializeThingsToDo". Inside this function I defined food object. I referenced the global object "thingsToDo" and attached a dynamic function called "eat" in the object.

After the code definitions, I ran the global function initializeThingsToDo, and called the method thingsToDo.eat().

I know you would say that this is crazy because when I ran thingsToDo.eat(), the method uses the food object but it's already out of scope.

//Execute
initializeThingsToDo();
thingsToDo.eat(); // When this is executed,
                 // the food object is already out of scope!

Na ah?! Not in JavaScript. You see, when you run the code, JavaScript will create a closure to the food object. After that, it saves it in the memory. The interpreter knows that it will be used for later. (It doesn't deallocate the food object in the memory. )

The power of function closure is well executed when you use AJAX. When you define your AJAX callback function, it gets called asynchronously. It creates a closure and call the objects/functions when it's ready.

If you are not familiar with JavaScript Object and Functions, you can read these links:

Java vs. JavaScript object
JavaScript usign Prototype.js
JavaScript Function

JavaScript function/procedure using Prototype.js framework

Prior to web2.0 and AJAX, I only use javascript for front end validation and some front end calculations.

When I started using Prototype.js, I learned a lot more about javaScript, particulary with functions/procedure.

If you are a java programmer, you probably write functions the traditional way.

e.g.
function sayHello() {
return "hello there!";
}

But there's an alternative. You can define functions this way:

var sayHello = function() {
return "hello there!";
}

Here we declared a global variable called sayHello, to which we have assigned a value. The value is, in this case, an anonymous function defined using the function() keyword.

Take note, that the effect of both ways are the same. (The second one is similar to C/C++ pointer to a function. wink-wink ).

In JavaScript, a Function is a first-class object that exists in its own right, unlike the method of an object in an object-oriented language.

To give an example about Function being a first-class object, let me explain about how to call the functions.

To call a function, you would use parenthesis.
e.g.

sayHello();

if you dont put the "()" it will return a reference to a function. You use that if you want to assign another name to call your function.

var sayHelloFxn = sayHello;

How does javascript function deal with input parameters? Consider this example

var animalCreator = function(species,color) {
return { species:species, color:color }
}

I created a function that returns a object (HashMap or associative array depending on how you want to call it ). What happened if I do call it like this?

1) var whale = animalCreator("mammal" );
2) var frog = animalCreator("amphibian", "green");
3) var eagle = animalCreator("bird", "white", "bald eagle" );

You would probably think that 1) and 3) will generate error. According to the declaration of the function "animalCreator" it accepts two arguments, called species and color. It is obviously designed to be called with two arguments, but in JavaScript (and unlike Java or C/C++/C#) this is nothing more than a guideline.

For 1), since there's only one argument, the second one will be set to null. and for 3) we pass a third argument. That will simply be ignored.

Okay, so much for function call. Let me explain about function as first-class object and how function changes its context. I know its weird, but the function object itself has its own function. You can use Function.call() or Function.apply() to execute a function.
e.g.

var food = { meal:"bread and egg", drink: "green tea" };
var person = {
 meal:"bacon and rice",
 drink: "coffee",
 eat: function () {
      return "I'd like to eat " + this.meal + " and drink " + this.drink;
 }
};

1) person.eat();
2) person.eat.call(food);

Here we define 2 objects (food and person). Person has a function called "eat". The first one will return:

I'd like to eat bacon and rice and drink coffee.

while the second one, since you are using call, and passing an object as an argument. The function context will use the context of food. It will return:

I'd like to eat bread and egg and drink green tea.

As you noticed, the "this" changes context. This concept is very important in javaScript, because this is unlike java and C/C++/C#.

The apply() method operates similarly, except that it expects all arguments to the function invocation to be bundled as an array that is passed in as the second argument to apply(). Subsequent arguments are ignored.

Function Closures

What is function closures?

Free Directory Assistance?

If you need a phone number of a certain establishment you normally dial 411. It cost you about $1 (depending on your cellphone carrier).

411 is old school now. There's a way to get this information (and more) for free. Call 1-800-GOOG-411 or 1-800-466-4411, and you can ask not only for the numbers, but even for address, direction, etc. You can also request to deliver it to you via SMS (text message).

Kudos to Google!

Now what are you waiting for? Try it out! and save it in your phone's contact!

Check video below for more information.

The Last Supper

One of the best paintings we have in this world is the "Last Supper" by Leonardo Da Vinci. The painting is about Jesus's last meal with his 12 apostles before his death. It depicts the bread and the wine and when Jesus tells his disciples, "Do this in remembrance of me", (1 Corinthians 11:23–25).

What is interesting is that Leonardo Da Vinci was a member of a hidden society called Prior of Scion (which is also related to the "Illuminati" ), and the painting has more to it than just it's religious theme.

I'm not claiming that what I'm saying here is true. (So don't judge me) It maybe just a conspiracy theory. But If you look at the painting there's actually no grail in it.

The theory explains that the grail (the holy cup) holds the blood of Jesus is the same cup that supposedly contains the blood of his crucifixion; This is seen by many as a Christian metaphor. However, many people actually believe that the grail is more than just an idea - it represents a human being that holds the child of Jesus (and possibly the merovingian blood line).

To some, the latter theory is considered blasphemy - a made up story to destroy Christianity. Whatever the real story is, we may never know. In the end, it all boils down to your beliefs and convictions.

Here's a link to a 16-billion pixel image of the last supper (worlds highest resolution). This is the only image that the Italian government allowed (and there will never be another one )

The Last Supper Painting (click me)

Watch TV anywhere, anytime

I came across this device by Sling Media. Its called "Slingbox". SlingBox is device that you connect your cable/satellite and your internet connection, and it streams the signal to your computer or mobile phone. So technically, you can watch your favorite TV show to your computer anytime, anywhere and its live!

What do you need?

1) Broadband cable or DSL high-speed Internet connection (Minimum Upstream Network Speed of 256 kbps);
2) Home Network Router;
3) If your TV cable connection is located in a different place than your Internet connection, you will also need a SlingLink or Ethernet bridge, which brings network connectivity to any electrical outlet;
4) Windows or Mac based PC and/or a Windows Mobile or Palm OS Powered PDA or phone with a 3G Data Connection or WiFi for your remote TV viewing.

What solution can it provide you? Well, for example, I can setup my slingbox in Japan, then if I'm abroad I can watch my favorite show live as it is broadcasted live. Another advantage of Slingbox is that, it has no monthly fee.

So, if you are subscribing to some cable company like TFC (The Filipino Channel), you can save a lot of money if you use Slingbox, that is assuming that you have internet connection and computer.

Slingbox site:
http://www.slingmedia.com/go/slingbox-pro

Javascript using Prototype.js framework

Prototype is a JavaScript Framework that aims to ease development of dynamic web applications. One of the objects they provided is the class object. Class is object for class-based OOP. (You can learn more about Prototype.js in Prototype.org )

In my last post, I explained the difference between javascript object and java object. Now, I will explain how to define a class with the use of Prototype.js.

To use Prototype, first you must include the framework. You can either download the prototype.js file or reference from it directly, like this:

&lt;script type="text/javascript" src="http://www.prototypejs.org/assets/2007/6/20/prototype.js">&lt;/script>

Prototype’s Class object contains a single useful helper method which is create(), that allows us to move the body of the constructor into the prototype definition. (No need to specify the prototype directly, like what I did in prev post.)

The create() method does this for us by defining a constructor automatically that delegates to an initialize() method, which we then define manually.

var AnimalObj = Class.create();

AnimalObj.prototype = {

  initialize:function() {
       this.sound = "grr!";
  },
 playSound: function() {
     alert(this.sound);
 }
}

With prototype, you don't need a constructor (which in javascript a public global function ). You can define everything in the initialize method it provided.

Another cool feature about Prototype.js is the Object.extend() functionality. Object.extend() copies all properties from the source to the destination object. Used by Prototype to simulate inheritance (rather statically) by copying to prototypes.

The inheritance with Object.extend() works differently if you are used to java. For example, if we want to create Horse that extends Animal. It would be like this:

      
var Horse = Class.create();

Object.extend(Horse.prototype,AnimalObj.prototype);

Object.extend(Horse.prototype, {
      initialize:function() {
          this.sound = "neigh!!";
       }      
});

Looks weird huh? Well, first you create a class. Then you extend the methods in Animal to your Horse object. Then you define your initialization. Take note that you have to use Object.extend() in defining the initialize() method, otherwise it will override your previous object.

Phishing: beware

5 of my friends have been victimized by phishing in their yahoo! instant messenger. But what is phishing really? According to wikipedia, phishing is an attempt to criminally and fraudulently acquire sensitive information, such as usernames, passwords and credit card details, by masquerading as a trustworthy entity in an electronic communication. eBay, PayPal and online banks are common targets. Phishing is typically carried out by email or instant messaging, and often directs users to enter details at a website, although phone contact has also been used. Phishing is an example of social engineering techniques used to fool users. Attempts to deal with the growing number of reported phishing incidents include legislation, user training, public awareness, and technical measures.

What damage can it do to you? Well, first is that you lose your account (in this example you lose your yahoo email ). Your private information get exposed to the hacker and your friends account can potentially be hacked as well, because the hacker will use your account to continue the phishing process. Unfortunately, this time, the hacker have trust factor, because the hacker is pretending to be you.

How to detect and prevent this?


1) Make sure never to login or put your account to any URL link that they gave. No matter how real it is. Take note, that sometimes, you will receive a fake email stating that you need to renew your password. If this happens, make sure to contact the website itself. (This actually happened to me. I received a fake Amazon email ).

2) If a friend tries to chat with you, make sure to ask your friend's information to know if its really your friend. Hacker doesn't know you, so he/she will rely on your email for information regarding you, to victimize others.

3) Always make a habit to sign-out everything you're done with your account.

Flex & Java

Flex (particularly Flex 2 and Flex 3 ) is a development language for RIA (Rich internet application) that run cross-platform in a ubiquitous Flash Player 9. You write code using Actionscript 3.0 and XML-based language called MXML that supports the declarative programming of GUI component targeting designers.

Flex (2 and 3 ) = Actionscript 3.0 + MXML

If you are a web developer, and experienced in javascript, you will not find it hard to study FLEX.

I just started learning FLEX this year, and the application I develop are cool and easier to write.

I will post some cool examples in here once I finalize them.

The book that recommend you to read, if you want to learn FLEX are:

1) Rich Internet Application with Adobe FLEX & JAVA
2) Oreilly Essential Actionscript 3.0