← Back to branch summary

~libravatar/libravatar/master

« back to all changes in this revision

Viewing changes to static/js/jcrop.js

  • Committer: Francois Marier
  • Date: 2011-01-02 08:21:27 UTC
  • Revision ID: git-v1:712468934c9dac302a0fb5989b22dd33c6501dff
Rename jquery.Jcrop.* to jcrop.* to make the precompressed files work

For some reasons, the extra "extensions" are confusing the Apache auto
negotiation.

Show diffs side-by-side

added added

removed removed

Lines of Context:
static/js/jcrop.js
 
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);