beau/projet-clicodrome2.0
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

c'est plus propre

Browse source
This commit is contained in:
thaaoblues 2024-12-31 15:44:09 +01:00
parent 83c8289efb
commit 4f0466f045
5 changed files with 112 additions and 128 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
index.html
View file

@ -11,7 +11,6 @@
</head> </head>
<body> <body>
<script src="./js/intro.js" defer></script> <script src="./js/intro.js" defer></script>
<script src="./js/element.js"></script>
<script src="./js/technologie.js"></script> <script src="./js/technologie.js"></script>
<script src="./js/main.js" defer></script> <script src="./js/main.js" defer></script>
<script src="./js/alerte.js"></script> <script src="./js/alerte.js"></script>

43
js/collegue.js
View file

@ -1,10 +1,51 @@
class Collegue{ class Collegue{
constructor(json) { constructor(json,cle) {
this.props = json this.props = json
this.nom = this.props.nom this.nom = this.props.nom
this.cout = this.props.cout this.cout = this.props.cout
this.boost = this.props.boost this.boost = this.props.boost
this.revenu_passif = this.props.revenu_passif this.revenu_passif = this.props.revenu_passif
this.url_wikipedia = this.props.wikipedia
this.nom_fichier_image = this.props.nom_fichier_image
this.cle = cle
this.callbackAchat = {}
this.evolution = this.props.evolution
}
/* va générer la ligne du tableau correspondant à ce collegue,
utile pour remplir le magasin de collegues */
genererLigneTableau() {
const tr = document.createElement("tr")
const case_nom = document.createElement("td")
case_nom.textContent = this.nom
const case_boost = document.createElement("td")
case_boost.textContent = this.revenu_passif
const case_cout = document.createElement("td")
case_cout.textContent = rendreNombreLisible(this.cout)
case_cout.id = "case_cout_"+this.cle
// case contenant un lien vers la page wikipédia du personnage
const case_wiki = document.createElement("td")
const a = document.createElement("a")
a.href = this.url_wikipedia
a.textContent = this.nom
case_wiki.appendChild(a)
const action = document.createElement("td")
const btn_acheter = document.createElement("button")
btn_acheter.textContent = "Acheter"
btn_acheter.addEventListener("click",this.callbackAchat)
action.appendChild(btn_acheter)
tr.appendChild(case_nom)
tr.appendChild(case_boost)
tr.appendChild(case_cout)
tr.appendChild(case_wiki)
tr.appendChild(action)
return tr
} }
} }

32
js/element.js
View file

@ -1,32 +0,0 @@
class Element{
constructor(techno,tag) {
this.tag = tag
this.techno = techno
}
async chargerDepuisBdd(){
let data = await fetch("../bdd/arbre.json")
data = await data.json()
this.props = data["technologies"][this.techno]["elements"][this.tag]
this.cout = this.props.cout
this.nom = this.props.nom
this.boost = this.props.boost
}
afficherDropsDansHtml(){
const table= document.getElementById("table_technologies_body")
const tr = document.createElement("tr")
const nom = document.createElement("td")
nom.innerText = this.nom
const boost = document.createElement("td")
boost.innerText = this.boost
tr.appendChild(nom)
tr.appendChild(boost)
table.appendChild(tr)
}
}

127
js/main.js
View file

