logo
backtop

The Writing’s On The Wall

(Posted 21:19:29 on 1st July 2007 by Rag)
Ah! The Graffiti site. A somewhat novel idea in that I thought of this by myself rather than stealing the idea from somewere else, although I'm sure there's another one somewhere else. I doubt I'm that innovative.

So, lets start with how it works. The page you are directed to is a frameset page. What that means is that you are viewing several web pages at the same time. The frameset itself is like a container that simply says what it's going to hold and where. The graffiti page is fairly simple in that it only holds two pages - the graffiti wall and the graffiti form (the entry page). The buttons at the bottom of the page use a little javascript to alter the size of each frame in order to "pop up" the graffiti form and allow the viewer the ability to submit entries or navigate to another part of the site.

Once you enter the details and click submit there is a fair amount of technical stuff that goes on. The text is converted into an image and angled using a back end PHP script with embedded GD (a graphics package that integrates with PHP - it comes bundled with it on the latest versions of PHP). I have to say, the GD package is fantastic as it allows you to do so many things. I've created dynamic pie charts and bar graphs with it that are linked to the vote page. (I'll probably write something on these later). The text is created using random colors and random fonts (from a list of about 10 fonts). Then, after you create the image, you are taken back to the graffiti wall to view your creation.

Things I learned whilst doing this are that old browsers won't display the alpha channel of png files. That sounded like I knew what I was saying didn't it :) Actually it just means that the old browsers will not show transparent png images, they convert it to black. Given that the whole idea is to have the wall in the background, a black image is next to useless, so we now use gif files. (GD is great - you can create whatever you want). Next thing is that gif files are not as good at displaying text as png's. (At least those I created aren't). So you need to choose your fonts carefully. This was actually agonizing as when I started, I went mad downloading free fonts that were very intricate. These look great in a document, but less so in a gif file. Anyway, the result works even if the text is displayed much bigger than I intended and is separated out significantly. Originally, I wanted to show a lot of graffiti together so it looked more like actual graffiti.

Finally, and probably the biggest shocker, is what crap are people trying to sell on the Internet and does anyone actually buy this? Obviously, for the wall, I wanted a brick wall background. Rather than go out and take my own picture of a brick wall, I figured that I'd just search and download one. Well, there are thousands and most people are trying to charge for them. It's a picture of a wall! Why would you buy that? Most of the sites were looking for around $8.95, but there was one that was asking $49.10. $49.10 for a picture of a brick f wall! And I think we all know what Axel Foley would have said to that. And you can take it with a little lemon twist!
0 comments

 

This is a Build Your Own Blog entry.