main.js 6.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209
  1. window.onload = function() {
  2. var req = new XMLHttpRequest();
  3. var availableWidth = [ 500, 1024, 1400, 1920];
  4. var size=0;
  5. var banner=document.getElementById("banner");
  6. while (window.innerWidth > availableWidth[size] && size < availableWidth.length-1 )
  7. size++;
  8. banner.src="Images/slider/slide1-"+availableWidth[size]+".jpg";
  9. var contact= document.getElementsByClassName("contact");
  10. var tit_curso = document.getElementsByClassName("titulo_curso");
  11. var desc_curso = document.getElementsByClassName("descripcion_curso");
  12. var list = document.getElementsByTagName("li");
  13. var overlay=document.getElementById('overlay-contact');
  14. var exit=document.getElementById('exit');
  15. var basicgrey=document.getElementById('basic-grey');
  16. var logo=document.getElementById('logo');
  17. var btnconsulta=document.getElementById('btnconsulta');
  18. var btnok=document.getElementById('ok');
  19. function curso_click(){
  20. for(var j =0; j < desc_curso.length; j++){
  21. if (desc_curso[j].getAttribute("title") == this.getAttribute("title")) {
  22. var child = this.firstElementChild;
  23. if(desc_curso[j].style.display=="block") {
  24. child.innerHTML = child.innerHTML.replace("-","+");
  25. desc_curso[j].style.display="none";
  26. } else {
  27. child.innerHTML = child.innerHTML.replace("+","-");
  28. desc_curso[j].style.display="block";
  29. }
  30. }
  31. }
  32. }
  33. overlay.onclick = function(){
  34. overlay.style.display="none";
  35. basicgrey.style.display="none";
  36. }
  37. exit.onclick=function(){
  38. overlay.style.display="none";
  39. basicgrey.style.display="none";
  40. }
  41. btnok.onclick=function(){
  42. var params="mail="+document.getElementById("suscribe").value;
  43. req.open("POST", "newsletter.php", true);
  44. req.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
  45. req.setRequestHeader("Content-length", params.length);
  46. req.setRequestHeader("Connection", "close");
  47. req.onreadystatechange=function(){
  48. if(req.readyState == 4 && req.status == 200)
  49. document.getElementById("respuestanewsletter").innerHTML=req.responseText;
  50. }
  51. req.send(params);
  52. };
  53. btnconsulta.onclick=function(){
  54. if (btnconsulta.disabled) return;
  55. if (document.getElementById("name").value.length == 0 || document.getElementById("message").value.length<10) {
  56. document.getElementById("respuestacontacto").innerHTML="Por favor completa todos los campos";
  57. return;
  58. }
  59. document.getElementById("respuestacontacto").innerHTML="Enviando...";
  60. var params = "nombre="+document.getElementById("name").value;
  61. params=params+"&mail="+document.getElementById("email").value;
  62. params=params+"&consulta="+document.getElementById("message").value;
  63. req.open("POST", "contacto.php", true);
  64. req.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
  65. req.setRequestHeader("Content-length", params.length);
  66. req.setRequestHeader("Connection", "close");
  67. req.onreadystatechange=function(){
  68. if(req.readyState == 4 && req.status == 200)
  69. document.getElementById("respuestacontacto").innerHTML=req.responseText;
  70. btnconsulta.value="Enviar";
  71. btnconsulta.disabled=false;
  72. }
  73. btnconsulta.value="Enviando....";
  74. btnconsulta.disabled=true;
  75. req.send(params);
  76. };
  77. for(var i =0; i < tit_curso.length; i++)
  78. tit_curso[i].onclick=curso_click;
  79. for(var i =0; i < contact.length; i++)
  80. contact[i].onclick=showContact;
  81. for(var i =0; i < list.length; i++)
  82. if(list[i].firstChild.tagName=="A")
  83. list[i].firstChild.addEventListener("click", function(e) {
  84. var target=document.getElementById(this.hash.replace("#",""))
  85. scrollToY(target.offsetTop, 1500, 'easeInOutQuint');
  86. if (this.hash=='#footer-outer')
  87. showContact();
  88. e.preventDefault();
  89. });
  90. function showContact() {
  91. basicgrey.style.display="block";
  92. overlay.style.display="block";
  93. }
  94. var startY=banner.scrollHeight;
  95. window.onscroll = function () {
  96. logo.style.opacity=1*(window.pageYOffset > startY ); //bool->int
  97. };
  98. var curImg=1;
  99. setInterval(slide, 8000);
  100. var distrib;
  101. if (window.innerWidth <= 890) { //distribuidoras
  102. var xhr = new XMLHttpRequest();
  103. xhr.open('GET', encodeURI('lista_distrib.php'));
  104. xhr.onload = function() {
  105. if (xhr.status === 200) {
  106. distrib=JSON.parse(xhr.responseText);
  107. var sel = document.createElement("select");
  108. var selProv= document.createElement("select");
  109. var selZona = document.createElement("select");
  110. var result= document.createElement("div");
  111. sel.id="pais";
  112. selProv.id="prov";
  113. selZona.id="zona";
  114. result.id="result";
  115. for (country in distrib) {
  116. var opt = document.createElement("option");
  117. var node = document.createTextNode(country);
  118. opt.appendChild(node);
  119. sel.appendChild(opt);
  120. }
  121. sel.selectedIndex=-1;
  122. sel.onchange=changeCountry;
  123. selProv.onchange=changeProv;
  124. selZona.onchange=changeZona;
  125. document.getElementById("distribuidoras").appendChild(sel);
  126. document.getElementById("distribuidoras").appendChild(selProv);
  127. document.getElementById("distribuidoras").appendChild(selZona);
  128. document.getElementById("distribuidoras").appendChild(result);
  129. }
  130. else {
  131. alert('Request failed. Returned status of ' + xhr.status);
  132. }
  133. };
  134. xhr.send();
  135. }
  136. function changeCountry() {
  137. var pais = document.getElementById("pais").value;
  138. var prov = document.getElementById("prov");
  139. var zona = document.getElementById("zona");
  140. zona.innerHTML="";
  141. prov.innerHTML="";
  142. if(distrib[pais] == undefined) return;
  143. for (provincia in distrib[pais]) {
  144. var opt = document.createElement("option");
  145. var node = document.createTextNode(provincia);
  146. opt.appendChild(node);
  147. prov.appendChild(opt);
  148. }
  149. prov.selectedIndex=-1;
  150. }
  151. function changeProv() {
  152. var pais = document.getElementById("pais").value;
  153. var prov = document.getElementById("prov").value;
  154. var zona = document.getElementById("zona");
  155. prov.innerHTML="";
  156. zona.innerHTML="";
  157. if(distrib[pais] == undefined || distrib[pais][prov] == undefined) return;
  158. for (zone in distrib[pais][prov]) {
  159. var opt = document.createElement("option");
  160. var node = document.createTextNode(zone);
  161. opt.appendChild(node);
  162. zona.appendChild(opt);
  163. }
  164. zona.selectedIndex=-1;
  165. }
  166. function changeZona() {
  167. var pais = document.getElementById("pais").value;
  168. var prov = document.getElementById("prov").value;
  169. var zona = document.getElementById("zona").value;
  170. var result = document.getElementById("result");
  171. result.innerHTML="";
  172. var z = distrib[pais][prov][zona];
  173. var text="";
  174. for (distr in z ) {
  175. for (p in z[distr]) {
  176. result.appendChild(document.createTextNode(p+":"+z[distr][p]))
  177. result.appendChild(document.createElement("br"))
  178. }
  179. result.appendChild(document.createElement("br"))
  180. }
  181. }
  182. function slide() {
  183. banner.className='transp';
  184. setTimeout(transp, 500);
  185. curImg++;
  186. if(curImg>5) curImg=1;
  187. }
  188. function transp() {
  189. banner.src="Images/slider/slide"+curImg+"-"+availableWidth[size]+".jpg";
  190. banner.removeAttribute('class');
  191. }
  192. }