From e51300e850f75e869d96d25262a8c2bedfd80715 Mon Sep 17 00:00:00 2001 From: Alexis Faizeau Date: Mon, 7 Feb 2022 17:53:36 +0100 Subject: [PATCH] Add cowebsite percentWidth property to the documention --- docs/maps/api-nav.md | 27 ++++++++++++------------- docs/maps/images/icon_open_website.png | Bin 0 -> 7971 bytes docs/maps/opening-a-website.md | 7 +++++++ 3 files changed, 20 insertions(+), 14 deletions(-) create mode 100644 docs/maps/images/icon_open_website.png diff --git a/docs/maps/api-nav.md b/docs/maps/api-nav.md index 2743d1ad..8d9fe595 100644 --- a/docs/maps/api-nav.md +++ b/docs/maps/api-nav.md @@ -3,7 +3,7 @@ ### Opening a web page in a new tab -``` +```ts WA.nav.openTab(url: string): void ``` @@ -11,13 +11,13 @@ Opens the webpage at "url" in your browser, in a new tab. Example: -```javascript +```ts WA.nav.openTab('https://www.wikipedia.org/'); ``` ### Opening a web page in the current tab -``` +```ts WA.nav.goToPage(url: string): void ``` @@ -25,14 +25,13 @@ Opens the webpage at "url" in your browser in place of WorkAdventure. WorkAdvent Example: -```javascript +```ts WA.nav.goToPage('https://www.wikipedia.org/'); ``` ### Going to a different map from the script -``` - +```ts WA.nav.goToRoom(url: string): void ``` @@ -43,7 +42,7 @@ global urls: "/_/global/domain/path/map.json[#start-layer-name]" Example: -```javascript +```ts WA.nav.goToRoom("/@/tcm/workadventure/floor0") // workadventure urls WA.nav.goToRoom('../otherMap/map.json'); WA.nav.goToRoom("/_/global/.json#start-layer-2") @@ -51,25 +50,25 @@ WA.nav.goToRoom("/_/global/.json#start-layer-2") ### Opening/closing web page in Co-Websites -``` -WA.nav.openCoWebSite(url: string, allowApi: boolean = false, allowPolicy: string = "", position: number, closable: boolean, lazy: boolean): Promise +```ts +WA.nav.openCoWebSite(url: string, allowApi?: boolean = false, allowPolicy?: string = "", percentWidth?: number, position?: number, closable?: boolean, lazy?: boolean): Promise ``` -Opens the webpage at "url" in an iFrame (on the right side of the screen) or close that iFrame. `allowApi` allows the webpage to use the "IFrame API" and execute script (it is equivalent to putting the `openWebsiteAllowApi` property in the map). `allowPolicy` grants additional access rights to the iFrame. The `allowPolicy` parameter is turned into an [`allow` feature policy in the iFrame](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/iframe#attr-allow), position in whitch slot the web page will be open, closable allow to close the webpage also you need to close it by the api and lazy +Opens the webpage at "url" in an iFrame (on the right side of the screen) or close that iFrame. `allowApi` allows the webpage to use the "IFrame API" and execute script (it is equivalent to putting the `openWebsiteAllowApi` property in the map). `allowPolicy` grants additional access rights to the iFrame. The `allowPolicy` parameter is turned into an [`allow` feature policy in the iFrame](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/iframe#attr-allow),widthPercent define the width of the main cowebsite beetween the min size and the max size (70% of the viewport), position in whitch slot the web page will be open, closable allow to close the webpage also you need to close it by the api and lazy it's to add the cowebsite but don't load it. Example: -```javascript +```ts const coWebsite = await WA.nav.openCoWebSite('https://www.wikipedia.org/'); -const coWebsiteWorkAdventure = await WA.nav.openCoWebSite('https://workadventu.re/', true, "", 1, true, true); +const coWebsiteWorkAdventure = await WA.nav.openCoWebSite('https://workadventu.re/', true, "", 70, 1, true, true); // ... coWebsite.close(); ``` ### Get all Co-Websites -``` +```ts WA.nav.getCoWebSites(): Promise ``` @@ -77,6 +76,6 @@ Get all opened co-websites with their ids and positions. Example: -```javascript +```ts const coWebsites = await WA.nav.getCowebSites(); ``` diff --git a/docs/maps/images/icon_open_website.png b/docs/maps/images/icon_open_website.png new file mode 100644 index 0000000000000000000000000000000000000000..f3a505bd357feb3b4ea23b124bef0ed9977f6fe4 GIT binary patch literal 7971 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 literal 0 HcmV?d00001 diff --git a/docs/maps/opening-a-website.md b/docs/maps/opening-a-website.md index 64b19f1c..a84bde30 100644 --- a/docs/maps/opening-a-website.md +++ b/docs/maps/opening-a-website.md @@ -52,6 +52,13 @@ If you set `openWebsiteTrigger: onaction`, when the user walks on the layer, an If you set `openWebsiteTriggerMessage: your message action` you can edit alert message displayed. If is not defined, the default message displayed is 'Press on SPACE to open the web site'. +If you set `openWebsiteTrigger: onicon`, when the user walks on the layer, an icon will be displayed at the bottom of the screen: + +
+ +
The iFrame will only open if the user clicks on icon
+
+ ### Setting the iFrame "allow" attribute By default, iFrames have limited rights in browsers. For instance, they cannot put their content in fullscreen, they cannot start your webcam, etc...