Hace mucho tiempo en mis inicios en la programación hice un conversor de unidades usando JavaScript, HTML, CSS y los frameworks Bootstrap y jQuery. Era para mi clase de física. Hoy vengo a presentarlo y compartirlo por si a alguien más le sirve.

Es un simple convertidor de unidades web que transforma de una unidad a otra. Soporta:

1. Longitud
2. Masa
3. Tiempo
4. Energía
5. Frecuencia
6. Presión
7. Tamaño de datos
8. Temperatura
9. Velocidad
10. Volumen
11. Área

A través de este post te mostraré cómo funciona, cómo descargarlo y cómo está hecho.

Unidades soportadas

Soporta todos los grupos de unidades de medidas listadas anteriormente. Por ejemplo en longitud tiene metros, kilómetros, etcétera. En masa tiene gramo, kilogramo, y así para cada categoría.

He escrito todas las unidades y sus equivalencias en un diccionario. Es un archivo grande pues tiene todas las equivalencias como si fuera la base de datos. Se ve así (aunque no es el completo):

See the gist on github.

Ahora ese archivo es leído desde el verdadero conversor cuya plantilla HTML es la siguiente en donde cargamos los scripts incluyendo a jQuery.

See the gist on github.

Escuchamos ya sea que cambie el input o unos de los seleccionadores y se hace la conversión, quedando el código así:

See the gist on github.

Poniendo todo junto

Todo este conversor está hecho con Bootstrap (tanto estilos como funcionamiento de modals) y jQuery. Sé que jQuery ya casi no se usa pero recuerda que este programa fue hecho hace 5 años y apenas lo he publicado.

Si quieres el código fuente completo lo dejo en GitHub. También puedes acceder a una demostración aquí.