Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- $(function () {
- var $circle = $('#circle'),
- $handler = $('#handler'),
- $p = $('#test'),
- handlerW2 = $handler.width()/2,
- rad = $circle.width()/2,
- offs = $circle.offset(),
- elPos = {x:offs.left, y:offs.top},
- mHold = 0,
- PI2 = Math.PI/180;
- $handler.mousedown(function() { mHold = 1; });
- $(document).mousemove(function(e) {
- if (mHold) {
- var mPos = {x:e.pageX-elPos.x, y:e.pageY-elPos.y},
- atan = Math.atan2(mPos.x-rad, mPos.y-rad),
- deg = -atan/PI2+180,
- perc = (deg*100/360)|0,
- X = Math.round(rad* Math.sin(deg*PI2)),
- Y = Math.round(rad* -Math.cos(deg*PI2));
- $handler.css({left:X+rad-handlerW2, top:Y+rad-handlerW2, transform:'rotate('+deg+'deg)'});
- }
- }).mouseup(function() { mHold = 0; });
- });
- $(function(){
- var $container = $('#rotationSliderContainer');
- var $slider = $('#rotationSlider');
- var $degrees = $('#rotationSliderDegrees');
- var sliderWidth = $slider.width();
- var sliderHeight = $slider.height();
- var radius = $container.width()/2;
- var deg = 0;
- X = Math.round(radius* Math.sin(deg*Math.PI/180));
- Y = Math.round(radius* -Math.cos(deg*Math.PI/180));
- $slider.css({ left: X+radius-sliderWidth/2, top: Y+radius-sliderHeight/2 });
- var mdown = false;
- $container
- .mousedown(function (e) { mdown = true; e.originalEvent.preventDefault(); })
- .mouseup(function (e) { mdown = false; })
- .mousemove(function (e) {
- if(mdown)
- {
- // firefox compatibility
- if(typeof e.offsetX === "undefined" || typeof e.offsetY === "undefined") {
- var targetOffset = $(e.target).offset();
- e.offsetX = e.pageX - targetOffset.left;
- e.offsetY = e.pageY - targetOffset.top;
- }
- if($(e.target).is('#rotationSliderContainer'))
- var mPos = {x: e.offsetX, y: e.offsetY};
- else
- var mPos = {x: e.target.offsetLeft + e.offsetX, y: e.target.offsetTop + e.offsetY};
- var atan = Math.atan2(mPos.x-radius, mPos.y-radius);
- deg = -atan/(Math.PI/180) + 180; // final (0-360 positive) degrees from mouse position
- // for attraction to multiples of 90 degrees
- var distance = Math.abs( deg - ( Math.round(deg / 90) * 90 ) );
- if( distance <= 5 )
- deg = Math.round(deg / 90) * 90;
- if(deg == 360)
- deg = 0;
- X = Math.round(radius* Math.sin(deg*Math.PI/180));
- Y = Math.round(radius* -Math.cos(deg*Math.PI/180));
- $slider.css({ left: X+radius-sliderWidth/2, top: Y+radius-sliderHeight/2 });
- var roundDeg = Math.round(deg);
- $degrees.html(roundDeg + '°');
- $('#imageRotateDegrees').val(roundDeg);
- }
- });
- });
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement