Draggable Lists

Projects and Code305 words2 minutes to read

I’ve been working a lot with Oracle Portal over the last few months. My company is in the process of moving everything over to Oracle technology, and I’m a UI designer on the Portal team. We’ve been in the midst of usability testing over the last week or so, and one thing that has been coming up is the suggestion to make the “Other Tools” list of links customizable in some way.

Most implementations typically involve clicking a button or link to go to the Edit page. From there, you typically have to go through some moderately unusable process for reordering links, changing descriptions or current links, or adding new links. This may or may not include several pages and several page refreshes to get it all done the way you want it to be. Quite frankly, that sucks.

So, I spent several hours over the weekend digging through the documentation for Prototype and Scriptaculous in order to build a much more usable, natural, intuitive system for making these kinds of customizations. It’s not quite the same as the lists used in Basecamp, Backpack, or Ta-Da lists, but these services were definitely an inspiration. Here’s a video of what I’ve got so far. The video is a little tall for standard 1024x768 monitors, so you may have to size it down a smidge to see it all. QuickTime 6 or 7 should be plenty new enough to watch the video.

I’m not quite ready to release the code yet, as it’s not completely done, but once I add the few more things to it that I plan to, you can download the code and do whatever you want with it. The backend is done in PHP with text files, and shouldn’t require anything special except for a relatively modern browser (released in 2001 or later).

Ryan Parman

Ryan Parman is an experienced software engineer, open source evangelist, and passionate user advocate currently living in Seattle. He is the creator of and , and worked on DevOps and Security at . He is now bringing learning into the digital age as an Engineering Lead and Site Reliability Engineer at . Ryan's aptly-named blog, , is where he writes about ideas longer than .