### WA.nav.goToRoom examples

Source: https://docs.workadventu.re/developer/map-scripting/references/api-nav

Examples of moving to another room using workadventure URLs, relative paths, and global paths with a start layer.

```typescript
WA.nav.goToRoom("/@/tcm/workadventure/floor0"); // workadventure urls  
WA.nav.goToRoom("../otherMap/map.json");  
WA.nav.goToRoom("/_/global/<path to global map>.json#start-layer-2");  
```

--------------------------------

### Start the starter-kit web app with npm run start

Source: https://docs.workadventu.re/map-building/tiled-editor/publish/wa-hosted

Run this command in your terminal to start the web app for testing your map locally. A web page will open with the list of your maps.

```bash
npm run start  
```

--------------------------------

### WA.nav.goToLogin example

Source: https://docs.workadventu.re/developer/map-scripting/references/api-nav

Example of redirecting the user to the login page.

```typescript
await WA.nav.goToLogin();  
```

--------------------------------

### WA.nav.openCoWebSite example

Source: https://docs.workadventu.re/developer/map-scripting/references/api-nav

Example of opening a co-website with default options and with all options, then closing it.

```typescript
const coWebsite = await WA.nav.openCoWebSite("https://www.wikipedia.org/");  
const coWebsiteWorkAdventure = await WA.nav.openCoWebSite(  
  "https://workadventu.re/",  
  true,  
  "",  
  70,  
  1,  
  true,  
  true  
);  
// ...  
coWebsite.close();  
```

--------------------------------

### Install @workadventure/iframe-api-typings

Source: https://docs.workadventu.re/developer/map-scripting/using-typescript

Install the typings package as a dev dependency to get type definitions for the WA object.

```bash
$ npm install --save-dev @workadventure/iframe-api-typings  
```

--------------------------------

### WA.nav.getCoWebSites example

Source: https://docs.workadventu.re/developer/map-scripting/references/api-nav

Example of retrieving all opened co-websites.

```typescript
const coWebsites = await WA.nav.getCoWebSites();  
```

--------------------------------

### Install Map Starter Kit dependencies

Source: https://docs.workadventu.re/map-building/build-your-map.md

Run this command in the map directory to install the local web server dependencies.

```bash
$ npm install  
```

--------------------------------

### Player Status Examples

Source: https://docs.workadventu.re/developer/map-scripting/references/api-player

Examples of setting various player statuses.

```javascript
// Set the player status to busy  
WA.player.setStatus("BUSY");  
  
// Clear the status (back to online)  
WA.player.setStatus("ONLINE");  
  
// Indicate you're temporarily away  
WA.player.setStatus("BACK_IN_A_MOMENT");
```

--------------------------------

### Start development server command

Source: https://docs.workadventu.re/developer/map-scripting/using-typescript

Starts the Vite development server to compile and serve the map.

```bash
$ npm run start
```

--------------------------------

### WA.nav.goToPage example

Source: https://docs.workadventu.re/developer/map-scripting/references/api-nav

Example of navigating the current tab to Wikipedia.

```typescript
WA.nav.goToPage("https://www.wikipedia.org/");  
```

--------------------------------

### Using WA.state shortcut properties

Source: https://docs.workadventu.re/map-building/api-state.md

Example of using shortcut properties to set and get variables, noting that this approach does not return a promise for error handling.

```javascript
WA.state.config = {  
    'bottomExitUrl': '/@/org/world/castle',  
    'topExitUrl': '/@/org/world/tower',  
    'enableBirdSound': true  
};  
  
//...  
let config = WA.state.config;  
```

--------------------------------

### Start the local web server

Source: https://docs.workadventu.re/map-building/build-your-map.md

Run this command to start the local web server and open the welcome page for testing your map.

```bash
$ npm run start  
```

--------------------------------

### Tracking player movement example

Source: https://docs.workadventu.re/developer/map-scripting/references/api-players

Example showing how to configure tracking and subscribe to player movement events.

```typescript
await WA.players.configureTracking();  
WA.players.onPlayerMoves().subscribe((event: RemotePlayerMoved) => {  
    const player = event.player;  
    const oldPosition = event.oldPosition;  
    const newPosition = event.newPosition;  
    console.log(`Player ${player.name} moved from ${oldPosition.x},${oldPosition.y} to ${newPosition.x},${newPosition.y}`);  
});  
```

--------------------------------

### Get an area example

Source: https://docs.workadventu.re/map-building/api-room.md

Example of retrieving an existing area named 'MyNewArea' using await.

```typescript
const area = await WA.room.area.get('MyNewArea');  

```

--------------------------------

### Install OpenAI Realtime API wrapper

Source: https://docs.workadventu.re/blog/realtime-api

Use npm to install the beta wrapper library for the OpenAI Realtime API.

```bash
$ npm install openai/openai-realtime-api-beta --save
```

--------------------------------

### Example: get an area

Source: https://docs.workadventu.re/developer/map-scripting/references/api-room

Shows how to get an existing area object using WA.room.area.get.

```typescript
const area = await WA.room.area.get('MyNewArea');  
```

--------------------------------

### Example of opening a banner

Source: https://docs.workadventu.re/map-building/api-ui.md

A concrete example of calling openBanner with custom styling, a link, and specific timing parameters.

```javascript
WA.ui.banner.openBanner({  
    id: "banner-test",  
    text: "Banner test",  
    bgColor: "#000000",  
    textColor: "#ffffff",  
    closable: false,  
    timeToClose: 120000,  
    link: {  
        label: "Test",  
        url: "https://workadventu.re"  
    }  
});  
```

--------------------------------

### Install dependencies command

Source: https://docs.workadventu.re/developer/map-scripting/using-typescript

Installs the project dependencies defined in package.json.

```bash
$ npm install
```

--------------------------------

### Install OpenAI Library

Source: https://docs.workadventu.re/blog/gpt-bot

Install the official OpenAI NodeJS library to enable API communication.

```bash
npm install openai
```

--------------------------------

### Example: show and hide layer

Source: https://docs.workadventu.re/developer/map-scripting/references/api-room

Example showing how to show and then hide a group layer.

```typescript
WA.room.showLayer("bottom");  
//...  
WA.room.hideLayer("bottom");  
```

--------------------------------

### Access metadata with WA.onInit()

Source: https://docs.workadventu.re/developer/map-scripting/references/api-metadata

