/**
 * Drop Curves - jQuery Plug-In
 * 
 * Version 0.1
 *
 * Nicholas Aiello (nikko.aiello@gmail.com)  MIT licensed
 */
(function($) {
	
	$.extend({
		dropCurves: new function() {
			
			// create the clipping mask
			function doMask(s) {
				s.ctx.save();
				s.ctx.translate(s.x + s.bSize, s.y + s.bSize);
				s.w -= s.bSize*2;
				s.h -= s.bSize*2;
				_doCorners(s);
				s.w += s.bSize*2;
				s.h += s.bSize*2;
				s.ctx.fillStyle = s.cl;
				s.ctx.fill();
				s.ctx.restore();
				s.ctx.clip();
			}
			
			// draw the shadow
			function doShadow(s) {
				s.ctx.save();
				s.ctx.translate(s.sX, s.sY);
				_doCorners(s);
				s.ctx.closePath();
				s.ctx.fillStyle = s.sColor;
				s.ctx.globalAlpha = s.o;
				s.ctx.fill();
				s.ctx.restore();
			}
			
			// draw the borders
			function doBorder(s) {
				s.ctx.save();
				s.ctx.translate(s.x, s.y);
				_doCorners(s);
				s.ctx.closePath();
				s.ctx.fillStyle = s.cl = s.bColor;
				s.ctx.fill();
				s.ctx.restore();				
			}
			
			// helper function to draw the shape of the corners
			function _doCorners(s) {
				s.ctx.beginPath();
			    s.ctx.moveTo(0, s.r);
			    s.ctx.lineTo(0, s.h - s.r);
			    s.ctx.quadraticCurveTo(0, s.h, s.r, s.h);
			    s.ctx.lineTo(s.w - s.r, s.h);
			    s.ctx.quadraticCurveTo(s.w, s.h, s.w, s.h - s.r);
			    s.ctx.lineTo(s.w, s.r);
			    s.ctx.quadraticCurveTo(s.w, 0, s.w - s.r, 0);
			    s.ctx.lineTo(s.r, 0);
			    s.ctx.quadraticCurveTo(0, 0, 0, s.r);
			}
			
			function _setPos(s) {
				s.x = (s.sX < 0 ? s.x - s.sX : s.x);
				s.y = (s.sY < 0 ? s.y - s.sY : s.y);
				s.sX = (s.sX > 0 ? s.sX : 0);
				s.sY = (s.sY > 0 ? s.sY : 0);
			}
			
			function _draw(s) {
				// set the canvas' coordinates
				_setPos(s);
				// shadow
				if (s.s) doShadow(s);
				// border
				if (s.bSize > 0) doBorder(s);
				// mask
				doMask(s);
				// image
				s.ctx.drawImage(s.el, s.x + s.bSize, s.y + s.bSize, s.w - (s.bSize * 2), s.h - (s.bSize*2));
			}
			
			this.construct = function(s) {
				var cv,
					attr,
					clazz,
					id,
					w,
					h,
					sX,
					sY,
					st;
				
	      		this.each(function() {					
					if (this.tagName != 'IMG') return;
					$(this).load(function() {
						// default settings
						st = {
							el:this, // image element
							ctx:null, // canvas context
							w:$(this).width(), // width
							h:$(this).height(), // height
							x:0, // image X
							y:0, // image Y
							bSize:0, // border size
							bColor:'#f00', // border color
							s:false, // shadow?
							sX:-4, // shadow X
							sY:-2, // shadow Y
							sColor:'#000', // shadow color
							blur:0, // shadow blur - not implemented
							o:0.5, // shadow opacity
							r:10, // corner radius
							cl:'#282D3A' // general bg color
						};
						
						attr = 'id="' + this.id + '" class="' + this.className + '" name="' + $(this).attr('name') + '"';
						
						// override defaults with user settings
						if (typeof s != undefined) {
							for (o in s) {
								st[o] = s[o];
							}
						}
						
						sX = Math.abs(st.sX);
						sY = Math.abs(st.sY);
						st.bSize = Math.abs(st.bSize);

						w = st.w + sX;
						h = st.h + sY;

						// check if IE or other browser
						if ($.browser.msie) {
							// create "clipping mask"
							cv = document.createElement('<v:roundrect arcsize="' + ((st.r/100) - .06) + '" strokeweight="' + st.bSize + '" strokecolor="' + st.bColor + '" style="width:' + st.w + 'px; height:' + st.h + 'px;"></v:roundrect>');
							// image
							cv.appendChild(document.createElement('<v:fill type="frame" src="' + this.src + '" />'));
							// sh
							if (st.s) cv.appendChild(document.createElement('<v:shadow on="True" color="' + st.sColor + '" opacity="' + st.o + '" offset="' + st.sX + 'px,' + st.sY + 'px" />'));
							$(this).replaceWith(cv);
				        }
						else {
							cv = $('<canvas ' + attr + ' width="' + w + '" height="' + h + '"></canvas>');
							$(this).replaceWith(cv);
							
							st.ctx = cv[0].getContext('2d');
							_draw(st);
				        }
					});
				});
			}
		}
	});
	
	$.fn.extend({
		dropCurves: $.dropCurves.construct
	});
	
})(jQuery);