Skip to main content

Documentation Index

Fetch the complete documentation index at: https://mintlify.com/dreancaste/TriviaPP/llms.txt

Use this file to discover all available pages before exploring further.

The Profile page is the player’s personal hub inside TriviaPP. From here, players can set the name that appears on the leaderboard, pick a profile photo from their device camera roll, and toggle haptic feedback for wrong answers. The page also surfaces the player’s registered email address and their lifetime stats — games played, total correct answers, and personal best score.

​
Profile Interface

All profile data is captured in the Profile model: 
export interface Profile {
  displayName: string;
  avatar: string;
  vibrateOnError: boolean;
}
The profile is persisted to localStorage under the key sw_profile via StorageService.saveProfile(profile) and read back on page load with StorageService.getProfile(). If no profile has been saved yet, getProfile() returns the default: { displayName: '', avatar: '', vibrateOnError: true }.

​
Display Name

displayName is the name shown next to the player’s score on both the local and Firebase leaderboards. It is a free-text field with no length constraint enforced at the service level. If the player has not set a name, TriviaPage.finishGame() falls back to "Jugador" when writing ranking and history entries.

​
Avatar Photo

Players can set a profile photo using the Capacitor Camera plugin. Tapping the avatar area on the profile page calls selectPhoto(), which opens a native prompt letting the player choose between their camera and their photo library: 
const image = await Camera.getPhoto({
  quality: 70,
  allowEditing: true,
  resultType: CameraResultType.DataUrl,
  source: CameraSource.Prompt
});

if (image.dataUrl) {
  this.profile.avatar = image.dataUrl;
}
The resulting image is stored as a base64 data URL in profile.avatar and persisted to localStorage along with the rest of the profile when the player saves.
Camera.getPhoto() relies on native device APIs provided by the Capacitor Camera plugin. It will throw an error in a standard desktop browser. Test avatar selection on a physical iOS or Android device, or on a properly configured emulator with camera access enabled.

​
Vibration on Error

The vibrateOnError boolean controls whether the device produces a haptic impact when the player selects a wrong trivia answer. When set to true, TriviaPage.answer() calls: 
await Haptics.impact({ style: ImpactStyle.Heavy });
This uses the Capacitor @capacitor/haptics plugin and only produces physical feedback on a real device. The setting defaults to true for all new profiles.

​
Auth Info and Cumulative Stats

ProfilePage also displays two read-only pieces of information loaded in ngOnInit:
  • Email — retrieved from AuthService.userEmail and displayed as the player’s account identifier.
  • Cumulative stats — loaded from StorageService.getStats(), exposing gamesPlayed, correctAnswers, and maxScore directly on the profile screen.
These values are read-only on this page; they are updated automatically at the end of every trivia session by StorageService.updateStats().

Build docs developers (and LLMs) love

Get started for freeTalk to us