Example of accessing the metadata after initialization using WA.onInit().

```javascript
WA.onInit().then(() => {  
    console.log('Current metadata: ', WA.metadata);  
});  
```

--------------------------------

### Listen to audio stream example

Source: https://docs.workadventu.re/developer/map-scripting/references/api-player

Example of subscribing to the audio stream with a specified sample rate and unsubscribing when finished.

```javascript
const sampleRate = 24000;  
  
const subscription = meeting.listenToAudioStream(sampleRate).subscribe((data: Float32Array) => {  
    // Process the audio data  
    console.log(data);  
});  
  
// When you are done listening to the audio stream, you can unsubscribe from the observable.  
subscription.unsubscribe();
```

--------------------------------

### Get player language with WA.onInit

Source: https://docs.workadventu.re/map-building/api-player.md

Logs the player language after initialization. Output example: 'Player language: fr-FR'.

```typescript
WA.onInit().then(() => {  
    console.log('Player language: ', WA.player.language);  
})  
// Will display:  
// Player language: fr-FR  
```

--------------------------------

### Get player name with WA.onInit

Source: https://docs.workadventu.re/map-building/api-player.md

Logs the player name after initialization. Output example: 'Player name: Alice'.

```typescript
WA.onInit().then(() => {  
    console.log('Player name: ', WA.player.name);  
})  
// Will display:  
// Player name: Alice  
```

--------------------------------

### WA.nav.openTab example

Source: https://docs.workadventu.re/developer/map-scripting/references/api-nav

Example of opening a new tab to Wikipedia.

```typescript
WA.nav.openTab("https://www.wikipedia.org/");  
```

--------------------------------

### SaaS map URL example

Source: https://docs.workadventu.re/map-building/tiled-editor/publish/wa-hosted

An example of a constructed URL for a map hosted on the SaaS platform.

```text
https://play.workadventu.re/@/my-org/my-world/map/my-map.wam
```

--------------------------------

### Play and stop a sound with configuration

Source: https://docs.workadventu.re/developer/map-scripting/references/api-sound

Example showing how to load a sound, define a configuration object, play the sound, and stop it.

```javascript
var mySound = WA.sound.loadSound("Sound.ogg");  
var config = {  
    volume : 0.5,  
    loop : false,  
    rate : 1,  
    detune : 1,  
    delay : 0,  
    seek : 0,  
    mute : false  
}  
mySound.play(config);  
// ...  
mySound.stop();  
```

--------------------------------

### Open a UI website

Source: https://docs.workadventu.re/developer/map-scripting/references/api-ui

Example of opening a website and updating its position property.

```javascript
const myWebsite = await WA.ui.website.open({  
    url: "https://wikipedia.org",  
    position: {  
        vertical: "middle",  
        horizontal: "middle",  
    },  
    size: {  
        height: "50vh",  
        width: "50vw",  
    },  
});  
  
myWebsite.position.vertical = "top";  
```

--------------------------------

### startStreaming()

Source: https://docs.workadventu.re/developer/map-scripting/references/api-spaces

Starts streaming audio/video in the space. This is only available if the `filterType` is set to `"streaming"`. If the `filterType` is set to `"everyone"`, anyone starting a webcam or microphone will automatically be audible to all other users in the space.

```APIDOC
## startStreaming()

### Description
Starts streaming audio/video in the space. This is only available if the `filterType` is set to `"streaming"`. If the `filterType` is set to `"everyone"`, anyone starting a webcam or microphone will automatically be audible to all other users in the space.

### Method
`startStreaming()`

### Example
```javascript
space.startStreaming();  
```
```

--------------------------------

### Define moveTo parameter before start

Source: https://docs.workadventu.re/map-building/tiled-editor/entry-exit

An alternative URL structure where the moveTo parameter precedes the start entry point.

```text
.../my_map.json#moveTo=meeting-room&start
```

--------------------------------

### Set Player Outline Color Example

Source: https://docs.workadventu.re/developer/map-scripting/references/api-player

Example of applying a red outline to the player.

```javascript
// Let's add a red outline to our player  
WA.player.setOutlineColor(255, 0, 0);
```

--------------------------------

### Self-hosted map URL example

Source: https://docs.workadventu.re/map-building/tiled-editor/publish/wa-hosted

An example of a constructed URL for a map on a self-hosted server.

```text
https://play.workadventu.re/~/map/my-map.wam
```

--------------------------------

### Define entry point and moveTo parameter

Source: https://docs.workadventu.re/map-building/tiled-editor/entry-exit

Specifies both the start entry point and the moveTo destination as a meeting room.

```text
.../my_map.json#start&moveTo=meeting-room
```

--------------------------------

### Example: set a layer property

Source: https://docs.workadventu.re/developer/map-scripting/references/api-room

Example using WA.room.setProperty to set a property on a layer, demonstrating a typical usage.

```typescript
WA.room.setProperty("wikiLayer", "openWebsite", "https://www.wikipedia.org/");  
```

--------------------------------

### Get player ID with WA.onInit

Source: https://docs.workadventu.re/map-building/api-player.md

Logs the player ID after initialization. Output example: 'Player ID: a293c901-4455-4b1e-cf39-f4c0420de6f5'.

```typescript
WA.onInit().then(() => {  
    console.log('Player ID: ', WA.player.id);  
})  
// Will display:  
// Player ID: a293c901-4455-4b1e-cf39-f4c0420de6f5  
```

--------------------------------

### Set tiles example

Source: https://docs.workadventu.re/developer/map-scripting/references/api-room

Example of replacing tiles on the 'setTiles' layer. Uses both string and numeric tile IDs.

```typescript
WA.room.setTiles([  
  { x: 6, y: 4, tile: "blue", layer: "setTiles" },  
  { x: 7, y: 4, tile: 109, layer: "setTiles" },  
  { x: 8, y: 4, tile: 109, layer: "setTiles" },  
  { x: 9, y: 4, tile: "blue", layer: "setTiles" },  
]);  

```

--------------------------------

### Accessing remote player variables example

Source: https://docs.workadventu.re/developer/map-scripting/references/api-players

Example showing how to list players and access their public state variables.

```typescript
await WA.players.configureTracking();  
const players = WA.players.list();  
for (const player of players) {  
    console.log(`Player ${player.name} score is ${player.state.score}`);  
}  
```

--------------------------------

