[I want to drag the knob from 0 to 359 degree.]

This worked for me. Thank you.

[How to get the rotation of the knob using method onPress]

10 hours ago, GreenSock said:

Sure, does this help?: 

See the Pen dZYWEY?editors=0010 by GreenSock (@GreenSock) on CodePen

 

Thank you. It worked for me.

 

[How to get the rotation of the knob using method onPress]

I am trying to get the rotation of knob where the click event target using onPress method so that the knob can set to that rotation. For example if I click on 105 degree than the knob should set to 105 degree. Basically I need the clicked target rotation value. I have added the codepen with methods by some reference.Thank you. 

See the Pen EMvbxN by irfanshaikh (@irfanshaikh) on CodePen

[I want to drag the knob from 0 to 359 degree.]

On 3/9/2019 at 10:57 AM, GreenSock said:

The problem is caused by all that code in the onPress that adjusts the rotation - I'm curious why you have that there to begin with. Can't you just simplify it to this?: 

See the Pen 942ac875b5448c63eb539a1a648dfafd by GreenSock (@GreenSock) on CodePen

 

I have written some functionality in onPress, onDrag and onRelease methods which needs to be executed. Here, I need to get the rotation and set my knob to that rotation.

 

function pressHotspotPointer(e) {
    $('#video-container').addClass('grabbing');
    if (!adjusting) {
        var offset = 90;
        // console.log('1st: ' + this.pointerY + ', ' + this.rotationOrigin.y);
        // console.log('2nd: ' + this.pointerX + ', ' + this.rotationOrigin.x);
        var rotationRAD = Math.atan2(
            this.pointerY - this.rotationOrigin.y,
            this.pointerX - this.rotationOrigin.x
        );
        // console.log(rotationRAD);
        var rotation = rotationRAD * RAD2DEG + offset;
        console.log(rotation)
        rotation = Math.round((rotation / 90) * 90);
        console.log(rotation);
        if (rotation > 350 && rotation <= 450) {  
            console.log('rotation inside if');
            rotation = rotation - 370;
        }
        
        // console.log("rotation after: " + rotation);
        TweenLite.set(this.target, { rotation: rotation });
        adjusting = true;
        // this.update();
        this.endDrag(e);
        this.startDrag(e);
        this.isDragging = false;
        adjusting = false;
    } else {
        $('#video-container').removeClass('grabbing');
    }
}

/*----------on release method----------*/
onRelease: function () {
            if ($('#video-container').hasClass('grabbing')) {
                return;
            }

            drawProgressBar(getNearestAngle(this.rotation));
            moveHotspotPointer(getNearestAngle(this.rotation));
            $('#dash-click-' + getNearestAngle(this.rotation)).click();
            $('#video-container').removeClass('grabbing');
        }

 

 

[I want to drag the knob from 0 to 359 degree.]

I am trying to bound the knob from 0 degree to 359 degree. I have added bounds property to the object to bound the rotation.

bounds: {
    minRotation: 0,
    maxRotation: 359,
}

But, when I try to drag the knob from last quadrant(between 270 degree to 359 degree) then the drag jumps and start the drag from 0 degree.

I want the drag should occur from 0 to 359 degree and not to move like a wheel. The user has to drag in anti-clock wise direction to move at 0 degree.

 

Steps to reproduce:

1.  Drag the knob till the last quadrant between 270 degree to 359 degree similar to the clock between 9 - 12 and then leave the mouse.
2.  Start the drag again from where we have left between 270 degree to 359 degree. Here, you can see the drag starts from 0 degree even we have pressed the drag to start from last quadrant between 270 degree to 359 degree.

 

Drag works perfectly in 1st, 2nd and 3rd quadrant but have the issue in 4th quadrant.

If I remove the bounds property it works but, I want the bounds property to bound the drag from 0 to 359 degree. Thank you.

See the Pen KEmRXx by anon (@anon) on CodePen