I'm having some trouble with how jQuery emits it's event objects.
I'm trying to build a functionality where the user clicks a target and drags the mouse to a direction.
I then calculate the rotation to perform on an SVG element.
The problem is that when I click on that element and drag, the event object(which I naively assumed would come from the mousemove) seems to change and it comes from the mousedown of that element being pressed.
If I leave the mousemove event just how it is, without any mousedown's it seems to work just fine.
This is the code I use(mousedown's on the actual element are declared somewhere else):
$(document.body).on('mousemove', '#svgroot' ,function(event){
var selected = svgCanvas.getSelectedElems(),
root_sctm = $('#svgcontent g')[0].getScreenCTM().inverse(),
pt = transformPoint( event.pageX, event.pageY, root_sctm ), //this is where the event object seems to change when 'pressing and holding' over this element
mouse_x = pt.x * current_zoom,
mouse_y = pt.y * current_zoom,
shape = svgCanvas.getElem(svgCanvas.getId());
var real_x = x = mouse_x / current_zoom;
var real_y = y = mouse_y / current_zoom;
var box = svgedit.utilities.getBBox(shape);
console.log(selected)
console.log(box)
var cx = box.x + box.width/2;
var cy = box.y + box.height/2;
var m = getMatrix(shape);
var center = transformPoint(cx,cy,m);
cx = center.x;
cy = center.y;
var ccx = box.x // ne
var ccy = box.y // ne
var grip = event.target;
var griptype = elData(grip, "type");
var current_rotate_mode = elData(grip, "dir");
if (current_rotate_mode == "nw") ccx = box.x + box.width;
if (current_rotate_mode == "se") ccy = box.y + box.height;
if (current_rotate_mode == "sw"){ ccx = box.x + box.width; ccy = box.y + box.height; }
var compensation_angle = ((Math.atan2(cy-ccy,cx-ccx) * (180/Math.PI))-90) % 360;
var angle = ((Math.atan2(cy-y,cx-x) * (180/Math.PI))-90) % 360;
angle += compensation_angle;
svgCanvas.setRotationAngle(angle<-180?(360+angle):angle, true);
console.log(angle);
});
Aucun commentaire:
Enregistrer un commentaire