Peaceultime/obsidian-visualiser
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

New useContent composable to store global navigation state. Fixes for Markdown and Canvas

Browse Source
This commit is contained in:
Peaceultime
2024-12-30 20:46:24 +01:00
parent 031a51c2fe
commit 9515132659
31 changed files with 320 additions and 220 deletions
Download Patch File Download Diff File Expand all files Collapse all files

49
components/prose/ProseA.vue
View File

@@ -1,16 +1,14 @@
<template>
<NuxtLink class="text-accent-blue inline-flex items-center"
:to="overview ? { name: 'explore-path', params: { path: overview.path }, hash: hash } : href" :class="class">
<HoverCard class="max-w-[600px] max-h-[600px] w-full overflow-auto z-[45]" :class="{'overflow-hidden !p-0': overview?.type === 'canvas'}" @open="load" :disabled="!overview">
<NuxtLink class="text-accent-blue inline-flex items-center" :to="overview ? { name: 'explore-path', params: { path: overview.path }, hash: hash } : href" :class="class">
<HoverCard nuxt-client class="max-w-[600px] max-h-[600px] w-full overflow-auto z-[45]" :class="{'overflow-hidden !p-0': overview?.type === 'canvas'}" :disabled="!overview">
<template #content>
<Loading v-if="loading" />
<MarkdownRenderer v-else-if="overview?.type === 'markdown'" class="px-10" :content="content!.content" :filter="hash.substring(1)" />
<Canvas v-else-if="overview?.type === 'canvas'" class="w-[600px] h-[600px] relative" :canvas="JSON.parse(content!.content)" />
<Markdown v-if="overview?.type === 'markdown'" class="!px-10" :path="pathname" :filter="hash.substring(1)" popover />
<template v-else-if="overview?.type === 'canvas'"><div class="w-[600px] h-[600px] relative"><Canvas :path="pathname" /></div></template>
</template>
<template #default>
<span>
<slot v-bind="$attrs"></slot>
<Icon class="w-4 h-4 inline-block" v-if="overview && overview.type !== 'markdown'" :icon="iconByType[overview.type]" />
</template>
</span>
</HoverCard>
</NuxtLink>
</template>
@@ -25,37 +23,8 @@ const { href } = defineProps<{
class?: string
}>();
const { hash, pathname, protocol } = parseURL(href);
const overview = ref<{
path: string;
owner: number;
title: string;
type: "file" | "folder" | "markdown" | "canvas";
navigable: boolean;
private: boolean;
order: number;
visit: number;
}>(), content = ref<{
content: string;
}>(), loading = ref(false), fetched = ref(false);
const { hash, pathname } = parseURL(href);
if(!!pathname && !protocol)
{
try {
overview.value = await $fetch(`/api/file/overview/${encodeURIComponent(pathname)}`);
} catch(e) {}
}
async function load()
{
if(fetched.value === true)
return;
fetched.value = true;
loading.value = true;
try {
content.value = await $fetch(`/api/file/content/${encodeURIComponent(pathname)}`);
} catch(e) { }
loading.value = false;
}
const { content } = useContent();
const overview = computed(() => content.value.find(e => e.path === pathname));
</script>