In my previous post in this series, I described some ancient software that I wrote years ago that I would like to recycle for the web. This post focuses on massaging the existing resources so that they are web-ready. Boring, but critical, and not so easy, as it turned out!
Preparing the graphical assets:
The most obvious way that suggests itself to implement the puzzles on the web is to create a JQuery UI draggable div with a background graphic. We have a conversion to do. In Hypercard, assets are resources embedded in the runnable file (which was always a huge source of problems.)
To make things worse, my resources were embedded in a proprietary format created by a third party extension. The backdrops are split out separately, in the old fashioned PICT format. Everything is exactly the right size to sync up but nothing is the correct format. Redrawing all this stuff is not an option; however, there are plenty format converters. Getting the resources ready to move to the web is a two-part process:
- Extracting the resources
- Converting the resources to an up to date format.
Extracting the resources to a usable form proved the way more difficult problem.
First I tried File Juicer. Great program, but unfortunately it didn’t recognize the proprietary resources. Then I tried Graphic Converter, which handles a HUGE number of file types. Same story. I tried ResFork, which is meant to be similar to classic ResEdit but runs on OSX. No joy. It found the resources but couldn’t show you anything except binary. I even contacted Tony Berumen, the author of the third party extension via LinkedIn to ask him what he wrapped around those graphics. It was like archaeology. He couldn’t remember off the top of his head. I couldn’t remember whether I could even see them in the original ResEdit on classic, but I decided to find out. So, I went to all the bother of installing a classic Emulator called Sheep Shaver (WTF?) and installing the classic Mac resource tool ResEdit (not to be confused with Windows Resedit) inside of the emulator. ResEdit worked fine, but couldn’t crack those proprietery resources. Good luck then struck. I put out a call for help on the Hypercard Yahoo Group. The lovely and talented Rebecca Bettencourt, a graphics format expert, stepped up to the challenge. Rebecca very kindly reverse engineered one of my files and determined that the resources were basically QuickDraw wrapped in something. In a very short time she produced a simple CLI custom extractor program (in java) which spat out PNG files. Solved both problems for the embedded resources just like that. Poof! I suddenly have over 600 little PNG graphics and that’s only the ones from the geographical puzzles. As for the background PICT graphics, there are plenty of converters that do them no problem.
Yea! It took some digging, but first problem solved! Next post we’ll talk about the puzzle in JQuery.