<style> div.pInf, div.brdCmb, h1.pTtl, .hot-items-buttons, header.header, .blogMn { display: none !important; } .ui { width: 90% !important; } </style> <div style="text-align: center;"> <br /><br /> <h1>Create your account with Storehaccounts</h1> <img src="https://mystickermania.com/cdn/stickers/games/the-battle-cats-nerd-cat-512x512.png" style="max-height: 200px;" /> <form style="margin: auto; max-width: 300px;" id="signinform" action="javascript:signup();" > <br /><br /> <p class="ui large red label">Enter your email</p> <br /> <div class="ui big inverted input focus"> <input id="email-input" type="email" placeholder="Email" required /> </div> <br /> <span id="email-status" class="ui small white label" style="cursor: pointer;" >Checking..</span > <br /> <br /> <p class="ui large red label">Create your username</p> <br /> <div class="ui big inverted input focus"> <input id="username-input" minlength="6" type="text" placeholder="Create username" required /> </div> <br /> <span id="username-status" class="ui small white label" style="cursor: pointer;" >Checking..</span > <br /> <br /> <p class="ui large red label">Create your password</p> <br /> <div class="ui big inverted input focus"> <input minlength="6" id="input-password" type="password" placeholder="Password" required /> </div> <br /> <br /> <p class="ui large red label">Retype your password</p> <br /> <div class="ui big inverted input focus"> <input minlength="6" id="verify-password" type="password" placeholder="Retype Password" required /> </div> <br /> <br /> <p class="ui large red label">Your birthday</p> <br /> <div class="ui big inverted input focus"> <input type="date" required /> </div> <br /> <br /> <p class="ui large red label">Country</p> <br /> <span id="country-status" class="ui big teal inverted label" style="cursor: pointer;" >Unknown</span > <br /><br /> <p class="ui large red label">Gender</p> <select id="gender_option" class="ui big label"> <option class="ui big white label">MALE</option> <option class="ui big white label">FEMALE</option> </select> <br /> <br /> <br/> <button id="submit" type="submit" class="ui big inverted teal button"> Create Account </button> <br/> <br/> <button type="button" onclick="window.location.href='https://storehaccountsdummy22.blogspot.com/p/create-account.html'" id="submit" type="submit" class="ui big red button" > Go back </button> <br /> </form> <br /> <br /> </div> <script type="module"> document.querySelector('.mainWrp').style.backgroundImage = "linear-gradient(to bottom, rgb(0,0,0,0.5) 10%, rgb(0,0,0,0.9) 90%), url(\"https://i.imgur.com/0zBhK8y.png\")"; document.querySelector('.mainWrp').style.backgroundRepeat = "no-repeat;" document.querySelector('.mainWrp').style.backgroundSize = "cover"; document.querySelector('.mainWrp').style.backgroundPosition = "center center"; document.querySelector('.mainWrp').style.backgroundAttachment = "fixed"; let country_code = ''; window.addEventListener('load', async () => { await initFunctions['supabase']; const { data, error } = await supabase.auth.getSession(); let isUserIn = await supabase.auth.getUser(); if (data.session && isUserIn.data.user) { window.alert("You are already logged in!"); window.location.href = 'https://storehaccounts.blogspot.com/'; return; } let username_input = document.getElementById('username-input'); let email_input = document.getElementById('email-input'); username_input.addEventListener('change', async () => { let val = username_input.value; let { data, error } = await supabase.from('users').select('username').eq('username', val); if (error) { window.alert("Error: " + JSON.stringify(error)); return; } if (data.length > 0) { document.querySelector('#username-status').innerHTML = '⚠️ Not available'; document.querySelector('#username-status').setAttribute('class', 'ui big white label'); } else { document.querySelector('#username-status').innerHTML = '✅ Available'; document.querySelector('#username-status').setAttribute('class', 'ui big white label'); } }); email_input.addEventListener('change', async () => { let val = email_input.value; let { data, error } = await supabase.from('users').select('email').eq('email', val); if (error) { window.alert("Error: " + JSON.stringify(error)); return; } if (data.length > 0) { document.querySelector('#email-status').innerHTML = '⚠️ Not available'; document.querySelector('#email-status').setAttribute('class', 'ui big white label'); } else { document.querySelector('#email-status').innerHTML = '✅ Available'; document.querySelector('#email-status').setAttribute('class', 'ui big white label'); } }); }, false); (async () => { let data = await fetch('https://api.country.is'); data = await data.json(); if (data && data.country) { document.querySelector('#country-status').innerHTML = "<img src='https://flagsapi.com/" + data.country + "/shiny/64.png'/> " + data.country; country_code = data.country; } else country_code = "Anonymous"; })(); window.signup = async () => { await initFunctions['supabase']; let inputs = document.querySelectorAll('#signinform input'); let formdata = []; inputs.forEach(items => formdata.push(items.value)); formdata.push(country_code); formdata.push(document.querySelector('#gender_option'). options[document.querySelector('#gender_option').selectedIndex] .text.substring(0, 1)); // check first if the email already existed // check also if the username has been used let check_data = await supabase .from('users') .select('email') .eq('email', formdata[0]); if (check_data.data.length > 0) { document.querySelector('#email-status').innerHTML = '⚠️ Not available'; document.querySelector('#email-status').setAttribute('class', 'ui big white label'); window.alert("Email address already used! Please try other else, or log in with that email address."); return; } else { document.querySelector('#email-status').innerHTML = '✅ Available'; document.querySelector('#email-status').setAttribute('class', 'ui big white label'); } check_data = await supabase .from('users') .select('username') .eq('username', formdata[1]); if (check_data.data.length > 0) { document.querySelector('#username-status').innerHTML = '⚠️ Not available'; document.querySelector('#username-status').setAttribute('class', 'ui big white label'); window.alert("Username already used! Please choose other else."); return; } else { document.querySelector('#username-status').innerHTML = '✅ Available'; document.querySelector('#username-status').setAttribute('class', 'ui big white label'); } if (document.querySelector('#input-password').value != document.querySelector('#verify-password').value) { window.alert("Password does not match! Please retype the password again."); return; } const { data, error } = await supabase.auth.getSession(); let isUserIn = await supabase.auth.getUser(); localStorage.setItem('signup_user_infos', JSON.stringify( { "infos": formdata }) ); if (error) { window.alert('Error detected ' + error); return; } // authenticate the user document.querySelector('#signinform').style.opacity = '0.7'; document.querySelector('#signinform').style.pointerEvents = 'none'; let signup = await supabase.auth.signUp({ email: formdata[0], password: formdata[2], options: { emailRedirectTo: 'https://storehaccounts.blogspot.com/p/finish-your-account.html', } }); if (signup.error) { document.querySelector('#signinform').style.opacity = '1'; document.querySelector('#signinform').style.pointerEvents = 'auto'; window.alert('Error has been encountered ' + signup.error); return; } if (!signup.data.user.user_metadata.email_verified) { window.alert("You have already signed up but you're account is not yet verified. Please check your email address to confirm your email with Supabase Auth. Thank you"); window.location.href = 'https://storehaccounts.blogspot.com/p/confirm-your-email.html'; } } </script>