I have to build a simulated OS for my college class. I'm making it pretty simple, nothing too fancy and am using HTML5 Canvas. So far I have the icons on a black background and have made them draggable. I want to know how I can make it so when you click on an icon a box appears (just like a real OS) and then closes by clicking on the 'x'. I also want to be able to drag any icon into the trash bin and it disappears. I understand there are click/mouse events, but I don't know how to implement them into the code I have setup. Here's a pic followed by the code:
Sagar got it right, first thing is to add the event to the icons, then you would have to open a window, I don't know if that Kinetic library has that, otherwise you will have to create it yourself using other tools like jQuery UI
About the drag and drop you will have to look into the Kinectic library, it seems to have some DD implementation but you will have to read the docs to check how to do it
My favorite is a chocolate cupcake with white frosting and tiny ad sprinkles.
a bit of art, as a gift, the permaculture playing cards