tati
/
especificosweb


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227
							<!doctype html>

<head>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<!-- <link type="text/css" rel="Stylesheet" href="css/menu.css" /> -->
	<link type="text/css" rel="Stylesheet" href="css/spinner.css" />
	<link type="text/css" rel="Stylesheet" href="css/normalize.css" />
	<link type="text/css" rel="Stylesheet" href="css/skeleton.css" />
	<link type="text/css" rel="Stylesheet" href="css/formulario.css" />
	<link type="text/css" rel="Stylesheet" href="css/themes/original.css" />
	<script src="js/rivets.bundled.min.js"></script>
	<script src="js/humane.min.js"></script>

</head>
<body id="view">
	<div class="row nav-bar">
		<div class="left">
			<a class="button" href="#">Volver</a>
		</div>
		<div class="right">
			<a href="http://especificosba.com.ar"><img src="Images/logo-horizontal.png" class="logo"></a>
		</div>
	</div>

	<div class="section promocion">
		<div class="container max-top-space">
		  	<div class="row">
		  		<div class="eight columns xl-top-space">
					<h1>Actualizá tus datos</h1>
					<p>Estarás participando por un sorteo para ganar un set de productos de ESPECIFICOS Buenos Aires</p>
				</div>
				<div class="four columns">
					<img src="Images/productos/productos.png" class="productos">
				</div>
		  	</div>
		</div>
	</div>

	<div class="section">
		<div class="container">
		<div id="spinner" class="loading">Loading&#8230;</div>
			<form onsubmit="return false">
				<div class="row">
					<h4>Datos personales</h4>
				</div>
  				<div class="row">
					<div class="four columns">
	  					<label for="exampleEmailInput">Nombre</label>
	  					<input id="nombre" class="u-full-width" type="text" rv-value='user.nombre'>
					</div>

					<div class="four columns">
	  					<label for="exampleEmailInput">Apellido</label>
	  					<input id="ap" class="u-full-width" type="text" rv-value='user.apellido'>
					</div>
  				</div>

  				<div class="row">
					<div class="four columns">
	  					<label for="exampleEmailInput">País</label>
	  					<!-- <input class="u-full-width" type="text" rv-value='user.pais'> -->
	  					<select rv-value="user.pais" class="twelve columns">
	  						<option rv-each-country="countries" rv-value="country"> { country } </option>
	  					</select>
					</div>
					<div class="four columns">
	  					<label for="exampleEmailInput">Provincia/Estado</label>
	  					<input class="u-full-width" type="text" rv-value='user.provincia'>
					</div>
					<div class="four columns">
	  					<label for="exampleEmailInput">Ciudad</label>
	  					<input class="u-full-width" type="text" rv-value='user.zona'>
					</div>
  				</div>
  				
  				<div class="row">
  					<div class=" column">
  						<label>Cumpleaños <span class="mandatory">*</span></label>
  						<div class="row">
							<input class="two columns" type="number" min="1" max="31" placeholder="Dia (DD)" maxlength=2 numbersonly rv-value='user.dia'> 
							<input class="two columns" type="number" min="1" max="12" placeholder="Mes (MM)" maxlength=2 numbersonly rv-value='user.mes'>
  						</div>
  						<div class="help"> <span class="mandatory">*</span> Durante el mes de tu cumpleaños, recibirás importantes descuentos y beneficios</div>
  					</div>
  				</div>
  				<hr>
  				<div class="row">
					<h4>Contacto</h4>
				</div>
				<div class="row">
					<div class="six columns">
	  					<label for="exampleEmailInput">Email</label>
	  					<input class="u-full-width" placeholder="email@ejemplo.com" type="email" required rv-value='user.email'>
					</div>
					<div class="six columns">
	  					<label for="exampleEmailInput">Teléfono</label>
	  					<div class="row">
	  						<input class="four columns" type="text" numbersonly maxlength=5 placeholder="Cod. Area (ej: 011)" rv-value='user.prefijo'> 
	  						<input class="eight columns" type="text" numbersonly maxlength=12 rv-value='user.telefono'>
	  					</div>
	  					
					</div>
  				</div>
  				<hr>
  				<div class="row">
	  				<label class="example-send-yourself-copy">
						<input type="checkbox" rv-checked='user.infocursos'>
						<span class="label-body">Quiero recibir información sobre los cursos presenciales y a distancia</span>
	  				</label>
	  				<div class="u-pull-right">
	  					<input class="button-primary" value="Enviar" type="submit" id="button">
	  				</div>
	  			</div>

  				<hr>
			</form>
			<div class="disclaimer">
				<p>En cumplimiento de la Ley 25.326 (Protección de Datos Personales) - Art 27. inc 3 y del Decreto 1558/2001 (cuyas partes pertinentes se transcriben a continuación)le informamos que si deseara no recibir más información publicitaria, tiene el derecho de solicitar el retiro o bloqueo total o parcial de su nombre en nuestras bases de datos seleccionando la opción que se encuentra al final de este anuncio. Ley 25.326 (Protección de Datos Personales), Artículo 27, inciso 3: El titular podrá en cualquier momento solicitar el retiro o bloqueo de su nombre de los bancos de datos a los que se refiere el presente artículo. Decreto 1558/2001, Anexo I, artículo 27, párrafo tercero: En toda comunicación con fines de publicidad que se realice por correo, teléfono, correo electrónico, Internet u otro medio a distancia a conocer, se deberá indicar, en forma expresa y destacada, la posibilidad del titular del dato de solicitar el retiro o bloqueo, total o parcial, de su nombre de la base de datos. A pedido del interesado, se deberá informar el nombre del responsable o usuario del banco de datos que proveyó la información.</p>
			</div>
			<div class="u-pull-right">
				<a class="button" href="#">No quiero recibir más información</a>
			</div>
		</div>
	</div>
	<script>

		var urlparams=window.location.search.replace("?", "").split("&");
		var params={};
		var user = {};
		var xhttp = new XMLHttpRequest();
		var el = $('#view');
		var update = 0;

		var countries = ["Argentina","Ecuador","M\u00e9xico","Per\u00fa","----------------------------","Afganist\u00e1n","Albania","Alemania","Andorra","Angola","Anguila","Antigua y Barbuda","Antillas Neerlandesas","Ant\u00e1rtida","Arabia Saud\u00ed","Argelia","Argentina","Armenia","Aruba","Australia","Austria","Azerbaiy\u00e1n","Bahamas","Bahr\u00e9in","Bangladesh","Barbados","Belice","Ben\u00edn","Bermudas","Bielorrusia","Bolivia","Bosnia-Herzegovina","Botsuana","Brasil","Brun\u00e9i","Bulgaria","Burkina Faso","Burundi","But\u00e1n","B\u00e9lgica","Cabo Verde","Camboya","Camer\u00fan","Canad\u00e1","Chad","Chile","China","Chipre","Ciudad del Vaticano","Colombia","Comoras","Congo","Corea del Norte","Corea del Sur","Costa Rica","Costa de Marfil","Croacia","Cuba","Dinamarca","Dominica","Ecuador","Egipto","El Salvador","Emiratos \u00c1rabes Unidos","Eritrea","Eslovaquia","Eslovenia","Espa\u00f1a","Estados Unidos","Estonia","Etiop\u00eda","Filipinas","Finlandia","Fiyi","Francia","Gab\u00f3n","Gambia","Georgia","Ghana","Gibraltar","Granada","Grecia","Groenlandia","Guadalupe","Guam","Guatemala","Guayana Francesa","Guernsey","Guinea","Guinea Ecuatorial","Guinea-Bissau","Guyana","Hait\u00ed","Honduras","Hong Kong","Hungr\u00eda","India","Indonesia","Iraq","Irlanda","Ir\u00e1n","Isla Bouvet","Isla Christmas","Isla Niue","Isla Norfolk","Isla de Man","Islandia","Israel","Italia","Jamaica","Jap\u00f3n","Jersey","Jordania","Kazajist\u00e1n","Kenia","Kirguist\u00e1n","Kiribati","Kuwait","Laos","Lesoto","Letonia","Liberia","Libia","Liechtenstein","Lituania","Luxemburgo","L\u00edbano","Macao","Macedonia","Madagascar","Malasia","Malaui","Maldivas","Mali","Malta","Marruecos","Martinica","Mauricio","Mauritania","Mayotte","Micronesia","Moldavia","Mongolia","Montenegro","Montserrat","Mozambique","Myanmar","M\u00e9xico","M\u00f3naco","Namibia","Nauru","Nepal","Nicaragua","Nigeria","Noruega","Nueva Caledonia","Nueva Zelanda","N\u00edger","Om\u00e1n","Pakist\u00e1n","Palau","Palestina","Panam\u00e1","Pap\u00faa Nueva Guinea","Paraguay","Pa\u00edses Bajos","Per\u00fa","Pitcairn","Polinesia Francesa","Polonia","Portugal","Puerto Rico","Qatar","Regi\u00f3n desconocida o no v\u00e1lida","Reino Unido","Rep\u00fablica Centroafricana","Rep\u00fablica Checa","Rep\u00fablica Democr\u00e1tica del Congo","Rep\u00fablica Dominicana","Reuni\u00f3n","Ruanda","Ruman\u00eda","Rusia","Samoa","Samoa Americana","San Bartolom\u00e9","San Crist\u00f3bal y Nieves","San Marino","San Mart\u00edn","San Pedro y Miquel\u00f3n","San Vicente y las Granadinas","Santa Elena","Santa Luc\u00eda","Santo Tom\u00e9 y Pr\u00edncipe","Senegal","Serbia","Serbia y Montenegro","Seychelles","Sierra Leona","Singapur","Siria","Somalia","Sri Lanka","Suazilandia","Sud\u00e1frica","Sud\u00e1n","Suecia","Suiza","Surinam","Svalbard y Jan Mayen","S\u00e1hara Occidental","Tailandia","Taiw\u00e1n","Tanzania","Tayikist\u00e1n","Territorio Brit\u00e1nico del Oc\u00e9ano \u00cdndico","Territorios Australes Franceses","Timor Oriental","Togo","Tokelau","Tonga","Trinidad y Tobago","Turkmenist\u00e1n","Turqu\u00eda","Tuvalu","T\u00fanez","Ucrania","Uganda","Uruguay","Uzbekist\u00e1n","Vanuatu","Venezuela","Vietnam","Wallis y Futuna","Yemen","Yibuti","Zambia","Zimbabue"];

		urlparams.forEach(function(elem,ind,arr) {
			var k = elem.split("=")[0];
			var v = elem.split("=")[1];
			params[k]=v;
		});

		function $(sel){
			var ret =document.querySelectorAll(sel);
			if (ret.length==1)
				return ret[0];
			return ret;
		}
		window.addEventListener('load', function() { 
			var spinner = $("#spinner");
			var bigbox = humane.create({baseCls: 'humane-original', timeout: 150})
			var button = $("#button");

			button.style.display="none";
			button.onclick = send;
			bigbox.error = bigbox.spawn({addnCls: 'humane-bigbox-error'})

			function send() {
				if ($("form").checkValidity()==false)
					return;		
				spinner.style.display="block";
				xhttp.onreadystatechange = function() {
					if (xhttp.readyState == 4) {
					  	var data =JSON.parse(xhttp.responseText);
						spinner.style.display="none";
				  		switch (xhttp.status) {
				  			case 200:
								bigbox.log(data.mensaje, { timeout: 5000, clickToClose: true });
								break;
				  			case 401:
								bigbox.error(data.mensaje, { timeout: 5000, clickToClose: true });
								break;
						}
					}
				};
				if (update==1)
					xhttp.open("POST", "back/update.php", true);
				else
					xhttp.open("PUT", "back/update.php", true);

				xhttp.send(JSON.stringify(user));
			};
			function get() {
				xhttp.onreadystatechange = function() {
				  if (xhttp.readyState == 4) {
				  	var data =JSON.parse(xhttp.responseText);
					spinner.style.display="none";
				  	switch (xhttp.status) {
				  		case 200:
				  			$("input[type='email']").disabled=true;
				  	    	user = data;
							user.hash=params["hash"];
				 			view.update({user:user}); //Esto esta mal. ????
							button.style.display="block";
				  	  		break;
				  		case 401: //Registrate
							bigbox.error(data.mensaje, { timeout: 5000, clickToClose: true });
							button.style.display="block";
							user.pais="Argentina";
				 			view.update({user:user}); //Esto esta mal. ????
							break;
				  		case 402:
							bigbox.error(data.mensaje, { timeout: 5000, clickToClose: true });
					  	  	break;
				  	}
				  }
				};
				xhttp.open("GET", "back/update.php?mail="+params["email"]+"&hash="+params["hash"], true);
				xhttp.send();
			}
			get();

		}, false);
		
		var view = rivets.bind(el, {countries:countries, user: user});
		var numbers=$("input[numbersonly]");
		for(var i=0; i<numbers.length;i++){
			var e = numbers[i];
			e.onkeypress = function(e){ return e.charCode<= 26 || (e.charCode>=48 && e.charCode<=57); }
		}
		numbers=$("input[maxlength]");
		for(var i=0; i<numbers.length;i++){
			var e = numbers[i];
			e.oninput = function(){ var l = this.getAttribute("maxlength"); if (this.value.length >l) this.value=this.value.slice(0,l); }
		}
	</script>
</body>