Ver Mensaje Individual
  #1 (permalink)  
Antiguo 23/07/2016, 18:21
JESUMINISTROSYMAS
(Desactivado)
 
Fecha de Ingreso: septiembre-2008
Ubicación: Maracay edo Aragua Venezuela
Mensajes: 48
Antigüedad: 16 años, 2 meses
Puntos: 3
Pregunta Simplificar Codigo

Saludos cordiales a todos, seré breve, recurro a este portal con la finalidad de ver si pueden aportarme luces de como simplificar un código que estoy haciendo.
No soy muy conocedor de JS pero motivado que estoy diseñando cursos en ambiente offline es el recurso que me permite configurar lo que deseo.
Vale destacar que lo que tengo hecho funciona al 100% dándome los resultados que deseo, pero solo llevo 3 bloques de configuración que poseen estructuras similares, he estado dando y dando a ver como puedo simplificar con la utilizacion de ciclos pero no logro comprender como puedo hacerlo.

Lo que tengo:
Estoy diseñando un curso para elaboracion de productos de limpieza, basicamente la idea es que desde un html se ingresa un dato numerico desde un input que es analizado por un JS a ver si es un numero mayor a 0.1 y se valida de que sea un numero y no una letra o un espacio etc etc..

luego si es un numero valido el JS da resultados segun el numero indicado, basicamente calcula las cantidades por cada producto de la receta a utilizarse en el producto de limpieza sea Cloro, Desinfectante, etc etc.

Aca el JS