### Play and stop a video example

Source: https://docs.workadventu.re/developer/map-scripting/references/api-ui

Demonstrates how to initiate a video playback and subsequently stop it using the returned Video object.

```javascript
const video = await WA.ui.playVideo('https://example.com/video.mp4', { loop: true });  
  
// Later, stop the video  
await video.stop();  
```

--------------------------------

### Install @workadventure/quests package

Source: https://docs.workadventu.re/admin/quests

Run this command at the root of your map repository to install the @workadventure/quests package, which provides functions to interact with the quest system.

```bash
npm install @workadventure/quests  
```

--------------------------------

### Get and modify an embedded website example

Source: https://docs.workadventu.re/map-building/api-room.md

Retrieves an existing website object named 'my_website' and updates its URL and visibility.

```typescript
// Get an existing website object where 'my_website' is the name of the object (on any layer object of the map)  
const website = await WA.room.website.get("my_website");  
website.url = "https://example.com";  
website.visible = true;  
```

--------------------------------

### Example of banner opened

Source: https://docs.workadventu.re/developer/map-scripting/references/api-ui

Example call to WA.ui.banner.openBanner with a banner id 'banner-test', text 'Banner test', black background, white text, non-closable, auto-close after 120000 ms, and a link to https://workadventu.re with label 'Test'.

```javascript
WA.ui.banner.openBanner({  
    id: "banner-test",  
    text: "Banner test",  
    bgColor: "#000000",  
    textColor: "#ffffff",  
    closable: false,  
    timeToClose: 120000,  
    link: {  
        label: "Test",  
        url: "https://workadventu.re"  
    }  
});  

```

--------------------------------

### Listening to remote player variable changes example

Source: https://docs.workadventu.re/developer/map-scripting/references/api-players

Example showing how to subscribe to changes for a specific variable on a remote player instance.

```typescript
// Assuming remotePlayer is a RemotePlayerInterface instance  
// Let's listen to changes in the "score" variable:  
remotePlayer.state.onVariableChange("score").subscribe((value: unknown) => {  
    console.log(`Player ${remotePlayer.name} new score is ${value}`);  
});  
```

--------------------------------

### Example Prompt Output

Source: https://docs.workadventu.re/blog/gpt-bot

The resulting string generated by the prompt function.

```text
David is a coworker. He/she is part of your team.  
Max, John and Rose are visitors.  
```

--------------------------------

### Create an area example

Source: https://docs.workadventu.re/map-building/api-room.md

Example of creating a new area named 'MyNewArea' at position (100,100) with size 320x320.

```typescript
const area = WA.room.area.create({  
    name: 'MyNewArea',  
    x: 100,  
    y: 100,  
    width: 320,  
    height: 320,  
});  

```

--------------------------------

### Start Streaming Audio/Video

Source: https://docs.workadventu.re/developer/map-scripting/references/api-spaces

Starts streaming in the space. This method is only available when the filterType is set to 'streaming'.

```javascript
space.startStreaming();  
```

--------------------------------

### Set a property on a layer example

Source: https://docs.workadventu.re/map-building/api-room.md

Example of setting the "openWebsite" property on the "wikiLayer" layer to a URL.

```typescript
WA.room.setProperty("wikiLayer", "openWebsite", "https://www.wikipedia.org/");  

```

--------------------------------

### Install cron-schedule package

Source: https://docs.workadventu.re/blog/day-and-night

Run this command in your map repository to install the cron-schedule package, which is used for time-based switching of tiles.

```bash
npm install cron-schedule  
```

--------------------------------

### Example of banner closed

Source: https://docs.workadventu.re/developer/map-scripting/references/api-ui

Example call to WA.ui.banner.closeBanner() to close the banner.

```javascript
WA.ui.banner.closeBanner();  

```

--------------------------------

### Get player tags with WA.onInit

Source: https://docs.workadventu.re/map-building/api-player.md

Logs the player tags after initialization.

```typescript
WA.onInit().then(() => {  
    console.log('Tags: ', WA.player.tags);  
})  
```

--------------------------------

### Meeting Join and Leave Event Example

Source: https://docs.workadventu.re/developer/map-scripting/references/api-player

Example of subscribing to meeting join and leave events to send chat messages.

```typescript
WA.player.meetings.onJoin().subscribe(async (meeting: Meeting) => {  
    WA.chat.sendChatMessage("You joined a proximity chat", "System");  
  
    meeting.onLeave().subscribe(async () => {  
        WA.chat.sendChatMessage("You left the proximity chat", "System");  
    });  
});
```

--------------------------------

### Open profile menu via script

Source: https://docs.workadventu.re/developer/map-scripting/references/api-ui

Example of retrieving the profile menu command and triggering its open method.

```typescript
const menu = await WA.ui.getMenuCommand("profile");  
menu.open();  
```

--------------------------------

### Install admin panel with Helm

Source: https://docs.workadventu.re/admin/admin-self-hosting

Adds the WorkAdventure Helm chart repository and installs or upgrades the administration panel in the specified namespace using the provided values.yaml file.

```bash
helm repo add workadventure-charts https://charts.workadventu.re  
helm upgrade --install -n [your-namespace] -f values.yaml workadventure-admin workadventure-charts/workadventure-admin  

```

--------------------------------

### Example: create an area

Source: https://docs.workadventu.re/developer/map-scripting/references/api-room

Shows how to create a new area object using WA.room.area.create.

```typescript
const area = WA.room.area.create({  
    name: 'MyNewArea',  
    x: 100,  
    y: 100,  
    width: 320,  
    height: 320,  
});  
```

--------------------------------

### Run Vite dev server

Source: https://docs.workadventu.re/blog/note-taking

Starts the local web server on port 3000. Access the site at http://localhost:3000.

```bash
npm run dev  

```

--------------------------------

### Install Matrix Synapse Helm chart

Source: https://docs.workadventu.re/admin/admin-self-hosting

Deploy the Matrix Synapse server using the Helm chart after configuring the values.yaml file.

```bash
helm upgrade --install -n [your-namespace] -f values.yaml synapse workadventure-charts/workadventure-synapse
```

--------------------------------

### Get player position with WA.onInit

Source: https://docs.workadventu.re/map-building/api-player.md

Logs the player position after initialization using async/await.

```typescript
WA.onInit().then(async () => {  
    console.log('Position: ', await WA.player.getPosition());  
})  
```

