Dragging in processing.js

I am a physics teacher in London and I am trying to learn processing.js

To make teaching resources a very important techniq开发者_运维技巧ue is to be able to drag shapes around. Although I know how to do this in PJS, I have found that the code for having several draggable objects quickly gets messy. (especially if the object is "locked", so that it does not matter if the cursor goes off the object)

Does anybody know how to run the dragging spript from a separate file? i.e. so that the main script calls the dragging script for objects? The idea is that you would draw shapes and simply make them draggable, with the dragging code in a separate file? This would make the creation of teacher resources a lot easier.

It would be great if people could provide some ideas on this. I have seen the drag demos on the main PJS website, but I am looking for something quicker/easier.

Many thanks

Matt Klein

ruby_murray1[AT]hotmail.com

Well, I do processing.js in pure javascript code without bothering with the Processing syntax but it should go something similar:

1. Make the objects that you want draggable adhere to a Draggable interface, the draggable interface indicates what is draggable and provides a method to move an object
2. When drag starts, see if there is a Draggable object under the mouse that you want to drag, store it locally and use the Draggable interface method to move the object around. This way your local dragging code is generic to any Draggable object and objects handle their own movement.
3. On drag end, remove the Draggable object from your local store (and stop calling its move method).

You could pull out this entire dragging logic into an external file as well, as long as you hook it into the correct mouse events.

About Interfaces: http://forum.processing.org/topic/class-interface-block-example