<script>
	import { blur, fly } from 'svelte/transition';
    import { cubicOut } from 'svelte/easing';
	import { onMount } from "svelte";
    import { VerificationEmail } from '$lib/register';
    import { addingToChat } from '$lib/chat';

    let token
    let codeExist
    let code
    let verifAnswer

    onMount(async () => {
        token = localStorage.getItem('BPChat')
        codeExist = window.location.hash.startsWith('#code=')
        
        if(codeExist == true){

            code = window.location.hash.slice(6);
            if((code[code.length - 1] == "=") && (code[code.length - 2] == "=")){
                //adding chat
                let response = addingToChat(code)
                if(response == false){
                    verifAnswer = false
                }
                

            } else {
            verifAnswer = await VerificationEmail(code,token)
            }
            console.log(code)
            if(verifAnswer = false){
            }
        }

    })
</script>
<body>
    {#if codeExist == true}

        {#if verifAnswer == false}
            <img src="/image/somethingWrong.webp" alt="dsa" transition:blur={{duration:727, delay:100}}>
        {:else if verifAnswer == true}
            <h2 transition:fly={{y:1000, delay:200, duration:500, easing:cubicOut}}>Отличная работа. <br/> А ты не плохо подтверждаешь почты</h2>
        {/if}

    {:else if codeExist == false}
    <h2 class="brokeUrl">ты, помоему что то перепутал</h2>
    {/if}
</body>

<style lang="scss">

body{
    width: 100%;
    height: 100%;

    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
}
h2{
    margin-top: 5px;
    padding: 2px;
}

.brokeUrl{
    background-color: red;
    margin-bottom: auto;
    
    width: 100%;
}
img{
    width: 300px;
    height: auto;
    border-radius: 15px;
}


</style>