c'est plus propre
This commit is contained in:
thaaoblues
parent
83c8289efb
commit
4f0466f045
5 changed files with 112 additions and 128 deletions
|
|
@ -11,7 +11,6 @@
|
|||
</head>
|
||||
<body>
|
||||
<script src="./js/intro.js" defer></script>
|
||||
<script src="./js/element.js"></script>
|
||||
<script src="./js/technologie.js"></script>
|
||||
<script src="./js/main.js" defer></script>
|
||||
<script src="./js/alerte.js"></script>
|
||||
|
|
|
|||
|
|
@ -1,10 +1,51 @@
|
|||
class Collegue{
|
||||
constructor(json) {
|
||||
constructor(json,cle) {
|
||||
this.props = json
|
||||
this.nom = this.props.nom
|
||||
this.cout = this.props.cout
|
||||
this.boost = this.props.boost
|
||||
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
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
|
@ -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)
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
131
js/main.js
131
js/main.js
|
|
@ -6,7 +6,7 @@ let magasin_tech = {}
|
|||
let magasin_coll = {}
|
||||
|
||||
// stoquer les ameliorations deja achetees pour ne pas les afficher dans le magasin
|
||||
let sacado = {}
|
||||
let sacado = {}
|
||||
|
||||
// premet de ne pas laisser le joueur acheter html 5 si il n'a pas débloqué html 1.0 etc..
|
||||
let evolution_tech = 0
|
||||
|
|
@ -31,28 +31,20 @@ async function remplirMagasinTechnologies(){
|
|||
let tech = data["technologies"]
|
||||
|
||||
for(const key in tech){
|
||||
// ne va pas s'embeter à proecess si on a deja acheté l'amelioration
|
||||
if(!sacado[key] && !magasin_tech[key]){
|
||||
el = tech[key]
|
||||
|
||||
// ne va pas s'embeter à process si on a deja acheté l'amelioration
|
||||
// n'afficher l'amélioration que si le score est assez élevé
|
||||
const t = new Technologie(tech[key])
|
||||
|
||||
|
||||
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")
|
||||
|
||||
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
|
||||
|
||||
let t = new Technologie(el)
|
||||
|
||||
/* 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
|
||||
|
|
@ -84,7 +76,7 @@ async function remplirMagasinTechnologies(){
|
|||
// augmentation du boost d'incrément
|
||||
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 :)
|
||||
|
||||
}else{
|
||||
|
|
@ -95,32 +87,12 @@ async function remplirMagasinTechnologies(){
|
|||
// 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"]
|
||||
|
||||
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
|
||||
// ou si le score d'évolution n'est pas assez élevé
|
||||
const el = collegues[key]
|
||||
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)
|
||||
if(!magasin_coll[key] && evolution_coll === parseInt(collegue.evolution)){
|
||||
|
||||
|
||||
/* 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é
|
||||
let exp = 0
|
||||
if(key in sacado){
|
||||
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
|
||||
if(score >= cout_reel){
|
||||
|
|
@ -187,7 +135,7 @@ async function remplirMagasinCollegues(){
|
|||
|
||||
//lancer l'animation d'achat avec l'image correspondante
|
||||
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
|
||||
image.removeAttribute("hidden")
|
||||
|
||||
|
|
@ -201,8 +149,8 @@ async function remplirMagasinCollegues(){
|
|||
|
||||
// narration comme c'est la première fois qu'on achète
|
||||
|
||||
ouvrirAlerte("Vous avez débloqué "+ c.nom+" !!"+collegues[key]["narration"])
|
||||
ouvrirAlerte("Incrémentation de la rentabilité passive de "+c.revenu_passif+" points !!")
|
||||
ouvrirAlerte("Vous avez débloqué "+ collegue.nom+" !!"+collegues[key]["narration"])
|
||||
ouvrirAlerte("Incrémentation de la rentabilité passive de "+collegue.revenu_passif+" points !!")
|
||||
|
||||
}, (4000));
|
||||
|
||||
|
|
@ -218,17 +166,19 @@ async function remplirMagasinCollegues(){
|
|||
}
|
||||
|
||||
// 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
|
||||
console.log(cout_reel)
|
||||
console.log(score)
|
||||
console.log(score-cout_reel)
|
||||
// finalement, on lui débite son compte de points tel un vendeur de voitures
|
||||
score = score - cout_reel
|
||||
majAffichageScore()
|
||||
|
||||
let exp = 0
|
||||
if(key in sacado){
|
||||
exp = sacado[key]
|
||||
}
|
||||
|
||||
// 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{
|
||||
|
|
@ -237,23 +187,16 @@ async function remplirMagasinCollegues(){
|
|||
}
|
||||
|
||||
|
||||
})
|
||||
}
|
||||
|
||||
btn_acheter.innerText = "Acheter"
|
||||
|
||||
// met à jour le contenu du magasin
|
||||
// pour ne pas re-afficher cette ligne et éviter un clignotement
|
||||
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)
|
||||
|
||||
}
|
||||
|
|
@ -301,9 +244,11 @@ function leBoostDuProf(){
|
|||
}
|
||||
|
||||
|
||||
let rickroll = document.getElementById("never")
|
||||
let close_roll = document.getElementById("close_rick")
|
||||
|
||||
function rickRoll(){
|
||||
const rickroll = document.getElementById("never")
|
||||
const close_roll = document.getElementById("close_rick")
|
||||
|
||||
// affichage de la video
|
||||
rickroll.setAttribute("src","./img/never_gonna_give_you_up.mp4")
|
||||
rickroll.setAttribute("type","video/mp4")
|
||||
|
|
|
|||
|
|
@ -4,11 +4,42 @@ class Technologie{
|
|||
this.cout = this.props.cout
|
||||
this.boost = this.props.boost
|
||||
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(){
|
||||
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
|
||||
}
|
||||
|
||||
|
||||
|
|
|
|||
Loading…
Reference in a new issue