Buttons on bitmapdata?

[BirdInTheCity]

I have created a faux-3D cylinder using this awesome bit of code:
http://dispatchevent.org/roger/cylinder-mapping/

Now here's the problem: On my rotatable cylinder (see link for visual ref) I want to have an interactive menu appear on the label. (eg A label of "Nutritional Facts" on the cylinder that has rollover buttons for each line).

Is this possible? Can anyone please describe a reference for help or even a starting spot of how to achieve this? I'm thinking it probably involves somehow getting the X/Y coordinates from the distorted bitmapdata and then checking for a button at that point on the original square image. But how would I go about that?

Any and all help would be very much appreciated!
-Brian

[theCodeBot]

I have created a faux-3D cylinder using this awesome bit of code:
http://dispatchevent.org/roger/cylinder-mapping/

Now here's the problem: On my rotatable cylinder (see link for visual ref) I want to have an interactive menu appear on the label. (eg A label of "Nutritional Facts" on the cylinder that has rollover buttons for each line).

Is this possible? Can anyone please describe a reference for help or even a starting spot of how to achieve this? I'm thinking it probably involves somehow getting the X/Y coordinates from the distorted bitmapdata and then checking for a button at that point on the original square image. But how would I go about that?

Any and all help would be very much appreciated!
-Brian
What a pain it would be... but yes, you can do it.
Try creating a bitmap for all of your buttons and put them in their own cylinders, overlapping the background image (can). Have each button's unique cylinder have a click listener, and make sure it only listens when the mouse is actually touching the bitmap inside each cylinder.

In other words, make another class :P

[BirdInTheCity]

Hmm... given the amount of buttons I'd need, it would be far too processor intensive to just continually stack copies of the cylinder. Is there any way to add an additional property to each pixel so that I can scan for it on rollover?

[theCodeBot]

Hmm... given the amount of buttons I'd need, it would be far too processor intensive to just continually stack copies of the cylinder. Is there any way to add an additional property to each pixel so that I can scan for it on rollover?

Perhaps add a mouseMove listener to the cylinder, and check objectsUnderPoint, having invisible sprites warped with the cylinder or something along those lines. I'm not entirely sure.

To be honest with you, i'd play with the source of the cylinder code and add the functionality for buttons.

[BirdInTheCity]

To be honest with you, i'd play with the source of the cylinder code and add the functionality for buttons.
What would that entail? I can't distort the shape of the buttons, can I? Ugh... I think I'm in over my head. :(

[theCodeBot]

What's happening is a case of "The class you have downloaded is a sample. It should be extended. Please do not use this for a commercial project until you've played with it" :P

I would, seriously, look in to the source of the cylinder, and play around with the method calls, see if the developer commented his work, learn from those, tweak variables, etc until you understand how his class works. Once you know, it should be relatively simple to modify it to your own needs, in this case adding a hitArea of sorts.

My assumption (please don't break it down) is that he has a particular loop statement that gets and morphs the pixels of the bitmap. You can most likely add a method that will add a rectangular area to an array of "buttons" in the class. Then in his loop to morph the pixels, tell it to loop through the "buttons" array and "morph" those rectangles as well (this would entail sprites with graphics objects and a while lotta "curveTo" math). When the mouse touches and clicks them, act on it.