Okay, I've spent WAAAAAYYYYYYYY too much time working on this little feature, but it intrigued me and I couldn't help myself.

It's located as part of the AQ Link Center at http://www.atlasquest.com/toolbox/aqlinks/ for those of you keeping track. Best to be logged in for best results--or at least if you want to see your own stats in the box. =) It's at the top of the page.

You can use the code displayed right there immediately if you want, BUT, if you log in, you can customize the stats by changing the colors, picture, and the tag line on the bottom. Click on the provided link to get to the Statistics Label Creator at http://www.atlasquest.com/toolbox/aqlinks/stats/ (You *must* be logged in to access this page.)

Customize it, then copy and paste the HTML into your own webpage. Nothing too shocking there.

Now I'm going to start delving into some technical aspects of this little gizmo. It's not required reading, but if you like programming and technical stuff, you might find it interesting. =)

The first thing to note about this gadget--it's basically an image. It's not your average image, though, this image is generated on the fly by Atlas Quest. Well, the text is. The picture is just a standard image on Atlas Quest which I load into memory, write text all over it, then push the results out to whatever web browser asked for it.

That was the first trick I needed to master. Creating images on the fly. =) When I updated the PSA link to not use iframes, you thought I was just being nice. Oh, no.... that was actually a test in creating images on the fly. =) Actually, I use the term 'creating' an image in that case very loosely. The PSA image picks a random image then just copies it out to the web browser. I don't actually change the image like I do with this particular gadget.

The second thing I wanted to do was be able to customize all sorts of stuff with it. Especially the colors. Now that had it's own complications. For you long-time members here, you might remember when clues only allowed you to pick colors from a drop-down menu. Very tacky, and it could only show about a dozen colors before the list started getting way too long. So I fixed it to use those cute little color boxes you see today.

The problem was--those color boxes were very complicated, used iframes (which I generally prefer to avoid when I can), and was designed to work specifically with AQ hosted clues. But that's what I wanted to use.

So the next step in creating this little feature was to rewrite the color box to be a lean piece of reusable code. I finished this part yesterday. Some keen-eyed people might have noticed a subtle difference while listing clues that those color boxes showed up MUCH faster than they used to. Especially for those with dial-up connections, the speed change was even more dramatic. They no longer use iframes either.

Now that I had a working color box, I wanted to test how reusable it really was. So the next thing I did was to update the page for customizing the Build-A-Search at http://www.atlasquest.com/toolbox/aqlinks/stats/ to use the new color boxes instead of the drop down colors that it allowed before. (Speaking of which, for those of you who do use this, you have a LOT more colors to choose from now as a result of the change!)

Then finally... it was time to create the Statistics Label Creator.

Some of you might know that I've been studying up a lot on JavaScript and Ajax. One of the things I wanted to do with the label creator was to show a preview of what you're getting with the HTML, but without requiring a reloading of the page. I wanted the JavaScript to automatically update the image as necessary--even after the page already loaded.

That required a bit of tweaking for the color box to add the necessary hooks to make it all work correctly.

And, at long last, the feature was working. =)

Well, at least it was working on FireFox. I hadn't tried making it work with other browsers.....

Of course, as soon as I tried it with Internet Explorer, things broke. Took me a good hour or two to work out all the browser compatibility issues, but now it worked on FireFox and IE. Then I tried Opera for Yorkshire Tortoise's sake, which I'm happy to report worked just fine without any additional changes. =)

And finally--I uploaded all the changes.

I probably spent a good 30 hours in all getting this little feature working. Oh, I know, it's small and insignificant. Most of you will probably never even use it. BUT! It gives me two things in my toolbox I didn't have before:

1. A reusable color box that I can pop into all sorts of places I never would have dared to do before.

2. The ability to draw custom images on the fly--I've got more ideas about where I can use a feature like that. ;o)

And it improved a couple of features along the way like the PSA box and the clue editing page loading faster.

All-in-all, I think it was well worth the effort. =)

Enjoy!

-- Ryan

Thanks Ryan:)

That's really Cool:)

T;)

You're the man! That is totally awesome.

Sir, it is an honor and a privilege to be one of the many consumers and a premium member of such a wonderful website, run by such a kind, caring, and responsive geek such as yourself.

Computer geek, I mean, of course...could anyone have possibly thought I meant any OTHER connotation of the word "geek"?

night writer

I thought you just mispelled the word "Greek"

Thanks! It was worth all the work. I had it up on my website within 15 minutes of clicking on the link. And it looks great. I love all the customization options.

dtandfambly

Stupid Google Beta strikes again. I've had to totally change the template, but the counter is working in all places now, so far as I can tell. =)

Actually, I have to admit, the new setup for creating templates is kind of cool. *nodding*

