iptv-org-mirror/iptv-org.github.io
1
0
Fork 0
mirror of https://github.com/iptv-org/iptv-org.github.io.git synced 2025-05-10 17:10:06 -04:00
Code Issues Projects Releases Packages Wiki Activity Actions

Add @sveltejs/svelte-virtual-list for ChannelGrid

Browse source
This commit is contained in:
Sam Leatherdale 2025-02-03 14:45:44 +11:00
parent 9aa907e060
commit 11da5bae32
5 changed files with 34 additions and 13 deletions
Download patch file Download diff file Expand all files Collapse all files

14
package-lock.json generated
View file

@ -10,6 +10,7 @@
"@freearhey/search-js": "^0.1.1",
"@sveltejs/adapter-static": "^2.0.1",
"@sveltejs/kit": "^1.7.1",
"@sveltejs/svelte-virtual-list": "^3.0.1",
"@tailwindcss/line-clamp": "^0.4.2",
"@zerodevx/svelte-json-view": "^1.0.2",
"autoprefixer": "^10.4.2",
@ -570,6 +571,13 @@
"vite": "^4.0.0"
}
},
"node_modules/@sveltejs/svelte-virtual-list": {
"version": "3.0.1",
"resolved": "https://registry.npmjs.org/@sveltejs/svelte-virtual-list/-/svelte-virtual-list-3.0.1.tgz",
"integrity": "sha512-aF9TptS7NKKS7/TqpsxQBSDJ9Q0XBYzBehCeIC5DzdMEgrJZpIYao9LRLnyyo6SVodpapm2B7FE/Lj+FSA5/SQ==",
"dev": true,
"license": "LIL"
},
"node_modules/@sveltejs/vite-plugin-svelte": {
"version": "2.5.2",
"resolved": "https://registry.npmjs.org/@sveltejs/vite-plugin-svelte/-/vite-plugin-svelte-2.5.2.tgz",
@ -2629,6 +2637,12 @@
"undici": "~5.26.2"
}
},
"@sveltejs/svelte-virtual-list": {
"version": "3.0.1",
"resolved": "https://registry.npmjs.org/@sveltejs/svelte-virtual-list/-/svelte-virtual-list-3.0.1.tgz",
"integrity": "sha512-aF9TptS7NKKS7/TqpsxQBSDJ9Q0XBYzBehCeIC5DzdMEgrJZpIYao9LRLnyyo6SVodpapm2B7FE/Lj+FSA5/SQ==",
"dev": true
},
"@sveltejs/vite-plugin-svelte": {
"version": "2.5.2",
"resolved": "https://registry.npmjs.org/@sveltejs/vite-plugin-svelte/-/vite-plugin-svelte-2.5.2.tgz",

5
package.json
View file

@ -13,6 +13,7 @@
"@freearhey/search-js": "^0.1.1",
"@sveltejs/adapter-static": "^2.0.1",
"@sveltejs/kit": "^1.7.1",
"@sveltejs/svelte-virtual-list": "^3.0.1",
"@tailwindcss/line-clamp": "^0.4.2",
"@zerodevx/svelte-json-view": "^1.0.2",
"autoprefixer": "^10.4.2",
@ -25,10 +26,10 @@
"svelte": "^3.44.0",
"svelte-simple-modal": "^1.3.1",
"svelte-sitemap": "^2.6.0",
"sveltejs-tippy": "^3.0.0",
"tailwind-scrollbar-hide": "^1.1.7",
"tailwindcss": "^3.2.7",
"transliteration": "^2.2.0",
"validator": "^13.11.0",
"sveltejs-tippy": "^3.0.0"
"validator": "^13.11.0"
}
}

7
src/components/ChannelGrid.svelte
View file

@ -1,4 +1,5 @@
<script>
import VirtualList from '@sveltejs/svelte-virtual-list'
import ChannelItem from './ChannelItem.svelte'
export let channels = []
@ -27,9 +28,9 @@
</div>
</div>
<div class="bg-white dark:bg-gray-800">
{#each channels as channel (channel.id)}
<ChannelItem bind:channel />
{/each}
<VirtualList height="80vh" items={channels} let:item>
<ChannelItem channel={item} />
</VirtualList>
</div>
</div>
</div>

16
src/components/ChannelItem.svelte
View file

@ -70,17 +70,17 @@
$: isDisabled = channel.streams === 0
</script>
{#if $downloadMode}
<div
transition:fade={{ duration: 200 }}
class="w-14 h-14 shrink-0 flex items-center absolute -left-14"
>
<Checkbox selected={isSelected} disabled={isDisabled} on:change={onCheckboxChange} />
</div>
{/if}
<div
class="border-b last:border-b-0 border-gray-200 dark:border-gray-700 hover:bg-gray-50 hover:dark:bg-gray-700 h-16 flex items-center relative"
>
{#if $downloadMode}
<div
transition:fade={{ duration: 200 }}
class="w-14 h-14 shrink-0 flex items-center"
>
<Checkbox selected={isSelected} disabled={isDisabled} on:change={onCheckboxChange} />
</div>
{/if}
<div class="px-4 sm:pl-10 sm:pr-16 w-36 sm:w-52 flex shrink-0 items-center justify-center">
<div class="inline-flex items-center justify-center whitespace-nowrap overflow-hidden">
{#if channel.logo}

5
yarn.lock
View file

@ -108,6 +108,11 @@
tiny-glob "^0.2.9"
undici "~5.26.2"
"@sveltejs/svelte-virtual-list@^3.0.1":
version "3.0.1"
resolved "https://registry.npmjs.org/@sveltejs/svelte-virtual-list/-/svelte-virtual-list-3.0.1.tgz"
integrity sha512-aF9TptS7NKKS7/TqpsxQBSDJ9Q0XBYzBehCeIC5DzdMEgrJZpIYao9LRLnyyo6SVodpapm2B7FE/Lj+FSA5/SQ==
"@sveltejs/vite-plugin-svelte-inspector@^1.0.4":
version "1.0.4"
resolved "https://registry.npmjs.org/@sveltejs/vite-plugin-svelte-inspector/-/vite-plugin-svelte-inspector-1.0.4.tgz"