80 lines
2.5 KiB
HTML
80 lines
2.5 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<title>NovelBin Auto Recorder</title>
|
|
<style>
|
|
body {
|
|
font-family: Arial, sans-serif;
|
|
padding: 10px;
|
|
}
|
|
.resizable {
|
|
resize: both;
|
|
overflow: auto;
|
|
border: 1px solid #ccc;
|
|
padding: 10px;
|
|
margin-bottom: 10px;
|
|
}
|
|
input[type="text"],
|
|
input[type="password"] {
|
|
width: 100%;
|
|
box-sizing: border-box;
|
|
padding: 5px;
|
|
margin-bottom: 5px;
|
|
}
|
|
button {
|
|
margin: 5px 0;
|
|
}
|
|
#authSection, #recorderSection, #chapterListSection {
|
|
min-width: 300px;
|
|
}
|
|
#chapterList li {
|
|
list-style: none;
|
|
padding: 3px 0;
|
|
border-bottom: 1px solid #ccc;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<!-- Authentication Section -->
|
|
<div id="authSection" class="resizable">
|
|
<div id="loginSection">
|
|
<h2>Login</h2>
|
|
<input type="text" id="loginUsername" placeholder="Username"><br/>
|
|
<input type="password" id="loginPassword" placeholder="Password"><br/>
|
|
<button id="loginBtn">Login</button>
|
|
<p>Don't have an account? <a href="#" id="showRegisterLink">Register here</a></p>
|
|
</div>
|
|
<div id="registerSection" style="display: none;">
|
|
<h2>Register</h2>
|
|
<input type="text" id="registerUsername" placeholder="Username"><br/>
|
|
<input type="password" id="registerPassword" placeholder="Password"><br/>
|
|
<input type="password" id="registerConfirmPassword" placeholder="Confirm Password"><br/>
|
|
<button id="registerBtn">Register</button>
|
|
<p>Already have an account? <a href="#" id="showLoginLink">Login here</a></p>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Recorder Section -->
|
|
<div id="recorderSection" class="resizable" style="display: none;">
|
|
<h2>Auto Record Settings</h2>
|
|
<label>
|
|
<input type="checkbox" id="autoRecordToggle"> Auto Record Current Chapter URL
|
|
</label><br/>
|
|
<input type="text" id="allowedPrefixes" placeholder="Enter allowed URL prefixes (comma separated)"><br/>
|
|
<button id="openResizableBtn">Open Resizable Window</button><br/>
|
|
<button id="logoutBtn">Logout</button>
|
|
</div>
|
|
|
|
<!-- Chapter List Section -->
|
|
<div id="chapterListSection" class="resizable" style="display: none;">
|
|
<h2>Recorded Chapters</h2>
|
|
<input type="text" id="searchQuery" placeholder="Search chapters..."><br/>
|
|
<input type="text" id="excludeWords" placeholder="Exclude words (comma separated)"><br/>
|
|
<ul id="chapterList"></ul>
|
|
</div>
|
|
|
|
<div id="status"></div>
|
|
<script src="popup.js"></script>
|
|
</body>
|
|
</html>
|