@ -31,28 +31,20 @@ async function remplirMagasinTechnologies(){
let tech = data["technologies"] let tech = data["technologies"]
for(const key in tech){ for(const key in tech){
// ne va pas s'embeter à proecess si on a deja acheté l'amelioration // ne va pas s'embeter à process si on a deja acheté l'amelioration
if(!sacado[key] && !magasin_tech[key]){ // n'afficher l'amélioration que si le score est assez élevé
el = tech[key] const t = new Technologie(tech[key])
if( !sacado[key] && !magasin_tech[key] && (t.borne <= score) && (evolution_tech === parseInt(t.evolution))){
ouvrirAlerte(tech[key]["narration"])
// met à jour le contenu du magasin
// pour ne pas re-afficher cette ligne et éviter un clignotement
magasin_tech[key] = true
const tr = document.createElement("tr")
const case_nom = document.createElement("td")
case_nom.innerText = el.nom
const case_boost = document.createElement("td")
case_boost.innerText = el.boost
const case_cout = document.createElement("td")
case_cout.innerText = rendreNombreLisible(el.cout)
const test = document.createElement("td")
const btn_acheter = document.createElement("button")
let t = new Technologie(el)
/* fonction qui va s'activer lorsqu'on achète l'objet*/ /* fonction qui va s'activer lorsqu'on achète l'objet*/
btn_acheter.addEventListener("click", (event) =>{ t.callbackAchat = (event) =>{
// ne laisse acheter que si on a l'argent // ne laisse acheter que si on a l'argent
@ -84,7 +76,7 @@ async function remplirMagasinTechnologies(){
// augmentation du boost d'incrément // augmentation du boost d'incrément
ouvrirAlerte("Incrémentation de la rentabilité de tes clicks de "+t.boost+" points !!") ouvrirAlerte("Incrémentation de la rentabilité de tes clicks de "+t.boost+" points !!")
if(t.props.evolution == 0){ if(t.evolution == 0){
boost += t.boost -1 // car sinon, le premier boost ne va pas entrainer un nombre rond de points par click :) boost += t.boost -1 // car sinon, le premier boost ne va pas entrainer un nombre rond de points par click :)
}else{ }else{
@ -95,32 +87,12 @@ async function remplirMagasinTechnologies(){
// PAS ASSEZ RICHE !!!!! // PAS ASSEZ RICHE !!!!!
ouvrirAlerte("PAS ASSEZ RICHE !!!!!!!!!!!!") ouvrirAlerte("PAS ASSEZ RICHE !!!!!!!!!!!!")
} }
})
btn_acheter.innerText = "Acheter"
// n'afficher l'amélioration que si le score est assez élevé
if((t.props.borne <= score) && (evolution_tech === parseInt(t.props.evolution))){
ouvrirAlerte(tech[key]["narration"])
// met à jour le contenu du magasin
// pour ne pas re-afficher cette ligne et éviter un clignotement
magasin_tech[key] = true
test.appendChild(btn_acheter)
tr.appendChild(case_nom)
tr.appendChild(case_boost)
tr.appendChild(case_cout)
tr.appendChild(test)
table.appendChild(tr)
} }
// affiche dans le tableau la ligne générée, prend en compte le callback d'achat
const tr = t.genererLigneTableau()
table.appendChild(tr)
} }
} }
} }
@ -138,46 +110,22 @@ async function remplirMagasinCollegues(){
let collegues = data["collegues"] let collegues = data["collegues"]
for(const key in collegues){ for(const key in collegues){
const collegue = new Collegue(collegues[key],key)
// ne va pas s'embeter à process si déjà présent dans le magasin // ne va pas s'embeter à process si déjà présent dans le magasin
// ou si le score d'évolution n'est pas assez élevé // ou si le score d'évolution n'est pas assez élevé
const el = collegues[key] if(!magasin_coll[key] && evolution_coll === parseInt(collegue.evolution)){
if(!magasin_coll[key] && evolution_coll === parseInt(el.evolution)){
const tr = document.createElement("tr")
const case_nom = document.createElement("td")
case_nom.innerText = el.nom
const case_boost = document.createElement("td")
case_boost.innerText = el.revenu_passif
const case_cout = document.createElement("td")
case_cout.innerText = rendreNombreLisible(el.cout)
case_cout.id = "case_cout_"+key
// case contenant un lien vers la page wikipédia du personnage
const case_wiki = document.createElement("td")
let a = document.createElement("a")
a.href = el.wikipedia
a.innerText = el.nom
case_wiki.appendChild(a)
const action = document.createElement("td")
const btn_acheter = document.createElement("button")
let c = new Collegue(el)
/* fonction qui va s'activer lorsqu'on achète l'objet*/ /* fonction qui va s'activer lorsqu'on achète l'objet*/
btn_acheter.addEventListener("click", (event) =>{ collegue.callbackAchat = (event) => {
// calcul du cout en fonction du nombre de collegue de ce type déjà acheté // calcul du cout en fonction du nombre de collegue de ce type déjà acheté
let exp = 0 let exp = 0
if(key in sacado){ if(key in sacado){
exp = sacado[key] exp = sacado[key]
} }
const cout_reel = Number(el.cout * (1.1)**exp).toFixed(1) const cout_reel = Number(collegue.cout * (1.1)**exp).toFixed(1)
// ne laisse acheter que si on a l'argent // ne laisse acheter que si on a l'argent
if(score >= cout_reel){ if(score >= cout_reel){
@ -187,7 +135,7 @@ async function remplirMagasinCollegues(){
//lancer l'animation d'achat avec l'image correspondante //lancer l'animation d'achat avec l'image correspondante
let image = document.getElementById("image_collegue_animee") let image = document.getElementById("image_collegue_animee")
image.setAttribute("src",c.props.nom_fichier_image) image.setAttribute("src",collegue.nom_fichier_image)
// affiche l'image // affiche l'image
image.removeAttribute("hidden") image.removeAttribute("hidden")
@ -201,8 +149,8 @@ async function remplirMagasinCollegues(){
// narration comme c'est la première fois qu'on achète // narration comme c'est la première fois qu'on achète
ouvrirAlerte("Vous avez débloqué "+ c.nom+" !!"+collegues[key]["narration"]) ouvrirAlerte("Vous avez débloqué "+ collegue.nom+" !!"+collegues[key]["narration"])
ouvrirAlerte("Incrémentation de la rentabilité passive de "+c.revenu_passif+" points !!") ouvrirAlerte("Incrémentation de la rentabilité passive de "+collegue.revenu_passif+" points !!")
}, (4000)); }, (4000));
@ -218,17 +166,19 @@ async function remplirMagasinCollegues(){
} }
// augmentation du boost d'incrément // augmentation du boost d'incrément
revenu_passif += c.revenu_passif revenu_passif += collegue.revenu_passif
// finalement, on lui débit son compte de points tel un vendeur de voitures // finalement, on lui débite son compte de points tel un vendeur de voitures
console.log(cout_reel)
console.log(score)
console.log(score-cout_reel)
score = score - cout_reel score = score - cout_reel
majAffichageScore() majAffichageScore()
let exp = 0
if(key in sacado){
exp = sacado[key]
}
// on change le futur cout dans le tableau // on change le futur cout dans le tableau
document.getElementById("case_cout_"+key).innerText = rendreNombreLisible(Number(c.cout * (1.1)**sacado[key]).toFixed(1)) document.getElementById("case_cout_"+key).textContent = rendreNombreLisible(Number(collegue.cout * (1.1)**exp).toFixed(1))
}else{ }else{
@ -237,23 +187,16 @@ async function remplirMagasinCollegues(){
} }
}) }
btn_acheter.innerText = "Acheter"
// met à jour le contenu du magasin // met à jour le contenu du magasin
// pour ne pas re-afficher cette ligne et éviter un clignotement // pour ne pas re-afficher cette ligne et éviter un clignotement
magasin_coll[key] = true magasin_coll[key] = true
action.appendChild(btn_acheter)
tr.appendChild(case_nom)
tr.appendChild(case_boost)
tr.appendChild(case_cout)
tr.appendChild(case_wiki)
tr.appendChild(action)
// affiche dans le tableau la ligne générée, prend en compte le callback d'achat
const tr = collegue.genererLigneTableau()
table.appendChild(tr) table.appendChild(tr)
} }
@ -301,9 +244,11 @@ function leBoostDuProf(){
} }
let rickroll = document.getElementById("never")
let close_roll = document.getElementById("close_rick")
function rickRoll(){ function rickRoll(){
const rickroll = document.getElementById("never")
const close_roll = document.getElementById("close_rick")
// affichage de la video // affichage de la video
rickroll.setAttribute("src","./img/never_gonna_give_you_up.mp4") rickroll.setAttribute("src","./img/never_gonna_give_you_up.mp4")
rickroll.setAttribute("type","video/mp4") rickroll.setAttribute("type","video/mp4")

33
js/technologie.js
View file

@ -4,11 +4,42 @@ class Technologie{
this.cout = this.props.cout this.cout = this.props.cout
this.boost = this.props.boost this.boost = this.props.boost
this.nom = this.props.nom this.nom = this.props.nom
this.css_id = this.props.css_id
this.evolution = this.props.evolution
this.borne = this.props.borne
this.callbackAchat = {}
} }
appliquerAmeliorationStyle(){ appliquerAmeliorationStyle(){
document.getElementById("alerte-css").setAttribute("href","css/alerte/a"+evolution_tech+".css") document.getElementById("alerte-css").setAttribute("href","css/alerte/a"+evolution_tech+".css")
document.getElementById("link-css").setAttribute("href","css/"+this.props.css_id) document.getElementById("link-css").setAttribute("href","css/"+this.css_id)
}
genererLigneTableau(){
const tr = document.createElement("tr")
const case_nom = document.createElement("td")
case_nom.textContent = this.nom
const case_boost = document.createElement("td")
case_boost.textContent = this.boost
const case_cout = document.createElement("td")
case_cout.textContent = rendreNombreLisible(this.cout)
const case_action = document.createElement("td")
const btn_acheter = document.createElement("button")
btn_acheter.textContent = "Acheter"
btn_acheter.addEventListener("click",this.callbackAchat)
case_action.appendChild(btn_acheter)
tr.appendChild(case_nom)
tr.appendChild(case_boost)
tr.appendChild(case_cout)
tr.appendChild(case_action)
return tr
} }