Create download link
This commit is contained in:
parent
a712e9cb26
commit
f0fed89b97
2 changed files with 16 additions and 9 deletions
|
@ -5,6 +5,7 @@
|
||||||
let loading = $state(true);
|
let loading = $state(true);
|
||||||
let showModal = $state(false);
|
let showModal = $state(false);
|
||||||
let error = $state(false);
|
let error = $state(false);
|
||||||
|
let href = $state('');
|
||||||
|
|
||||||
const toggleModal = () => {
|
const toggleModal = () => {
|
||||||
showModal = !showModal;
|
showModal = !showModal;
|
||||||
|
@ -24,13 +25,7 @@
|
||||||
searchParams.append('link', link);
|
searchParams.append('link', link);
|
||||||
searchParams.append('format', format);
|
searchParams.append('format', format);
|
||||||
|
|
||||||
const response = await fetch(`/download?${searchParams.toString()}`);
|
href = `/download?${searchParams.toString()}`;
|
||||||
const file = window.URL.createObjectURL(await response.blob());
|
|
||||||
|
|
||||||
const anchor = document.createElement('a');
|
|
||||||
anchor.setAttribute('download', true);
|
|
||||||
anchor.href = file;
|
|
||||||
anchor.click();
|
|
||||||
};
|
};
|
||||||
|
|
||||||
$effect(() => {
|
$effect(() => {
|
||||||
|
@ -124,8 +119,12 @@
|
||||||
type="submit"
|
type="submit"
|
||||||
class="w-full rounded-lg border-4 border-pink-700 bg-pink-500 px-4 py-3 text-black transition hover:bg-pink-600 active:border-yellow-500"
|
class="w-full rounded-lg border-4 border-pink-700 bg-pink-500 px-4 py-3 text-black transition hover:bg-pink-600 active:border-yellow-500"
|
||||||
>
|
>
|
||||||
Start Download!
|
Create download link
|
||||||
</button>
|
</button>
|
||||||
|
|
||||||
|
{#if href}
|
||||||
|
<a class="download-link" {href}> Download </a>
|
||||||
|
{/if}
|
||||||
</form>
|
</form>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
@ -154,6 +153,15 @@
|
||||||
* {
|
* {
|
||||||
font-size: 12px;
|
font-size: 12px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.download-link {
|
||||||
|
margin: 0 auto;
|
||||||
|
padding: 5px;
|
||||||
|
display: block;
|
||||||
|
text-decoration: underline;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
.retro-radio {
|
.retro-radio {
|
||||||
appearance: none;
|
appearance: none;
|
||||||
background-color: #000;
|
background-color: #000;
|
||||||
|
|
|
@ -29,7 +29,6 @@ function streamYouTube(link: string, format: string): ReadableStream<Uint8Array>
|
||||||
'-o',
|
'-o',
|
||||||
'-',
|
'-',
|
||||||
format === 'mp3' ? '--embed-metadata' : '',
|
format === 'mp3' ? '--embed-metadata' : '',
|
||||||
format === 'mp3' ? '--embed-thumbnail' : '',
|
|
||||||
'--format',
|
'--format',
|
||||||
format === 'mp3' ? 'bestaudio' : 'best',
|
format === 'mp3' ? 'bestaudio' : 'best',
|
||||||
'--audio-format',
|
'--audio-format',
|
||||||
|
|
Loading…
Add table
Reference in a new issue