Skip to content

Commit 7825a3d

Browse files
Update jquery.ui.rotatable.js
1 parent 3c4827c commit 7825a3d

File tree

1 file changed

+73
-28
lines changed

1 file changed

+73
-28
lines changed

jquery.ui.rotatable.js

+73-28
Original file line numberDiff line numberDiff line change
@@ -14,6 +14,12 @@
1414
* "alsoRotate" extension (under construction)
1515
* "animate" extension (under construction)
1616
*
17+
* Classes:
18+
* .ui-rotatable {}
19+
* .ui-rotatable-rotating {}
20+
* .ui-rotatable-rotated {}
21+
* .ui-rotatable-handle {}
22+
*
1723
* Usages:
1824
* $('#foo .bar').rotatable();
1925
* $('#foo .bar').resizable().rotatable().draggable();
@@ -67,7 +73,7 @@ $.widget('ui.rotatable', $.ui.mouse, {
6773
elementStartAngle: 0,
6874
elementCurrentAngle: 0,
6975
elementStopAngle: 0,
70-
mouseStartAngle: 0,
76+
mouseStartAngle: null,
7177

7278
_num: function (value) {
7379
return parseFloat(value) || 0;
@@ -135,30 +141,31 @@ $.widget('ui.rotatable', $.ui.mouse, {
135141
return (typeof this.options.rotationOriginPosition.top === 'number') || (typeof this.options.rotationOriginPosition.left === 'number');
136142
},
137143

138-
_getRotationOriginPositionTop: function () {
144+
getRotationOriginPositionTop: function (element) {
139145
if (typeof this.options.rotationOriginPosition.top === 'number') {
140146
return this.options.rotationOriginPosition.top;
141147
}
142-
return Math.round(this.element.height() / 2);
148+
return Math.round(element.height() / 2);
143149
},
144150

145-
_getRotationOriginPositionLeft: function () {
151+
getRotationOriginPositionLeft: function (element) {
146152
if (typeof this.options.rotationOriginPosition.left === 'number') {
147153
return this.options.rotationOriginPosition.left;
148154
}
149-
return Math.round(this.element.width() / 2);
155+
return Math.round(element.width() / 2);
150156
},
151157

152158
_calculateOrigin: function () {
159+
var element = this.element;
153160
var elementOffset = this._getElementOffset();
154161
if (this._isRotationOriginPositionGiven()) {
155162
return {
156-
x: elementOffset.left + this._getRotationOriginPositionLeft(),
157-
y: elementOffset.top + this._getRotationOriginPositionTop()
163+
x: elementOffset.left + this.getRotationOriginPositionLeft(element),
164+
y: elementOffset.top + this.getRotationOriginPositionTop(element)
158165
};
159166
}
160167
// or
161-
var transformOrigin = this.element.css('transform-origin');
168+
var transformOrigin = element.css('transform-origin');
162169
if (typeof transformOrigin === 'string') {
163170
var origin = transformOrigin.match(/([\d.]+)px +([\d.]+)px/);
164171
if (origin !== null) {
@@ -170,15 +177,15 @@ $.widget('ui.rotatable', $.ui.mouse, {
170177
}
171178
// or
172179
return {
173-
x: elementOffset.left + Math.round(this.element.width() / 2),
174-
y: elementOffset.top + Math.round(this.element.height() / 2)
180+
x: elementOffset.left + Math.round(element.width() / 2),
181+
y: elementOffset.top + Math.round(element.height() / 2)
175182
};
176183
},
177184

178185
_calculateRotationAngleViaMousePosition: function (event) {
179186
var origin = this._calculateOrigin();
180187
var mouseAngle = this._calculateMouseAngle(event, origin);
181-
var rotationAngle = mouseAngle - this.mouseStartAngle + this.elementStartAngle;
188+
var rotationAngle = mouseAngle - this._num(this.mouseStartAngle) + this.elementStartAngle;
182189
if (this.options.snap) {
183190
rotationAngle = this._calculateSnap(rotationAngle);
184191
}
@@ -198,7 +205,7 @@ $.widget('ui.rotatable', $.ui.mouse, {
198205
return 0;
199206
}
200207
if (this._isRotationOriginPositionGiven()) {
201-
element.css('transform-origin', this._getRotationOriginPositionLeft() + 'px ' + this._getRotationOriginPositionTop() + 'px');
208+
element.css('transform-origin', this.getRotationOriginPositionLeft(element) + 'px ' + this.getRotationOriginPositionTop(element) + 'px');
202209
}
203210
var newTransform = 'rotate(' + angle + 'deg) ';
204211
if (currentTransform !== 'none') {
@@ -264,13 +271,13 @@ $.widget('ui.rotatable', $.ui.mouse, {
264271

265272
_create: function() {
266273
var o = this.options;
274+
this.handlers = {
275+
_mouseWheel: $.proxy(this._mouseWheel, this)
276+
};
267277
this.element.addClass('ui-rotatable');
268278
if (o.handle) {
269279
this._placeHandle();
270280
}
271-
this.handlers = {
272-
_mouseWheel: $.proxy(this._mouseWheel, this)
273-
};
274281
if (o.wheel) {
275282
this.element.bind('wheel', this.handlers._mouseWheel);
276283
}
@@ -281,17 +288,17 @@ $.widget('ui.rotatable', $.ui.mouse, {
281288

282289
_destroy: function () {
283290
this._mouseDestroy();
284-
this.element.removeClass('ui-rotatable');
291+
this.element.removeClass('ui-rotatable ui-rotatable-rotating ui-rotatable-rotated');
285292
this.element.off('rotatable');
286-
this.element.find('.ui-rotatable-handle:first').remove();
293+
this.element.find('.ui-rotatable-handle').remove();
287294
if (this.options.wheel) {
288295
this.element.unbind('wheel', this.handlers._mouseWheel);
289296
}
290297
},
291298

292299
_placeHandle: function () {
293300
var o = this.options;
294-
if (!this.element) {
301+
if (!this.element || this.element.disabled || o.disabled) {
295302
return;
296303
}
297304
if (!this._canBeParent()) {
@@ -329,6 +336,10 @@ $.widget('ui.rotatable', $.ui.mouse, {
329336
}
330337
},
331338

339+
_displaceHandle: function () {
340+
//
341+
},
342+
332343
_getJqHandle: function () {
333344
var o = this.options;
334345
if (o.handle) {
@@ -362,6 +373,9 @@ $.widget('ui.rotatable', $.ui.mouse, {
362373

363374
_mouseStart: function (event) { // event handler
364375
var element = this.element;
376+
if (!element || element.disabled || this.options.disabled) {
377+
return false;
378+
}
365379
var jqHandle = this._getJqHandle();
366380
var origin = this._calculateOrigin();
367381
this.mouseStartAngle = this._calculateMouseAngle(event, origin);
@@ -379,8 +393,8 @@ $.widget('ui.rotatable', $.ui.mouse, {
379393
},
380394

381395
_mouseDrag: function (event, originalUi) { // event handler
382-
var element = this.element, o = this.options;
383-
if (!element || element.disabled || o.disabled) {
396+
var element = this.element;
397+
if (!element || element.disabled || this.options.disabled) {
384398
return false;
385399
}
386400
var rotationAngle = this._calculateRotationAngleViaMousePosition(event);
@@ -400,7 +414,7 @@ $.widget('ui.rotatable', $.ui.mouse, {
400414

401415
_mouseStop: function (event) { // event handler
402416
var element = this.element;
403-
if (!element) {
417+
if (!element || element.disabled || this.options.disabled) {
404418
return false;
405419
}
406420
this.elementStopAngle = this.elementCurrentAngle;
@@ -414,6 +428,7 @@ $.widget('ui.rotatable', $.ui.mouse, {
414428
var ui = this.ui();
415429
$.ui.plugin.call(this, 'stop', [ event, ui ]); // calling extension methods
416430
this._trigger('stop', event, ui); // calling callback
431+
this.mouseStartAngle = null;
417432
return false;
418433
},
419434

@@ -475,17 +490,46 @@ $.widget('ui.rotatable', $.ui.mouse, {
475490
if (handle === undefined) {
476491
return o.handle;
477492
}
493+
if (handle) {
494+
if (!o.handle) {
495+
this._placeHandle();
496+
}
497+
}
498+
else {
499+
if (o.handle) {
500+
this._displaceHandle();
501+
}
502+
}
478503
o.handle = handle;
479-
if (o.handle) {
480-
this._placeHandle();
504+
},
505+
506+
wheel: function (wheel) {
507+
var element = this.element, o = this.options;
508+
if (wheel === undefined) {
509+
return o.wheel;
481510
}
511+
if (wheel) {
512+
if (!o.wheel) {
513+
element.bind('wheel', this.handlers._mouseWheel);
514+
}
515+
}
516+
else {
517+
if (o.wheel) {
518+
element.unbind('wheel', this.handlers._mouseWheel);
519+
}
520+
}
521+
o.wheel = wheel;
482522
},
483523

484524
handleElementSelector: function (handleElementSelector) { // accessor
485525
var o = this.options;
486526
if (handleElementSelector === undefined) {
487527
return o.handleElementSelector;
488528
}
529+
if (o.handleElementSelector === handleElementSelector) {
530+
return;
531+
}
532+
this._displaceHandle();
489533
o.handleElementSelector = handleElementSelector;
490534
if (o.handle) {
491535
this._placeHandle();
@@ -505,6 +549,10 @@ $.widget('ui.rotatable', $.ui.mouse, {
505549
}
506550
},
507551

552+
currentAngle: function () {
553+
return this.elementCurrentAngle;
554+
},
555+
508556
ui: function () {
509557
return {
510558
element: this.element,
@@ -535,23 +583,20 @@ $.ui.plugin.add('rotatable', 'alsoRotate', {
535583
var instance = $(this).rotatable('instance'), o = instance.options;
536584
$(o.alsoRotate).each(function () {
537585
var element = $(this);
538-
element.data('ui-rotatable-alsorotate', {});
539-
// todo: complete here
586+
// do nothing
540587
});
541588
},
542589

543590
rotate: function (event, ui) {
544591
var instance = $(this).rotatable('instance'), o = instance.options;
545592
$(o.alsoRotate).each(function () {
546593
var element = $(this);
547-
var start = element.data('ui-rotatable-alsorotate');
548594
instance.perform(element, instance.elementCurrentAngle);
549-
// todo: complete here
550595
});
551596
},
552597

553598
stop: function (event, ui) {
554-
$(this).removeData('ui-rotatable-alsorotate');
599+
// do nothing
555600
}
556601

557602
});

0 commit comments

Comments
 (0)