📖 Escape Room — User Manual

Complete guide to managing your escape rooms

← Back to App

Overview

The Escape Room management system lets you run escape rooms with real-time control from any device. There are two main interfaces:

🖥️ Admin Panel

Your control center. Manage rooms, start/pause the timer, send messages, play videos, and customize the display — all in real time.

📺 Display Client

The participant-facing screen. Shows the countdown timer, messages, and videos. No login needed — just open the room URL.

All communication is real-time via WebSocket. Changes you make in the admin panel appear on the display instantly.

Getting Started

Creating an Account

1
Navigate to the home page and click Register.
2
Enter your email, a password (min. 8 characters), and optionally your name.
3
Click Create Account. You'll be logged in automatically.

Logging In

1
Enter your email and password on the home page.
2
Click Sign In. You'll be redirected to the Admin Dashboard.
💡 Tip: Sessions last 7 days. You won't need to log in again unless you sign out.

Admin Dashboard

After logging in, you land on the Admin Dashboard. Here you can see all your rooms and create new ones.

Creating a Room

1
Click the + Create Room button.
2
Enter a name for your room (e.g., "The Vault").
3
Click Create. A unique 6-character room code is generated automatically (e.g., ABC123).

Room Cards

Each room card shows:

  • Room name and unique code
  • Manage — opens the Room Control Panel
  • Open Display — opens the participant display in a new tab
  • Delete — permanently removes the room (with confirmation)
💡 Tip: Share the display URL https://escape.janinc.no/room/CODE with participants or open it on a TV/projector in the escape room.

Room Control Panel

The Room Control Panel is your command center for a single room. It is divided into several sections, each described below.

Connection Status

A green ● Connected badge means you have a live WebSocket connection. If you see ○ Disconnected, check your internet connection — the system will auto-reconnect.

A live preview of the display is shown at the bottom of the control panel so you can see exactly what participants see.

Timer Controls

Setting the Duration

1
Enter the duration in HH:MM:SS format (e.g., 01:00:00 for 1 hour).
2
Click Set Time. The timer resets to the new duration and pauses.

Starting & Pausing

  • Start — begins the countdown. The display switches to the "escape" background and shows the start message.
  • Pause — freezes the timer. Click Start again to resume.

Speed Multiplier

Adjust the countdown speed from 0.5× (half speed) to 2× (double speed). This is useful for:

  • Slower (0.5×–0.9×) — give struggling teams more effective time
  • Normal (1.0×) — standard real-time countdown
  • Faster (1.1×–2.0×) — speed up for teams doing too well
💡 Tip: The speed multiplier is shown on the display (e.g., "@ 1.5×") but most participants won't notice subtle changes like 1.1× or 0.9×.

Messages & Sounds

Sending a Message

1
Type your message in the text field.
2
Click Send. The message appears at the bottom of the display screen.

Messages persist on screen until you send a new one or clear it. A soft "ding" sound plays when a new message appears.

Sound Effects

🔊 Alarm

Loud alert sound. Use for urgent communication or to signal time is almost up.

🔔 DingDing

Gentle notification sound. Use to get attention before sending a hint message.

⚠️ Warning: Sound playback requires that a participant has interacted with the display page at least once (browser security policy). An "Enable Audio" prompt is shown when needed.

Video Playback

You can play fullscreen videos on the display. Two video slots are available: Video 1 and Video 2.

Controls

  • Play Video 1 / Play Video 2 — starts fullscreen video playback
  • Pause — pauses or resumes the video
  • Restart — replays the video from the beginning
  • Hide Video — closes the video overlay and returns to the timer
💡 Tip: Upload your own video files as Video1.mp4 and Video2.mp4 in the public/assets/videos/ folder. Videos are not included in the default installation due to file size.

Display Customization

Customize how the display looks for participants.

SettingRangeDefaultDescription
Timer Font Size64–128px96pxSize of the countdown numbers
Message Font Size24–72px48pxSize of messages at the bottom
Display Theme4 optionsDefault (Teal)Default, Dark, Light, or Colorful
Timer Position3 optionsCenterTop, Center, or Bottom of screen
1
Adjust the settings using the sliders and dropdowns.
2
Click Apply Customization to push changes to the display instantly.

Room Settings

Configure persistent settings for each room. These are saved to the database and loaded each time the room is opened.

  • Default Duration — the initial timer value when the room loads (e.g., 01:00:00)
  • Welcome Message — shown when participants first open the display
  • Start Message — shown when the timer starts
  • End Message — shown when the timer reaches zero
  • Miscellaneous Notes — private notes visible only to admins (not displayed to participants)
💡 Tip: Use the Welcome Message for pre-game instructions like "Welcome! Your game master will start the timer shortly."

Display Client (Participant View)

The display client is the screen participants see. Open it at:

https://escape.janinc.no/room/YOUR-CODE

No login is required — anyone with the code can view the display.

What Participants See

  • Countdown Timer — large circular display with color-coded urgency
    • Teal — more than 5 minutes remaining
    • Yellow — under 5 minutes (warning)
    • Orange — under 1 minute (critical)
    • Red pulsing — time's up!
  • Messages — appear at the bottom of the screen with a ding sound
  • Videos — play fullscreen when triggered by admin
  • Background — themed escape room imagery
  • Status indicator — green "Live" dot in the top-right corner

Setting Up the Display

1
Open the display URL on the TV/projector in the escape room.
2
Click anywhere on the page to enable audio (browser requirement).
3
Go fullscreen with F11 for the best experience.
4
Leave the display running — it will auto-reconnect if the connection drops.

Real-Time Sync

The admin panel and display client communicate via WebSocket (Socket.IO). Actions are reflected instantly across all connected clients.

How It Works

Admin Panel
↓ WebSocket event (e.g., "Start Timer")
Server
↓ Broadcasts updated room state
Display Client(s)
  • Multiple display clients can connect to the same room (e.g., multiple screens)
  • The admin panel shows a live preview synced with the same state
  • If a client disconnects, it auto-reconnects and receives the current state
  • All admin actions are logged for analytics

Troubleshooting

Display shows "Disconnected"

Check your internet connection. The display will automatically reconnect within seconds. If the problem persists, refresh the page.

No sound playing

Modern browsers block audio until the user interacts with the page. Click anywhere on the display screen first, then try sending a sound again.

Video not playing

Ensure Video1.mp4 and Video2.mp4 are placed in public/assets/videos/. Videos are not included by default.

Timer seems fast or slow

Check the speed multiplier in the Timer Controls section. A value other than 1.0× will make the timer run faster or slower.

Can't log in

Verify your email and password. Passwords must be at least 8 characters. If you forgot your password, contact the system administrator.

"Room not found" error

Double-check the room code in the URL. Codes are case-sensitive and 6 characters long (e.g., ABC123).

Escape Room Management System v1.0

Home · Admin Dashboard