export class  loadForm  {
        private readonly REGISTRATION:string ='registration';
        private readonly REGIBUTTON:string ='reg-button';
        private readonly EMAILREGEXP:any = /^[\w\.\d-_]+@[\w\.\d-_]+\.\w{2,4}$/i;
        private  inputArray;
        private  ReigsterFormCollections;
        private  deathStar;
        private  deathOnAudio;
        private  topList;
        private  ModalsWindow;

    constructor() {
            this.findWitchClicked();
        }
        addMusic(url:string):void {
            this.deathOnAudio = new Audio();
            this.deathOnAudio.src = url;
            this.deathOnAudio.play();
        };
         setUser(UserData):void {
            this.topList = JSON.parse(localStorage.getItem('topList')||'[]');
            let currentUser = {
                firstName:UserData[0],
                secondName:UserData[1],
                email:UserData[2]
            };
            this.topList.push(currentUser);
            localStorage.setItem('topList',JSON.stringify(this.topList));
        }
         CreateAjaxRequest(UrlName,background){
            $(document).ready(function () {
                $.ajax({
                    url: UrlName,
                    type:'GET',
                    dataType:'text',
                    async: false,
                    success:function (response) {
                        $('body').html(response);
                        $('body').css('background-image', 'url('+'"'+ background + '"' +')');
                    }
                })
            });
        }
    ShowModal(ErrorFlag):void {
        if (ErrorFlag === 0) {
            this.ModalsWindow = document.querySelector('.modal-window');
            this.ModalsWindow.style.display = 'block';
        }
    }
        CreateMyRequered():boolean{//Has Error with red boarder
            this.ReigsterFormCollections = document.querySelectorAll('.register');
            for(let i=0;i<this.ReigsterFormCollections.length;i++){
                if(this.ReigsterFormCollections[i].value ==='' || (!this.EMAILREGEXP.test(this.ReigsterFormCollections[2].value)))
                {
                    if(this.ReigsterFormCollections.type='email' && (!this.EMAILREGEXP.test(this.ReigsterFormCollections[2].value)))
                        this.ReigsterFormCollections[2].style.borderColor='red';
                    this.ReigsterFormCollections[i].style.borderColor='red';
                    return false;
                }
            }
            return true;
        }
          findWitchClicked():void {
           this.inputArray = document.querySelectorAll('.register');
            this.deathStar = document.querySelector('.death-star-button');
            document.querySelector('.login-form').addEventListener('click', (event)=> {
                switch (event.target.id) {
                    case this.REGISTRATION: {
                        for (let i = 0; i <  this.inputArray.length; i++) {this.inputArray[i].style.display = 'block'}
                        this.deathStar.style.display = 'block';
                        this.addMusic('starwars-help/stick-on.mp3');
                        break;
                    }
                    case this.REGIBUTTON:{
                        if(this.CreateMyRequered() === true){
                           // history.pushState('game','Game','http://localhost:63342/FinalGame/game.html'); //роутинг
                            this.setUser(this.inputArray);
                            this.ShowModal(0);
                            this.addMusic('sounds/R2D2.mp3');
                            setTimeout(this.CreateAjaxRequest.bind(null,'game.html','images/registration/backround.jpg'),100); //таймаут
                            break;
                        }
                        else
                            this.addMusic('sounds/R2D2-Error.mp3');
                    }
                }
            });
    }}
let loader = new loadForm();