Código Javascript:
Ver original
  1. function entrada(){
  2. if(UI=document.getElementById('entradaDetergenteRopa')){detergenteRopa();}
  3. else if(UI=document.getElementById('entradaCloro')) {cloro();}
  4. else if(UI=document.getElementById('entradaLimpiaInodoros')) {limpiadorInodoros();}
  5. }
  6.  
  7.  
  8. function validarSiNumero(UI){
  9.     if (!/^([0.1-9])*$/.test(UI)){
  10.     //alert("El valor  " + UI + " no es un número valido, intente utilizar numeros desde 0.1 hasta la cantidad de litros que usted desee fabricar");
  11. var alerta = "<div class=clase1><table class=clase2 ><tr><td>"+"EL VALOR INDICADO: <b>" + UI + "</b> NO ES UN NUMERO VALIDO<br> INTENTE UTILIZAR NUMEROS DESDE 0.1 HASTA LA CANTIDAD DE LITROS QUE USTED DESEE FABRICAR"+"</td></tr></table></div>";
  12.     document.getElementById('salida').innerHTML=
  13. alerta;
  14. }
  15. else if (UI==""){
  16. var nada = "<div class=clase1><table class=clase2 ><tr><td>"+"NO HA ESCRITO NADA INTENTE UTILIZAR NUMEROS DESDE 0.1 HASTA LA CANTIDAD DE LITROS QUE USTED DESEE FABRICAR"+"</td></tr></table></div>";
  17. document.getElementById('salida').innerHTML=
  18. nada;}
  19. else { entrada();
  20. }}
  21.  
  22. var ml=" Mililitros";
  23. var l=" Litros";
  24. var g=" Gramos";
  25. var mg=" Miligramos";
  26. var k=" Kilogramos";
  27.  
  28. //CLORO
  29. function cloro() {
  30. var UI=document.getElementById('entradaCloro').value;
  31. if(isNaN(UI)){return false;}
  32. var agu = UI*80/100;
  33. var hip = UI*20/100;
  34. var fos = UI*0.25/100;
  35. var car = UI*0.25/100;
  36. var per = UI*0.30/100;
  37. if (UI<=1){
  38. agu = (agu*1000).toFixed(2) + ml;
  39. hip = (hip*1000).toFixed(2) + ml;
  40. fos = (fos*1000).toFixed(2) + g;
  41. car = (car*1000).toFixed(2) + g;
  42. per = (per*1000).toFixed(2) + ml;
  43. }
  44. else{
  45. agu= agu.toFixed(2) + l;
  46. hip= hip.toFixed(2) + l;
  47. if (fos*1000>=1000){fos = fos.toFixed(2) + k;}else{fos=(fos*1000).toFixed(2)+g;}
  48. if (car*1000>=1000){car = car.toFixed(2) + k;}else{car=(car*1000).toFixed(2)+g;}
  49. if (per*1000>=1000){per = per.toFixed(2) + l;}else{per=(per*1000).toFixed(2)+ml;}
  50. }
  51. var pCloro = "<table class=clase4 ><tr><td><h1>PROCEDIMIENTO:</h1><p>En el recipiente plástico colocan el agua, al cual le agregan el hipoclorito de sodio y revuelven bien con la cuchara de palo, (ambos elementos los pueden medir con una probeta) Luego agregamos el fosfato trisódico y el carbonato- Previamente pesados, y deben seguir revolviendo muy bien. Adicionan la fragancia hiposódica previamente medida en la probeta, se revuelve bien todo con la cuchara de palo y empacamos con la ayuda del embudo.</p><p>Nota. La fragancia hiposódica que puede ser usada: Lavanda, Floral y Limón, siempre y cuando sean fragancias hiposódicas.</p><p><b>Recomendaciones:</b> No tiene ninguna recomendación en especial.</p><b>Precauciones:</b> Use delantal, evite las salpicaduras mientras hace el producto, pues este producto puede decolorar la ropa.</p></table>";
  52. var resul =
  53. "<div class=clase1><table class=clase2 ><tr><td>"+
  54. "<b>Para Procesar "+UI+" Litros Usted Necesitará:</b>"+"<p>"+
  55. "1.- Agua - H2O" + " = "+agu+"<br>"+
  56. "2.- Hipoclorito - ClO−" + " = "+hip+"<br>"+
  57. "3.- Fosfato Trisodico" + " = "+fos+"<br>"+
  58. "4.- Carbonato ASH" + " = "+car+"<br>"+
  59. "5.- Perfume Hiposodico" + " = "+per+"<br>"+
  60. "</td></tr></table></div>"+ pCloro;
  61. document.getElementById('salida').innerHTML=resul;
  62.  
  63. }
  64.  
  65. //DETERGENTE
  66. function detergenteRopa() {
  67. var UI=document.getElementById('entradaDetergenteRopa').value;
  68. if(isNaN(UI)){return false;}
  69. var tex = UI*14.1/100;
  70. var pas = UI*0.75/100;
  71. var ash = UI*0.2/100;
  72. var sal = UI*3/100;
  73. var agu = UI*82/100;
  74. var col = UI*0.2/100;
  75. var fra = "Al Gusto";
  76. var form = UI*0.2/100;
  77. if (UI<=1){
  78. tex = (tex*1000).toFixed(2) + " ml";
  79. pas = (pas*1000).toFixed(2) + " ml";
  80. ash= (ash*1000).toFixed(2) + " ml";
  81. sal= (sal*1000).toFixed(2) + " gr";
  82. agu= (agu*1000).toFixed(2) + " ml";
  83. col= (col*1000).toFixed(2) + " gr";
  84. form= (form*1000).toFixed(2) + " gr";
  85. }
  86. else{
  87. if (tex*1000>=1000){tex = tex.toFixed(2) + l;}else{tex=(tex*1000).toFixed(2)+ml;}
  88. if (pas*1000>=1000){pas = pas.toFixed(2) + l;}else{pas=(pas*1000).toFixed(2)+ml;}
  89. if (ash*1000>=1000){ash = ash.toFixed(2) + l;}else{ash=(ash*1000).toFixed(2)+ml;}
  90. if (sal*1000>=1000){sal = sal.toFixed(2) + k;}else{sal=(sal*1000).toFixed(2)+g;}
  91. if (agu*1000>=1000){agu = agu.toFixed(2) + l;}else{agu=(agu*1000).toFixed(2)+ml;}
  92. if (col*1000>=1000){col = col.toFixed(2) + k;}else{col=(col*1000).toFixed(2)+g;}
  93. if (form*1000>=1000){form = form.toFixed(2) + k;}else{form=(form*1000).toFixed(2)+g;}
  94. }
  95. var pDetergenteRopa = "<table class=clase4 ><tr><td><h1>PROCEDIMIENTO:</h1><p>Mezclar los ingredientes 1, 2, 3 y el 4 agitar moderadamente de forma suave luego agregar el 5 poco a poco y después agregar el 6, 7 y el 8; recuerden dejar reposar por dos horas o hasta que la espuma se disperse.<br>Los productos se deben mezclar en el orden señalado.</p><p>Nota. La fragancia mas comerciales que pueden utilizar son: Lavanda, Floral, Talco.</p><p><b>Recomendaciones:</b> No tiene ninguna recomendación en especial</p><b>Precauciones:</b> Use delantal, Guantes, Lentes.</p></table>";
  96. var resul =
  97. "<div class=clase1><table class=clase2 ><tr><td>"+
  98. "<b>Para Procesar "+UI+" Litros Usted Necesitará:</b>"+"<p>"+
  99. "1.- Texapon" + " = "+tex+"<br>"+
  100. "2.- Pasta Sulfonica" + " = "+pas+"<br>"+
  101. "3.- Soda ASH Light" + " = "+ash+"<br>"+
  102. "4.- Sal" + " = "+sal+"<br>"+
  103. "5.- Agua - H2O" + " = "+agu+"<br>"+
  104. "6.- Color" + " = "+col+"<br>"+
  105. "7.- Fragancia" + " = "+fra+"<br>"+
  106. "8.- Formol o Benzoato de Sodio" + " = "+form+"<br>"+
  107. "</td></tr></table></div>"+ pDetergenteRopa;;
  108. document.getElementById('salida').innerHTML=resul;
  109. }
  110.  
  111. //LIMPIADOR INODOROS
  112. function limpiadorInodoros() {
  113. var UI=document.getElementById('entradaLimpiaInodoros').value;
  114. if(isNaN(UI)){return false;}
  115. var am = UI*37.5/100;
  116. var agu = UI*62.5/100;
  117. var af = UI*5.663/100;
  118. var amo = UI*0.75/100;
  119. if (UI<=1){
  120. am = (am*1000).toFixed(2) + " ml";
  121. agu = (agu*1000).toFixed(2) + " ml";
  122. af= (af*1000).toFixed(2) + " gr";
  123. amo= (amo*1000).toFixed(2) + " ml";
  124. }
  125. else{
  126. if (am*1000>=1000){am = am.toFixed(2) + l;}else{am=(am*1000).toFixed(2)+ml;}
  127. if (agu*1000>=1000){agu = agu.toFixed(2) + l;}else{agu=(agu*1000).toFixed(2)+ml;}
  128. if (af*1000>=1000){af = af.toFixed(2) + k;}else{af=(af*1000).toFixed(2)+g;}
  129. if (amo*1000>=1000){amo = amo.toFixed(2) + l;}else{amo=(amo*1000).toFixed(2)+ml;}
  130. }
  131. var pLimpiadorInodoros = "<table class=clase4><tr><td><h1>PROCEDIMIENTO:</h1><p>Disolver el uno en el dos y luego el tres y después el 4 Siempre respetar el orden indicado. <br><li>El uno es un agente descurtidor.</li><li>El tres es un removedor de oxido.</li><li>El cuatro es un agente antibacterial.</li><br></p><b>Precauciones:</b> Use delantal, Guantes, Lentes.</p></table>";
  132. var resul =
  133. "<div class=clase1><table class=clase2 ><tr><td>"+
  134. "<b>Para Procesar "+UI+" Litros Usted Necesitará:</b>"+"<p>"+
  135. "1.- Acido Muriatico" + " = "+am+"<br>"+
  136. "2.- Agua - H2O" + " = "+agu+"<br>"+
  137. "3.- Acido Fosforico" + " = "+af+"<br>"+
  138. "4.- Amonio Cuaternario al 80%" + " = "+amo+"<br>"+
  139. "</td></tr></table></div>"+ pLimpiadorInodoros;;
  140. document.getElementById('salida').innerHTML=resul;
  141. }

Como indique anteriormente tal cual como esta funciona pero aun estoy haciendo código ya que son mas de 50 productos a configurar, tengo adicional una función que se repite n cantidad de veces y es para determinar que si el valor resultado es < de 1000 ml o gr utilice la unidad ml o gr y si es mayor utilice Litro o Kilo respectivamente, Repito, tal como esta, funciona pero si se puede simplificar me gustaría implementar dicha simplificación, si alguien ve la forma de como simplificar el código que estoy escribiendo estaré agradecido.