$(document).ready(function() {
  $('#colorSelector').ColorPicker({
  	color: '#0000ff',
  	onShow: function (colpkr) {
  		$(colpkr).fadeIn(500);
  		return false;
  	},
  	onHide: function (colpkr) {
  		$(colpkr).fadeOut(500);
  		return false;
  	},
  	onChange: function (hsb, hex, rgb) {
      $('#colorSelector div').css('backgroundColor', '#' + hex);
      $('#f_couleur_back').val(hex);
  	}
  });
  
  $('#colorSelector2').ColorPicker({
  	color: '#ffffff',
  	onShow: function (colpkr) {
  		$(colpkr).fadeIn(500);
  		return false;
  	},
  	onHide: function (colpkr) {
  		$(colpkr).fadeOut(500);
  		return false;
  	},
  	onChange: function (hsb, hex, rgb) {
  		$('#colorSelector2 div').css('backgroundColor', '#' + hex);
      $('#f_couleur_front').val(hex);
  	}
  });
  $("#bouton").click(function(){
    $.get(
      "qrcode.php",
      {
        chaine: $("#f_chaine").val(),
        couleurfront: $('#f_couleur_front').val(),
        couleurback: $('#f_couleur_back').val(),
        taille: $("#f_taille option:selected").val(),
        taillebordure: $("#f_taille_bordure option:selected").val()
      },
      function(data){
        $('#image_qrcode').html('<img id="f_image" src="'+data+'">');
      });
  });  
});