<script>
    import { selected_channels } from "../../store";
    import open_file from "../FileBrowser.svelte"
    let submit = () => {
        console.log($selected_channels);
        open_file();
    }
</script>


<label for="channel_input">Select channels to display</label>
<input type="text" class="text-dark" id="channel_input" placeholder='all; 1-5,17-94' bind:value={$selected_channels} />

<div class="text-center">
    <button type="button"
        class="text-white w-1/4 bg-blue-700 hover:bg-blue-800 focus:ring-4 focus:outline-none focus:ring-blue-300 font-medium rounded-lg text-sm items-center dark:bg-blue-600 dark:hover:bg-blue-700 dark:focus:ring-blue-800"
        on:click={submit}>
        Submit
    </button>
</div>

<style>
label {
    font-size: x-large;
}
#channel_input {
    padding-top: 5px;
}
button {
    margin-top: 5px;
}
</style>