I am almost done with the new flashcard review page! It took a while longer than I expected.

Normally for this "refactoring" I am not working on new features, because rewriting the code and adding new features at the same time is really complicated. However for the review page I made an exception because I wanted to freshen up the page and this is one of the oldest parts of the site, so it just was not possible to refactor that part while keeping the same old logic behind it.

On the plus side, when the refactoring goes live, at least you will see a difference ;-)

Click the screenshot for the spiffy "fullscreen" review mode, and read on for details..

First of, with the new MVC architecture it was much easier to do two presentations for basically the same code, so I have finally added a fullscreen review mode!

The new review page has several improvements on the client/server logic :

- Flashcards are "prefetched", which means that instead of waiting each time you move to a new card, it starts loading 5 to 10 cards ahead, so that you should normally no longer see the loading symbol while moving to the next flashcard

- Likewise, the answers are buffered and sent to the servers during the "prefetches". This will reduce dramatically the number of requests on the server (like 10 times less or more).

- Multiple UNDOs! Pressing the "U" key (or that button on the top left of the screenshot), goes BACK one step.

- A progress bar to show the current review session progress at a glance.

- Added a language attribute tag on the flashcard which should ensure the Japanese font is used consistently.

But the best part from a developer's point of view is that this new review page uses a Javascript class that is much more generic that the code I had before. This new class can be re-used for pracitcally any kind of data, and can be extended with more "actions", eg. more types of answers, interactions, or displays on the page. All the prefetching/answers buffering logic is handled by a base class which can be reused.

As a side effect, it also makes it easier to "hack" with Greasemonkey, for example, as it is now, it's fairly easy to change the cards in the selection, and review without affecting the status in the database for example. It uses notifications also which makes it somewhat easier and cleaner to extend with "custom" scripts.

The icing on the cake, which I am considering now, would be to add a possibility to log back into the site from a simple ajax dialog. This would not be on all pages, but on the review page it would allow the user to continue the review session even when the session expired on the server.