--------------------------------

### Set player status examples (BUSY, ONLINE, BACK_IN_A_MOMENT)

Source: https://docs.workadventu.re/map-building/api-player.md

Examples of setting the player status to BUSY, clearing it back to ONLINE, and indicating temporary away with BACK_IN_A_MOMENT.

```typescript
// Set the player status to busy  
WA.player.setStatus("BUSY");  
  
// Clear the status (back to online)  
WA.player.setStatus("ONLINE");  
  
// Indicate you're temporarily away  
WA.player.setStatus("BACK_IN_A_MOMENT");  

```

--------------------------------

### Get user-room token with WA.onInit

Source: https://docs.workadventu.re/map-building/api-player.md

Logs the user-room token after initialization.

```typescript
WA.onInit().then(() => {  
    console.log('Token: ', WA.player.userRoomToken);  
})  
```

--------------------------------

### Example: modify an area

Source: https://docs.workadventu.re/developer/map-scripting/references/api-room

Shows getting an area and then modifying its x and y properties.

```typescript
const area = await WA.room.area.get('MyNewArea');  
if (area) {  
    area.x = 150;  
    area.y = 150;  
}  
```

--------------------------------

### Subscribe to variable changes example

Source: https://docs.workadventu.re/map-building/api-players.md

Example of subscribing to the 'score' variable change for all players and logging the result.

```typescript
WA.players.onVariableChange("score").subscribe((event: PlayerVariableChanged) => {  
    console.log(`Player ${event.player.name} new score is ${event.value}`);  
});  
```

--------------------------------

### Get Tiled map data

Source: https://docs.workadventu.re/developer/map-scripting/references/api-room

Example of awaiting WA.room.getTiledMap() and logging the Tiled version.

```typescript
const map = await WA.room.getTiledMap();  
console.log("Map generated with Tiled version ", map.tiledversion);  

```

--------------------------------

### Configure database backup to S3 in values.yaml

Source: https://docs.workadventu.re/admin/admin-self-hosting

Example values.yaml to configure the automatic backup system to an S3 compatible storage. Set enabled to true and provide bucket, endpointUrl, accessKeyId, and secretAccessKey.

```yaml
backup:  
    enabled: false  
    bucket: null  
    fileName: workadventure-mysql-backup  
    endpointUrl: null  
    accessKeyId: null  
    secretAccessKey: null  
    schedule: "0 4 * * *"  
    count: 30  

```

--------------------------------

### Iterate over nearby players

Source: https://docs.workadventu.re/developer/map-scripting/references/api-players

Example showing how to enable tracking and then iterate through the list of nearby players to access their properties.

```javascript
await WA.players.configureTracking();  
const players = WA.players.list();  
for (const player of players) {  
    console.log(`Player ${player.name} is near you`);  
}  
```

--------------------------------

### Get leaderboard URL and open modal with getLeaderboardURL

Source: https://docs.workadventu.re/admin/quests

Call getLeaderboardURL to get a URL object for the leaderboard as HTML, which can be used in an iframe. The example shows opening a modal with WA.ui.modal.openModal using the returned URL.

```javascript
import { getLeaderboardURL } from "@workadventure/quests";  
  
const leaderboardURL = getLeaderboardURL("QUEST_KEY");  
  
// Open a modal with the leaderboard  
WA.ui.modal.openModal({  
    title: "Your quest",  
    src: leaderboardURL,  
    position: "center",  
    allowApi: false,  
    allow: "",  
}, () => {});  
```

--------------------------------

### Open chat window on layer enter

Source: https://docs.workadventu.re/developer/map-scripting/references/api-chat

Example that opens the chat window when the player enters a specific layer.

```typescript
WA.room.onEnterLayer('my_layer').subscribe(() => {  
    WA.chat.open();  
});  
```

--------------------------------

### Get all UI websites

Source: https://docs.workadventu.re/developer/map-scripting/references/api-ui

Retrieves all currently open UI websites.

```javascript
WA.ui.website.getAll();  
```

--------------------------------

### Example: disabling and restoring room list on layer enter/leave

Source: https://docs.workadventu.re/developer/map-scripting/references/api-controls

This example subscribes to the 'myZone' layer's enter and leave events to call WA.controls.disableRoomList() when entering and WA.controls.restoreRoomList() when leaving, thereby removing and restoring the room list button in the action bar.

```typescript
WA.room.onEnterLayer('myZone').subscribe(() => {  
    WA.controls.disableRoomList();  
});  
  
WA.room.onLeaveLayer('myZone').subscribe(() => {  
    WA.controls.restoreRoomList();  
});  

```

--------------------------------

### Enable player tracking with WA.players.configureTracking

Source: https://docs.workadventu.re/developer/map-scripting/references/api-players

Call this method to start receiving data from nearby users. This is a prerequisite for using other player tracking features.

```javascript
await WA.players.configureTracking();  
```

--------------------------------

### Configure database persistence and resources in values.yaml

Source: https://docs.workadventu.re/admin/admin-self-hosting

Example values.yaml to configure the MySQL database PVC size and resource requests, ensuring the database is allocated on a pod with enough resources.

```yaml
mysql:  
    primary:  
        persistence:  
            size: 10Gi  
        resources:  
            requests:  
                memory: 3Gi  
                cpu: 1  

```

--------------------------------

### Admin Chart Values Override Example

Source: https://docs.workadventu.re/admin/admin-self-hosting/custom-registry-images

Example configuration for overriding admin chart image repositories and Bitnami dependency registries in a values file.

```yaml
imagePullSecrets:  
  - name: local-registry-pull  
  
admin:  
  image:  
    repository: registry.internal.example.com:5000/git.thecodingmachine.com-444/tcm-projects/workadventure-saas/admin  
  
headlessBrowser:  
  image:  
    repository: registry.internal.example.com:5000/git.thecodingmachine.com-444/tcm-projects/workadventure-saas/headless-browser  
  
redis:  
  global:  
    imageRegistry: registry.internal.example.com:5000/docker.io  
  
mysql:  
  global:  
    imageRegistry: registry.internal.example.com:5000/docker.io  
  
phpmyadmin:  
  global:  
    imageRegistry: registry.internal.example.com:5000/docker.io  
```

--------------------------------

### Get map URL after initialization

Source: https://docs.workadventu.re/developer/map-scripting/references/api-room

