Dashboard Widgets Drag and Drop

I was playing around last night building a dashboard widget for hexday.com (more as an exercise than anything else).

The aim was to try and replicate as much of the online UI experience as possible, so first task was getting Dojo playing nice with the dashcode setup (more on that in a later post). Once in I was able to use much of the JS from the hexday website, which uses the Dojo Color Picker widget for the picking UI.

It all seemed to be going well, until I discovered a small issue.

The Dojo color picker includes drag and drop support for the hue and the saturation pointers. You can click and and the color updates real time as you move about.

Clicking and dragging in a dashboard widget, starts you dragging the dashboard widget round the page (for repositioning).

I found an apple doc that detailed DND in webkit, including the fact that it’s available in Dashboard but it didn’t detail the issue, or a solution I was seeing. I almost tested the DND in Safari and it works great.

I’m hoping there is some hidden setting I can set, that makes an element in a dashboard widget no longer act as a drag point for widget repositioning. Unfortunately the dashboard widget docs are thin, and there is a real lack of online tutorials or blog posts on the subject (there are some gems, but not as many as I would expect).

So in case anyone out there, who happens upon this post and knows the answer, jump in and let me know what I need to be doing.