-- Ryan

Quote

Then I tried Opera for Yorkshire Tortoise's sake, which I'm happy to report worked just fine without any additional changes. =)

Yay, thanks Ryan. Must say I don't often have trouble with Opera.

As luck would have it I am using IE7 today, but only because I have just updated IE and am trying it out. I can tell you right now I will be back to Opera next time I log on.

YT

Minor update in the HTML code....

If you've already copied and pasted the HTML into your own website, you'll want to change the .html extension of the image to be .png

They both work for the time being, but seeing as the file is serving up a PNG rather than HTML, it technically more accurate. And it might solve problems for websites that may demand image files to use more traditional extensions. *coughMySpacecough*

Eventually I'll get rid of the old file, though, so you'll want to fix the HTML before then.

You can either use the label creator to create a new label from scratch or tweak the existing html so the image extension is png. Whatever you find easiest. =)

-- Ryan, off to fix the extensions on my blogs.....

So, if someone wanted to put this cute little thing into their myspace... I copied the html and changed .html to .png -- copied and pasted into myspace.... nothing. :-( Does it sound right-off-the-bat like I did something wrong?

-Infinity

Quote

So, if someone wanted to put this cute little thing into their myspace... I copied the html and changed .html to .png -- copied and pasted into myspace.... nothing. :-( Does it sound right-off-the-bat like I did something wrong?

Not really. Sounds like MySpace just refuses to accept images, and there's not much I can do about that. Like I said before, I don't use MySpace so I'm not an expert on how to make things work there. If there is anyone out there who can make it work, though, let these other people know. =) There's basically only two things it needs to do: Create a link that points to your profile (which, technically speaking, isn't really required if you want to show your stats and don't care if clicking on it does nothing), and include the image stats.png.

Oh! I bet they know it's really calling a script an not a true image because the image information is encoded into the URL. Well, there's not much I can do about that. That's how it knows whose information to include in the image and all the customization in it.

Some boards I take an alternate format instead of straight HTML. I suppose it's possible that it could work with MySpace if you can figure out what format they prefer for embedding images. For instance: < img>filename here</ img> (I put in spaces so it won't confuse AQ). I have no idea if MySpace uses such a format, but if they do, you might still be able to get it to work.

But you need someone more knowledge of MySpace than I am. =) The HTML code that AQ provides is 100% correct.

-- Ryan

I followed the link to the Statistics Label Create and found all sorts of cool options. I also found my pet peeve--a label reading: colls's Statistics. Now while it doesn't compare in importance to Banana Slugs and their sex lives, the possessive of colls is colls', not colls's. Is there some way to fix it before my monitor gets cracked from the head banging?

Quote

the possessive of colls is colls', not colls's. Is there some way to fix it before my monitor gets cracked from the head banging?

See, and people wonder why English is so hard for foreigners to learn. =)

I've tweaked the code so it won't include any possessives if the trail name ends in S. "colls Stats" may not be technically correct, but I'm afraid if I just automatically included an apostrophe after all S's, then someone with a trail name that is singular but ends with an S would complain. So it seemed simpler just to not include the apostrophe at all. Hopefully that's enough to prevent you from breaking your monitor with your head!

-- Ryan

PS. The fix only applies to the stats.png file. I haven't bothered to fix the stats.html file, which I plan to phase out eventually.

Aww...nice save, Ryan! Simple, and dare I say, even elegant. And, the computer screen is safe for the time being.

Quote

he possessive of colls is colls', not colls's.

Not according to _The Elements of Style_.

DebBee

Quote

Not according to _The Elements of Style_.

I looked in my copy of the book, and I can't find anything about possessive plurals. Are you sure you aren't mistaking it for the section on possessive singular, which I did find in the book? The two use different rules.

http://www.authorpower.com/stories/storyReader$35

Quote: To make a plural noun (or proper noun) possessive, add an apostrophe.

-- Ryan

I guess I didn't realize Colls was plural.

DebBee

I can not for the life of me get this to work on myspace. but then again I never claimed to be very smart.
chadams

Quote

I guess I didn't realize Colls was plural.

Even if it isn't, the same rules apply to proper nouns i.e. names.

A.

Quote

Even if it isn't, the same rules apply to proper nouns i.e. names.

Well, not according to Strunk & White. Two of the examples they use are "Charles's friend," and "Burns's poem."

But I'm not going to lose any sleep over the raging debate. <g>

DebBee

I suspect the Charles' friends versus Charles's friends rule varies depending on which side of the Atlantic Charles lives.

I found Eats Shoots and Leaves really infuriating (not merely because the author treated the totally arbitrary rules of English spelling and punctuation as sacrosanct) but because she only allows British-isms.

Lisa