JavaScript-Final-Project-Module13/script.js at main · damicodedotpy/JavaScript-Final-Project-Module13 · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
var paragraphBitcoin = document.getElementById("bitcoinValue");
var paragraphDollar = document.getElementById("dollarValue");
var paragraphPesoArg = document.getElementById("pesoValue");


// This function gets the updated value of a given currency
function getCurrencyValue(currencyName) {
    // Get value of dollar currency
    if (currencyName === "dollar") {
        return fetch("https://open.er-api.com/v6/latest/USD")
        .then(data => data.json())
        .then(value => value.rates.ARS)
        .catch(error => console.error("Can not get info from API" + error))
    // Get value of bitcoin criptocurrency
    } else if (currencyName === "bitcoin"){
        return fetch("https://api.coindesk.com/v1/bpi/currentprice.json")
        .then(data => data.json())
        .then(value => value.bpi.USD.rate)
        .catch(error => console.error("Can not get info from API" + error))
    // Get value of peso argentino currency
    } else if (currencyName === "pesoArgentino") {
        return fetch("https://open.er-api.com/v6/latest/ARS")
        .then(data => data.json())
        .then(value => value.rates.USD)
        .catch(error => console.error("Can not get info from API" + error))
    }
}

// This function fill up the HTML paragraph of the dollar value and adds a GIF animation meanwhile the process is completed
async function updateDollarHTMLValue() {
    // Create an 'img' element to contain the loading gif animation
    var img = document.createElement("img")
    // Fill the 'img' element with the loading gif animation
    img.src = "./src/loading.gif";
    // Add the loading animation meanwhile the next promise is completed
    paragraphDollar.appendChild(img);
    // Get the currency value
    return await getCurrencyValue("dollar")
    // Replace the HTML paragraph content with the current value and remove the loading animation
    .then(value => {
        paragraphDollar.textContent = `$ ${value}`
        paragraphDollar.removeChild("img")
    })
    // If something goes wrong rise an error
    .catch(error => console.error("There was an error" + error))
}

// This function fill up the HTML paragraph of the bitcoin value and adds a GIF animation meanwhile the process is completed
async function updateBitcoinHTMLValue() {
    // Create an 'img' element to contain the loading gif animation
    var img = document.createElement("img")
    // Fill the 'img' element with the loading gif animation
    img.src = "./src/loading.gif";
    // Add the loading animation meanwhile the next promise is completed
    paragraphBitcoin.appendChild(img);
    // Get the currency value
    return await getCurrencyValue("bitcoin")
    // Replace the HTML paragraph content with the current value and remove the loading animation
    .then(value => {
        paragraphBitcoin.textContent = `B ${value}`
        paragraphBitcoin.removeChild("img")
    })
    // If something goes wrong rise an error
    .catch(error => console.error("There was an error" + error))
}

// This function fill up the HTML paragraph of the peso argentino value and adds a GIF animation meanwhile the process is completed
async function updatePesoArgHTMLValue() {
    // Create an 'img' element to contain the loading gif animation
    var img = document.createElement("img")
    // Fill the 'img' element with the loading gif animation
    img.src = "./src/loading.gif";
    // Add the loading animation meanwhile the next promise is completed
    paragraphPesoArg.appendChild(img)
    // Get the currency value
    return await getCurrencyValue("pesoArgentino")
    // Replace the HTML paragraph content with the current value and remove the loading animation
    .then(value => {
        paragraphPesoArg.textContent = `ARS ${value}`
        paragraphPesoArg.removeChild("img")
    })
    // If something goes wrong rise an error
    .catch(error => console.error("There was an error" + error))
}


// Show bitcoin current price
updateBitcoinHTMLValue()

// Show peso argentino current price
updatePesoArgHTMLValue()

// Show dollar current price
updateDollarHTMLValue()