/**
 * Really Simple Color Picker in jQuery
 * 
 * Copyright (c) 2008 Lakshan Perera (www.laktek.com)
 * Licensed under the MIT (MIT-LICENSE.txt)  licenses.
 * 
 */

(function($){
  $.fn.colorPicker = function(){    
    if(this.length > 0) buildSelector();
    return this.each(function(i) { 
      buildPicker(this)}); 
	
  };

  var selectorOwner;
  var selectorShowing = false;
 // var initialColor= $("#cD1").val();


toRGB=function(myColor){
	var tempC;
	switch(myColor)
{
case '#FFFFFF': tempC = '255,255,255';  break;
case '#FFE787': tempC = '255,234,100';  break;
case '#FFD200': tempC = '255,210,0';  break;
case '#FF9F3C': tempC = '255,159,60';  break;
case '#FF0066': tempC = '255,0,102'; break;
case '#FCD888': tempC = '252,216,136';  break;
case '#F55317': tempC = '245,83,23';  break;
case '#F40F36': tempC = '244,15,54';  break;
case '#D10B3F': tempC = '209,11,63';  break;
case '#F39B1E': tempC = '243,155,30';  break;
case '#F082B2': tempC = '240,130,178';  break;
case '#EF3E92': tempC = '239,62,146';  break;
case '#EE797F': tempC = '238,121,127';  break;
case '#EE8B97': tempC = '238,139,151';  break;
case '#E70D73': tempC = '231,13,115';  break;
case '#C46CAF': tempC = '196,108,175';  break;
case '#BECC10': tempC = '182,216,64';  break;
case '#A9AA23': tempC = '169,170,35';  break;
case '#68D2E5': tempC = '104,210,229';  break;
case '#96DED1': tempC = '150,222,209';  break;
case '#92C443': tempC = '146,196,67';  break;
case '#BC692B': tempC = '188,105,43';  break;
case '#BC692B': tempC = '188,105,43';  break;
case '#92654D': tempC = '146,101,77';  break;
case '#7DC9DB': tempC = '125,201,215';  break;
case '#7A5C46': tempC = '122,92,70';  break;
case '#64B648': tempC = '100,182,72';  break;
case '#5AAA3C': tempC = '90,170,60';  break;
case '#585858': tempC = '88,88,88';  break;
case '#39B9C6': tempC = '57,185,198';  break;
case '#333333': tempC = '51,51,51';  break;
case '#320B6B': tempC = '50,11,107';  break;
case '#2FABC3': tempC = '47,171,195'; break;
case '#2B478E': tempC = '43,71,142';  break;
case '#1E86AB': tempC = '30,134,171';  break;
case '#103A51': tempC = '16,58,81';  break;
case '#000000': tempC = '0,0,0'; break;
default: tempC ="0,0,0"; 

}

	
return tempC
	
	
}

getColorName=function(myColor){
	var cName;
	switch(myColor)
{
case '255,255,255': cName='white'; break;
case '255,234,100': cName='chick'; break;
case '255,210,0': cName='sunny'; break;
case '255,159,60': cName='mango'; break;
case '255,0,102': cName='raspberry'; break;
case '252,216,136': cName='cream'; break;
case '245,83,23': cName='carrot'; break;
case '244,15,54': cName='poppy'; break;
case '209,11,63': cName='cherry'; break;
case '243,155,30': cName='orange'; break;
case '240,130,178': cName='peony'; break;
case '239,62,146': cName='light fuchsia'; break;
case '238,121,127': cName='strawberry'; break;
case '238,139,151': cName='rose'; break;
case '231,13,115': cName='fuchsia'; break;
case '196,108,175': cName='plum'; break;
case '182,216,64': cName='bright green'; break;
case '169,170,35': cName='fern'; break;
case '160,219,229': cName='pretty blue'; break;
case '150,222,209': cName='robin egg'; break;
case '146,196,67': cName='kiwi'; break;
case '146,101,77': cName='honey'; break;
case '188,105,43': cName='copper'; break;
case '125,201,215': cName='light turquoise'; break;
case '122,92,70': cName='chocolate'; break;
case '100,182,72': cName='bamboo'; break;
case '90,170,60': cName='tree'; break;
case '88,88,88': cName='charcoal'; break;
case '57,185,198': cName='hawaii'; break;
case '51,51,51': cName='darkest gray'; break;
case '50,11,107': cName='orchid purple'; break;
case '47,171,195': cName='teal'; break;
case '43,71,142': cName='navy'; break;
case '30,134,171': cName='deep sky'; break;
case '16,58,81': cName='indigo'; break;
case '0,0,0': cName='black'; break;
default: cName='black'; 

}

	
return cName
	
	
}




  buildPicker = function(element){
    //build color picker
    control = $("<div class='color_picker'>&nbsp;</div>")
	//control.css('background-color', initialColor);
  control.css('background-color', $(element).val());
    
    //bind click event to color picker
    control.bind("click", toggleSelector);
    
    //add the color picker section
    $(element).after(control);

    //add even listener to input box
    $(element).bind("change", function() {
      selectedValue = $(element).val();
	  
      $(element).next(".color_picker").css("background-color", selectedValue);
    });
    
    //hide the input box
    $(element).hide();

  };
  
  buildSelector = function(){
    selector = $("<div id='color_selector'></div>");

     //add color pallete
     $.each($.fn.colorPicker.defaultColors, function(i){
      swatch = $("<div class='color_swatch'>&nbsp;</div>")
      swatch.css("background-color", "#" + this);
      swatch.bind("click", function(e){ changeColor($(this).css("background-color")) });
      swatch.bind("mouseover", function(e){ 
        $(this).css("border-color", "#598FEF"); 
        $("input#color_value").val($(this).css("background-color"));    
        }); 
      swatch.bind("mouseout", function(e){ 
        $(this).css("border-color", "#ffffff");
        $("input#color_value").val($(selectorOwner).css("background-color"));
        });
      
     swatch.appendTo(selector);
     });
  
     //add HEX value field
     hex_field = $("<label for='color_value'>Hex</label><input type='text' size='8' id='color_value'/>");
     hex_field.bind("keydown", function(event){
      if(event.keyCode == 13) {changeColor($(this).val());}
      if(event.keyCode == 27) {toggleSelector()}
     });
     
     //$("<div id='color_custom'></div>").append(hex_field).appendTo(selector);

     $("body").append(selector); 
     selector.hide();
  };
  
  checkMouse = function(event){
    //check the click was on selector itself or on selectorOwner
    var selector = "div#color_selector";
    var selectorParent = $(event.target).parents(selector).length;
    if(event.target == $(selector)[0] || event.target == selectorOwner || selectorParent > 0) return
    
    hideSelector();   
  }
  
  hideSelector = function(){
    var selector = $("div#color_selector");
    
    $(document).unbind("mousedown", checkMouse);
    selector.hide();
    selectorShowing = false
  }
  
  showSelector = function(){
    var selector = $("div#color_selector");
    
    //alert($(selectorOwner).offset().top);
    
    selector.css({
      top: $(selectorOwner).offset().top + ($(selectorOwner).outerHeight()),
      left: $(selectorOwner).offset().left
    }); 
    hexColor = $(selectorOwner).prev("input").val();
    $("input#color_value").val(hexColor);
    selector.show();
    
    //bind close event handler
    $(document).bind("mousedown", checkMouse);
    selectorShowing = true 
   }
  
  toggleSelector = function(event){
    selectorOwner = this; 
    selectorShowing ? hideSelector() : showSelector();
  }
  
  changeColor = function(value){
	 
    if(selectedValue = value){
      $(selectorOwner).css("background-color", selectedValue);
  //    $(selectorOwner).prev("input").val(selectedValue).change();
  
  //***************************************************
 
var	 temp=selectedValue;

if (temp.substring(0,1)=='#') {
	temp=temp.toUpperCase();
	temp=toRGB(temp);
}
else{
	temp=temp.substring(4, (temp.length-1))
}
var colorName=getColorName(temp);
$("#showColor").html(colorName); 
	 // $("#color1").val(temp);
	 $(selectorOwner).prev().val(temp);

  //***************************************************
  //close the selector
      hideSelector();    
    }
  };
    
  //public methods
  $.fn.colorPicker.addColors = function(colorArray){
    $.fn.colorPicker.defaultColors = $.fn.colorPicker.defaultColors.concat(colorArray);
  };
  
$.fn.colorPicker.defaultColors = 
	[ 'FFFFFF',
'FCD888',
'FFE787',
'FFD200',
'FF9F3C',
'F39B1E',
'F55317',
'EE8B97',
'EE797F',
'F40F36',
'D10B3F',
'FF0066',
'E70D73',
'EF3E92',
'F082B2',
'C46CAF',
'D94FAA',
'BECC10',
'92C443',
'64B648',
'5AAA3C',
'A9AA23',
'BC692B',
'92654D',
'7A5C46',
'96DED1',
'A0DBE5',
'7DC9DB',
'39B9C6',
'2FABC3',
'1E86AB',
'2B478E',
'320B6B',
'103A51',
'585858',
'333333',
'000000'
];
  
})(jQuery);



