mirror of
https://github.com/ThaUnknown/miru.git
synced 2026-03-28 21:28:43 +00:00
fix: show toasts in fullscreen
fix: don't persist RSS search it was confusing for people where the search got disabled when they went to episodes and back
This commit is contained in:
ThaUnknown
parent
6e1cf2f8e7
commit
fda8fb3d2a
4 changed files with 165 additions and 163 deletions
|
|
@ -1,6 +1,6 @@
|
|||
{
|
||||
"name": "Miru",
|
||||
"version": "4.2.10",
|
||||
"version": "4.2.11",
|
||||
"author": "ThaUnknown_ <ThaUnknown@users.noreply.github.com>",
|
||||
"description": "Stream anime torrents, real-time with no waiting for downloads.",
|
||||
"main": "build/main.js",
|
||||
|
|
|
|||
|
|
@ -1,56 +1,56 @@
|
|||
<script context='module'>
|
||||
import { setContext } from 'svelte'
|
||||
import { writable } from 'svelte/store'
|
||||
import { alRequest } from '@/modules/anilist.js'
|
||||
|
||||
export const page = writable('home')
|
||||
export const view = writable(null)
|
||||
export async function handleAnime (anime) {
|
||||
view.set(null)
|
||||
view.set((await alRequest({ method: 'SearchIDSingle', id: anime })).data.Media)
|
||||
}
|
||||
window.IPC.on('open-anime', handleAnime)
|
||||
window.IPC.on('schedule', () => {
|
||||
page.set('schedule')
|
||||
})
|
||||
</script>
|
||||
|
||||
<script>
|
||||
import Sidebar from './components/Sidebar.svelte'
|
||||
import Router from './Router.svelte'
|
||||
import ViewAnime from './views/ViewAnime/ViewAnime.svelte'
|
||||
import RSSView from './views/RSSView.svelte'
|
||||
import Menubar from './components/Menubar.svelte'
|
||||
import IspBlock from './views/IspBlock.svelte'
|
||||
import { Toaster } from 'svelte-sonner'
|
||||
import Logout from './components/Logout.svelte'
|
||||
|
||||
setContext('view', view)
|
||||
</script>
|
||||
|
||||
<Toaster visibleToasts={3} position='top-right' theme='dark' richColors duration={10000} />
|
||||
<div class='page-wrapper with-sidebar with-transitions bg-dark' data-sidebar-type='overlayed-all'>
|
||||
<IspBlock />
|
||||
<Menubar bind:page={$page} />
|
||||
<ViewAnime />
|
||||
<Logout />
|
||||
<Sidebar bind:page={$page} />
|
||||
<div class='overflow-hidden content-wrapper h-full z-10'>
|
||||
<RSSView />
|
||||
<Router bind:page={$page} />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.content-wrapper {
|
||||
will-change: width;
|
||||
top: 0 !important;
|
||||
}
|
||||
|
||||
.page-wrapper > .content-wrapper {
|
||||
margin-left: var(--sidebar-minimised) !important;
|
||||
position: unset !important;
|
||||
width: calc(100% - var(--sidebar-minimised)) !important;
|
||||
transition: none !important;
|
||||
}
|
||||
</style>
|
||||
<script context='module'>
|
||||
import { setContext } from 'svelte'
|
||||
import { writable } from 'svelte/store'
|
||||
import { alRequest } from '@/modules/anilist.js'
|
||||
|
||||
export const page = writable('home')
|
||||
export const view = writable(null)
|
||||
export async function handleAnime (anime) {
|
||||
view.set(null)
|
||||
view.set((await alRequest({ method: 'SearchIDSingle', id: anime })).data.Media)
|
||||
}
|
||||
window.IPC.on('open-anime', handleAnime)
|
||||
window.IPC.on('schedule', () => {
|
||||
page.set('schedule')
|
||||
})
|
||||
</script>
|
||||
|
||||
<script>
|
||||
import Sidebar from './components/Sidebar.svelte'
|
||||
import Router from './Router.svelte'
|
||||
import ViewAnime from './views/ViewAnime/ViewAnime.svelte'
|
||||
import RSSView from './views/RSSView.svelte'
|
||||
import Menubar from './components/Menubar.svelte'
|
||||
import IspBlock from './views/IspBlock.svelte'
|
||||
import { Toaster } from 'svelte-sonner'
|
||||
import Logout from './components/Logout.svelte'
|
||||
|
||||
setContext('view', view)
|
||||
</script>
|
||||
|
||||
<div class='page-wrapper with-sidebar with-transitions bg-dark' data-sidebar-type='overlayed-all'>
|
||||
<IspBlock />
|
||||
<Menubar bind:page={$page} />
|
||||
<ViewAnime />
|
||||
<Logout />
|
||||
<Sidebar bind:page={$page} />
|
||||
<div class='overflow-hidden content-wrapper h-full z-10'>
|
||||
<Toaster visibleToasts={3} position='top-right' theme='dark' richColors duration={10000} />
|
||||
<RSSView />
|
||||
<Router bind:page={$page} />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.content-wrapper {
|
||||
will-change: width;
|
||||
top: 0 !important;
|
||||
}
|
||||
|
||||
.page-wrapper > .content-wrapper {
|
||||
margin-left: var(--sidebar-minimised) !important;
|
||||
position: unset !important;
|
||||
width: calc(100% - var(--sidebar-minimised)) !important;
|
||||
transition: none !important;
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -1,37 +1,37 @@
|
|||
<script>
|
||||
import { set } from './Settings.svelte'
|
||||
import { click } from '@/modules/click.js'
|
||||
let block = false
|
||||
|
||||
async function testConnection () {
|
||||
try {
|
||||
for (let i = 0; i < 2; ++i) {
|
||||
// fetch twice, sometimes it will go tru once if ISP is shitty
|
||||
await fetch(set.toshoURL + 'json?show=torrent&id=1')
|
||||
}
|
||||
block = false
|
||||
} catch (e) {
|
||||
console.error(e)
|
||||
block = true
|
||||
}
|
||||
}
|
||||
testConnection()
|
||||
</script>
|
||||
|
||||
{#if block}
|
||||
<div class='w-full h-full left-0 z-50 position-absolute content-wrapper bg-dark d-flex align-items-center justify-content-center flex-column'>
|
||||
<div>
|
||||
<h1 class='font-weight-bold'>Could not connect to Tosho!</h1>
|
||||
<div class='font-size-16'>This happens either because Tosho is down, or because your ISP blocks Tosho, the latter being more likely.</div>
|
||||
<div class='font-size-16'>Most features of Miru will not function correctly without being able to connect to Tosho.</div>
|
||||
<div class='font-size-16'>If you enable a VPN a restart might be required for it to take effect.</div>
|
||||
<!-- eslint-disable-next-line svelte/valid-compile -->
|
||||
<div class='font-size-16'>Visit <a class='text-primary pointer' use:click={() => { window.IPC.emit('open', 'https://thewiki.moe/tutorials/unblock/') }}>this guide</a> for a tutorial on how to bypass ISP blocks.</div>
|
||||
<div class='d-flex w-full mt-20 pt-20'>
|
||||
<button class='btn ml-auto mr-5' type='button' use:click={() => { block = false }}>I Understand</button>
|
||||
<button class='btn btn-primary mr-5' type='button' use:click={() => { window.IPC.emit('open', 'https://thewiki.moe/tutorials/unblock/') }}>Open Guide</button>
|
||||
<button class='btn btn-primary' type='button' use:click={testConnection}>Reconnect</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{/if}
|
||||
<script>
|
||||
import { set } from './Settings.svelte'
|
||||
import { click } from '@/modules/click.js'
|
||||
let block = false
|
||||
|
||||
async function testConnection () {
|
||||
try {
|
||||
for (let i = 0; i < 2; ++i) {
|
||||
// fetch twice, sometimes it will go tru once if ISP is shitty
|
||||
await fetch(set.toshoURL + 'json?show=torrent&id=1')
|
||||
}
|
||||
block = false
|
||||
} catch (e) {
|
||||
console.error(e)
|
||||
block = true
|
||||
}
|
||||
}
|
||||
testConnection()
|
||||
</script>
|
||||
|
||||
{#if block}
|
||||
<div class='w-full h-full left-0 z-50 position-absolute content-wrapper bg-dark d-flex align-items-center justify-content-center flex-column'>
|
||||
<div>
|
||||
<h1 class='font-weight-bold'>Could not connect to Tosho!</h1>
|
||||
<div class='font-size-16'>This happens either because Tosho is down, or because your ISP blocks Tosho, the latter being more likely.</div>
|
||||
<div class='font-size-16'>Most features of Miru will not function correctly without being able to connect to Tosho.</div>
|
||||
<div class='font-size-16'>If you enable a VPN a restart might be required for it to take effect.</div>
|
||||
<!-- eslint-disable-next-line svelte/valid-compile -->
|
||||
<div class='font-size-16'>Visit <a class='text-primary pointer' use:click={() => { window.IPC.emit('open', 'https://thewiki.moe/tutorials/unblock/') }}>this guide</a> for a tutorial on how to bypass ISP blocks.</div>
|
||||
<div class='d-flex w-full mt-20 pt-20'>
|
||||
<button class='btn ml-auto mr-5' type='button' on:click={() => { block = false }}>I Understand</button>
|
||||
<button class='btn btn-primary mr-5' type='button' on:click={() => { window.IPC.emit('open', 'https://thewiki.moe/tutorials/unblock/') }}>Open Guide</button>
|
||||
<button class='btn btn-primary' type='button' on:click={testConnection}>Reconnect</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{/if}
|
||||
|
|
|
|||
|
|
@ -1,69 +1,71 @@
|
|||
<script context='module'>
|
||||
import { writable } from 'simple-store-svelte'
|
||||
import Sections from '@/modules/sections.js'
|
||||
|
||||
export const search = writable({})
|
||||
|
||||
const items = writable([])
|
||||
</script>
|
||||
|
||||
<script>
|
||||
import Search, { searchCleanup } from '../components/Search.svelte'
|
||||
import Card from '../components/cards/Card.svelte'
|
||||
import { hasNextPage } from '@/modules/sections.js'
|
||||
import smoothScroll from '@/modules/scroll.js'
|
||||
import { debounce } from '@/modules/util.js'
|
||||
|
||||
let page = 0
|
||||
items.value = []
|
||||
hasNextPage.value = true
|
||||
|
||||
let key = {}
|
||||
|
||||
function loadSearchData () {
|
||||
const load = $search.load || Sections.createFallbackLoad()
|
||||
const nextData = load(++page, undefined, searchCleanup($search))
|
||||
$items = [...$items, ...nextData]
|
||||
return nextData[nextData.length - 1].data
|
||||
}
|
||||
const update = debounce(() => {
|
||||
page = 0
|
||||
items.value = []
|
||||
key = {}
|
||||
loadSearchData()
|
||||
}, 300)
|
||||
|
||||
let canScroll = true
|
||||
|
||||
async function loadTillFull (element) {
|
||||
canScroll = false
|
||||
while (hasNextPage.value && element.scrollHeight <= element.clientHeight) {
|
||||
await loadSearchData()
|
||||
}
|
||||
canScroll = true
|
||||
}
|
||||
|
||||
async function infiniteScroll () {
|
||||
if (canScroll && $hasNextPage && this.scrollTop + this.clientHeight > this.scrollHeight - 800) {
|
||||
canScroll = false
|
||||
await loadSearchData()
|
||||
canScroll = true
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<div class='h-full w-full overflow-y-scroll d-flex flex-wrap flex-row root overflow-x-hidden px-50 justify-content-center align-content-start' use:smoothScroll use:loadTillFull on:scroll={infiniteScroll}>
|
||||
<Search bind:search={$search} on:input={update} />
|
||||
{#key key}
|
||||
{#each $items as card}
|
||||
<Card {card} />
|
||||
{/each}
|
||||
{/key}
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.px-50 {
|
||||
padding-left: 5rem;
|
||||
padding-right: 5rem;
|
||||
}
|
||||
</style>
|
||||
<script context='module'>
|
||||
import { writable } from 'simple-store-svelte'
|
||||
import Sections from '@/modules/sections.js'
|
||||
|
||||
export const search = writable({})
|
||||
|
||||
const items = writable([])
|
||||
</script>
|
||||
|
||||
<script>
|
||||
import Search, { searchCleanup } from '../components/Search.svelte'
|
||||
import Card from '../components/cards/Card.svelte'
|
||||
import { hasNextPage } from '@/modules/sections.js'
|
||||
import smoothScroll from '@/modules/scroll.js'
|
||||
import { debounce } from '@/modules/util.js'
|
||||
|
||||
let page = 0
|
||||
items.value = []
|
||||
hasNextPage.value = true
|
||||
|
||||
let key = {}
|
||||
|
||||
function loadSearchData () {
|
||||
const load = $search.load || Sections.createFallbackLoad()
|
||||
const nextData = load(++page, undefined, searchCleanup($search))
|
||||
$items = [...$items, ...nextData]
|
||||
return nextData[nextData.length - 1].data
|
||||
}
|
||||
const update = debounce(() => {
|
||||
page = 0
|
||||
items.value = []
|
||||
key = {}
|
||||
loadSearchData()
|
||||
}, 300)
|
||||
|
||||
let canScroll = true
|
||||
|
||||
async function loadTillFull (element) {
|
||||
canScroll = false
|
||||
while (hasNextPage.value && element.scrollHeight <= element.clientHeight) {
|
||||
await loadSearchData()
|
||||
}
|
||||
canScroll = true
|
||||
}
|
||||
|
||||
async function infiniteScroll () {
|
||||
if (canScroll && $hasNextPage && this.scrollTop + this.clientHeight > this.scrollHeight - 800) {
|
||||
canScroll = false
|
||||
await loadSearchData()
|
||||
canScroll = true
|
||||
}
|
||||
}
|
||||
if ($search.clearNext) $search = {}
|
||||
if ($search.disableSearch) $search.clearNext = true
|
||||
</script>
|
||||
|
||||
<div class='h-full w-full overflow-y-scroll d-flex flex-wrap flex-row root overflow-x-hidden px-50 justify-content-center align-content-start' use:smoothScroll use:loadTillFull on:scroll={infiniteScroll}>
|
||||
<Search bind:search={$search} on:input={update} />
|
||||
{#key key}
|
||||
{#each $items as card}
|
||||
<Card {card} />
|
||||
{/each}
|
||||
{/key}
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.px-50 {
|
||||
padding-left: 5rem;
|
||||
padding-right: 5rem;
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
Loading…
Reference in a new issue