Skip to content

Commit 273e7e8

Browse files
authored
Renaming button action bar methods + small changes (workadventure#2871)
Renaming `WA.ui.actionBar.addButtonActionBar` to `WA.ui.actionBar.addButton`. Also, fixing doc and removing "svelte-ignore" that is handled directly in the configuration.
1 parent 8cae003 commit 273e7e8

File tree

5 files changed

+14
-31
lines changed

5 files changed

+14
-31
lines changed

docs/maps/api-ui.md

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -375,10 +375,10 @@ If the user is in mobile definition, the modal will open in full screen:
375375
376376
## Action bar button API
377377
378-
### Add action bar
378+
### Add a button in the action bar
379379
380380
```ts
381-
WA.ui.actionBar.addButtonActionBar(id: sring, label: string, clickCallback: (buttonActionBar: AddButtonActionBar)): void
381+
WA.ui.actionBar.addButton(id: string, label: string, clickCallback: (buttonActionBar: AddButtonActionBar) => void): void
382382
```
383383
- id: the id of the button action bar defined.
384384
- label: the label to display in button action bar.
@@ -399,19 +399,19 @@ interface AddButtonActionBar{
399399
}
400400
```
401401
402-
### Remove action bar
402+
### Remove a button from the action bar
403403
```ts
404-
WA.ui.actionBar.removeButtonActionBar(id: string);
404+
WA.ui.actionBar.removeButton(id: string);
405405
```
406406
- id: the id of the button action bar previously defined.
407407
408408
### Example of action bar button
409409
```ts
410410
// Add action bar button 'Register'.
411-
WA.ui.actionBar.addButtonActionBar('register-btn', 'Regsiter', (event) => {
411+
WA.ui.actionBar.addButton('register-btn', 'Regsiter', (event) => {
412412
console.log('Button registered triggered', event);
413413
// When user click on the action bar button 'Register', we remove it.
414-
WA.ui.actionBar.removeButtonActionBar('register-btn');
414+
WA.ui.actionBar.removeButton('register-btn');
415415
});
416416
```
417417

maps/tests/MenuActionBar/addButtonActionBar.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -2,9 +2,9 @@ console.info('In ten seconds, the tuto modal will be launched')
22

33
function launchTuto(){
44
console.info('Lunch tuto');
5-
WA.ui.actionBar.addButtonActionBar('register-btn', 'Regsiter', (event) => {
5+
WA.ui.actionBar.addButton('register-btn', 'Register', (event) => {
66
console.log('Button registered triggered', event);
7-
WA.ui.actionBar.removeButtonActionBar('register-btn');
7+
WA.ui.actionBar.removeButton('register-btn');
88
});
99
}
1010

play/src/front/Api/Iframe/Ui/ButtonActionBar.ts

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -26,7 +26,7 @@ export class WorkAdventureButtonActionBarCommands extends IframeApiContribution<
2626
* @param label
2727
* @param callback
2828
*/
29-
addButtonActionBar(id: string, label: string, callback?: ButtonActionBarClickedCallback) {
29+
addButton(id: string, label: string, callback?: ButtonActionBarClickedCallback) {
3030
if (callback != undefined) this._callbacks.set(id, callback);
3131
sendToWorkadventure({
3232
type: "addButtonActionBar",
@@ -40,7 +40,7 @@ export class WorkAdventureButtonActionBarCommands extends IframeApiContribution<
4040
*
4141
* @param id
4242
*/
43-
removeButtonActionBar(id: string) {
43+
removeButton(id: string) {
4444
this._callbacks.delete(id);
4545
sendToWorkadventure({ type: "removeButtonActionBar", data: { id } });
4646
}

play/src/front/Components/ActionBar/ActionBar.svelte

Lines changed: 1 addition & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -376,8 +376,6 @@
376376
class:tw-translate-x-0={$bottomActionBarVisibilityStore}
377377
class:translate-right={!$bottomActionBarVisibilityStore}
378378
>
379-
<!-- svelte-ignore a11y-click-events-have-key-events -->
380-
<!-- svelte-ignore a11y-click-events-have-key-events -->
381379
<div
382380
class="tw-transition-all bottom-action-button"
383381
class:disabled={$followStateStore !== "off"}
@@ -390,7 +388,6 @@
390388
<img draggable="false" src={followImg} style="padding: 2px" alt="Toggle follow" />
391389
</button>
392390
</div>
393-
<!-- svelte-ignore a11y-click-events-have-key-events -->
394391

395392
<div
396393
class="tw-transition-all bottom-action-button"
@@ -418,8 +415,6 @@
418415
</button>
419416
</div>
420417

421-
<!-- svelte-ignore a11y-click-events-have-key-events -->
422-
<!-- svelte-ignore a11y-click-events-have-key-events -->
423418
<div
424419
class="tw-transition-all bottom-action-button"
425420
class:disabled={$currentPlayerGroupLockStateStore}
@@ -441,7 +436,6 @@
441436
{/if}
442437
</button>
443438
</div>
444-
<!-- svelte-ignore a11y-click-events-have-key-events -->
445439

446440
<div
447441
class="tw-transition-all bottom-action-button"
@@ -476,7 +470,6 @@
476470
<div class="bottom-action-section tw-flex tw-flex-initial">
477471
{#if !$inExternalServiceStore && !$silentStore && $proximityMeetingStore}
478472
{#if $myCameraStore}
479-
<!-- svelte-ignore a11y-click-events-have-key-events -->
480473
<div
481474
class="bottom-action-button tw-relative"
482475
on:click={() => analyticsClient.camera()}
@@ -525,8 +518,6 @@
525518
on:mouseleave={() => (cameraActive = false)}
526519
>
527520
{#each $cameraListStore as camera}
528-
<!-- svelte-ignore a11y-click-events-have-key-events -->
529-
<!-- svelte-ignore a11y-click-events-have-key-events -->
530521
<span
531522
class="wa-dropdown-item tw-flex"
532523
on:click|stopPropagation|preventDefault={() =>
@@ -544,7 +535,6 @@
544535
{/if}
545536

546537
{#if $myMicrophoneStore}
547-
<!-- svelte-ignore a11y-click-events-have-key-events -->
548538
<div
549539
class="bottom-action-button tw-relative"
550540
on:click={() => analyticsClient.microphone()}
@@ -591,7 +581,6 @@
591581
on:mouseleave={() => (microphoneActive = false)}
592582
>
593583
{#each $microphoneListStore as microphone}
594-
<!-- svelte-ignore a11y-click-events-have-key-events -->
595584
<span
596585
class="wa-dropdown-item"
597586
on:click|stopPropagation|preventDefault={() =>
@@ -609,7 +598,6 @@
609598
{/if}
610599
{/if}
611600

612-
<!-- svelte-ignore a11y-click-events-have-key-events -->
613601
<div
614602
on:click={() => analyticsClient.openedChat()}
615603
on:click={toggleChat}
@@ -641,7 +629,6 @@
641629
</span>
642630
{/if}
643631
</div>
644-
<!-- svelte-ignore a11y-click-events-have-key-events -->
645632
<div on:click={toggleEmojiPicker} class="bottom-action-button">
646633
<Tooltip text={$LL.actionbar.emoji()} />
647634

@@ -652,7 +639,6 @@
652639
</div>
653640

654641
<div class="bottom-action-section tw-flex tw-flex-initial">
655-
<!-- svelte-ignore a11y-click-events-have-key-events -->
656642
<div
657643
on:dragstart|preventDefault={noDrag}
658644
on:click={() => analyticsClient.openedMenu()}
@@ -666,7 +652,6 @@
666652
</button>
667653
</div>
668654
{#if gameManager.getCurrentGameScene().isMapEditorEnabled()}
669-
<!-- svelte-ignore a11y-click-events-have-key-events -->
670655
<div
671656
on:dragstart|preventDefault={noDrag}
672657
on:click={toggleMapEditorMode}
@@ -678,7 +663,6 @@
678663
</div>
679664
{/if}
680665
{#if $userHasAccessToBackOfficeStore}
681-
<!-- svelte-ignore a11y-click-events-have-key-events -->
682666
<div
683667
on:dragstart|preventDefault={noDrag}
684668
on:click={() => analyticsClient.openBackOffice()}
@@ -695,7 +679,6 @@
695679
</div>
696680

697681
{#if $inviteUserActivated}
698-
<!-- svelte-ignore a11y-click-events-have-key-events -->
699682
<div
700683
class="bottom-action-section tw-flex tw-flex-initial"
701684
in:fly={{}}
@@ -734,7 +717,6 @@
734717
{/if}
735718
-->
736719
{#each [...$additionnalButtonsMenu.values()] as button}
737-
<!-- svelte-ignore a11y-click-events-have-key-events -->
738720
<div
739721
class="bottom-action-section tw-flex tw-flex-initial"
740722
in:fly={{}}
@@ -819,6 +801,7 @@
819801
</div>
820802
</div>
821803
{/if}
804+
F
822805

823806
<style lang="scss">
824807
@import "../../style/breakpoints.scss";

tests/tests/buttonactionbar_script.spec.ts

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -14,8 +14,8 @@ test.describe('Button action bar', () => {
1414

1515
// Use script to add new button
1616
await evaluateScript(page, async () => {
17-
return WA.ui.actionBar.addButtonActionBar('register-btn', 'Regsiter', () => {
18-
WA.ui.actionBar.removeButtonActionBar('register-btn');
17+
return WA.ui.actionBar.addButton('register-btn', 'Register', () => {
18+
WA.ui.actionBar.removeButton('register-btn');
1919
});
2020
});
2121

@@ -25,4 +25,4 @@ test.describe('Button action bar', () => {
2525
// Check if the register button is hidden
2626
await page.locator("#register-btn").isHidden();
2727
});
28-
});
28+
});

0 commit comments

Comments
 (0)