zlibproxy/app/view/login.html
2024-06-21 20:30:44 +08:00

234 lines
7.3 KiB
HTML
Raw Permalink Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!--
Copyright (C) 2023 admin@pmnet.gq
This program is free software: you can redistribute it and/or modify
it under the terms of the GNU Affero General Public License as
published by the Free Software Foundation, either version 3 of the
License, or (at your option) any later version.
This program is distributed in the hope that it will be useful,
but WITHOUT ANY WARRANTY; without even the implied warranty of
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
GNU Affero General Public License for more details.
You should have received a copy of the GNU Affero General Public License
along with this program. If not, see <http://www.gnu.org/licenses/>.
-->
<!DOCTYPE html>
<html lang="zh-cn">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link href='zlibproxy/normalize.css' rel='stylesheet' type='text/css'>
<link href="https://fonts.laysense.com/css/5000/zh-cn/douyufont/douyufont.css" rel="preload" as="style" onload="this.rel='stylesheet'">
<link href="https://fonts.laysense.com/css/5000/zh-cn/harmonyossans/harmonyossans.css" rel="preload" as="style" onload="this.rel='stylesheet'">
<link id="theme_css" rel="stylesheet" href="zlibproxy/sakura.css">
<style>
.pmnet { font-family: DOUYUFont;}
html {font-family: HarmonyOSSans;}
.animbox {
margin: 50px auto;
width: 200px;
text-align: center;
}
/*设置各竖条的共有样式*/
.animbox > div {
background-color: #279fcf;
width: 4px;
height: 35px;
border-radius: 2px;
margin: 2px;
animation-fill-mode: both;
display: inline-block;
animation: anim 0.9s 0s infinite cubic-bezier(.11, .49, .38, .78);
}
/*设置动画延迟*/
.animbox > :nth-child(2), .animbox > :nth-child(4) {
animation-delay: 0.25s !important;
}
.animbox > :nth-child(1), .animbox > :nth-child(5) {
animation-delay: 0.5s !important;
}
/*定义动画*/
@keyframes anim {
0% { transform: scaley(1); }
80% { transform: scaley(0.3); }
90% { transform: scaley(1); }
}
/* 开关 - 滑块周围的框 */
.switch {
position: relative;
display: inline-block;
width: 60px;
height: 34px;
}
/* 隐藏默认 HTML 复选框 */
.switch input {
opacity: 0;
width: 0;
height: 0;
}
/* 滑块 */
.slider {
position: absolute;
cursor: pointer;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-color: #2fbc47;
-webkit-transition: .4s;
transition: .4s;
}
.slider:before {
position: absolute;
content: "";
height: 26px;
width: 26px;
left: 4px;
bottom: 4px;
background-color: white;
-webkit-transition: .4s;
transition: .4s;
}
input:checked + .slider {
background-color: #2196F3;
}
input:focus + .slider {
box-shadow: 0 0 1px #2196F3;
}
input:checked + .slider:before {
-webkit-transform: translateX(26px);
-ms-transform: translateX(26px);
transform: translateX(26px);
}
/* 圆形滑块 */
.slider.round {
border-radius: 34px;
}
.slider.round:before {
border-radius: 50%;
}
</style>
<title>ZlibraryProxy-登录</title>
</head>
<body>
<script>
//切换深色模式
if(window.matchMedia('(prefers-color-scheme: dark)').matches){
document.getElementById('theme_css').href = 'zlibproxy/sakura-dark.css';
}
</script>
<main>
<h1>Z-library Proxy</h1><hr />
<p>这是一个Zlibrary的代理镜像 ver:<?php echo(getenv('version')); ?></p>
<a href="<?php echo(getenv('copyright_url')); ?>" target="_blank_pmnet">由[<span class="pmnet"><?php echo(getenv('copyright')); ?></span>]维护</a>
<blockquote>
本代理利用广大的Tor代理和中继节点基于<a href="" target="_blank_tor">TOR</a>技术提供服务
<br />
本代理使用Laysense提供的强大内部SD-WAN技术
<br />
使用前请确保您的行为符合当地法律
<br />
选择公网时速度更快当公网不可用时请选择TOR网络TOR网络速度较慢但更安全。
<br />
<span style="color: coral;">本代理不会保存您的密码(仅在浏览器cookies保存您的ID)</span>
</blockquote>
<section>
<h4>登录到Z-Library</h4>
<hr />
<form action="new_apply.php" method="POST">
<p>公网 <label class="switch">
<input id="tor" type="checkbox" name="tor">
<span class="slider round"></span>
</label> TOR网络
</p>
<p>
<label for="name">*Zlibrary账号(email)</label>
<input required="required" name="name" id="name" placeholder="Your Zlib Username" type="email" style="width:50%">
</p>
<p>
<label for="password">*Zlibrary密码</label>
<input required="required" name="password" id="password" placeholder="Your Zilb Password" type="password" style="width:50%">
</p>
<p>
<label for="password">*验证码 <img style="margin-bottom:0px" src="login/code" /></label>
<input required="required" name="code" id="code" placeholder="CaptchaCode" type="text" style="width:35%">
</p>
<div id="load" class="animbox" style="display: none;">
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
</div>
<p style="color: blueviolet;" id="notice"></p>
</form>
<p>
<button onclick="login()" value="登录" style="width:30%">登录</button>
<button onclick="window.open('<?php echo(getenv('reg_url')); ?>')" value="注册" style="width:10%">注册</button>
<br />
点击登录代表您同意并接受<a href="https://www.pmnet.gq/PMNETTOS" target="_blank_tos">TOS</a>
</p>
</section>
</main>
<footer>
<hr/>
©<?php echo(getenv('copyright')); ?> 2024 Made with <a href="https://oxal.org/projects/sakura">sakura.css</a>
</footer>
<script src="zlibproxy/jquery-3.6.3.min.js"></script>
<script>
function login(){
var name = $("#name").val();
var password = $("#password").val();
var ccode = $("#code").val();
var tor = $("#tor").prop('checked');
$.ajax({
type: "POST",
url: '/login/check',
data: {'name':name,'password':password,'code':ccode,'tor':tor},
async: true,
dataType: 'json',
cache: false,
beforeSend: function () {
$('#notice').html('正在登录……(最多可能需要30秒以上请耐心等待)');
$('#load').show();
},
success: function (data) {
if (data.code == 200) {
$('#notice').html('欢迎您'+data.userid+',正在前往Zlibrary镜像站,享受阅读的乐趣吧~');
setTimeout(function(){$(location).attr('href','/')},1500);
} else {
$('#notice').html(data.msg);
}
$('#load').hide();
},
clearForm: true,
resetForm: false
});
}
</script>
</body>
</html>