The database holds matched pairs of colors and captions. Whatever you put in the database is shown on the page.
Now if you already had your database populated, you could use find-and-replace in TextMate/TextWrangler/BBEdit to automatically update the caption with the color value.
Or you could hack the script with something like swatch.store('caption', $H(color).values().first() + ' #' + $H(color).keys().first()); up in the colors.each() block. That would keep you from having to edit the database if you didn’t want to do that, at the expense of making the example less clear.
On Nov 19, 2012, at 4:33 PM, DeltaDave wrote:
I thought you could maybe pull it from the JS using something like elm.retrieve(‘caption’ + ‘background-color’) or create a new variable first from the bg color and then include the variable.
This appears to have worked out really well. One of the benefits of holding the colours in an object like this is that you could sort the image swatches based on name, hue, tone, popularity or any other variables.
In my first attempt at this, I created the click observer within in the mouseover observer that showed the popup. What this meant was that each time the mouseover fired, a new handler was created for the click event, which was a waste. Changing it the way I did in the second example put a single click handler on the popup at the beginning of the page load, and never varied it. The only thing that changed was the address – the value of the go variable. By not creating a new handler at each show of the popup, the whole script runs quite a lot faster and that makes the page run better over time. (It also won’t leak a bunch of memory in IE < 10.)
On Nov 21, 2012, at 12:23 PM, DeltaDave wrote:
And nobody has tried to spot the difference?
Oh we have seen the differences but need your superior intellect to make sense of them!