ninja-terminals 2.1.4 → 2.1.5

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "ninja-terminals",
-  "version": "2.1.4",
+  "version": "2.1.5",
   "description": "Multi-terminal Claude Code orchestrator with DAG task management, permission hooks, and resilience",
   "main": "server.js",
   "bin": {

package/public/app.js

@@ -62,6 +62,26 @@ const auth = {
     return data;
   },
 
+  async register(username, email, password) {
+    const res = await fetch(`${AUTH_API}/auth/register`, {
+      method: 'POST',
+      headers: { 'Content-Type': 'application/json' },
+      body: JSON.stringify({ username, email, password }),
+    });
+
+    if (!res.ok) {
+      const err = await res.json().catch(() => ({}));
+      throw new Error(err.message || 'Registration failed');
+    }
+
+    const data = await res.json();
+    this.token = data.token || data.accessToken;
+    localStorage.setItem(TOKEN_KEY, this.token);
+
+    await this.validateTier();
+    return data;
+  },
+
   async activateLicense(key) {
     const res = await fetch(`${AUTH_API}/ninja/activate-license`, {
       method: 'POST',
@@ -143,10 +163,45 @@ function hideAuthOverlay() {
 
 function setupAuthForms() {
   const loginForm = document.getElementById('login-form');
+  const registerForm = document.getElementById('register-form');
   const licenseForm = document.getElementById('license-form');
   const loginError = document.getElementById('login-error');
+  const registerError = document.getElementById('register-error');
   const logoutBtn = document.getElementById('logout-btn');
+  const showRegisterLink = document.getElementById('show-register');
+  const authToggleText = document.getElementById('auth-toggle-text');
+
+  // Toggle between login and register
+  let showingRegister = false;
+
+  function toggleAuthMode() {
+    showingRegister = !showingRegister;
+    if (showingRegister) {
+      loginForm.classList.add('hidden');
+      registerForm.classList.remove('hidden');
+      authToggleText.innerHTML = 'Already have an account? <a href="#" id="show-register">Sign in</a>';
+      document.getElementById('register-username').focus();
+    } else {
+      registerForm.classList.add('hidden');
+      loginForm.classList.remove('hidden');
+      authToggleText.innerHTML = 'Don\'t have an account? <a href="#" id="show-register">Sign up</a>';
+      document.getElementById('login-email').focus();
+    }
+    // Re-attach click handler to new link
+    document.getElementById('show-register').addEventListener('click', (e) => {
+      e.preventDefault();
+      toggleAuthMode();
+    });
+    loginError.textContent = '';
+    registerError.textContent = '';
+  }
+
+  showRegisterLink.addEventListener('click', (e) => {
+    e.preventDefault();
+    toggleAuthMode();
+  });
 
+  // Login form
   loginForm.addEventListener('submit', async (e) => {
     e.preventDefault();
     loginError.textContent = '';
@@ -163,6 +218,30 @@ function setupAuthForms() {
     }
   });
 
+  // Register form
+  registerForm.addEventListener('submit', async (e) => {
+    e.preventDefault();
+    registerError.textContent = '';
+
+    const username = document.getElementById('register-username').value.trim();
+    const email = document.getElementById('register-email').value.trim();
+    const password = document.getElementById('register-password').value;
+
+    if (password.length < 8) {
+      registerError.textContent = 'Password must be at least 8 characters';
+      return;
+    }
+
+    try {
+      await auth.register(username, email, password);
+      hideAuthOverlay();
+      startApp();
+    } catch (err) {
+      registerError.textContent = err.message;
+    }
+  });
+
+  // License form
   licenseForm.addEventListener('submit', async (e) => {
     e.preventDefault();
     loginError.textContent = '';

package/public/index.html

@@ -38,18 +38,29 @@
       <div class="auth-card-inner">
         <h1 class="logo-text">NINJA TERMINALS</h1>
         <p class="auth-subtitle">Multi-Agent Claude Code Orchestrator</p>
+        <!-- Login Form -->
         <form id="login-form">
           <input type="text" id="login-email" placeholder="Email or username" required autocomplete="username">
           <input type="password" id="login-password" placeholder="Password" required autocomplete="current-password">
           <button type="submit" class="auth-btn">Sign In</button>
           <p class="auth-error" id="login-error"></p>
         </form>
+
+        <!-- Register Form (hidden by default) -->
+        <form id="register-form" class="hidden">
+          <input type="text" id="register-username" placeholder="Username" required autocomplete="username">
+          <input type="email" id="register-email" placeholder="Email" required autocomplete="email">
+          <input type="password" id="register-password" placeholder="Password (min 8 chars)" required autocomplete="new-password" minlength="8">
+          <button type="submit" class="auth-btn">Create Account</button>
+          <p class="auth-error" id="register-error"></p>
+        </form>
+
         <div class="auth-divider"><span>or</span></div>
         <form id="license-form">
           <input type="text" id="license-key" placeholder="Enter license key" autocomplete="off">
           <button type="submit" class="auth-btn auth-btn-secondary">Activate License</button>
         </form>
-        <p class="auth-footer">Don't have an account? <a href="https://ninjaterminals.com" target="_blank">Sign up</a></p>
+        <p class="auth-footer" id="auth-toggle-text">Don't have an account? <a href="#" id="show-register">Sign up</a></p>
       </div>
     </div>
   </div>

package/public/style.css

@@ -1,5 +1,7 @@
 * { margin: 0; padding: 0; box-sizing: border-box; }
 
+.hidden { display: none !important; }
+
 :root {
   /* ── Retro Command Cards palette ── */
   --bg: #0C0C0C;