Skip to content

Commit

Permalink
compressed image
Browse files Browse the repository at this point in the history
  • Loading branch information
@revengemiroz
revengemiroz committed May 28, 2020
1 parent 7137dcd commit e36d735
Show file tree
Hide file tree
Showing 2 changed files with 60 additions and 59 deletions.
Binary file modified Covid-19/design/desktop-preview.jpg
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
119 changes: 60 additions & 59 deletions Covid-19/index.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,137 +3,138 @@ const cardEl = document.querySelectorAll('.countryCard')


fetch(`https://api.covid19api.com/summary`)
.then(res => res.json())
.then(data => {
console.log(data.Global)
.then(res => res.json())
.then(data => {
console.log(data.Global)

document.getElementById('title').innerText = "COVID-19 STATISTICS - GLOBAL";
document.getElementById('title').innerText = "COVID-19 STATISTICS - GLOBAL";

document.getElementById('total').innerHTML = `<div class="stats">
document.getElementById('total').innerHTML = `<div class="stats">
<div class="number">${data.Global.TotalConfirmed}</div>
<div class="factor">Infected</div>
</div>`;

document.getElementById('recover').innerHTML = `<div class="stats">
document.getElementById('recover').innerHTML = `<div class="stats">
<div class="number">${data.Global.TotalRecovered}</div>
<div class="factor">Recovered</div>
</div>`;

document.getElementById('sick').innerHTML = `<div class="stats">
document.getElementById('sick').innerHTML = `<div class="stats">
<div class="number">${data.Global.NewConfirmed}</div>
<div class="factor">Sick</div>
</div>`;

document.getElementById('dead').innerHTML = `<div class="stats">
document.getElementById('dead').innerHTML = `<div class="stats">
<div class="number">${data.Global.TotalDeaths}</div>
<div class="factor">Deaths</div>
</div>`;

})
})



const countryEl = document.querySelector('.flags')

async function country() {
const res = await fetch(`https://restcountries.eu/rest/v2/all`)
const data = await res.json()
const res = await fetch(`https://restcountries.eu/rest/v2/all`)
const data = await res.json()

data.forEach(country => {
data.forEach(country => {

const flagParentDiv = document.createElement('div')
flagParentDiv.classList.add('flag')
const flagParentDiv = document.createElement('div')
flagParentDiv.classList.add('flag')

const imgNameSpan = document.createElement('div')
const imgTag = document.createElement('img')
imgTag.src = 'https://countryflags.io/' + country.alpha2Code + '/flat/48.png'
const imgNameSpan = document.createElement('div')
const imgTag = document.createElement('img')
imgTag.src = 'https://countryflags.io/' + country.alpha2Code + '/flat/48.png'

flagParentDiv.setAttribute('title', country.name)
flagParentDiv.setAttribute('data-code', country.alpha2Code)
flagParentDiv.setAttribute('title', country.name)
flagParentDiv.setAttribute('data-code', country.alpha2Code)

flagParentDiv.addEventListener('click', () => {
const allflags = document.querySelectorAll('.selected')
console.log(allflags)
allflags.forEach(flag => {
flagParentDiv.addEventListener('click', () => {
const allflags = document.querySelectorAll('.selected')
console.log(allflags)
allflags.forEach(flag => {

flag.classList.remove('selected')
})
flagParentDiv.classList.add('selected')
flag.classList.remove('selected')
})
flagParentDiv.classList.add('selected')

getCountrydata(country.alpha2Code)
window.scrollTo(0, 0)
})
console.log(country.alpha2Code)
getCountrydata(country.alpha2Code)
window.scrollTo(0, 0)
})

imgNameSpan.innerText = country.name
flagParentDiv.appendChild(imgTag)
flagParentDiv.appendChild(imgNameSpan)
imgNameSpan.innerText = country.name
flagParentDiv.appendChild(imgTag)
flagParentDiv.appendChild(imgNameSpan)

countryEl.appendChild(flagParentDiv)
//countryEl.innerHTML += (HTML)
countryEl.appendChild(flagParentDiv)
//countryEl.innerHTML += (HTML)



})
})

}

function getCountrydata(code) {
fetch(`https://api.thevirustracker.com/free-api?countryTotal=${code}`)
.then(res => res.json())
.then(data => {
console.log(code)
console.log(data)
document.getElementById('title').innerHTML = `COVID-19 STATISTICS - ${data.countrydata[0].info.title}`
async function getCountrydata(code) {
await fetch(`https://api.thevirustracker.com/free-api?countryTotal=${code}`)
.then(res => res.json())
.then(data => {
console.log(code)
console.log(data)
document.getElementById('title').innerHTML = `COVID-19 STATISTICS - ${data.countrydata[0].info.title}`

// total infected
document.getElementById('total').innerHTML = `<div class='stats'>
// total infected
document.getElementById('total').innerHTML = `<div class='stats'>
<div class='number'>${data.countrydata[0].total_cases}</div>
<div class='factor'>Total Infected</div>
</div>`

// total recovered
document.getElementById('recover').innerHTML = `<div class="stats">
// total recovered
document.getElementById('recover').innerHTML = `<div class="stats">
<div class="number">${data.countrydata[0].total_recovered}</div>
<div class="factor">Recovered</div>
</div>`;

// total sick people
document.getElementById('sick').innerHTML = `<div class="stats">
// total sick people
document.getElementById('sick').innerHTML = `<div class="stats">
<div class="number">${data.countrydata[0].total_active_cases}</div>
<div class="factor">Sick</div>
</div>`;

// total deaths
document.getElementById('dead').innerHTML = `<div class="stats">
// total deaths
document.getElementById('dead').innerHTML = `<div class="stats">
<div class="number">${data.countrydata[0].total_deaths}</div>
<div class="factor">Deaths</div>
</div>`;

})
.catch(err => {
document.getElementById('title').innerHTML = `No data available for this country`
})
.catch(err => {
document.getElementById('title').innerHTML = `No data available for this country`

document.getElementById('total').innerHTML = `<div class="stats">
document.getElementById('total').innerHTML = `<div class="stats">
<div class="number">XX</div>
<div class="factor">Infected</div>
</div>`;

document.getElementById('recover').innerHTML = `<div class="stats">
document.getElementById('recover').innerHTML = `<div class="stats">
<div class="number">XX</div>
<div class="factor">Recovered</div>
</div>`;

document.getElementById('sick').innerHTML = `<div class="stats">
document.getElementById('sick').innerHTML = `<div class="stats">
<div class="number">XX</div>
<div class="factor">Sick</div>
</div>`;

document.getElementById('dead').innerHTML = `<div class="stats">
document.getElementById('dead').innerHTML = `<div class="stats">
<div class="number">XX</div>
<div class="factor">Deaths</div>
</div>`;
console.log('Not Infected yet');
})
console.log('Not Infected yet', err);
})

}

Expand Down

0 comments on commit e36d735

Please sign in to comment.