Jan 29 2009

javascript closures are fun

Jonathan

I really like closures in javascript. I really miss them when I am doing work in Java,  but sometimes when I use them I get a little messed up. Take the following example:

var i;
var objects=[1,2];
for (i=0;i < objects.length;i++) {
    var callback=function() {
        console.log(objects[i]);
    };
    doSomethingAsynchronous(callback);
}

Then you would might expect “1″ and “2″ to be logged when the callbacks come back. This is wrong, instead “2″ and “2″ are logged.

Due to the nature of closures, “i” is one of variables that fall into the scope of the closure by reference, not by value. So, when the value of “i” is updated in the for loop, the current (latest) value is then referenced later on by the closures. So the last item in the list is the item that is accessed.

The way to get around this is to modify the above code slightly, to make the item that you want an argument of a function, rather than accessed through closure scope. Eg:

var i;
var objects=[1,2];
function doSomethingAsynchronousAndLogIt(value) {
    var callback=function() {
        console.log(value);
    };
    doSomethingAsynchronous(callback)
}
for (i=0;i < objects.length;i++) {
    doSomethingAsynchronousAndLogIt(objects[i]);
}

Jan 24 2009

a new version of mooleer is available

Jonathan

A new version of mooleer is available.

If you know others that would be interested in using mooleer, please send them along to register their interest. I will be slowly increasing the number of users and will send invitations in order of when they register.

I have listened to your feedback and have implemented some of it, have prioritised some of it to be done later and would like feedback on some more (I ignored very little :) ). The items that have been done, and prioritised for later are not listed below, only the items that I am not sure of are listed.

I see merit in the following items, but am not sure about how important they are to people actually using mooleer. Can you please respond with a score next to each item (from 0 to 10, with 10 being the most important), indicating how important you think each item is. If you don’t understand an item, please don’t score it. If you think something is dumb, and absolutely shouldn’t be done, then give it a 0.

  • have more help on the transaction form
  • the frequency slider needs to better show when monthly/yearly values start
  • Recurring transactions by default start from “today” and go forever if the “to” date field is left blank. Is this clear enough? or could it be made clearer by adding “today” and “forever” options to dates for recurring transactions.
  • User input should be autosaved (ie get rid of the Save and Cancel buttons). To me it feels more natural that way. The app is very interactive and I as user was lulled into thinking that the app autosaves but it doesn’t. I forgot to save and simply hit “Add Expense” to add another entry and I ended up losing my unsaved input :-)
  • I know you have tried to make it as minimalist as possible but personally I find all the grey a bit drab, it could do with a bit of polish and some subtle colours.
  • Only (Add Income) button should appear on [in] tab, only (Add expense) button should appear on [Out] tab

Please keep up the feedback if there is something that is bothering you (or that you love).


Jan 24 2009

Currying in javascript

Jonathan

I read an example chapter from Professional JavaScript for Web Developers, 2nd Edition: Chapter 18, “Advanced Techniques” last week and the discussion about currying functions finally made sense to me as in “oh, I see how I would use that”. If you want to understand it better look at the chapter linked above.

I have been using it for callback functions that require extra arguments from the local scope, it is a lot less wordy than the method that I had been using, and I think it better conveys the meaning of what I am trying to do.

Previously I would put the following:

var someValue;
$("#someElement").click(function(e){
    clickHandler(someValue);
});

And now I put this:

var someValue;
$("#someElement").click(clickHandler.curry(someValue));

I implemented this using a method that I placed on the Function.prototype. I think that is a nicer syntax than is recommended in the book.

Function.prototype.curry = function(){
      var args = Array.prototype.slice.call(arguments);
      var fn = this;
      return function(){
          var innerArgs = Array.prototype.slice.call(arguments);
          var finalArgs = args.concat(innerArgs);
          return fn.apply(null, finalArgs);
     };
}

Jan 9 2009

Optimistic Locking with JPA, Flex & BlazeDS

adam

Optimistic locking in JPA relies on a version field which can be a number or a date of some type. Using date objects can be problematic if they are not detailed enough. For example a date which does not persist at least milliseconds is likely not to be accurate enough to do versioning. I generally use a Long since it is going to survive a very long time indeed, even in a high transaction system. The version filed is identified using the @Version annotation and when an object containing a version field is updated JPA will read up the version number in the database before attempting to do the update and if the version numbers do not match then it will throw an OptimisticLockException. It is a good practice to make the version field private and not to provide getters and setters. it is critical that the field not be altered except by the JPA implementation.

