/* =========================================================

// jquery.monochromer-1.1.js

// Date: 2010-12-24
// Last Update: 2011-07-14
// Author: Hidetaro7 (Hideki Akiba)
// Mail: hidetaro7@gmail.com
// Web: http://akibahideki.com/blog
// Belong: ECOLONIQ Design Label


// for <canvas>element supported browser.
// It confirmed browser Safari5, Chrome6, Firefox3.6, Opera11, InternetExploler9 on Opening to the public day.

 *
 *	<ul id="photoNavigation">
 *		<li><a href="#"><img src="sample01.jpg" alt=""></a></li>
 *		<li><a href="#"><img src="sample02.jpg" alt=""></a></li>
 *		<li><a href="#"><img src="sample03.jpg" alt=""></a></li>
 *		<li><a href="#"><img src="sample04.jpg" alt=""></a></li>
 *		<li><a href="#"><img src="sample05.jpg" alt=""></a></li>
 *	</ul>
 *  
 *
 *$("ul#photoNavigation li").monochromer({
 *	speed: Fading-Speed in milliseconds (Default: 300),
 *	color: ColorType selectable, value is StringKeywords and CSS Colorcode (Default: "gray")
 *	       "gray","lightgray","sepia","blue","green" or CSS color (example: "#ff0000")
 *	type: which select firstview ProcessedImage or OriginalImage (Default: false)
 *});


// ========================================================= */

jQuery.fn.monochromer = function (option) {var settings = {"overspeed": 0,"outspeed":300,"color": "gray","type" : true,"cursor" : "auto"};if(!$("<canvas />").get(0).getContext) {return false;}else {if(option) jQuery.extend(settings, option);return this.each (function () {var img = $(this);var ua = $.browser;if(ua.msie && img.width() !=0) {imageLoaded();}else{if(img.width() !=0 || !img.width()) { var ttime = setInterval(function (){if(img.width() !=0) {imageLoaded();clearInterval(ttime);}}, 500); }else {imageLoaded();}}function imageLoaded (){if(img.get(0).tagName != "IMG") return false;img.wrap("<span class='monochrome-wrap'></span>");var span = img.parent();if(img.css("margin-left")) {span.css("margin-left", img.css("margin-left"));img.css("margin-left", 0)}if(img.css("margin-right")) {span.css("margin-right", img.css("margin-right"));img.css("margin-right", 0)}if(img.css("margin-top")) {span.css("margin-top", img.css("margin-top"));img.css("margin-top", 0)}if(img.css("margin-bottom")) {span.css("margin-bottom", img.css("margin-bottom"));img.css("margin-bottom", 0)}if(img.css("border-left-width")) {span.css({"border-left-width": img.css("border-left-width"), "border-left-style": img.css("border-left-style"), "border-left-color": img.css("border-left-color")});img.css("border-left-width", 0)}if(img.css("border-top-width")) {span.css({"border-top-width": img.css("border-top-width"), "border-top-style": img.css("border-top-style"), "border-top-color": img.css("border-top-color")});img.css("border-top-width", 0)}if(img.css("border-right-width")) {span.css({"border-right-width": img.css("border-right-width"), "border-right-style": img.css("border-right-style"), "border-right-color": img.css("border-right-color")});img.css("border-right-width", 0)}if(img.css("border-bottom-width")) {span.css({"border-bottom-width": img.css("border-bottom-width"), "border-bottom-style": img.css("border-bottom-style"), "border-bottom-color": img.css("border-bottom-color")});img.css("border-bottom-width", 0)}if(img.css("padding-left")) {span.css("padding-left",img.css("padding-left")); img.css({"padding-left": 0})}if(img.css("padding-right")) {span.css("padding-right",img.css("padding-right")); img.css("padding-right", 0)}if(img.css("padding-top")) {span.css("padding-top",img.css("padding-top")); img.css("padding-top", 0)}if(img.css("padding-bottom")) {span.css("padding-bottom",img.css("padding-bottom")); img.css("padding-bottom", 0)}if(img.css("float")!="none") span.css("float",img.css("float"));span.css({"position":"relative","display":"inline-block", "clear": "left", "width": img.width(), "height": img.height(), "cursor": settings.cursor});var canvas;if(settings.type || settings.type == null) {span.append("<canvas />");canvas = span.find("canvas");canvas.css({"position":"absolute","top":"0","left":"0","display":"inline"});canvas.hover(function(e){canvas.fadeTo(settings.overspeed,0)},function(){canvas.fadeTo(settings.outspeed,1)});}else if(!settings.type){span.prepend("<canvas />");canvas = span.find("canvas");img.css({"position":"absolute","top":"0","left":"0","display":"inline"});img.hover(function(e){img.fadeTo(settings.overspeed,0)},function(){img.fadeTo(settings.outspeed,1)});}var ctx = canvas.get(0).getContext("2d");var imageWidth, imageHeight;imageWidth = img.width();imageHeight = img.height();canvas.get(0).width = imageWidth;canvas.get(0).height = imageHeight;ctx.drawImage(img.get(0), 0, 0);var idata = ctx.getImageData(0, 0, imageWidth, imageHeight);var pixels = idata.data.length;for(var i=0; i<pixels; i+=4) {colorCodeParse(idata.data,i);}ctx.putImageData(idata, 0, 0);}function colorCodeParse(imgD, i) {var t = parseInt((11*imgD[i]+16*imgD[i+1]+5*imgD[i+2])/32);switch(settings.color) {case "darkgray":imgD[i] = imgD[i+1] = imgD[i+2] = (t+t/4.5<=255)?t+t/3.5:255;break;case "gray":imgD[i] = imgD[i+1] = imgD[i+2] = t;break;case "lightgray":imgD[i] = imgD[i+1] = imgD[i+2] = (t+t/1.2<=255)?t+t/1.2:255;break;case "sepia":imgD[i] =t/.5;imgD[i+1] = imgD[i+2] = (t/1.2+30 <= 255)?t/1.2+30:255;break;case "blue":imgD[i+2] =t/0.6;imgD[i+1] = imgD[i] = (t/1.2+30 <= 255)?t/1.2+30:255;break;case "green":imgD[i+1] =t/0.7;imgD[i+2] = imgD[i] = (t/1.4+40 <= 255)?t/1.4+40:255;break;default:if(settings.color.indexOf("#") != -1) {settings.color=settings.color.replace("#","");};var r,g,b;if(settings.color.length != 3) {r = parseInt(settings.color.substr(0,2), 16);g = parseInt(settings.color.substr(2,2), 16);b = parseInt(settings.color.substr(4,2), 16);}else{r = parseInt(String(settings.color.substr(0,1)+settings.color.substr(0,1)), 16);g = parseInt(String(settings.color.substr(1,1)+settings.color.substr(1,1)), 16);b = parseInt(String(settings.color.substr(2,1)+settings.color.substr(2,1)), 16);}imgD[i] = imgD[i]*(r/255);imgD[i+1] = imgD[i+1]*(g/255);imgD[i+2] = imgD[i+2]*(b/255);break;}}})}}