Administration > Behind the Scenes > Color picker
Pages: 1
Color picker (Read 2632 times)
posted: 6/14/2005 at 8:02 PM
modified: 6/14/2005 at 8:06 PM
For those of you that created your own run types, you also probably used the color picker to set colors in the graphs to be more appealing to you. Like all the components on this site, with the exception of the component that generates the charts, the color picker is custom made.

If you search for javascript color picker on Google, you'll get a variety of choices. Most of the results fall into two camps: the color picker is built into the page, or it is a popup window. Neither solution is acceptable to me. Having the color picker on the same page distracts the user from the important information, which is the ability to change the run type properties. The popup window solution solves that problem, but it might be blocked by popup blockers. Advanced computer users will have no trouble with permitting the color picker to popup, but I'm building a site for all users, and I want to reduce the amount of knowledge required by someone in order to keep a running log.

The solution is to create my own color picker that will satisfy my requirements. I spent about 24 hours (a full weekend and several week nights) working on the user definable run types feature. 16 of those hours were spent on getting the color picker to work properly.

I actually created two versions of the color picker. In the first version, the color picker is embedded in the "My Preferences" page. It is hidden until you click on one of the colored boxes next to the run type. Having the color picker embedded in the page makes the page size larger, which is not all that cool. More importantly, it's more work for me if I want to reuse it elsewhere. So I scrapped it and created the second version.

When you open the "My Preferences" page, the color picker doesn't exist yet. It is created when you click on the color box. You might notice a slow delay after the mouse click and before color picker appears. When you close it, it is merely hidden from view, so when you bring it up again, it'll come up instantaneously.

As a side note, I think this will be where the popup ads will be heading soon. The popup blockers are doing a great job at blocking new windows, but they won't be able to block a page level popup.

If you're interested in how it actually works, you might want to look at ColorPicker.js. The Javascript creates the color picker using DOM, and uses CSS to manage the look and feel. I know it is futile to prevent someone from stealing javascripts, so you're free to use it if you find it useful. An acknowledgement in the form of a link back to my site (www.runningahead.com) would be appreciated, but not necessary.

Josh Jacobson
posted: 6/14/2005 at 11:56 PM
Nicely done!! I am very impressed with what you are doing with this log!! Smile
view log
AtmBomb of Contemplation
posted: 6/15/2005 at 1:07 PM
"create my own color picker that will satisfy my requirements"...you're such a geek!

Thanks! Wink, I appreciate it!

Lynn B
"I run in the path of your commands for you have set my heart free." Ps 119:32
posted: 6/15/2005 at 1:32 PM
Quote from jlynnbob on 6/15/2005 at 1:07 PM:
"create my own color picker that will satisfy my requirements"...you're such a geek!

Thanks! Wink, I appreciate it!

Lynn B


Lynn,
Less teasing, more running please Tongue Would you prefer that I am less geeky and do everything half assed from now on? 'cuz I will do that, just for you!
view log
AtmBomb of Contemplation
posted: 6/16/2005 at 4:02 AM
..."do everything half assed from now on?"...

Now, you wouldn't want to do that cuz you'd just fall in everytime you tried to go #2! Tongue

I appreciate both the geek and the running side of you Eric!

Gotta run,
Lynn
"I run in the path of your commands for you have set my heart free." Ps 119:32
posted: 6/16/2005 at 2:56 PM
Quote from jlynnbob on 6/16/2005 at 4:02 AM:
Now, you wouldn't want to do that cuz you'd just fall in everytime you tried to go #2! Tongue


I'm so glad that I have you to watch my back! ;)
view log
Go Sens
posted: 6/3/2008 at 10:15 PM
that is so funny. JOKES
view log
posted: 6/30/2008 at 4:27 PM
modified: 6/30/2008 at 4:28 PM
/
I'mma do the things That I wanna do I ain't got a thing To prove to you I'll eat my candy With the pork and beans....
view log
posted: 7/14/2008 at 5:22 PM
Eric....in the circles that you and I 'run' in --- being called a GEEK is the ultimate complement....... Big grin
Goals: Mileage up to 30MPW (Currently at 22 MPW Average)
Weight to 135 (currently 150) - but down from 165
5K in less then 27:00 ( Ran my last 5k in 27:00 FLAT, which was a MAJOR disappointment - Now I'm working very hard to improve this 5K time)
posted: 7/15/2008 at 3:21 AM
Quote from John A on 7/14/2008 at 5:22 PM:
Eric....in the circles that you and I 'run' in --- being called a GEEK is the ultimate complement....... Big grin


John,
I visited a dear friend in Florida last year. Her young son was running around and I was keeping an eye out him when I met one of her neighbors. We talked for a while (sure beats standing there looking like an idiot). Later my friend told me that her neighbor asked what I did for a living. She told her that I work with computers. Her neighbor's reply was, "he doesn't look like a geek..."

*That* is the ultimate compliment. Not that I'm not proud of my occupation, but I'm sure you know how hard it is to shake the stereotype. It is nice to pass as a "normal" person Big grin
view log
got gams?
posted: 7/19/2008 at 3:10 PM
Geeks are hot. Just sayin'. Big grin
Kirsten . . . --> GIRLS GIRLS GIRLS <--

Ladies Locker Room

.: 2008 Goals :.
• Run 1500 miles
• October 5 - 1st marathon - Milwaukee Lakefront - in my home state of WI
• PRs: 5k ~ 15k ~ 25k
Pages: 1
Administration > Behind the Scenes > Color picker