<script lang="ts">
	import Speaker from '../speaker.svelte';
	import frontLeftUrl from '@assets/audio/5.1/Front_Left.mp3';
	import frontCenterUrl from '@assets/audio/5.1/Front_Center.mp3';
	import frontRightUrl from '@assets/audio/5.1/Front_Right.mp3';
	import rearLeftUrl from '@assets/audio/5.1/Rear_Left.mp3';
	import rearRightUrl from '@assets/audio/5.1/Rear_Right.mp3';
	import LfeUrl from '@assets/audio/5.1/LFE_Noise.mp3';
</script>

<div class="row">
	<Speaker src={frontLeftUrl} left>Front Left</Speaker>
	<div class="center">
		<Speaker src={frontCenterUrl} center>Front Center</Speaker>
	</div>
	<Speaker src={frontRightUrl} right>Front Right</Speaker>
</div>
<div class="row">
	<Speaker src={rearLeftUrl} left>Rear Left</Speaker>
	<Speaker src={rearRightUrl} right>Rear Right</Speaker>
</div>
<Speaker src={LfeUrl} lfe>LFE</Speaker>

<div class="label">5.1</div>
