Profile

User account management page
GET POST Authenticated
/app/profile.html

Central user hub handling account details, subscription state, password management, PayPal activation, and tournament claim flow.

Files

  • /app/profile.html – UI structure [oai_citation:0‡profile.html](sediment://file_0000000084c87246b97f58bc70f65fb9)
  • /app/scripts/profile.js – Behaviour/controller [oai_citation:1‡profile.js](sediment://file_00000000b99c7246b02ce8521ca3c502)

Core features

  • Subscription status + PayPal activation
  • User profile display + update
  • Password change
  • Automatic tournament entrant claim via claim_code
  • Auth guard enforcement

API endpoints used

EndpointPurpose
/auth/me.phpLoad user profile
/user/update_profile.phpUpdate user details
/user/change_password.phpChange password
/subscription/activate.phpActivate PayPal return
/tournaments/entrant_claim.phpClaim tournament entry

UX structure

  • Subscription card (status + payment)
  • Account info display
  • Profile update form
  • Password change form

Subscription logic

  • ACTIVE → show renewal date
  • FREE PERIOD → encourage upgrade
  • NOT SUBSCRIBED → block game creation
Driven from subscription_status and first_game_used.

PayPal flow

  1. User clicks PayPal link
  2. Redirect to PayPal
  3. Return to ?payment=success
  4. Frontend calls /subscription/activate.php
Link dynamically built using user_id and config. [oai_citation:2‡profile.js](sediment://file_00000000b99c7246b02ce8521ca3c502)

Entrant claim flow

  1. User lands with ?claim_code=XXX
  2. Auto-call to claim endpoint
  3. Link entrant + armies to user
  4. Remove query param
Fully automated on page load. [oai_citation:3‡profile.js](sediment://file_00000000b99c7246b02ce8521ca3c502)

Data flow

  • load/auth/me.php
  • save profile → update endpoint → reload
  • password → validation → API call
  • subscription → derived UI state

Validation rules

  • First + last name required
  • Password ≥ 8 chars
  • Password confirmation must match

State handling

  • Centralised DOM cache (els)
  • Message helpers (show/hide)
  • Async flow sequencing via boot()

Initialisation sequence

  1. Auth guard (requireAuthOrRedirect())
  2. Load header/footer fragments
  3. Bind events
  4. Handle PayPal return
  5. Load profile
  6. Process claim code
See boot() orchestration. [oai_citation:4‡profile.js](sediment://file_00000000b99c7246b02ce8521ca3c502)

⚠ Debug artefacts

  • alert('profile.js loaded')
  • Multiple alert checkpoints in boot()
These are currently left in production code and should be removed.

Risks / observations

  • Debug alerts will break UX
  • No debounce on save actions
  • PayPal flow assumes success without verification
  • No retry logic for claim flow

Recommended improvements

  • Remove debug alerts immediately
  • Add loading spinners (not text only)
  • Add retry/error handling for claim + payment
  • Centralise API error handling
  • Add optimistic UI updates