Example of accessing WA.room.mapURL inside WA.onInit().then(). Outputs the map URL.

```typescript
WA.onInit().then(() => {  
  console.log("Map URL: ", WA.room.mapURL);  
  // Will output something like: 'https://mymap.org/map.json"  
});  

```

--------------------------------

### Install Scripting API Extra via npm

Source: https://docs.workadventu.re/map-building/tiled-editor/extra-features

Install the Scripting API Extra library as a dependency using npm. This is for projects that use a bundler like Webpack or Rollup.

```bash
npm install --save @workadventure/scripting-api-extra  
```

--------------------------------

### Install Scripting API Extra via NPM

Source: https://docs.workadventu.re/developer/map-scripting/scripting-api-extra

Install the @workadventure/scripting-api-extra package using NPM. This package is provided as an ES6 module, so a bundler like Webpack is required to package your script.

```bash
npm install --save @workadventure/scripting-api-extra  

```

--------------------------------

### Get room id after initialization

Source: https://docs.workadventu.re/developer/map-scripting/references/api-room

Example of accessing WA.room.id inside WA.onInit().then(). Outputs the room URL.

```typescript
WA.onInit().then(() => {  
  console.log("Room id: ", WA.room.id);  
  // Will output something like: 'https://play.workadventu.re/@/myorg/myworld/myroom', or 'https://play.workadventu.re/_/global/mymap.org/map.json"  
});  

```

--------------------------------

### Example generated prompt output

Source: https://docs.workadventu.re/blog/gpt-bot

The expected string output format generated by the prompt functions.

```text
In your map, you can find the following people:  
  
- Max is in lobby  
- David is in meeting room  
- ...  
```

--------------------------------

### Minimal WAM file structure

Source: https://docs.workadventu.re/developer/map-storage-api

A minimal example of a WAM file defining the map URL, entity collections, and metadata.

```json
{
    "version": "1.0.0",
    "mapUrl": "https://your_server/your_map.tmj",
    "entities": {},
    "areas": [],
    "entityCollections": [
        {
            "url": "https://play.workadventu.re/collections/FurnitureCollection.json",
            "type": "file"
        },
        {
            "url": "https://play.workadventu.re/collections/OfficeCollection.json",
            "type": "file"
        }
    ],
    "metadata": {
        "name": "The map name",
        "description": "A description displayed when sharing the map",
        "thumbnail": "https://your_server/thhumbnail.png",
        "copyright": "Credits: ..."
    }
}
```

--------------------------------

### Initialize API with async/await

Source: https://docs.workadventu.re/developer/map-scripting/references/api-start

Using the async/await syntax to wait for the API to be ready before accessing player properties.

```javascript
(async () => {  
    await WA.onInit();  
    console.log('Current player name: ', WA.player.name);  
})();  
```

--------------------------------

### Read URL hash parameters

Source: https://docs.workadventu.re/developer/map-scripting/references/api-room

Example of reading a hash parameter 'myparam' from the URL after initialization.

```typescript
// If the URL is https://play.workadventu.re/_/global/mymap.org/map.json#myparam=hello  
  
WA.onInit().then(() => {  
  console.log("Map URL: ", WA.room.hashParameters.myparam);  
  // Will output something like: 'hello"  
});  

```

--------------------------------

### Filtering Initial Subscription Events

Source: https://docs.workadventu.re/developer/map-scripting/references/api-mapeditor

Example demonstrating how to ignore the immediate callback trigger that occurs if the user is already inside the area upon subscription.

```javascript
WA.mapEditor.area.onEnter("myAreaName").subscribe(({ reason }) => {  
    if (reason === "initial") {  
        // The user was already inside the area when the subscription was made.  
        return;  
    }  
    // ...  
});
```

--------------------------------

### Create a New Room

Source: https://docs.workadventu.re/developer/map-storage-api

Example of the PUT request structure used to create a new WAM file room.

```http
PUT /office/first_floor.wam  
```

--------------------------------

### Use default entry point with moveTo

Source: https://docs.workadventu.re/map-building/tiled-editor/entry-exit

Directs the user to the 'exit' location using the default entry point.

```text
.../my_map.json#&moveTo=exit
```

--------------------------------

### Open a modal on the left side

Source: https://docs.workadventu.re/developer/map-scripting/references/api-ui

Example of opening a modal on the left side of the screen.

```javascript
    WA.ui.modal.openModal({  
        title: "WorkAdventure website",  
        src: 'https://workadventu.re',  
        position: "left"  
    });  
```

--------------------------------

### Example output of generatePlacesPrompt

Source: https://docs.workadventu.re/blog/gpt-bot

The expected string output returned by the generatePlacesPrompt function.

```text
In your map, you can find the following places:  
  
- chill zone: People in this zone are relaxing.  
- meeting room: This is a meeting room where people gather that have meetings.  
- ...  
```

--------------------------------

### Subscribing to Area Entry and Exit

Source: https://docs.workadventu.re/developer/map-scripting/references/api-mapeditor

Example showing how to subscribe to area events and unsubscribe when they are no longer needed.

```javascript
const myAreaEnterSubscriber = WA.mapEditor.area.onEnter("myAreaName").subscribe(() => {  
  WA.chat.sendChatMessage("Hello!", "Mr Robot");  
});  
  
const myAreaLeaveSubscriber = WA.mapEditor.area.onLeave("myAreaName").subscribe(() => {  
  WA.chat.sendChatMessage("Goodbye!", "Mr Robot");  
  myAreaSubscriber.unsubscribe();  
});  
  
// If you want to stop listening to the events at some point:  
myAreaEnterSubscriber.unsubscribe();  
myAreaLeaveSubscriber.unsubscribe();
```

--------------------------------

### WA.onInit()

Source: https://docs.workadventu.re/developer/map-scripting/references/api-start

Returns a Promise that resolves when the WorkAdventure API is fully ready. Use this before accessing properties like WA.player.name.

```APIDOC
## WA.onInit()

### Description
Returns a Promise that resolves when the WorkAdventure API is fully ready. Use this before accessing properties like WA.player.name.

### Method
onInit

### Endpoint
WA.onInit()

### Parameters
None

### Request Example
WA.onInit().then(() => {  
    console.log('Current player name: ', WA.player.name);  
});  

### Response
#### Success Response (Promise<void>)
Resolves when the API is ready.

#### Response Example
(async () => {  
    await WA.onInit();  
    console.log('Current player name: ', WA.player.name);  
})();  

```

