Jun 23, 2013

GSoC Week 1 | AJAXification continues

It's the first weekend of the GSoC coding period and I must say I have been really satisfied with my work yet. I believe I have completed more than forty hours in these six days, changing over a thousand lines of code in the process. The reason, you ask? It's of course my mentor, Alexey Novak (and the home cooked food that I am getting). His involvement has been great so far. Considering that he has a full time job- he manages to give me detailed code reviews after every single push. You can check our discussion here.

This week, I continued with my AJAXification of the Forums and the Glossary. Not wasting much time in the Forums, I added the AJAX behavior to the delete thread/reply and made appropriate controls for the same. One challenging task (note that I thought it would be challenging) was to change the CSS properties and adding chunks of code through JavaScript. However, that turned out to be relatively easy with careful consideration.

For the glossary, it was a bit of a longer task than I expected as the code was generated by the template unlike file storage and forums that I had worked on before. Naturally, I changed the default theme and made my AJAX functions in such a way that converting other themes would be easy. This was also the first change in ATutor, which would affect instructors exclusively.

When I started the GSoC, I was told by Alex to remember a few guidelines while writing the code and one of them was writing as little code as possible. There are two functions that I created in the process, which would have to be used extensively in the AJAXification of other features by others.

One of them, check_ajax_request(), is a PHP function to check the presence of an AJAX request. It has been placed under vital_funcs.inc.php under the include/lib directory. It takes no arguments and returns true or false depending on whether an AJAX request is present.

The second one is a JavaScript function to generate dialog boxes if you AJAX requests haven't been successful. It can be found in jscripts/ajax/Functions.js and takes two parameters- the response message and a dictionary (which is a JavaScript object) of messages. You can access it using ATutor.ajaxFunctions.generateDialog. There is a default dictionary present in the function and it would display a message of "Unknown Error Occurred" if it can't map the error key to any message.

Here are a few things that I learnt.

Replace tabs in VIM-
Although new guidelines in ATutor state that we must use soft tabs of 4 spaces in place of hard tabs. Although you can change your .vimrc file to automatically do it for you, but if you make a single line change to an old file (which followed old guidelines), you would find that it changed your whole file. So, I needed to be careful while committing changes. That being said, any file that I created which involved copying logic from existing files (for adding AJAX behavior) had to be changed. Here is the command which does it. Don't run it on old files. As Alex said- You don't want to touch anything you don't want to touch!

:%s/\t/ /g

JavaScript for loop optimization-
We may think a simple for loop in JavaScript is written in the following way,

for (i = 0; i < elements.length; i++)

There are a lot of improvements in this simple statement and it would finally come out to look like this:

Things to do next week:
Since we have completed a lot of work that I couldn't even imagine back when I was making the proposal, we have decided to give some other areas a brush up, since this project is for a UI Redesign rather than just AJAXification. Here are a few changes that I plan in the next week.

Browse Courses Page: Apply filters through JavaScript and show results in real time.

Drop Down Menus: Another of my all time greatest tasks- drop downs. This time, I need to make them accessible though.

FlipSwitches: There are a lot of enable-disable buttons in the system preferences. The end result that we are aiming- convert them to flipswitches. Needless to say, they need to be accessible.

I guess this is it for now. I will keep this blog updated if I learn something new.

Liked this post? Have any suggestions? Just let me know. Feel free to comment below!