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-12 18:10:06 -04:00
Code Issues Projects Releases Packages Wiki Activity Actions

Removes JSON preview

Browse source
This commit is contained in:
Arhey 2023-02-17 14:54:19 +03:00
parent 1cafbccc9e
commit 309fa25d35
2 changed files with 74 additions and 113 deletions
Download patch file Download diff file Expand all files Collapse all files

53
src/components/ChannelPopup.svelte
View file

@ -1,58 +1,23 @@
<script> <script>
import JsonDataViewer from './JsonDataViewer.svelte' import HTMLPreview from '~/components/HTMLPreview.svelte'
import HTMLPreview from './HTMLPreview.svelte'
import { getContext } from 'svelte' import { getContext } from 'svelte'
const { close } = getContext('simple-modal') const { close } = getContext('simple-modal')
export let channel export let channel
let view = 'html'
function switchView(value) {
view = value
}
const closePopup = () => { const closePopup = () => {
close() close()
} }
</script> </script>
<style> <div class="relative px-2 py-[4rem] flex justify-center" on:keypress on:click|self="{closePopup}">
.active { <div class="relative bg-white rounded-md shadow dark:bg-gray-800 w-full max-w-[820px]">
background-color: #f3f4f6;
color: #111828;
}
</style>
<div class="relative px-2 py-[4rem] flex justify-center" on:click|self="{closePopup}">
<div class="relative bg-white rounded-md shadow dark:bg-gray-800 w-full max-w-4xl">
<div <div
class="flex justify-between items-center py-4 pl-5 pr-4 rounded-t border-b dark:border-gray-700" class="flex justify-between items-center py-4 pl-5 pr-4 rounded-t border-b dark:border-gray-700"
> >
<div class="w-1/3 overflow-hidden"> <div class="w-2/3 overflow-hidden">
<h3 class="text-l font-medium text-gray-900 dark:text-white">{channel.name}</h3> <h3 class="text-l font-medium text-gray-900 dark:text-white">{channel.name}</h3>
</div> </div>
<div class="inline-flex justify-center w-1/3">
<div class="inline-flex rounded-md" role="group">
<button
type="button"
area-selected="{view === 'html'}"
on:click="{() => switchView('html')}"
class:active="{view === 'html'}"
class="py-2 px-4 text-xs font-medium text-gray-900 bg-white rounded-l-lg border border-gray-200 hover:bg-gray-100 dark:border-gray-700 dark:bg-transparent dark:text-white dark:hover:text-white dark:hover:bg-gray-600"
>
HTML
</button>
<button
type="button"
area-selected="{view === 'html'}"
on:click="{() => switchView('json')}"
class:active="{view === 'json'}"
class="py-2 px-4 text-xs font-medium text-gray-900 bg-white border-t border-b border-r rounded-r-lg border-gray-200 hover:bg-gray-100 dark:bg-transparent dark:border-gray-700 dark:text-white dark:hover:text-white dark:hover:bg-gray-600"
>
JSON
</button>
</div>
</div>
<div class="inline-flex w-1/3 justify-end"> <div class="inline-flex w-1/3 justify-end">
<button <button
@ -76,15 +41,9 @@
</div> </div>
</div> </div>
<div class="overflow-y-scroll overflow-x-hidden w-full"> <div class="overflow-y-scroll overflow-x-hidden w-full">
{#if view === 'json'} <div class="p-12 pt-10">
<div class="pb-8 px-8 pt-6">
<div class="flex p-4 bg-gray-50 dark:bg-gray-700 rounded-md w-full">
<JsonDataViewer data="{channel._raw}" />
</div>
</div>
{:else if view === 'html'}
<HTMLPreview data="{channel}" close="{closePopup}" /> <HTMLPreview data="{channel}" close="{closePopup}" />
{/if} </div>
</div> </div>
</div> </div>
</div> </div>

2
src/components/JsonDataViewer.svelte
View file

@ -40,6 +40,7 @@
--leafStringColor: white; --leafStringColor: white;
--leafNumberColor: white; --leafNumberColor: white;
--leafBooleanColor: white; --leafBooleanColor: white;
--jsonValStringColor: white;
--nodeColor: white; --nodeColor: white;
} }
@ -49,6 +50,7 @@
--leafStringColor: #525a69; --leafStringColor: #525a69;
--leafNumberColor: #525a69; --leafNumberColor: #525a69;
--leafBooleanColor: #525a69; --leafBooleanColor: #525a69;
--jsonValStringColor: #525a69;
--nodeColor: #525a69; --nodeColor: #525a69;
} }