Category Archives: javascript

Ext.extend and Conquer

Posted by Godoy on

Today it was a very productive day.

I’ve redesigned several problematic screens of an application into more functional versions, working much faster, providing more information to the end user and – the best thing – with a very consistent appearance on their layout.

ExtJS provides some nice features to standardize its components by extending its standard classes.

The simplest way to do that is like what I show on the code snippet below. It simply provides some default values – that can be easily overriden when the custom component is instantiated – that help with the implementation of sets of components. 

var myCustomCombo = new Ext.extend(
    Ext.form.ComboBox,
    {
        width: 180,
        mode: "local", // I load the data manually from the store.
        triggerAction: "all",
        emptyText: 'Choose an option...',
        autoSelect: false,
      editable: false
    }
);
Ext.reg('mycustomcombo', myCustomCombo);

I did custom implementations of panels, forms, combo boxes and grids. With that, I make only slightly variations from one case to the other – imagine addresses, where you have several different components from the country up to the zip code for a street, avenue, square, etc.

The new layout also made it possible to eliminate different pages and consolidate all the information on a single page where all records could be browsed, edited, removed or new records could be added to the database.

On the backend – my TurboGears application – my code also shrunk considerably as I didn’t have to make some convoluted queries to get the information. All modules were better decoupled and obtaining the information using AJAX – or better AJAJ since I don’t use XML but use JSON – much easier through a cleaner interface.

Summing up: it was a complete redesign of a whole module in a day. Some hundreds of lines of code eliminated and functionality added to the system.

I hope that tomorrow the day becomes as productive as today.

Updates on Personal Development Environment

Posted by Godoy on

IDEs

I have tested several IDEs lately and in the end I came back to Emacs.

Since last week I have also started to fix my Emacs customization. I have moved to using org-mode to manage my startup files and started the process based on the configuration done by Kieran Healy on his Emacs Starter Kit for the Social Sciences.

I chose this starter-kit instead of the other options – they are listed on Kieran’s code – because it already added some scientific packages that I am interested on.

I am still fixing my customizations to different org files and adding comments to them. It is amazing how messy they were before and I could even find some duplicate / conflicting definitions.

Doing some review from time to time should be a lot easier now. I hope that maintaining the code should also be easier.

There are some drawbacks, of course, but I prefer addressing them on a case by case basis. One of them is not being able to use the customize tool from Emacs and adding the customizations to my .org files. So, I use the customize tool, test and when things are working as I want them, I move the file to the correct .org file.

Javascript Library

I have also changed from using jQuery to using ExtJS. ExtJS provides me with faster deployment rate and is also more aimed towards the type of application that I am writing.

It is not an easy change, as I was used to work with jQuery and had a lot of logic already implemented. I’m running both in parallel while I convert to using ExtJS alone.

One of the main reasons for the change was that with jQuery I kept glueing code from different plugins and that had different “quality standards”. Using ExtJS I can also add different plugins, but the base library already provides a lot of what I need. Actually, I did not add any external plugin yet (only for testing purposes).

All in all, it is being a good change.

Documentation

I have also switched the method I use to document the systems I work on.

There are two different types of documentation: code and system documentation. For code documentation, I am still using comments on my code along with some complimentary design notes.

For system documentation (user manual, system API, reference, etc.) I am using org-mode.

Org-mode with org-babel allows me to add diagrams, formulas and other external images that help me on describing the processes and the inner workings of the systems.

I have moved from first writing code to make what I need work and then documenting as I go to first documenting the exact needs, define the API, draft sketches, etc. and only then writing code.

Coding speed has increased, with a better quality documentation. The whole process, though, takes a bit longer but is more pleasant to the end user as things are better thought and the interface is more consistent.