WebOrbiton
v3.0.0.2

FlatlyPage

← Changes All versions
531 lines · 18.8 KB
  1. <?php
  2. require_once '../config.php';
  3. require_login();
  4. ​
  5. session_start();
  6. ​
  7. $message = '';
  8. $message_type = '';
  9. ​
  10. if ($_SERVER['REQUEST_METHOD'] === 'POST' && isset($_POST['create_account'])) {
  11. $username = trim($_POST['username']);
  12. $password = $_POST['password'];
  13. $confirm_password = $_POST['confirm_password'];
  15. if (empty($username) || empty($password)) {
  16. $message = 'Please enter a username and password.';
  17. $message_type = 'error';
  18. } elseif (strlen($username) < 3) {
  19. $message = 'The username needs at least 3 characters.';
  20. $message_type = 'error';
  21. } elseif (strlen($password) < 8) {
  22. $message = 'The password needs at least 8 characters.';
  23. $message_type = 'error';
  24. } elseif ($password !== $confirm_password) {
  25. $message = "The passwords don't match.";
  26. $message_type = 'error';
  27. } elseif (!preg_match('/^[a-zA-Z0-9_-]+$/', $username)) {
  28. $message = 'Use only letters, numbers, underscores and hyphens in the username.';
  29. $message_type = 'error';
  30. } else {
  31. $accounts = file_exists('hash.php') ? include('hash.php') : [];
  33. if (isset($accounts[$username])) {
  34. $message = 'That username is already taken.';
  35. $message_type = 'error';
  36. } else {
  37. ​
  38. $accounts[$username] = [
  39. 'username' => $username,
  40. 'password_hash' => password_hash($password, PASSWORD_DEFAULT),
  41. 'created_at' => date('Y-m-d H:i:s')
  42. ];
  44. $php_content = "<?php\n// hash.php - Hashed Admin Credentials\n// DO NOT EDIT MANUALLY - Use create-acc.php to manage accounts\n\nreturn " . var_export($accounts, true) . ";\n";
  46. if (file_put_contents('hash.php', $php_content)) {
  47. $message = 'Account created. You can now sign in to the newsletter manager.';
  48. $message_type = 'success';
  50. $_POST = [];
  51. } else {
  52. $message = "Couldn't save the account. Check the folder permissions on your server.";
  53. $message_type = 'error';
  54. }
  55. }
  56. }
  57. }
  58. ​
  59. if (isset($_GET['delete']) && file_exists('hash.php')) {
  60. $accounts = include('hash.php');
  61. $username_to_delete = $_GET['delete'];
  63. if (isset($accounts[$username_to_delete])) {
  64. unset($accounts[$username_to_delete]);
  66. if (empty($accounts)) {
  68. if (unlink('hash.php')) {
  69. $message = 'Account deleted. There are no newsletter accounts left.';
  70. $message_type = 'success';
  71. }
  72. } else {
  73. $php_content = "<?php\n// hash.php - Hashed Admin Credentials\n// DO NOT EDIT MANUALLY - Use create-acc.php to manage accounts\n\nreturn " . var_export($accounts, true) . ";\n";
  75. if (file_put_contents('hash.php', $php_content)) {
  76. $message = 'Account deleted.';
  77. $message_type = 'success';
  78. }
  79. }
  80. }
  81. }
  82. ​
  83. $existing_accounts = file_exists('hash.php') ? include('hash.php') : [];
  84. ?>
  85. <!DOCTYPE html>
  86. <html lang="en">
  87. <head>
  88. <meta charset="UTF-8">
  89. <meta name="viewport" content="width=device-width, initial-scale=1.0">
  90. <title>Account Creator - Newsletter Manager</title>
  91. <link rel="icon" href="nl.ico?v=<?= filemtime(__DIR__ . '/newsletter/nl.ico') ?>" type="image/x-icon">
  92. <style>
  93. * { margin: 0; padding: 0; box-sizing: border-box; }
  95. :root {
  96. --bg: #0a0a0a;
  97. --bg-elevated: #111;
  98. --bg-card: #161616;
  99. --bg-hover: #1c1c1c;
  100. --border: #262626;
  101. --border-focus: #404040;
  102. --text: #fafafa;
  103. --text-muted: #737373;
  104. --text-subtle: #525252;
  105. --accent: #fff;
  106. --success: #22c55e;
  107. --error: #ef4444;
  108. --warning: #eab308;
  109. --radius: 12px;
  110. --radius-sm: 8px;
  111. }
  113. body {
  114. font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  115. background: var(--bg);
  116. color: var(--text);
  117. padding: 20px;
  118. }
  120. .container {
  121. max-width: 800px;
  122. margin: 0 auto;
  123. }
  125. .header {
  126. background: var(--bg-card);
  127. border: 1px solid var(--border);
  128. padding: 30px;
  129. border-radius: var(--radius);
  130. margin-bottom: 30px;
  131. text-align: center;
  132. }
  134. .header-icon {
  135. width: 48px;
  136. height: 48px;
  137. margin: 0 auto 15px;
  138. color: var(--accent);
  139. }
  141. .header h1 {
  142. font-size: 28px;
  143. margin-bottom: 10px;
  144. }
  146. .header p {
  147. color: var(--text-muted);
  148. font-size: 14px;
  149. }
  151. .card {
  152. background: var(--bg-card);
  153. border: 1px solid var(--border);
  154. border-radius: var(--radius);
  155. padding: 30px;
  156. margin-bottom: 30px;
  157. }
  159. .card h2 {
  160. margin-bottom: 20px;
  161. font-size: 20px;
  162. display: flex;
  163. align-items: center;
  164. gap: 10px;
  165. }
  167. .card h2 svg {
  168. width: 24px;
  169. height: 24px;
  170. }
  172. .alert {
  173. padding: 15px 20px;
  174. border-radius: var(--radius-sm);
  175. margin-bottom: 20px;
  176. font-size: 14px;
  177. border: 1px solid;
  178. display: flex;
  179. align-items: center;
  180. gap: 12px;
  181. }
  183. .alert svg {
  184. width: 20px;
  185. height: 20px;
  186. flex-shrink: 0;
  187. }
  189. .alert-success {
  190. background: rgba(34, 197, 94, 0.1);
  191. color: var(--success);
  192. border-color: rgba(34, 197, 94, 0.2);
  193. }
  195. .alert-error {
  196. background: rgba(239, 68, 68, 0.1);
  197. color: var(--error);
  198. border-color: rgba(239, 68, 68, 0.2);
  199. }
  201. .alert-warning {
  202. background: rgba(234, 179, 8, 0.1);
  203. color: var(--warning);
  204. border-color: rgba(234, 179, 8, 0.2);
  205. }
  207. .alert-info {
  208. background: rgba(59, 130, 246, 0.1);
  209. color: #3b82f6;
  210. border-color: rgba(59, 130, 246, 0.2);
  211. }
  213. .form-group {
  214. margin-bottom: 20px;
  215. }
  217. .form-group label {
  218. display: block;
  219. margin-bottom: 8px;
  220. color: var(--text);
  221. font-weight: 500;
  222. font-size: 14px;
  223. }
  225. .form-group input {
  226. width: 100%;
  227. padding: 12px;
  228. border: 1px solid var(--border);
  229. background: var(--bg-elevated);
  230. color: var(--text);
  231. border-radius: var(--radius-sm);
  232. font-size: 14px;
  233. transition: border-color 0.3s;
  234. }
  236. .form-group input:focus {
  237. outline: none;
  238. border-color: var(--border-focus);
  239. }
  241. .form-help {
  242. font-size: 12px;
  243. color: var(--text-muted);
  244. margin-top: 5px;
  245. }
  247. .btn {
  248. padding: 12px 24px;
  249. border: none;
  250. border-radius: var(--radius-sm);
  251. font-size: 14px;
  252. font-weight: 600;
  253. cursor: pointer;
  254. text-decoration: none;
  255. display: inline-flex;
  256. align-items: center;
  257. gap: 8px;
  258. transition: opacity 0.2s;
  259. }
  261. .btn:hover { opacity: 0.9; }
  263. .btn svg {
  264. width: 16px;
  265. height: 16px;
  266. }
  268. .btn-primary {
  269. background: var(--accent);
  270. color: var(--bg);
  271. }
  273. .btn-danger {
  274. background: var(--error);
  275. color: white;
  276. }
  278. .btn-sm {
  279. padding: 8px 16px;
  280. font-size: 12px;
  281. }
  283. table {
  284. width: 100%;
  285. border-collapse: collapse;
  286. }
  288. table th,
  289. table td {
  290. padding: 12px;
  291. text-align: left;
  292. border-bottom: 1px solid var(--border);
  293. }
  295. table th {
  296. background: var(--bg-elevated);
  297. font-weight: 600;
  298. font-size: 14px;
  299. color: var(--text);
  300. }
  302. table td {
  303. font-size: 14px;
  304. color: var(--text-muted);
  305. }
  307. .empty-state {
  308. text-align: center;
  309. padding: 40px 20px;
  310. color: var(--text-muted);
  311. }
  313. .empty-state svg {
  314. width: 64px;
  315. height: 64px;
  316. margin: 0 auto 20px;
  317. opacity: 0.3;
  318. }
  320. code {
  321. background: var(--bg-elevated);
  322. padding: 2px 6px;
  323. border-radius: 4px;
  324. font-family: 'Courier New', monospace;
  325. font-size: 13px;
  326. color: var(--text-muted);
  327. }
  329. .password-strength {
  330. height: 4px;
  331. background: var(--border);
  332. border-radius: 2px;
  333. margin-top: 8px;
  334. overflow: hidden;
  335. }
  337. .password-strength-bar {
  338. height: 100%;
  339. width: 0;
  340. transition: width 0.3s, background-color 0.3s;
  341. }
  343. .strength-weak { background: var(--error); width: 33%; }
  344. .strength-medium { background: var(--warning); width: 66%; }
  345. .strength-strong { background: var(--success); width: 100%; }
  346. </style>
  347. </head>
  348. <body>
  349. <div class="container">
  350. <div class="header">
  351. <svg class="header-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
  352. <path d="M16 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2"></path>
  353. <circle cx="8.5" cy="7" r="4"></circle>
  354. <line x1="20" y1="8" x2="20" y2="14"></line>
  355. <line x1="23" y1="11" x2="17" y2="11"></line>
  356. </svg>
  357. <h1>Account Creator</h1>
  358. <p>Add or remove the accounts that can use the newsletter manager</p>
  359. </div>
  361. <?php if ($message): ?>
  362. <div class="alert alert-<?= $message_type ?>">
  363. <?php if ($message_type === 'success'): ?>
  364. <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
  365. <path d="M22 11.08V12a10 10 0 1 1-5.93-9.14"></path>
  366. <polyline points="22 4 12 14.01 9 11.01"></polyline>
  367. </svg>
  368. <?php elseif ($message_type === 'error'): ?>
  369. <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
  370. <circle cx="12" cy="12" r="10"></circle>
  371. <line x1="15" y1="9" x2="9" y2="15"></line>
  372. <line x1="9" y1="9" x2="15" y2="15"></line>
  373. </svg>
  374. <?php else: ?>
  375. <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
  376. <path d="M10.29 3.86L1.82 18a2 2 0 0 0 1.71 3h16.94a2 2 0 0 0 1.71-3L13.71 3.86a2 2 0 0 0-3.42 0z"></path>
  377. <line x1="12" y1="9" x2="12" y2="13"></line>
  378. <line x1="12" y1="17" x2="12.01" y2="17"></line>
  379. </svg>
  380. <?php endif; ?>
  381. <span><?= htmlspecialchars($message) ?></span>
  382. </div>
  383. <?php endif; ?>
  385. <div class="card">
  386. <h2>
  387. <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
  388. <path d="M16 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2"></path>
  389. <circle cx="8.5" cy="7" r="4"></circle>
  390. <polyline points="17 11 19 13 23 9"></polyline>
  391. </svg>
  392. Create New Account
  393. </h2>
  395. <form method="POST" id="accountForm">
  396. <div class="form-group">
  397. <label>Username</label>
  398. <input type="text" name="username" id="username" required minlength="3" pattern="[a-zA-Z0-9_-]+" value="<?= htmlspecialchars($_POST['username'] ?? '') ?>">
  399. <div class="form-help">Minimum 3 characters. Only letters, numbers, underscore and dash allowed.</div>
  400. </div>
  402. <div class="form-group">
  403. <label>Password</label>
  404. <input type="password" name="password" id="password" required minlength="8">
  405. <div class="password-strength">
  406. <div class="password-strength-bar" id="strengthBar"></div>
  407. </div>
  408. <div class="form-help">Minimum 8 characters. Use a strong password with letters, numbers and symbols.</div>
  409. </div>
  411. <div class="form-group">
  412. <label>Confirm Password</label>
  413. <input type="password" name="confirm_password" id="confirm_password" required minlength="8">
  414. </div>
  416. <button type="submit" name="create_account" class="btn btn-primary">
  417. <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
  418. <line x1="12" y1="5" x2="12" y2="19"></line>
  419. <line x1="5" y1="12" x2="19" y2="12"></line>
  420. </svg>
  421. Create Account
  422. </button>
  423. </form>
  424. </div>
  426. <?php if (!empty($existing_accounts)): ?>
  427. <div class="card">
  428. <h2>
  429. <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
  430. <path d="M17 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2"></path>
  431. <circle cx="9" cy="7" r="4"></circle>
  432. <path d="M23 21v-2a4 4 0 0 0-3-3.87"></path>
  433. <path d="M16 3.13a4 4 0 0 1 0 7.75"></path>
  434. </svg>
  435. Existing Accounts (<?= count($existing_accounts) ?>)
  436. </h2>
  438. <table>
  439. <thead>
  440. <tr>
  441. <th>Username</th>
  442. <th>Created</th>
  443. <th>Actions</th>
  444. </tr>
  445. </thead>
  446. <tbody>
  447. <?php foreach ($existing_accounts as $username => $account): ?>
  448. <tr>
  449. <td><strong><?= htmlspecialchars($username) ?></strong></td>
  450. <td><?= htmlspecialchars($account['created_at']) ?></td>
  451. <td>
  452. <a href="?delete=<?= urlencode($username) ?>" class="btn btn-danger btn-sm" onclick="return confirm('Delete account \'<?= htmlspecialchars($username) ?>\'?\n\nYou can\'t undo this.')">
  453. <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
  454. <polyline points="3 6 5 6 21 6"></polyline>
  455. <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6m3 0V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
  456. </svg>
  457. Delete
  458. </a>
  459. </td>
  460. </tr>
  461. <?php endforeach; ?>
  462. </tbody>
  463. </table>
  464. </div>
  465. <?php else: ?>
  466. <div class="card">
  467. <div class="empty-state">
  468. <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
  469. <path d="M17 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2"></path>
  470. <circle cx="9" cy="7" r="4"></circle>
  471. <path d="M23 21v-2a4 4 0 0 0-3-3.87"></path>
  472. <path d="M16 3.13a4 4 0 0 1 0 7.75"></path>
  473. </svg>
  474. <p>No accounts yet.<br>Add your first one above.</p>
  475. </div>
  476. </div>
  477. <?php endif; ?>
  479. <div class="card">
  480. <h2>
  481. <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
  482. <circle cx="12" cy="12" r="10"></circle>
  483. <line x1="12" y1="16" x2="12" y2="12"></line>
  484. <line x1="12" y1="8" x2="12.01" y2="8"></line>
  485. </svg>
  486. Important Information
  487. </h2>
  489. <ul style="line-height: 2; color: var(--text-muted); margin-left: 20px;">
  490. <li>Passwords are hashed using bcrypt (industry standard)</li>
  491. <li>Each account gets stored in <code>hash.php</code></li>
  492. <li>Use these credentials to login at <code>manager.php</code></li>
  493. <li>You can create multiple accounts before accessing the manager</li>
  494. </ul>
  495. </div>
  496. </div>
  498. <script>
  499. const passwordInput = document.getElementById('password');
  500. const strengthBar = document.getElementById('strengthBar');
  502. passwordInput.addEventListener('input', function() {
  503. const password = this.value;
  504. const length = password.length;
  506. strengthBar.className = 'password-strength-bar';
  508. if (length === 0) {
  509. strengthBar.style.width = '0';
  510. } else if (length < 8) {
  511. strengthBar.classList.add('strength-weak');
  512. } else if (length < 12 || !/[0-9]/.test(password) || !/[a-zA-Z]/.test(password)) {
  513. strengthBar.classList.add('strength-medium');
  514. } else {
  515. strengthBar.classList.add('strength-strong');
  516. }
  517. });
  519. document.getElementById('accountForm').addEventListener('submit', function(e) {
  520. const password = document.getElementById('password').value;
  521. const confirm = document.getElementById('confirm_password').value;
  523. if (password !== confirm) {
  524. e.preventDefault();
  525. alert('Passwords do not match!');
  526. return false;
  527. }
  528. });
  529. </script>
  530. </body>
  531. </html>