fixed captcha more and better errors
This commit is contained in:
MathMan05
parent
3621f1b09b
commit
f10ea4ac2a
7 changed files with 197 additions and 52 deletions
|
|
@ -175,13 +175,19 @@ async function login(username, password, captcha) {
|
|||
console.log(response);
|
||||
if (response.captcha_sitekey) {
|
||||
const capt = document.getElementById("h-captcha");
|
||||
const capty = document.createElement("div");
|
||||
capty.classList.add("h-captcha");
|
||||
capty.setAttribute("data-sitekey", response.captcha_sitekey);
|
||||
const script = document.createElement("script");
|
||||
script.src = "https://js.hcaptcha.com/1/api.js";
|
||||
capt.append(script);
|
||||
capt.append(capty);
|
||||
if (!capt.children.length) {
|
||||
const capty = document.createElement("div");
|
||||
capty.classList.add("h-captcha");
|
||||
capty.setAttribute("data-sitekey", response.captcha_sitekey);
|
||||
const script = document.createElement("script");
|
||||
script.src = "https://js.hcaptcha.com/1/api.js";
|
||||
capt.append(script);
|
||||
capt.append(capty);
|
||||
}
|
||||
else {
|
||||
eval("hcaptcha.reset()");
|
||||
}
|
||||
return;
|
||||
}
|
||||
else {
|
||||
adduser({ serverurls: JSON.parse(localStorage.getItem("instanceinfo")), email: username, token: response.token });
|
||||
|
|
|
|||
|
|
@ -14,7 +14,7 @@ async function registertry(e) {
|
|||
const password = elements[3].value;
|
||||
const dateofbirth = elements[5].value;
|
||||
const apiurl = new URL(JSON.parse(localStorage.getItem("instanceinfo")).api);
|
||||
fetch(apiurl + "/auth/register", {
|
||||
await fetch(apiurl + "/auth/register", {
|
||||
body: JSON.stringify({
|
||||
date_of_birth: dateofbirth,
|
||||
email: email,
|
||||
|
|
@ -31,18 +31,40 @@ async function registertry(e) {
|
|||
e.json().then(e => {
|
||||
if (e.captcha_sitekey) {
|
||||
const capt = document.getElementById("h-captcha");
|
||||
const capty = document.createElement("div");
|
||||
capty.classList.add("h-captcha");
|
||||
capty.setAttribute("data-sitekey", e.captcha_sitekey);
|
||||
const script = document.createElement("script");
|
||||
script.src = "https://js.hcaptcha.com/1/api.js";
|
||||
capt.append(script);
|
||||
capt.append(capty);
|
||||
if (!capt.children.length) {
|
||||
const capty = document.createElement("div");
|
||||
capty.classList.add("h-captcha");
|
||||
capty.setAttribute("data-sitekey", e.captcha_sitekey);
|
||||
const script = document.createElement("script");
|
||||
script.src = "https://js.hcaptcha.com/1/api.js";
|
||||
capt.append(script);
|
||||
capt.append(capty);
|
||||
}
|
||||
else {
|
||||
eval("hcaptcha.reset()");
|
||||
}
|
||||
return;
|
||||
}
|
||||
if (!e.token) {
|
||||
console.log(e);
|
||||
document.getElementById("wrong").textContent = e.errors[Object.keys(e.errors)[0]]._errors[0].message;
|
||||
if (e.errors.consent) {
|
||||
error(elements[6], e.errors.consent._errors[0].message);
|
||||
}
|
||||
else if (e.errors.password) {
|
||||
error(elements[3], e.errors.password._errors[0].message);
|
||||
}
|
||||
else if (e.errors.username) {
|
||||
error(elements[2], e.errors.username._errors[0].message);
|
||||
}
|
||||
else if (e.errors.email) {
|
||||
error(elements[1], e.errors.email._errors[0].message);
|
||||
}
|
||||
else if (e.errors.date_of_birth) {
|
||||
error(elements[5], e.errors.date_of_birth._errors[0].message);
|
||||
}
|
||||
else {
|
||||
document.getElementById("wrong").textContent = e.errors[Object.keys(e.errors)[0]]._errors[0].message;
|
||||
}
|
||||
}
|
||||
else {
|
||||
localStorage.setItem("token", e.token);
|
||||
|
|
@ -53,6 +75,21 @@ async function registertry(e) {
|
|||
//document.getElementById("wrong").textContent=h;
|
||||
// console.log(h);
|
||||
}
|
||||
function error(e, message) {
|
||||
const p = e.parentElement;
|
||||
let element = p.getElementsByClassName("suberror")[0];
|
||||
if (!element) {
|
||||
const div = document.createElement("div");
|
||||
div.classList.add("suberror", "suberrora");
|
||||
p.append(div);
|
||||
element = div;
|
||||
}
|
||||
else {
|
||||
element.classList.remove("suberror");
|
||||
setTimeout(_ => { element.classList.add("suberror"); }, 100);
|
||||
}
|
||||
element.textContent = message;
|
||||
}
|
||||
let TOSa = document.getElementById("TOSa");
|
||||
async function tosLogic() {
|
||||
const apiurl = new URL(JSON.parse(localStorage.getItem("instanceinfo")).api);
|
||||
|
|
|
|||
|
|
@ -173,15 +173,21 @@ async function login(username:string, password:string, captcha:string){
|
|||
console.log(response);
|
||||
|
||||
if(response.captcha_sitekey){
|
||||
const capt=document.getElementById("h-captcha");
|
||||
const capty=document.createElement("div");
|
||||
capty.classList.add("h-captcha");
|
||||
|
||||
capty.setAttribute("data-sitekey", response.captcha_sitekey);
|
||||
const script=document.createElement("script");
|
||||
script.src="https://js.hcaptcha.com/1/api.js";
|
||||
capt.append(script);
|
||||
capt.append(capty);
|
||||
const capt=document.getElementById("h-captcha");
|
||||
if(!capt.children.length){
|
||||
const capty=document.createElement("div");
|
||||
capty.classList.add("h-captcha");
|
||||
|
||||
capty.setAttribute("data-sitekey", response.captcha_sitekey);
|
||||
const script=document.createElement("script");
|
||||
script.src="https://js.hcaptcha.com/1/api.js";
|
||||
capt.append(script);
|
||||
capt.append(capty);
|
||||
}else{
|
||||
eval("hcaptcha.reset()");
|
||||
}
|
||||
return;
|
||||
}else{
|
||||
adduser({serverurls:JSON.parse(localStorage.getItem("instanceinfo")),email:username,token:response.token});
|
||||
window.location.href = '/channels/@me';
|
||||
|
|
|
|||
|
|
@ -8,33 +8,45 @@
|
|||
<div id="logindiv">
|
||||
<h1>Create an account</h1><br>
|
||||
<form id="register" submit="registertry(e)">
|
||||
<label for="instance"><b>Instance:</b></label><br>
|
||||
<p id="verify"></p>
|
||||
<input type="text" placeholder="Instance URL" name="instance" value="https://spacebar.chat/" id="instancein" required><br><br>
|
||||
<div>
|
||||
<label for="instance"><b>Instance:</b></label><br>
|
||||
<p id="verify"></p>
|
||||
<input type="text" placeholder="Instance URL" name="instance" value="https://spacebar.chat/" id="instancein" required>
|
||||
</div>
|
||||
<div>
|
||||
<label for="uname"><b>Email:</b></label><br>
|
||||
<input type="text" placeholder="Enter Email" name="email" required>
|
||||
</div>
|
||||
|
||||
<label for="uname"><b>Email:</b></label><br>
|
||||
<input type="text" placeholder="Enter Email" name="email" required><br><br>
|
||||
<div>
|
||||
<label for="uname"><b>Username:</b></label><br>
|
||||
<input type="text" placeholder="Enter Username" name="uname" required>
|
||||
</div>
|
||||
<div>
|
||||
<label for="psw"><b>Password:</b></label><br>
|
||||
<input type="password" placeholder="Enter Password" name="psw" required>
|
||||
</div>
|
||||
|
||||
<label for="uname"><b>Username:</b></label><br>
|
||||
<input type="text" placeholder="Enter Username" name="uname" required><br><br>
|
||||
<div>
|
||||
<label for="psw2"><b>Enter password again:</b></label><br>
|
||||
<input type="password" placeholder="Enter Password Again" name="psw2" required>
|
||||
</div>
|
||||
|
||||
<label for="psw"><b>Password:</b></label><br>
|
||||
<input type="password" placeholder="Enter Password" name="psw" required><br><br>
|
||||
<div>
|
||||
<label for="date"><b>Date of birth:</b></label><br>
|
||||
<input type="date" id="start" name="date"/>
|
||||
</div>
|
||||
|
||||
<label for="psw2"><b>Enter password again:</b></label><br>
|
||||
<input type="password" placeholder="Enter Password Again" name="psw2" required><br><br>
|
||||
<div>
|
||||
<b id="TOSbox">I agree to the <a href="" id="TOSa">Terms of Service</a>:</b>
|
||||
<input type="checkbox" id="TOS" name="TOS"/>
|
||||
</div>
|
||||
|
||||
<label for="date"><b>Date of birth:</b></label><br>
|
||||
<input type="date" id="start" name="date"/><br><br>
|
||||
|
||||
|
||||
<b id="TOSbox">I agree to the <a href="" id="TOSa">Terms of Service</a>:</b>
|
||||
<input type="checkbox" id="TOS" name="TOS"/><br>
|
||||
<p class="wrongred" id="wrong"></p><br>
|
||||
<p class="wrongred" id="wrong"></p>
|
||||
<div id="h-captcha">
|
||||
|
||||
</div>
|
||||
<button type="submit">Create account</button>
|
||||
<button type="submit" class="dontgrow">Create account</button>
|
||||
</form>
|
||||
<a href="/login.html">Already have an account?</a>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -16,7 +16,7 @@ async function registertry(e){
|
|||
const dateofbirth=elements[5].value;
|
||||
const apiurl=new URL(JSON.parse(localStorage.getItem("instanceinfo")).api)
|
||||
|
||||
fetch(apiurl+"/auth/register",{
|
||||
await fetch(apiurl+"/auth/register",{
|
||||
body:JSON.stringify({
|
||||
date_of_birth:dateofbirth,
|
||||
email:email,
|
||||
|
|
@ -33,19 +33,35 @@ async function registertry(e){
|
|||
e.json().then(e=>{
|
||||
if(e.captcha_sitekey){
|
||||
const capt=document.getElementById("h-captcha");
|
||||
const capty=document.createElement("div");
|
||||
capty.classList.add("h-captcha");
|
||||
if(!capt.children.length){
|
||||
const capty=document.createElement("div");
|
||||
capty.classList.add("h-captcha");
|
||||
|
||||
capty.setAttribute("data-sitekey", e.captcha_sitekey);
|
||||
const script=document.createElement("script");
|
||||
script.src="https://js.hcaptcha.com/1/api.js";
|
||||
capt.append(script);
|
||||
capt.append(capty);
|
||||
capty.setAttribute("data-sitekey", e.captcha_sitekey);
|
||||
const script=document.createElement("script");
|
||||
script.src="https://js.hcaptcha.com/1/api.js";
|
||||
capt.append(script);
|
||||
capt.append(capty);
|
||||
}else{
|
||||
eval("hcaptcha.reset()");
|
||||
}
|
||||
return;
|
||||
}
|
||||
if(!e.token){
|
||||
console.log(e);
|
||||
document.getElementById("wrong").textContent=e.errors[Object.keys(e.errors)[0]]._errors[0].message;
|
||||
if(e.errors.consent){
|
||||
error(elements[6],e.errors.consent._errors[0].message);
|
||||
}else if(e.errors.password){
|
||||
error(elements[3],e.errors.password._errors[0].message);
|
||||
}else if(e.errors.username){
|
||||
error(elements[2],e.errors.username._errors[0].message);
|
||||
}else if(e.errors.email){
|
||||
error(elements[1],e.errors.email._errors[0].message);
|
||||
}else if(e.errors.date_of_birth){
|
||||
error(elements[5],e.errors.date_of_birth._errors[0].message);
|
||||
}else{
|
||||
document.getElementById("wrong").textContent=e.errors[Object.keys(e.errors)[0]]._errors[0].message;
|
||||
}
|
||||
}else{
|
||||
localStorage.setItem("token",e.token);
|
||||
window.location.href = '/channels/@me';
|
||||
|
|
@ -55,6 +71,20 @@ async function registertry(e){
|
|||
//document.getElementById("wrong").textContent=h;
|
||||
// console.log(h);
|
||||
}
|
||||
function error(e:HTMLFormElement,message:string){
|
||||
const p=e.parentElement;
|
||||
let element=p.getElementsByClassName("suberror")[0] as HTMLElement;
|
||||
if(!element){
|
||||
const div=document.createElement("div");
|
||||
div.classList.add("suberror","suberrora");
|
||||
p.append(div);
|
||||
element=div;
|
||||
}else{
|
||||
element.classList.remove("suberror");
|
||||
setTimeout(_=>{element.classList.add("suberror")},100);
|
||||
}
|
||||
element.textContent=message;
|
||||
}
|
||||
let TOSa=document.getElementById("TOSa");
|
||||
async function tosLogic(){
|
||||
const apiurl=new URL(JSON.parse(localStorage.getItem("instanceinfo")).api)
|
||||
|
|
|
|||
|
|
@ -851,6 +851,10 @@ select{
|
|||
border-style: solid;
|
||||
border-color: var(--login-border);
|
||||
text-align: center;
|
||||
height: 90%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: flex-start;
|
||||
}
|
||||
|
||||
#logindiv input {
|
||||
|
|
@ -1458,3 +1462,52 @@ span {
|
|||
.scroller{
|
||||
padding-bottom: .2in;
|
||||
}
|
||||
.suberror{
|
||||
animation: goout 6s forwards;
|
||||
}
|
||||
.suberrora{
|
||||
background:var(--channel-hover);
|
||||
border-radius:.1in;
|
||||
position:absolute;
|
||||
border:solid var(--primary-text) .02in;
|
||||
color:color-mix(in hsl,var(--yellow),var(--red));
|
||||
font-weight:bold;
|
||||
opacity:0;
|
||||
cursor:default;
|
||||
/* height: .4in; */
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: flex-start;
|
||||
justify-content: space-evenly;
|
||||
padding: .075in;
|
||||
}
|
||||
@keyframes goout {
|
||||
0%{
|
||||
opacity:0;
|
||||
}
|
||||
5%{
|
||||
opacity:1;
|
||||
}
|
||||
90%{
|
||||
opacity:1;
|
||||
}
|
||||
100%{
|
||||
opacity:0;
|
||||
}
|
||||
}
|
||||
|
||||
#register{
|
||||
display:flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
flex-grow: 1;
|
||||
justify-content: space-between;
|
||||
}
|
||||
.dontgrow{
|
||||
flex-grow:0;
|
||||
width: 1.6in;
|
||||
text-align: center;
|
||||
}
|
||||
form div{
|
||||
width:100%;
|
||||
}
|
||||
|
|
@ -3,6 +3,7 @@
|
|||
/* Default value */
|
||||
--red: red;
|
||||
--green: green;
|
||||
--yellow:yellow;
|
||||
}
|
||||
.Dark-theme { /* thanks to TomatoCake for the updated CSS vars and such*/
|
||||
color-scheme: dark;
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue