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

Impoved FloatingUI components and create a PickableFeature class

Browse Source
This commit is contained in:
Clément Pons
2025-08-13 17:39:58 +02:00
parent 4e5ea504ea
commit 72982a4ea9
10 changed files with 545 additions and 185 deletions
Download Patch File Download Diff File Expand all files Collapse all files

69
pages/character/manage.client.vue
View File

@@ -1,68 +1,29 @@
<script setup lang="ts">
import characterConfig from '#shared/character-config.json';
import { Icon } from '@iconify/vue/dist/iconify.js';
import { FeatureEditor } from '~/shared/feature.util';
import { confirm, fullblocker } from '~/shared/floating.util';
import { getID, ID_SIZE } from '~/shared/general.util';
import type { CharacterConfig, Feature } from '~/types/character';
import { HomebrewBuilder } from '~/shared/feature.util';
//@ts-ignore
const config = ref<CharacterConfig>(characterConfig);
const featureEditor = new FeatureEditor();
function copy()
{
navigator.clipboard.writeText(JSON.stringify(config.value));
}
definePageMeta({
guestsGoesTo: '/user/login',
});
function createFeature()
{
const feature: Feature = { id: getID(ID_SIZE), description: '', effect: [] };
const container = useTemplateRef('container');
featureEditor.edit(feature).then(feature => {
config.value.features[feature.id] = feature;
}).catch(() => {}).finally(() => {
setTimeout(popup.close, 150);
featureEditor.container.setAttribute('data-state', 'inactive');
});
const popup = fullblocker([featureEditor.container], {
priority: true, closeWhenOutside: false,
});
featureEditor.container.setAttribute('data-state', 'active');
}
function editFeature(id: string)
{
config.value.features[id] && featureEditor.edit(config.value.features[id]).then(feature => {
config.value.features[id] = feature;
}).catch(() => {}).finally(() => {
setTimeout(popup.close, 150);
featureEditor.container.setAttribute('data-state', 'inactive');
});
const popup = fullblocker([featureEditor.container], {
priority: true, closeWhenOutside: false,
});
featureEditor.container.setAttribute('data-state', 'active');
}
function deleteFeature(id: string)
{
confirm("Voulez vous vraiment supprimer cet effet ?").then(e => {
if(e)
onMounted(() => {
queueMicrotask(() => {
if(container.value)
{
const value = config.value;
delete value.features[id];
config.value = value;
const builder = new HomebrewBuilder(container.value);
}
});
}
})
</script>
<template>
<Head>
<Title>d[any] - Edition de données</Title>
</Head>
<TabsRoot class="flex flex-1 max-w-full flex-col gap-8 justify-start items-center px-8 w-full" default-value="features">
<div ref="container" class="flex flex-1 max-w-full flex-col gap-8 justify-start items-center px-8 w-full"></div>
<!-- <TabsRoot class="flex flex-1 max-w-full flex-col gap-8 justify-start items-center px-8 w-full" default-value="features">
<TabsList class="flex flex-row gap-4 self-center relative px-4">
<TabsIndicator class="absolute left-0 h-[3px] bottom-0 w-[--radix-tabs-indicator-size] translate-x-[--radix-tabs-indicator-position] transition-[width,transform] duration-300 bg-accent-blue"></TabsIndicator>
<TabsTrigger value="peoples" class="px-2 py-1 border-b border-transparent hover:border-accent-blue">Peuples ({{ config.peoples.length }})</TabsTrigger>
@@ -79,7 +40,9 @@ function deleteFeature(id: string)
<div class=""></div>
</TabsContent>
<TabsContent value="training" class="outline-none flex gap-4 flex-col overflow-hidden">
<div class=""></div>
<div class="">
</div>
</TabsContent>
<TabsContent value="abilities" class="outline-none flex gap-4 flex-col overflow-hidden">
<div class=""></div>
@@ -109,5 +72,5 @@ function deleteFeature(id: string)
</TabsContent>
</div>
</div>
</TabsRoot>
</TabsRoot> -->
</template>