register.html 3.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="UTF-8">
  5. <meta name="viewport" content="width=device-width, initial-scale=1.0">
  6. <title>Register - Audiobookshelf Recommendations</title>
  7. <link rel="stylesheet" href="/static/css/style.css">
  8. </head>
  9. <body>
  10. <div class="auth-container">
  11. <div class="auth-card">
  12. <h1>Create Account</h1>
  13. <p class="auth-subtitle">Get started with AI-powered book recommendations</p>
  14. <div id="message" class="message hidden"></div>
  15. <form id="register-form" onsubmit="handleRegister(event)">
  16. <div class="form-group">
  17. <label for="username">Username</label>
  18. <input
  19. type="text"
  20. id="username"
  21. name="username"
  22. required
  23. autofocus
  24. placeholder="Choose a username"
  25. >
  26. </div>
  27. <div class="form-group">
  28. <label for="email">Email</label>
  29. <input
  30. type="email"
  31. id="email"
  32. name="email"
  33. required
  34. placeholder="your@email.com"
  35. >
  36. </div>
  37. <div class="form-group">
  38. <label for="display_name">Display Name (optional)</label>
  39. <input
  40. type="text"
  41. id="display_name"
  42. name="display_name"
  43. placeholder="Your display name"
  44. >
  45. </div>
  46. <div class="form-group">
  47. <label for="password">Password</label>
  48. <input
  49. type="password"
  50. id="password"
  51. name="password"
  52. required
  53. placeholder="Choose a strong password"
  54. >
  55. </div>
  56. <div class="form-section">
  57. <h3>Audiobookshelf Connection</h3>
  58. <p class="form-help">Connect your Audiobookshelf account to sync your listening history.</p>
  59. <div class="form-group">
  60. <label for="abs_url">Audiobookshelf URL</label>
  61. <input
  62. type="url"
  63. id="abs_url"
  64. name="abs_url"
  65. required
  66. placeholder="https://your-audiobookshelf-server.com"
  67. >
  68. <small>The URL of your Audiobookshelf server</small>
  69. </div>
  70. <div class="form-group">
  71. <label for="abs_api_token">API Token</label>
  72. <input
  73. type="password"
  74. id="abs_api_token"
  75. name="abs_api_token"
  76. required
  77. placeholder="Your Audiobookshelf API token"
  78. >
  79. <small>Get your token from Audiobookshelf Settings > Users > [Your User] > Generate API Token</small>
  80. </div>
  81. </div>
  82. <button type="submit" class="btn btn-primary btn-full">Create Account</button>
  83. </form>
  84. <div class="auth-footer">
  85. <p>Already have an account? <a href="/login">Sign in here</a></p>
  86. </div>
  87. </div>
  88. </div>
  89. <script src="/static/js/app.js"></script>
  90. </body>
  91. </html>