04.11.2015 Views

javascript

Create successful ePaper yourself

Turn your PDF publications into a flip-book with our unique Google optimized e-Paper software.

Chapter 18: Advanced Techniques<br />

(continued)<br />

event = EventUtil.getEvent(event);<br />

var target = EventUtil.getTarget(event);<br />

//determine the type of event<br />

switch(event.type){<br />

case “mousedown”:<br />

if (target.className.indexOf(“draggable”) > -1){<br />

dragging = target;<br />

diffX = event.clientX - target.offsetLeft;<br />

diffY = event.clientY - target.offsetTop;<br />

dragdrop.fire({type:”dragstart”, target: dragging,<br />

x: event.clientX, y: event.clientY});<br />

}<br />

break;<br />

case “mousemove”:<br />

if (dragging !== null){<br />

//get event<br />

event = EventUtil.getEvent(event);<br />

//assign location<br />

dragging.style.left = (event.clientX - diffX) + “px”;<br />

dragging.style.top = (event.clientY - diffY) + “px”;<br />

//fire custom event<br />

dragdrop.fire({type:”drag”, target: dragging,<br />

x: event.clientX, y: event.clientY});<br />

}<br />

break;<br />

};<br />

}<br />

case “mouseup”:<br />

dragdrop.fire({type:”dragend”, target: dragging,<br />

x: event.clientX, y: event.clientY});<br />

dragging = null;<br />

break;<br />

//public interface<br />

dragdrop.enable = function(){<br />

EventUtil.addHandler(document, “mousedown”, handleEvent);<br />

EventUtil.addHandler(document, “mousemove”, handleEvent);<br />

EventUtil.addHandler(document, “mouseup”, handleEvent);<br />

};<br />

dragdrop.disable = function(){<br />

EventUtil.removeHandler(document, “mousedown”, handleEvent);<br />

EventUtil.removeHandler(document, “mousemove”, handleEvent);<br />

614

Hooray! Your file is uploaded and ready to be published.

Saved successfully!

Ooh no, something went wrong!