|
|
@ -10,7 +10,7 @@ We can do that by declaring a `<script context="module">` block. Code contained
|
|
|
|
|
|
|
|
|
|
|
|
```html
|
|
|
|
```html
|
|
|
|
<script context="module">
|
|
|
|
<script context="module">
|
|
|
|
const elements = new Set();
|
|
|
|
let currentPlayer;
|
|
|
|
</script>
|
|
|
|
</script>
|
|
|
|
```
|
|
|
|
```
|
|
|
|
|
|
|
|
|
|
|
@ -18,13 +18,12 @@ It's now possible for the components to 'talk' to each other without any state m
|
|
|
|
|
|
|
|
|
|
|
|
```js
|
|
|
|
```js
|
|
|
|
onMount(() => {
|
|
|
|
onMount(() => {
|
|
|
|
elements.add(audio);
|
|
|
|
currentPlayer = audio;
|
|
|
|
return () => elements.delete(audio);
|
|
|
|
return () => currentPlayer = null;
|
|
|
|
});
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
|
|
function stopOthers() {
|
|
|
|
function stopOthers() {
|
|
|
|
elements.forEach(element => {
|
|
|
|
if (currentPlayer !== audio) currentPlayer.pause();
|
|
|
|
if (element !== audio) element.pause();
|
|
|
|
currentPlayer = audio;
|
|
|
|
});
|
|
|
|
|
|
|
|
}
|
|
|
|
}
|
|
|
|
```
|
|
|
|
```
|
|
|
|