1 | /**
|
---|
2 | * jquery.Jcrop.js v0.9.8
|
---|
3 | * jQuery Image Cropping Plugin
|
---|
4 | * @author Kelly Hallman <khallman@gmail.com>
|
---|
5 | * Copyright (c) 2008-2009 Kelly Hallman - released under MIT License {{{
|
---|
6 | *
|
---|
7 | * Permission is hereby granted, free of charge, to any person
|
---|
8 | * obtaining a copy of this software and associated documentation
|
---|
9 | * files (the "Software"), to deal in the Software without
|
---|
10 | * restriction, including without limitation the rights to use,
|
---|
11 | * copy, modify, merge, publish, distribute, sublicense, and/or sell
|
---|
12 | * copies of the Software, and to permit persons to whom the
|
---|
13 | * Software is furnished to do so, subject to the following
|
---|
14 | * conditions:
|
---|
15 |
|
---|
16 | * The above copyright notice and this permission notice shall be
|
---|
17 | * included in all copies or substantial portions of the Software.
|
---|
18 |
|
---|
19 | * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
|
---|
20 | * EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES
|
---|
21 | * OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
|
---|
22 | * NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT
|
---|
23 | * HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY,
|
---|
24 | * WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
|
---|
25 | * FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR
|
---|
26 | * OTHER DEALINGS IN THE SOFTWARE.
|
---|
27 |
|
---|
28 | * }}}
|
---|
29 | */
|
---|
30 |
|
---|
31 | (function($) {
|
---|
32 |
|
---|
33 | $.Jcrop = function(obj,opt)
|
---|
34 | {
|
---|
35 | // Initialization {{{
|
---|
36 |
|
---|
37 | // Sanitize some options {{{
|
---|
38 | var obj = obj, opt = opt;
|
---|
39 |
|
---|
40 | if (typeof(obj) !== 'object') obj = $(obj)[0];
|
---|
41 | if (typeof(opt) !== 'object') opt = { };
|
---|
42 |
|
---|
43 | // Some on-the-fly fixes for MSIE...sigh
|
---|
44 | if (!('trackDocument' in opt))
|
---|
45 | {
|
---|
46 | opt.trackDocument = $.browser.msie ? false : true;
|
---|
47 | if ($.browser.msie && $.browser.version.split('.')[0] == '8')
|
---|
48 | opt.trackDocument = true;
|
---|
49 | }
|
---|
50 |
|
---|
51 | if (!('keySupport' in opt))
|
---|
52 | opt.keySupport = $.browser.msie ? false : true;
|
---|
53 |
|
---|
54 | // }}}
|
---|
55 | // Extend the default options {{{
|
---|
56 | var defaults = {
|
---|
57 |
|
---|
58 | // Basic Settings
|
---|
59 | trackDocument: false,
|
---|
60 | baseClass: 'jcrop',
|
---|
61 | addClass: null,
|
---|
62 |
|
---|
63 | // Styling Options
|
---|
64 | bgColor: 'black',
|
---|
65 | bgOpacity: .6,
|
---|
66 | borderOpacity: .4,
|
---|
67 | handleOpacity: .5,
|
---|
68 |
|
---|
69 | handlePad: 5,
|
---|
70 | handleSize: 9,
|
---|
71 | handleOffset: 5,
|
---|
72 | edgeMargin: 14,
|
---|
73 |
|
---|
74 | aspectRatio: 0,
|
---|
75 | keySupport: true,
|
---|
76 | cornerHandles: true,
|
---|
77 | sideHandles: true,
|
---|
78 | drawBorders: true,
|
---|
79 | dragEdges: true,
|
---|
80 |
|
---|
81 | boxWidth: 0,
|
---|
82 | boxHeight: 0,
|
---|
83 |
|
---|
84 | boundary: 8,
|
---|
85 | animationDelay: 20,
|
---|
86 | swingSpeed: 3,
|
---|
87 |
|
---|
88 | allowSelect: true,
|
---|
89 | allowMove: true,
|
---|
90 | allowResize: true,
|
---|
91 |
|
---|
92 | minSelect: [ 0, 0 ],
|
---|
93 | maxSize: [ 0, 0 ],
|
---|
94 | minSize: [ 0, 0 ],
|
---|
95 |
|
---|
96 | // Callbacks / Event Handlers
|
---|
97 | onChange: function() { },
|
---|
98 | onSelect: function() { }
|
---|
99 |
|
---|
100 | };
|
---|
101 | var options = defaults;
|
---|
102 | setOptions(opt);
|
---|
103 |
|
---|
104 | // }}}
|
---|
105 | // Initialize some jQuery objects {{{
|
---|
106 |
|
---|
107 | var $origimg = $(obj);
|
---|
108 | var $img = $origimg.clone().removeAttr('id').css({ position: 'absolute' });
|
---|
109 |
|
---|
110 | $img.width($origimg.width());
|
---|
111 | $img.height($origimg.height());
|
---|
112 | $origimg.after($img).hide();
|
---|
113 |
|
---|
114 | presize($img,options.boxWidth,options.boxHeight);
|
---|
115 |
|
---|
116 | var boundx = $img.width(),
|
---|
117 | boundy = $img.height(),
|
---|
118 |
|
---|
119 | $div = $('<div />')
|
---|
120 | .width(boundx).height(boundy)
|
---|
121 | .addClass(cssClass('holder'))
|
---|
122 | .css({
|
---|
123 | position: 'relative',
|
---|
124 | backgroundColor: options.bgColor
|
---|
125 | }).insertAfter($origimg).append($img);
|
---|
126 | ;
|
---|
127 |
|
---|
128 | if (options.addClass) $div.addClass(options.addClass);
|
---|
129 | //$img.wrap($div);
|
---|
130 |
|
---|
131 | var $img2 = $('<img />')/*{{{*/
|
---|
132 | .attr('src',$img.attr('src'))
|
---|
133 | .css('position','absolute')
|
---|
134 | .width(boundx).height(boundy)
|
---|
135 | ;/*}}}*/
|
---|
136 | var $img_holder = $('<div />')/*{{{*/
|
---|
137 | .width(pct(100)).height(pct(100))
|
---|
138 | .css({
|
---|
139 | zIndex: 310,
|
---|
140 | position: 'absolute',
|
---|
141 | overflow: 'hidden'
|
---|
142 | })
|
---|
143 | .append($img2)
|
---|
144 | ;/*}}}*/
|
---|
145 | var $hdl_holder = $('<div />')/*{{{*/
|
---|
146 | .width(pct(100)).height(pct(100))
|
---|
147 | .css('zIndex',320);
|
---|
148 | /*}}}*/
|
---|
149 | var $sel = $('<div />')/*{{{*/
|
---|
150 | .css({
|
---|
151 | position: 'absolute',
|
---|
152 | zIndex: 300
|
---|
153 | })
|
---|
154 | .insertBefore($img)
|
---|
155 | .append($img_holder,$hdl_holder)
|
---|
156 | ;/*}}}*/
|
---|
157 |
|
---|
158 | var bound = options.boundary;
|
---|
159 | var $trk = newTracker().width(boundx+(bound*2)).height(boundy+(bound*2))
|
---|
160 | .css({ position: 'absolute', top: px(-bound), left: px(-bound), zIndex: 290 })
|
---|
161 | .mousedown(newSelection);
|
---|
162 |
|
---|
163 | /* }}} */
|
---|
164 | // Set more variables {{{
|
---|
165 |
|
---|
166 | var xlimit, ylimit, xmin, ymin;
|
---|
167 | var xscale, yscale, enabled = true;
|
---|
168 | var docOffset = getPos($img),
|
---|
169 | // Internal states
|
---|
170 | btndown, lastcurs, dimmed, animating,
|
---|
171 | shift_down;
|
---|
172 |
|
---|
173 | // }}}
|
---|
174 |
|
---|
175 |
|
---|
176 | // }}}
|
---|
177 | // Internal Modules {{{
|
---|
178 |
|
---|
179 | var Coords = function()/*{{{*/
|
---|
180 | {
|
---|
181 | var x1 = 0, y1 = 0, x2 = 0, y2 = 0, ox, oy;
|
---|
182 |
|
---|
183 | function setPressed(pos)/*{{{*/
|
---|
184 | {
|
---|
185 | var pos = rebound(pos);
|
---|
186 | x2 = x1 = pos[0];
|
---|
187 | y2 = y1 = pos[1];
|
---|
188 | };
|
---|
189 | /*}}}*/
|
---|
190 | function setCurrent(pos)/*{{{*/
|
---|
191 | {
|
---|
192 | var pos = rebound(pos);
|
---|
193 | ox = pos[0] - x2;
|
---|
194 | oy = pos[1] - y2;
|
---|
195 | x2 = pos[0];
|
---|
196 | y2 = pos[1];
|
---|
197 | };
|
---|
198 | /*}}}*/
|
---|
199 | function getOffset()/*{{{*/
|
---|
200 | {
|
---|
201 | return [ ox, oy ];
|
---|
202 | };
|
---|
203 | /*}}}*/
|
---|
204 | function moveOffset(offset)/*{{{*/
|
---|
205 | {
|
---|
206 | var ox = offset[0], oy = offset[1];
|
---|
207 |
|
---|
208 | if (0 > x1 + ox) ox -= ox + x1;
|
---|
209 | if (0 > y1 + oy) oy -= oy + y1;
|
---|
210 |
|
---|
211 | if (boundy < y2 + oy) oy += boundy - (y2 + oy);
|
---|
212 | if (boundx < x2 + ox) ox += boundx - (x2 + ox);
|
---|
213 |
|
---|
214 | x1 += ox;
|
---|
215 | x2 += ox;
|
---|
216 | y1 += oy;
|
---|
217 | y2 += oy;
|
---|
218 | };
|
---|
219 | /*}}}*/
|
---|
220 | function getCorner(ord)/*{{{*/
|
---|
221 | {
|
---|
222 | var c = getFixed();
|
---|
223 | switch(ord)
|
---|
224 | {
|
---|
225 | case 'ne': return [ c.x2, c.y ];
|
---|
226 | case 'nw': return [ c.x, c.y ];
|
---|
227 | case 'se': return [ c.x2, c.y2 ];
|
---|
228 | case 'sw': return [ c.x, c.y2 ];
|
---|
229 | }
|
---|
230 | };
|
---|
231 | /*}}}*/
|
---|
232 | function getFixed()/*{{{*/
|
---|
233 | {
|
---|
234 | if (!options.aspectRatio) return getRect();
|
---|
235 | // This function could use some optimization I think...
|
---|
236 | var aspect = options.aspectRatio,
|
---|
237 | min_x = options.minSize[0]/xscale,
|
---|
238 | min_y = options.minSize[1]/yscale,
|
---|
239 | max_x = options.maxSize[0]/xscale,
|
---|
240 | max_y = options.maxSize[1]/yscale,
|
---|
241 | rw = x2 - x1,
|
---|
242 | rh = y2 - y1,
|
---|
243 | rwa = Math.abs(rw),
|
---|
244 | rha = Math.abs(rh),
|
---|
245 | real_ratio = rwa / rha,
|
---|
246 | xx, yy
|
---|
247 | ;
|
---|
248 | if (max_x == 0) { max_x = boundx * 10 }
|
---|
249 | if (max_y == 0) { max_y = boundy * 10 }
|
---|
250 | if (real_ratio < aspect)
|
---|
251 | {
|
---|
252 | yy = y2;
|
---|
253 | w = rha * aspect;
|
---|
254 | xx = rw < 0 ? x1 - w : w + x1;
|
---|
255 |
|
---|
256 | if (xx < 0)
|
---|
257 | {
|
---|
258 | xx = 0;
|
---|
259 | h = Math.abs((xx - x1) / aspect);
|
---|
260 | yy = rh < 0 ? y1 - h: h + y1;
|
---|
261 | }
|
---|
262 | else if (xx > boundx)
|
---|
263 | {
|
---|
264 | xx = boundx;
|
---|
265 | h = Math.abs((xx - x1) / aspect);
|
---|
266 | yy = rh < 0 ? y1 - h : h + y1;
|
---|
267 | }
|
---|
268 | }
|
---|
269 | else
|
---|
270 | {
|
---|
271 | xx = x2;
|
---|
272 | h = rwa / aspect;
|
---|
273 | yy = rh < 0 ? y1 - h : y1 + h;
|
---|
274 | if (yy < 0)
|
---|
275 | {
|
---|
276 | yy = 0;
|
---|
277 | w = Math.abs((yy - y1) * aspect);
|
---|
278 | xx = rw < 0 ? x1 - w : w + x1;
|
---|
279 | }
|
---|
280 | else if (yy > boundy)
|
---|
281 | {
|
---|
282 | yy = boundy;
|
---|
283 | w = Math.abs(yy - y1) * aspect;
|
---|
284 | xx = rw < 0 ? x1 - w : w + x1;
|
---|
285 | }
|
---|
286 | }
|
---|
287 |
|
---|
288 | // Magic %-)
|
---|
289 | if(xx > x1) { // right side
|
---|
290 | if(xx - x1 < min_x) {
|
---|
291 | xx = x1 + min_x;
|
---|
292 | } else if (xx - x1 > max_x) {
|
---|
293 | xx = x1 + max_x;
|
---|
294 | }
|
---|
295 | if(yy > y1) {
|
---|
296 | yy = y1 + (xx - x1)/aspect;
|
---|
297 | } else {
|
---|
298 | yy = y1 - (xx - x1)/aspect;
|
---|
299 | }
|
---|
300 | } else if (xx < x1) { // left side
|
---|
301 | if(x1 - xx < min_x) {
|
---|
302 | xx = x1 - min_x
|
---|
303 | } else if (x1 - xx > max_x) {
|
---|
304 | xx = x1 - max_x;
|
---|
305 | }
|
---|
306 | if(yy > y1) {
|
---|
307 | yy = y1 + (x1 - xx)/aspect;
|
---|
308 | } else {
|
---|
309 | yy = y1 - (x1 - xx)/aspect;
|
---|
310 | }
|
---|
311 | }
|
---|
312 |
|
---|
313 | if(xx < 0) {
|
---|
314 | x1 -= xx;
|
---|
315 | xx = 0;
|
---|
316 | } else if (xx > boundx) {
|
---|
317 | x1 -= xx - boundx;
|
---|
318 | xx = boundx;
|
---|
319 | }
|
---|
320 |
|
---|
321 | if(yy < 0) {
|
---|
322 | y1 -= yy;
|
---|
323 | yy = 0;
|
---|
324 | } else if (yy > boundy) {
|
---|
325 | y1 -= yy - boundy;
|
---|
326 | yy = boundy;
|
---|
327 | }
|
---|
328 |
|
---|
329 | return last = makeObj(flipCoords(x1,y1,xx,yy));
|
---|
330 | };
|
---|
331 | /*}}}*/
|
---|
332 | function rebound(p)/*{{{*/
|
---|
333 | {
|
---|
334 | if (p[0] < 0) p[0] = 0;
|
---|
335 | if (p[1] < 0) p[1] = 0;
|
---|
336 |
|
---|
337 | if (p[0] > boundx) p[0] = boundx;
|
---|
338 | if (p[1] > boundy) p[1] = boundy;
|
---|
339 |
|
---|
340 | return [ p[0], p[1] ];
|
---|
341 | };
|
---|
342 | /*}}}*/
|
---|
343 | function flipCoords(x1,y1,x2,y2)/*{{{*/
|
---|
344 | {
|
---|
345 | var xa = x1, xb = x2, ya = y1, yb = y2;
|
---|
346 | if (x2 < x1)
|
---|
347 | {
|
---|
348 | xa = x2;
|
---|
349 | xb = x1;
|
---|
350 | }
|
---|
351 | if (y2 < y1)
|
---|
352 | {
|
---|
353 | ya = y2;
|
---|
354 | yb = y1;
|
---|
355 | }
|
---|
356 | return [ Math.round(xa), Math.round(ya), Math.round(xb), Math.round(yb) ];
|
---|
357 | };
|
---|
358 | /*}}}*/
|
---|
359 | function getRect()/*{{{*/
|
---|
360 | {
|
---|
361 | var xsize = x2 - x1;
|
---|
362 | var ysize = y2 - y1;
|
---|
363 |
|
---|
364 | if (xlimit && (Math.abs(xsize) > xlimit))
|
---|
365 | x2 = (xsize > 0) ? (x1 + xlimit) : (x1 - xlimit);
|
---|
366 | if (ylimit && (Math.abs(ysize) > ylimit))
|
---|
367 | y2 = (ysize > 0) ? (y1 + ylimit) : (y1 - ylimit);
|
---|
368 |
|
---|
369 | if (ymin && (Math.abs(ysize) < ymin))
|
---|
370 | y2 = (ysize > 0) ? (y1 + ymin) : (y1 - ymin);
|
---|
371 | if (xmin && (Math.abs(xsize) < xmin))
|
---|
372 | x2 = (xsize > 0) ? (x1 + xmin) : (x1 - xmin);
|
---|
373 |
|
---|
374 | if (x1 < 0) { x2 -= x1; x1 -= x1; }
|
---|
375 | if (y1 < 0) { y2 -= y1; y1 -= y1; }
|
---|
376 | if (x2 < 0) { x1 -= x2; x2 -= x2; }
|
---|
377 | if (y2 < 0) { y1 -= y2; y2 -= y2; }
|
---|
378 | if (x2 > boundx) { var delta = x2 - boundx; x1 -= delta; x2 -= delta; }
|
---|
379 | if (y2 > boundy) { var delta = y2 - boundy; y1 -= delta; y2 -= delta; }
|
---|
380 | if (x1 > boundx) { var delta = x1 - boundy; y2 -= delta; y1 -= delta; }
|
---|
381 | if (y1 > boundy) { var delta = y1 - boundy; y2 -= delta; y1 -= delta; }
|
---|
382 |
|
---|
383 | return makeObj(flipCoords(x1,y1,x2,y2));
|
---|
384 | };
|
---|
385 | /*}}}*/
|
---|
386 | function makeObj(a)/*{{{*/
|
---|
387 | {
|
---|
388 | return { x: a[0], y: a[1], x2: a[2], y2: a[3],
|
---|
389 | w: a[2] - a[0], h: a[3] - a[1] };
|
---|
390 | };
|
---|
391 | /*}}}*/
|
---|
392 |
|
---|
393 | return {
|
---|
394 | flipCoords: flipCoords,
|
---|
395 | setPressed: setPressed,
|
---|
396 | setCurrent: setCurrent,
|
---|
397 | getOffset: getOffset,
|
---|
398 | moveOffset: moveOffset,
|
---|
399 | getCorner: getCorner,
|
---|
400 | getFixed: getFixed
|
---|
401 | };
|
---|
402 | }();
|
---|
403 |
|
---|
404 | /*}}}*/
|
---|
405 | var Selection = function()/*{{{*/
|
---|
406 | {
|
---|
407 | var start, end, dragmode, awake, hdep = 370;
|
---|
408 | var borders = { };
|
---|
409 | var handle = { };
|
---|
410 | var seehandles = false;
|
---|
411 | var hhs = options.handleOffset;
|
---|
412 |
|
---|
413 | /* Insert draggable elements {{{*/
|
---|
414 |
|
---|
415 | // Insert border divs for outline
|
---|
416 | if (options.drawBorders) {
|
---|
417 | borders = {
|
---|
418 | top: insertBorder('hline')
|
---|
419 | .css('top',$.browser.msie?px(-1):px(0)),
|
---|
420 | bottom: insertBorder('hline'),
|
---|
421 | left: insertBorder('vline'),
|
---|
422 | right: insertBorder('vline')
|
---|
423 | };
|
---|
424 | }
|
---|
425 |
|
---|
426 | // Insert handles on edges
|
---|
427 | if (options.dragEdges) {
|
---|
428 | handle.t = insertDragbar('n');
|
---|
429 | handle.b = insertDragbar('s');
|
---|
430 | handle.r = insertDragbar('e');
|
---|
431 | handle.l = insertDragbar('w');
|
---|
432 | }
|
---|
433 |
|
---|
434 | // Insert side handles
|
---|
435 | options.sideHandles &&
|
---|
436 | createHandles(['n','s','e','w']);
|
---|
437 |
|
---|
438 | // Insert corner handles
|
---|
439 | options.cornerHandles &&
|
---|
440 | createHandles(['sw','nw','ne','se']);
|
---|
441 |
|
---|
442 | /*}}}*/
|
---|
443 | // Private Methods
|
---|
444 | function insertBorder(type)/*{{{*/
|
---|
445 | {
|
---|
446 | var jq = $('<div />')
|
---|
447 | .css({position: 'absolute', opacity: options.borderOpacity })
|
---|
448 | .addClass(cssClass(type));
|
---|
449 | $img_holder.append(jq);
|
---|
450 | return jq;
|
---|
451 | };
|
---|
452 | /*}}}*/
|
---|
453 | function dragDiv(ord,zi)/*{{{*/
|
---|
454 | {
|
---|
455 | var jq = $('<div />')
|
---|
456 | .mousedown(createDragger(ord))
|
---|
457 | .css({
|
---|
458 | cursor: ord+'-resize',
|
---|
459 | position: 'absolute',
|
---|
460 | zIndex: zi
|
---|
461 | })
|
---|
462 | ;
|
---|
463 | $hdl_holder.append(jq);
|
---|
464 | return jq;
|
---|
465 | };
|
---|
466 | /*}}}*/
|
---|
467 | function insertHandle(ord)/*{{{*/
|
---|
468 | {
|
---|
469 | return dragDiv(ord,hdep++)
|
---|
470 | .css({ top: px(-hhs+1), left: px(-hhs+1), opacity: options.handleOpacity })
|
---|
471 | .addClass(cssClass('handle'));
|
---|
472 | };
|
---|
473 | /*}}}*/
|
---|
474 | function insertDragbar(ord)/*{{{*/
|
---|
475 | {
|
---|
476 | var s = options.handleSize,
|
---|
477 | o = hhs,
|
---|
478 | h = s, w = s,
|
---|
479 | t = o, l = o;
|
---|
480 |
|
---|
481 | switch(ord)
|
---|
482 | {
|
---|
483 | case 'n': case 's': w = pct(100); break;
|
---|
484 | case 'e': case 'w': h = pct(100); break;
|
---|
485 | }
|
---|
486 |
|
---|
487 | return dragDiv(ord,hdep++).width(w).height(h)
|
---|
488 | .css({ top: px(-t+1), left: px(-l+1)});
|
---|
489 | };
|
---|
490 | /*}}}*/
|
---|
491 | function createHandles(li)/*{{{*/
|
---|
492 | {
|
---|
493 | for(i in li) handle[li[i]] = insertHandle(li[i]);
|
---|
494 | };
|
---|
495 | /*}}}*/
|
---|
496 | function moveHandles(c)/*{{{*/
|
---|
497 | {
|
---|
498 | var midvert = Math.round((c.h / 2) - hhs),
|
---|
499 | midhoriz = Math.round((c.w / 2) - hhs),
|
---|
500 | north = west = -hhs+1,
|
---|
501 | east = c.w - hhs,
|
---|
502 | south = c.h - hhs,
|
---|
503 | x, y;
|
---|
504 |
|
---|
505 | 'e' in handle &&
|
---|
506 | handle.e.css({ top: px(midvert), left: px(east) }) &&
|
---|
507 | handle.w.css({ top: px(midvert) }) &&
|
---|
508 | handle.s.css({ top: px(south), left: px(midhoriz) }) &&
|
---|
509 | handle.n.css({ left: px(midhoriz) });
|
---|
510 |
|
---|
511 | 'ne' in handle &&
|
---|
512 | handle.ne.css({ left: px(east) }) &&
|
---|
513 | handle.se.css({ top: px(south), left: px(east) }) &&
|
---|
514 | handle.sw.css({ top: px(south) });
|
---|
515 |
|
---|
516 | 'b' in handle &&
|
---|
517 | handle.b.css({ top: px(south) }) &&
|
---|
518 | handle.r.css({ left: px(east) });
|
---|
519 | };
|
---|
520 | /*}}}*/
|
---|
521 | function moveto(x,y)/*{{{*/
|
---|
522 | {
|
---|
523 | $img2.css({ top: px(-y), left: px(-x) });
|
---|
524 | $sel.css({ top: px(y), left: px(x) });
|
---|
525 | };
|
---|
526 | /*}}}*/
|
---|
527 | function resize(w,h)/*{{{*/
|
---|
528 | {
|
---|
529 | $sel.width(w).height(h);
|
---|
530 | };
|
---|
531 | /*}}}*/
|
---|
532 | function refresh()/*{{{*/
|
---|
533 | {
|
---|
534 | var c = Coords.getFixed();
|
---|
535 |
|
---|
536 | Coords.setPressed([c.x,c.y]);
|
---|
537 | Coords.setCurrent([c.x2,c.y2]);
|
---|
538 |
|
---|
539 | updateVisible();
|
---|
540 | };
|
---|
541 | /*}}}*/
|
---|
542 |
|
---|
543 | // Internal Methods
|
---|
544 | function updateVisible()/*{{{*/
|
---|
545 | { if (awake) return update(); };
|
---|
546 | /*}}}*/
|
---|
547 | function update()/*{{{*/
|
---|
548 | {
|
---|
549 | var c = Coords.getFixed();
|
---|
550 |
|
---|
551 | resize(c.w,c.h);
|
---|
552 | moveto(c.x,c.y);
|
---|
553 |
|
---|
554 | options.drawBorders &&
|
---|
555 | borders['right'].css({ left: px(c.w-1) }) &&
|
---|
556 | borders['bottom'].css({ top: px(c.h-1) });
|
---|
557 |
|
---|
558 | seehandles && moveHandles(c);
|
---|
559 | awake || show();
|
---|
560 |
|
---|
561 | options.onChange(unscale(c));
|
---|
562 | };
|
---|
563 | /*}}}*/
|
---|
564 | function show()/*{{{*/
|
---|
565 | {
|
---|
566 | $sel.show();
|
---|
567 | $img.css('opacity',options.bgOpacity);
|
---|
568 | awake = true;
|
---|
569 | };
|
---|
570 | /*}}}*/
|
---|
571 | function release()/*{{{*/
|
---|
572 | {
|
---|
573 | disableHandles();
|
---|
574 | $sel.hide();
|
---|
575 | $img.css('opacity',1);
|
---|
576 | awake = false;
|
---|
577 | };
|
---|
578 | /*}}}*/
|
---|
579 | function showHandles()//{{{
|
---|
580 | {
|
---|
581 | if (seehandles)
|
---|
582 | {
|
---|
583 | moveHandles(Coords.getFixed());
|
---|
584 | $hdl_holder.show();
|
---|
585 | }
|
---|
586 | };
|
---|
587 | //}}}
|
---|
588 | function enableHandles()/*{{{*/
|
---|
589 | {
|
---|
590 | seehandles = true;
|
---|
591 | if (options.allowResize)
|
---|
592 | {
|
---|
593 | moveHandles(Coords.getFixed());
|
---|
594 | $hdl_holder.show();
|
---|
595 | return true;
|
---|
596 | }
|
---|
597 | };
|
---|
598 | /*}}}*/
|
---|
599 | function disableHandles()/*{{{*/
|
---|
600 | {
|
---|
601 | seehandles = false;
|
---|
602 | $hdl_holder.hide();
|
---|
603 | };
|
---|
604 | /*}}}*/
|
---|
605 | function animMode(v)/*{{{*/
|
---|
606 | {
|
---|
607 | (animating = v) ? disableHandles(): enableHandles();
|
---|
608 | };
|
---|
609 | /*}}}*/
|
---|
610 | function done()/*{{{*/
|
---|
611 | {
|
---|
612 | animMode(false);
|
---|
613 | refresh();
|
---|
614 | };
|
---|
615 | /*}}}*/
|
---|
616 |
|
---|
617 | var $track = newTracker().mousedown(createDragger('move'))
|
---|
618 | .css({ cursor: 'move', position: 'absolute', zIndex: 360 })
|
---|
619 |
|
---|
620 | $img_holder.append($track);
|
---|
621 | disableHandles();
|
---|
622 |
|
---|
623 | return {
|
---|
624 | updateVisible: updateVisible,
|
---|
625 | update: update,
|
---|
626 | release: release,
|
---|
627 | refresh: refresh,
|
---|
628 | setCursor: function (cursor) { $track.css('cursor',cursor); },
|
---|
629 | enableHandles: enableHandles,
|
---|
630 | enableOnly: function() { seehandles = true; },
|
---|
631 | showHandles: showHandles,
|
---|
632 | disableHandles: disableHandles,
|
---|
633 | animMode: animMode,
|
---|
634 | done: done
|
---|
635 | };
|
---|
636 | }();
|
---|
637 | /*}}}*/
|
---|
638 | var Tracker = function()/*{{{*/
|
---|
639 | {
|
---|
640 | var onMove = function() { },
|
---|
641 | onDone = function() { },
|
---|
642 | trackDoc = options.trackDocument;
|
---|
643 |
|
---|
644 | if (!trackDoc)
|
---|
645 | {
|
---|
646 | $trk
|
---|
647 | .mousemove(trackMove)
|
---|
648 | .mouseup(trackUp)
|
---|
649 | .mouseout(trackUp)
|
---|
650 | ;
|
---|
651 | }
|
---|
652 |
|
---|
653 | function toFront()/*{{{*/
|
---|
654 | {
|
---|
655 | $trk.css({zIndex:450});
|
---|
656 | if (trackDoc)
|
---|
657 | {
|
---|
658 | $(document)
|
---|
659 | .mousemove(trackMove)
|
---|
660 | .mouseup(trackUp)
|
---|
661 | ;
|
---|
662 | }
|
---|
663 | }
|
---|
664 | /*}}}*/
|
---|
665 | function toBack()/*{{{*/
|
---|
666 | {
|
---|
667 | $trk.css({zIndex:290});
|
---|
668 | if (trackDoc)
|
---|
669 | {
|
---|
670 | $(document)
|
---|
671 | .unbind('mousemove',trackMove)
|
---|
672 | .unbind('mouseup',trackUp)
|
---|
673 | ;
|
---|
674 | }
|
---|
675 | }
|
---|
676 | /*}}}*/
|
---|
677 | function trackMove(e)/*{{{*/
|
---|
678 | {
|
---|
679 | onMove(mouseAbs(e));
|
---|
680 | };
|
---|
681 | /*}}}*/
|
---|
682 | function trackUp(e)/*{{{*/
|
---|
683 | {
|
---|
684 | e.preventDefault();
|
---|
685 | e.stopPropagation();
|
---|
686 |
|
---|
687 | if (btndown)
|
---|
688 | {
|
---|
689 | btndown = false;
|
---|
690 |
|
---|
691 | onDone(mouseAbs(e));
|
---|
692 | options.onSelect(unscale(Coords.getFixed()));
|
---|
693 | toBack();
|
---|
694 | onMove = function() { };
|
---|
695 | onDone = function() { };
|
---|
696 | }
|
---|
697 |
|
---|
698 | return false;
|
---|
699 | };
|
---|
700 | /*}}}*/
|
---|
701 |
|
---|
702 | function activateHandlers(move,done)/* {{{ */
|
---|
703 | {
|
---|
704 | btndown = true;
|
---|
705 | onMove = move;
|
---|
706 | onDone = done;
|
---|
707 | toFront();
|
---|
708 | return false;
|
---|
709 | };
|
---|
710 | /* }}} */
|
---|
711 |
|
---|
712 | function setCursor(t) { $trk.css('cursor',t); };
|
---|
713 |
|
---|
714 | $img.before($trk);
|
---|
715 | return {
|
---|
716 | activateHandlers: activateHandlers,
|
---|
717 | setCursor: setCursor
|
---|
718 | };
|
---|
719 | }();
|
---|
720 | /*}}}*/
|
---|
721 | var KeyManager = function()/*{{{*/
|
---|
722 | {
|
---|
723 | var $keymgr = $('<input type="radio" />')
|
---|
724 | .css({ position: 'absolute', left: '-30px' })
|
---|
725 | .keypress(parseKey)
|
---|
726 | .blur(onBlur),
|
---|
727 |
|
---|
728 | $keywrap = $('<div />')
|
---|
729 | .css({
|
---|
730 | position: 'absolute',
|
---|
731 | overflow: 'hidden'
|
---|
732 | })
|
---|
733 | .append($keymgr)
|
---|
734 | ;
|
---|
735 |
|
---|
736 | function watchKeys()/*{{{*/
|
---|
737 | {
|
---|
738 | if (options.keySupport)
|
---|
739 | {
|
---|
740 | $keymgr.show();
|
---|
741 | $keymgr.focus();
|
---|
742 | }
|
---|
743 | };
|
---|
744 | /*}}}*/
|
---|
745 | function onBlur(e)/*{{{*/
|
---|
746 | {
|
---|
747 | $keymgr.hide();
|
---|
748 | };
|
---|
749 | /*}}}*/
|
---|
750 | function doNudge(e,x,y)/*{{{*/
|
---|
751 | {
|
---|
752 | if (options.allowMove) {
|
---|
753 | Coords.moveOffset([x,y]);
|
---|
754 | Selection.updateVisible();
|
---|
755 | };
|
---|
756 | e.preventDefault();
|
---|
757 | e.stopPropagation();
|
---|
758 | };
|
---|
759 | /*}}}*/
|
---|
760 | function parseKey(e)/*{{{*/
|
---|
761 | {
|
---|
762 | if (e.ctrlKey) return true;
|
---|
763 | shift_down = e.shiftKey ? true : false;
|
---|
764 | var nudge = shift_down ? 10 : 1;
|
---|
765 | switch(e.keyCode)
|
---|
766 | {
|
---|
767 | case 37: doNudge(e,-nudge,0); break;
|
---|
768 | case 39: doNudge(e,nudge,0); break;
|
---|
769 | case 38: doNudge(e,0,-nudge); break;
|
---|
770 | case 40: doNudge(e,0,nudge); break;
|
---|
771 |
|
---|
772 | case 27: Selection.release(); break;
|
---|
773 |
|
---|
774 | case 9: return true;
|
---|
775 | }
|
---|
776 |
|
---|
777 | return nothing(e);
|
---|
778 | };
|
---|
779 | /*}}}*/
|
---|
780 |
|
---|
781 | if (options.keySupport) $keywrap.insertBefore($img);
|
---|
782 | return {
|
---|
783 | watchKeys: watchKeys
|
---|
784 | };
|
---|
785 | }();
|
---|
786 | /*}}}*/
|
---|
787 |
|
---|
788 | // }}}
|
---|
789 | // Internal Methods {{{
|
---|
790 |
|
---|
791 | function px(n) { return '' + parseInt(n) + 'px'; };
|
---|
792 | function pct(n) { return '' + parseInt(n) + '%'; };
|
---|
793 | function cssClass(cl) { return options.baseClass + '-' + cl; };
|
---|
794 | function getPos(obj)/*{{{*/
|
---|
795 | {
|
---|
796 | // Updated in v0.9.4 to use built-in dimensions plugin
|
---|
797 | var pos = $(obj).offset();
|
---|
798 | return [ pos.left, pos.top ];
|
---|
799 | };
|
---|
800 | /*}}}*/
|
---|
801 | function mouseAbs(e)/*{{{*/
|
---|
802 | {
|
---|
803 | return [ (e.pageX - docOffset[0]), (e.pageY - docOffset[1]) ];
|
---|
804 | };
|
---|
805 | /*}}}*/
|
---|
806 | function myCursor(type)/*{{{*/
|
---|
807 | {
|
---|
808 | if (type != lastcurs)
|
---|
809 | {
|
---|
810 | Tracker.setCursor(type);
|
---|
811 | //Handles.xsetCursor(type);
|
---|
812 | lastcurs = type;
|
---|
813 | }
|
---|
814 | };
|
---|
815 | /*}}}*/
|
---|
816 | function startDragMode(mode,pos)/*{{{*/
|
---|
817 | {
|
---|
818 | docOffset = getPos($img);
|
---|
819 | Tracker.setCursor(mode=='move'?mode:mode+'-resize');
|
---|
820 |
|
---|
821 | if (mode == 'move')
|
---|
822 | return Tracker.activateHandlers(createMover(pos), doneSelect);
|
---|
823 |
|
---|
824 | var fc = Coords.getFixed();
|
---|
825 | var opp = oppLockCorner(mode);
|
---|
826 | var opc = Coords.getCorner(oppLockCorner(opp));
|
---|
827 |
|
---|
828 | Coords.setPressed(Coords.getCorner(opp));
|
---|
829 | Coords.setCurrent(opc);
|
---|
830 |
|
---|
831 | Tracker.activateHandlers(dragmodeHandler(mode,fc),doneSelect);
|
---|
832 | };
|
---|
833 | /*}}}*/
|
---|
834 | function dragmodeHandler(mode,f)/*{{{*/
|
---|
835 | {
|
---|
836 | return function(pos) {
|
---|
837 | if (!options.aspectRatio) switch(mode)
|
---|
838 | {
|
---|
839 | case 'e': pos[1] = f.y2; break;
|
---|
840 | case 'w': pos[1] = f.y2; break;
|
---|
841 | case 'n': pos[0] = f.x2; break;
|
---|
842 | case 's': pos[0] = f.x2; break;
|
---|
843 | }
|
---|
844 | else switch(mode)
|
---|
845 | {
|
---|
846 | case 'e': pos[1] = f.y+1; break;
|
---|
847 | case 'w': pos[1] = f.y+1; break;
|
---|
848 | case 'n': pos[0] = f.x+1; break;
|
---|
849 | case 's': pos[0] = f.x+1; break;
|
---|
850 | }
|
---|
851 | Coords.setCurrent(pos);
|
---|
852 | Selection.update();
|
---|
853 | };
|
---|
854 | };
|
---|
855 | /*}}}*/
|
---|
856 | function createMover(pos)/*{{{*/
|
---|
857 | {
|
---|
858 | var lloc = pos;
|
---|
859 | KeyManager.watchKeys();
|
---|
860 |
|
---|
861 | return function(pos)
|
---|
862 | {
|
---|
863 | Coords.moveOffset([pos[0] - lloc[0], pos[1] - lloc[1]]);
|
---|
864 | lloc = pos;
|
---|
865 |
|
---|
866 | Selection.update();
|
---|
867 | };
|
---|
868 | };
|
---|
869 | /*}}}*/
|
---|
870 | function oppLockCorner(ord)/*{{{*/
|
---|
871 | {
|
---|
872 | switch(ord)
|
---|
873 | {
|
---|
874 | case 'n': return 'sw';
|
---|
875 | case 's': return 'nw';
|
---|
876 | case 'e': return 'nw';
|
---|
877 | case 'w': return 'ne';
|
---|
878 | case 'ne': return 'sw';
|
---|
879 | case 'nw': return 'se';
|
---|
880 | case 'se': return 'nw';
|
---|
881 | case 'sw': return 'ne';
|
---|
882 | };
|
---|
883 | };
|
---|
884 | /*}}}*/
|
---|
885 | function createDragger(ord)/*{{{*/
|
---|
886 | {
|
---|
887 | return function(e) {
|
---|
888 | if (options.disabled) return false;
|
---|
889 | if ((ord == 'move') && !options.allowMove) return false;
|
---|
890 | btndown = true;
|
---|
891 | startDragMode(ord,mouseAbs(e));
|
---|
892 | e.stopPropagation();
|
---|
893 | e.preventDefault();
|
---|
894 | return false;
|
---|
895 | };
|
---|
896 | };
|
---|
897 | /*}}}*/
|
---|
898 | function presize($obj,w,h)/*{{{*/
|
---|
899 | {
|
---|
900 | var nw = $obj.width(), nh = $obj.height();
|
---|
901 | if ((nw > w) && w > 0)
|
---|
902 | {
|
---|
903 | nw = w;
|
---|
904 | nh = (w/$obj.width()) * $obj.height();
|
---|
905 | }
|
---|
906 | if ((nh > h) && h > 0)
|
---|
907 | {
|
---|
908 | nh = h;
|
---|
909 | nw = (h/$obj.height()) * $obj.width();
|
---|
910 | }
|
---|
911 | xscale = $obj.width() / nw;
|
---|
912 | yscale = $obj.height() / nh;
|
---|
913 | $obj.width(nw).height(nh);
|
---|
914 | };
|
---|
915 | /*}}}*/
|
---|
916 | function unscale(c)/*{{{*/
|
---|
917 | {
|
---|
918 | return {
|
---|
919 | x: parseInt(c.x * xscale), y: parseInt(c.y * yscale),
|
---|
920 | x2: parseInt(c.x2 * xscale), y2: parseInt(c.y2 * yscale),
|
---|
921 | w: parseInt(c.w * xscale), h: parseInt(c.h * yscale)
|
---|
922 | };
|
---|
923 | };
|
---|
924 | /*}}}*/
|
---|
925 | function doneSelect(pos)/*{{{*/
|
---|
926 | {
|
---|
927 | var c = Coords.getFixed();
|
---|
928 | if (c.w > options.minSelect[0] && c.h > options.minSelect[1])
|
---|
929 | {
|
---|
930 | Selection.enableHandles();
|
---|
931 | Selection.done();
|
---|
932 | }
|
---|
933 | else
|
---|
934 | {
|
---|
935 | Selection.release();
|
---|
936 | }
|
---|
937 | Tracker.setCursor( options.allowSelect?'crosshair':'default' );
|
---|
938 | };
|
---|
939 | /*}}}*/
|
---|
940 | function newSelection(e)/*{{{*/
|
---|
941 | {
|
---|
942 | if (options.disabled) return false;
|
---|
943 | if (!options.allowSelect) return false;
|
---|
944 | btndown = true;
|
---|
945 | docOffset = getPos($img);
|
---|
946 | Selection.disableHandles();
|
---|
947 | myCursor('crosshair');
|
---|
948 | var pos = mouseAbs(e);
|
---|
949 | Coords.setPressed(pos);
|
---|
950 | Tracker.activateHandlers(selectDrag,doneSelect);
|
---|
951 | KeyManager.watchKeys();
|
---|
952 | Selection.update();
|
---|
953 |
|
---|
954 | e.stopPropagation();
|
---|
955 | e.preventDefault();
|
---|
956 | return false;
|
---|
957 | };
|
---|
958 | /*}}}*/
|
---|
959 | function selectDrag(pos)/*{{{*/
|
---|
960 | {
|
---|
961 | Coords.setCurrent(pos);
|
---|
962 | Selection.update();
|
---|
963 | };
|
---|
964 | /*}}}*/
|
---|
965 | function newTracker()
|
---|
966 | {
|
---|
967 | var trk = $('<div></div>').addClass(cssClass('tracker'));
|
---|
968 | $.browser.msie && trk.css({ opacity: 0, backgroundColor: 'white' });
|
---|
969 | return trk;
|
---|
970 | };
|
---|
971 |
|
---|
972 | // }}}
|
---|
973 | // API methods {{{
|
---|
974 |
|
---|
975 | function animateTo(a)/*{{{*/
|
---|
976 | {
|
---|
977 | var x1 = a[0] / xscale,
|
---|
978 | y1 = a[1] / yscale,
|
---|
979 | x2 = a[2] / xscale,
|
---|
980 | y2 = a[3] / yscale;
|
---|
981 |
|
---|
982 | if (animating) return;
|
---|
983 |
|
---|
984 | var animto = Coords.flipCoords(x1,y1,x2,y2);
|
---|
985 | var c = Coords.getFixed();
|
---|
986 | var animat = initcr = [ c.x, c.y, c.x2, c.y2 ];
|
---|
987 | var interv = options.animationDelay;
|
---|
988 |
|
---|
989 | var x = animat[0];
|
---|
990 | var y = animat[1];
|
---|
991 | var x2 = animat[2];
|
---|
992 | var y2 = animat[3];
|
---|
993 | var ix1 = animto[0] - initcr[0];
|
---|
994 | var iy1 = animto[1] - initcr[1];
|
---|
995 | var ix2 = animto[2] - initcr[2];
|
---|
996 | var iy2 = animto[3] - initcr[3];
|
---|
997 | var pcent = 0;
|
---|
998 | var velocity = options.swingSpeed;
|
---|
999 |
|
---|
1000 | Selection.animMode(true);
|
---|
1001 |
|
---|
1002 | var animator = function()
|
---|
1003 | {
|
---|
1004 | return function()
|
---|
1005 | {
|
---|
1006 | pcent += (100 - pcent) / velocity;
|
---|
1007 |
|
---|
1008 | animat[0] = x + ((pcent / 100) * ix1);
|
---|
1009 | animat[1] = y + ((pcent / 100) * iy1);
|
---|
1010 | animat[2] = x2 + ((pcent / 100) * ix2);
|
---|
1011 | animat[3] = y2 + ((pcent / 100) * iy2);
|
---|
1012 |
|
---|
1013 | if (pcent < 100) animateStart();
|
---|
1014 | else Selection.done();
|
---|
1015 |
|
---|
1016 | if (pcent >= 99.8) pcent = 100;
|
---|
1017 |
|
---|
1018 | setSelectRaw(animat);
|
---|
1019 | };
|
---|
1020 | }();
|
---|
1021 |
|
---|
1022 | function animateStart()
|
---|
1023 | { window.setTimeout(animator,interv); };
|
---|
1024 |
|
---|
1025 | animateStart();
|
---|
1026 | };
|
---|
1027 | /*}}}*/
|
---|
1028 | function setSelect(rect)//{{{
|
---|
1029 | {
|
---|
1030 | setSelectRaw([rect[0]/xscale,rect[1]/yscale,rect[2]/xscale,rect[3]/yscale]);
|
---|
1031 | };
|
---|
1032 | //}}}
|
---|
1033 | function setSelectRaw(l) /*{{{*/
|
---|
1034 | {
|
---|
1035 | Coords.setPressed([l[0],l[1]]);
|
---|
1036 | Coords.setCurrent([l[2],l[3]]);
|
---|
1037 | Selection.update();
|
---|
1038 | };
|
---|
1039 | /*}}}*/
|
---|
1040 | function setOptions(opt)/*{{{*/
|
---|
1041 | {
|
---|
1042 | if (typeof(opt) != 'object') opt = { };
|
---|
1043 | options = $.extend(options,opt);
|
---|
1044 |
|
---|
1045 | if (typeof(options.onChange)!=='function')
|
---|
1046 | options.onChange = function() { };
|
---|
1047 |
|
---|
1048 | if (typeof(options.onSelect)!=='function')
|
---|
1049 | options.onSelect = function() { };
|
---|
1050 |
|
---|
1051 | };
|
---|
1052 | /*}}}*/
|
---|
1053 | function tellSelect()/*{{{*/
|
---|
1054 | {
|
---|
1055 | return unscale(Coords.getFixed());
|
---|
1056 | };
|
---|
1057 | /*}}}*/
|
---|
1058 | function tellScaled()/*{{{*/
|
---|
1059 | {
|
---|
1060 | return Coords.getFixed();
|
---|
1061 | };
|
---|
1062 | /*}}}*/
|
---|
1063 | function setOptionsNew(opt)/*{{{*/
|
---|
1064 | {
|
---|
1065 | setOptions(opt);
|
---|
1066 | interfaceUpdate();
|
---|
1067 | };
|
---|
1068 | /*}}}*/
|
---|
1069 | function disableCrop()//{{{
|
---|
1070 | {
|
---|
1071 | options.disabled = true;
|
---|
1072 | Selection.disableHandles();
|
---|
1073 | Selection.setCursor('default');
|
---|
1074 | Tracker.setCursor('default');
|
---|
1075 | };
|
---|
1076 | //}}}
|
---|
1077 | function enableCrop()//{{{
|
---|
1078 | {
|
---|
1079 | options.disabled = false;
|
---|
1080 | interfaceUpdate();
|
---|
1081 | };
|
---|
1082 | //}}}
|
---|
1083 | function cancelCrop()//{{{
|
---|
1084 | {
|
---|
1085 | Selection.done();
|
---|
1086 | Tracker.activateHandlers(null,null);
|
---|
1087 | };
|
---|
1088 | //}}}
|
---|
1089 | function destroy()//{{{
|
---|
1090 | {
|
---|
1091 | $div.remove();
|
---|
1092 | $origimg.show();
|
---|
1093 | };
|
---|
1094 | //}}}
|
---|
1095 |
|
---|
1096 | function interfaceUpdate(alt)//{{{
|
---|
1097 | // This method tweaks the interface based on options object.
|
---|
1098 | // Called when options are changed and at end of initialization.
|
---|
1099 | {
|
---|
1100 | options.allowResize ?
|
---|
1101 | alt?Selection.enableOnly():Selection.enableHandles():
|
---|
1102 | Selection.disableHandles();
|
---|
1103 |
|
---|
1104 | Tracker.setCursor( options.allowSelect? 'crosshair': 'default' );
|
---|
1105 | Selection.setCursor( options.allowMove? 'move': 'default' );
|
---|
1106 |
|
---|
1107 | $div.css('backgroundColor',options.bgColor);
|
---|
1108 |
|
---|
1109 | if ('setSelect' in options) {
|
---|
1110 | setSelect(opt.setSelect);
|
---|
1111 | Selection.done();
|
---|
1112 | delete(options.setSelect);
|
---|
1113 | }
|
---|
1114 |
|
---|
1115 | if ('trueSize' in options) {
|
---|
1116 | xscale = options.trueSize[0] / boundx;
|
---|
1117 | yscale = options.trueSize[1] / boundy;
|
---|
1118 | }
|
---|
1119 |
|
---|
1120 | xlimit = options.maxSize[0] || 0;
|
---|
1121 | ylimit = options.maxSize[1] || 0;
|
---|
1122 | xmin = options.minSize[0] || 0;
|
---|
1123 | ymin = options.minSize[1] || 0;
|
---|
1124 |
|
---|
1125 | if ('outerImage' in options)
|
---|
1126 | {
|
---|
1127 | $img.attr('src',options.outerImage);
|
---|
1128 | delete(options.outerImage);
|
---|
1129 | }
|
---|
1130 |
|
---|
1131 | Selection.refresh();
|
---|
1132 | };
|
---|
1133 | //}}}
|
---|
1134 |
|
---|
1135 | // }}}
|
---|
1136 |
|
---|
1137 | $hdl_holder.hide();
|
---|
1138 | interfaceUpdate(true);
|
---|
1139 |
|
---|
1140 | var api = {
|
---|
1141 | animateTo: animateTo,
|
---|
1142 | setSelect: setSelect,
|
---|
1143 | setOptions: setOptionsNew,
|
---|
1144 | tellSelect: tellSelect,
|
---|
1145 | tellScaled: tellScaled,
|
---|
1146 |
|
---|
1147 | disable: disableCrop,
|
---|
1148 | enable: enableCrop,
|
---|
1149 | cancel: cancelCrop,
|
---|
1150 |
|
---|
1151 | focus: KeyManager.watchKeys,
|
---|
1152 |
|
---|
1153 | getBounds: function() { return [ boundx * xscale, boundy * yscale ]; },
|
---|
1154 | getWidgetSize: function() { return [ boundx, boundy ]; },
|
---|
1155 |
|
---|
1156 | release: Selection.release,
|
---|
1157 | destroy: destroy
|
---|
1158 |
|
---|
1159 | };
|
---|
1160 |
|
---|
1161 | $origimg.data('Jcrop',api);
|
---|
1162 | return api;
|
---|
1163 | };
|
---|
1164 |
|
---|
1165 | $.fn.Jcrop = function(options)/*{{{*/
|
---|
1166 | {
|
---|
1167 | function attachWhenDone(from)/*{{{*/
|
---|
1168 | {
|
---|
1169 | var loadsrc = options.useImg || from.src;
|
---|
1170 | var img = new Image();
|
---|
1171 | img.onload = function() { $.Jcrop(from,options); };
|
---|
1172 | img.src = loadsrc;
|
---|
1173 | };
|
---|
1174 | /*}}}*/
|
---|
1175 | if (typeof(options) !== 'object') options = { };
|
---|
1176 |
|
---|
1177 | // Iterate over each object, attach Jcrop
|
---|
1178 | this.each(function()
|
---|
1179 | {
|
---|
1180 | // If we've already attached to this object
|
---|
1181 | if ($(this).data('Jcrop'))
|
---|
1182 | {
|
---|
1183 | // The API can be requested this way (undocumented)
|
---|
1184 | if (options == 'api') return $(this).data('Jcrop');
|
---|
1185 | // Otherwise, we just reset the options...
|
---|
1186 | else $(this).data('Jcrop').setOptions(options);
|
---|
1187 | }
|
---|
1188 | // If we haven't been attached, preload and attach
|
---|
1189 | else attachWhenDone(this);
|
---|
1190 | });
|
---|
1191 |
|
---|
1192 | // Return "this" so we're chainable a la jQuery plugin-style!
|
---|
1193 | return this;
|
---|
1194 | };
|
---|
1195 | /*}}}*/
|
---|
1196 |
|
---|
1197 | })(jQuery);
|
---|