Archive

At present, ditzie’s UI is based on some time-tested and reliable, but dated and somewhat restrictive technical principles and libraries. For the most part, the dynamic elements of the UI were built using the script.aculo.us library which, excellent as it is, doesn’t leave me a lot of room to grow or add new features. When I started looking at ways to support things like image rotation and embedded shadows, it became clear that I was going to have to make a big decision about my next big move with ditzie. Basically, I’ve done all I can do with HTML. For the future, my choices appear to be between HTML5 and a 3rd-party framework such as Flash. Regardless of the brewing format war between the two, I’ve never been a fan of Flash, so I seriously looked into what HTML5 can do for me, and I’ve decided that it’s the way to go.

I’m now planning to completely rewrite the ditzie UI leveraging the HTML5 canvas’ ability to handle precise pixel rendering. After doing a lot of research, it seems clear that I can make ditzie do everything I want with the canvas, but I’m going to have to do a lot of learning on my own to get there. I’ve seen some incredible examples of what the canvas can do (my favorite thus far is Raymond Hill’s excellent jigsaw puzzle implementation), and I’ve put together a few mock-ups (sorry, keeping those secret for now) which have me convinced that I’m on the right path.

As it happens, I’m also in the process of rewriting ditzie’s back-end to be more flexible and powerful. I’m setting a lofty goal to one day make this sucker capable of supporting real-time collaboration just as it’s ancestor once aimed to be. In the short term, any users who might be concerned about performance or available can rest assured that my #1 goal is to make sure ditzie remains practical and usable above all else.

Turns out, I can make drop shadows and rotating images play nice together after all. Unlike the previous solution which uses the next-generation of the script.aculo.us library (called scripty2), this implementation is done with HTML5:

While it looks okay in Firefox, this solution produces some strange results in Chrome and Safari. I haven’t even tried IE yet, but I’m sure it won’t be pretty. Anywho, looks like drop shadows may be a possibility in the future too.

One of ditzie’s ancestors is an application called AjaxVTT, which I wrote and ultimately abandoned several years ago. Like ditzie, it was a browser based application that relied heavily on Javascript. Among its numerous features (many of which ditzie cannot yet claim), it supported image rotation. Of course, this was before any of the modern scripting libraries existing, just as it was well before HTML5, so you can imagine that the method I was using to handle rotating images wasn’t the best in the world. It was, in fact, a real pain in the rear, even though it was functional.

With today’s newer browsers and the power of advanced scripting it’s pretty trivial to knock together in-browser image rotation. Therefore, I’d like you to behold a demo of what I think is one of the most important features on ditzie’s horizon (just tap the left or right arrow keys to watch the magic):

This is a feature that I’m quite anxious to add to ditzie, but alas, there’s some back-end work that needs to be done to support it first. Rest assured, however, that image rotation is something that ditzie will support in the not-too-distant future.