One thing which i have been meaning to incorporate into ScummC for quite a while now is better palette manipulation tools.
It seems that sometime after the turn of the century, the art of making an image editor with good palette manipulation seems to have been lost. This is very unfortunate, as it makes it VERY hard to make graphics for scummc.
So i improved scummc in two ways…
The palcat tool is now more useful
Have tons of non-indexed graphics? Well now you can tell palcat to combine and quantise all the colours in your images, so you have a single common palette.
palcat -o out -col 32 costume1_*.bmp costume2_*.bmp
Quite commonly in scumm games, you’ll notice the room palettes will follow the same general schema:
OFFS
SIZE
DESC
0
16
System Colors
16
X
Room Colors
16+X
Y
Costume Colors
To reproduce with palcat, simply do:
palcat -o out sys.bmp room.bmp costumes.bmp
(where costumes.bmp contains your combined costume palette(s))
The costume compiler helps you
In scumm, costumes have a palette which indexes into the current room palette. Before you had to specify this manually, like so:
palette([0-32]);
Now you can pass in your combined room palette instead, like so:
palette("out_blank_room.bmp");
Which will match up colors in out_blank_room.bmp with your costume bitmap.
If you have costumes which will be re-used across rooms, i suggest you make a blank room bitmap so it won’t accidentally match colors in your room when you don’t want it to.
palcat -o out sys.bmp blank_room.bmp actors.bmp
I’ve incorporated the costume palette trick in the examples on my scummc fork. Feel free to check it out on github!
Now that Teambox has a real API, i thought i’d make something simple to demonstrate its use. What i came up with was this..
A statistics generator!
For those who have used IRC in the past, you may recall the multitude of scripts available that analyse your logs and generate interesting,
albeit pointless statistics about them.
Borrowing from the general format of these generators, i wrote a simple ruby script which analyses recent activities in a teambox project. It will tell you such things as:
Hours with the most activities in the project
The most active user
Who wrote the Longest and shortest lines, as well as the most words
The most popular words in the project
Most referenced users
Most referenced URL’s
Most popular conversation
Person who created the most tasks / conversations
Really, everything you never wanted to know about your project!
It will also resolve conversation and task names, if you were ever wondering how to properly do that.
To use it run the script, supplying your username, password, and the project you want to examine. e.g.:
ruby teamboxstats.rb -u fred -p password teambox
Will login and dump the teambox project if you have access to it.
It’s been a while since my last rails post, so i decided to try out something different.
Specifically, i’ve always wanted to track my time, but i never seem to find a solution that works. The solution is either too simple and doesn’t give me any feedback, or it’s extremely complicated and hard to use.
So i set about to make a time tracking solution that was both ridiculously simple to use, and could give me some useful reports back. Thus, Twackr was born!
I modelled the entry system after Twitter: at its simplest, all you need to do is type in what you are doing, and Twackr will start tracking your time instantly. When you are done, simply click on “Finish” and it will be done!
Already spent some time doing something but couldn’t get to Twackr? Then you can backdate entries by adding “-1H“. Still working on something? Then try “-1H+“. Blocking out some time? Then use “+1H“. Want to see if you’ll make the deadline? try typing “1H“.
Time can also be categorised into “Services” (#service) and “Projects” (@project).
Following on from Creating CSS Animations, i have decided to release the exporter script used to create the animated orange test guy.
As the title implies, the exporter script runs in Blender. Simply construct a 2D scene using planes, add in an animation track, run the script and click Export. It’s as simple as that!
Each plane is exported as a HTML DIV. If present, any Ipos will be exported as CSS keyframes.
The exporter even supports parenting, so you can build up complex hierarchies of elements which can easily be transformed in an animation, or even javascript.
Note that currently the exporter only supports Webkit-based browsers (i.e. Chrome, Safari, MobileSafari). It also has limited support for Firefox (sans animations).
Moving on from Creating CSS Animations, i thought “How can i make this exporter more useful?”.
The answer is of course to completely remove Webkit from the equation, which leaves us with CoreAnimation. The end result being that the animation can be directly compiled into an iPhone or Mac OS X application.
Not going into much detail, CoreAnimation is essentially the library used by Webkit to display and animate any elements which have been transformed by a CSS Transform.
The actual scene is simply constructed using transformed CALayers. As for the animation, a CAKeyframeAnimation is created and attached to each CALayer. In the case of multiple properties being animated at the same time, a CAAnimationGroup is used to group these animations together.
The end result is a handy animation class which creates both the scene and the related animation tracks. i.e.:
CSS Transforms combined with animations are undoubtedly useful. Unfortunately though, the only way to create them is to manually input values and pretty much guess the result.
This methodology pretty much kills any creative aspirations anyone might have in making these animations. So while there are quite a few coollooking examples out there they lack the glamour of say, flash animations.
It seems to me there is a need for a tool which allows anyone to create these css animations in a visual way. As far as i know, no such tool currently exists. So naturally, i set about making something myself.
Rather than make an entire tool from scratch though, i decided to simply write an exporter script for another tool – in this case, Blender.
Why Blender? Well, it exposes pretty much all of the information i require to construct both a scene and animation tracks. Also, since Blender handles 3D scenes, there is a potential to work with 3D CSS Transforms in the future.
As an example, here’s a simple animation of an orange stick man walking across the screen. The stick man was both constructed and animated entirely within Blender, and exported using my export script.
And the scene as seen in blender:
Which is simply a set of planes linked together and animated. Really, it couldn’t be any simpler.
Currently the only browsers which seem to support both CSS transforms and animations are based off Webkit. i.e. Safari and Chrome (including the iPhone and Android browsers).
Which leads onto the question, is there a real-world demand for such a tool yet?
It’s been a while since my last truly silly project, so i thought i’d come up with something else.
There has been a lot of talk recently about how the web is essentially replacing desktop applications, which to me sounds great.
But there is something missing from this new age of web applications. In order to run web apps you need a web browser, which is still a desktop app. It seems to me odd that a platform which replaces another still requires that platform to operate.
Which is where htmlcanvas comes in. It’s a HTML renderer implemented in JavaScript, which runs nicely in any capable web browser which supports the Canvas element.
In essence, it’s a web browser implemented within a web browser. The above example was rendered from this HTML:
<html>
<head>
<title></title>
</head>
<body><!-- Begin test -->
<p class="woo" id="render">
Rendering <b>HTML</b>...</p>
<p><span>In <b>Canvas</b></span>!</p>
<p>0_0</p>
</body>
</html>
This sort of recursive abstraction is not uncommon in the computing world. For example, C compilers are written in C, Pascal compilers are written in Pascal. There’s even a version of Python implemented within Python. So a web platform implemented within a web platform is quite natural.
Still, it will be a long while before htmlcanvas is remotely capable of running within itself, so a truly recursive web browsing experience is still a long way off.
As with most of my silly projects, the code to htmlcanvas is hosted on github. Fork it here!
Note: Currently only known to work in Safari 4, FireFox 3.5, or Google Chrome.
For those of you interested in web-based project management tools, you might have noticed i’ve not really been maintaining RailsCollab for quite a few months now. Why? well because i really wanted to concentrate on other things, such as making cool iPhone apps and the usual contracts.
(Plus to be honest i wasn’t really using it myself)
Still, since its open source other people were free to use and modify it for their own needs. I was pleased to see that there has been a healthy level of forking according to github’s network graph.
Feature-wise, one fork made by scambra has even implemented a fully fledged wiki.
I’ve also seen partial localisation’s implemented for German and Simplified Chinese. So safe to say, i’m very impressed that despite my lack of updates, RailsCollab is still going strong – all thanks to its growing community!
Now for my input…
Projects like RailsCollab are hardly one-way streets. One has to give back as well as receive contributions.
So i’m pleased to announce that as well as merging the wiki and language updates into the main RailsCollab tree, i’ve also merged in my own updates which convert the Message, Comment, and File controllers into RESTful resource controllers.
Simply put, this means that you can now manipulate messages, comments, and files as XML. e.g.:
To re-cap, i pretty much summarised the available options for playing back simple animations on the iphone in this nice table:
Method
Problem
Use UIImageView
It doesn’t scale
Re-draw a UIView every frame
Far too slow
Use GLES
Beyond the scope of the last article, but not this one!
Transform a clipped UIView each frame
We did that last time
To take things further, OpenGLES needs to be used. Specifically, you need to upload and draw a texture for every frame of your animation.
Now while this sounds like a great idea, there is a slight problem: uploading textures on the iPhone is hideously slow. Excluding the requirements of a video decoder, you only have enough time per frame to be able to playback a small stop motion video in RGB format.
All is not lost though. The iPhone supports two rather interesting texture formats: GL_COMPRESSED_RGB_PVRTC_* which is the native format, and GL_PALETTE* which is, as the name implies is a texture with a palette.
The fastest format to upload is PVR, but unfortunately there aren’t many native video codecs or animation formats about that decode to PVR format. Which leaves us with the palette format, which is just about fast enough to playback something more substantial…
Now which animation format uses a palette and is widely supported? Animated gif!
So to cut a long story short, i ended up writing a fairly elaborate library to decode and playback animated gifs on the iPhone, all in realtime.
Provided the gif is not gigantic (since the bigger the gif, the slower the decode + upload), it’s actually quite useable.
In fact, as a proof of concept i ended up writing an app using this library to playback animated gifs from any website in fullscreen (similar to the youtube app). Feel free to check it out – anim8gif.
The code
The code for this gif animation library, glgif, is located on github. As always, feel free to fork!
A while ago, i posted a little piece about my Backpack-inspired organisation tool, Rucksack. At the time, i only just got the basics working, and it was nowhere near “production ready”.
Now, it still isn’t really “production ready”, but it has drastically improved these past few months. In August, it started out looking like:
And now it looks like this:
Which to say the least, is a big improvement.
But “What’s new?“, you may ask. Well apart from the new grey spaced out look…
You can now see a general overview of recent activity
You can now upload files
You can send emails to to pages
Basic reminders have been implemented with email functionality
Journals and Status (think Twitter) have been implemented
Fed-up of the default page width? You can now resize Pages!
Pages can now be shared to the public
Client-side interface re-written in jQuery
Bug fixes and stability improvements
So safe to say, a lot of improvements. But still, a long way to go before it is truly useful for every day organisation.
