var b = 1
    var eap = false
    var num
    var f = 1
    var name
    var pfx = ["webkit", "moz", "ms", "o", ""];
    
    var namescreen = new Phaser.Class({
       Extends: Phaser.Scene,
        initialize: function() {
           Phaser.Scene.call(this, { "key": "namescreen" });
        },
        init: function() {},
        preload: function() {
            this.load.text('categ','category.txt')
            this.load.image("start","Strat.png")
            this.load.html("keyboard", "keyboard.html")
            this.load.image("exit","ExitBut.png")
        },
        loadAssets1: function(name) {
            ve = this.add.text(335,200,"Loading", {font: "30px Optima", fill: "#000000"})
            ve.setAlign("center")
            b++
            started = false
            this.load.once('complete', () => {
                this.scene.start("gameboard",{
                        "name": name
                    },{
                        "catArr": catArr
                })
            })
            
        },
        create: function() {
            eap = false
            ground = this.add.image(400,300,"back")
            const self = this
            let cache = self.cache.text
            let categor = cache.get('categ')
            catArr = categor.split('\r\n')
            let j = 0
            for(let i = catArr.length - 1; i > 0;i--){
                j = Math.floor(Math.random() * (i+1));

                temp = catArr[i]
                catArr[i] = catArr[j]
                catArr[j] = temp
            }
            this.full = new fullButton(this,ground.displayWidth - 34, ground.displayHeight - 587, "fulls",'game')
            this.exi = new exitButton(this,ground.displayWidth - 19, ground.displayHeight - 587,"exit")
            buton = this.add.image(400, 500, "start")
            buton.setInteractive({ useHandCursor: true })
            buton.on('pointerover', () => buton.setTint(505050) )
            buton.on('pointerout', () => buton.clearTint() )
            buton.on('pointerdown', () => buton.setTint(252525) )
            buton.on('pointerup', () => {
                buton.setTint(505050)
                
                let name = this.nameInput.getChildByName("name");
                if(name.value != "") {
                    
                    if(name.value.length > 12){
                        if(eap == false){
                            cringle = this.add.text(400,200,"A maximum of 12 characters is allowed", {font: "16px Optima"})
                            cringle.setAlign("center")
                            cringle.setPosition(295,125)
                            cringle.setColor("#F90F0F")
                            eap = true
                        }
                    }
                    else{
                        this.nameInput.disableInteractive()
                        this.nameInput.setAlpha(0)

                        buton.disableInteractive()
                        buton.setAlpha(0)

                        this.load.once('start', () => {
                            this.loadAssets1(name.value)
                        })
                        
                        this.load.start()
                        
                    }   
                }
                
            })
            
            this.add.existing(this.full)
            this.add.existing(this.exi)
            this.nameInput = this.add.dom(400, 300).createFromCache("keyboard");
            this.returnKey = this.input.keyboard.addKey(Phaser.Input.Keyboard.KeyCodes.ENTER);
            this.returnKey.on("down", event => {
                let name = this.nameInput.getChildByName("name");
                if(name.value != "") {

                    if(name.value.length > 12){
                        if(eap == false){
                            cringle = this.add.text(400,200,"A maximum of 12 characters is allowed", {font: "16px Optima"})
                            cringle.setAlign("center")
                            cringle.setPosition(400,120)
                            cringle.setColor("#000000")
                            eap = true
                        }
                    }
                    else{
                        started = false
                        this.scene.start("gameboard",{
                            "name": name.value
                        },{
                            "catArr": catArr
                        })
                    }
                }
            });

        },
        update: function() {
            var el = document.getElementById('game')
            if(f == 0){
                if(document.fullscreenElement != null){

                    f++
                }
                else if(document.webkitFullscreenElement != null){

                    f++
                }

            }
            if(f == 1){
                if(document.fullscreenElement == null){

                    f--
                }
                else if(document.webkitFullscreenElement == null){

                    f--
                }

            }
        }
    });