+
(isHoveringArtwork = true)}
on:mouseleave={() => (isHoveringArtwork = false)}
>
-
-
-
-
+
+
+
+
{#if isLoading}
-
-
-
+
+ {$currentEpisode.title}
+
+
{#await srcPromise then src}
{/await}
- {$currentEpisode.title}
+ +
- {formatSeconds($currentTime, "HH:mm:ss")}
-
+
+ {formatSeconds($currentTime, "HH:mm:ss")}
+
+
+ {formatSeconds($duration - $currentTime, "HH:mm:ss")}
+
+
+
+
-
+
- {offBinding.playbackRate}x
-
-
-
-
+
\ No newline at end of file
diff --git a/src/ui/PodcastView/PlaylistCard.svelte b/src/ui/PodcastView/PlaylistCard.svelte
index 85eacd9..7cf9245 100644
--- a/src/ui/PodcastView/PlaylistCard.svelte
+++ b/src/ui/PodcastView/PlaylistCard.svelte
@@ -1,5 +1,5 @@
+
+
+
+
+
+ {/if}
+
+ Queue
+
+ {#if isTranscribing}
+
-
-
+
+ {:else if hasResumableTranscription}
+
+
+
+ Transcribing episode...
+ +
+
+
+
+
+
+ {progressPercent.toFixed(1)}%
+ {processingStatus}
+
+
+
+
+ {timeRemaining}
+
+
+ Processed:
+ {progressSize}
+
+
+
+
+ {:else if !hasExistingTranscript}
+
+ {/if}
+
+ Transcription was interrupted
+ +Queue
-
{#if playlists.length > 0}
- {#each playlists as playlist}
-
+ {#each playlists as playlist (playlist.name)}
+
{/if}
{#if feeds.length > 0}
- {#each feeds as feed}
-
+ {#each feeds as feed (feed.url)}
+
{:else}
-
+
{/if}
@@ -38,10 +43,40 @@
+
\ No newline at end of file
diff --git a/src/ui/PodcastView/PodcastGridCard.svelte b/src/ui/PodcastView/PodcastGridCard.svelte
index 77ce7c1..5377932 100644
--- a/src/ui/PodcastView/PodcastGridCard.svelte
+++ b/src/ui/PodcastView/PodcastGridCard.svelte
@@ -1,5 +1,5 @@
-
No saved podcasts.
+ {#if playlists.length > 0}
+ {#each playlists as playlist}
+
+
+
diff --git a/src/ui/PodcastView/PodcastView.svelte b/src/ui/PodcastView/PodcastView.svelte
index f9d04cb..99fa087 100644
--- a/src/ui/PodcastView/PodcastView.svelte
+++ b/src/ui/PodcastView/PodcastView.svelte
@@ -1,87 +1,123 @@
-
+
+ {/if}
+No saved podcasts.
+
+
{#if selectedFeed}
- {
- selectedFeed = null;
- displayedEpisodes = latestEpisodes;
- viewState.set(ViewState.EpisodeList);
- }}
+ on:click={handleBackFromFeed}
>
@@ -259,6 +302,8 @@
display: flex;
flex-direction: column;
height: 100%;
+ /* Enable GPU acceleration */
+ will-change: contents;
}
.go-back {
@@ -270,9 +315,18 @@
cursor: pointer;
margin-right: auto;
opacity: 0.75;
+ /* Remove default button styles */
+ background: none;
+ border: none;
+ color: inherit;
+ font: inherit;
+ text-align: left;
+ /* Optimize hover performance */
+ transition: opacity 0.15s ease;
+ will-change: opacity;
}
.go-back:hover {
opacity: 1;
}
-
+
\ No newline at end of file
diff --git a/src/ui/PodcastView/PodcastView_backup.svelte b/src/ui/PodcastView/PodcastView_backup.svelte
new file mode 100644
index 0000000..ab296f7
--- /dev/null
+++ b/src/ui/PodcastView/PodcastView_backup.svelte
@@ -0,0 +1,288 @@
+
+
+;
+}>();
+
+function getCacheKey(episode: Episode): string {
+ return `${episode.title}-${episode.podcastName}`;
+}
+
+function getEpisodeCachedState(episode: Episode) {
+ const cacheKey = getCacheKey(episode);
+ let cached = episodeLookupCache.get(cacheKey);
+
+ if (!cached) {
+ const playedEps = get(playedEpisodes);
+ const favs = get(favorites);
+ const q = get(queue);
+ const pls = get(playlists);
+
+ cached = {
+ isPlayed: Object.values(playedEps).some(e => e.title === episode.title && e.finished),
+ isFavorite: favs.episodes.some(e => e.title === episode.title),
+ isInQueue: q.episodes.some(e => e.title === episode.title),
+ playlists: new Set(
+ Object.entries(pls)
+ .filter(([_, playlist]) => playlist.episodes.some(e => e.title === episode.title))
+ .map(([name]) => name)
+ )
+ };
+
+ episodeLookupCache.set(cacheKey, cached);
+
+ // Clear cache after a short delay to handle rapid updates
+ setTimeout(() => episodeLookupCache.delete(cacheKey), 5000);
+ }
+
+ return cached;
+}
+
export default function spawnEpisodeContextMenu(
episode: Episode,
event: MouseEvent,
disabledMenuItems?: Partial
) {
const menu = new Menu();
+ const cachedState = getEpisodeCachedState(episode);
if (!disabledMenuItems?.play) {
menu.addItem(item => item
@@ -34,12 +77,12 @@ export default function spawnEpisodeContextMenu(
}
if (!disabledMenuItems?.markPlayed) {
- const episodeIsPlayed = Object.values(get(playedEpisodes)).find(e => (e.title === episode.title && e.finished));
menu.addItem(item => item
- .setIcon(episodeIsPlayed ? "cross" : "check")
- .setTitle(`Mark as ${episodeIsPlayed ? "Unplayed" : "Played"}`)
+ .setIcon(cachedState.isPlayed ? "cross" : "check")
+ .setTitle(`Mark as ${cachedState.isPlayed ? "Unplayed" : "Played"}`)
.onClick(() => {
- if (episodeIsPlayed) {
+ episodeLookupCache.delete(getCacheKey(episode)); // Invalidate cache
+ if (cachedState.isPlayed) {
playedEpisodes.markAsUnplayed(episode);
} else {
playedEpisodes.markAsPlayed(episode);
@@ -93,12 +136,12 @@ export default function spawnEpisodeContextMenu(
}
if (!disabledMenuItems?.favorite) {
- const episodeIsFavorite = get(favorites).episodes.find(e => e.title === episode.title);
menu.addItem(item => item
.setIcon("lucide-star")
- .setTitle(`${episodeIsFavorite ? "Remove from" : "Add to"} Favorites`)
+ .setTitle(`${cachedState.isFavorite ? "Remove from" : "Add to"} Favorites`)
.onClick(() => {
- if (episodeIsFavorite) {
+ episodeLookupCache.delete(getCacheKey(episode)); // Invalidate cache
+ if (cachedState.isFavorite) {
favorites.update(playlist => {
playlist.episodes = playlist.episodes.filter(e => e.title !== episode.title);
return playlist;
@@ -115,12 +158,12 @@ export default function spawnEpisodeContextMenu(
}
if (!disabledMenuItems?.queue) {
- const episodeIsInQueue = get(queue).episodes.find(e => e.title === episode.title);
menu.addItem(item => item
.setIcon("list-ordered")
- .setTitle(`${episodeIsInQueue ? "Remove from" : "Add to"} Queue`)
+ .setTitle(`${cachedState.isInQueue ? "Remove from" : "Add to"} Queue`)
.onClick(() => {
- if (episodeIsInQueue) {
+ episodeLookupCache.delete(getCacheKey(episode)); // Invalidate cache
+ if (cachedState.isInQueue) {
queue.update(playlist => {
playlist.episodes = playlist.episodes.filter(e => e.title !== episode.title);
@@ -142,12 +185,13 @@ export default function spawnEpisodeContextMenu(
const playlistsInStore = get(playlists);
for (const playlist of Object.values(playlistsInStore)) {
- const episodeIsInPlaylist = playlist.episodes.find(e => e.title === episode.title);
+ const episodeIsInPlaylist = cachedState.playlists.has(playlist.name);
menu.addItem(item => item
.setIcon(playlist.icon)
.setTitle(`${episodeIsInPlaylist ? "Remove from" : "Add to"} ${playlist.name}`)
.onClick(() => {
+ episodeLookupCache.delete(getCacheKey(episode)); // Invalidate cache
if (episodeIsInPlaylist) {
playlists.update(playlists => {
playlists[playlist.name].episodes = playlists[playlist.name].episodes.filter(e => e.title !== episode.title);
@@ -168,4 +212,4 @@ export default function spawnEpisodeContextMenu(
menu.showAtMouseEvent(event);
-}
+}
\ No newline at end of file
diff --git a/src/ui/common/Image.svelte b/src/ui/common/Image.svelte
index f0901a1..a67b027 100644
--- a/src/ui/common/Image.svelte
+++ b/src/ui/common/Image.svelte
@@ -4,49 +4,64 @@
export let src: string;
export let alt: string;
export let fadeIn: boolean = false;
- export let opacity: number = 0; // Falsey value so condition isn't triggered if not set.
+ export let opacity: number = 1;
export {_class as class};
let _class = "";
let loaded = false;
- let loading = true;
let failed = false;
const dispatcher = createEventDispatcher();
- function onClick(event: MouseEvent) {
+ function handleClick(event: MouseEvent) {
dispatcher("click", { event });
}
+
+ function handleLoad() {
+ loaded = true;
+ }
+
+ function handleError() {
+ failed = true;
+ dispatcher("error");
+ }
-{#if loading || loaded}
-
+
{/if}
+
\ No newline at end of file
diff --git a/src/ui/common/Image_backup.svelte b/src/ui/common/Image_backup.svelte
new file mode 100644
index 0000000..f0901a1
--- /dev/null
+++ b/src/ui/common/Image_backup.svelte
@@ -0,0 +1,52 @@
+
+
+{#if loading || loaded}
+
+
+
+ {#if selectedFeed}
+
+
+
+ {:else if $viewState === ViewState.PodcastGrid}
+
+
+
diff --git a/src/ui/PodcastView/index.ts b/src/ui/PodcastView/index.ts
index 3d8a458..3cd7306 100644
--- a/src/ui/PodcastView/index.ts
+++ b/src/ui/PodcastView/index.ts
@@ -1,4 +1,4 @@
-import { IPodNotes } from "../../types/IPodNotes";
+import type { IPodNotes } from "../../types/IPodNotes";
import { ItemView, WorkspaceLeaf } from "obsidian";
import { VIEW_TYPE } from "../../constants";
import PodcastView from './PodcastView.svelte';
diff --git a/src/ui/PodcastView/spawnEpisodeContextMenu.ts b/src/ui/PodcastView/spawnEpisodeContextMenu.ts
index 8811789..4eff977 100644
--- a/src/ui/PodcastView/spawnEpisodeContextMenu.ts
+++ b/src/ui/PodcastView/spawnEpisodeContextMenu.ts
@@ -2,7 +2,7 @@ import { Menu, Notice } from "obsidian";
import createPodcastNote, { getPodcastNote, openPodcastNote } from "src/createPodcastNote";
import downloadEpisodeWithProgessNotice from "src/downloadEpisode";
import { currentEpisode, downloadedEpisodes, favorites, playedEpisodes, playlists, plugin, queue, viewState } from "src/store";
-import { Episode } from "src/types/Episode";
+import type { Episode } from "src/types/Episode";
import { ViewState } from "src/types/ViewState";
import { get } from "svelte/store";
@@ -16,12 +16,55 @@ interface DisabledMenuItems {
playlists: boolean;
}
+// Cache episode lookups to avoid repeated searches
+const episodeLookupCache = new Map
+
+
- ![]()
onClick(e)}
- draggable="false"
- {src}
- {alt}
+{#if !failed}
+ ![]()
{loaded = true; loading = false;}}
- on:error={() => {failed = true; loading = false;}}
+ draggable="false"
+ style:opacity={fadeIn && !loaded ? 0 : opacity}
+ style:transition={fadeIn ? "opacity 0.2s ease-out" : "none"}
/>
-
-{:else if failed}
- Failed to load image
+
+ ![]()
onClick(e)}
+ draggable="false"
+ {src}
+ {alt}
+ class={_class}
+ style:opacity={opacity ? opacity : !fadeIn ? 1 : loaded ? 1 : 0}
+ style:transition={fadeIn ? "opacity 0.5s ease-out" : ""}
+ on:load={() => {loaded = true; loading = false;}}
+ on:error={() => {failed = true; loading = false;}}
+ />
+
+{:else if failed}
+