[Date Prev][Date Next][Thread Prev][Thread Next][Date Index][Thread Index]

Gandalf graphics



Many months ago I prototyped a graphics magician sort of drawing routine in Z-Basic and wrote a very simple editor for it in Java.  As a proof of concept for doing stuff in HTML5 canvas, I ported the java parser/renderer over for kicks.

http://blurry.a2hq.com/gandalf.html

It's in an alpha state.  The UI is barebones and the floodfill routine (a necessity for being beta) is not converted to Javascript yet.  But what it does is demonstrate the concept of a single-letter command system that is whitespace-agnostic.  You can use this to represent pictures in a very compressed manner and playback the drawings in Z-Basic (in theory).

The path to beta:
-Implement the flood fill in Javascript (the java version is in there commented out)
-Provide an easy way to copy/paste into the Z-Basic routine for validation
-Create test pictures and confirm similarity between the javascript editor and the Z-Basic renderer

The path to final:
-Clean up the html5 page and make it look more application-like.
-Make the javascript renderer 1:1 the same as the result of the Z-Basic one (with all the quirks and limitations of Z-Basic)
-Add circle and arc support (it's already provided in Canvas and Z-Basic)

As much as I like the concept of supporting dithered colors, Z-Basic doesn't support it well enough (flood fill only does solid colors for example.)  So it's a feature that may or may not live long.  Yes, the prudent thing to do is write a better renderer out of pure assembler -- but I originally wrote this to be something I could use in a retrospectiva contest entry.  It's pretty easy to read a room description file and get the picture of the room as a string of data.

Anyway, enough rambling.  Hope you folks find it moderately amusing.  Share pictures if you do anything fun!  :-)  I'll get flood fill working pretty soon I think.

Here's an example, put this in the text entry box:
c6 e
c11 m,100 b140,10
c7 b140,-10
m,10 c9 b140,1
m,1 c13 b140,1
m,1 c4 b140,79
m80,-90
c0C4b50,60
m20,60
c8C0 b10,98
l-5,-20 l7,20 l-4,-20, l7,20 l-3,-20 l4,20, l,-20 
l1,20 l2,-20 l-1,20 l4,-20 l-3,20 l7,-20 l-6,20

Should be something vaguely resembling a sunset, green grass and a very poorly drawn tree (flood fill is needed to draw a better one...)

-B