Merge branch 'develop' of github.com:thecodingmachine/workadventure into metadataScriptingApi
This commit is contained in:
commit
fd931c4884
30
.github/workflows/build-and-deploy.yml
vendored
30
.github/workflows/build-and-deploy.yml
vendored
@ -1,6 +1,8 @@
|
|||||||
name: Build, push and deploy Docker image
|
name: Build, push and deploy Docker image
|
||||||
|
|
||||||
on:
|
on:
|
||||||
|
push:
|
||||||
|
branch: [master]
|
||||||
release:
|
release:
|
||||||
types: [created]
|
types: [created]
|
||||||
pull_request:
|
pull_request:
|
||||||
@ -14,7 +16,7 @@ env:
|
|||||||
jobs:
|
jobs:
|
||||||
|
|
||||||
build-front:
|
build-front:
|
||||||
if: ${{ github.event.release || contains(github.event.pull_request.labels.*.name, 'deploy') }}
|
if: ${{ github.event.release || github.event.push || contains(github.event.pull_request.labels.*.name, 'deploy') }}
|
||||||
runs-on: ubuntu-latest
|
runs-on: ubuntu-latest
|
||||||
|
|
||||||
steps:
|
steps:
|
||||||
@ -34,11 +36,11 @@ jobs:
|
|||||||
username: ${{ secrets.DOCKER_USERNAME }}
|
username: ${{ secrets.DOCKER_USERNAME }}
|
||||||
password: ${{ secrets.DOCKER_PASSWORD }}
|
password: ${{ secrets.DOCKER_PASSWORD }}
|
||||||
repository: thecodingmachine/workadventure-front
|
repository: thecodingmachine/workadventure-front
|
||||||
tags: ${{ github.event.pull_request && env.GITHUB_HEAD_REF_SLUG || env.GITHUB_REF_SLUG }}
|
tags: ${{ github.event.pull_request && env.GITHUB_HEAD_REF_SLUG || github.event.release && env.GITHUB_REF_SLUG || 'master' }}
|
||||||
add_git_labels: true
|
add_git_labels: true
|
||||||
|
|
||||||
build-back:
|
build-back:
|
||||||
if: ${{ github.event.release || contains(github.event.pull_request.labels.*.name, 'deploy') }}
|
if: ${{ github.event.release || github.event.push || contains(github.event.pull_request.labels.*.name, 'deploy') }}
|
||||||
runs-on: ubuntu-latest
|
runs-on: ubuntu-latest
|
||||||
|
|
||||||
steps:
|
steps:
|
||||||
@ -57,11 +59,11 @@ jobs:
|
|||||||
username: ${{ secrets.DOCKER_USERNAME }}
|
username: ${{ secrets.DOCKER_USERNAME }}
|
||||||
password: ${{ secrets.DOCKER_PASSWORD }}
|
password: ${{ secrets.DOCKER_PASSWORD }}
|
||||||
repository: thecodingmachine/workadventure-back
|
repository: thecodingmachine/workadventure-back
|
||||||
tags: ${{ github.event.pull_request && env.GITHUB_HEAD_REF_SLUG || env.GITHUB_REF_SLUG }}
|
tags: ${{ github.event.pull_request && env.GITHUB_HEAD_REF_SLUG || github.event.release && env.GITHUB_REF_SLUG || 'master' }}
|
||||||
add_git_labels: true
|
add_git_labels: true
|
||||||
|
|
||||||
build-pusher:
|
build-pusher:
|
||||||
if: ${{ github.event.release || contains(github.event.pull_request.labels.*.name, 'deploy') }}
|
if: ${{ github.event.release || github.event.push || contains(github.event.pull_request.labels.*.name, 'deploy') }}
|
||||||
runs-on: ubuntu-latest
|
runs-on: ubuntu-latest
|
||||||
|
|
||||||
steps:
|
steps:
|
||||||
@ -80,11 +82,11 @@ jobs:
|
|||||||
username: ${{ secrets.DOCKER_USERNAME }}
|
username: ${{ secrets.DOCKER_USERNAME }}
|
||||||
password: ${{ secrets.DOCKER_PASSWORD }}
|
password: ${{ secrets.DOCKER_PASSWORD }}
|
||||||
repository: thecodingmachine/workadventure-pusher
|
repository: thecodingmachine/workadventure-pusher
|
||||||
tags: ${{ github.event.pull_request && env.GITHUB_HEAD_REF_SLUG || env.GITHUB_REF_SLUG }}
|
tags: ${{ github.event.pull_request && env.GITHUB_HEAD_REF_SLUG || github.event.release && env.GITHUB_REF_SLUG || 'master' }}
|
||||||
add_git_labels: true
|
add_git_labels: true
|
||||||
|
|
||||||
build-uploader:
|
build-uploader:
|
||||||
if: ${{ github.event.release || contains(github.event.pull_request.labels.*.name, 'deploy') }}
|
if: ${{ github.event.release || github.event.push || contains(github.event.pull_request.labels.*.name, 'deploy') }}
|
||||||
runs-on: ubuntu-latest
|
runs-on: ubuntu-latest
|
||||||
|
|
||||||
steps:
|
steps:
|
||||||
@ -103,11 +105,11 @@ jobs:
|
|||||||
username: ${{ secrets.DOCKER_USERNAME }}
|
username: ${{ secrets.DOCKER_USERNAME }}
|
||||||
password: ${{ secrets.DOCKER_PASSWORD }}
|
password: ${{ secrets.DOCKER_PASSWORD }}
|
||||||
repository: thecodingmachine/workadventure-uploader
|
repository: thecodingmachine/workadventure-uploader
|
||||||
tags: ${{ github.event.pull_request && env.GITHUB_HEAD_REF_SLUG || env.GITHUB_REF_SLUG }}
|
tags: ${{ github.event.pull_request && env.GITHUB_HEAD_REF_SLUG || github.event.release && env.GITHUB_REF_SLUG || 'master' }}
|
||||||
add_git_labels: true
|
add_git_labels: true
|
||||||
|
|
||||||
build-maps:
|
build-maps:
|
||||||
if: ${{ github.event.release || contains(github.event.pull_request.labels.*.name, 'deploy') }}
|
if: ${{ github.event.release || github.event.push || contains(github.event.pull_request.labels.*.name, 'deploy') }}
|
||||||
runs-on: ubuntu-latest
|
runs-on: ubuntu-latest
|
||||||
|
|
||||||
steps:
|
steps:
|
||||||
@ -127,7 +129,7 @@ jobs:
|
|||||||
username: ${{ secrets.DOCKER_USERNAME }}
|
username: ${{ secrets.DOCKER_USERNAME }}
|
||||||
password: ${{ secrets.DOCKER_PASSWORD }}
|
password: ${{ secrets.DOCKER_PASSWORD }}
|
||||||
repository: thecodingmachine/workadventure-maps
|
repository: thecodingmachine/workadventure-maps
|
||||||
tags: ${{ github.event.pull_request && env.GITHUB_HEAD_REF_SLUG || env.GITHUB_REF_SLUG }}
|
tags: ${{ github.event.pull_request && env.GITHUB_HEAD_REF_SLUG || github.event.release && env.GITHUB_REF_SLUG || 'master' }}
|
||||||
add_git_labels: true
|
add_git_labels: true
|
||||||
|
|
||||||
deeploy:
|
deeploy:
|
||||||
@ -138,7 +140,7 @@ jobs:
|
|||||||
- build-maps
|
- build-maps
|
||||||
- build-uploader
|
- build-uploader
|
||||||
runs-on: ubuntu-latest
|
runs-on: ubuntu-latest
|
||||||
if: ${{ contains(github.event.pull_request.labels.*.name, 'deploy') }}
|
if: ${{ github.event.push || contains(github.event.pull_request.labels.*.name, 'deploy') }}
|
||||||
|
|
||||||
steps:
|
steps:
|
||||||
- name: Checkout
|
- name: Checkout
|
||||||
@ -156,14 +158,14 @@ jobs:
|
|||||||
JITSI_URL: ${{ secrets.JITSI_URL }}
|
JITSI_URL: ${{ secrets.JITSI_URL }}
|
||||||
SECRET_JITSI_KEY: ${{ secrets.SECRET_JITSI_KEY }}
|
SECRET_JITSI_KEY: ${{ secrets.SECRET_JITSI_KEY }}
|
||||||
TURN_STATIC_AUTH_SECRET: ${{ secrets.TURN_STATIC_AUTH_SECRET }}
|
TURN_STATIC_AUTH_SECRET: ${{ secrets.TURN_STATIC_AUTH_SECRET }}
|
||||||
DEPLOY_REF: ${{ env.GITHUB_HEAD_REF_SLUG }}
|
DEPLOY_REF: ${{ github.event.pull_request && env.GITHUB_HEAD_REF_SLUG || 'master' }}
|
||||||
with:
|
with:
|
||||||
namespace: workadventure-${{ env.GITHUB_HEAD_REF_SLUG }}
|
namespace: workadventure-${{ github.event.pull_request && env.GITHUB_HEAD_REF_SLUG || 'master' }}
|
||||||
|
|
||||||
- name: Add a comment in PR
|
- name: Add a comment in PR
|
||||||
uses: unsplash/comment-on-pr@v1.2.0
|
uses: unsplash/comment-on-pr@v1.2.0
|
||||||
|
if: ${{ github.event.pull_request }}
|
||||||
env:
|
env:
|
||||||
GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
|
GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
|
||||||
with:
|
with:
|
||||||
msg: Environment deployed at https://play.${{ env.GITHUB_HEAD_REF_SLUG }}.test.workadventu.re
|
msg: Environment deployed at https://play.${{ env.GITHUB_HEAD_REF_SLUG }}.test.workadventu.re
|
||||||
check_for_duplicate_msg: true
|
|
||||||
|
237
docs/maps/api-reference.md
Normal file
237
docs/maps/api-reference.md
Normal file
@ -0,0 +1,237 @@
|
|||||||
|
{.section-title.accent.text-primary}
|
||||||
|
# API Reference
|
||||||
|
|
||||||
|
### Sending a message in the chat
|
||||||
|
|
||||||
|
```
|
||||||
|
sendChatMessage(message: string, author: string): void
|
||||||
|
```
|
||||||
|
|
||||||
|
Sends a message in the chat. The message is only visible in the browser of the current user.
|
||||||
|
|
||||||
|
* **message**: the message to be displayed in the chat
|
||||||
|
* **author**: the name displayed for the author of the message. It does not have to be a real user.
|
||||||
|
|
||||||
|
Example:
|
||||||
|
|
||||||
|
```javascript
|
||||||
|
WA.sendChatMessage('Hello world', 'Mr Robot');
|
||||||
|
```
|
||||||
|
|
||||||
|
### Listening to messages from the chat
|
||||||
|
|
||||||
|
```javascript
|
||||||
|
onChatMessage(callback: (message: string) => void): void
|
||||||
|
```
|
||||||
|
|
||||||
|
Listens to messages typed by the current user and calls the callback. Messages from other users in the chat cannot be listened to.
|
||||||
|
|
||||||
|
* **callback**: the function that will be called when a message is received. It contains the message typed by the user.
|
||||||
|
|
||||||
|
Example:
|
||||||
|
|
||||||
|
```javascript
|
||||||
|
WA.onChatMessage((message => {
|
||||||
|
console.log('The user typed a message', message);
|
||||||
|
}));
|
||||||
|
```
|
||||||
|
|
||||||
|
### Detecting when the user enters/leaves a zone
|
||||||
|
|
||||||
|
```
|
||||||
|
onEnterZone(name: string, callback: () => void): void
|
||||||
|
onLeaveZone(name: string, callback: () => void): void
|
||||||
|
```
|
||||||
|
|
||||||
|
Listens to the position of the current user. The event is triggered when the user enters or leaves a given zone. The name of the zone is stored in the map, on a dedicated layer with the `zone` property.
|
||||||
|
|
||||||
|
<div>
|
||||||
|
<figure class="figure">
|
||||||
|
<img src="https://workadventu.re/img/docs/trigger_event.png" class="figure-img img-fluid rounded" alt="" />
|
||||||
|
<figcaption class="figure-caption">The `zone` property, applied on a layer</figcaption>
|
||||||
|
</figure>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
* **name**: the name of the zone, as defined in the `zone` property.
|
||||||
|
* **callback**: the function that will be called when a user enters or leaves the zone.
|
||||||
|
|
||||||
|
Example:
|
||||||
|
|
||||||
|
```javascript
|
||||||
|
WA.onEnterZone('myZone', () => {
|
||||||
|
WA.sendChatMessage("Hello!", 'Mr Robot');
|
||||||
|
})
|
||||||
|
|
||||||
|
WA.onLeaveZone('myZone', () => {
|
||||||
|
WA.sendChatMessage("Goodbye!", 'Mr Robot');
|
||||||
|
})
|
||||||
|
```
|
||||||
|
|
||||||
|
### Opening a popup
|
||||||
|
|
||||||
|
In order to open a popup window, you must first define the position of the popup on your map.
|
||||||
|
|
||||||
|
You can position this popup by using a "rectangle" object in Tiled that you will place on an "object" layer.
|
||||||
|
|
||||||
|
<div class="row">
|
||||||
|
<div class="col">
|
||||||
|
<img src="https://workadventu.re/img/docs/screen_popup_tiled.png" class="figure-img img-fluid rounded" alt="" />
|
||||||
|
</div>
|
||||||
|
<div class="col">
|
||||||
|
<img src="https://workadventu.re/img/docs/screen_popup_in_game.png" class="figure-img img-fluid rounded" alt="" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
```
|
||||||
|
openPopup(targetObject: string, message: string, buttons: ButtonDescriptor[]): Popup
|
||||||
|
```
|
||||||
|
|
||||||
|
* **targetObject**: the name of the rectangle object defined in Tiled.
|
||||||
|
* **message**: the message to display in the popup.
|
||||||
|
* **buttons**: an array of action buttons defined underneath the popup.
|
||||||
|
|
||||||
|
Action buttons are `ButtonDescriptor` objects containing these properties.
|
||||||
|
|
||||||
|
* **label (_string_)**: The label of the button.
|
||||||
|
* **className (_string_)**: The visual type of the button. Can be one of "normal", "primary", "success", "warning", "error", "disabled".
|
||||||
|
* **callback (_(popup: Popup)=>void_)**: Callback called when the button is pressed.
|
||||||
|
|
||||||
|
Please note that `openPopup` returns an object of the `Popup` class. Also, the callback called when a button is clicked is passed a `Popup` object.
|
||||||
|
|
||||||
|
The `Popup` class that represents an open popup contains a single method: `close()`. This will obviously close the popup when called.
|
||||||
|
|
||||||
|
```javascript
|
||||||
|
class Popup {
|
||||||
|
/**
|
||||||
|
* Closes the popup
|
||||||
|
*/
|
||||||
|
close() {};
|
||||||
|
}
|
||||||
|
```
|
||||||
|
|
||||||
|
Example:
|
||||||
|
|
||||||
|
```javascript
|
||||||
|
let helloWorldPopup;
|
||||||
|
|
||||||
|
// Open the popup when we enter a given zone
|
||||||
|
helloWorldPopup = WA.onEnterZone('myZone', () => {
|
||||||
|
WA.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.onLeaveZone('myZone', () => {
|
||||||
|
helloWorldPopup.close();
|
||||||
|
});
|
||||||
|
```
|
||||||
|
|
||||||
|
### Disabling / restoring controls
|
||||||
|
|
||||||
|
```
|
||||||
|
disablePlayerControls(): void
|
||||||
|
restorePlayerControls(): void
|
||||||
|
```
|
||||||
|
|
||||||
|
These 2 methods can be used to completely disable player controls and to enable them again.
|
||||||
|
|
||||||
|
When controls are disabled, the user cannot move anymore using keyboard input. This can be useful in a "First Time User Experience" part, to display an important message to a user before letting him/her move again.
|
||||||
|
|
||||||
|
Example:
|
||||||
|
|
||||||
|
```javascript
|
||||||
|
WA.onEnterZone('myZone', () => {
|
||||||
|
WA.disablePlayerControls();
|
||||||
|
WA.openPopup("popupRectangle", 'This is an imporant message!', [{
|
||||||
|
label: "Got it!",
|
||||||
|
className: "primary",
|
||||||
|
callback: (popup) => {
|
||||||
|
WA.restorePlayerControls();
|
||||||
|
popup.close();
|
||||||
|
}
|
||||||
|
}]);
|
||||||
|
});
|
||||||
|
```
|
||||||
|
|
||||||
|
### Opening a web page in a new tab
|
||||||
|
|
||||||
|
```
|
||||||
|
openTab(url: string): void
|
||||||
|
```
|
||||||
|
|
||||||
|
Opens the webpage at "url" in your browser, in a new tab.
|
||||||
|
|
||||||
|
Example:
|
||||||
|
|
||||||
|
```javascript
|
||||||
|
WA.openTab('https://www.wikipedia.org/');
|
||||||
|
```
|
||||||
|
|
||||||
|
### Opening a web page in the current tab
|
||||||
|
|
||||||
|
```
|
||||||
|
goToPage(url: string): void
|
||||||
|
```
|
||||||
|
|
||||||
|
Opens the webpage at "url" in your browser in place of WorkAdventure. WorkAdventure will be completely unloaded.
|
||||||
|
|
||||||
|
Example:
|
||||||
|
|
||||||
|
```javascript
|
||||||
|
WA.goToPage('https://www.wikipedia.org/');
|
||||||
|
```
|
||||||
|
|
||||||
|
### Opening/closing a web page in an iFrame
|
||||||
|
|
||||||
|
```
|
||||||
|
openCoWebSite(url: string): void
|
||||||
|
closeCoWebSite(): void
|
||||||
|
```
|
||||||
|
|
||||||
|
Opens the webpage at "url" in an iFrame (on the right side of the screen) or close that iFrame.
|
||||||
|
|
||||||
|
Example:
|
||||||
|
|
||||||
|
```javascript
|
||||||
|
WA.openCoWebSite('https://www.wikipedia.org/');
|
||||||
|
// ...
|
||||||
|
WA.closeCoWebSite();
|
||||||
|
```
|
||||||
|
|
||||||
|
### Load a sound from an url
|
||||||
|
|
||||||
|
```
|
||||||
|
loadSound(url: string): Sound
|
||||||
|
```
|
||||||
|
|
||||||
|
Load a sound from an url
|
||||||
|
|
||||||
|
Please note that `loadSound` returns an object of the `Sound` class
|
||||||
|
|
||||||
|
The `Sound` class that represents a loaded sound contains two methods: `play(soundConfig : SoundConfig|undefined)` and `stop()`
|
||||||
|
|
||||||
|
The parameter soundConfig is optional, if you call play without a Sound config the sound will be played with the basic configuration.
|
||||||
|
|
||||||
|
Example:
|
||||||
|
|
||||||
|
```javascript
|
||||||
|
var mySound = WA.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();
|
||||||
|
```
|
@ -114,235 +114,4 @@ View the dedicated page about [using Typescript with the scripting API](using-ty
|
|||||||
|
|
||||||
## Available features in the client API
|
## Available features in the client API
|
||||||
|
|
||||||
### Sending a message in the chat
|
The list of available functions and features is [available in the API Reference page, with examples](api-reference).
|
||||||
|
|
||||||
sendChatMessage(message: string, author: string): void
|
|
||||||
|
|
||||||
Sends a message in the chat. The message is only visible in the browser of the current user.
|
|
||||||
|
|
||||||
* **message**: the message to be displayed in the chat
|
|
||||||
* **author**: the name displayed for the author of the message. It does not have to be a real user.
|
|
||||||
|
|
||||||
Example:
|
|
||||||
|
|
||||||
```javascript
|
|
||||||
WA.sendChatMessage('Hello world', 'Mr Robot');
|
|
||||||
```
|
|
||||||
|
|
||||||
### Listening to messages from the chat
|
|
||||||
|
|
||||||
```javascript
|
|
||||||
onChatMessage(callback: (message: string) => void): void
|
|
||||||
```
|
|
||||||
|
|
||||||
Listens to messages typed by the current user and calls the callback. Messages from other users in the chat cannot be listened to.
|
|
||||||
|
|
||||||
* **callback**: the function that will be called when a message is received. It contains the message typed by the user.
|
|
||||||
|
|
||||||
Example:
|
|
||||||
|
|
||||||
```javascript
|
|
||||||
WA.onChatMessage((message => {
|
|
||||||
console.log('The user typed a message', message);
|
|
||||||
}));
|
|
||||||
```
|
|
||||||
|
|
||||||
### Detecting when the user enters/leaves a zone
|
|
||||||
|
|
||||||
```
|
|
||||||
onEnterZone(name: string, callback: () => void): void
|
|
||||||
onLeaveZone(name: string, callback: () => void): void
|
|
||||||
```
|
|
||||||
|
|
||||||
Listens to the position of the current user. The event is triggered when the user enters or leaves a given zone. The name of the zone is stored in the map, on a dedicated layer with the `zone` property.
|
|
||||||
|
|
||||||
<div>
|
|
||||||
<figure class="figure">
|
|
||||||
<img src="https://workadventu.re/img/docs/trigger_event.png" class="figure-img img-fluid rounded" alt="" />
|
|
||||||
<figcaption class="figure-caption">The `zone` property, applied on a layer</figcaption>
|
|
||||||
</figure>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
* **name**: the name of the zone, as defined in the `zone` property.
|
|
||||||
* **callback**: the function that will be called when a user enters or leaves the zone.
|
|
||||||
|
|
||||||
Example:
|
|
||||||
|
|
||||||
```javascript
|
|
||||||
WA.onEnterZone('myZone', () => {
|
|
||||||
WA.sendChatMessage("Hello!", 'Mr Robot');
|
|
||||||
})
|
|
||||||
|
|
||||||
WA.onLeaveZone('myZone', () => {
|
|
||||||
WA.sendChatMessage("Goodbye!", 'Mr Robot');
|
|
||||||
})
|
|
||||||
```
|
|
||||||
|
|
||||||
### Opening a popup
|
|
||||||
|
|
||||||
In order to open a popup window, you must first define the position of the popup on your map.
|
|
||||||
|
|
||||||
You can position this popup by using a "rectangle" object in Tiled that you will place on an "object" layer.
|
|
||||||
|
|
||||||
<div class="row">
|
|
||||||
<div class="col">
|
|
||||||
<img src="https://workadventu.re/img/docs/screen_popup_tiled.png" class="figure-img img-fluid rounded" alt="" />
|
|
||||||
</div>
|
|
||||||
<div class="col">
|
|
||||||
<img src="https://workadventu.re/img/docs/screen_popup_in_game.png" class="figure-img img-fluid rounded" alt="" />
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
```
|
|
||||||
openPopup(targetObject: string, message: string, buttons: ButtonDescriptor[]): Popup
|
|
||||||
```
|
|
||||||
|
|
||||||
* **targetObject**: the name of the rectangle object defined in Tiled.
|
|
||||||
* **message**: the message to display in the popup.
|
|
||||||
* **buttons**: an array of action buttons defined underneath the popup.
|
|
||||||
|
|
||||||
Action buttons are `ButtonDescriptor` objects containing these properties.
|
|
||||||
|
|
||||||
* **label (_string_)**: The label of the button.
|
|
||||||
* **className (_string_)**: The visual type of the button. Can be one of "normal", "primary", "success", "warning", "error", "disabled".
|
|
||||||
* **callback (_(popup: Popup)=>void_)**: Callback called when the button is pressed.
|
|
||||||
|
|
||||||
Please note that `openPopup` returns an object of the `Popup` class. Also, the callback called when a button is clicked is passed a `Popup` object.
|
|
||||||
|
|
||||||
The `Popup` class that represents an open popup contains a single method: `close()`. This will obviously close the popup when called.
|
|
||||||
|
|
||||||
```javascript
|
|
||||||
class Popup {
|
|
||||||
/**
|
|
||||||
* Closes the popup
|
|
||||||
*/
|
|
||||||
close() {};
|
|
||||||
}
|
|
||||||
```
|
|
||||||
|
|
||||||
Example:
|
|
||||||
|
|
||||||
```javascript
|
|
||||||
let helloWorldPopup;
|
|
||||||
|
|
||||||
// Open the popup when we enter a given zone
|
|
||||||
helloWorldPopup = WA.onEnterZone('myZone', () => {
|
|
||||||
WA.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.onLeaveZone('myZone', () => {
|
|
||||||
helloWorldPopup.close();
|
|
||||||
});
|
|
||||||
```
|
|
||||||
|
|
||||||
### Disabling / restoring controls
|
|
||||||
|
|
||||||
```
|
|
||||||
disablePlayerControls(): void
|
|
||||||
restorePlayerControls(): void
|
|
||||||
```
|
|
||||||
|
|
||||||
These 2 methods can be used to completely disable player controls and to enable them again.
|
|
||||||
|
|
||||||
When controls are disabled, the user cannot move anymore using keyboard input. This can be useful in a "First Time User Experience" part, to display an important message to a user before letting him/her move again.
|
|
||||||
|
|
||||||
Example:
|
|
||||||
|
|
||||||
```javascript
|
|
||||||
WA.onEnterZone('myZone', () => {
|
|
||||||
WA.disablePlayerControls();
|
|
||||||
WA.openPopup("popupRectangle", 'This is an imporant message!', [{
|
|
||||||
label: "Got it!",
|
|
||||||
className: "primary",
|
|
||||||
callback: (popup) => {
|
|
||||||
WA.restorePlayerControls();
|
|
||||||
popup.close();
|
|
||||||
}
|
|
||||||
}]);
|
|
||||||
});
|
|
||||||
```
|
|
||||||
|
|
||||||
### Opening a web page in a new tab
|
|
||||||
|
|
||||||
```
|
|
||||||
openTab(url: string): void
|
|
||||||
```
|
|
||||||
|
|
||||||
Opens the webpage at "url" in your browser, in a new tab.
|
|
||||||
|
|
||||||
Example:
|
|
||||||
|
|
||||||
```javascript
|
|
||||||
WA.openTab('https://www.wikipedia.org/');
|
|
||||||
```
|
|
||||||
|
|
||||||
### Opening a web page in the current tab
|
|
||||||
|
|
||||||
```
|
|
||||||
goToPage(url: string): void
|
|
||||||
```
|
|
||||||
|
|
||||||
Opens the webpage at "url" in your browser in place of WorkAdventure. WorkAdventure will be completely unloaded.
|
|
||||||
|
|
||||||
Example:
|
|
||||||
|
|
||||||
```javascript
|
|
||||||
WA.goToPage('https://www.wikipedia.org/');
|
|
||||||
```
|
|
||||||
|
|
||||||
### Opening/closing a web page in an iFrame
|
|
||||||
|
|
||||||
```
|
|
||||||
openCoWebSite(url: string): void
|
|
||||||
closeCoWebSite(): void
|
|
||||||
```
|
|
||||||
|
|
||||||
Opens the webpage at "url" in an iFrame (on the right side of the screen) or close that iFrame.
|
|
||||||
|
|
||||||
Example:
|
|
||||||
|
|
||||||
```javascript
|
|
||||||
WA.openCoWebSite('https://www.wikipedia.org/');
|
|
||||||
// ...
|
|
||||||
WA.closeCoWebSite();
|
|
||||||
```
|
|
||||||
|
|
||||||
### Load a sound from an url
|
|
||||||
|
|
||||||
```
|
|
||||||
loadSound(url: string): Sound
|
|
||||||
```
|
|
||||||
|
|
||||||
Load a sound from an url
|
|
||||||
|
|
||||||
Please note that `loadSound` returns an object of the `Sound` class
|
|
||||||
|
|
||||||
The `Sound` class that represents a loaded sound contains two methods: `play(soundConfig : SoundConfig|undefined)` and `stop()`
|
|
||||||
|
|
||||||
The parameter soundConfig is optional, if you call play without a Sound config the sound will be played with the basic configuration.
|
|
||||||
|
|
||||||
Example:
|
|
||||||
|
|
||||||
```javascript
|
|
||||||
var mySound = WA.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();
|
|
||||||
```
|
|
||||||
|
@ -26,8 +26,8 @@ export type IframeEventMap = {
|
|||||||
goToPage: GoToPageEvent
|
goToPage: GoToPageEvent
|
||||||
openCoWebSite: OpenCoWebSiteEvent
|
openCoWebSite: OpenCoWebSiteEvent
|
||||||
closeCoWebSite: null
|
closeCoWebSite: null
|
||||||
disablePlayerControl: null
|
disablePlayerControls: null
|
||||||
restorePlayerControl: null
|
restorePlayerControls: null
|
||||||
displayBubble: null
|
displayBubble: null
|
||||||
removeBubble: null
|
removeBubble: null
|
||||||
showLayer: LayerEvent
|
showLayer: LayerEvent
|
||||||
|
@ -107,10 +107,10 @@ class IframeListener {
|
|||||||
else if (payload.type === 'closeCoWebSite') {
|
else if (payload.type === 'closeCoWebSite') {
|
||||||
scriptUtils.closeCoWebSite();
|
scriptUtils.closeCoWebSite();
|
||||||
}
|
}
|
||||||
else if (payload.type === 'disablePlayerControl') {
|
else if (payload.type === 'disablePlayerControls') {
|
||||||
this._disablePlayerControlStream.next();
|
this._disablePlayerControlStream.next();
|
||||||
}
|
}
|
||||||
else if (payload.type === 'restorePlayerControl') {
|
else if (payload.type === 'restorePlayerControls') {
|
||||||
this._enablePlayerControlStream.next();
|
this._enablePlayerControlStream.next();
|
||||||
}
|
}
|
||||||
else if (payload.type === 'displayBubble') {
|
else if (payload.type === 'displayBubble') {
|
||||||
|
@ -21,8 +21,8 @@ interface WorkAdventureApi {
|
|||||||
goToPage(url : string): void;
|
goToPage(url : string): void;
|
||||||
openCoWebSite(url : string): void;
|
openCoWebSite(url : string): void;
|
||||||
closeCoWebSite(): void;
|
closeCoWebSite(): void;
|
||||||
disablePlayerControl() : void;
|
disablePlayerControls() : void;
|
||||||
restorePlayerControl() : void;
|
restorePlayerControls() : void;
|
||||||
displayBubble() : void;
|
displayBubble() : void;
|
||||||
removeBubble() : void;
|
removeBubble() : void;
|
||||||
showLayer(layer: string) : void;
|
showLayer(layer: string) : void;
|
||||||
@ -107,12 +107,12 @@ window.WA = {
|
|||||||
} as LayerEvent
|
} as LayerEvent
|
||||||
}, '*');
|
}, '*');
|
||||||
},
|
},
|
||||||
disablePlayerControl(): void {
|
disablePlayerControls(): void {
|
||||||
window.parent.postMessage({ 'type': 'disablePlayerControl' }, '*');
|
window.parent.postMessage({ 'type': 'disablePlayerControls' }, '*');
|
||||||
},
|
},
|
||||||
|
|
||||||
restorePlayerControl(): void {
|
restorePlayerControls(): void {
|
||||||
window.parent.postMessage({ 'type': 'restorePlayerControl' }, '*');
|
window.parent.postMessage({ 'type': 'restorePlayerControls' }, '*');
|
||||||
},
|
},
|
||||||
|
|
||||||
displayBubble(): void {
|
displayBubble(): void {
|
||||||
|
@ -25,7 +25,7 @@ function launchTuto (){
|
|||||||
label: "Got it!",
|
label: "Got it!",
|
||||||
className : "success",callback:(popup2 => {
|
className : "success",callback:(popup2 => {
|
||||||
popup2.close();
|
popup2.close();
|
||||||
WA.restorePlayerControl();
|
WA.restorePlayerControls();
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
])
|
])
|
||||||
@ -36,7 +36,7 @@ function launchTuto (){
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
]);
|
]);
|
||||||
WA.disablePlayerControl();
|
WA.disablePlayerControls();
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -21,7 +21,7 @@ function launchTuto (){
|
|||||||
callback: (popup1) => {
|
callback: (popup1) => {
|
||||||
WA.sendChatMessage("Hey you can talk here too ! ", 'WA Guide');
|
WA.sendChatMessage("Hey you can talk here too ! ", 'WA Guide');
|
||||||
popup1.close();
|
popup1.close();
|
||||||
WA.restorePlayerControl();
|
WA.restorePlayerControls();
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -29,7 +29,7 @@ function launchTuto (){
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
]);
|
]);
|
||||||
WA.disablePlayerControl();
|
WA.disablePlayerControls();
|
||||||
|
|
||||||
}
|
}
|
||||||
WA.onChatMessage((message => {
|
WA.onChatMessage((message => {
|
||||||
|
Loading…
Reference in New Issue
Block a user