86 lines
1.9 KiB
JavaScript
86 lines
1.9 KiB
JavaScript
|
import debounce from './helpers'
|
||
|
|
|
||
|
|
|
||
|
|
class tableManager {
|
||
|
|
tbody = null
|
||
|
|
props = ["intRank","strTeamBadge","strTeam","intPlayed","intWin","intDraw",
|
||
|
|
"intLoss","intGoalsFor","intGoalsAgainst","intGoalDifference","intPoints"]
|
||
|
|
sort = -1 // -1 ou 1
|
||
|
|
teamSearch = ''
|
||
|
|
data = [] // données à afficher
|
||
|
|
//
|
||
|
|
constructor(tbodyNode){
|
||
|
|
this.tbody = tbodyNode
|
||
|
|
|
||
|
|
|
||
|
|
document
|
||
|
|
.getElementById("myInput")
|
||
|
|
.addEventListener("input",debounce(e=>{
|
||
|
|
this.teamSearch = e.target.value.toUpperCase()
|
||
|
|
this.tableRender()
|
||
|
|
},500))
|
||
|
|
|
||
|
|
document
|
||
|
|
.getElementById("sort")
|
||
|
|
.addEventListener("click",((e) => {
|
||
|
|
this.sort *= -1
|
||
|
|
e.preventDefault()
|
||
|
|
this.tableRender()
|
||
|
|
|
||
|
|
}))
|
||
|
|
|
||
|
|
}
|
||
|
|
setData(data){
|
||
|
|
this.data = data
|
||
|
|
}
|
||
|
|
_setDate = (()=>{
|
||
|
|
if (this.data.length == 0 ) return
|
||
|
|
let date=new Date(this.data[0].dateUpdated)
|
||
|
|
document.getElementById("date").textContent = date.toLocaleDateString("fr")
|
||
|
|
})
|
||
|
|
|
||
|
|
setNom(nom){
|
||
|
|
document.getElementById("nom").textContent = nom
|
||
|
|
}
|
||
|
|
_getRow = (v => {
|
||
|
|
let tr = document.createElement("tr")
|
||
|
|
for (let p of this.props){
|
||
|
|
let td = document.createElement("td")
|
||
|
|
if (p !== "strTeamBadge"){
|
||
|
|
td.textContent = v[p]
|
||
|
|
} else {
|
||
|
|
let figure = document.createElement("figure")
|
||
|
|
let img = document.createElement("img")
|
||
|
|
figure.classList.add("image","is-32x32")
|
||
|
|
img.src = v[p]
|
||
|
|
figure.appendChild(img)
|
||
|
|
td.appendChild(figure)
|
||
|
|
}
|
||
|
|
tr.appendChild(td)
|
||
|
|
}
|
||
|
|
return tr
|
||
|
|
})
|
||
|
|
|
||
|
|
tableRender(){
|
||
|
|
let dataFilter
|
||
|
|
if (this.teamSearch)
|
||
|
|
dataFilter = this.data.filter( item => item.strTeam.toUpperCase().includes(this.teamSearch))
|
||
|
|
else
|
||
|
|
dataFilter = [...this.data]
|
||
|
|
|
||
|
|
dataFilter.sort((eq1,eq2)=>this.sort*(eq2.intRank - eq1.intRank))
|
||
|
|
this._setDate()
|
||
|
|
|
||
|
|
let content = document.createDocumentFragment()
|
||
|
|
dataFilter.forEach(v =>{
|
||
|
|
content.appendChild(this._getRow(v))
|
||
|
|
})
|
||
|
|
|
||
|
|
this.tbody.replaceChildren(content)
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
export { tableManager }
|
||
|
|
|
||
|
|
|