Ok, so far so good, we implement this strategy on systems where we have a greater proportion of reads to writes and we would like data to be highly available. Basically a user can always get a read, no matter what, however if they want to do a write we will check that the object they are modifying has not been written to since they read it. Very many web based application use this strategy today and as I described above it is supported out of the box with JPA. Of course there are endless arguments about how you manage the OptimisticLockException, but that is a separate issue.

When your web application is using DTOs or some other representation of the system data which is not your actual domain another level of complexity enters the frame. If the DTOs don’t carry the version field with them and re-present it for the update then the whole optimistic lock strategy is dead in the water. If the web tier represents an object without keeping the version field then when it the user requests to update the domain, JPA must retrieve it again, over-write the fields provided and then perform the update. Of course if someone had changed the data between the user’s read and write, that would be over-written.

So we have established that maintaining the version field into the web tier is critical. We already established that the version field should not be user modifiable so it would be good to make the version field in the DTOs private as well. If you are hand mapping between DTOs and your domain then you will need to use reflection to map this field across. I generally user dozer and it allows you to set is-accessible=”true” in a field description which tells it to access this field directly without using the getter and setter.

When you add Flex and BlazeDS to the picture (and of course that means an ActionScript domain) you add a whole new level of complexity and at this point a real problem arises. Of course BlazeDS will auto-magically transform your Java DTOs into your ActionScript domain and perform all transport in AMF3. Thats peachy, but unfortunately it does not transport private fields without getters or setters. That means that although your version field gets mapped onto the DTO when it arrives on the Flex client, it is gone.

Well that just won’t do, we already established that without the version field we have no locking strategy at all. Currently my only work around is to provide getters and setters on the DTOs. This ensures that they make the trip to the client and back but it risks the client accidentally altering them and inadvertently causing an OptimisticLockException. I’m a little unhappy with this and intend to spend a little bit of time with the BlazeDS source code to see if there is something that can be done to allow private field mapping. If you are interested stay tuned or feel free to post your ideas as comments here.


Jan 8 2009

M2Eclipse and WTP

adam

WTP and M2Eclipse do not play very nicely together. We have identified 2 main problems:

  1. Converting Maven projects to WTP projects so that they can be auto-deployed to the servlet container.
  2. Multi-modules projects where the web project has dependencies on one or more of the other modules and you want to be able to debug freely into any module. In this case if you allow a project per module, the other modules never seem to get deployed to the web project.

I will deal with issue 1 first. Most of this solution came from a posting on the eclipse.webtools newsgroup, however it is quite incomplete with respect to Maven projects:

  1. Open .project file for the project to be converted to web project.
  2. Insert the following to natures element:
    <nature>org.eclipse.wst.common.project.facet.core.nature</nature>
    <nature>org.eclipse.wst.common.modulecore.ModuleCoreNature</nature>
  3. Open the properties for the project and go to the section for Project Facets
  4. Add Java and Dynamic Web Module facets to the project. (I forgot the Java facet first time around and had a lot of confusion until I worked it out)

The above will work for a non-maven project the rest you will need if you are using m2eclipse:

Open the .classpath file and add the following:

<classpathentry exported=”true” kind=”con” path=”org.maven.ide.eclipse.MAVEN2_CLASSPATH_CONTAINER”>
<attributes>
<attribute name=”org.eclipse.jst.component.dependency” value=”/WEB-INF/lib”/>
</attributes>
</classpathentry>

Open the org.eclipse.wst.common.component file in the .settings folder of your project and add this line inside the wb-resource block:<wb-resource deploy-path=”/” source-path=”<nested module name if you have one>/src/main/webapp”/>