--------------------------------

### Register and remove a custom menu

Source: https://docs.workadventu.re/developer/map-scripting/references/api-ui

Example showing how to register a custom menu command and remove it later. The callback sends a chat message.

```typescript
const menu = WA.ui.registerMenuCommand('menu test',  
    {  
        callback: () => {  
            WA.chat.sendChatMessage('test');  
        }  
    })  
  
// Some time later, if you want to remove the menu:  
menu.remove();  
```

--------------------------------

### Open a modal in the center

Source: https://docs.workadventu.re/developer/map-scripting/references/api-ui

Example of opening a modal in the center of the screen with specific permissions and a close callback.

```javascript
WA.ui.modal.openModal({  
    title: "WorkAdventure website",  
    src: 'https://workadventu.re',  
    allow: "geolocation",  
    allowApi: true,  
    position: "center",  
    allowFullScreen: false,  
    () => {  
        console.info('The modal was closed');  
    }  
});  
```

--------------------------------

### Subscribe to reactiveUser properties

Source: https://docs.workadventu.re/developer/map-scripting/references/api-spaces

Example showing how to subscribe to changes in a user's availability status using the reactiveUser property.

```javascript
space.userJoinedObservable.subscribe((user) => {  
    user.reactiveUser.availabilityStatus.subscribe((newStatus) => {  
        console.log(`User ${user.name} has a new status: ${newStatus}`);  
    });  
});  
```

--------------------------------

### Define moveTo with coordinates

Source: https://docs.workadventu.re/map-building/tiled-editor/entry-exit

Directs the user to specific x,y coordinates (200, 100) after spawning at the start point.

```text
.../my_map.json#start&moveTo=200,100
```

--------------------------------

### Iterating Through Map Areas

Source: https://docs.workadventu.re/developer/map-scripting/references/api-mapeditor

Example of how to retrieve the list of areas and log their properties.

```javascript
const areas = await WA.mapEditor.area.list();  
for (const area of areas) {  
  console.log(`Area ${area.name} at (${area.x}, ${area.y}) with width ${area.width} and height ${area.height}`);  
}
```

--------------------------------

### Instantiating AudioWorkletNode in main file

Source: https://docs.workadventu.re/blog/realtime-api

Demonstrates initializing an AudioContext, loading the processor module, and connecting the AudioWorkletNode to a MediaStreamDestination.

```typescript
// Sample rate returned by OpenAI is 24kHz  
const audioContext = new AudioContext({ sampleRate: 24000 });  
  
// Let's create the MediaStream  
const mediaStreamDestination = this.audioContext.createMediaStreamDestination();  
  
await this.audioContext.resume();  
  
// Let's load the audio worklet processor (assuming the file is available in the pcm-processor.js)  
await this.audioContext.audioWorklet.addModule("output-pcm-processor.js");  
  
// Instantiate the audio worklet node (we use the 'output-pcm-worklet-processor' string to match the name we used in the registerProcessor call)  
const workletNode = new AudioWorkletNode(this.audioContext, 'output-pcm-worklet-processor');  
  
// Connect the worklet node to the media stream destination  
workletNode.connect(this.mediaStreamDestination);
```

--------------------------------

### Retrieve a remote player by ID

Source: https://docs.workadventu.re/developer/map-scripting/references/api-players

Example showing how to configure tracking and retrieve a player by ID, checking if the player exists before accessing properties.

```typescript
await WA.players.configureTracking();  
const player = WA.players.get(1);  
if (player !== undefined) {  
    console.log(`Player 1 name is ${player.name}`);  
}  
```

--------------------------------

### Example JSON response from openid-configuration

Source: https://docs.workadventu.re/admin/sso-openid-connect

Shows the metadata returned by the OIDC discovery endpoint, including issuer, authorization, token, userinfo, and JWKS URIs, plus supported response types, subject types, signing algorithms, and scopes.

```json
{  
  "issuer": "https://login.microsoftonline.com/{tenant_id}/v2.0",  
  "authorization_endpoint": "https://login.microsoftonline.com/{tenant_id}/oauth2/v2.0/authorize",  
  "token_endpoint": "https://login.microsoftonline.com/{tenant_id}/oauth2/v2.0/token",  
  "userinfo_endpoint": "https://graph.microsoft.com/oidc/userinfo",  
  "jwks_uri": "https://login.microsoftonline.com/{tenant_id}/discovery/v2.0/keys",  
  "response_types_supported": [  
    "code", "id_token", "token"  
  ],  
  "subject_types_supported": ["pairwise"],  
  "id_token_signing_alg_values_supported": ["RS256"],  
  "scopes_supported": ["openid", "profile", "email"]  
}  

```

--------------------------------

### Start Chat and Trigger GPT

Source: https://docs.workadventu.re/blog/gpt-bot

The startChat method initializes the conversation with a system prompt, while triggerGpt handles sending the message history to the OpenAI API and updating the local history with the assistant's response.

```typescript
class Robot {  
    // ...  
  
    private async startChat(users: RemotePlayer[]) {  
        // Let's generate the prompt  
        const chatPrompt = await getChatPrompt(users);  
  
        this.chatHistory = [{  
            role: "system",  
            content: chatPrompt,  
        }];  
  
        const response = await this.triggerGpt();  
  
        WA.chat.sendChatMessage(response, {  
            scope: "bubble",  
        });  
    }  
  
  
    private async triggerGpt() {  
        // Let's create the list of messages to send to OpenAI  
        const messages = this.chatHistory.map(message => {  
            return {  
                role: message.role,  
                content: message.content,  
            }  
        });  
  
        // Send the messages to OpenAPI GPT 3.5-turbo model (i.e. ChatGPT)  
        const chatCompletion = await openai.chat.completions.create({  
            messages,  
            model: 'gpt-3.5-turbo',  
        });  
  
        const response = chatCompletion.choices[0]?.message.content;  
        if (response === null || response === undefined) {  
            throw new Error("OpenAI returned no response: " + JSON.stringify(chatCompletion))  
        }  
        console.log("OpenAI response:", response);  
  
        // Let's add the response to the chat history. The response will be sent back to OpenAPI on subsequent calls to triggerGpt()  
        this.chatHistory.push({  
            role: "assistant",  
            content: response,  
        });  
  
        return response;  
    }  
}  
```

