emojimenu, audiomanager

This commit is contained in:
_Bastler
2021-09-14 08:56:37 +02:00
parent cf69b3259a
commit 148540dafe
6 changed files with 59 additions and 36 deletions
+2 -1
View File
@@ -1,6 +1,7 @@
<script lang="typescript">
import MenuIcon from "./Menu/MenuIcon.svelte";
import {menuIconVisiblilityStore, menuVisiblilityStore} from "../Stores/MenuStore";
import {emoteMenuVisiblilityStore} from "../Stores/EmoteStore";
import {enableCameraSceneVisibilityStore} from "../Stores/MediaStore";
import CameraControls from "./CameraControls.svelte";
import MyCamera from "./MyCamera.svelte";
@@ -112,7 +113,7 @@
<Menu></Menu>
</div>
{/if}
{#if $gameOverlayVisibilityStore}
{#if $emoteMenuVisiblilityStore}
<div>
<EmoteMenu></EmoteMenu>
</div>
@@ -5,9 +5,9 @@
audioManagerFileStore,
audioManagerVolumeStore,
} from "../../Stores/AudioManagerStore";
import {get} from "svelte/store";
import type {Unsubscriber} from "svelte/store";
import {onDestroy,onMount} from "svelte";
import { get } from "svelte/store";
import type { Unsubscriber } from "svelte/store";
import { onDestroy, onMount } from "svelte";
let HTMLAudioPlayer: HTMLAudioElement;
let audioPlayerVolumeIcon: HTMLElement;
@@ -15,51 +15,45 @@
let unsubscriberFileStore: Unsubscriber | null = null;
let unsubscriberVolumeStore: Unsubscriber | null = null;
let volume: number=1;
let decreaseWhileTalking: boolean=true;
let volume: number = 1;
let decreaseWhileTalking: boolean = true;
onMount(() => {
volume = localUserStore.getAudioPlayerVolume();
audioManagerVolumeStore.setMuted(localUserStore.getAudioPlayerMuted());
setVolume();
changeVolume();
unsubscriberFileStore = audioManagerFileStore.subscribe(() =>{
unsubscriberFileStore = audioManagerFileStore.subscribe(() => {
HTMLAudioPlayer.pause();
HTMLAudioPlayer.loop=get(audioManagerVolumeStore).loop;
HTMLAudioPlayer.volume=get(audioManagerVolumeStore).volume;
HTMLAudioPlayer.muted=get(audioManagerVolumeStore).muted;
HTMLAudioPlayer.loop = get(audioManagerVolumeStore).loop;
HTMLAudioPlayer.volume = get(audioManagerVolumeStore).volume;
HTMLAudioPlayer.muted = get(audioManagerVolumeStore).muted;
HTMLAudioPlayer.play();
});
unsubscriberVolumeStore=audioManagerVolumeStore.subscribe((audioManager: audioManagerVolume) => {
const reduceVolume=audioManager.talking&&audioManager.decreaseWhileTalking;
if(reduceVolume&&!audioManager.volumeReduced) {
audioManager.volume*=0.5;
} else if(!reduceVolume&&audioManager.volumeReduced) {
audioManager.volume*=2.0;
unsubscriberVolumeStore = audioManagerVolumeStore.subscribe((audioManager: audioManagerVolume) => {
const reduceVolume = audioManager.talking && audioManager.decreaseWhileTalking;
if (reduceVolume && !audioManager.volumeReduced) {
audioManager.volume *= 0.5;
} else if (!reduceVolume && audioManager.volumeReduced) {
audioManager.volume *= 2.0;
}
audioManager.volumeReduced=reduceVolume;
HTMLAudioPlayer.volume=audioManager.volume;
HTMLAudioPlayer.muted=audioManager.muted;
HTMLAudioPlayer.loop=audioManager.loop;
audioManager.volumeReduced = reduceVolume;
HTMLAudioPlayer.volume = audioManager.volume;
HTMLAudioPlayer.muted = audioManager.muted;
HTMLAudioPlayer.loop = audioManager.loop;
})
})
onDestroy(() => {
if(unsubscriberFileStore) {
if (unsubscriberFileStore) {
unsubscriberFileStore();
}
if(unsubscriberVolumeStore) {
if (unsubscriberVolumeStore) {
unsubscriberVolumeStore();
}
})
function onMute() {
audioManagerVolumeStore.setMuted(!get(audioManagerVolumeStore).muted);
localUserStore.setAudioPlayerMuted(get(audioManagerVolumeStore).muted);
setVolume();
}
function setVolume() {
function changeVolume() {
if (get(audioManagerVolumeStore).muted) {
audioPlayerVolumeIcon.classList.add('muted');
audioPlayerVol.value = "0";
@@ -76,9 +70,22 @@
audioPlayerVolumeIcon.classList.remove('mid');
}
}
audioManagerVolumeStore.setVolume(volume)
localUserStore.setAudioPlayerVolume(get(audioManagerVolumeStore).volume);
}
function onMute() {
const muted = !get(audioManagerVolumeStore).muted;
audioManagerVolumeStore.setMuted(muted);
localUserStore.setAudioPlayerMuted(muted);
changeVolume();
}
function setVolume() {
volume = parseFloat(audioPlayerVol.value);
audioManagerVolumeStore.setVolume(volume);
localUserStore.setAudioPlayerVolume(volume);
audioManagerVolumeStore.setMuted(false);
localUserStore.setAudioPlayerMuted(false);
changeVolume();
}
function setDecrease() {
@@ -109,8 +116,7 @@
</g>
</svg>
</span>
<input type="range" min="0" max="1" step="0.025" bind:value={volume} bind:this={audioPlayerVol}
on:change={setVolume}>
<input type="range" min="0" max="1" step="0.025" bind:this={audioPlayerVol} on:change={setVolume}>
</div>
<div class="audio-manager-reduce-conversation">
<label>
@@ -136,7 +142,7 @@
margin-left: auto;
margin-right: auto;
background-color: rgb(0,0,0,0.5);
background-color: rgb(0, 0, 0, 0.5);
display: grid;
grid-template-rows: 50% 50%;
color: whitesmoke;
@@ -17,7 +17,7 @@
styleProperties: {
'--font': 'Press Start 2P'
},
showSearch : false
autoFocusSearch : false
});
picker.on("emoji", (selection) => {