Skip to content

Commit

Permalink
Updated the docs on Architecture
Browse files Browse the repository at this point in the history
  • Loading branch information
programarivm committed Feb 16, 2025
1 parent 6f0bd40 commit 12e844a
Showing 1 changed file with 4 additions and 4 deletions.
8 changes: 4 additions & 4 deletions docs/architecture.md
Original file line number Diff line number Diff line change
Expand Up @@ -29,11 +29,9 @@ As a rule of thumb, there is a `.twig.html` file and a `.js` file associated to
- [templates/pages/play/computer/index.html.twig](https://github.com/chesslablab/website/blob/main/templates/pages/play/computer/index.html.twig)
- [assets/js/pages/play/computer/index.js](https://github.com/chesslablab/website/blob/main/assets/js/pages/play/computer/index.js)

This naming convention allows developers to reduce memorization because given one file name, the name of the remaining two can be inferred.
This naming convention allows to reduce memorization because given one file name, the name of the remaining two can be inferred.

Each page's JavaScript file is then set up as an entrypoint in the [importmap.php](https://github.com/chesslablab/website/blob/main/importmap.php) config file. The main point of the entrypoint script is to update the DOM on user interaction and data change.

So the JavaScript code in the [assets/js/pages/play/computer/index.js](https://github.com/chesslablab/website/blob/main/assets/js/pages/play/computer/index.js) file basically boils down to initialization because the business logic is implemented in WebSocket ESM modules. When the web browser retrieves the response from the WebSocket server, the ESM components are updated with the new data.
Each page's JavaScript file is then set up as an entrypoint in the [importmap.php](https://github.com/chesslablab/website/blob/main/importmap.php) config file. The main point of the entrypoint script is to update the DOM on user interaction and data change. So the JavaScript code in the [assets/js/pages/play/computer/index.js](https://github.com/chesslablab/website/blob/main/assets/js/pages/play/computer/index.js) file boils down to initialization.

```js
import { playComputerModal } from './PlayComputerModal.js';
Expand All @@ -50,6 +48,8 @@ try {
playComputerModal.props.modal.show();
```

When the web browser retrieves the response from the WebSocket server, the ESM components are updated with the new data.

## WebSocket Connections

The ChesslaBlab website is integrated with [PHP Chess Server](https://github.com/chesslablab/chess-server), an asynchronous WebSocket server that provides functionality to play chess online over a WebSocket connection.
Expand Down

0 comments on commit 12e844a

Please sign in to comment.