Ledda/djledda-web
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

update

Browse Source
This commit is contained in:
Daniel Ledda
2024-11-01 21:29:13 +01:00
parent 64640300dd
commit 20479958bd
17 changed files with 224 additions and 96 deletions
Download Patch File Download Diff File Expand all files Collapse all files

27
app/generative-energy/GECalculator.tsx
View File

@@ -17,17 +17,17 @@ export default defineComponent({
step: 0.1,
},
{
name: "Armour, Natural Dessicated Thyroid",
name: 'Natural Dessicated Thyroid ("Armour")',
mpg: 60,
unit: "mg",
},
{
name: 'Liothyronine (Triiodothyronine, "Cytomel/Cynomel", T3)',
name: 'Liothyronine (T3 - "Cytomel/Cynomel")',
mpg: MPG_T3_SYN,
unit: "mcg",
},
{
name: "Levothyroxine (Thyroxine, T4)",
name: "Levothyroxine (T4)",
mpg: MPG_T4_SYN,
unit: "mcg",
},
@@ -67,7 +67,7 @@ export default defineComponent({
{inputDefs.map((_) => (
<tr key={_.name}>
<td>
{_.name}
{_.name}{_.unit && (', ' + _.unit)}
</td>
<td class="right">
<div style="display: inline-block;">
@@ -86,20 +86,19 @@ export default defineComponent({
type="number"
/>
</div>
<span class="breathe">{_.unit}</span>
</td>
</tr>
))}
<tr>
<td colspan="2">
<strong>Compounded (T3 and T4, "Cynoplus")</strong>
<strong>Compounded (T3 and T4 - "Cynoplus")</strong>
</td>
</tr>
<tr class="ratios">
<td>
Desired Ratio (T3:T4)
</td>
<td class="right">
<td class="right ratio">
<div>
<input
value={t3Ratio.value}
@@ -110,8 +109,8 @@ export default defineComponent({
step="1"
type="number"
/>
</div>{" "}
:{" "}
</div>
<span class="separator"/>
<div>
<input
value={t4Ratio.value}
@@ -127,9 +126,9 @@ export default defineComponent({
</tr>
<tr class="synthetic">
<td>
Synthetic T3/T4 Combo
T3 mcg : T4 mcg
</td>
<td class="right">
<td class="right ratio">
<div>
<input
value={compounded.value.t3Syn}
@@ -143,8 +142,8 @@ export default defineComponent({
step="1"
type="number"
/>
</div>{" "}
:{" "}
</div>
<span class="separator"/>
<div>
<input
value={compounded.value.t4Syn}
@@ -169,7 +168,7 @@ export default defineComponent({
<p>
<ul>
<li>
1st November 2024: Migrated to new web framework and fixed some buggy input.
1st November 2024: Migrated to new web framework and fixed some buggy input/ugly styling.
</li>
<li>
13th March 2024: Removed the synthetic/pure distinction as it was confusing and

3
app/generative-energy/GEDeutsch.tsx
View File

@@ -64,8 +64,9 @@ export default defineComponent({
{rpArticles.value && rpArticles.value.map((_) => (
<li>
<RouterLink to={{ name: "GEDeutschArticle", params: { articleName: _.slug } }}>
{_.name}
{_.title}
</RouterLink>
{_.tags?.map(tag => <span class="tag">{tag}</span>)}
</li>
))}
</ul>

36
app/generative-energy/GEDeutschArticle.tsx
View File

@@ -1,7 +1,9 @@
import { createTextVNode, defineComponent, h, inject, onServerPrefetch, ref, type VNode, watchEffect } from "vue";
import { createTextVNode, computed, defineComponent, h, inject, onServerPrefetch, ref, type VNode, watchEffect } from "vue";
import { RouterLink } from "vue-router";
import useAsyncState from "@/useAsyncState.ts";
import useHead from "@/useHead.ts";
import DJEmail from "@/DJEmail.tsx";
import getDJAPI from "@/api.ts";
export default defineComponent({
name: "ge-deutsch-article",
@@ -23,25 +25,32 @@ export default defineComponent({
(innerHTML: string) => Object.assign(document.createElement("div"), { innerHTML }),
);
const title = ref("");
const { result: articleContent, stateIsReady } = useAsyncState(
"ge-deutsch-article-data",
async ({ hostUrl }) => {
const articleResponse = await fetch(`${hostUrl}/generative-energy/content/${props.articleName}.html`);
const result = await articleResponse.text();
title.value = result.split('<h1 lang="de">')[1].split("</h1>")[0];
return result;
},
);
const {
result: articleData,
stateIsReady: articleDataReady,
} = useAsyncState('article-data', ({hostUrl}) => getDJAPI(hostUrl, '/rp-articles'));
const articleMetadata = computed(() => articleData.value?.find(_ => _.slug === props.articleName));
const title = computed(() => {
return articleContent.value?.split('<h1 lang="de">')[1].split("</h1>")[0] ?? 'Artikel';
});
useHead({ title });
onServerPrefetch(() =>
new Promise<void>((res) => {
watchEffect(() => {
if (title.value !== "") {
console.log("resolve", title.value);
res();
}
});
@@ -59,7 +68,7 @@ export default defineComponent({
children.unshift(h("button", {
class: "swap",
onClick: (e) => {
e.target.parentElement.classList.toggle("swap");
(e.target as HTMLButtonElement).parentElement?.classList.toggle("swap");
},
}, "↻"));
}
@@ -71,7 +80,11 @@ export default defineComponent({
}
}
return h((node as Element).tagName, attrs, children);
if (el.tagName === "H1") {
return h("header", attrs, h("h1", {}, children));
} else {
return h((node as Element).tagName, attrs, children);
}
} else {
return createTextVNode(node.textContent ?? "");
}
@@ -85,7 +98,8 @@ export default defineComponent({
return <div>Artikel lädt...</div>;
}
await stateIsReady;
await Promise.all([stateIsReady, articleDataReady]);
console.log(articleMetadata.value);
return () => (
<div class="ge-article">
@@ -95,6 +109,12 @@ export default defineComponent({
Sprache auf <span>{currentLang.value === "en" ? "Deutsch" : "Englisch"}</span> umschalten
</button>
</div>
<p class="text-slab">
Bei dem untenstehenden Artikel handelt es sich um eine hobbymäßige, amateurhafte Übersetzung des
Artikels „{ title.value }“ von Ray Peat. Bei Ungenauigkeiten oder Fehlübersetzungen freue ich mich über <DJEmail>eine Mail</DJEmail>!
</p>
{ articleMetadata.value?.tags?.includes('in-arbeit') && <h5 class="baustelle">🚧 Bitte beachte, dass diese Übersetzung noch in Arbeit und darum nicht fertig ist! 🚧</h5> }
<hr />
<article class={`lang-${currentLang.value}`}>
<ArticleContentTransformed />
</article>

15
app/generative-energy/GEMain.tsx
View File

@@ -1,5 +1,6 @@
import { RouterLink } from "vue-router";
import useHead from "@/useHead.ts";
import DJTooltip from "@/DJTooltip.tsx";
export default {
name: "ge-main",
@@ -20,16 +21,14 @@ export default {
<h2>Links</h2>
<ul>
<li>
<RouterLink to={{ name: "GECalculator" }}>Thyroid Calculator</RouterLink>
<span style="display: none" class="tooltip">
Convert to and from grains, set ratios, etc.
</span>
<DJTooltip tooltip="Convert to and from grains, set ratios, etc.">
<RouterLink to={{ name: "GECalculator" }}>Thyroid Calculator</RouterLink>
</DJTooltip>
</li>
<li>
<RouterLink to={{ name: "GEDeutsch" }}>Ray Peat Articles in German</RouterLink>
<span style="display: none" class="tooltip">
A selection of articles by Ray that I have translated in my spare time into German.
</span>
<DJTooltip tooltip="A selection of articles by Ray that I have translated in my spare time into German.">
<RouterLink to={{ name: "GEDeutsch" }}>Ray Peat Articles in German</RouterLink>
</DJTooltip>
</li>
</ul>
</div>

6
app/generative-energy/GERoot.tsx
View File

@@ -1,4 +1,4 @@
import { defineComponent, Suspense, type VNode } from "vue";
import { defineComponent, ref, Suspense, type VNode } from "vue";
import { type RouteRecordRaw, RouterLink, RouterView, useRoute } from "vue-router";
import GEMain from "@/generative-energy/GEMain.tsx";
import DJEmail from "@/DJEmail.tsx";
@@ -6,6 +6,7 @@ import GEDeutsch from "@/generative-energy/GEDeutsch.tsx";
import GEDeutschArticle from "@/generative-energy/GEDeutschArticle.tsx";
import GECalculator from "@/generative-energy/GECalculator.tsx";
import DJDonate from "@/DJDonate.tsx";
import { setupTooltip } from "@/DJTooltip.tsx";
export const routes: RouteRecordRaw[] = [
{
@@ -41,8 +42,11 @@ export default defineComponent({
name: "ge-root",
setup() {
const route = useRoute();
const carrier = ref<HTMLDivElement | null>(null);
setupTooltip({ carrier });
return () => (
<>
<div ref={carrier} class="tooltip-carrier" />
<main>
<RouterLink class={"home-btn" + (route.name === "GEMain" ? " hide" : "")} to={{ name: "GEMain" }}>
Generative Energy Home

2
app/generative-energy/client.ts
View File

@@ -1,8 +1,10 @@
import { createSSRApp } from "vue";
import { createRouter, createWebHistory } from "vue-router";
import GERoot, { routes } from "@/generative-energy/GERoot.tsx";
import { cssRegistry } from "@/util.ts";
createSSRApp(GERoot)
.provide(cssRegistry, new Set())
.use(createRouter({
routes,
history: createWebHistory("/generative-energy"),