90 lines
2.7 KiB
JavaScript
90 lines
2.7 KiB
JavaScript
const query_currency = async (base) => {
|
|
// Llama a la api para obtener los datos de conversion de divisa
|
|
// guardando los datos en localstorage
|
|
//
|
|
// En caso que se vuelva a llamar esta funcion pidiendo la misma base
|
|
// se va a evitar llamar a la api y se obtendran los datos desde localstorage
|
|
|
|
const old = JSON.parse(localStorage.getItem('currency'))
|
|
if (old != null && old.base === base) return old
|
|
|
|
const data = await fetch(`https://home.danielcortes.xyz/currency?base=${base}`)
|
|
const response = await data.json()
|
|
|
|
localStorage.setItem('currency', JSON.stringify(response))
|
|
|
|
return response
|
|
}
|
|
|
|
|
|
const currency = async (money, from, to) => {
|
|
// Hace la transformacion de una divisa a otra
|
|
// Adicionalmente lo formatea segun el locale del navegador
|
|
const data = await query_currency(from)
|
|
return (data.rates[to] * money).toLocaleString(undefined, {miminumFractionDigits: 2})
|
|
}
|
|
|
|
const fill_currencies = async () => {
|
|
// Rellena los datos de los input select con las monedas
|
|
// disponibles en la api
|
|
//
|
|
// Por default deja seleccionados para from el USD y para
|
|
// to el CLP
|
|
|
|
const data = await query_currency('USD')
|
|
const from_select = document.getElementById('currency-from')
|
|
const to_select = document.getElementById('currency-to')
|
|
|
|
Object.keys(data.symbols).forEach(key => {
|
|
const option = document.createElement('option');
|
|
|
|
option.value = key
|
|
option.innerHTML = `${key}`
|
|
|
|
const from_option = option.cloneNode(true)
|
|
const to_option = option.cloneNode(true)
|
|
|
|
if(key === 'USD') {
|
|
from_option.selected = 'selected'
|
|
}
|
|
|
|
if(key === 'CLP') {
|
|
to_option.selected = 'selected'
|
|
}
|
|
|
|
from_select.appendChild(from_option)
|
|
to_select.appendChild(to_option)
|
|
})
|
|
}
|
|
|
|
const show_currency = async () => {
|
|
// Muestra los datos del cambio de divisa con los datos
|
|
// que ingreso el usuario en los campos correspondientes
|
|
//
|
|
// eso de la validacion no existe aqui :3, es para nenas
|
|
|
|
const money = document.getElementById('currency-money').value
|
|
|
|
const from_select = document.getElementById('currency-from')
|
|
const to_select = document.getElementById('currency-to')
|
|
|
|
const from = from_select.options[from_select.selectedIndex].value
|
|
const to = to_select.options[to_select.selectedIndex].value
|
|
|
|
const result = await currency(money, from, to)
|
|
|
|
document.getElementById('currency-result').innerHTML = `${result}`
|
|
}
|
|
|
|
|
|
const on_load = async () => {
|
|
// Cuando se carge la pagina se asignaran los event listeners
|
|
// necesarios para su funcionamiento y se ejecutaran funciones
|
|
// que rellenen datos
|
|
|
|
document.getElementById('update-currency').addEventListener('click', show_currency)
|
|
fill_currencies().then(() => show_currency())
|
|
}
|
|
|
|
window.addEventListener('load', on_load)
|