var leader = new Phaser.Class({
       Extends: Phaser.Scene,
        initialize: function() {
           Phaser.Scene.call(this, { "key": "leader" });
        },
        init: function() {
   
        },
        preload: function() {   
         
        },
        create: function() {
            const self = this
            gr = this.add.image(400,300,"back")

            log = this.add.image(400,300,"logo")
            log.setAlpha(0.5)

            this.full = new fullButton(this,gr.displayWidth - 34, gr.displayHeight - 587, "fulls",'game')
            this.add.existing(this.full)

            this.exi = new exitButton(this,ground.displayWidth - 19, ground.displayHeight - 587,"exit")
            this.add.existing(this.exi)

            this.getLeaders()
            reBut = new returnButton(self,400,500,'rest',2,1)
            this.add.existing(reBut)
            teg = this.add.text(1,1,"Title")
            teg.setStyle({
               color:"#000000",
               fontSize: "25px",
               fontWeight: 'bold'
            })
            Phaser.Display.Align.In.Center(teg,reBut)
        },
        update: function() {
         
        },
        async getLeaders() {
            try{
               // Call the `/~/Space_Race/open/leaders?all=true` to get all the leaders from the database
               const path = '/~/Jeopardy/open/leaders?all=true';
               const method = 'GET'
               const resp = await fetch(path, { method });
               const leaders = await resp.json();
 
               // Show `No Leaders` if there are not any yet
               const $leaders = document.getElementById('leaders');
               if(!leaders.length) {
                  $leaders.innerHTML = 'No Leaders';
                  return;
               }

               // Otherwise show the top ten leaders with valid scores, sorted with the highest on top
               $leaders.innerHTML = leaders
               .filter(leader => parseInt(leader.data.score) >= 0) 
               .sort((a, b) => parseInt(b.data.score) > parseInt(a.data.score) ? 1 : -1)
               .filter((leader, i) => i < 10)
               .map((leader, i) => `
               <div>${i + 1}. ${leader.data.name} ${leader.data.score}</div>
               `)
               .join('\n')
            }
            catch{
               v = this.add.text(350,100,"no leaders")
               v.setColor("#000000")
            }

         }
        
});