4. Project Structure
Understanding the layout of the project makes it easy to find the files you need to edit. The table below summarises the most important locations and their roles.
| Path | Description | Beginner’s Note |
|---|---|---|
index.html |
The base layout for the main game screen. | Edit this file to rearrange buttons or cards. |
style.css |
Global look-and-feel including colours, fonts, and spacing. | Change colours or typography here. |
main.js |
The core game logic controlling tabs and button behaviour. | Modify carefully. Test small changes frequently. |
js/ |
Feature-specific JavaScript files. | Use this folder to split complex logic into modules. |
games/ |
Data for optional mini-games and extra content. | Add new mini-games here. |
dungeontypes/ |
Data files describing each dungeon type. | Adjust enemy strength or rewards in these JSON files. |
blockdata.js / blockdata.json |
Configuration for the Block Dimension mode. | Start with blockdata.json to learn the structure. |
tools/ |
Creator-focused utilities and templates. | Customise these tools for your own workflow. |
4.1 Recommended Organisation
- Create a backup folder: Keep copies of original files so you can restore them quickly.
- Maintain a docs area: Collect design notes and meeting minutes for easy sharing.
- Sort assets: Separate images, audio, and fonts into subfolders for clarity.
4.2 Naming Conventions
When adding new files, use readable names with letters, numbers, and hyphens (-).
Choose file extensions such as .html, .css, .js, or .json depending on their purpose.