--------------------------------

### Load tileset and set tiles example

Source: https://docs.workadventu.re/map-building/api-room.md

Loads a tileset from 'Assets/Tileset.json' and uses the returned first tile id to set a tile at position (4,4) on the bottom layer.

```typescript
WA.room.loadTileset("Assets/Tileset.json").then((firstId) => {  
  WA.room.setTiles([{ x: 4, y: 4, tile: firstId, layer: "bottom" }]);  
});  
```

--------------------------------

### SAAS metadata structure with NFTs

Source: https://docs.workadventu.re/developer/map-scripting/references/api-metadata

Example metadata object structure sent in the SAAS case, containing the list of NFTs owned by the user.

```json
{  
    "player" {  
        "nfts" [  
            {  
                "contractAddress": string,  
                "nfts": [  
                    {  
                        "tokenId": string,  
                        "spriteUrl": string|undefined  
                    },  
                    ...  
                ]  
            },  
            ...  
        ]  
    }  
}  
```

--------------------------------

### Listen to local chat messages

Source: https://docs.workadventu.re/developer/map-scripting/references/api-chat

Example that logs messages typed by the local user.

```typescript
WA.chat.onChatMessage((message => {  
    console.log('The local user typed a message', message);  
}));  
```

--------------------------------

### index.html entry point

Source: https://docs.workadventu.re/developer/map-scripting/using-typescript

The basic HTML structure for the map project.

```html
<!DOCTYPE html>  
<html lang="en">  
  
<head>  
    <meta charset="utf-8">  
    <meta name="viewport" content="width=device-width,initial-scale=1.0">  
    <meta name="robots" content="noindex">  
    <title>WorkAdventure Starter</title>  
</head>  
  
<body></body>  
  
</html>
```

--------------------------------

### Example of player movement listener

Source: https://docs.workadventu.re/developer/map-scripting/references/api-player

A simple implementation of the movement listener using console.log to output event data.

```typescript
WA.player.onPlayerMove(console.log);
```

--------------------------------

### Example of an icon only action bar button

Source: https://docs.workadventu.re/developer/map-scripting/references/api-ui

Adds a button using an image and a tooltip, which removes itself upon being clicked.

```typescript
    // Add action bar button 'Register'.  
    WA.ui.actionBar.addButton({  
        id: 'icon-btn',  
        imageSrc: '<Your image url>',  
        toolTip: 'Click me',  
        callback: (event) => {  
            console.log('Button clicked', event);  
            // When a user clicks on the action bar button 'Register', we remove it.  
            WA.ui.actionBar.removeButton('icon-btn');  
        }  
    });  
```

--------------------------------

### Minimal values.yaml for WorkAdventure admin

Source: https://docs.workadventu.re/admin/admin-self-hosting

Example minimal values.yaml for the Helm chart. Sets the domain name, Docker registry credentials (provided by WorkAdventure), and enables TLS with cert-manager annotations for the ingress.

```yaml
domainName: "example.com"  
  
admin:  
  imageCredentials:  
    # This password will be provided to you by WorkAdventure  
    username: "your-docker-registry-username"  
    password: "your-docker-registry-password"  
  
ingress:  
    tls: true  
    # Here, put whatever annotations you need to configure the ingress (and the certificate)  
    annotationsPath:  
        cert-manager.io/cluster-issuer: letsencrypt-prod  

```

--------------------------------

### Open and close popup on layer enter/leave

Source: https://docs.workadventu.re/developer/map-scripting/references/api-ui

Example showing how to open a popup when entering a layer and close it when leaving. Uses WA.room.onEnterLayer and WA.room.onLeaveLayer.

```typescript
let helloWorldPopup;  
  
// Open the popup when we enter a given zone  
WA.room.onEnterLayer("myZone").subscribe(() => {  
    helloWorldPopup = WA.ui.openPopup("popupRectangle", 'Hello world!', [{  
        label: "Close",  
        className: "primary",  
        callback: (popup) => {  
            // Close the popup when the "Close" button is pressed.  
            popup.close();  
        }  
    }]);  
});  
  
// Close the popup when we leave the zone.  
WA.room.onLeaveLayer("myZone").subscribe(() => {  
    helloWorldPopup.close();  
})  
```

--------------------------------

### Subscribe and unsubscribe to camera updates

Source: https://docs.workadventu.re/developer/map-scripting/references/api-camera

Example of subscribing to camera updates and logging the world view, then unsubscribing later.

```typescript
const subscription = WA.camera.onCameraUpdate().subscribe((worldView) => console.log(worldView));  
//later...  
subscription.unsubscribe();  
```

--------------------------------

### Prototype chat prompt

Source: https://docs.workadventu.re/blog/gpt-bot

A static example of the prompt structure sent to the OpenAI API to define the bot's persona and map context.

```text
You are a bot living in a WorkAdventure map.  
You are currently chatting with Max. You are engaged in a chat, please keep your answers short and to the point.  
In this conversation, you can offer to go to a place or to go to a person. I will now describe the places and people you can find in this map.  
  
In your map, you can find the following places:  
  
- chill zone: People in this zone are relaxing.  
- meeting room: This is a meeting room where people gather that have meetings.  
- lobby: This is the entrance of the office. People entering this place should be welcome in priority.  
- ...  
  
In your map, you can find the following people:  
  
- Max is in lobby  
- David is in meeting room  
  
Max is a visitor.  
David is a coworker.  
  
If you are talking to a visitor, you can direct them to one of the team members if they are present in the room. If you do so, please direct them to the  
person whose skills match the best the visitor's needs.  
If no team member is present in the room, you can offer the visitors to come back at office hours (9:00 to 18:00, Paris time, on working days).  
  
Because there are many people in this chat, when someone is talking to you, the message sent will be prefixed by the name of the person talking to you.  
When you answer, do not put any prefix.  
  
You start first. Please engage the conversation with a short welcome message.  
```

--------------------------------

### Initialize Scripting API Extra with bootstrapExtra

Source: https://docs.workadventu.re/map-building/tiled-editor/extra-features

Import the bootstrapExtra function and call it to initialize all custom properties. This is required after installing the library.

```javascript
import { bootstrapExtra } from "@workadventure/scripting-api-extra";  
  
// Calling bootstrapExtra will initiliaze all the "custom properties"  
bootstrapExtra();  
```

