updated design and switched versions
This commit is contained in:
parent
a03405ac38
commit
0e3e7d7305
4
build.js
4
build.js
@ -16,10 +16,10 @@ const options = {
|
||||
buildDependenciesFromSource: true,
|
||||
|
||||
directories: {
|
||||
output: 'crunchyroll-downloader-output'
|
||||
output: 'crunchyroll-downloader-output-${version}'
|
||||
},
|
||||
win: {
|
||||
artifactName: 'crunchyd-Setup-${version}.${ext}',
|
||||
artifactName: 'crunchyroll-downloader-${version}-windows-installer.${ext}',
|
||||
icon: "public/favicon.ico",
|
||||
target: [
|
||||
{
|
||||
|
@ -1,22 +1,29 @@
|
||||
<template>
|
||||
<div class="fixed w-full flex flex-row bg-[#111111] h-16 z-10" style="-webkit-app-region: drag">
|
||||
<div class="w-full flex gap-10 flex-row items-center justify-center px-">
|
||||
<button @click="openAddAnime" class="px-6 py-0.5 border-2 border-[#ce6104] rounded-xl" style="-webkit-app-region: no-drag">
|
||||
<Icon name="ph:plus-bold" class="h-7 w-7 text-[#ce6104]" />
|
||||
</button>
|
||||
<button class="px-6 py-0.5 border-2 border-[#ce6104] rounded-xl" style="-webkit-app-region: no-drag">
|
||||
<Icon name="material-symbols:globe" class="h-7 w-7 text-[#ce6104]" />
|
||||
<div class="fixed w-full flex flex-row px-2 bg-[#11111189] h-14 z-10 border-[#383838] gap-1" style="-webkit-app-region: drag">
|
||||
<div class="w-full flex gap-10 flex-row items-center justify-center px-5">
|
||||
<button @click="openAddAnime" class="flex items-center justify-center px-2 py-2 gap-1 transition-all bg-[#ffffff16] hover:bg-[#ffffff25] rounded-lg select-none" style="-webkit-app-region: no-drag">
|
||||
<Icon name="ph:plus-bold" class="h-3.5 w-3.5 text-white" />
|
||||
<div class="text-[11px] text-white font-dm">
|
||||
ADD DOWNLOAD
|
||||
</div>
|
||||
</button>
|
||||
</div>
|
||||
<div class="w-full flex flex-row items-center justify-center">
|
||||
<div class="text-2xl text-white select-none">Crunchyroll Downloader</div>
|
||||
<img src="/logo.png" class="h-8">
|
||||
<div class="text-[10px] leading-[10px] text-opacity-90 text-white select-none">Crunchyroll <br> Downloader</div>
|
||||
</div>
|
||||
<div class="w-full flex gap-4 flex-row items-center justify-start px-5">
|
||||
<button class="px-6 py-0.5 border-2 border-[#ce6104] rounded-xl" style="-webkit-app-region: no-drag">
|
||||
<Icon name="iconamoon:playlist" class="h-7 w-7 text-[#ce6104]" />
|
||||
</button>
|
||||
<button @click="openSettings" class="px-6 py-0.5 border-2 border-[#ce6104] rounded-xl" style="-webkit-app-region: no-drag">
|
||||
<Icon name="ic:round-settings" class="h-7 w-7 text-[#ce6104]" />
|
||||
<div class="w-full flex gap-2 flex-row items-center justify-center">
|
||||
<!-- <button class="flex items-center justify-center px-2 py-2 gap-1 transition-all bg-[#ffffff16] hover:bg-[#ffffff25] rounded-lg select-none" style="-webkit-app-region: no-drag">
|
||||
<Icon name="iconamoon:playlist" class="h-3.5 w-3.5 text-white" />
|
||||
<div class="text-[11px] text-white font-dm">
|
||||
PLAYLIST
|
||||
</div>
|
||||
</button> -->
|
||||
<button class="flex items-center justify-center px-2 py-2 gap-1 transition-all bg-[#ffffff16] hover:bg-[#ffffff25] rounded-lg select-none mr-[5.5rem]" style="-webkit-app-region: no-drag">
|
||||
<Icon name="ic:round-settings" class="h-3.5 w-3.5 text-white" />
|
||||
<div class="text-[11px] text-white font-dm">
|
||||
SETTINGS
|
||||
</div>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
@ -61,5 +68,3 @@ async function openAddAnime() {
|
||||
})
|
||||
}
|
||||
</script>
|
||||
|
||||
<style></style>
|
||||
|
@ -5,6 +5,11 @@ export default defineNuxtConfig({
|
||||
shim: false
|
||||
},
|
||||
ssr: false,
|
||||
modules: ['@nuxtjs/tailwindcss', 'nuxt-icon'],
|
||||
|
||||
modules: ['@nuxtjs/tailwindcss', 'nuxt-icon', '@nuxtjs/google-fonts'],
|
||||
googleFonts: {
|
||||
families: {
|
||||
'DM+Sans': [600, '1000'],
|
||||
'Protest+Riot': true
|
||||
}
|
||||
}
|
||||
})
|
||||
|
@ -2,7 +2,7 @@
|
||||
"name": "crunchyroll-downloader",
|
||||
"author": "Stratum",
|
||||
"description": "Crunchyroll Downloader",
|
||||
"version": "1.0.2",
|
||||
"version": "1.0.3",
|
||||
"private": true,
|
||||
"main": ".output/src/electron/background.js",
|
||||
"scripts": {
|
||||
@ -17,11 +17,12 @@
|
||||
},
|
||||
"devDependencies": {
|
||||
"@nuxtjs/eslint-config-typescript": "^12.1.0",
|
||||
"@nuxtjs/google-fonts": "^3.2.0",
|
||||
"@nuxtjs/tailwindcss": "^6.12.0",
|
||||
"@types/express": "^4.17.21",
|
||||
"concurrently": "^8.2.2",
|
||||
"electron": "^23.3.13",
|
||||
"electron-builder": "^23.6.0",
|
||||
"electron": "^30.0.1",
|
||||
"electron-builder": "^24.13.3",
|
||||
"eslint": "^8.57.0",
|
||||
"eslint-config-prettier": "^8.10.0",
|
||||
"eslint-plugin-prettier": "^4.2.1",
|
||||
@ -35,6 +36,7 @@
|
||||
"wait-on": "^7.2.0"
|
||||
},
|
||||
"dependencies": {
|
||||
"7zip-bin": "^5.2.0",
|
||||
"@fastify/cors": "^9.0.1",
|
||||
"@pinia/nuxt": "^0.4.11",
|
||||
"@types/crypto-js": "^4.2.2",
|
||||
@ -60,6 +62,7 @@
|
||||
"uuid": "^9.0.1"
|
||||
},
|
||||
"build": {
|
||||
"extends": null,
|
||||
"asarUnpack": [
|
||||
"node_modules/ffmpeg-static/bin/${os}/${arch}/ffmpeg",
|
||||
"node_modules/ffmpeg-static/index.js",
|
||||
|
@ -1,10 +1,10 @@
|
||||
<template>
|
||||
<div class="h-screen overflow-hidden bg-[#111111] flex flex-col p-5 text-white" style="-webkit-app-region: drag">
|
||||
<div class="h-screen overflow-hidden bg-[#11111189] flex flex-col p-5 text-white font-dm" style="-webkit-app-region: drag">
|
||||
<div class="relative flex flex-row items-center justify-center">
|
||||
<button
|
||||
v-if="tab === 2"
|
||||
@click=";(tab = 1), (added = false), (CRselectedShow = null), (ADNselectedShow = null)"
|
||||
class="absolute left-0 bg-[#5c5b5b] py-1 px-3 rounded-xl flex flex-row items-center justify-center gap-0.5 hover:bg-[#4b4a4a] transition-all"
|
||||
class="absolute left-0 bg-[#5c5b5b9c] py-1.5 px-3 rounded-xl flex flex-row items-center justify-center gap-0.5 hover:bg-[#4b4a4a] transition-all text-sm"
|
||||
style="-webkit-app-region: no-drag"
|
||||
>
|
||||
<Icon name="formkit:arrowleft" class="h-5 w-5" />
|
||||
@ -14,7 +14,7 @@
|
||||
</div>
|
||||
<div v-if="tab === 1" class="flex flex-col mt-5 gap-3.5 h-full" style="-webkit-app-region: no-drag">
|
||||
<div class="relative flex flex-col">
|
||||
<select v-model="service" name="service" class="bg-[#5c5b5b] focus:outline-none px-3 py-2 rounded-xl text-sm text-center cursor-pointer">
|
||||
<select v-model="service" name="service" class="bg-[#5c5b5b] focus:outline-none px-3 py-3 rounded-xl text-sm text-center cursor-pointer">
|
||||
<option value="crunchyroll">Crunchyroll</option>
|
||||
<option value="adn">ADN</option>
|
||||
</select>
|
||||
@ -23,18 +23,16 @@
|
||||
<input
|
||||
v-model="search"
|
||||
@input="handleInputChange"
|
||||
type="search"
|
||||
name="search"
|
||||
placeholder="Search"
|
||||
class="bg-[#5c5b5b] focus:outline-none px-3 py-2 rounded-xl text-sm text-center"
|
||||
placeholder="SEARCH"
|
||||
class="bg-[#5c5b5b] focus:outline-none px-3 py-3 rounded-xl text-sm text-center"
|
||||
/>
|
||||
<div v-if="isFetchingResults" class="absolute top-full left-0 h-28 w-full bg-[#868585] rounded-xl z-10 flex items-center justify-center">
|
||||
<div class="absolute top-full left-0 h-28 w-full bg-[#868585] rounded-xl z-10 flex items-center justify-center transition-all duration-300" :class="isFetchingResults ? 'opacity-100' : 'opacity-0 pointer-events-none'">
|
||||
<Icon name="mdi:loading" class="h-8 w-8 animate-spin" />
|
||||
</div>
|
||||
<div
|
||||
v-if="searchActive"
|
||||
class="absolute top-full left-0 h-40 w-full bg-[#868585] rounded-xl overflow-y-scroll grid grid-cols-2 gap-3 p-2 z-10"
|
||||
class="absolute top-full left-0 h-40 w-full bg-[#868585] rounded-xl overflow-y-scroll grid grid-cols-2 gap-3 p-2 z-10 transition-all duration-300"
|
||||
style="-webkit-app-region: no-drag"
|
||||
:class="searchActive ? 'opacity-100' : 'opacity-0 pointer-events-none'"
|
||||
>
|
||||
<button v-for="result in crunchySearchResults" @click="selectShow(result)" class="flex flex-row gap-3 px-3 py-3 hover:bg-[#747474] rounded-xl">
|
||||
<div class="min-w-10 w-10 bg-gray-700">
|
||||
@ -62,7 +60,7 @@
|
||||
</div>
|
||||
</div>
|
||||
<div v-if="(isLoggedInCR && service === 'crunchyroll') || (isLoggedInADN && service === 'adn')" class="relative flex flex-col">
|
||||
<input v-model="url" type="text" name="text" placeholder="URL" class="bg-[#5c5b5b] focus:outline-none px-3 py-2 rounded-xl text-sm text-center" />
|
||||
<input v-model="url" type="text" name="text" placeholder="URL" class="bg-[#5c5b5b] focus:outline-none px-3 py-3 rounded-xl text-sm text-center" />
|
||||
</div>
|
||||
<div v-if="(isLoggedInCR && service === 'crunchyroll') || (isLoggedInADN && service === 'adn')" class="relative flex flex-col">
|
||||
<input
|
||||
@ -76,10 +74,10 @@
|
||||
/>
|
||||
</div>
|
||||
<div v-if="!isLoggedInCR && service === 'crunchyroll'" class="relative flex flex-col">
|
||||
<button @click="openCRLogin" class="bg-[#5c5b5b] focus:outline-none px-3 py-2 rounded-xl text-sm text-center cursor-pointer">Click to Login</button>
|
||||
<button @click="openCRLogin" class="bg-[#5c5b5b] focus:outline-none px-3 py-3 rounded-xl text-sm text-center cursor-pointer">Click to Login</button>
|
||||
</div>
|
||||
<div v-if="!isLoggedInADN && service === 'adn'" class="relative flex flex-col">
|
||||
<button @click="openADNLogin" class="bg-[#5c5b5b] focus:outline-none px-3 py-2 rounded-xl text-sm text-center cursor-pointer">Click to Login</button>
|
||||
<button @click="openADNLogin" class="bg-[#5c5b5b] focus:outline-none px-3 py-3 rounded-xl text-sm text-center cursor-pointer">Click to Login</button>
|
||||
</div>
|
||||
<div class="relative flex flex-col mt-auto">
|
||||
<button @click="switchToSeason" class="relative py-3 border-2 rounded-xl flex flex-row items-center justify-center">
|
||||
@ -788,4 +786,29 @@ const addToPlaylistADN = async () => {
|
||||
::-webkit-scrollbar {
|
||||
width: 8px;
|
||||
}
|
||||
|
||||
.font-dm {
|
||||
font-family: "DM Sans", sans-serif;
|
||||
}
|
||||
|
||||
.font-protest {
|
||||
font-family: "Protest Riot", sans-serif;
|
||||
font-weight: 400;
|
||||
font-style: normal;
|
||||
}
|
||||
|
||||
.font-dm-big {
|
||||
font-family: "DM Sans", sans-serif;
|
||||
font-weight: 1000;
|
||||
font-style: normal;
|
||||
}
|
||||
|
||||
select {
|
||||
background: url("data:image/svg+xml,<svg height='10px' width='10px' viewBox='0 0 16 16' fill='%23000000' xmlns='http://www.w3.org/2000/svg'><path d='M7.247 11.14 2.451 5.658C1.885 5.013 2.345 4 3.204 4h9.592a1 1 0 0 1 .753 1.659l-4.796 5.48a1 1 0 0 1-1.506 0z'/></svg>") no-repeat;
|
||||
background-position: calc(100% - 0.75rem) center !important;
|
||||
background-color: #5c5b5b;
|
||||
-moz-appearance:none !important;
|
||||
-webkit-appearance: none !important;
|
||||
appearance: none !important;
|
||||
}
|
||||
</style>
|
||||
|
@ -1,14 +1,14 @@
|
||||
<template>
|
||||
<div class="h-screen overflow-hidden bg-[#111111] flex flex-col p-5 text-white" style="-webkit-app-region: drag">
|
||||
<div class="h-screen overflow-hidden bg-[#11111189] flex flex-col p-5 text-white font-dm" style="-webkit-app-region: drag">
|
||||
<div class="relative flex flex-row items-center justify-center">
|
||||
<div class="text-2xl">ADN Login</div>
|
||||
</div>
|
||||
<div class="flex flex-col mt-5 gap-3.5 h-full" style="-webkit-app-region: no-drag">
|
||||
<div class="relative flex flex-col">
|
||||
<input v-model="username" type="text" name="text" placeholder="Email" class="bg-[#5c5b5b] focus:outline-none px-3 py-2 rounded-xl text-sm text-center" />
|
||||
<input v-model="username" type="text" name="text" placeholder="Email" class="bg-[#5c5b5b] focus:outline-none px-3 py-3 rounded-xl text-sm text-center" />
|
||||
</div>
|
||||
<div class="relative flex flex-col">
|
||||
<input v-model="password" type="password" name="text" placeholder="Password" class="bg-[#5c5b5b] focus:outline-none px-3 py-2 rounded-xl text-sm text-center" />
|
||||
<input v-model="password" type="password" name="text" placeholder="Password" class="bg-[#5c5b5b] focus:outline-none px-3 py-3 rounded-xl text-sm text-center" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="relative flex flex-col mt-auto">
|
||||
@ -56,4 +56,20 @@ const login = async () => {
|
||||
}
|
||||
</script>
|
||||
|
||||
<style></style>
|
||||
<style>
|
||||
.font-dm {
|
||||
font-family: "DM Sans", sans-serif;
|
||||
}
|
||||
|
||||
.font-protest {
|
||||
font-family: "Protest Riot", sans-serif;
|
||||
font-weight: 400;
|
||||
font-style: normal;
|
||||
}
|
||||
|
||||
.font-dm-big {
|
||||
font-family: "DM Sans", sans-serif;
|
||||
font-weight: 1000;
|
||||
font-style: normal;
|
||||
}
|
||||
</style>
|
||||
|
@ -1,14 +1,14 @@
|
||||
<template>
|
||||
<div class="h-screen overflow-hidden bg-[#111111] flex flex-col p-5 text-white" style="-webkit-app-region: drag">
|
||||
<div class="h-screen overflow-hidden bg-[#11111189] flex flex-col p-5 text-white font-dm" style="-webkit-app-region: drag">
|
||||
<div class="relative flex flex-row items-center justify-center">
|
||||
<div class="text-2xl">Crunchyroll Login</div>
|
||||
</div>
|
||||
<div class="flex flex-col mt-5 gap-3.5 h-full" style="-webkit-app-region: no-drag">
|
||||
<div class="relative flex flex-col">
|
||||
<input v-model="username" type="text" name="text" placeholder="Email" class="bg-[#5c5b5b] focus:outline-none px-3 py-2 rounded-xl text-sm text-center" />
|
||||
<input v-model="username" type="text" name="text" placeholder="Email" class="bg-[#5c5b5b] focus:outline-none px-3 py-3 rounded-xl text-sm text-center" />
|
||||
</div>
|
||||
<div class="relative flex flex-col">
|
||||
<input v-model="password" type="password" name="text" placeholder="Password" class="bg-[#5c5b5b] focus:outline-none px-3 py-2 rounded-xl text-sm text-center" />
|
||||
<input v-model="password" type="password" name="text" placeholder="Password" class="bg-[#5c5b5b] focus:outline-none px-3 py-3 rounded-xl text-sm text-center" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="relative flex flex-col mt-auto">
|
||||
@ -56,4 +56,20 @@ const login = async () => {
|
||||
}
|
||||
</script>
|
||||
|
||||
<style></style>
|
||||
<style>
|
||||
.font-dm {
|
||||
font-family: "DM Sans", sans-serif;
|
||||
}
|
||||
|
||||
.font-protest {
|
||||
font-family: "Protest Riot", sans-serif;
|
||||
font-weight: 400;
|
||||
font-style: normal;
|
||||
}
|
||||
|
||||
.font-dm-big {
|
||||
font-family: "DM Sans", sans-serif;
|
||||
font-weight: 1000;
|
||||
font-style: normal;
|
||||
}
|
||||
</style>
|
||||
|
116
pages/index.vue
116
pages/index.vue
@ -1,49 +1,62 @@
|
||||
<template>
|
||||
<div class="h-screen overflow-hidden">
|
||||
<MainHeader />
|
||||
<div class="flex flex-col text-white mt-16 overflow-y-scroll h-[calc(100vh-4rem)]">
|
||||
<div class="flex flex-col text-white gap-5 mt-14 p-5 overflow-y-scroll h-[calc(100vh-3.5rem)]">
|
||||
<!-- <button @click="deletePlaylist">
|
||||
Delete Playlist
|
||||
</button> -->
|
||||
<div v-for="p in playlist" class="flex flex-row gap-4 h-40 p-5 bg-[#636363] border-b-[1px] border-gray-400">
|
||||
<div v-if="p.service === 'CR'" class="flex min-w-52 w-52">
|
||||
<img :src="(p.media as CrunchyEpisode).images.thumbnail[0].find((p) => p.height === 1080)?.source" alt="Image" class="object-cover rounded-xl" />
|
||||
</div>
|
||||
<div v-if="p.service === 'ADN'" class="flex min-w-52 w-52">
|
||||
<img :src="(p.media as ADNEpisode).image2x" alt="Image" class="object-cover rounded-xl" />
|
||||
</div>
|
||||
<div class="flex flex-col w-full">
|
||||
<div class="flex flex-row">
|
||||
<div class="text-sm capitalize">
|
||||
{{ p.status }}
|
||||
<div v-for="p in playlist" class="relative flex flex-row gap-4 h-36 bg-[#63636383] rounded-xl font-dm overflow-hidden">
|
||||
<div class="absolute top-0 left-0 w-full h-full bg-[#a1a1a141] transition-all duration-300" :style="`width: calc((${p.partsdownloaded} / ${p.partsleft}) * 100%);`"></div>
|
||||
<div class="absolute h-full w-full flex flex-row gap-3 p-3.5">
|
||||
<div v-if="p.service === 'CR'" class="flex w-48 min-w-48">
|
||||
<img :src="(p.media as CrunchyEpisode).images.thumbnail[0].find((p) => p.height === 1080)?.source" alt="Image" class="object-cover rounded-lg" />
|
||||
</div>
|
||||
<div v-if="p.service === 'ADN'" class="flex min-w-52 w-52">
|
||||
<img :src="(p.media as ADNEpisode).image2x" alt="Image" class="object-cover rounded-lg" />
|
||||
</div>
|
||||
<div class="flex flex-col w-full">
|
||||
<div class="flex flex-row h-full">
|
||||
<div class="flex flex-col">
|
||||
<div v-if="p.status === 'waiting'" class="flex flex-row items-center justify-center gap-1 text-xs capitalize p-1.5 bg-[#866332] rounded-lg">
|
||||
<Icon name="mdi:clock" class="h-3.5 w-3.5 text-white" />
|
||||
{{ p.status }}
|
||||
</div>
|
||||
<div v-if="p.status === 'preparing'" class="flex flex-row items-center justify-center gap-1 text-xs capitalize p-1.5 bg-[#866332] rounded-lg">
|
||||
<Icon name="mdi:clock" class="h-3.5 w-3.5 text-white" />
|
||||
{{ p.status }}
|
||||
</div>
|
||||
<div v-if="p.status === 'downloading'" class="flex flex-row items-center justify-center gap-1 text-xs capitalize p-1.5 bg-[#60501b] rounded-lg">
|
||||
<Icon name="mdi:loading" class="h-3.5 w-3.5 text-white animate-spin" />
|
||||
{{ p.status }}
|
||||
</div>
|
||||
<div v-if="p.status === 'merging'" class="flex flex-row items-center justify-center gap-1 text-xs capitalize p-1.5 bg-[#866332] rounded-lg">
|
||||
<Icon name="mdi:loading" class="h-3.5 w-3.5 text-white animate-spin" />
|
||||
{{ p.status }}
|
||||
</div>
|
||||
<div v-if="p.status === 'completed'" class="flex flex-row items-center justify-center gap-1 text-xs capitalize p-1.5 bg-[#266326] rounded-lg">
|
||||
<Icon name="material-symbols:check" class="h-3.5 w-3.5 text-white" />
|
||||
{{ p.status }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="text-xs capitalize ml-auto">
|
||||
{{ p.service === 'CR' ? 'Crunchyroll' : 'ADN' }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="text-sm capitalize ml-auto">
|
||||
{{ p.service === 'CR' ? 'Crunchyroll' : 'ADN' }}
|
||||
<div v-if="p.service === 'CR'" class="text-base capitalize h-full flex items-center">
|
||||
{{ (p.media as CrunchyEpisode).series_title }} Season {{ (p.media as CrunchyEpisode).season_number }} Episode {{ (p.media as CrunchyEpisode).episode_number }}
|
||||
</div>
|
||||
<div v-if="p.service === 'ADN'" class="text-base capitalize h-full">
|
||||
{{ (p.media as ADNEpisode).show.title }} Season {{ (p.media as ADNEpisode).season ? (p.media as ADNEpisode).season : 1 }} Episode
|
||||
{{ (p.media as ADNEpisode).shortNumber }}
|
||||
</div>
|
||||
<div class="flex flex-row gap-2 h-full items-end">
|
||||
<div class="text-xs">{{ p.quality }}p</div>
|
||||
<div class="text-xs uppercase">{{ p.format }}</div>
|
||||
<div class="text-xs">Dubs: {{ p.dub.map((t) => t.name).join(', ') }}</div>
|
||||
<div class="text-xs">Subs: {{ p.sub.length !== 0 ? p.sub.map((t) => t.name).join(', ') : '-' }}</div>
|
||||
<div v-if="p.partsleft && p.status === 'downloading'" class="text-xs ml-auto">{{ p.partsdownloaded }}/{{ p.partsleft }}</div>
|
||||
<div v-if="p.downloadspeed && p.status === 'downloading'" class="text-xs">{{ p.downloadspeed }} MB/s</div>
|
||||
</div>
|
||||
</div>
|
||||
<div v-if="p.service === 'CR'" class="text-base capitalize">
|
||||
{{ (p.media as CrunchyEpisode).series_title }} Season {{ (p.media as CrunchyEpisode).season_number }} Episode {{ (p.media as CrunchyEpisode).episode_number }}
|
||||
</div>
|
||||
<div v-if="p.service === 'ADN'" class="text-base capitalize">
|
||||
{{ (p.media as ADNEpisode).show.title }} Season {{ (p.media as ADNEpisode).season ? (p.media as ADNEpisode).season : 1 }} Episode {{ (p.media as ADNEpisode).shortNumber }}
|
||||
</div>
|
||||
<div class="relative w-full min-h-5 bg-[#bdbbbb] mt-1 rounded">
|
||||
<div
|
||||
v-if="p.partsleft && p.status === 'downloading'"
|
||||
class="w-full h-full rounded bg-[#4e422d] transition-all duration-300"
|
||||
:style="`width: calc((${p.partsdownloaded} / ${p.partsleft}) * 100%);`"
|
||||
></div>
|
||||
<div v-if="p.status === 'completed'" class="w-full h-full rounded bg-[#79ff77] transition-all duration-300"></div>
|
||||
<div v-if="p.status === 'merging'" class="absolute top-0 w-20 h-full rounded bg-[#293129] transition-all duration-300 loading-a"></div>
|
||||
</div>
|
||||
<div class="flex h-full"> </div>
|
||||
<div class="flex flex-row gap-2 mt-2">
|
||||
<div class="text-sm">{{ p.quality }}p</div>
|
||||
<div class="text-sm uppercase">{{ p.format }}</div>
|
||||
<div class="text-sm">Dubs: {{ p.dub.map((t) => t.name).join(', ') }}</div>
|
||||
<div class="text-sm">Subs: {{ p.sub.length !== 0 ? p.sub.map((t) => t.name).join(', ') : '-' }}</div>
|
||||
<div v-if="p.partsleft && p.status === 'downloading'" class="text-sm ml-auto">{{ p.partsdownloaded }}/{{ p.partsleft }}</div>
|
||||
<div v-if="p.downloadspeed && p.status === 'downloading'" class="text-sm">{{ p.downloadspeed }} MB/s</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -124,13 +137,36 @@ onMounted(() => {
|
||||
})
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
<style>
|
||||
body {
|
||||
background: none;
|
||||
background-color: none;
|
||||
background: transparent;
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
.font-dm {
|
||||
font-family: 'DM Sans', sans-serif;
|
||||
}
|
||||
|
||||
.font-protest {
|
||||
font-family: 'Protest Riot', sans-serif;
|
||||
font-weight: 400;
|
||||
font-style: normal;
|
||||
}
|
||||
|
||||
.font-dm-big {
|
||||
font-family: 'DM Sans', sans-serif;
|
||||
font-weight: 1000;
|
||||
font-style: normal;
|
||||
}
|
||||
|
||||
.loading-a {
|
||||
animation: animation infinite 3s;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-track {
|
||||
background: #303030;
|
||||
background: #383838;
|
||||
}
|
||||
|
||||
/* Handle */
|
||||
|
512
pnpm-lock.yaml
512
pnpm-lock.yaml
File diff suppressed because it is too large
Load Diff
BIN
public/logo.png
Normal file
BIN
public/logo.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 34 KiB |
@ -24,7 +24,6 @@ function createWindow() {
|
||||
icon: __dirname + '/icon/favicon.ico',
|
||||
width: 950,
|
||||
height: 700,
|
||||
backgroundColor: '#111111',
|
||||
webPreferences: {
|
||||
devTools: true,
|
||||
nodeIntegration: true,
|
||||
@ -33,11 +32,15 @@ function createWindow() {
|
||||
},
|
||||
titleBarStyle: 'hidden',
|
||||
titleBarOverlay: {
|
||||
color: '#111111',
|
||||
color: 'rgba(0,0,0,0)',
|
||||
symbolColor: '#ffffff',
|
||||
height: 40
|
||||
height: 40,
|
||||
},
|
||||
resizable: false
|
||||
resizable: false,
|
||||
fullscreen: false,
|
||||
maximizable: false,
|
||||
vibrancy: 'fullscreen-ui',
|
||||
backgroundMaterial: 'acrylic',
|
||||
})
|
||||
|
||||
mainWindow.webContents.setWindowOpenHandler(() => {
|
||||
@ -58,11 +61,23 @@ function createWindow() {
|
||||
symbolColor: '#ffffff',
|
||||
height: 40
|
||||
},
|
||||
resizable: false
|
||||
resizable: false,
|
||||
fullscreen: false,
|
||||
maximizable: false,
|
||||
vibrancy: 'fullscreen-ui',
|
||||
backgroundMaterial: 'acrylic',
|
||||
}
|
||||
}
|
||||
})
|
||||
|
||||
mainWindow.on('blur', () => {
|
||||
mainWindow.setBackgroundColor('#00000000')
|
||||
})
|
||||
|
||||
mainWindow.on('focus', () => {
|
||||
mainWindow.setBackgroundColor('#00000000')
|
||||
})
|
||||
|
||||
// Lock app to single instance
|
||||
if (singleInstance(app, mainWindow)) return
|
||||
|
||||
@ -192,7 +207,6 @@ ipcMain.handle(
|
||||
url: string
|
||||
width: number
|
||||
height: number
|
||||
backgroundColor: string
|
||||
}
|
||||
) => {
|
||||
const mainWindow = new BrowserWindow({
|
||||
@ -200,7 +214,6 @@ ipcMain.handle(
|
||||
icon: __dirname + '/icon/favicon.ico',
|
||||
width: opt.width,
|
||||
height: opt.height,
|
||||
backgroundColor: opt.backgroundColor,
|
||||
webPreferences: {
|
||||
devTools: true,
|
||||
nodeIntegration: true,
|
||||
@ -209,11 +222,15 @@ ipcMain.handle(
|
||||
},
|
||||
titleBarStyle: 'hidden',
|
||||
titleBarOverlay: {
|
||||
color: '#111111',
|
||||
color: 'rgba(0,0,0,0)',
|
||||
symbolColor: '#ffffff',
|
||||
height: 40
|
||||
},
|
||||
resizable: false
|
||||
resizable: false,
|
||||
fullscreen: false,
|
||||
maximizable: false,
|
||||
vibrancy: 'fullscreen-ui',
|
||||
backgroundMaterial: 'acrylic',
|
||||
})
|
||||
|
||||
mainWindow.webContents.once('did-finish-load', () => {
|
||||
|
Reference in New Issue
Block a user