/** * jquery.Jcrop.js v0.9.8 * jQuery Image Cropping Plugin * @author Kelly Hallman * Copyright (c) 2008-2009 Kelly Hallman - released under MIT License {{{ * * Permission is hereby granted, free of charge, to any person * obtaining a copy of this software and associated documentation * files (the "Software"), to deal in the Software without * restriction, including without limitation the rights to use, * copy, modify, merge, publish, distribute, sublicense, and/or sell * copies of the Software, and to permit persons to whom the * Software is furnished to do so, subject to the following * conditions: * The above copyright notice and this permission notice shall be * included in all copies or substantial portions of the Software. * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, * EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES * OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND * NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT * HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, * WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING * FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR * OTHER DEALINGS IN THE SOFTWARE. * }}} */ (function($) { $.Jcrop = function(obj,opt) { // Initialization {{{ // Sanitize some options {{{ var obj = obj, opt = opt; if (typeof(obj) !== 'object') obj = $(obj)[0]; if (typeof(opt) !== 'object') opt = { }; // Some on-the-fly fixes for MSIE...sigh if (!('trackDocument' in opt)) { opt.trackDocument = $.browser.msie ? false : true; if ($.browser.msie && $.browser.version.split('.')[0] == '8') opt.trackDocument = true; } if (!('keySupport' in opt)) opt.keySupport = $.browser.msie ? false : true; // }}} // Extend the default options {{{ var defaults = { // Basic Settings trackDocument: false, baseClass: 'jcrop', addClass: null, // Styling Options bgColor: 'black', bgOpacity: .6, borderOpacity: .4, handleOpacity: .5, handlePad: 5, handleSize: 9, handleOffset: 5, edgeMargin: 14, aspectRatio: 0, keySupport: true, cornerHandles: true, sideHandles: true, drawBorders: true, dragEdges: true, boxWidth: 0, boxHeight: 0, boundary: 8, animationDelay: 20, swingSpeed: 3, allowSelect: true, allowMove: true, allowResize: true, minSelect: [ 0, 0 ], maxSize: [ 0, 0 ], minSize: [ 0, 0 ], // Callbacks / Event Handlers onChange: function() { }, onSelect: function() { } }; var options = defaults; setOptions(opt); // }}} // Initialize some jQuery objects {{{ var $origimg = $(obj); var $img = $origimg.clone().removeAttr('id').css({ position: 'absolute' }); $img.width($origimg.width()); $img.height($origimg.height()); $origimg.after($img).hide(); presize($img,options.boxWidth,options.boxHeight); var boundx = $img.width(), boundy = $img.height(), $div = $('
') .width(boundx).height(boundy) .addClass(cssClass('holder')) .css({ position: 'relative', backgroundColor: options.bgColor }).insertAfter($origimg).append($img); ; if (options.addClass) $div.addClass(options.addClass); //$img.wrap($div); var $img2 = $('')/*{{{*/ .attr('src',$img.attr('src')) .css('position','absolute') .width(boundx).height(boundy) ;/*}}}*/ var $img_holder = $('
')/*{{{*/ .width(pct(100)).height(pct(100)) .css({ zIndex: 310, position: 'absolute', overflow: 'hidden' }) .append($img2) ;/*}}}*/ var $hdl_holder = $('
')/*{{{*/ .width(pct(100)).height(pct(100)) .css('zIndex',320); /*}}}*/ var $sel = $('
')/*{{{*/ .css({ position: 'absolute', zIndex: 300 }) .insertBefore($img) .append($img_holder,$hdl_holder) ;/*}}}*/ var bound = options.boundary; var $trk = newTracker().width(boundx+(bound*2)).height(boundy+(bound*2)) .css({ position: 'absolute', top: px(-bound), left: px(-bound), zIndex: 290 }) .mousedown(newSelection); /* }}} */ // Set more variables {{{ var xlimit, ylimit, xmin, ymin; var xscale, yscale, enabled = true; var docOffset = getPos($img), // Internal states btndown, lastcurs, dimmed, animating, shift_down; // }}} // }}} // Internal Modules {{{ var Coords = function()/*{{{*/ { var x1 = 0, y1 = 0, x2 = 0, y2 = 0, ox, oy; function setPressed(pos)/*{{{*/ { var pos = rebound(pos); x2 = x1 = pos[0]; y2 = y1 = pos[1]; }; /*}}}*/ function setCurrent(pos)/*{{{*/ { var pos = rebound(pos); ox = pos[0] - x2; oy = pos[1] - y2; x2 = pos[0]; y2 = pos[1]; }; /*}}}*/ function getOffset()/*{{{*/ { return [ ox, oy ]; }; /*}}}*/ function moveOffset(offset)/*{{{*/ { var ox = offset[0], oy = offset[1]; if (0 > x1 + ox) ox -= ox + x1; if (0 > y1 + oy) oy -= oy + y1; if (boundy < y2 + oy) oy += boundy - (y2 + oy); if (boundx < x2 + ox) ox += boundx - (x2 + ox); x1 += ox; x2 += ox; y1 += oy; y2 += oy; }; /*}}}*/ function getCorner(ord)/*{{{*/ { var c = getFixed(); switch(ord) { case 'ne': return [ c.x2, c.y ]; case 'nw': return [ c.x, c.y ]; case 'se': return [ c.x2, c.y2 ]; case 'sw': return [ c.x, c.y2 ]; } }; /*}}}*/ function getFixed()/*{{{*/ { if (!options.aspectRatio) return getRect(); // This function could use some optimization I think... var aspect = options.aspectRatio, min_x = options.minSize[0]/xscale, min_y = options.minSize[1]/yscale, max_x = options.maxSize[0]/xscale, max_y = options.maxSize[1]/yscale, rw = x2 - x1, rh = y2 - y1, rwa = Math.abs(rw), rha = Math.abs(rh), real_ratio = rwa / rha, xx, yy ; if (max_x == 0) { max_x = boundx * 10 } if (max_y == 0) { max_y = boundy * 10 } if (real_ratio < aspect) { yy = y2; w = rha * aspect; xx = rw < 0 ? x1 - w : w + x1; if (xx < 0) { xx = 0; h = Math.abs((xx - x1) / aspect); yy = rh < 0 ? y1 - h: h + y1; } else if (xx > boundx) { xx = boundx; h = Math.abs((xx - x1) / aspect); yy = rh < 0 ? y1 - h : h + y1; } } else { xx = x2; h = rwa / aspect; yy = rh < 0 ? y1 - h : y1 + h; if (yy < 0) { yy = 0; w = Math.abs((yy - y1) * aspect); xx = rw < 0 ? x1 - w : w + x1; } else if (yy > boundy) { yy = boundy; w = Math.abs(yy - y1) * aspect; xx = rw < 0 ? x1 - w : w + x1; } } // Magic %-) if(xx > x1) { // right side if(xx - x1 < min_x) { xx = x1 + min_x; } else if (xx - x1 > max_x) { xx = x1 + max_x; } if(yy > y1) { yy = y1 + (xx - x1)/aspect; } else { yy = y1 - (xx - x1)/aspect; } } else if (xx < x1) { // left side if(x1 - xx < min_x) { xx = x1 - min_x } else if (x1 - xx > max_x) { xx = x1 - max_x; } if(yy > y1) { yy = y1 + (x1 - xx)/aspect; } else { yy = y1 - (x1 - xx)/aspect; } } if(xx < 0) { x1 -= xx; xx = 0; } else if (xx > boundx) { x1 -= xx - boundx; xx = boundx; } if(yy < 0) { y1 -= yy; yy = 0; } else if (yy > boundy) { y1 -= yy - boundy; yy = boundy; } return last = makeObj(flipCoords(x1,y1,xx,yy)); }; /*}}}*/ function rebound(p)/*{{{*/ { if (p[0] < 0) p[0] = 0; if (p[1] < 0) p[1] = 0; if (p[0] > boundx) p[0] = boundx; if (p[1] > boundy) p[1] = boundy; return [ p[0], p[1] ]; }; /*}}}*/ function flipCoords(x1,y1,x2,y2)/*{{{*/ { var xa = x1, xb = x2, ya = y1, yb = y2; if (x2 < x1) { xa = x2; xb = x1; } if (y2 < y1) { ya = y2; yb = y1; } return [ Math.round(xa), Math.round(ya), Math.round(xb), Math.round(yb) ]; }; /*}}}*/ function getRect()/*{{{*/ { var xsize = x2 - x1; var ysize = y2 - y1; if (xlimit && (Math.abs(xsize) > xlimit)) x2 = (xsize > 0) ? (x1 + xlimit) : (x1 - xlimit); if (ylimit && (Math.abs(ysize) > ylimit)) y2 = (ysize > 0) ? (y1 + ylimit) : (y1 - ylimit); if (ymin && (Math.abs(ysize) < ymin)) y2 = (ysize > 0) ? (y1 + ymin) : (y1 - ymin); if (xmin && (Math.abs(xsize) < xmin)) x2 = (xsize > 0) ? (x1 + xmin) : (x1 - xmin); if (x1 < 0) { x2 -= x1; x1 -= x1; } if (y1 < 0) { y2 -= y1; y1 -= y1; } if (x2 < 0) { x1 -= x2; x2 -= x2; } if (y2 < 0) { y1 -= y2; y2 -= y2; } if (x2 > boundx) { var delta = x2 - boundx; x1 -= delta; x2 -= delta; } if (y2 > boundy) { var delta = y2 - boundy; y1 -= delta; y2 -= delta; } if (x1 > boundx) { var delta = x1 - boundy; y2 -= delta; y1 -= delta; } if (y1 > boundy) { var delta = y1 - boundy; y2 -= delta; y1 -= delta; } return makeObj(flipCoords(x1,y1,x2,y2)); }; /*}}}*/ function makeObj(a)/*{{{*/ { return { x: a[0], y: a[1], x2: a[2], y2: a[3], w: a[2] - a[0], h: a[3] - a[1] }; }; /*}}}*/ return { flipCoords: flipCoords, setPressed: setPressed, setCurrent: setCurrent, getOffset: getOffset, moveOffset: moveOffset, getCorner: getCorner, getFixed: getFixed }; }(); /*}}}*/ var Selection = function()/*{{{*/ { var start, end, dragmode, awake, hdep = 370; var borders = { }; var handle = { }; var seehandles = false; var hhs = options.handleOffset; /* Insert draggable elements {{{*/ // Insert border divs for outline if (options.drawBorders) { borders = { top: insertBorder('hline') .css('top',$.browser.msie?px(-1):px(0)), bottom: insertBorder('hline'), left: insertBorder('vline'), right: insertBorder('vline') }; } // Insert handles on edges if (options.dragEdges) { handle.t = insertDragbar('n'); handle.b = insertDragbar('s'); handle.r = insertDragbar('e'); handle.l = insertDragbar('w'); } // Insert side handles options.sideHandles && createHandles(['n','s','e','w']); // Insert corner handles options.cornerHandles && createHandles(['sw','nw','ne','se']); /*}}}*/ // Private Methods function insertBorder(type)/*{{{*/ { var jq = $('
') .css({position: 'absolute', opacity: options.borderOpacity }) .addClass(cssClass(type)); $img_holder.append(jq); return jq; }; /*}}}*/ function dragDiv(ord,zi)/*{{{*/ { var jq = $('
') .mousedown(createDragger(ord)) .css({ cursor: ord+'-resize', position: 'absolute', zIndex: zi }) ; $hdl_holder.append(jq); return jq; }; /*}}}*/ function insertHandle(ord)/*{{{*/ { return dragDiv(ord,hdep++) .css({ top: px(-hhs+1), left: px(-hhs+1), opacity: options.handleOpacity }) .addClass(cssClass('handle')); }; /*}}}*/ function insertDragbar(ord)/*{{{*/ { var s = options.handleSize, o = hhs, h = s, w = s, t = o, l = o; switch(ord) { case 'n': case 's': w = pct(100); break; case 'e': case 'w': h = pct(100); break; } return dragDiv(ord,hdep++).width(w).height(h) .css({ top: px(-t+1), left: px(-l+1)}); }; /*}}}*/ function createHandles(li)/*{{{*/ { for(i in li) handle[li[i]] = insertHandle(li[i]); }; /*}}}*/ function moveHandles(c)/*{{{*/ { var midvert = Math.round((c.h / 2) - hhs), midhoriz = Math.round((c.w / 2) - hhs), north = west = -hhs+1, east = c.w - hhs, south = c.h - hhs, x, y; 'e' in handle && handle.e.css({ top: px(midvert), left: px(east) }) && handle.w.css({ top: px(midvert) }) && handle.s.css({ top: px(south), left: px(midhoriz) }) && handle.n.css({ left: px(midhoriz) }); 'ne' in handle && handle.ne.css({ left: px(east) }) && handle.se.css({ top: px(south), left: px(east) }) && handle.sw.css({ top: px(south) }); 'b' in handle && handle.b.css({ top: px(south) }) && handle.r.css({ left: px(east) }); }; /*}}}*/ function moveto(x,y)/*{{{*/ { $img2.css({ top: px(-y), left: px(-x) }); $sel.css({ top: px(y), left: px(x) }); }; /*}}}*/ function resize(w,h)/*{{{*/ { $sel.width(w).height(h); }; /*}}}*/ function refresh()/*{{{*/ { var c = Coords.getFixed(); Coords.setPressed([c.x,c.y]); Coords.setCurrent([c.x2,c.y2]); updateVisible(); }; /*}}}*/ // Internal Methods function updateVisible()/*{{{*/ { if (awake) return update(); }; /*}}}*/ function update()/*{{{*/ { var c = Coords.getFixed(); resize(c.w,c.h); moveto(c.x,c.y); options.drawBorders && borders['right'].css({ left: px(c.w-1) }) && borders['bottom'].css({ top: px(c.h-1) }); seehandles && moveHandles(c); awake || show(); options.onChange(unscale(c)); }; /*}}}*/ function show()/*{{{*/ { $sel.show(); $img.css('opacity',options.bgOpacity); awake = true; }; /*}}}*/ function release()/*{{{*/ { disableHandles(); $sel.hide(); $img.css('opacity',1); awake = false; }; /*}}}*/ function showHandles()//{{{ { if (seehandles) { moveHandles(Coords.getFixed()); $hdl_holder.show(); } }; //}}} function enableHandles()/*{{{*/ { seehandles = true; if (options.allowResize) { moveHandles(Coords.getFixed()); $hdl_holder.show(); return true; } }; /*}}}*/ function disableHandles()/*{{{*/ { seehandles = false; $hdl_holder.hide(); }; /*}}}*/ function animMode(v)/*{{{*/ { (animating = v) ? disableHandles(): enableHandles(); }; /*}}}*/ function done()/*{{{*/ { animMode(false); refresh(); }; /*}}}*/ var $track = newTracker().mousedown(createDragger('move')) .css({ cursor: 'move', position: 'absolute', zIndex: 360 }) $img_holder.append($track); disableHandles(); return { updateVisible: updateVisible, update: update, release: release, refresh: refresh, setCursor: function (cursor) { $track.css('cursor',cursor); }, enableHandles: enableHandles, enableOnly: function() { seehandles = true; }, showHandles: showHandles, disableHandles: disableHandles, animMode: animMode, done: done }; }(); /*}}}*/ var Tracker = function()/*{{{*/ { var onMove = function() { }, onDone = function() { }, trackDoc = options.trackDocument; if (!trackDoc) { $trk .mousemove(trackMove) .mouseup(trackUp) .mouseout(trackUp) ; } function toFront()/*{{{*/ { $trk.css({zIndex:450}); if (trackDoc) { $(document) .mousemove(trackMove) .mouseup(trackUp) ; } } /*}}}*/ function toBack()/*{{{*/ { $trk.css({zIndex:290}); if (trackDoc) { $(document) .unbind('mousemove',trackMove) .unbind('mouseup',trackUp) ; } } /*}}}*/ function trackMove(e)/*{{{*/ { onMove(mouseAbs(e)); }; /*}}}*/ function trackUp(e)/*{{{*/ { e.preventDefault(); e.stopPropagation(); if (btndown) { btndown = false; onDone(mouseAbs(e)); options.onSelect(unscale(Coords.getFixed())); toBack(); onMove = function() { }; onDone = function() { }; } return false; }; /*}}}*/ function activateHandlers(move,done)/* {{{ */ { btndown = true; onMove = move; onDone = done; toFront(); return false; }; /* }}} */ function setCursor(t) { $trk.css('cursor',t); }; $img.before($trk); return { activateHandlers: activateHandlers, setCursor: setCursor }; }(); /*}}}*/ var KeyManager = function()/*{{{*/ { var $keymgr = $('') .css({ position: 'absolute', left: '-30px' }) .keypress(parseKey) .blur(onBlur), $keywrap = $('
') .css({ position: 'absolute', overflow: 'hidden' }) .append($keymgr) ; function watchKeys()/*{{{*/ { if (options.keySupport) { $keymgr.show(); $keymgr.focus(); } }; /*}}}*/ function onBlur(e)/*{{{*/ { $keymgr.hide(); }; /*}}}*/ function doNudge(e,x,y)/*{{{*/ { if (options.allowMove) { Coords.moveOffset([x,y]); Selection.updateVisible(); }; e.preventDefault(); e.stopPropagation(); }; /*}}}*/ function parseKey(e)/*{{{*/ { if (e.ctrlKey) return true; shift_down = e.shiftKey ? true : false; var nudge = shift_down ? 10 : 1; switch(e.keyCode) { case 37: doNudge(e,-nudge,0); break; case 39: doNudge(e,nudge,0); break; case 38: doNudge(e,0,-nudge); break; case 40: doNudge(e,0,nudge); break; case 27: Selection.release(); break; case 9: return true; } return nothing(e); }; /*}}}*/ if (options.keySupport) $keywrap.insertBefore($img); return { watchKeys: watchKeys }; }(); /*}}}*/ // }}} // Internal Methods {{{ function px(n) { return '' + parseInt(n) + 'px'; }; function pct(n) { return '' + parseInt(n) + '%'; }; function cssClass(cl) { return options.baseClass + '-' + cl; }; function getPos(obj)/*{{{*/ { // Updated in v0.9.4 to use built-in dimensions plugin var pos = $(obj).offset(); return [ pos.left, pos.top ]; }; /*}}}*/ function mouseAbs(e)/*{{{*/ { return [ (e.pageX - docOffset[0]), (e.pageY - docOffset[1]) ]; }; /*}}}*/ function myCursor(type)/*{{{*/ { if (type != lastcurs) { Tracker.setCursor(type); //Handles.xsetCursor(type); lastcurs = type; } }; /*}}}*/ function startDragMode(mode,pos)/*{{{*/ { docOffset = getPos($img); Tracker.setCursor(mode=='move'?mode:mode+'-resize'); if (mode == 'move') return Tracker.activateHandlers(createMover(pos), doneSelect); var fc = Coords.getFixed(); var opp = oppLockCorner(mode); var opc = Coords.getCorner(oppLockCorner(opp)); Coords.setPressed(Coords.getCorner(opp)); Coords.setCurrent(opc); Tracker.activateHandlers(dragmodeHandler(mode,fc),doneSelect); }; /*}}}*/ function dragmodeHandler(mode,f)/*{{{*/ { return function(pos) { if (!options.aspectRatio) switch(mode) { case 'e': pos[1] = f.y2; break; case 'w': pos[1] = f.y2; break; case 'n': pos[0] = f.x2; break; case 's': pos[0] = f.x2; break; } else switch(mode) { case 'e': pos[1] = f.y+1; break; case 'w': pos[1] = f.y+1; break; case 'n': pos[0] = f.x+1; break; case 's': pos[0] = f.x+1; break; } Coords.setCurrent(pos); Selection.update(); }; }; /*}}}*/ function createMover(pos)/*{{{*/ { var lloc = pos; KeyManager.watchKeys(); return function(pos) { Coords.moveOffset([pos[0] - lloc[0], pos[1] - lloc[1]]); lloc = pos; Selection.update(); }; }; /*}}}*/ function oppLockCorner(ord)/*{{{*/ { switch(ord) { case 'n': return 'sw'; case 's': return 'nw'; case 'e': return 'nw'; case 'w': return 'ne'; case 'ne': return 'sw'; case 'nw': return 'se'; case 'se': return 'nw'; case 'sw': return 'ne'; }; }; /*}}}*/ function createDragger(ord)/*{{{*/ { return function(e) { if (options.disabled) return false; if ((ord == 'move') && !options.allowMove) return false; btndown = true; startDragMode(ord,mouseAbs(e)); e.stopPropagation(); e.preventDefault(); return false; }; }; /*}}}*/ function presize($obj,w,h)/*{{{*/ { var nw = $obj.width(), nh = $obj.height(); if ((nw > w) && w > 0) { nw = w; nh = (w/$obj.width()) * $obj.height(); } if ((nh > h) && h > 0) { nh = h; nw = (h/$obj.height()) * $obj.width(); } xscale = $obj.width() / nw; yscale = $obj.height() / nh; $obj.width(nw).height(nh); }; /*}}}*/ function unscale(c)/*{{{*/ { return { x: parseInt(c.x * xscale), y: parseInt(c.y * yscale), x2: parseInt(c.x2 * xscale), y2: parseInt(c.y2 * yscale), w: parseInt(c.w * xscale), h: parseInt(c.h * yscale) }; }; /*}}}*/ function doneSelect(pos)/*{{{*/ { var c = Coords.getFixed(); if (c.w > options.minSelect[0] && c.h > options.minSelect[1]) { Selection.enableHandles(); Selection.done(); } else { Selection.release(); } Tracker.setCursor( options.allowSelect?'crosshair':'default' ); }; /*}}}*/ function newSelection(e)/*{{{*/ { if (options.disabled) return false; if (!options.allowSelect) return false; btndown = true; docOffset = getPos($img); Selection.disableHandles(); myCursor('crosshair'); var pos = mouseAbs(e); Coords.setPressed(pos); Tracker.activateHandlers(selectDrag,doneSelect); KeyManager.watchKeys(); Selection.update(); e.stopPropagation(); e.preventDefault(); return false; }; /*}}}*/ function selectDrag(pos)/*{{{*/ { Coords.setCurrent(pos); Selection.update(); }; /*}}}*/ function newTracker() { var trk = $('
').addClass(cssClass('tracker')); $.browser.msie && trk.css({ opacity: 0, backgroundColor: 'white' }); return trk; }; // }}} // API methods {{{ function animateTo(a)/*{{{*/ { var x1 = a[0] / xscale, y1 = a[1] / yscale, x2 = a[2] / xscale, y2 = a[3] / yscale; if (animating) return; var animto = Coords.flipCoords(x1,y1,x2,y2); var c = Coords.getFixed(); var animat = initcr = [ c.x, c.y, c.x2, c.y2 ]; var interv = options.animationDelay; var x = animat[0]; var y = animat[1]; var x2 = animat[2]; var y2 = animat[3]; var ix1 = animto[0] - initcr[0]; var iy1 = animto[1] - initcr[1]; var ix2 = animto[2] - initcr[2]; var iy2 = animto[3] - initcr[3]; var pcent = 0; var velocity = options.swingSpeed; Selection.animMode(true); var animator = function() { return function() { pcent += (100 - pcent) / velocity; animat[0] = x + ((pcent / 100) * ix1); animat[1] = y + ((pcent / 100) * iy1); animat[2] = x2 + ((pcent / 100) * ix2); animat[3] = y2 + ((pcent / 100) * iy2); if (pcent < 100) animateStart(); else Selection.done(); if (pcent >= 99.8) pcent = 100; setSelectRaw(animat); }; }(); function animateStart() { window.setTimeout(animator,interv); }; animateStart(); }; /*}}}*/ function setSelect(rect)//{{{ { setSelectRaw([rect[0]/xscale,rect[1]/yscale,rect[2]/xscale,rect[3]/yscale]); }; //}}} function setSelectRaw(l) /*{{{*/ { Coords.setPressed([l[0],l[1]]); Coords.setCurrent([l[2],l[3]]); Selection.update(); }; /*}}}*/ function setOptions(opt)/*{{{*/ { if (typeof(opt) != 'object') opt = { }; options = $.extend(options,opt); if (typeof(options.onChange)!=='function') options.onChange = function() { }; if (typeof(options.onSelect)!=='function') options.onSelect = function() { }; }; /*}}}*/ function tellSelect()/*{{{*/ { return unscale(Coords.getFixed()); }; /*}}}*/ function tellScaled()/*{{{*/ { return Coords.getFixed(); }; /*}}}*/ function setOptionsNew(opt)/*{{{*/ { setOptions(opt); interfaceUpdate(); }; /*}}}*/ function disableCrop()//{{{ { options.disabled = true; Selection.disableHandles(); Selection.setCursor('default'); Tracker.setCursor('default'); }; //}}} function enableCrop()//{{{ { options.disabled = false; interfaceUpdate(); }; //}}} function cancelCrop()//{{{ { Selection.done(); Tracker.activateHandlers(null,null); }; //}}} function destroy()//{{{ { $div.remove(); $origimg.show(); }; //}}} function interfaceUpdate(alt)//{{{ // This method tweaks the interface based on options object. // Called when options are changed and at end of initialization. { options.allowResize ? alt?Selection.enableOnly():Selection.enableHandles(): Selection.disableHandles(); Tracker.setCursor( options.allowSelect? 'crosshair': 'default' ); Selection.setCursor( options.allowMove? 'move': 'default' ); $div.css('backgroundColor',options.bgColor); if ('setSelect' in options) { setSelect(opt.setSelect); Selection.done(); delete(options.setSelect); } if ('trueSize' in options) { xscale = options.trueSize[0] / boundx; yscale = options.trueSize[1] / boundy; } xlimit = options.maxSize[0] || 0; ylimit = options.maxSize[1] || 0; xmin = options.minSize[0] || 0; ymin = options.minSize[1] || 0; if ('outerImage' in options) { $img.attr('src',options.outerImage); delete(options.outerImage); } Selection.refresh(); }; //}}} // }}} $hdl_holder.hide(); interfaceUpdate(true); var api = { animateTo: animateTo, setSelect: setSelect, setOptions: setOptionsNew, tellSelect: tellSelect, tellScaled: tellScaled, disable: disableCrop, enable: enableCrop, cancel: cancelCrop, focus: KeyManager.watchKeys, getBounds: function() { return [ boundx * xscale, boundy * yscale ]; }, getWidgetSize: function() { return [ boundx, boundy ]; }, release: Selection.release, destroy: destroy }; $origimg.data('Jcrop',api); return api; }; $.fn.Jcrop = function(options)/*{{{*/ { function attachWhenDone(from)/*{{{*/ { var loadsrc = options.useImg || from.src; var img = new Image(); img.onload = function() { $.Jcrop(from,options); }; img.src = loadsrc; }; /*}}}*/ if (typeof(options) !== 'object') options = { }; // Iterate over each object, attach Jcrop this.each(function() { // If we've already attached to this object if ($(this).data('Jcrop')) { // The API can be requested this way (undocumented) if (options == 'api') return $(this).data('Jcrop'); // Otherwise, we just reset the options... else $(this).data('Jcrop').setOptions(options); } // If we haven't been attached, preload and attach else attachWhenDone(this); }); // Return "this" so we're chainable a la jQuery plugin-style! return this; }; /*}}}*/ })(jQuery);