diff --git a/src/public/scripts/calcExchange.js b/src/public/scripts/calcExchange.js new file mode 100644 index 0000000..29956e8 --- /dev/null +++ b/src/public/scripts/calcExchange.js @@ -0,0 +1,3 @@ +let rate = document.getElementsByClassName("countryButton").value; + +document.getElementById("exchange").innerHTML \ No newline at end of file diff --git a/src/public/scripts/geolocation.js b/src/public/scripts/geolocation.js index 4bdf42a..82c6983 100644 --- a/src/public/scripts/geolocation.js +++ b/src/public/scripts/geolocation.js @@ -4,13 +4,66 @@ function getLocation() { } } +function update(data) { + document.getElementById("loading").style = "display: none"; + document.getElementById("currencyExchange").style = "display: flex"; + + document.getElementById("yourFlag").src = `/static/svgs/flags/${data.data.country}.svg` + document.getElementById("yourFlag").alt = data.data.country; + document.getElementById("flagTag").innerHTML = `(${data.data.country})`; + + document.getElementById("exchangeFlag").src = `/static/svgs/flags/USD.svg`; + document.getElementById("exchangeFlag").alt = "USD"; + document.getElementById("exFlagTag").innerHTML = "(USD)"; + + document.getElementById("dropdown-country-button").value = data.data.toCurrencyRates["USD"]; + + updateExchange(document.getElementById("dropdown-country-button").value); + + const dropdown = document.getElementById("dropdown"); + let countries = Object.keys(data.data.toCurrencyRates); + + countries.forEach(item => { + if (dropdown.querySelector(`button[value="${data.data.toCurrencyRates[item]}"]`)) { + return; + } + + const listItem = document.createElement("li"); + listItem.innerHTML = ``; + + dropdown.appendChild(listItem); + }); + + console.log(data); +} + +function switchButton(clickedButton) { + document.getElementById("dropdown-country-button").value = clickedButton.value; + updateExchange(document.getElementById("dropdown-country-button").value); + + document.getElementById("dropdown-country-button").innerHTML = clickedButton.innerHTML + + ` + + `; +} + +function updateExchange(exRate) { + document.getElementById("exchange1").innerHTML = "$1.00 = $" +`${(1 * exRate).toFixed(2)}`; +} + async function getLatestExchange(position) { let lat = position.coords.latitude; let lon = position.coords.longitude; const res = await fetch(`/exRates/${lat}/${lon}`); const data = await res.json(); - console.log(data); + update(data); } function error(err) { diff --git a/src/public/scripts/header.js b/src/public/scripts/header.js deleted file mode 100644 index e69de29..0000000 diff --git a/src/public/svgs/flags/BGN.svg b/src/public/svgs/flags/BGN.svg new file mode 100644 index 0000000..af2d0d0 --- /dev/null +++ b/src/public/svgs/flags/BGN.svg @@ -0,0 +1,5 @@ + + + + + diff --git a/src/public/svgs/flags/CHF.svg b/src/public/svgs/flags/CHF.svg new file mode 100644 index 0000000..b42d670 --- /dev/null +++ b/src/public/svgs/flags/CHF.svg @@ -0,0 +1,9 @@ + + + + + + + + + diff --git a/src/public/svgs/flags/CZK.svg b/src/public/svgs/flags/CZK.svg new file mode 100644 index 0000000..7913de3 --- /dev/null +++ b/src/public/svgs/flags/CZK.svg @@ -0,0 +1,5 @@ + + + + + diff --git a/src/public/svgs/flags/DKK.svg b/src/public/svgs/flags/DKK.svg new file mode 100644 index 0000000..563277f --- /dev/null +++ b/src/public/svgs/flags/DKK.svg @@ -0,0 +1,5 @@ + + + + + diff --git a/src/public/svgs/flags/HKD.svg b/src/public/svgs/flags/HKD.svg new file mode 100644 index 0000000..4fd55bc --- /dev/null +++ b/src/public/svgs/flags/HKD.svg @@ -0,0 +1,8 @@ + + + + + + + + diff --git a/src/public/svgs/flags/HUF.svg b/src/public/svgs/flags/HUF.svg new file mode 100644 index 0000000..baddf7f --- /dev/null +++ b/src/public/svgs/flags/HUF.svg @@ -0,0 +1,7 @@ + + + + + + + diff --git a/src/public/svgs/flags/IDR.svg b/src/public/svgs/flags/IDR.svg new file mode 100644 index 0000000..3b7c8fc --- /dev/null +++ b/src/public/svgs/flags/IDR.svg @@ -0,0 +1,4 @@ + + + + diff --git a/src/public/svgs/flags/ILS.svg b/src/public/svgs/flags/ILS.svg new file mode 100644 index 0000000..f43be7e --- /dev/null +++ b/src/public/svgs/flags/ILS.svg @@ -0,0 +1,14 @@ + + + + + + + + + + + + + + diff --git a/src/public/svgs/flags/ISK.svg b/src/public/svgs/flags/ISK.svg new file mode 100644 index 0000000..a6588af --- /dev/null +++ b/src/public/svgs/flags/ISK.svg @@ -0,0 +1,12 @@ + + + + + + + + + + + + diff --git a/src/public/svgs/flags/KRW.svg b/src/public/svgs/flags/KRW.svg new file mode 100644 index 0000000..6947eab --- /dev/null +++ b/src/public/svgs/flags/KRW.svg @@ -0,0 +1,24 @@ + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/src/public/svgs/flags/MYR.svg b/src/public/svgs/flags/MYR.svg new file mode 100644 index 0000000..115f864 --- /dev/null +++ b/src/public/svgs/flags/MYR.svg @@ -0,0 +1,26 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/src/public/svgs/flags/NOK.svg b/src/public/svgs/flags/NOK.svg new file mode 100644 index 0000000..a5f2a15 --- /dev/null +++ b/src/public/svgs/flags/NOK.svg @@ -0,0 +1,7 @@ + + + + + + + diff --git a/src/public/svgs/flags/NZD.svg b/src/public/svgs/flags/NZD.svg new file mode 100644 index 0000000..935d8a7 --- /dev/null +++ b/src/public/svgs/flags/NZD.svg @@ -0,0 +1,36 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/src/public/svgs/flags/PHP.svg b/src/public/svgs/flags/PHP.svg new file mode 100644 index 0000000..b910e24 --- /dev/null +++ b/src/public/svgs/flags/PHP.svg @@ -0,0 +1,6 @@ + + + + + + diff --git a/src/public/svgs/flags/PLN.svg b/src/public/svgs/flags/PLN.svg new file mode 100644 index 0000000..0fa5145 --- /dev/null +++ b/src/public/svgs/flags/PLN.svg @@ -0,0 +1,6 @@ + + + + + + diff --git a/src/public/svgs/flags/RON.svg b/src/public/svgs/flags/RON.svg new file mode 100644 index 0000000..fda0f7b --- /dev/null +++ b/src/public/svgs/flags/RON.svg @@ -0,0 +1,7 @@ + + + + + + + diff --git a/src/public/svgs/flags/SEK.svg b/src/public/svgs/flags/SEK.svg new file mode 100644 index 0000000..8ba745a --- /dev/null +++ b/src/public/svgs/flags/SEK.svg @@ -0,0 +1,4 @@ + + + + diff --git a/src/public/svgs/flags/SGD.svg b/src/public/svgs/flags/SGD.svg new file mode 100644 index 0000000..c4dd4ac --- /dev/null +++ b/src/public/svgs/flags/SGD.svg @@ -0,0 +1,13 @@ + + + + + + + + + + + + + diff --git a/src/public/svgs/flags/THB.svg b/src/public/svgs/flags/THB.svg new file mode 100644 index 0000000..1e93a61 --- /dev/null +++ b/src/public/svgs/flags/THB.svg @@ -0,0 +1,7 @@ + + + + + + + diff --git a/src/public/svgs/flags/TRY.svg b/src/public/svgs/flags/TRY.svg new file mode 100644 index 0000000..b96da21 --- /dev/null +++ b/src/public/svgs/flags/TRY.svg @@ -0,0 +1,8 @@ + + + + + + + + diff --git a/src/public/svgs/flags/ZAR.svg b/src/public/svgs/flags/ZAR.svg new file mode 100644 index 0000000..d563adb --- /dev/null +++ b/src/public/svgs/flags/ZAR.svg @@ -0,0 +1,17 @@ + + + + + + + + + + + + + + + + + diff --git a/src/router/user.js b/src/router/user.js index 35ef92b..1332e24 100644 --- a/src/router/user.js +++ b/src/router/user.js @@ -11,7 +11,41 @@ module.exports = (middleware, users, plans) => { router.use(middleware); router.get('/home', async (req, res) => { - res.render('dashboard', { user: req.user, location: req.session.country, countriesRates: req.session.rates }); + + + /* + + <% if (countryRates.length == 0) { %> + render loading icon + <% } else { %> + render exchange + <% } %> + + stuff + + + */ + + // if no session with geoData + if (!req.session.geoData) { + req.session.geoData = { + country: null, + toCurrencyRates: [], + }; + } + + res.render('dashboard', { user: req.user, geoData: req.session.geoData }); + return res.status(status.Ok); }); @@ -266,17 +300,19 @@ module.exports = (middleware, users, plans) => { }); router.get("/exRates/:lat/:lon", async (req, res) => { - if (!req.session.rates || Object.keys(req.session.rates).length == 0) { + if (!req.session.geoData.country) { const response = await fetch(`https://maps.googleapis.com/maps/api/geocode/json?latlng=${req.params.lat},${req.params.lon}&result_type=country&key=${process.env.geolocation_api}`); const data = await response.json(); country = data.results[0].formatted_address; let results = await getRates(country); - req.session.rates = results.exRates; - req.session.country = results.abbreviation; + req.session.geoData = { + country: results.abbreviation, + toCurrencyRates: results.exRates + } } - return res.status(status.Ok).send({ rates: req.session.rates }); + return res.status(status.Ok).send({ data: req.session.geoData }); }) return router; diff --git a/src/views/dashboard.ejs b/src/views/dashboard.ejs index be866a1..5bcdd79 100644 --- a/src/views/dashboard.ejs +++ b/src/views/dashboard.ejs @@ -93,6 +93,13 @@ + + + <%- include("./partials/navBar") %> <%- include("./partials/footer") %> \ No newline at end of file diff --git a/src/views/partials/header.ejs b/src/views/partials/header.ejs index e8371ec..f872576 100644 --- a/src/views/partials/header.ejs +++ b/src/views/partials/header.ejs @@ -6,31 +6,71 @@ Flowbite Logo RCalculator - + <% } %>