Allowing user to edit / add / move items in an image

Question

Here's what I'm looking to do:
I have an image, let's say of a room. This is going to be a static image.

I want the user to be able to do the following:
1. add a set of images, like a chair, desk, etc.
2. move items which are already on the image.
3. edit text attached to an image.

I need this image to be stored on the server, as well, so other users can see the updates.

Any ideas? TIA.

Edit
I want to basically have a google maps type interface, where instead of being read only, users can add / edit / move items from a given set. So, for example, I want to let them pick up a "chair" image and slide it onto the image of the room wherever the chair actually is. I've seen bits and pieces done in JQuery, but havevn't found a good example. Hope that makes sense.

Edit2
Found something along the lines of what I was looking for. In case anyone else needs to do something like this, I'm looking at OpenLayers, which mimics GoogleMaps in a JS Framework.

Answer 1

You could implement this making use of the canvas element, but browser support is inconsistent.

as Kane pointed out in the comments you're better off doing this in something like Flash (not Silverlight as, again, it isn't supported by all major browsers)

Answer 2

You could do this by using the transparent png hack on IE and native support of 24 bit pngs by most modern browsers. Store positions in database. Store pngs on the server.