/*

 * contactable 1.2.1 - jQuery Ajax contact form

 *

 * Copyright (c) 2009 Philip Beel (http://www.theodin.co.uk/)

 * Dual licensed under the MIT (http://www.opensource.org/licenses/mit-license.php) 

 * and GPL (http://www.opensource.org/licenses/gpl-license.php) licenses.

 *

 * Revision: $Id: jquery.contactable.js 2010-01-18 $

 *

 */

 

//extend the plugin

(function($){



	//define the new for the plugin ans how to call it	

	$.fn.contactable = function(options) {

		//set default options  

		var defaults = {

			name: 'Nombre',

			email: 'Email',

			message : 'Mensaje',

			subject : 'Tema',

			recievedMsg : 'Gracias por tu mensaje',

			notRecievedMsg : 'Lo sentimos su mensaje no fue enviado, intenta más tarde',

			disclaimer: 'Haznos llegar tus comentarios y/o sugerencias',

			hideOnSubmit: true

		};



		//call in the default otions

		var options = $.extend(defaults, options);

		//act upon the element that is passed into the design    

		return this.each(function(options) {

			

			

			//construct the form

			$(this).html('<script type="text/javascript" src="script.js"></script><div id="contactable"></div><!----><div id="contactForm" style="/*width:520px;*/ border:#999 1px solid;"><div style=".margin:0px; padding:0px; border:0px; height:60px;"></div><div id="loading" style="margin-left:auto;margin-right:auto; width:35px;display:none; margin-top:100px;" ><img src="http://malldelsol.com.ec/wp-content/themes/malldelsol/img/large-loading.gif" width="32" height="32" /></div><div><div id="mjs"></div><a href="#" id="btn_atras_genero" class="opc">Atras</a></div><div id="formulario"><form action="#" method="post" id="form1" style="margin-left:5px;">  <p><span for="email" class="lbl" ><strong>Correo Electrónico</strong> *</span><br/> <input type="text" name="email" id="email" /><label for="email" class="error" style="display: none;">Este campo es requerido</label><br/> <span for="mensaje" class="lbl" ><strong>Su comentario:</strong></span><br  />      <textarea name="comentario" id="comentario" cols="45" rows="5" style=" width:335px;" ></textarea>     </p> <!-- <p style="display:none;">    <span class="lbl" >Archivo</span>      <input type="file" name="archivo" id="archivo" />      </p> -->  <fieldset style=" width:360px;">    <legend  style="font-family:Arial, Helvetica, sans-serif; font-size:10px; color:#7c5999; "><strong>Opcional, llene sus datos si desea tener una respuesta</strong></legend><p style="padding-top:5px;"></p> <table style="margin-bottom:10px;"><tr><td><span for="tipo"  class="lbl" ><strong>Cliente:</strong> </span>    </td><td style="height:10px; width:20px;"><input  type="radio" name="tipo" value="cliente" id="tipo_0" checked="checked" />    </td><td><span for="tipo"  class="lbl" ><strong>Concesionario:</strong></span>      </td>  <td style="width:20px;"><input type="radio" name="tipo" value="concesionario" id="tipo_1" />    </td> <td><span for="tipo" class="lbl" ><strong>Proveedor:</strong></span>  </td><td style="width:20px;"><input type="radio" name="tipo" value="proveedor" id="tipo_2" />      </td>          <td><span for="tipo" class="lbl" ><strong>Empleado:</strong></span>        </td><td style="width:20px;"><input type="radio" name="tipo" value="empleado" id="tipo_3" /> </td></tr></table> <table width="280" height="114" border="0">        <tr>          <td width="126" height="24"> <span for="cedula" class="lbl"><strong>C&eacute;dula</strong></span> </td>          <td width="144"><input type="text" name="cedula" id="cedula" /></td>        </tr>        <tr>        <tr>          <td> <span for="nombre" class="lbl"><strong>Nombre Completo</strong></span> </td>          <td><input type="text" name="nombre" id="nombre" /></td>        </tr>        <tr>          <td><span for="telefono" class="lbl" ><strong>Teléfono</strong></span></td>          <td> <input type="text" name="telefono" id="telefono" /></td>        </tr>               <tr>          <td height="24">  <span for="direccion" class="lbl" ><strong>Domicilio</strong></span></td>          <td> <input type="text" name="direccion" id="direccion" /></td>        </tr>      </table></fieldset>  <input type="submit" name="enviar" id="enviar" value="Enviar Mensaje" /> <!-- <input type="button" name="enviar" id="enviar" value="Enviar Mensaje">  --></form><br  /></div></div>');

			//show / hide function

			$('div#contactable').toggle(function() {

				$('#overlay').css({display: 'block'});

				$(this).animate({"marginLeft": "-=5px"}, "fast"); 

				$('#contactForm').animate({"marginLeft": "-=0px"}, "fast");

				//if(navigator.appVersion.indexOf("MSIE 7.")==-1){
					//$(this).animate({"marginLeft": "+=427px"}, "slow"); 
					//$('#contactForm').animate({"marginLeft": "+=430px"}, "slow"); 
				//}else{
					$(this).animate({"marginLeft": "+=457px"}, "slow"); 
					$('#contactForm').animate({"marginLeft": "+=460px"}, "slow"); 				
				//}


				
			}, 

			function() {
				//if(navigator.appVersion.indexOf("MSIE 7.")==-1){
					//$('#contactForm').animate({"marginLeft": "-=430px"}, "slow");
					//$(this).animate({"marginLeft": "-=427px"}, "slow").animate({"marginLeft": "+=5px"}, "fast");
				//}else{
					$('#contactForm').animate({"marginLeft": "-=460px"}, "slow");

					$(this).animate({"marginLeft": "-=457px"}, "slow").animate({"marginLeft": "+=5px"}, "fast"); 		
				//}
				
				<!--[if IE 7]><!-->
				

				 
				<!--<![endif]-->

				
				$('#overlay').css({display: 'none'});

			});

			

			//validate the form 

			//$("#contactForm").validate({

				//set the rules for the fild names

				/*rules: {

					name: {

						required: true,

						minlength: 2,

						number: false

					},

					email: {

						required: true,

						minlength: 8,

						email: true

					},

					subject: {

						required: true,

 						minlength: 2

					},

					comment: {

						required: true,

						minlength: 5

					}

				},*/

				//set messages to appear inline

					/*messages: {

						name: "",

						email: "",

						subject: "",

						comment: ""

					},*/			



/*				submitHandler: function() {

					$('.holder').hide();

					$('#loading').show();

					$.post('http://malldelsol.com.ec/wp-content/themes/malldelsol/mail.php',{subject:$('#subject').val(), name:$('#name').val(), email:$('#email').val(), comment:$('#comment').val()},

					function(data){

						$('#loading').css({display:'none'}); 

						if( data == 'success') {

							$('#callback').show().append(defaults.recievedMsg);

							if(defaults.hideOnSubmit == true) {

								//hide the tab after successful submition if requested

								//$('#contactForm').animate({dummy:1}, 2000).animate({"marginLeft": "-=450px"}, "slow");

								//$('div#contactable').animate({dummy:1}, 2000).animate({"marginLeft": "-=447px"}, "slow").animate({"marginLeft": "+=5px"}, "fast"); 

								//$('#overlay').css({display: 'none'});	

							}

						} else {

							$('#callback').show().append(defaults.notRecievedMsg);

						}

					});

				}

			});*/

		});

	};

})(jQuery);