Issue 2 is really annoying to me since most of our applications use multiple modules to decouple the services from the way they are exposed, ie. via a Java MVC framework, Web Services or via BlazeDs to a Flex RIA. Having this limitation forces us to have a single eclipse project for the services and the web tier or transport tier. This can have the effect of hiding coupling between your services and the web or transport tier.
Nevertheless it is a reality that has to be dealt with right now. You can manage it very easily in IntelliJ, however, even there I can, as yet, find no way to tell the editor that the service tier jar source code is actually in the editor so that I can set break points. Probably this could be dealt with but I was reluctant to spend time on it when I know our management would flip if I suggested paying for all developers to have IntelliJ  licenses :-D
Okay, so the way to solve this problem with m2eclipse is to have the service or core application and the web server application as a single project with multiple maven modules. This sucks for a couple of reasons. The first is that if you have decomposed your application into more that 2 modules it is very hard to manage all the source folders in eclipse. The second reason I mentioned above, this approach will actually have eclipse compiling all classes into the one class folder and deploying that to your web server once you set WTP up. I have seen a number of instances where this effectively makes decomposing your application into multiple modules a waste of time or worse since it gives you the impression that you are enforcing a decoupling when in fact you are not.
If you use this approach then the instructions above still apply in terms of setting up WTP once you have created your multi-module project. In the last step you will need to prepend the web server module name to src/main/webapp (the angle brackets in the description above show exaclty where this goes).
I hope this helps someone, at the very least it will help me the next time I have to deal with this.


Jan 5 2009

restful application module

Jonathan

I have been working on a single page web application called Moolah. Moolah uses a restful style to get data from the server in json format. When I started working on this, I couldn’t find a good pluggable module that would allow me to do this easily, so I wrote my own.

This module only works for json currently, but wouldn’t be very much work to extend to xml or other formats.

When POSTing a record, the result is the new record (including the new key). In the case of a validation failure, the errors object is returned instead.

I did some (non-extensive) searching for what a restful url scheme should look like, and didn’t really find anything conclusive. The url patterns that it uses are as follows:

get /data/account/id/123 (get item with id 123
get /data/account/search/123 (get items that contain 123
get /data/account/list/0/10?field=val (get a list from item 0 to item 10, where field=val
post /data/account/ (create a record)
delete /data/account/123 (delete a record with id 123)

It is possible that I should move to a url-pattern that looks more like:

get /data/account/123 (get item with id 123
get /data/account/?query=123 (get items that contain 123 (text search)
get /data/account/?start=0&items=10 (get a list from item 0 to item 10
post /data/account/ (create a record)
delete /data/account/123 (delete a record with id 123)

I didn’t find this urlpattern as natural, but am willing to have my mind changed.

It is written to be compatible with Google App Engine using app-engine-patch and uses the guidelines at app-engine-patch for making reusable modules.

It is completely pluggable and requires very little configuration. To use you must do the following:

  1. Within the main project:
    1. extract the zip file as a new application within your project
    2. modify the root-level settings.py file to add the “restful” application
  2. Within the application:
    1. Create a UserRestfulController class that inherits from restful.RestfulController
      class AccountForm(ModelForm):
          class Meta:
              model = Account

      # exclude any fields that shouldn’t be set or overridden from a POST
      exclude=(‘created’,'owner’)

      class AccountRestfulController(RestfulController):
      modelClass = Account
      formClass = AccountForm

    2. modify the application settings.py file and add “REST_CONTROLLERS={“account”:AccountRestfulController}” (where you want to expose a “User” model object.
  3. Then (as an example using jQuery) you can access the data with something like:
      getAccount: function(key, callback) {
         $.get("/data/account/id/" + key, function(data) {
                  callback(new CORE.Account(JSON.parse(data, CORE.util.stringToDate)[0]));
               });
      },
      getAccounts : function(offset, limit, callback) {
         $.get("/data/account/list/" + offset + "/" + limit + "/", function(data) {
                  callback(CORE.convertJsonListToObject(JSON.parse(data, CORE.util.stringToDate),
                        CORE.Account));
               });
      },
      deleteAccount : function(accountPk, callback) {
         $.ajax({
                  type : "DELETE",
                  url : "/data/account/" + accountPk,
                  success : function() {
                     callback();
                  }
               });
      },

Thats it.

There is a fair bit of flexibility in the way that the controller works by overriding methods in the RestController class. eg: We want to return a list of transactions associated with an account:

"/data/futureTransaction/list/" + offset + "/" + limit + "/?accountPk=" + account.pk;

then we have a RestfulController defined:

class TransactionRestfulController(RestfulController):
    modelClass = Transaction
    formClass = TransactionForm
    def list (self, offset, limit):
        accountPk = self.request.GET['accountPk']
        account = Account.get(accountPk)
        return Paginator(account.futuretransaction_set.order("created"), int(limit)).page((int(offset) / int(limit)) + 1).object_list

This gets the requested account, and gets the list of children objects from there and paginates them using standard Django classes.

Files for this post

  • restful gae module (.tar.gz, extract to the root of your project and follow the instructions above)