Final Mosaic and Javascript Locator
Step 4: create final mosaic, with all avatars and no duplicates.
In this step, I've used Adobe photoshop, but any program that can handle transparent layers will do, eg: gimp.
Open "mosaic_background.jpg", you'll notice that it looks nice and "smooth", but has a few duplicates of avatars, and it definitely doesn't have every avatar in it.
Next open "mosaic_front.jpg", which will look a bit mouldy, with black holes and stuff. Don't worry, this is normal :o)
You have more than likely guessed what needs to happen next: you will need to remove all the black holes, and make them transparent. This is where it get's a little tricky; on the one hand, you could simply use the "Magic Wand" tool to select all the black areas, and then delete them; that is what I opted to do, it's slow and painful, but I don't see any easy other way around it; using "blend if gray", and a threshold value is no good, as some avatars have black in them. So, I selected EVERY little black bit with the Magic Wand tool, and deleted it.
Note: as some avatars will no doubt have black in them, so you will need to manually un-select some areas; using the "Rectangular Marquee" tool, and holding down ALT will subtract from the current selection.
Once you have removed every black tile, copy the layer into "mosaic_background.jpg".
Save your image, and the avatar mosaic is complete!
Step 5: The JavaScript zoom-in and avatar locator.
This step is a little tricky, as I use quite a few "un-orthodox" methods. First we need to extract the image information. Andrea Mosaic saved a test report about our image - it will be named "ocau_colourful_logo Report.txt". Open it with either Excel, or the OpenOffice equivalent. You should see this, when you open the report file in Excel:
The goal is to extract the information we need, in order to create a JavaScript array that looks like this. If you're good with linux, you can do this in a 3 or 4 line shell script, but we're using windows...
Delete the first 9 rows, so we just have the data, and no header. Insert three empty columns in front of column A.
Add the characters i[ in column A, 0 in column B, ]=[" in column C.
Next use the "fill-down" feature, in order to populate the sheet; in our example, it will go down to 7440, as that is the number of tiles in the mosaic.
Next do a search to remove the directory name / file name, and extension, so you end up with just the unique part. I've highlighted what we want in the example above; so, in my case I've searched for "C:\temp\ocau_av2\forums.overclockers.com.au\avatars\jpg\avatar", and replaced with "" (empty string), and then searched for ".jpg", and replaced with "" (empty string).
Next delete all columns from F onwards, insert a column at E, and then put "," in E, and "]; in G, filling down. You end up with what you see below.
|
