1 /* |
1 /* |
2 * imgAreaSelect jQuery plugin |
2 * imgAreaSelect jQuery plugin |
3 * version 0.9.10-wp |
3 * version 0.9.10-wp-6.2 |
4 * |
4 * |
5 * Copyright (c) 2008-2013 Michal Wojciechowski (odyniec.net) |
5 * Copyright (c) 2008-2013 Michal Wojciechowski (odyniec.net) |
6 * |
6 * |
7 * Dual licensed under the MIT (MIT-LICENSE.txt) |
7 * Dual licensed under the MIT (MIT-LICENSE.txt) |
8 * and GPL (GPL-LICENSE.txt) licenses. |
8 * and GPL (GPL-LICENSE.txt) licenses. |
228 * @return Selection object |
228 * @return Selection object |
229 */ |
229 */ |
230 function getSelection(noScale) { |
230 function getSelection(noScale) { |
231 var sx = noScale || scaleX, sy = noScale || scaleY; |
231 var sx = noScale || scaleX, sy = noScale || scaleY; |
232 |
232 |
233 return { x1: round(selection.x1 * sx), |
233 return { x1: floor(selection.x1 * sx), |
234 y1: round(selection.y1 * sy), |
234 y1: floor(selection.y1 * sy), |
235 x2: round(selection.x2 * sx), |
235 x2: floor(selection.x2 * sx), |
236 y2: round(selection.y2 * sy), |
236 y2: floor(selection.y2 * sy), |
237 width: round(selection.x2 * sx) - round(selection.x1 * sx), |
237 width: floor(selection.x2 * sx) - floor(selection.x1 * sx), |
238 height: round(selection.y2 * sy) - round(selection.y1 * sy) }; |
238 height: floor(selection.y2 * sy) - floor(selection.y1 * sy) }; |
239 } |
239 } |
240 |
240 |
241 /** |
241 /** |
242 * Set the current selection |
242 * Set the current selection |
243 * |
243 * |
255 */ |
255 */ |
256 function setSelection(x1, y1, x2, y2, noScale) { |
256 function setSelection(x1, y1, x2, y2, noScale) { |
257 var sx = noScale || scaleX, sy = noScale || scaleY; |
257 var sx = noScale || scaleX, sy = noScale || scaleY; |
258 |
258 |
259 selection = { |
259 selection = { |
260 x1: round(x1 / sx || 0), |
260 x1: floor(x1 / sx || 0), |
261 y1: round(y1 / sy || 0), |
261 y1: floor(y1 / sy || 0), |
262 x2: round(x2 / sx || 0), |
262 x2: floor(x2 / sx || 0), |
263 y2: round(y2 / sy || 0) |
263 y2: floor(y2 / sy || 0) |
264 }; |
264 }; |
265 |
265 |
266 selection.width = selection.x2 - selection.x1; |
266 selection.width = selection.x2 - selection.x1; |
267 selection.height = selection.y2 - selection.y1; |
267 selection.height = selection.y2 - selection.y1; |
268 } |
268 } |
281 |
281 |
282 /* |
282 /* |
283 * Get image offset. The .offset() method returns float values, so they |
283 * Get image offset. The .offset() method returns float values, so they |
284 * need to be rounded. |
284 * need to be rounded. |
285 */ |
285 */ |
286 imgOfs = { left: round($img.offset().left), top: round($img.offset().top) }; |
286 imgOfs = { left: floor($img.offset().left), top: floor($img.offset().top) }; |
287 |
287 |
288 /* Get image dimensions */ |
288 /* Get image dimensions */ |
289 imgWidth = $img.innerWidth(); |
289 imgWidth = $img.innerWidth(); |
290 imgHeight = $img.innerHeight(); |
290 imgHeight = $img.innerHeight(); |
291 |
291 |
292 imgOfs.top += ($img.outerHeight() - imgHeight) >> 1; |
292 imgOfs.top += ($img.outerHeight() - imgHeight) >> 1; |
293 imgOfs.left += ($img.outerWidth() - imgWidth) >> 1; |
293 imgOfs.left += ($img.outerWidth() - imgWidth) >> 1; |
294 |
294 |
295 /* Set minimum and maximum selection area dimensions */ |
295 /* Set minimum and maximum selection area dimensions */ |
296 minWidth = round(options.minWidth / scaleX) || 0; |
296 minWidth = floor(options.minWidth / scaleX) || 0; |
297 minHeight = round(options.minHeight / scaleY) || 0; |
297 minHeight = floor(options.minHeight / scaleY) || 0; |
298 maxWidth = round(min(options.maxWidth / scaleX || 1<<24, imgWidth)); |
298 maxWidth = floor(min(options.maxWidth / scaleX || 1<<24, imgWidth)); |
299 maxHeight = round(min(options.maxHeight / scaleY || 1<<24, imgHeight)); |
299 maxHeight = floor(min(options.maxHeight / scaleY || 1<<24, imgHeight)); |
300 |
300 |
301 /* |
301 /* |
302 * Workaround for jQuery 1.3.2 incorrect offset calculation, originally |
302 * Workaround for jQuery 1.3.2 incorrect offset calculation, originally |
303 * observed in Safari 3. Firefox 2 is also affected. |
303 * observed in Safari 3. Firefox 2 is also affected. |
304 */ |
304 */ |
309 imgOfs.left += max(document.body.scrollLeft, docElem.scrollLeft); |
309 imgOfs.left += max(document.body.scrollLeft, docElem.scrollLeft); |
310 } |
310 } |
311 |
311 |
312 /* Determine parent element offset */ |
312 /* Determine parent element offset */ |
313 parOfs = /absolute|relative/.test($parent.css('position')) ? |
313 parOfs = /absolute|relative/.test($parent.css('position')) ? |
314 { left: round($parent.offset().left) - $parent.scrollLeft(), |
314 { left: floor($parent.offset().left) - $parent.scrollLeft(), |
315 top: round($parent.offset().top) - $parent.scrollTop() } : |
315 top: floor($parent.offset().top) - $parent.scrollTop() } : |
316 position == 'fixed' ? |
316 position == 'fixed' ? |
317 { left: $(document).scrollLeft(), top: $(document).scrollTop() } : |
317 { left: $(document).scrollLeft(), top: $(document).scrollTop() } : |
318 { left: 0, top: 0 }; |
318 { left: 0, top: 0 }; |
319 |
319 |
320 left = viewX(0); |
320 left = viewX(0); |
428 * event handler is not activated |
428 * event handler is not activated |
429 */ |
429 */ |
430 function doUpdate(resetKeyPress) { |
430 function doUpdate(resetKeyPress) { |
431 adjust(); |
431 adjust(); |
432 update(resetKeyPress); |
432 update(resetKeyPress); |
|
433 updateSelectionRelativeToParentElement(); |
|
434 } |
|
435 |
|
436 /** |
|
437 * Set the correct values of x1, y1, x2, and y2. |
|
438 */ |
|
439 function updateSelectionRelativeToParentElement() { |
433 x1 = viewX(selection.x1); y1 = viewY(selection.y1); |
440 x1 = viewX(selection.x1); y1 = viewY(selection.y1); |
434 x2 = viewX(selection.x2); y2 = viewY(selection.y2); |
441 x2 = viewX(selection.x2); y2 = viewY(selection.y2); |
435 } |
442 } |
436 |
443 |
437 /** |
444 /** |
569 function fixAspectRatio(xFirst) { |
576 function fixAspectRatio(xFirst) { |
570 if (aspectRatio) |
577 if (aspectRatio) |
571 if (xFirst) { |
578 if (xFirst) { |
572 x2 = max(left, min(left + imgWidth, |
579 x2 = max(left, min(left + imgWidth, |
573 x1 + abs(y2 - y1) * aspectRatio * (x2 > x1 || -1))); |
580 x1 + abs(y2 - y1) * aspectRatio * (x2 > x1 || -1))); |
574 y2 = round(max(top, min(top + imgHeight, |
581 y2 = floor(max(top, min(top + imgHeight, |
575 y1 + abs(x2 - x1) / aspectRatio * (y2 > y1 || -1)))); |
582 y1 + abs(x2 - x1) / aspectRatio * (y2 > y1 || -1)))); |
576 x2 = round(x2); |
583 x2 = floor(x2); |
577 } |
584 } |
578 else { |
585 else { |
579 y2 = max(top, min(top + imgHeight, |
586 y2 = max(top, min(top + imgHeight, |
580 y1 + abs(x2 - x1) / aspectRatio * (y2 > y1 || -1))); |
587 y1 + abs(x2 - x1) / aspectRatio * (y2 > y1 || -1))); |
581 x2 = round(max(left, min(left + imgWidth, |
588 x2 = floor(max(left, min(left + imgWidth, |
582 x1 + abs(y2 - y1) * aspectRatio * (x2 > x1 || -1)))); |
589 x1 + abs(y2 - y1) * aspectRatio * (x2 > x1 || -1)))); |
583 y2 = round(y2); |
590 y2 = floor(y2); |
584 } |
591 } |
585 } |
592 } |
586 |
593 |
587 /** |
594 /** |
588 * Resize the selection area respecting the minimum/maximum dimensions and |
595 * Resize the selection area respecting the minimum/maximum dimensions and |
589 * aspect ratio |
596 * aspect ratio |
590 */ |
597 */ |
591 function doResize() { |
598 function doResize() { |
|
599 /* |
|
600 * Make sure x1, x2, y1, y2 are initialized to avoid the following calculation |
|
601 * getting incorrect results. |
|
602 */ |
|
603 if ( x1 == null || x2 == null || y1 == null || y2 == null ) { |
|
604 updateSelectionRelativeToParentElement(); |
|
605 } |
|
606 |
592 /* |
607 /* |
593 * Make sure the top left corner of the selection area stays within |
608 * Make sure the top left corner of the selection area stays within |
594 * image boundaries (it might not if the image source was dynamically |
609 * image boundaries (it might not if the image source was dynamically |
595 * changed). |
610 * changed). |
596 */ |
611 */ |
939 /* |
954 /* |
940 * If handle width/height has not been set with CSS rules, set the |
955 * If handle width/height has not been set with CSS rules, set the |
941 * default 5px |
956 * default 5px |
942 */ |
957 */ |
943 if (!parseInt($handles.css('width')) >= 0) |
958 if (!parseInt($handles.css('width')) >= 0) |
944 $handles.width(5).height(5); |
959 $handles.width(10).height(10); |
945 |
960 |
946 /* |
961 /* |
947 * If the borderWidth option is in use, add a solid border to |
962 * If the borderWidth option is in use, add a solid border to |
948 * handles |
963 * handles |
949 */ |
964 */ |