Added login, logout and other stuff

This commit is contained in:
RemixDev 2020-04-13 00:14:34 +02:00
parent c044a0b9f0
commit 29b38302b4
4 changed files with 123 additions and 22 deletions

View File

@ -109,6 +109,30 @@ div#middle_section {
display: none;
}
/* Settings */
#open_login_prompt{
margin: 8px 0px;
}
#login_input_arl{
width: 100%;
border: 0px solid black;
line-height: 36px;
padding: 0px 8px;
border-radius: 4px;
background-color: var(--secondary-background);
color: var(--primary-text);
}
#settings_btn_copyArl{
min-width: 24px;
width: 48px;
margin: 0px 0px 0px 8px;
padding: 0px 4px;
}
#logged_in_info{
display: none;
margin-bottom: 12px;
}
/* Main Search Tab */
.search_tablinks{
@ -309,6 +333,10 @@ span.tag {
box-shadow: 0 3px 6px -1px rgba(0, 0, 0, 0.12), 0 10px 36px -4px rgba(0, 0, 0, 0.3);
background: #333333;
}
.inline-flex{
display: flex;
align-items:center;
}
button{
font-family : inherit;
font-weight: 600;
@ -323,3 +351,8 @@ button{
text-transform: uppercase;
color: var(--accent-text);
}
button[disabled]{
background-color: var(--secondary-background);
color: var(--main-text);
opacity: 0.75;
}

View File

@ -155,7 +155,18 @@ <h1>Home</h1>
<div id="analyzer_tab" class="main_tabcontent"><h1>Link Analyzer</h1></div>
<div id="settings_tab" class="main_tabcontent">
<h1>Settings</h1>
<button type="button" name="button" onclick="openLoginPrompt()">Login with Email and Password</button>
<div id="logged_in_info">
<img id="settings_picture" src="" alt="Profile Picture" class="circle" style="width: 125px;height:125px; margin-right: 12px;"/>
<p>You are logged in as <b id="settings_username"></b></p>
<button onclick="logout()" id="settings_btn_logout">Logout</button>
</div>
<button id="open_login_prompt" type="button" name="button" onclick="openLoginPrompt()" disabled>Login with e-mail</button>
<div class="inline-flex">
<input autocomplete="off" type="password" id="login_input_arl" placeholder="ARL"/>
<button onclick="copyARLtoClipboard()" id="settings_btn_copyArl"><i class="material-icons">assignment</i></button>
</div>
<p><a href="https://notabug.org/RemixDevs/DeezloaderRemix/wiki/Login+via+userToken" target="_blank">How do I get my own ARL?</a></p>
<p><button onclick="loginButton()" style="width:100%;" id="settings_btn_updateArl">Update ARL</button></p>
</div>
<div id="about_tab" class="main_tabcontent"><h1>About</h1></div>
</div></section>

View File

@ -20,7 +20,10 @@ function toast(msg, icon=null, dismiss=true, id=null){
toastDOM.find(".toast-icon").html(icon)
}
if (dismiss !== null && dismiss){
setTimeout(function(){ toastObj.hideToast() }, 3000);
setTimeout(function(){
toastObj.hideToast()
delete toastsWithId[id]
}, 3000);
}
}else{
if (icon == null)
@ -54,21 +57,86 @@ function openLoginPrompt(){
socket.emit("loginpage")
}
socket.emit("init");
if (localStorage.getItem("arl")){
socket.emit("login", localStorage.getItem("arl"));
function loginButton(){
let arl = document.querySelector("#login_input_arl").value
if (arl != "" && arl != localStorage.getItem("arl")){
socket.emit("login", arl, true)
}
}
function copyARLtoClipboard(){
$("#login_input_arl").attr("type", "text");
let copyText = document.querySelector("#login_input_arl")
copyText.select();
copyText.setSelectionRange(0, 99999);
document.execCommand("copy");
$("#login_input_arl").attr("type", "password");
toast("ARL copied to clipboard", 'assignment')
}
function logout(){
socket.emit("logout");
}
window.addEventListener('pywebviewready', function() {
$('#open_login_prompt').prop('disabled', false);
})
$(function(){
socket.emit("init");
if (localStorage.getItem("arl")){
socket.emit("login", localStorage.getItem("arl"));
$("#login_input_arl").val(data.arl)
}
})
socket.on("logging_in", function(){
toast("Logging in", "loading", false, "login-toast")
})
socket.on("logged_in", function(data){
if (data.status != 0){
console.log(data)
toast("Logged in", "done", true, "login-toast")
if (data.arl && data.status == 1) localStorage.setItem("arl", data.arl)
}else{
toast("Couldn't log in", "close", true, "login-toast")
console.log(data)
switch (data.status) {
case 1:
case 3:
toast("Logged in", "done", true, "login-toast")
if (data.arl){
localStorage.setItem("arl", data.arl)
$("#login_input_arl").val(data.arl)
}
$('#open_login_prompt').hide()
if (data.user){
$("#settings_username").text(data.user.name)
$("#settings_picture").attr("src",`https://e-cdns-images.dzcdn.net/images/user/${data.user.picture}/125x125-000000-80-0-0.jpg`)
$("#logged_in_info").show()
}
break;
case 2:
toast("Already logged in", "done", true, "login-toast")
if (data.user){
$("#settings_username").text(data.user.name)
$("#settings_picture").attr("src",`https://e-cdns-images.dzcdn.net/images/user/${data.user.picture}/125x125-000000-80-0-0.jpg`)
$("#logged_in_info").show()
}
break;
case 0:
toast("Couldn't log in", "close", true, "login-toast")
localStorage.removeItem("arl")
$("#login_input_arl").val("")
$('#open_login_prompt').show()
$("#logged_in_info").hide()
$("#settings_username").text("Not Logged")
$("#settings_picture").attr("src",`https://e-cdns-images.dzcdn.net/images/user/125x125-000000-80-0-0.jpg`)
break;
}
})
socket.on("logged_out", function(){
toast("Logged out", "done", true, "login-toast")
localStorage.removeItem("arl")
$("#login_input_arl").val("")
$('#open_login_prompt').show()
$("#logged_in_info").hide()
$("#settings_username").text("Not Logged")
$("#settings_picture").attr("src",`https://e-cdns-images.dzcdn.net/images/user/125x125-000000-80-0-0.jpg`)
})

View File

@ -1,11 +0,0 @@
<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<meta charset="utf-8">
<title></title>
<link rel="stylesheet" type="text/css" href="css/style.css">
</head>
<body>
<button type="button" name="button">Hello</button>
</body>
</html>