--------------------------------

### Listen to bubble chat messages with player tracking

Source: https://docs.workadventu.re/developer/map-scripting/references/api-chat

Example that configures player tracking and listens to bubble messages, logging the message and author name.

```typescript
// Let's configure player tracking to get additional data in the "author" field  
await WA.players.configureTracking({  
    players: true,  
    movement: false,  
});  
  
WA.chat.onChatMessage(((message, event) => {  
    console.log('Message received: ', message);  
    console.log('Message author: ', event.author.name);  
}), {  
    scope: 'bubble'  
});  
```

--------------------------------

### Initialize OpenAI Client

Source: https://docs.workadventu.re/blog/gpt-bot

Import and initialize the OpenAI client. Note that dangerouslyAllowBrowser is required for browser-based bot execution.

```javascript
const openai = new OpenAI({  
  dangerouslyAllowBrowser: true,  
  apiKey: 'xx-xxxxxxxxxxxxxxxxxxxxxxxxxxxxxx',  
});
```

--------------------------------

### Initialize API with Promise

Source: https://docs.workadventu.re/developer/map-scripting/references/api-start

Using the promise-based approach to wait for the API to be ready before accessing player properties.

```javascript
WA.onInit().then(() => {  
    console.log('Current player name: ', WA.player.name);  
});  
```

--------------------------------

### Build the map with npm run build

Source: https://docs.workadventu.re/map-building/tiled-editor/publish/hosting

Run this command in the map starter kit to optimize the map for WorkAdventure, rewriting tilesets and bundling TypeScript files. The output is placed in a dist directory that you host on your web server.

```bash
npm run build  
```

--------------------------------

### WA.room.website.get method signature

Source: https://docs.workadventu.re/map-building/api-room.md

Gets an instance of an embedded website by object name. Returns a promise of an EmbeddedWebsite instance.

```typescript
WA.room.website.get(objectName: string): Promise<EmbeddedWebsite>  
```

--------------------------------

### Instantiating the AudioWorklet in the main thread

Source: https://docs.workadventu.re/blog/realtime-api

Configures the AudioContext to 24kHz, loads the worklet module, and connects a MediaStream source to the worklet node.

```typescript
import audioWorkletProcessorUrl from "./input-pcm-processor.ts?worker&url";  
  
// Sample rate required by OpenAI is 24kHz  
const audioContext = new AudioContext({ sampleRate: 24000 });  
  
await this.audioContext.resume();  
  
// Let's load the audio worklet processor (assuming the file is available in the pcm-processor.js)  
await this.audioContext.audioWorklet.addModule(audioWorkletProcessorUrl);  
  
// Instantiate the audio worklet node (we use the 'input-pcm-worklet-processor' string to match the name we used in the registerProcessor call)  
const workletNode = new AudioWorkletNode(this.audioContext, 'input-pcm-worklet-processor');  
  
// Connect the media stream as an input to our worklet node (this assume you already have a "mediaStream" variable connected  
// to your microphone)  
const sourceNode = this.audioContext.createMediaStreamSource(mediaStream);  
sourceNode.connect(workletNode);  
  
workletNode.port.onmessage = (event: MessageEvent) => {  
    const data = event.data.pcmData;  
    if (data instanceof Float32Array) {  
        console.log('Received audio data from the input worklet:', data);  
    } else {  
        console.error("Invalid data type received in worklet", event.data);  
    }  
};
```

--------------------------------

### Synapse Chart Values Override Example

Source: https://docs.workadventu.re/admin/admin-self-hosting/custom-registry-images

Example configuration for overriding synapse chart image repositories in a values file.

```yaml
imagePullSecrets:  
  - name: local-registry-pull  
  
backup:  
  image:  
    repository: registry.internal.example.com:5000/docker.io/eeshugerman/postgres-backup-s3  
  
createMatrixUserJob:  
  image:  
    repository: registry.internal.example.com:5000/docker.io/bitnamilegacy/kubectl  
  
synapse:  
  serverName: "matrix.example.com"  
  publicServerName: "matrix.example.com"  
  
  image:  
    repository: registry.internal.example.com:5000/ghcr.io/element-hq/synapse  
  
  signingkey:  
    job:  
      generateImage:  
        repository: registry.internal.example.com:5000/docker.io/matrixdotorg/synapse  
      publishImage:  
        repository: registry.internal.example.com:5000/docker.io/bitnami/kubectl  
  
  wellknown:  
    image:  
      repository: registry.internal.example.com:5000/ghcr.io/rtsp/docker-lighttpd  
  
  postgresql:  
    image:  
      repository: registry.internal.example.com:5000/docker.io/bitnamilegacy/postgresql  
  
  redis:  
    image:  
      repository: registry.internal.example.com:5000/docker.io/bitnamilegacy/redis  
  
  redis:  
    image:  
      repository: registry.internal.example.com:5000/docker.io/bitnamilegacy/redis  
```

--------------------------------

### WA.ui.website.getAll(): Promise<UIWebsite[]>

Source: https://docs.workadventu.re/developer/map-scripting/references/api-ui

Retrieves all UI websites currently open. Returns a Promise that resolves to an array of UIWebsite instances.

```APIDOC
## WA.ui.website.getAll(): Promise<UIWebsite[]>

### Description
Retrieves all UI websites currently open. Returns a Promise that resolves to an array of UIWebsite instances.

### Method
WA.ui.website.getAll

### Parameters
None

### Request Example
```typescript
WA.ui.website.getAll();
```

### Response
#### Success Response (Promise<UIWebsite[]>)
- **UIWebsite[]** - Array of UIWebsite objects. Each UIWebsite has the properties described in the open method response.
```

--------------------------------

### Tock Web Connector API Response Example

Source: https://docs.workadventu.re/blog/tock-bot

Shows the JSON response format from Tock, containing an array of responses with text fields.

```json
{  
  "responses": [  
    {  
      "text": "I'm fine, thank you. How can I help you?",  
    }  
  ]  
}  

```

--------------------------------

### Tock Web Connector API Request Example

Source: https://docs.workadventu.re/blog/tock-bot

Shows the HTTP POST request format for querying Tock. The endpoint is /io/{app_name}/{bot_name}/{connector_name} with a JSON body containing the query and userId.

```json
{  
  "query": "Hello, how are you?",  
  "userId": "1234"  
}  

```