feat: Adds view snapshot tests

This commit is contained in:
2026-01-28 10:26:59 -05:00
parent 30241fec60
commit 58023c4dbc
19 changed files with 4221 additions and 36 deletions

View File

@@ -0,0 +1,79 @@
<!DOCTYPE html>
<html lang="en">
<head>
<title>Duct Calc</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta content="ductcalc.com" name="og:site_name">
<meta content="Duct Calc" name="og:title">
<meta content="Duct sizing based on ACCA, Manual-D." name="description">
<meta content="Duct sizing based on ACCA, Manual-D." name="og:description">
<meta content="/images/mand_logo.png" name="og:image">
<meta content="/images/mand_logo.png" name="twitter:image">
<meta content="Duct Calc" name="twitter:image:alt">
<meta content="summary_large_image" name="twitter:card">
<meta content="1536" name="og:image:width">
<meta content="1024" name="og:image:height">
<meta content="duct, hvac, duct-design, duct design, manual-d, manual d, design" name="keywords">
<script src="https://unpkg.com/htmx.org@2.0.8"></script>
<script src="/js/main.js"></script>
<link rel="stylesheet" href="/css/output.css">
<link rel="icon" href="/images/favicon.ico" type="image/x-icon">
<link rel="icon" href="/images/favicon-32x32.png" type="image/png">
<link rel="icon" href="/images/favicon-16x16.png" type="image/png">
<link rel="apple-touch-icon" sizes="180x180" href="/images/apple-touch-icon.png">
<link rel="manifest" href="/site.webmanifest">
<script src="https://unpkg.com/htmx-remove@latest" crossorigin="anonymous" integrity="sha384-NwB2Xh66PNEYfVki0ao13UAFmdNtMIdBKZ8sNGRT6hKfCPaINuZ4ScxS6vVAycPT"></script>
</head>
<body>
<div class="flex flex-col min-h-screen min-w-full justify-between">
<main class="flex flex-col min-h-screen min-w-full grow mb-auto">
<dialog id="loginForm" class="modal modal-open">
<div class="modal-box">
<h1 class="text-2xl font-bold mb-6">Login</h1>
<form method="post" class="space-y-4">
<div>
<label class="input validator w-full"> <svg class="h-[1em] opacity-50" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
<g
stroke-linejoin="round"
stroke-linecap="round"
stroke-width="2.5"
fill="none"
stroke="currentColor"
>
<rect width="20" height="16" x="2" y="4" rx="2"></rect>
<path d="m22 7-8.97 5.7a1.94 1.94 0 0 1-2.06 0L2 7"></path>
</g>
</svg>
<input type="email" placeholder="Email" required name="email" id="email" autofocus></label>
<div class="validator-hint hidden">Enter valid email address.</div>
</div>
<div>
<label class="input validator w-full"> <svg class="h-[1em] opacity-50" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
<g
stroke-linejoin="round"
stroke-linecap="round"
stroke-width="2.5"
fill="none"
stroke="currentColor"
>
<path
d="M2.586 17.414A2 2 0 0 0 2 18.828V21a1 1 0 0 0 1 1h3a1 1 0 0 0 1-1v-1a1 1 0 0 1 1-1h1a1 1 0 0 0 1-1v-1a1 1 0 0 1 1-1h.172a2 2 0 0 0 1.414-.586l.814-.814a6.5 6.5 0 1 0-4-4z"
></path>
<circle cx="16.5" cy="7.5" r=".5" fill="currentColor"></circle>
</g>
</svg>
<input type="password" placeholder="Password" required pattern="(?=.*\d)(?=.*[a-z])(?=.*[A-Z]).{8,}" minlength="8" name="password" id="password"></label>
</div>
<div class="flex">
<button class="btn btn-secondary mt-4 w-full">Login</button>
</div>
<div class="flex justify-center"><a class="btn btn-link" href="/signup">Sign Up</a></div>
</form>
</div>
</dialog>
</main>
<div class="bottom-0 left-0 bg-error"></div>
</div>
</body>
</html>

View File

@@ -0,0 +1,251 @@
<!DOCTYPE html>
<html lang="en">
<head>
<title>Duct Calc</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta content="ductcalc.com" name="og:site_name">
<meta content="Duct Calc" name="og:title">
<meta content="Duct sizing based on ACCA, Manual-D." name="description">
<meta content="Duct sizing based on ACCA, Manual-D." name="og:description">
<meta content="/images/mand_logo.png" name="og:image">
<meta content="/images/mand_logo.png" name="twitter:image">
<meta content="Duct Calc" name="twitter:image:alt">
<meta content="summary_large_image" name="twitter:card">
<meta content="1536" name="og:image:width">
<meta content="1024" name="og:image:height">
<meta content="duct, hvac, duct-design, duct design, manual-d, manual d, design" name="keywords">
<script src="https://unpkg.com/htmx.org@2.0.8"></script>
<script src="/js/main.js"></script>
<link rel="stylesheet" href="/css/output.css">
<link rel="icon" href="/images/favicon.ico" type="image/x-icon">
<link rel="icon" href="/images/favicon-32x32.png" type="image/png">
<link rel="icon" href="/images/favicon-16x16.png" type="image/png">
<link rel="apple-touch-icon" sizes="180x180" href="/images/apple-touch-icon.png">
<link rel="manifest" href="/site.webmanifest">
<script src="https://unpkg.com/htmx-remove@latest" crossorigin="anonymous" integrity="sha384-NwB2Xh66PNEYfVki0ao13UAFmdNtMIdBKZ8sNGRT6hKfCPaINuZ4ScxS6vVAycPT"></script>
</head>
<body>
<div class="flex flex-col min-h-screen min-w-full justify-between">
<main class="flex flex-col min-h-screen min-w-full grow mb-auto">
<div class="drawer lg:drawer-open h-full">
<input id="my-drawer-1" type="checkbox" class="drawer-toggle">
<div class="drawer-content overflow-auto">
<nav class="navbar w-full bg-base-300 text-base-content shadow-sm mb-4">
<div class="flex flex-1 space-x-4 items-center">
<div class="tooltip tooltip-right" data-tip="Open sidebar"><label for="my-drawer-1" class="size-7 btn btn-square btn-ghost hover:bg-neutral hover:text-white" aria-label="open sidebar"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" stroke-linejoin="round" stroke-linecap="round" stroke-width="2" fill="none" stroke="currentColor" class="my-1.5 inline-block"><path d="M4 4m0 2a2 2 0 0 1 2 -2h12a2 2 0 0 1 2 2v12a2 2 0 0 1 -2 2h-12a2 2 0 0 1 -2 -2z"></path><path d="M9 4v16"></path><path d="M14 10l2 2l-2 2"></path></svg></label></div>
<div class="tooltip tooltip-right" data-tip="Home">
<a class="flex w-fit h-fit text-xl items-end px-4 py-2 btn btn-square btn-ghost hover:bg-neutral hover:text-white" href="/projects">
<img src="/images/mand_logo_sm.webp">
Duct Calc<span></span></a>
</div>
</div>
<div class="flex-none">
<div class="tooltip tooltip-left" data-tip="Profile"><a href="/profile" class="btn btn-square btn-ghost hover:bg-neutral hover:text-white"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-circle-user-icon lucide-circle-user"><circle cx="12" cy="12" r="10"/><circle cx="12" cy="10" r="3"/><path d="M7 20.662V19a2 2 0 0 1 2-2h6a2 2 0 0 1 2 2v1.662"/></svg></a></div>
</div>
</nav>
<div class="p-4">
<div>
<div class="flex justify-between bg-secondary border-2 border-primary rounded-sm shadow-sm
p-6 w-full">
<h1 class="text-3xl font-bold">Project</h1>
<div class="tooltip tooltip-left" data-tip="Edit project">
<button class="btn btn-primary" type="button" onclick="projectForm.showModal()">
<div class="flex">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-square-pen-icon lucide-square-pen"><path d="M12 3H5a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7"/><path d="M18.375 2.625a1 1 0 0 1 3 3l-9.013 9.014a2 2 0 0 1-.853.505l-2.873.84a.5.5 0 0 1-.62-.62l.84-2.873a2 2 0 0 1 .506-.852z"/></svg>
</div>
</button>
</div>
</div>
<table class="table table-zebra text-lg">
<tbody>
<tr>
<td class="label font-bold">Name</td>
<td>
<div class="flex justify-end">Testy McTestface</div>
</td>
</tr>
<tr>
<td class="label font-bold">Street Address</td>
<td>
<div class="flex justify-end">1234 Sesame Street</div>
</td>
</tr>
<tr>
<td class="label font-bold">City</td>
<td>
<div class="flex justify-end">Monroe</div>
</td>
</tr>
<tr>
<td class="label font-bold">State</td>
<td>
<div class="flex justify-end">OH</div>
</td>
</tr>
<tr>
<td class="label font-bold">Zip</td>
<td>
<div class="flex justify-end">55555</div>
</td>
</tr>
</tbody>
</table>
<dialog id="projectForm" class="modal">
<div class="modal-box">
<button class="btn btn-sm btn-circle btn-ghost absolute right-2 top-2" onclick="projectForm.close()"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-x-icon lucide-x"><path d="M18 6 6 18"/><path d="m6 6 12 12"/></svg></button>
<h1 class="text-3xl font-bold pb-6 ps-2">Project</h1>
<form class="grid grid-cols-1 gap-4" hx-patch="/projects/00000000-0000-0000-0000-000000000000" hx-target="body" hx-swap="outerHTML">
<input class="hidden" name="id" value="00000000-0000-0000-0000-000000000000">
Name<label class="input w-full"><span class="label"></span>
<input name="name" type="text" value="Testy McTestface" placeholder="Project Name" required autofocus>
Address</label><label class="input w-full"><span class="label"></span>
<input name="streetAddress" type="text" value="1234 Sesame Street" placeholder="Street Address" required>
City</label><label class="input w-full"><span class="label"></span>
<input name="city" type="text" value="Monroe" placeholder="City" required>
State</label><label class="input w-full"><span class="label"></span>
<input name="state" type="text" value="OH" placeholder="State" required>
Zip</label><label class="input w-full"><span class="label"></span>
<input name="zipCode" type="text" value="55555" placeholder="Zip Code" required></label>
<button class="btn btn-secondary btn-block my-6" type="submit">Submit</button>
</form>
</div>
</dialog>
</div>
</div>
</div>
<div class="drawer-side is-drawer-close:overflow-visible grow">
<label for="my-drawer-1" aria-label="close sidebar" class="drawer-overlay"></label>
<div class="flex grow h-full flex-col items-start bg-base-300 text-base-content
is-drawer-close:min-w-[80px] is-drawer-open:max-w-[300px]">
<ul class="w-full grow">
<li class="flex w-full">
<button class="w-full gap-1 py-2 border-b-1 border-gray-200
hover:bg-neutral data-active:bg-neutral
hover:text-white data-active:text-white
is-drawer-open:flex is-drawer-open:space-x-4
is-drawer-close:grid-cols-1" hx-get="/projects/00000000-0000-0000-0000-000000000000" hx-push-url="true" hx-target="body" hx-swap="outerHTML" data-active="true">
<div class="w-full p-2 gap-1
is-drawer-open:flex is-drawer-open:space-x-4
is-drawer-close:grid-cols-1">
<div class="items-center
is-drawer-open:justify-start is-drawer-open:flex is-drawer-open:space-x-4
is-drawer-close:justify-center is-drawer-close:mx-auto is-drawer-close:space-y-2">
<div class="flex items-center justify-center is-drawer-close:text-green-400"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-map-pin-icon lucide-map-pin"><path d="M20 10c0 4.993-5.539 10.193-7.399 11.799a1 1 0 0 1-1.202 0C9.539 20.193 4 14.993 4 10a8 8 0 0 1 16 0"/><circle cx="12" cy="10" r="3"/></svg></div>
<div class="flex items-center justify-center"><span>Project</span></div>
</div>
<div class="flex grow justify-end items-end is-drawer-close:hidden text-green-400"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-badge-check-icon lucide-badge-check"><path d="M3.85 8.62a4 4 0 0 1 4.78-4.77 4 4 0 0 1 6.74 0 4 4 0 0 1 4.78 4.78 4 4 0 0 1 0 6.74 4 4 0 0 1-4.77 4.78 4 4 0 0 1-6.75 0 4 4 0 0 1-4.78-4.77 4 4 0 0 1 0-6.76Z"/><path d="m9 12 2 2 4-4"/></svg></div>
</div>
</button>
</li>
<li class="w-full">
<button class="w-full gap-1 py-2 border-b-1 border-gray-200
hover:bg-neutral data-active:bg-neutral
hover:text-white data-active:text-white
is-drawer-open:flex is-drawer-open:space-x-4
is-drawer-close:grid-cols-1" hx-get="/projects/00000000-0000-0000-0000-000000000000/rooms" hx-push-url="true" hx-target="body" hx-swap="outerHTML">
<div class="w-full p-2 gap-1
is-drawer-open:flex is-drawer-open:space-x-4
is-drawer-close:grid-cols-1">
<div class="items-center
is-drawer-open:justify-start is-drawer-open:flex is-drawer-open:space-x-4
is-drawer-close:justify-center is-drawer-close:mx-auto is-drawer-close:space-y-2">
<div class="flex items-center justify-center is-drawer-close:text-green-400"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-door-closed-icon lucide-door-closed"><path d="M10 12h.01"/><path d="M18 20V6a2 2 0 0 0-2-2H8a2 2 0 0 0-2 2v14"/><path d="M2 20h20"/></svg></div>
<div class="flex items-center justify-center"><span>Rooms</span></div>
</div>
<div class="flex grow justify-end items-end is-drawer-close:hidden text-green-400"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-badge-check-icon lucide-badge-check"><path d="M3.85 8.62a4 4 0 0 1 4.78-4.77 4 4 0 0 1 6.74 0 4 4 0 0 1 4.78 4.78 4 4 0 0 1 0 6.74 4 4 0 0 1-4.77 4.78 4 4 0 0 1-6.75 0 4 4 0 0 1-4.78-4.77 4 4 0 0 1 0-6.76Z"/><path d="m9 12 2 2 4-4"/></svg></div>
</div>
</button>
</li>
<li class="flex w-full">
<button class="w-full gap-1 py-2 border-b-1 border-gray-200
hover:bg-neutral data-active:bg-neutral
hover:text-white data-active:text-white
is-drawer-open:flex is-drawer-open:space-x-4
is-drawer-close:grid-cols-1" hx-get="/projects/00000000-0000-0000-0000-000000000000/equipment" hx-push-url="true" hx-target="body" hx-swap="outerHTML">
<div class="w-full p-2 gap-1
is-drawer-open:flex is-drawer-open:space-x-4
is-drawer-close:grid-cols-1">
<div class="items-center
is-drawer-open:justify-start is-drawer-open:flex is-drawer-open:space-x-4
is-drawer-close:justify-center is-drawer-close:mx-auto is-drawer-close:space-y-2">
<div class="flex items-center justify-center is-drawer-close:text-green-400"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-fan-icon lucide-fan"><path d="M10.827 16.379a6.082 6.082 0 0 1-8.618-7.002l5.412 1.45a6.082 6.082 0 0 1 7.002-8.618l-1.45 5.412a6.082 6.082 0 0 1 8.618 7.002l-5.412-1.45a6.082 6.082 0 0 1-7.002 8.618l1.45-5.412Z"/><path d="M12 12v.01"/></svg></div>
<div class="flex items-center justify-center"><span>Equipment</span></div>
</div>
<div class="flex grow justify-end items-end is-drawer-close:hidden text-green-400"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-badge-check-icon lucide-badge-check"><path d="M3.85 8.62a4 4 0 0 1 4.78-4.77 4 4 0 0 1 6.74 0 4 4 0 0 1 4.78 4.78 4 4 0 0 1 0 6.74 4 4 0 0 1-4.77 4.78 4 4 0 0 1-6.75 0 4 4 0 0 1-4.78-4.77 4 4 0 0 1 0-6.76Z"/><path d="m9 12 2 2 4-4"/></svg></div>
</div>
</button>
</li>
<li class="w-full">
<button class="w-full gap-1 py-2 border-b-1 border-gray-200
hover:bg-neutral data-active:bg-neutral
hover:text-white data-active:text-white
is-drawer-open:flex is-drawer-open:space-x-4
is-drawer-close:grid-cols-1" hx-get="/projects/00000000-0000-0000-0000-000000000000/effective-lengths" hx-push-url="true" hx-target="body" hx-swap="outerHTML">
<div class="w-full p-2 gap-1
is-drawer-open:flex is-drawer-open:space-x-4
is-drawer-close:grid-cols-1">
<div class="items-center
is-drawer-open:justify-start is-drawer-open:flex is-drawer-open:space-x-4
is-drawer-close:justify-center is-drawer-close:mx-auto is-drawer-close:space-y-2">
<div class="flex items-center justify-center is-drawer-close:text-green-400"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-ruler-dimension-line-icon lucide-ruler-dimension-line"><path d="M10 15v-3"/><path d="M14 15v-3"/><path d="M18 15v-3"/><path d="M2 8V4"/><path d="M22 6H2"/><path d="M22 8V4"/><path d="M6 15v-3"/><rect x="2" y="12" width="20" height="8" rx="2"/></svg></div>
<div class="flex items-center justify-center"><span>T.E.L.</span></div>
</div>
<div class="flex grow justify-end items-end is-drawer-close:hidden text-green-400"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-badge-check-icon lucide-badge-check"><path d="M3.85 8.62a4 4 0 0 1 4.78-4.77 4 4 0 0 1 6.74 0 4 4 0 0 1 4.78 4.78 4 4 0 0 1 0 6.74 4 4 0 0 1-4.77 4.78 4 4 0 0 1-6.75 0 4 4 0 0 1-4.78-4.77 4 4 0 0 1 0-6.76Z"/><path d="m9 12 2 2 4-4"/></svg></div>
</div>
</button>
</li>
<li class="w-full">
<button class="w-full gap-1 py-2 border-b-1 border-gray-200
hover:bg-neutral data-active:bg-neutral
hover:text-white data-active:text-white
is-drawer-open:flex is-drawer-open:space-x-4
is-drawer-close:grid-cols-1" hx-get="/projects/00000000-0000-0000-0000-000000000000/friction-rate" hx-push-url="true" hx-target="body" hx-swap="outerHTML">
<div class="w-full p-2 gap-1
is-drawer-open:flex is-drawer-open:space-x-4
is-drawer-close:grid-cols-1">
<div class="items-center
is-drawer-open:justify-start is-drawer-open:flex is-drawer-open:space-x-4
is-drawer-close:justify-center is-drawer-close:mx-auto is-drawer-close:space-y-2">
<div class="flex items-center justify-center is-drawer-close:text-green-400"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-square-function-icon lucide-square-function"><rect width="18" height="18" x="3" y="3" rx="2" ry="2"/><path d="M9 17c2 0 2.8-1 2.8-2.8V10c0-2 1-3.3 3.2-3"/><path d="M9 11.2h5.7"/></svg></div>
<div class="flex items-center justify-center"><span>Friction Rate</span></div>
</div>
<div class="flex grow justify-end items-end is-drawer-close:hidden text-green-400"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-badge-check-icon lucide-badge-check"><path d="M3.85 8.62a4 4 0 0 1 4.78-4.77 4 4 0 0 1 6.74 0 4 4 0 0 1 4.78 4.78 4 4 0 0 1 0 6.74 4 4 0 0 1-4.77 4.78 4 4 0 0 1-6.75 0 4 4 0 0 1-4.78-4.77 4 4 0 0 1 0-6.76Z"/><path d="m9 12 2 2 4-4"/></svg></div>
</div>
</button>
</li>
<li class="w-full">
<button class="w-full gap-1 py-2 border-b-1 border-gray-200
hover:bg-neutral data-active:bg-neutral
hover:text-white data-active:text-white
is-drawer-open:flex is-drawer-open:space-x-4
is-drawer-close:grid-cols-1" hx-get="/projects/00000000-0000-0000-0000-000000000000/duct-sizing" hx-push-url="true" hx-target="body" hx-swap="outerHTML">
<div class="w-full p-2 gap-1
is-drawer-open:flex is-drawer-open:space-x-4
is-drawer-close:grid-cols-1">
<div class="items-center
is-drawer-open:justify-start is-drawer-open:flex is-drawer-open:space-x-4
is-drawer-close:justify-center is-drawer-close:mx-auto is-drawer-close:space-y-2">
<div class="flex items-center justify-center"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-wind-icon lucide-wind"><path d="M12.8 19.6A2 2 0 1 0 14 16H2"/><path d="M17.5 8a2.5 2.5 0 1 1 2 4H2"/><path d="M9.8 4.4A2 2 0 1 1 11 8H2"/></svg></div>
<div class="flex items-center justify-center"><span>Duct Sizes</span></div>
</div>
</div>
</button>
</li>
</ul>
</div>
</div>
</div>
</main>
<div class="bottom-0 left-0 bg-error">
<footer class="footer sm:footer-horizontal footer-center
bg-base-300 text-base-content p-4">
<aside>
<p>Copyright © 2026 - All rights reserved by Michael Housh</p>
</aside>
</footer>
</div>
</div>
</body>
</html>

View File

@@ -0,0 +1,593 @@
<!DOCTYPE html>
<html lang="en">
<head>
<title>Duct Calc</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta content="ductcalc.com" name="og:site_name">
<meta content="Duct Calc" name="og:title">
<meta content="Duct sizing based on ACCA, Manual-D." name="description">
<meta content="Duct sizing based on ACCA, Manual-D." name="og:description">
<meta content="/images/mand_logo.png" name="og:image">
<meta content="/images/mand_logo.png" name="twitter:image">
<meta content="Duct Calc" name="twitter:image:alt">
<meta content="summary_large_image" name="twitter:card">
<meta content="1536" name="og:image:width">
<meta content="1024" name="og:image:height">
<meta content="duct, hvac, duct-design, duct design, manual-d, manual d, design" name="keywords">
<script src="https://unpkg.com/htmx.org@2.0.8"></script>
<script src="/js/main.js"></script>
<link rel="stylesheet" href="/css/output.css">
<link rel="icon" href="/images/favicon.ico" type="image/x-icon">
<link rel="icon" href="/images/favicon-32x32.png" type="image/png">
<link rel="icon" href="/images/favicon-16x16.png" type="image/png">
<link rel="apple-touch-icon" sizes="180x180" href="/images/apple-touch-icon.png">
<link rel="manifest" href="/site.webmanifest">
<script src="https://unpkg.com/htmx-remove@latest" crossorigin="anonymous" integrity="sha384-NwB2Xh66PNEYfVki0ao13UAFmdNtMIdBKZ8sNGRT6hKfCPaINuZ4ScxS6vVAycPT"></script>
</head>
<body>
<div class="flex flex-col min-h-screen min-w-full justify-between">
<main class="flex flex-col min-h-screen min-w-full grow mb-auto">
<div class="drawer lg:drawer-open h-full">
<input id="my-drawer-1" type="checkbox" class="drawer-toggle">
<div class="drawer-content overflow-auto">
<nav class="navbar w-full bg-base-300 text-base-content shadow-sm mb-4">
<div class="flex flex-1 space-x-4 items-center">
<div class="tooltip tooltip-right" data-tip="Open sidebar"><label for="my-drawer-1" class="size-7 btn btn-square btn-ghost hover:bg-neutral hover:text-white" aria-label="open sidebar"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" stroke-linejoin="round" stroke-linecap="round" stroke-width="2" fill="none" stroke="currentColor" class="my-1.5 inline-block"><path d="M4 4m0 2a2 2 0 0 1 2 -2h12a2 2 0 0 1 2 2v12a2 2 0 0 1 -2 2h-12a2 2 0 0 1 -2 -2z"></path><path d="M9 4v16"></path><path d="M14 10l2 2l-2 2"></path></svg></label></div>
<div class="tooltip tooltip-right" data-tip="Home">
<a class="flex w-fit h-fit text-xl items-end px-4 py-2 btn btn-square btn-ghost hover:bg-neutral hover:text-white" href="/projects">
<img src="/images/mand_logo_sm.webp">
Duct Calc<span></span></a>
</div>
</div>
<div class="flex-none">
<div class="tooltip tooltip-left" data-tip="Profile"><a href="/profile" class="btn btn-square btn-ghost hover:bg-neutral hover:text-white"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-circle-user-icon lucide-circle-user"><circle cx="12" cy="12" r="10"/><circle cx="12" cy="10" r="3"/><path d="M7 20.662V19a2 2 0 0 1 2-2h6a2 2 0 0 1 2 2v1.662"/></svg></a></div>
</div>
</nav>
<div class="p-4">
<div class="flex w-full flex-col">
<div class="flex justify-between bg-secondary border-2 border-primary rounded-sm shadow-sm
p-6 w-full">
<div class="flex grid grid-cols-3 w-full gap-y-4">
<div class="col-span-2">
<h1 class="text-3xl font-bold">Room Loads</h1>
</div>
<div class="flex justify-end grow">
<div class="tooltip tooltip-left" data-tip="Set sensible heat ratio">
<button class="btn btn-primary text-lg font-bold py-2 " onclick="shrForm.showModal()">
<div class="flex grow justify-end items-end space-x-4">
<span>Sensible Heat Ratio</span>
<div class="badge badge-lg badge-outline"><span>0.83</span></div>
</div>
</button>
</div>
</div>
<div class="flex items-end space-x-4 font-bold">
<span class="text-lg">Heating Total</span>
<div class="badge badge-lg badge-outline badge-error"><span>42,255</span></div>
</div>
<div class="flex justify-center items-end space-x-4 my-auto font-bold">
<span class="text-lg">Cooling Total</span>
<div class="badge badge-lg badge-outline badge-success"><span>26,835</span></div>
</div>
<div class="flex grow justify-end items-end space-x-4 me-4 my-auto font-bold">
<span class="text-lg">Cooling Sensible</span>
<div class="badge badge-lg badge-outline badge-info"><span>22,273</span></div>
</div>
</div>
</div>
<dialog id="shrForm" class="modal">
<div class="modal-box">
<button class="btn btn-sm btn-circle btn-ghost absolute right-2 top-2" onclick="shrForm.close()"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-x-icon lucide-x"><path d="M18 6 6 18"/><path d="m6 6 12 12"/></svg></button>
<h1 class="text-xl font-bold mb-6">Sensible Heat Ratio</h1>
<form class="grid grid-cols-1 gap-4" hx-patch="/projects/00000000-0000-0000-0000-000000000000/rooms/update-shr" hx-target="body" hx-swap="outerHTML">
<input class="hidden" name="projectID" value="00000000-0000-0000-0000-000000000000">
SHR<label class="input w-full"><span class="label"></span>
<input name="sensibleHeatRatio" type="number" value="0.83" placeholder="0.83" min="0" max="1" step="0.01" autofocus></label>
<button class="btn btn-secondary btn-block my-6" type="submit">Submit</button>
</form>
</div>
</dialog>
<table class="table table-zebra text-lg" id="roomsTable">
<thead>
<tr class="text-lg font-bold">
<th>Name</th>
<th>
<div class="flex justify-center">Heating Load</div>
</th>
<th>
<div class="flex justify-center">Cooling Total</div>
</th>
<th>
<div class="flex justify-center">Cooling Sensible</div>
</th>
<th>
<div class="flex justify-center">Register Count</div>
</th>
<th>
<div class="flex justify-end me-2">
<div class="tooltip tooltip-left" data-tip="Add Room">
<button type="button" class="btn btn-primary mx-auto tooltip-left" onclick="roomForm.showModal()"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-circle-plus-icon lucide-circle-plus"><circle cx="12" cy="12" r="10"/><path d="M8 12h8"/><path d="M12 8v8"/></svg></button>
</div>
</div>
</th>
</tr>
</thead>
<tbody>
<tr id="roomRow_00000000000000000000000000000001">
<td>Bed-1</td>
<td>
<div class="flex justify-center"><span>3,913</span></div>
</td>
<td>
<div class="flex justify-center"><span>2,472</span></div>
</td>
<td>
<div class="flex justify-center"><span>2,052</span></div>
</td>
<td>
<div class="flex justify-center"><span>1</span></div>
</td>
<td>
<div class="flex justify-end">
<div class="join">
<div class="tooltip tooltip-bottom" data-tip="Delete room">
<button type="button" class="btn btn-error join-item btn-ghost" hx-delete="/projects/00000000-0000-0000-0000-000000000000/rooms/00000000-0000-0000-0000-000000000001" hx-target="closest tr" hx-confirm="Are you sure?"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-trash2-icon lucide-trash-2"><path d="M10 11v6"/><path d="M14 11v6"/><path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"/><path d="M3 6h18"/><path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"/></svg></button>
</div>
<div class="tooltip tooltip-bottom" data-tip="Edit room">
<button class="btn join-item btn-ghost" type="button" onclick="roomForm_00000000000000000000000000000001.showModal()">
<div class="flex">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-square-pen-icon lucide-square-pen"><path d="M12 3H5a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7"/><path d="M18.375 2.625a1 1 0 0 1 3 3l-9.013 9.014a2 2 0 0 1-.853.505l-2.873.84a.5.5 0 0 1-.62-.62l.84-2.873a2 2 0 0 1 .506-.852z"/></svg>
</div>
</button>
</div>
</div>
</div>
<dialog id="roomForm_00000000000000000000000000000001" class="modal">
<div class="modal-box">
<button class="btn btn-sm btn-circle btn-ghost absolute right-2 top-2" onclick="roomForm_00000000000000000000000000000001.close()"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-x-icon lucide-x"><path d="M18 6 6 18"/><path d="m6 6 12 12"/></svg></button>
<h1 class="text-3xl font-bold pb-6">Room</h1>
<form class="grid grid-cols-1 gap-4" hx-patch="/projects/00000000-0000-0000-0000-000000000000/rooms/00000000-0000-0000-0000-000000000001" hx-target="body" hx-swap="outerHTML">
<input class="hidden" name="projectID" value="00000000-0000-0000-0000-000000000000">
<input class="hidden" name="id" value="00000000-0000-0000-0000-000000000001">
Name<label class="input w-full"><span class="label"></span>
<input name="name" type="text" placeholder="Name" required autofocus value="Bed-1">
Heating Load</label><label class="input w-full"><span class="label"></span>
<input name="heatingLoad" type="number" placeholder="1234" required min="0" value="3913.0">
Cooling Total</label><label class="input w-full"><span class="label"></span>
<input name="coolingTotal" type="number" placeholder="1234" required min="0" value="2472.0">
Cooling Sensible</label><label class="input w-full"><span class="label"></span>
<input name="coolingSensible" type="number" placeholder="1234 (Optional)" min="0" value="">
Registers</label><label class="input w-full"><span class="label"></span>
<input name="registerCount" type="number" min="1" required value="1"></label>
<button class="btn btn-secondary btn-block" type="submit">Submit</button>
</form>
</div>
</dialog>
</td>
</tr>
<tr id="roomRow_00000000000000000000000000000002">
<td>Entry</td>
<td>
<div class="flex justify-center"><span>8,284</span></div>
</td>
<td>
<div class="flex justify-center"><span>2,916</span></div>
</td>
<td>
<div class="flex justify-center"><span>2,420</span></div>
</td>
<td>
<div class="flex justify-center"><span>2</span></div>
</td>
<td>
<div class="flex justify-end">
<div class="join">
<div class="tooltip tooltip-bottom" data-tip="Delete room">
<button type="button" class="btn btn-error join-item btn-ghost" hx-delete="/projects/00000000-0000-0000-0000-000000000000/rooms/00000000-0000-0000-0000-000000000002" hx-target="closest tr" hx-confirm="Are you sure?"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-trash2-icon lucide-trash-2"><path d="M10 11v6"/><path d="M14 11v6"/><path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"/><path d="M3 6h18"/><path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"/></svg></button>
</div>
<div class="tooltip tooltip-bottom" data-tip="Edit room">
<button class="btn join-item btn-ghost" type="button" onclick="roomForm_00000000000000000000000000000002.showModal()">
<div class="flex">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-square-pen-icon lucide-square-pen"><path d="M12 3H5a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7"/><path d="M18.375 2.625a1 1 0 0 1 3 3l-9.013 9.014a2 2 0 0 1-.853.505l-2.873.84a.5.5 0 0 1-.62-.62l.84-2.873a2 2 0 0 1 .506-.852z"/></svg>
</div>
</button>
</div>
</div>
</div>
<dialog id="roomForm_00000000000000000000000000000002" class="modal">
<div class="modal-box">
<button class="btn btn-sm btn-circle btn-ghost absolute right-2 top-2" onclick="roomForm_00000000000000000000000000000002.close()"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-x-icon lucide-x"><path d="M18 6 6 18"/><path d="m6 6 12 12"/></svg></button>
<h1 class="text-3xl font-bold pb-6">Room</h1>
<form class="grid grid-cols-1 gap-4" hx-patch="/projects/00000000-0000-0000-0000-000000000000/rooms/00000000-0000-0000-0000-000000000002" hx-target="body" hx-swap="outerHTML">
<input class="hidden" name="projectID" value="00000000-0000-0000-0000-000000000000">
<input class="hidden" name="id" value="00000000-0000-0000-0000-000000000002">
Name<label class="input w-full"><span class="label"></span>
<input name="name" type="text" placeholder="Name" required autofocus value="Entry">
Heating Load</label><label class="input w-full"><span class="label"></span>
<input name="heatingLoad" type="number" placeholder="1234" required min="0" value="8284.0">
Cooling Total</label><label class="input w-full"><span class="label"></span>
<input name="coolingTotal" type="number" placeholder="1234" required min="0" value="2916.0">
Cooling Sensible</label><label class="input w-full"><span class="label"></span>
<input name="coolingSensible" type="number" placeholder="1234 (Optional)" min="0" value="">
Registers</label><label class="input w-full"><span class="label"></span>
<input name="registerCount" type="number" min="1" required value="2"></label>
<button class="btn btn-secondary btn-block" type="submit">Submit</button>
</form>
</div>
</dialog>
</td>
</tr>
<tr id="roomRow_00000000000000000000000000000003">
<td>Family Room</td>
<td>
<div class="flex justify-center"><span>9,785</span></div>
</td>
<td>
<div class="flex justify-center"><span>7,446</span></div>
</td>
<td>
<div class="flex justify-center"><span>6,180</span></div>
</td>
<td>
<div class="flex justify-center"><span>3</span></div>
</td>
<td>
<div class="flex justify-end">
<div class="join">
<div class="tooltip tooltip-bottom" data-tip="Delete room">
<button type="button" class="btn btn-error join-item btn-ghost" hx-delete="/projects/00000000-0000-0000-0000-000000000000/rooms/00000000-0000-0000-0000-000000000003" hx-target="closest tr" hx-confirm="Are you sure?"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-trash2-icon lucide-trash-2"><path d="M10 11v6"/><path d="M14 11v6"/><path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"/><path d="M3 6h18"/><path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"/></svg></button>
</div>
<div class="tooltip tooltip-bottom" data-tip="Edit room">
<button class="btn join-item btn-ghost" type="button" onclick="roomForm_00000000000000000000000000000003.showModal()">
<div class="flex">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-square-pen-icon lucide-square-pen"><path d="M12 3H5a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7"/><path d="M18.375 2.625a1 1 0 0 1 3 3l-9.013 9.014a2 2 0 0 1-.853.505l-2.873.84a.5.5 0 0 1-.62-.62l.84-2.873a2 2 0 0 1 .506-.852z"/></svg>
</div>
</button>
</div>
</div>
</div>
<dialog id="roomForm_00000000000000000000000000000003" class="modal">
<div class="modal-box">
<button class="btn btn-sm btn-circle btn-ghost absolute right-2 top-2" onclick="roomForm_00000000000000000000000000000003.close()"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-x-icon lucide-x"><path d="M18 6 6 18"/><path d="m6 6 12 12"/></svg></button>
<h1 class="text-3xl font-bold pb-6">Room</h1>
<form class="grid grid-cols-1 gap-4" hx-patch="/projects/00000000-0000-0000-0000-000000000000/rooms/00000000-0000-0000-0000-000000000003" hx-target="body" hx-swap="outerHTML">
<input class="hidden" name="projectID" value="00000000-0000-0000-0000-000000000000">
<input class="hidden" name="id" value="00000000-0000-0000-0000-000000000003">
Name<label class="input w-full"><span class="label"></span>
<input name="name" type="text" placeholder="Name" required autofocus value="Family Room">
Heating Load</label><label class="input w-full"><span class="label"></span>
<input name="heatingLoad" type="number" placeholder="1234" required min="0" value="9785.0">
Cooling Total</label><label class="input w-full"><span class="label"></span>
<input name="coolingTotal" type="number" placeholder="1234" required min="0" value="7446.0">
Cooling Sensible</label><label class="input w-full"><span class="label"></span>
<input name="coolingSensible" type="number" placeholder="1234 (Optional)" min="0" value="">
Registers</label><label class="input w-full"><span class="label"></span>
<input name="registerCount" type="number" min="1" required value="3"></label>
<button class="btn btn-secondary btn-block" type="submit">Submit</button>
</form>
</div>
</dialog>
</td>
</tr>
<tr id="roomRow_00000000000000000000000000000004">
<td>Kitchen</td>
<td>
<div class="flex justify-center"><span>4,518</span></div>
</td>
<td>
<div class="flex justify-center"><span>5,096</span></div>
</td>
<td>
<div class="flex justify-center"><span>4,230</span></div>
</td>
<td>
<div class="flex justify-center"><span>2</span></div>
</td>
<td>
<div class="flex justify-end">
<div class="join">
<div class="tooltip tooltip-bottom" data-tip="Delete room">
<button type="button" class="btn btn-error join-item btn-ghost" hx-delete="/projects/00000000-0000-0000-0000-000000000000/rooms/00000000-0000-0000-0000-000000000004" hx-target="closest tr" hx-confirm="Are you sure?"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-trash2-icon lucide-trash-2"><path d="M10 11v6"/><path d="M14 11v6"/><path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"/><path d="M3 6h18"/><path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"/></svg></button>
</div>
<div class="tooltip tooltip-bottom" data-tip="Edit room">
<button class="btn join-item btn-ghost" type="button" onclick="roomForm_00000000000000000000000000000004.showModal()">
<div class="flex">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-square-pen-icon lucide-square-pen"><path d="M12 3H5a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7"/><path d="M18.375 2.625a1 1 0 0 1 3 3l-9.013 9.014a2 2 0 0 1-.853.505l-2.873.84a.5.5 0 0 1-.62-.62l.84-2.873a2 2 0 0 1 .506-.852z"/></svg>
</div>
</button>
</div>
</div>
</div>
<dialog id="roomForm_00000000000000000000000000000004" class="modal">
<div class="modal-box">
<button class="btn btn-sm btn-circle btn-ghost absolute right-2 top-2" onclick="roomForm_00000000000000000000000000000004.close()"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-x-icon lucide-x"><path d="M18 6 6 18"/><path d="m6 6 12 12"/></svg></button>
<h1 class="text-3xl font-bold pb-6">Room</h1>
<form class="grid grid-cols-1 gap-4" hx-patch="/projects/00000000-0000-0000-0000-000000000000/rooms/00000000-0000-0000-0000-000000000004" hx-target="body" hx-swap="outerHTML">
<input class="hidden" name="projectID" value="00000000-0000-0000-0000-000000000000">
<input class="hidden" name="id" value="00000000-0000-0000-0000-000000000004">
Name<label class="input w-full"><span class="label"></span>
<input name="name" type="text" placeholder="Name" required autofocus value="Kitchen">
Heating Load</label><label class="input w-full"><span class="label"></span>
<input name="heatingLoad" type="number" placeholder="1234" required min="0" value="4518.0">
Cooling Total</label><label class="input w-full"><span class="label"></span>
<input name="coolingTotal" type="number" placeholder="1234" required min="0" value="5096.0">
Cooling Sensible</label><label class="input w-full"><span class="label"></span>
<input name="coolingSensible" type="number" placeholder="1234 (Optional)" min="0" value="">
Registers</label><label class="input w-full"><span class="label"></span>
<input name="registerCount" type="number" min="1" required value="2"></label>
<button class="btn btn-secondary btn-block" type="submit">Submit</button>
</form>
</div>
</dialog>
</td>
</tr>
<tr id="roomRow_00000000000000000000000000000005">
<td>Living Room</td>
<td>
<div class="flex justify-center"><span>7,553</span></div>
</td>
<td>
<div class="flex justify-center"><span>6,829</span></div>
</td>
<td>
<div class="flex justify-center"><span>5,668</span></div>
</td>
<td>
<div class="flex justify-center"><span>2</span></div>
</td>
<td>
<div class="flex justify-end">
<div class="join">
<div class="tooltip tooltip-bottom" data-tip="Delete room">
<button type="button" class="btn btn-error join-item btn-ghost" hx-delete="/projects/00000000-0000-0000-0000-000000000000/rooms/00000000-0000-0000-0000-000000000005" hx-target="closest tr" hx-confirm="Are you sure?"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-trash2-icon lucide-trash-2"><path d="M10 11v6"/><path d="M14 11v6"/><path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"/><path d="M3 6h18"/><path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"/></svg></button>
</div>
<div class="tooltip tooltip-bottom" data-tip="Edit room">
<button class="btn join-item btn-ghost" type="button" onclick="roomForm_00000000000000000000000000000005.showModal()">
<div class="flex">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-square-pen-icon lucide-square-pen"><path d="M12 3H5a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7"/><path d="M18.375 2.625a1 1 0 0 1 3 3l-9.013 9.014a2 2 0 0 1-.853.505l-2.873.84a.5.5 0 0 1-.62-.62l.84-2.873a2 2 0 0 1 .506-.852z"/></svg>
</div>
</button>
</div>
</div>
</div>
<dialog id="roomForm_00000000000000000000000000000005" class="modal">
<div class="modal-box">
<button class="btn btn-sm btn-circle btn-ghost absolute right-2 top-2" onclick="roomForm_00000000000000000000000000000005.close()"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-x-icon lucide-x"><path d="M18 6 6 18"/><path d="m6 6 12 12"/></svg></button>
<h1 class="text-3xl font-bold pb-6">Room</h1>
<form class="grid grid-cols-1 gap-4" hx-patch="/projects/00000000-0000-0000-0000-000000000000/rooms/00000000-0000-0000-0000-000000000005" hx-target="body" hx-swap="outerHTML">
<input class="hidden" name="projectID" value="00000000-0000-0000-0000-000000000000">
<input class="hidden" name="id" value="00000000-0000-0000-0000-000000000005">
Name<label class="input w-full"><span class="label"></span>
<input name="name" type="text" placeholder="Name" required autofocus value="Living Room">
Heating Load</label><label class="input w-full"><span class="label"></span>
<input name="heatingLoad" type="number" placeholder="1234" required min="0" value="7553.0">
Cooling Total</label><label class="input w-full"><span class="label"></span>
<input name="coolingTotal" type="number" placeholder="1234" required min="0" value="6829.0">
Cooling Sensible</label><label class="input w-full"><span class="label"></span>
<input name="coolingSensible" type="number" placeholder="1234 (Optional)" min="0" value="">
Registers</label><label class="input w-full"><span class="label"></span>
<input name="registerCount" type="number" min="1" required value="2"></label>
<button class="btn btn-secondary btn-block" type="submit">Submit</button>
</form>
</div>
</dialog>
</td>
</tr>
<tr id="roomRow_00000000000000000000000000000006">
<td>Master</td>
<td>
<div class="flex justify-center"><span>8,202</span></div>
</td>
<td>
<div class="flex justify-center"><span>2,076</span></div>
</td>
<td>
<div class="flex justify-center"><span>1,723</span></div>
</td>
<td>
<div class="flex justify-center"><span>2</span></div>
</td>
<td>
<div class="flex justify-end">
<div class="join">
<div class="tooltip tooltip-bottom" data-tip="Delete room">
<button type="button" class="btn btn-error join-item btn-ghost" hx-delete="/projects/00000000-0000-0000-0000-000000000000/rooms/00000000-0000-0000-0000-000000000006" hx-target="closest tr" hx-confirm="Are you sure?"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-trash2-icon lucide-trash-2"><path d="M10 11v6"/><path d="M14 11v6"/><path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"/><path d="M3 6h18"/><path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"/></svg></button>
</div>
<div class="tooltip tooltip-bottom" data-tip="Edit room">
<button class="btn join-item btn-ghost" type="button" onclick="roomForm_00000000000000000000000000000006.showModal()">
<div class="flex">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-square-pen-icon lucide-square-pen"><path d="M12 3H5a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7"/><path d="M18.375 2.625a1 1 0 0 1 3 3l-9.013 9.014a2 2 0 0 1-.853.505l-2.873.84a.5.5 0 0 1-.62-.62l.84-2.873a2 2 0 0 1 .506-.852z"/></svg>
</div>
</button>
</div>
</div>
</div>
<dialog id="roomForm_00000000000000000000000000000006" class="modal">
<div class="modal-box">
<button class="btn btn-sm btn-circle btn-ghost absolute right-2 top-2" onclick="roomForm_00000000000000000000000000000006.close()"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-x-icon lucide-x"><path d="M18 6 6 18"/><path d="m6 6 12 12"/></svg></button>
<h1 class="text-3xl font-bold pb-6">Room</h1>
<form class="grid grid-cols-1 gap-4" hx-patch="/projects/00000000-0000-0000-0000-000000000000/rooms/00000000-0000-0000-0000-000000000006" hx-target="body" hx-swap="outerHTML">
<input class="hidden" name="projectID" value="00000000-0000-0000-0000-000000000000">
<input class="hidden" name="id" value="00000000-0000-0000-0000-000000000006">
Name<label class="input w-full"><span class="label"></span>
<input name="name" type="text" placeholder="Name" required autofocus value="Master">
Heating Load</label><label class="input w-full"><span class="label"></span>
<input name="heatingLoad" type="number" placeholder="1234" required min="0" value="8202.0">
Cooling Total</label><label class="input w-full"><span class="label"></span>
<input name="coolingTotal" type="number" placeholder="1234" required min="0" value="2076.0">
Cooling Sensible</label><label class="input w-full"><span class="label"></span>
<input name="coolingSensible" type="number" placeholder="1234 (Optional)" min="0" value="">
Registers</label><label class="input w-full"><span class="label"></span>
<input name="registerCount" type="number" min="1" required value="2"></label>
<button class="btn btn-secondary btn-block" type="submit">Submit</button>
</form>
</div>
</dialog>
</td>
</tr>
</tbody>
</table>
<dialog id="roomForm" class="modal">
<div class="modal-box">
<button class="btn btn-sm btn-circle btn-ghost absolute right-2 top-2" onclick="roomForm.close()"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-x-icon lucide-x"><path d="M18 6 6 18"/><path d="m6 6 12 12"/></svg></button>
<h1 class="text-3xl font-bold pb-6">Room</h1>
<form class="grid grid-cols-1 gap-4" hx-post="/projects/00000000-0000-0000-0000-000000000000/rooms" hx-target="body" hx-swap="outerHTML">
<input class="hidden" name="projectID" value="00000000-0000-0000-0000-000000000000">
Name<label class="input w-full"><span class="label"></span>
<input name="name" type="text" placeholder="Name" required autofocus value="">
Heating Load</label><label class="input w-full"><span class="label"></span>
<input name="heatingLoad" type="number" placeholder="1234" required min="0" value="">
Cooling Total</label><label class="input w-full"><span class="label"></span>
<input name="coolingTotal" type="number" placeholder="1234" required min="0" value="">
Cooling Sensible</label><label class="input w-full"><span class="label"></span>
<input name="coolingSensible" type="number" placeholder="1234 (Optional)" min="0" value="">
Registers</label><label class="input w-full"><span class="label"></span>
<input name="registerCount" type="number" min="1" required value="1"></label>
<button class="btn btn-secondary btn-block" type="submit">Submit</button>
</form>
</div>
</dialog>
</div>
</div>
</div>
<div class="drawer-side is-drawer-close:overflow-visible grow">
<label for="my-drawer-1" aria-label="close sidebar" class="drawer-overlay"></label>
<div class="flex grow h-full flex-col items-start bg-base-300 text-base-content
is-drawer-close:min-w-[80px] is-drawer-open:max-w-[300px]">
<ul class="w-full grow">
<li class="flex w-full">
<button class="w-full gap-1 py-2 border-b-1 border-gray-200
hover:bg-neutral data-active:bg-neutral
hover:text-white data-active:text-white
is-drawer-open:flex is-drawer-open:space-x-4
is-drawer-close:grid-cols-1" hx-get="/projects/00000000-0000-0000-0000-000000000000" hx-push-url="true" hx-target="body" hx-swap="outerHTML">
<div class="w-full p-2 gap-1
is-drawer-open:flex is-drawer-open:space-x-4
is-drawer-close:grid-cols-1">
<div class="items-center
is-drawer-open:justify-start is-drawer-open:flex is-drawer-open:space-x-4
is-drawer-close:justify-center is-drawer-close:mx-auto is-drawer-close:space-y-2">
<div class="flex items-center justify-center is-drawer-close:text-green-400"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-map-pin-icon lucide-map-pin"><path d="M20 10c0 4.993-5.539 10.193-7.399 11.799a1 1 0 0 1-1.202 0C9.539 20.193 4 14.993 4 10a8 8 0 0 1 16 0"/><circle cx="12" cy="10" r="3"/></svg></div>
<div class="flex items-center justify-center"><span>Project</span></div>
</div>
<div class="flex grow justify-end items-end is-drawer-close:hidden text-green-400"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-badge-check-icon lucide-badge-check"><path d="M3.85 8.62a4 4 0 0 1 4.78-4.77 4 4 0 0 1 6.74 0 4 4 0 0 1 4.78 4.78 4 4 0 0 1 0 6.74 4 4 0 0 1-4.77 4.78 4 4 0 0 1-6.75 0 4 4 0 0 1-4.78-4.77 4 4 0 0 1 0-6.76Z"/><path d="m9 12 2 2 4-4"/></svg></div>
</div>
</button>
</li>
<li class="w-full">
<button class="w-full gap-1 py-2 border-b-1 border-gray-200
hover:bg-neutral data-active:bg-neutral
hover:text-white data-active:text-white
is-drawer-open:flex is-drawer-open:space-x-4
is-drawer-close:grid-cols-1" hx-get="/projects/00000000-0000-0000-0000-000000000000/rooms" hx-push-url="true" hx-target="body" hx-swap="outerHTML" data-active="true">
<div class="w-full p-2 gap-1
is-drawer-open:flex is-drawer-open:space-x-4
is-drawer-close:grid-cols-1">
<div class="items-center
is-drawer-open:justify-start is-drawer-open:flex is-drawer-open:space-x-4
is-drawer-close:justify-center is-drawer-close:mx-auto is-drawer-close:space-y-2">
<div class="flex items-center justify-center is-drawer-close:text-green-400"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-door-closed-icon lucide-door-closed"><path d="M10 12h.01"/><path d="M18 20V6a2 2 0 0 0-2-2H8a2 2 0 0 0-2 2v14"/><path d="M2 20h20"/></svg></div>
<div class="flex items-center justify-center"><span>Rooms</span></div>
</div>
<div class="flex grow justify-end items-end is-drawer-close:hidden text-green-400"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-badge-check-icon lucide-badge-check"><path d="M3.85 8.62a4 4 0 0 1 4.78-4.77 4 4 0 0 1 6.74 0 4 4 0 0 1 4.78 4.78 4 4 0 0 1 0 6.74 4 4 0 0 1-4.77 4.78 4 4 0 0 1-6.75 0 4 4 0 0 1-4.78-4.77 4 4 0 0 1 0-6.76Z"/><path d="m9 12 2 2 4-4"/></svg></div>
</div>
</button>
</li>
<li class="flex w-full">
<button class="w-full gap-1 py-2 border-b-1 border-gray-200
hover:bg-neutral data-active:bg-neutral
hover:text-white data-active:text-white
is-drawer-open:flex is-drawer-open:space-x-4
is-drawer-close:grid-cols-1" hx-get="/projects/00000000-0000-0000-0000-000000000000/equipment" hx-push-url="true" hx-target="body" hx-swap="outerHTML">
<div class="w-full p-2 gap-1
is-drawer-open:flex is-drawer-open:space-x-4
is-drawer-close:grid-cols-1">
<div class="items-center
is-drawer-open:justify-start is-drawer-open:flex is-drawer-open:space-x-4
is-drawer-close:justify-center is-drawer-close:mx-auto is-drawer-close:space-y-2">
<div class="flex items-center justify-center is-drawer-close:text-green-400"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-fan-icon lucide-fan"><path d="M10.827 16.379a6.082 6.082 0 0 1-8.618-7.002l5.412 1.45a6.082 6.082 0 0 1 7.002-8.618l-1.45 5.412a6.082 6.082 0 0 1 8.618 7.002l-5.412-1.45a6.082 6.082 0 0 1-7.002 8.618l1.45-5.412Z"/><path d="M12 12v.01"/></svg></div>
<div class="flex items-center justify-center"><span>Equipment</span></div>
</div>
<div class="flex grow justify-end items-end is-drawer-close:hidden text-green-400"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-badge-check-icon lucide-badge-check"><path d="M3.85 8.62a4 4 0 0 1 4.78-4.77 4 4 0 0 1 6.74 0 4 4 0 0 1 4.78 4.78 4 4 0 0 1 0 6.74 4 4 0 0 1-4.77 4.78 4 4 0 0 1-6.75 0 4 4 0 0 1-4.78-4.77 4 4 0 0 1 0-6.76Z"/><path d="m9 12 2 2 4-4"/></svg></div>
</div>
</button>
</li>
<li class="w-full">
<button class="w-full gap-1 py-2 border-b-1 border-gray-200
hover:bg-neutral data-active:bg-neutral
hover:text-white data-active:text-white
is-drawer-open:flex is-drawer-open:space-x-4
is-drawer-close:grid-cols-1" hx-get="/projects/00000000-0000-0000-0000-000000000000/effective-lengths" hx-push-url="true" hx-target="body" hx-swap="outerHTML">
<div class="w-full p-2 gap-1
is-drawer-open:flex is-drawer-open:space-x-4
is-drawer-close:grid-cols-1">
<div class="items-center
is-drawer-open:justify-start is-drawer-open:flex is-drawer-open:space-x-4
is-drawer-close:justify-center is-drawer-close:mx-auto is-drawer-close:space-y-2">
<div class="flex items-center justify-center is-drawer-close:text-green-400"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-ruler-dimension-line-icon lucide-ruler-dimension-line"><path d="M10 15v-3"/><path d="M14 15v-3"/><path d="M18 15v-3"/><path d="M2 8V4"/><path d="M22 6H2"/><path d="M22 8V4"/><path d="M6 15v-3"/><rect x="2" y="12" width="20" height="8" rx="2"/></svg></div>
<div class="flex items-center justify-center"><span>T.E.L.</span></div>
</div>
<div class="flex grow justify-end items-end is-drawer-close:hidden text-green-400"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-badge-check-icon lucide-badge-check"><path d="M3.85 8.62a4 4 0 0 1 4.78-4.77 4 4 0 0 1 6.74 0 4 4 0 0 1 4.78 4.78 4 4 0 0 1 0 6.74 4 4 0 0 1-4.77 4.78 4 4 0 0 1-6.75 0 4 4 0 0 1-4.78-4.77 4 4 0 0 1 0-6.76Z"/><path d="m9 12 2 2 4-4"/></svg></div>
</div>
</button>
</li>
<li class="w-full">
<button class="w-full gap-1 py-2 border-b-1 border-gray-200
hover:bg-neutral data-active:bg-neutral
hover:text-white data-active:text-white
is-drawer-open:flex is-drawer-open:space-x-4
is-drawer-close:grid-cols-1" hx-get="/projects/00000000-0000-0000-0000-000000000000/friction-rate" hx-push-url="true" hx-target="body" hx-swap="outerHTML">
<div class="w-full p-2 gap-1
is-drawer-open:flex is-drawer-open:space-x-4
is-drawer-close:grid-cols-1">
<div class="items-center
is-drawer-open:justify-start is-drawer-open:flex is-drawer-open:space-x-4
is-drawer-close:justify-center is-drawer-close:mx-auto is-drawer-close:space-y-2">
<div class="flex items-center justify-center is-drawer-close:text-green-400"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-square-function-icon lucide-square-function"><rect width="18" height="18" x="3" y="3" rx="2" ry="2"/><path d="M9 17c2 0 2.8-1 2.8-2.8V10c0-2 1-3.3 3.2-3"/><path d="M9 11.2h5.7"/></svg></div>
<div class="flex items-center justify-center"><span>Friction Rate</span></div>
</div>
<div class="flex grow justify-end items-end is-drawer-close:hidden text-green-400"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-badge-check-icon lucide-badge-check"><path d="M3.85 8.62a4 4 0 0 1 4.78-4.77 4 4 0 0 1 6.74 0 4 4 0 0 1 4.78 4.78 4 4 0 0 1 0 6.74 4 4 0 0 1-4.77 4.78 4 4 0 0 1-6.75 0 4 4 0 0 1-4.78-4.77 4 4 0 0 1 0-6.76Z"/><path d="m9 12 2 2 4-4"/></svg></div>
</div>
</button>
</li>
<li class="w-full">
<button class="w-full gap-1 py-2 border-b-1 border-gray-200
hover:bg-neutral data-active:bg-neutral
hover:text-white data-active:text-white
is-drawer-open:flex is-drawer-open:space-x-4
is-drawer-close:grid-cols-1" hx-get="/projects/00000000-0000-0000-0000-000000000000/duct-sizing" hx-push-url="true" hx-target="body" hx-swap="outerHTML">
<div class="w-full p-2 gap-1
is-drawer-open:flex is-drawer-open:space-x-4
is-drawer-close:grid-cols-1">
<div class="items-center
is-drawer-open:justify-start is-drawer-open:flex is-drawer-open:space-x-4
is-drawer-close:justify-center is-drawer-close:mx-auto is-drawer-close:space-y-2">
<div class="flex items-center justify-center"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-wind-icon lucide-wind"><path d="M12.8 19.6A2 2 0 1 0 14 16H2"/><path d="M17.5 8a2.5 2.5 0 1 1 2 4H2"/><path d="M9.8 4.4A2 2 0 1 1 11 8H2"/></svg></div>
<div class="flex items-center justify-center"><span>Duct Sizes</span></div>
</div>
</div>
</button>
</li>
</ul>
</div>
</div>
</div>
</main>
<div class="bottom-0 left-0 bg-error">
<footer class="footer sm:footer-horizontal footer-center
bg-base-300 text-base-content p-4">
<aside>
<p>Copyright © 2026 - All rights reserved by Michael Housh</p>
</aside>
</footer>
</div>
</div>
</body>
</html>

View File

@@ -0,0 +1,236 @@
<!DOCTYPE html>
<html lang="en">
<head>
<title>Duct Calc</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta content="ductcalc.com" name="og:site_name">
<meta content="Duct Calc" name="og:title">
<meta content="Duct sizing based on ACCA, Manual-D." name="description">
<meta content="Duct sizing based on ACCA, Manual-D." name="og:description">
<meta content="/images/mand_logo.png" name="og:image">
<meta content="/images/mand_logo.png" name="twitter:image">
<meta content="Duct Calc" name="twitter:image:alt">
<meta content="summary_large_image" name="twitter:card">
<meta content="1536" name="og:image:width">
<meta content="1024" name="og:image:height">
<meta content="duct, hvac, duct-design, duct design, manual-d, manual d, design" name="keywords">
<script src="https://unpkg.com/htmx.org@2.0.8"></script>
<script src="/js/main.js"></script>
<link rel="stylesheet" href="/css/output.css">
<link rel="icon" href="/images/favicon.ico" type="image/x-icon">
<link rel="icon" href="/images/favicon-32x32.png" type="image/png">
<link rel="icon" href="/images/favicon-16x16.png" type="image/png">
<link rel="apple-touch-icon" sizes="180x180" href="/images/apple-touch-icon.png">
<link rel="manifest" href="/site.webmanifest">
<script src="https://unpkg.com/htmx-remove@latest" crossorigin="anonymous" integrity="sha384-NwB2Xh66PNEYfVki0ao13UAFmdNtMIdBKZ8sNGRT6hKfCPaINuZ4ScxS6vVAycPT"></script>
</head>
<body>
<div class="flex flex-col min-h-screen min-w-full justify-between">
<main class="flex flex-col min-h-screen min-w-full grow mb-auto">
<div class="drawer lg:drawer-open h-full">
<input id="my-drawer-1" type="checkbox" class="drawer-toggle">
<div class="drawer-content overflow-auto">
<nav class="navbar w-full bg-base-300 text-base-content shadow-sm mb-4">
<div class="flex flex-1 space-x-4 items-center">
<div class="tooltip tooltip-right" data-tip="Open sidebar"><label for="my-drawer-1" class="size-7 btn btn-square btn-ghost hover:bg-neutral hover:text-white" aria-label="open sidebar"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" stroke-linejoin="round" stroke-linecap="round" stroke-width="2" fill="none" stroke="currentColor" class="my-1.5 inline-block"><path d="M4 4m0 2a2 2 0 0 1 2 -2h12a2 2 0 0 1 2 2v12a2 2 0 0 1 -2 2h-12a2 2 0 0 1 -2 -2z"></path><path d="M9 4v16"></path><path d="M14 10l2 2l-2 2"></path></svg></label></div>
<div class="tooltip tooltip-right" data-tip="Home">
<a class="flex w-fit h-fit text-xl items-end px-4 py-2 btn btn-square btn-ghost hover:bg-neutral hover:text-white" href="/projects">
<img src="/images/mand_logo_sm.webp">
Duct Calc<span></span></a>
</div>
</div>
<div class="flex-none">
<div class="tooltip tooltip-left" data-tip="Profile"><a href="/profile" class="btn btn-square btn-ghost hover:bg-neutral hover:text-white"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-circle-user-icon lucide-circle-user"><circle cx="12" cy="12" r="10"/><circle cx="12" cy="10" r="3"/><path d="M7 20.662V19a2 2 0 0 1 2-2h6a2 2 0 0 1 2 2v1.662"/></svg></a></div>
</div>
</nav>
<div class="p-4">
<div class="space-y-4" id="equipmentInfo">
<div class="flex justify-between bg-secondary border-2 border-primary rounded-sm shadow-sm
p-6 w-full">
<h1 class="text-3xl font-bold">Equipment Details</h1>
<div class="tooltip tooltip-left" data-tip="Edit equipment details">
<button class="btn btn-primary" type="button" onclick="equipmentForm.showModal()">
<div class="flex">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-square-pen-icon lucide-square-pen"><path d="M12 3H5a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7"/><path d="M18.375 2.625a1 1 0 0 1 3 3l-9.013 9.014a2 2 0 0 1-.853.505l-2.873.84a.5.5 0 0 1-.62-.62l.84-2.873a2 2 0 0 1 .506-.852z"/></svg>
</div>
</button>
</div>
</div>
<table class="table table-zebra">
<tbody class="text-lg">
<tr>
<td><span class="text-lg label font-bold">Static Pressure</span></td>
<td>
<div class="flex justify-end"><span>0.5</span></div>
</td>
</tr>
<tr>
<td><span class="text-lg label font-bold">Heating CFM</span></td>
<td>
<div class="flex justify-end"><span>900</span></div>
</td>
</tr>
<tr>
<td><span class="text-lg label font-bold">Cooling CFM</span></td>
<td>
<div class="flex justify-end"><span>1,000</span></div>
</td>
</tr>
</tbody>
</table>
<dialog id="equipmentForm" class="modal">
<div class="modal-box">
<button class="btn btn-sm btn-circle btn-ghost absolute right-2 top-2" onclick="equipmentForm.close()"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-x-icon lucide-x"><path d="M18 6 6 18"/><path d="m6 6 12 12"/></svg></button>
<h1 class="text-3xl font-bold pb-6 ps-2">Equipment Info</h1>
<form class="grid grid-cols-1 gap-4" hx-patch="/projects/00000000-0000-0000-0000-000000000000/equipment/00000000-0000-0000-0000-000000000007" hx-target="body" hx-swap="outerHTML">
<input class="hidden" name="projectID" value="00000000-0000-0000-0000-000000000000">
<input class="hidden" name="id" value="00000000-0000-0000-0000-000000000007">
Static Pressure<label class="input w-full"><span class="label"></span>
<input name="staticPressure" type="number" value="0.5" min="0" max="1.0" step="0.1" required>
Heating CFM</label><label class="input w-full"><span class="label"></span>
<input name="heatingCFM" type="number" value="900" placeholder="1000" min="0" required autofocus>
Cooling CFM</label><label class="input w-full"><span class="label"></span>
<input name="coolingCFM" type="number" value="1000" placeholder="1000" min="0" required></label>
<button class="btn btn-secondary btn-block my-6" type="submit">Save</button>
</form>
</div>
</dialog>
</div>
</div>
</div>
<div class="drawer-side is-drawer-close:overflow-visible grow">
<label for="my-drawer-1" aria-label="close sidebar" class="drawer-overlay"></label>
<div class="flex grow h-full flex-col items-start bg-base-300 text-base-content
is-drawer-close:min-w-[80px] is-drawer-open:max-w-[300px]">
<ul class="w-full grow">
<li class="flex w-full">
<button class="w-full gap-1 py-2 border-b-1 border-gray-200
hover:bg-neutral data-active:bg-neutral
hover:text-white data-active:text-white
is-drawer-open:flex is-drawer-open:space-x-4
is-drawer-close:grid-cols-1" hx-get="/projects/00000000-0000-0000-0000-000000000000" hx-push-url="true" hx-target="body" hx-swap="outerHTML">
<div class="w-full p-2 gap-1
is-drawer-open:flex is-drawer-open:space-x-4
is-drawer-close:grid-cols-1">
<div class="items-center
is-drawer-open:justify-start is-drawer-open:flex is-drawer-open:space-x-4
is-drawer-close:justify-center is-drawer-close:mx-auto is-drawer-close:space-y-2">
<div class="flex items-center justify-center is-drawer-close:text-green-400"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-map-pin-icon lucide-map-pin"><path d="M20 10c0 4.993-5.539 10.193-7.399 11.799a1 1 0 0 1-1.202 0C9.539 20.193 4 14.993 4 10a8 8 0 0 1 16 0"/><circle cx="12" cy="10" r="3"/></svg></div>
<div class="flex items-center justify-center"><span>Project</span></div>
</div>
<div class="flex grow justify-end items-end is-drawer-close:hidden text-green-400"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-badge-check-icon lucide-badge-check"><path d="M3.85 8.62a4 4 0 0 1 4.78-4.77 4 4 0 0 1 6.74 0 4 4 0 0 1 4.78 4.78 4 4 0 0 1 0 6.74 4 4 0 0 1-4.77 4.78 4 4 0 0 1-6.75 0 4 4 0 0 1-4.78-4.77 4 4 0 0 1 0-6.76Z"/><path d="m9 12 2 2 4-4"/></svg></div>
</div>
</button>
</li>
<li class="w-full">
<button class="w-full gap-1 py-2 border-b-1 border-gray-200
hover:bg-neutral data-active:bg-neutral
hover:text-white data-active:text-white
is-drawer-open:flex is-drawer-open:space-x-4
is-drawer-close:grid-cols-1" hx-get="/projects/00000000-0000-0000-0000-000000000000/rooms" hx-push-url="true" hx-target="body" hx-swap="outerHTML">
<div class="w-full p-2 gap-1
is-drawer-open:flex is-drawer-open:space-x-4
is-drawer-close:grid-cols-1">
<div class="items-center
is-drawer-open:justify-start is-drawer-open:flex is-drawer-open:space-x-4
is-drawer-close:justify-center is-drawer-close:mx-auto is-drawer-close:space-y-2">
<div class="flex items-center justify-center is-drawer-close:text-green-400"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-door-closed-icon lucide-door-closed"><path d="M10 12h.01"/><path d="M18 20V6a2 2 0 0 0-2-2H8a2 2 0 0 0-2 2v14"/><path d="M2 20h20"/></svg></div>
<div class="flex items-center justify-center"><span>Rooms</span></div>
</div>
<div class="flex grow justify-end items-end is-drawer-close:hidden text-green-400"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-badge-check-icon lucide-badge-check"><path d="M3.85 8.62a4 4 0 0 1 4.78-4.77 4 4 0 0 1 6.74 0 4 4 0 0 1 4.78 4.78 4 4 0 0 1 0 6.74 4 4 0 0 1-4.77 4.78 4 4 0 0 1-6.75 0 4 4 0 0 1-4.78-4.77 4 4 0 0 1 0-6.76Z"/><path d="m9 12 2 2 4-4"/></svg></div>
</div>
</button>
</li>
<li class="flex w-full">
<button class="w-full gap-1 py-2 border-b-1 border-gray-200
hover:bg-neutral data-active:bg-neutral
hover:text-white data-active:text-white
is-drawer-open:flex is-drawer-open:space-x-4
is-drawer-close:grid-cols-1" hx-get="/projects/00000000-0000-0000-0000-000000000000/equipment" hx-push-url="true" hx-target="body" hx-swap="outerHTML" data-active="true">
<div class="w-full p-2 gap-1
is-drawer-open:flex is-drawer-open:space-x-4
is-drawer-close:grid-cols-1">
<div class="items-center
is-drawer-open:justify-start is-drawer-open:flex is-drawer-open:space-x-4
is-drawer-close:justify-center is-drawer-close:mx-auto is-drawer-close:space-y-2">
<div class="flex items-center justify-center is-drawer-close:text-green-400"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-fan-icon lucide-fan"><path d="M10.827 16.379a6.082 6.082 0 0 1-8.618-7.002l5.412 1.45a6.082 6.082 0 0 1 7.002-8.618l-1.45 5.412a6.082 6.082 0 0 1 8.618 7.002l-5.412-1.45a6.082 6.082 0 0 1-7.002 8.618l1.45-5.412Z"/><path d="M12 12v.01"/></svg></div>
<div class="flex items-center justify-center"><span>Equipment</span></div>
</div>
<div class="flex grow justify-end items-end is-drawer-close:hidden text-green-400"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-badge-check-icon lucide-badge-check"><path d="M3.85 8.62a4 4 0 0 1 4.78-4.77 4 4 0 0 1 6.74 0 4 4 0 0 1 4.78 4.78 4 4 0 0 1 0 6.74 4 4 0 0 1-4.77 4.78 4 4 0 0 1-6.75 0 4 4 0 0 1-4.78-4.77 4 4 0 0 1 0-6.76Z"/><path d="m9 12 2 2 4-4"/></svg></div>
</div>
</button>
</li>
<li class="w-full">
<button class="w-full gap-1 py-2 border-b-1 border-gray-200
hover:bg-neutral data-active:bg-neutral
hover:text-white data-active:text-white
is-drawer-open:flex is-drawer-open:space-x-4
is-drawer-close:grid-cols-1" hx-get="/projects/00000000-0000-0000-0000-000000000000/effective-lengths" hx-push-url="true" hx-target="body" hx-swap="outerHTML">
<div class="w-full p-2 gap-1
is-drawer-open:flex is-drawer-open:space-x-4
is-drawer-close:grid-cols-1">
<div class="items-center
is-drawer-open:justify-start is-drawer-open:flex is-drawer-open:space-x-4
is-drawer-close:justify-center is-drawer-close:mx-auto is-drawer-close:space-y-2">
<div class="flex items-center justify-center is-drawer-close:text-green-400"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-ruler-dimension-line-icon lucide-ruler-dimension-line"><path d="M10 15v-3"/><path d="M14 15v-3"/><path d="M18 15v-3"/><path d="M2 8V4"/><path d="M22 6H2"/><path d="M22 8V4"/><path d="M6 15v-3"/><rect x="2" y="12" width="20" height="8" rx="2"/></svg></div>
<div class="flex items-center justify-center"><span>T.E.L.</span></div>
</div>
<div class="flex grow justify-end items-end is-drawer-close:hidden text-green-400"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-badge-check-icon lucide-badge-check"><path d="M3.85 8.62a4 4 0 0 1 4.78-4.77 4 4 0 0 1 6.74 0 4 4 0 0 1 4.78 4.78 4 4 0 0 1 0 6.74 4 4 0 0 1-4.77 4.78 4 4 0 0 1-6.75 0 4 4 0 0 1-4.78-4.77 4 4 0 0 1 0-6.76Z"/><path d="m9 12 2 2 4-4"/></svg></div>
</div>
</button>
</li>
<li class="w-full">
<button class="w-full gap-1 py-2 border-b-1 border-gray-200
hover:bg-neutral data-active:bg-neutral
hover:text-white data-active:text-white
is-drawer-open:flex is-drawer-open:space-x-4
is-drawer-close:grid-cols-1" hx-get="/projects/00000000-0000-0000-0000-000000000000/friction-rate" hx-push-url="true" hx-target="body" hx-swap="outerHTML">
<div class="w-full p-2 gap-1
is-drawer-open:flex is-drawer-open:space-x-4
is-drawer-close:grid-cols-1">
<div class="items-center
is-drawer-open:justify-start is-drawer-open:flex is-drawer-open:space-x-4
is-drawer-close:justify-center is-drawer-close:mx-auto is-drawer-close:space-y-2">
<div class="flex items-center justify-center is-drawer-close:text-green-400"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-square-function-icon lucide-square-function"><rect width="18" height="18" x="3" y="3" rx="2" ry="2"/><path d="M9 17c2 0 2.8-1 2.8-2.8V10c0-2 1-3.3 3.2-3"/><path d="M9 11.2h5.7"/></svg></div>
<div class="flex items-center justify-center"><span>Friction Rate</span></div>
</div>
<div class="flex grow justify-end items-end is-drawer-close:hidden text-green-400"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-badge-check-icon lucide-badge-check"><path d="M3.85 8.62a4 4 0 0 1 4.78-4.77 4 4 0 0 1 6.74 0 4 4 0 0 1 4.78 4.78 4 4 0 0 1 0 6.74 4 4 0 0 1-4.77 4.78 4 4 0 0 1-6.75 0 4 4 0 0 1-4.78-4.77 4 4 0 0 1 0-6.76Z"/><path d="m9 12 2 2 4-4"/></svg></div>
</div>
</button>
</li>
<li class="w-full">
<button class="w-full gap-1 py-2 border-b-1 border-gray-200
hover:bg-neutral data-active:bg-neutral
hover:text-white data-active:text-white
is-drawer-open:flex is-drawer-open:space-x-4
is-drawer-close:grid-cols-1" hx-get="/projects/00000000-0000-0000-0000-000000000000/duct-sizing" hx-push-url="true" hx-target="body" hx-swap="outerHTML">
<div class="w-full p-2 gap-1
is-drawer-open:flex is-drawer-open:space-x-4
is-drawer-close:grid-cols-1">
<div class="items-center
is-drawer-open:justify-start is-drawer-open:flex is-drawer-open:space-x-4
is-drawer-close:justify-center is-drawer-close:mx-auto is-drawer-close:space-y-2">
<div class="flex items-center justify-center"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-wind-icon lucide-wind"><path d="M12.8 19.6A2 2 0 1 0 14 16H2"/><path d="M17.5 8a2.5 2.5 0 1 1 2 4H2"/><path d="M9.8 4.4A2 2 0 1 1 11 8H2"/></svg></div>
<div class="flex items-center justify-center"><span>Duct Sizes</span></div>
</div>
</div>
</button>
</li>
</ul>
</div>
</div>
</div>
</main>
<div class="bottom-0 left-0 bg-error">
<footer class="footer sm:footer-horizontal footer-center
bg-base-300 text-base-content p-4">
<aside>
<p>Copyright © 2026 - All rights reserved by Michael Housh</p>
</aside>
</footer>
</div>
</div>
</body>
</html>

View File

@@ -0,0 +1,366 @@
<!DOCTYPE html>
<html lang="en">
<head>
<title>Duct Calc</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta content="ductcalc.com" name="og:site_name">
<meta content="Duct Calc" name="og:title">
<meta content="Duct sizing based on ACCA, Manual-D." name="description">
<meta content="Duct sizing based on ACCA, Manual-D." name="og:description">
<meta content="/images/mand_logo.png" name="og:image">
<meta content="/images/mand_logo.png" name="twitter:image">
<meta content="Duct Calc" name="twitter:image:alt">
<meta content="summary_large_image" name="twitter:card">
<meta content="1536" name="og:image:width">
<meta content="1024" name="og:image:height">
<meta content="duct, hvac, duct-design, duct design, manual-d, manual d, design" name="keywords">
<script src="https://unpkg.com/htmx.org@2.0.8"></script>
<script src="/js/main.js"></script>
<link rel="stylesheet" href="/css/output.css">
<link rel="icon" href="/images/favicon.ico" type="image/x-icon">
<link rel="icon" href="/images/favicon-32x32.png" type="image/png">
<link rel="icon" href="/images/favicon-16x16.png" type="image/png">
<link rel="apple-touch-icon" sizes="180x180" href="/images/apple-touch-icon.png">
<link rel="manifest" href="/site.webmanifest">
<script src="https://unpkg.com/htmx-remove@latest" crossorigin="anonymous" integrity="sha384-NwB2Xh66PNEYfVki0ao13UAFmdNtMIdBKZ8sNGRT6hKfCPaINuZ4ScxS6vVAycPT"></script>
</head>
<body>
<div class="flex flex-col min-h-screen min-w-full justify-between">
<main class="flex flex-col min-h-screen min-w-full grow mb-auto">
<div class="drawer lg:drawer-open h-full">
<input id="my-drawer-1" type="checkbox" class="drawer-toggle">
<div class="drawer-content overflow-auto">
<nav class="navbar w-full bg-base-300 text-base-content shadow-sm mb-4">
<div class="flex flex-1 space-x-4 items-center">
<div class="tooltip tooltip-right" data-tip="Open sidebar"><label for="my-drawer-1" class="size-7 btn btn-square btn-ghost hover:bg-neutral hover:text-white" aria-label="open sidebar"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" stroke-linejoin="round" stroke-linecap="round" stroke-width="2" fill="none" stroke="currentColor" class="my-1.5 inline-block"><path d="M4 4m0 2a2 2 0 0 1 2 -2h12a2 2 0 0 1 2 2v12a2 2 0 0 1 -2 2h-12a2 2 0 0 1 -2 -2z"></path><path d="M9 4v16"></path><path d="M14 10l2 2l-2 2"></path></svg></label></div>
<div class="tooltip tooltip-right" data-tip="Home">
<a class="flex w-fit h-fit text-xl items-end px-4 py-2 btn btn-square btn-ghost hover:bg-neutral hover:text-white" href="/projects">
<img src="/images/mand_logo_sm.webp">
Duct Calc<span></span></a>
</div>
</div>
<div class="flex-none">
<div class="tooltip tooltip-left" data-tip="Profile"><a href="/profile" class="btn btn-square btn-ghost hover:bg-neutral hover:text-white"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-circle-user-icon lucide-circle-user"><circle cx="12" cy="12" r="10"/><circle cx="12" cy="10" r="3"/><path d="M7 20.662V19a2 2 0 0 1 2-2h6a2 2 0 0 1 2 2v1.662"/></svg></a></div>
</div>
</nav>
<div class="p-4">
<div class="space-y-4">
<div class="flex justify-between bg-secondary border-2 border-primary rounded-sm shadow-sm
p-6 w-full pb-6">
<h1 class="text-3xl font-bold">Equivalent Lengths</h1>
<div class="tooltip tooltip-left" data-tip="Add equivalent length">
<button type="button" class="btn btn-primary" onclick="equivalentLengthForm.showModal()"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-circle-plus-icon lucide-circle-plus"><circle cx="12" cy="12" r="10"/><path d="M8 12h8"/><path d="M12 8v8"/></svg></button>
</div>
</div>
<dialog id="equivalentLengthForm" class="modal">
<div class="modal-box">
<button class="btn btn-sm btn-circle btn-ghost absolute right-2 top-2" onclick="equivalentLengthForm.close()"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-x-icon lucide-x"><path d="M18 6 6 18"/><path d="m6 6 12 12"/></svg></button>
<h1 class="text-2xl font-bold">Effective Length</h1>
<div id="formStep_equivalentLengthForm" class="mt-4">
<form class="space-y-4" hx-post="/projects/00000000-0000-0000-0000-000000000000/effective-lengths/stepOne" hx-target="#formStep_equivalentLengthForm" hx-swap="innerHTML">
<label class="input w-full"><span class="label">Name</span>
<input name="name" type="text" value="" required autofocus>
Type</label><label class="select w-full"><span class="label"></span>
<select name="type" id="type">
<option value="return">Return</option>
<option value="supply" selected>Supply</option>
</select></label>
<div class="flex justify-between">
<div></div>
<button class="btn btn-secondary" type="submit">Next</button>
</div>
</form>
</div>
</div>
</dialog>
<table class="table table-zebra text-lg">
<thead>
<tr class="text-lg">
<th>Type</th>
<th>Name</th>
<th>Straight Lengths</th>
<th>
<div class="grid grid-cols-3 gap-2 min-w-[220px]">
<div class="flex justify-center col-span-3">Groups</div>
<div>Group</div>
<div class="flex justify-center">T.E.L.</div>
<div class="flex justify-end">Quantity</div>
</div>
</th>
<th>
<div class="flex justify-end me-[140px]">T.E.L.</div>
</th>
</tr>
</thead>
<tbody>
<tr id="00000000000000000000000000000008">
<td>
<div class="badge badge-lg badge-outline badge-info"><span>supply</span></div>
</td>
<td>Supply - 1</td>
<td>
<div class="grid grid-cols-1 gap-2"><span>10</span><span>25</span></div>
</td>
<td>
<div class="grid grid-cols-3 gap-2 min-w-[220px]">
<span>1-a</span>
<div class="flex justify-center"><span>20</span></div>
<div class="flex justify-end"><span>1</span></div>
2-b<span></span>
<div class="flex justify-center"><span>30</span></div>
<div class="flex justify-end"><span>1</span></div>
3-a<span></span>
<div class="flex justify-center"><span>10</span></div>
<div class="flex justify-end"><span>1</span></div>
12-a<span></span>
<div class="flex justify-center"><span>10</span></div>
<div class="flex justify-end"><span>1</span></div>
</div>
</td>
<td>
<div class="flex justify-end mx-auto space-x-4">
<div class="badge badge-lg badge-outline badge-primary badge-lg pt-2"><span>105</span></div>
<div class="flex justify-end -mt-2">
<div class="join">
<div class="tooltip tooltip-bottom" data-tip="Delete">
<button type="button" class="btn btn-error join-item btn-ghost" hx-delete="/projects/00000000-0000-0000-0000-000000000000/effective-lengths/00000000-0000-0000-0000-000000000008" hx-confirm="Are you sure?" hx-target="#00000000000000000000000000000008" hx-swap="outerHTML"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-trash2-icon lucide-trash-2"><path d="M10 11v6"/><path d="M14 11v6"/><path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"/><path d="M3 6h18"/><path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"/></svg></button>
</div>
<div class="tooltip tooltip-bottom" data-tip="Edit">
<button class="btn join-item btn-ghost" type="button" onclick="equivalentLengthForm_00000000000000000000000000000008.showModal()">
<div class="flex">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-square-pen-icon lucide-square-pen"><path d="M12 3H5a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7"/><path d="M18.375 2.625a1 1 0 0 1 3 3l-9.013 9.014a2 2 0 0 1-.853.505l-2.873.84a.5.5 0 0 1-.62-.62l.84-2.873a2 2 0 0 1 .506-.852z"/></svg>
</div>
</button>
</div>
</div>
</div>
</div>
<dialog id="equivalentLengthForm_00000000000000000000000000000008" class="modal">
<div class="modal-box">
<button class="btn btn-sm btn-circle btn-ghost absolute right-2 top-2" onclick="equivalentLengthForm_00000000000000000000000000000008.close()"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-x-icon lucide-x"><path d="M18 6 6 18"/><path d="m6 6 12 12"/></svg></button>
<h1 class="text-2xl font-bold">Effective Length</h1>
<div id="formStep_equivalentLengthForm_00000000000000000000000000000008" class="mt-4">
<form class="space-y-4" hx-post="/projects/00000000-0000-0000-0000-000000000000/effective-lengths/stepOne" hx-target="#formStep_equivalentLengthForm_00000000000000000000000000000008" hx-swap="innerHTML">
<input class="hidden" name="id" value="00000000-0000-0000-0000-000000000008">
Name<label class="input w-full"><span class="label"></span>
<input name="name" type="text" value="Supply - 1" required autofocus>
Type</label><label class="select w-full"><span class="label"></span>
<select name="type" id="type">
<option value="return">Return</option>
<option value="supply" selected>Supply</option>
</select></label>
<div class="flex justify-between">
<div></div>
<button class="btn btn-secondary" type="submit">Next</button>
</div>
</form>
</div>
</div>
</dialog>
</td>
</tr>
<tr id="00000000000000000000000000000009">
<td>
<div class="badge badge-lg badge-outline badge-error"><span>return</span></div>
</td>
<td>Return - 1</td>
<td>
<div class="grid grid-cols-1 gap-2"><span>10</span><span>20</span><span>5</span></div>
</td>
<td>
<div class="grid grid-cols-3 gap-2 min-w-[220px]">
<span>5-a</span>
<div class="flex justify-center"><span>10</span></div>
<div class="flex justify-end"><span>1</span></div>
6-a<span></span>
<div class="flex justify-center"><span>15</span></div>
<div class="flex justify-end"><span>1</span></div>
7-a<span></span>
<div class="flex justify-center"><span>20</span></div>
<div class="flex justify-end"><span>1</span></div>
</div>
</td>
<td>
<div class="flex justify-end mx-auto space-x-4">
<div class="badge badge-lg badge-outline badge-primary badge-lg pt-2"><span>80</span></div>
<div class="flex justify-end -mt-2">
<div class="join">
<div class="tooltip tooltip-bottom" data-tip="Delete">
<button type="button" class="btn btn-error join-item btn-ghost" hx-delete="/projects/00000000-0000-0000-0000-000000000000/effective-lengths/00000000-0000-0000-0000-000000000009" hx-confirm="Are you sure?" hx-target="#00000000000000000000000000000009" hx-swap="outerHTML"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-trash2-icon lucide-trash-2"><path d="M10 11v6"/><path d="M14 11v6"/><path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"/><path d="M3 6h18"/><path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"/></svg></button>
</div>
<div class="tooltip tooltip-bottom" data-tip="Edit">
<button class="btn join-item btn-ghost" type="button" onclick="equivalentLengthForm_00000000000000000000000000000009.showModal()">
<div class="flex">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-square-pen-icon lucide-square-pen"><path d="M12 3H5a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7"/><path d="M18.375 2.625a1 1 0 0 1 3 3l-9.013 9.014a2 2 0 0 1-.853.505l-2.873.84a.5.5 0 0 1-.62-.62l.84-2.873a2 2 0 0 1 .506-.852z"/></svg>
</div>
</button>
</div>
</div>
</div>
</div>
<dialog id="equivalentLengthForm_00000000000000000000000000000009" class="modal">
<div class="modal-box">
<button class="btn btn-sm btn-circle btn-ghost absolute right-2 top-2" onclick="equivalentLengthForm_00000000000000000000000000000009.close()"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-x-icon lucide-x"><path d="M18 6 6 18"/><path d="m6 6 12 12"/></svg></button>
<h1 class="text-2xl font-bold">Effective Length</h1>
<div id="formStep_equivalentLengthForm_00000000000000000000000000000009" class="mt-4">
<form class="space-y-4" hx-post="/projects/00000000-0000-0000-0000-000000000000/effective-lengths/stepOne" hx-target="#formStep_equivalentLengthForm_00000000000000000000000000000009" hx-swap="innerHTML">
<input class="hidden" name="id" value="00000000-0000-0000-0000-000000000009">
Name<label class="input w-full"><span class="label"></span>
<input name="name" type="text" value="Return - 1" required autofocus>
Type</label><label class="select w-full"><span class="label"></span>
<select name="type" id="type">
<option value="return" selected>Return</option>
<option value="supply">Supply</option>
</select></label>
<div class="flex justify-between">
<div></div>
<button class="btn btn-secondary" type="submit">Next</button>
</div>
</form>
</div>
</div>
</dialog>
</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
<div class="drawer-side is-drawer-close:overflow-visible grow">
<label for="my-drawer-1" aria-label="close sidebar" class="drawer-overlay"></label>
<div class="flex grow h-full flex-col items-start bg-base-300 text-base-content
is-drawer-close:min-w-[80px] is-drawer-open:max-w-[300px]">
<ul class="w-full grow">
<li class="flex w-full">
<button class="w-full gap-1 py-2 border-b-1 border-gray-200
hover:bg-neutral data-active:bg-neutral
hover:text-white data-active:text-white
is-drawer-open:flex is-drawer-open:space-x-4
is-drawer-close:grid-cols-1" hx-get="/projects/00000000-0000-0000-0000-000000000000" hx-push-url="true" hx-target="body" hx-swap="outerHTML">
<div class="w-full p-2 gap-1
is-drawer-open:flex is-drawer-open:space-x-4
is-drawer-close:grid-cols-1">
<div class="items-center
is-drawer-open:justify-start is-drawer-open:flex is-drawer-open:space-x-4
is-drawer-close:justify-center is-drawer-close:mx-auto is-drawer-close:space-y-2">
<div class="flex items-center justify-center is-drawer-close:text-green-400"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-map-pin-icon lucide-map-pin"><path d="M20 10c0 4.993-5.539 10.193-7.399 11.799a1 1 0 0 1-1.202 0C9.539 20.193 4 14.993 4 10a8 8 0 0 1 16 0"/><circle cx="12" cy="10" r="3"/></svg></div>
<div class="flex items-center justify-center"><span>Project</span></div>
</div>
<div class="flex grow justify-end items-end is-drawer-close:hidden text-green-400"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-badge-check-icon lucide-badge-check"><path d="M3.85 8.62a4 4 0 0 1 4.78-4.77 4 4 0 0 1 6.74 0 4 4 0 0 1 4.78 4.78 4 4 0 0 1 0 6.74 4 4 0 0 1-4.77 4.78 4 4 0 0 1-6.75 0 4 4 0 0 1-4.78-4.77 4 4 0 0 1 0-6.76Z"/><path d="m9 12 2 2 4-4"/></svg></div>
</div>
</button>
</li>
<li class="w-full">
<button class="w-full gap-1 py-2 border-b-1 border-gray-200
hover:bg-neutral data-active:bg-neutral
hover:text-white data-active:text-white
is-drawer-open:flex is-drawer-open:space-x-4
is-drawer-close:grid-cols-1" hx-get="/projects/00000000-0000-0000-0000-000000000000/rooms" hx-push-url="true" hx-target="body" hx-swap="outerHTML">
<div class="w-full p-2 gap-1
is-drawer-open:flex is-drawer-open:space-x-4
is-drawer-close:grid-cols-1">
<div class="items-center
is-drawer-open:justify-start is-drawer-open:flex is-drawer-open:space-x-4
is-drawer-close:justify-center is-drawer-close:mx-auto is-drawer-close:space-y-2">
<div class="flex items-center justify-center is-drawer-close:text-green-400"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-door-closed-icon lucide-door-closed"><path d="M10 12h.01"/><path d="M18 20V6a2 2 0 0 0-2-2H8a2 2 0 0 0-2 2v14"/><path d="M2 20h20"/></svg></div>
<div class="flex items-center justify-center"><span>Rooms</span></div>
</div>
<div class="flex grow justify-end items-end is-drawer-close:hidden text-green-400"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-badge-check-icon lucide-badge-check"><path d="M3.85 8.62a4 4 0 0 1 4.78-4.77 4 4 0 0 1 6.74 0 4 4 0 0 1 4.78 4.78 4 4 0 0 1 0 6.74 4 4 0 0 1-4.77 4.78 4 4 0 0 1-6.75 0 4 4 0 0 1-4.78-4.77 4 4 0 0 1 0-6.76Z"/><path d="m9 12 2 2 4-4"/></svg></div>
</div>
</button>
</li>
<li class="flex w-full">
<button class="w-full gap-1 py-2 border-b-1 border-gray-200
hover:bg-neutral data-active:bg-neutral
hover:text-white data-active:text-white
is-drawer-open:flex is-drawer-open:space-x-4
is-drawer-close:grid-cols-1" hx-get="/projects/00000000-0000-0000-0000-000000000000/equipment" hx-push-url="true" hx-target="body" hx-swap="outerHTML">
<div class="w-full p-2 gap-1
is-drawer-open:flex is-drawer-open:space-x-4
is-drawer-close:grid-cols-1">
<div class="items-center
is-drawer-open:justify-start is-drawer-open:flex is-drawer-open:space-x-4
is-drawer-close:justify-center is-drawer-close:mx-auto is-drawer-close:space-y-2">
<div class="flex items-center justify-center is-drawer-close:text-green-400"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-fan-icon lucide-fan"><path d="M10.827 16.379a6.082 6.082 0 0 1-8.618-7.002l5.412 1.45a6.082 6.082 0 0 1 7.002-8.618l-1.45 5.412a6.082 6.082 0 0 1 8.618 7.002l-5.412-1.45a6.082 6.082 0 0 1-7.002 8.618l1.45-5.412Z"/><path d="M12 12v.01"/></svg></div>
<div class="flex items-center justify-center"><span>Equipment</span></div>
</div>
<div class="flex grow justify-end items-end is-drawer-close:hidden text-green-400"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-badge-check-icon lucide-badge-check"><path d="M3.85 8.62a4 4 0 0 1 4.78-4.77 4 4 0 0 1 6.74 0 4 4 0 0 1 4.78 4.78 4 4 0 0 1 0 6.74 4 4 0 0 1-4.77 4.78 4 4 0 0 1-6.75 0 4 4 0 0 1-4.78-4.77 4 4 0 0 1 0-6.76Z"/><path d="m9 12 2 2 4-4"/></svg></div>
</div>
</button>
</li>
<li class="w-full">
<button class="w-full gap-1 py-2 border-b-1 border-gray-200
hover:bg-neutral data-active:bg-neutral
hover:text-white data-active:text-white
is-drawer-open:flex is-drawer-open:space-x-4
is-drawer-close:grid-cols-1" hx-get="/projects/00000000-0000-0000-0000-000000000000/effective-lengths" hx-push-url="true" hx-target="body" hx-swap="outerHTML" data-active="true">
<div class="w-full p-2 gap-1
is-drawer-open:flex is-drawer-open:space-x-4
is-drawer-close:grid-cols-1">
<div class="items-center
is-drawer-open:justify-start is-drawer-open:flex is-drawer-open:space-x-4
is-drawer-close:justify-center is-drawer-close:mx-auto is-drawer-close:space-y-2">
<div class="flex items-center justify-center is-drawer-close:text-green-400"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-ruler-dimension-line-icon lucide-ruler-dimension-line"><path d="M10 15v-3"/><path d="M14 15v-3"/><path d="M18 15v-3"/><path d="M2 8V4"/><path d="M22 6H2"/><path d="M22 8V4"/><path d="M6 15v-3"/><rect x="2" y="12" width="20" height="8" rx="2"/></svg></div>
<div class="flex items-center justify-center"><span>T.E.L.</span></div>
</div>
<div class="flex grow justify-end items-end is-drawer-close:hidden text-green-400"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-badge-check-icon lucide-badge-check"><path d="M3.85 8.62a4 4 0 0 1 4.78-4.77 4 4 0 0 1 6.74 0 4 4 0 0 1 4.78 4.78 4 4 0 0 1 0 6.74 4 4 0 0 1-4.77 4.78 4 4 0 0 1-6.75 0 4 4 0 0 1-4.78-4.77 4 4 0 0 1 0-6.76Z"/><path d="m9 12 2 2 4-4"/></svg></div>
</div>
</button>
</li>
<li class="w-full">
<button class="w-full gap-1 py-2 border-b-1 border-gray-200
hover:bg-neutral data-active:bg-neutral
hover:text-white data-active:text-white
is-drawer-open:flex is-drawer-open:space-x-4
is-drawer-close:grid-cols-1" hx-get="/projects/00000000-0000-0000-0000-000000000000/friction-rate" hx-push-url="true" hx-target="body" hx-swap="outerHTML">
<div class="w-full p-2 gap-1
is-drawer-open:flex is-drawer-open:space-x-4
is-drawer-close:grid-cols-1">
<div class="items-center
is-drawer-open:justify-start is-drawer-open:flex is-drawer-open:space-x-4
is-drawer-close:justify-center is-drawer-close:mx-auto is-drawer-close:space-y-2">
<div class="flex items-center justify-center is-drawer-close:text-green-400"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-square-function-icon lucide-square-function"><rect width="18" height="18" x="3" y="3" rx="2" ry="2"/><path d="M9 17c2 0 2.8-1 2.8-2.8V10c0-2 1-3.3 3.2-3"/><path d="M9 11.2h5.7"/></svg></div>
<div class="flex items-center justify-center"><span>Friction Rate</span></div>
</div>
<div class="flex grow justify-end items-end is-drawer-close:hidden text-green-400"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-badge-check-icon lucide-badge-check"><path d="M3.85 8.62a4 4 0 0 1 4.78-4.77 4 4 0 0 1 6.74 0 4 4 0 0 1 4.78 4.78 4 4 0 0 1 0 6.74 4 4 0 0 1-4.77 4.78 4 4 0 0 1-6.75 0 4 4 0 0 1-4.78-4.77 4 4 0 0 1 0-6.76Z"/><path d="m9 12 2 2 4-4"/></svg></div>
</div>
</button>
</li>
<li class="w-full">
<button class="w-full gap-1 py-2 border-b-1 border-gray-200
hover:bg-neutral data-active:bg-neutral
hover:text-white data-active:text-white
is-drawer-open:flex is-drawer-open:space-x-4
is-drawer-close:grid-cols-1" hx-get="/projects/00000000-0000-0000-0000-000000000000/duct-sizing" hx-push-url="true" hx-target="body" hx-swap="outerHTML">
<div class="w-full p-2 gap-1
is-drawer-open:flex is-drawer-open:space-x-4
is-drawer-close:grid-cols-1">
<div class="items-center
is-drawer-open:justify-start is-drawer-open:flex is-drawer-open:space-x-4
is-drawer-close:justify-center is-drawer-close:mx-auto is-drawer-close:space-y-2">
<div class="flex items-center justify-center"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-wind-icon lucide-wind"><path d="M12.8 19.6A2 2 0 1 0 14 16H2"/><path d="M17.5 8a2.5 2.5 0 1 1 2 4H2"/><path d="M9.8 4.4A2 2 0 1 1 11 8H2"/></svg></div>
<div class="flex items-center justify-center"><span>Duct Sizes</span></div>
</div>
</div>
</button>
</li>
</ul>
</div>
</div>
</div>
</main>
<div class="bottom-0 left-0 bg-error">
<footer class="footer sm:footer-horizontal footer-center
bg-base-300 text-base-content p-4">
<aside>
<p>Copyright © 2026 - All rights reserved by Michael Housh</p>
</aside>
</footer>
</div>
</div>
</body>
</html>

View File

@@ -0,0 +1,442 @@
<!DOCTYPE html>
<html lang="en">
<head>
<title>Duct Calc</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta content="ductcalc.com" name="og:site_name">
<meta content="Duct Calc" name="og:title">
<meta content="Duct sizing based on ACCA, Manual-D." name="description">
<meta content="Duct sizing based on ACCA, Manual-D." name="og:description">
<meta content="/images/mand_logo.png" name="og:image">
<meta content="/images/mand_logo.png" name="twitter:image">
<meta content="Duct Calc" name="twitter:image:alt">
<meta content="summary_large_image" name="twitter:card">
<meta content="1536" name="og:image:width">
<meta content="1024" name="og:image:height">
<meta content="duct, hvac, duct-design, duct design, manual-d, manual d, design" name="keywords">
<script src="https://unpkg.com/htmx.org@2.0.8"></script>
<script src="/js/main.js"></script>
<link rel="stylesheet" href="/css/output.css">
<link rel="icon" href="/images/favicon.ico" type="image/x-icon">
<link rel="icon" href="/images/favicon-32x32.png" type="image/png">
<link rel="icon" href="/images/favicon-16x16.png" type="image/png">
<link rel="apple-touch-icon" sizes="180x180" href="/images/apple-touch-icon.png">
<link rel="manifest" href="/site.webmanifest">
<script src="https://unpkg.com/htmx-remove@latest" crossorigin="anonymous" integrity="sha384-NwB2Xh66PNEYfVki0ao13UAFmdNtMIdBKZ8sNGRT6hKfCPaINuZ4ScxS6vVAycPT"></script>
</head>
<body>
<div class="flex flex-col min-h-screen min-w-full justify-between">
<main class="flex flex-col min-h-screen min-w-full grow mb-auto">
<div class="drawer lg:drawer-open h-full">
<input id="my-drawer-1" type="checkbox" class="drawer-toggle">
<div class="drawer-content overflow-auto">
<nav class="navbar w-full bg-base-300 text-base-content shadow-sm mb-4">
<div class="flex flex-1 space-x-4 items-center">
<div class="tooltip tooltip-right" data-tip="Open sidebar"><label for="my-drawer-1" class="size-7 btn btn-square btn-ghost hover:bg-neutral hover:text-white" aria-label="open sidebar"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" stroke-linejoin="round" stroke-linecap="round" stroke-width="2" fill="none" stroke="currentColor" class="my-1.5 inline-block"><path d="M4 4m0 2a2 2 0 0 1 2 -2h12a2 2 0 0 1 2 2v12a2 2 0 0 1 -2 2h-12a2 2 0 0 1 -2 -2z"></path><path d="M9 4v16"></path><path d="M14 10l2 2l-2 2"></path></svg></label></div>
<div class="tooltip tooltip-right" data-tip="Home">
<a class="flex w-fit h-fit text-xl items-end px-4 py-2 btn btn-square btn-ghost hover:bg-neutral hover:text-white" href="/projects">
<img src="/images/mand_logo_sm.webp">
Duct Calc<span></span></a>
</div>
</div>
<div class="flex-none">
<div class="tooltip tooltip-left" data-tip="Profile"><a href="/profile" class="btn btn-square btn-ghost hover:bg-neutral hover:text-white"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-circle-user-icon lucide-circle-user"><circle cx="12" cy="12" r="10"/><circle cx="12" cy="10" r="3"/><path d="M7 20.662V19a2 2 0 0 1 2-2h6a2 2 0 0 1 2 2v1.662"/></svg></a></div>
</div>
</nav>
<div class="p-4">
<div class="space-y-6">
<div class="flex justify-between bg-secondary border-2 border-primary rounded-sm shadow-sm
p-6 w-full">
<div class="grid grid-cols-2 px-4 w-full">
<h1 class="text-3xl font-bold">Friction Rate</h1>
<div class="space-y-2 justify-end font-bold text-lg">
<div class="flex space-x-4 justify-end mx-auto">
<span>Friction Rate Design Value</span>
<div class="badge badge-lg badge-outline badge-info badge-lg font-bold"><span>0.06</span></div>
</div>
<div class="flex space-x-4 justify-end mx-auto">
<span>Available Static Pressure</span>
<div class="badge badge-lg badge-outline"><span>0.11</span></div>
</div>
<div class="flex space-x-4 justify-end mx-auto">
<span>Component Pressure Losses</span>
<div class="badge badge-lg badge-outline"><span>0.39</span></div>
</div>
</div>
<div class="text-error font-bold italic col-span-2">
<div class="flex space-x-2 hidden">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-triangle-alert-icon lucide-triangle-alert"><path d="m21.73 18-8-14a2 2 0 0 0-3.48 0l-8 14A2 2 0 0 0 4 21h16a2 2 0 0 0 1.73-3"/><path d="M12 9v4"/><path d="M12 17h.01"/></svg>
<p>Must complete previous sections.</p>
</div>
<div class="flex space-x-2 hidden">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-triangle-alert-icon lucide-triangle-alert"><path d="m21.73 18-8-14a2 2 0 0 0-3.48 0l-8 14A2 2 0 0 0 4 21h16a2 2 0 0 0 1.73-3"/><path d="M12 9v4"/><path d="M12 17h.01"/></svg>
<p>No component pressures losses</p>
</div>
<div class="flex space-x-2 hidden">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-triangle-alert-icon lucide-triangle-alert"><path d="m21.73 18-8-14a2 2 0 0 0-3.48 0l-8 14A2 2 0 0 0 4 21h16a2 2 0 0 0 1.73-3"/><path d="M12 9v4"/><path d="M12 17h.01"/></svg>
<p class="block">
Calculated friction rate is below 0.02. The fan may not deliver the required CFM.
<br>
* Increase the blower speed
<br>
* Increase the blower size
<br>
* Decrease the Total Effective Length (TEL)
</p>
</div>
<div class="flex space-x-2 hidden">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-triangle-alert-icon lucide-triangle-alert"><path d="m21.73 18-8-14a2 2 0 0 0-3.48 0l-8 14A2 2 0 0 0 4 21h16a2 2 0 0 0 1.73-3"/><path d="M12 9v4"/><path d="M12 17h.01"/></svg>
<p class="block">
Calculated friction rate is above 0.18. The fan may deliver too many CFM.
<br>
* Decrease the blower speed
<br>
* Decreae the blower size
<br>
* Increase the Total Effective Length (TEL)
</p>
</div>
</div>
</div>
</div>
<div class="space-y-4">
<div class="flex justify-between px-4">
<h1 class="text-2xl font-bold">Component Pressure Losses</h1>
<div class="tooltip tooltip-left" data-tip="Add component loss">
<button type="button" class="btn btn-primary text-2xl me-2" onclick="componentLossForm.showModal()"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-circle-plus-icon lucide-circle-plus"><circle cx="12" cy="12" r="10"/><path d="M8 12h8"/><path d="M12 8v8"/></svg></button>
</div>
</div>
<table class="table table-zebra">
<thead>
<tr class="text-xl font-bold">
<th>Name</th>
<th>Value</th>
<th class="min-w-[200px]"></th>
</tr>
</thead>
<tbody>
<tr class="text-lg">
<td>evaporator-coil</td>
<td><span>0.2</span></td>
<td>
<div class="flex join items-end justify-end mx-auto">
<div class="tooltip tooltip-bottom" data-tip="Delete">
<button type="button" class="btn btn-error join-item btn-ghost" hx-delete="/projects/00000000-0000-0000-0000-000000000000/component-loss/00000000-0000-0000-0000-00000000000A" hx-target="body" hx-swap="outerHTML" hx-confirm="Are your sure?"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-trash2-icon lucide-trash-2"><path d="M10 11v6"/><path d="M14 11v6"/><path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"/><path d="M3 6h18"/><path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"/></svg></button>
</div>
<div class="tooltip tooltip-bottom" data-tip="Edit">
<button class="btn join-item btn-ghost" type="button" onclick="componentLossForm_0000000000000000000000000000000A.showModal()">
<div class="flex">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-square-pen-icon lucide-square-pen"><path d="M12 3H5a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7"/><path d="M18.375 2.625a1 1 0 0 1 3 3l-9.013 9.014a2 2 0 0 1-.853.505l-2.873.84a.5.5 0 0 1-.62-.62l.84-2.873a2 2 0 0 1 .506-.852z"/></svg>
</div>
</button>
</div>
</div>
<dialog id="componentLossForm_0000000000000000000000000000000A" class="modal">
<div class="modal-box">
<button class="btn btn-sm btn-circle btn-ghost absolute right-2 top-2" onclick="componentLossForm_0000000000000000000000000000000A.close()"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-x-icon lucide-x"><path d="M18 6 6 18"/><path d="m6 6 12 12"/></svg></button>
<h1 class="text-2xl font-bold">Component Loss</h1>
<form class="space-y-4 p-4" hx-patch="/projects/00000000-0000-0000-0000-000000000000/component-loss/00000000-0000-0000-0000-00000000000A" hx-target="body" hx-swap="outerHTML">
<input class="hidden" name="id" value="00000000-0000-0000-0000-00000000000A">
<input class="hidden" name="projectID" value="00000000-0000-0000-0000-000000000000">
Name<label class="input w-full"><span class="label"></span>
<input name="name" type="text" value="evaporator-coil" placeholder="Name" required autofocus>
Value</label><label class="input w-full"><span class="label"></span>
<input name="value" type="number" value="0.2" placeholder="0.2" min="0.03" max="1.0" step="0.01" required></label>
<button class="btn btn-secondary btn-block" type="submit">Submit</button>
</form>
</div>
</dialog>
</td>
</tr>
<tr class="text-lg">
<td>filter</td>
<td><span>0.1</span></td>
<td>
<div class="flex join items-end justify-end mx-auto">
<div class="tooltip tooltip-bottom" data-tip="Delete">
<button type="button" class="btn btn-error join-item btn-ghost" hx-delete="/projects/00000000-0000-0000-0000-000000000000/component-loss/00000000-0000-0000-0000-00000000000B" hx-target="body" hx-swap="outerHTML" hx-confirm="Are your sure?"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-trash2-icon lucide-trash-2"><path d="M10 11v6"/><path d="M14 11v6"/><path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"/><path d="M3 6h18"/><path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"/></svg></button>
</div>
<div class="tooltip tooltip-bottom" data-tip="Edit">
<button class="btn join-item btn-ghost" type="button" onclick="componentLossForm_0000000000000000000000000000000B.showModal()">
<div class="flex">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-square-pen-icon lucide-square-pen"><path d="M12 3H5a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7"/><path d="M18.375 2.625a1 1 0 0 1 3 3l-9.013 9.014a2 2 0 0 1-.853.505l-2.873.84a.5.5 0 0 1-.62-.62l.84-2.873a2 2 0 0 1 .506-.852z"/></svg>
</div>
</button>
</div>
</div>
<dialog id="componentLossForm_0000000000000000000000000000000B" class="modal">
<div class="modal-box">
<button class="btn btn-sm btn-circle btn-ghost absolute right-2 top-2" onclick="componentLossForm_0000000000000000000000000000000B.close()"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-x-icon lucide-x"><path d="M18 6 6 18"/><path d="m6 6 12 12"/></svg></button>
<h1 class="text-2xl font-bold">Component Loss</h1>
<form class="space-y-4 p-4" hx-patch="/projects/00000000-0000-0000-0000-000000000000/component-loss/00000000-0000-0000-0000-00000000000B" hx-target="body" hx-swap="outerHTML">
<input class="hidden" name="id" value="00000000-0000-0000-0000-00000000000B">
<input class="hidden" name="projectID" value="00000000-0000-0000-0000-000000000000">
Name<label class="input w-full"><span class="label"></span>
<input name="name" type="text" value="filter" placeholder="Name" required autofocus>
Value</label><label class="input w-full"><span class="label"></span>
<input name="value" type="number" value="0.1" placeholder="0.2" min="0.03" max="1.0" step="0.01" required></label>
<button class="btn btn-secondary btn-block" type="submit">Submit</button>
</form>
</div>
</dialog>
</td>
</tr>
<tr class="text-lg">
<td>supply-outlet</td>
<td><span>0.03</span></td>
<td>
<div class="flex join items-end justify-end mx-auto">
<div class="tooltip tooltip-bottom" data-tip="Delete">
<button type="button" class="btn btn-error join-item btn-ghost" hx-delete="/projects/00000000-0000-0000-0000-000000000000/component-loss/00000000-0000-0000-0000-00000000000C" hx-target="body" hx-swap="outerHTML" hx-confirm="Are your sure?"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-trash2-icon lucide-trash-2"><path d="M10 11v6"/><path d="M14 11v6"/><path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"/><path d="M3 6h18"/><path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"/></svg></button>
</div>
<div class="tooltip tooltip-bottom" data-tip="Edit">
<button class="btn join-item btn-ghost" type="button" onclick="componentLossForm_0000000000000000000000000000000C.showModal()">
<div class="flex">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-square-pen-icon lucide-square-pen"><path d="M12 3H5a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7"/><path d="M18.375 2.625a1 1 0 0 1 3 3l-9.013 9.014a2 2 0 0 1-.853.505l-2.873.84a.5.5 0 0 1-.62-.62l.84-2.873a2 2 0 0 1 .506-.852z"/></svg>
</div>
</button>
</div>
</div>
<dialog id="componentLossForm_0000000000000000000000000000000C" class="modal">
<div class="modal-box">
<button class="btn btn-sm btn-circle btn-ghost absolute right-2 top-2" onclick="componentLossForm_0000000000000000000000000000000C.close()"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-x-icon lucide-x"><path d="M18 6 6 18"/><path d="m6 6 12 12"/></svg></button>
<h1 class="text-2xl font-bold">Component Loss</h1>
<form class="space-y-4 p-4" hx-patch="/projects/00000000-0000-0000-0000-000000000000/component-loss/00000000-0000-0000-0000-00000000000C" hx-target="body" hx-swap="outerHTML">
<input class="hidden" name="id" value="00000000-0000-0000-0000-00000000000C">
<input class="hidden" name="projectID" value="00000000-0000-0000-0000-000000000000">
Name<label class="input w-full"><span class="label"></span>
<input name="name" type="text" value="supply-outlet" placeholder="Name" required autofocus>
Value</label><label class="input w-full"><span class="label"></span>
<input name="value" type="number" value="0.03" placeholder="0.2" min="0.03" max="1.0" step="0.01" required></label>
<button class="btn btn-secondary btn-block" type="submit">Submit</button>
</form>
</div>
</dialog>
</td>
</tr>
<tr class="text-lg">
<td>return-grille</td>
<td><span>0.03</span></td>
<td>
<div class="flex join items-end justify-end mx-auto">
<div class="tooltip tooltip-bottom" data-tip="Delete">
<button type="button" class="btn btn-error join-item btn-ghost" hx-delete="/projects/00000000-0000-0000-0000-000000000000/component-loss/00000000-0000-0000-0000-00000000000D" hx-target="body" hx-swap="outerHTML" hx-confirm="Are your sure?"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-trash2-icon lucide-trash-2"><path d="M10 11v6"/><path d="M14 11v6"/><path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"/><path d="M3 6h18"/><path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"/></svg></button>
</div>
<div class="tooltip tooltip-bottom" data-tip="Edit">
<button class="btn join-item btn-ghost" type="button" onclick="componentLossForm_0000000000000000000000000000000D.showModal()">
<div class="flex">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-square-pen-icon lucide-square-pen"><path d="M12 3H5a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7"/><path d="M18.375 2.625a1 1 0 0 1 3 3l-9.013 9.014a2 2 0 0 1-.853.505l-2.873.84a.5.5 0 0 1-.62-.62l.84-2.873a2 2 0 0 1 .506-.852z"/></svg>
</div>
</button>
</div>
</div>
<dialog id="componentLossForm_0000000000000000000000000000000D" class="modal">
<div class="modal-box">
<button class="btn btn-sm btn-circle btn-ghost absolute right-2 top-2" onclick="componentLossForm_0000000000000000000000000000000D.close()"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-x-icon lucide-x"><path d="M18 6 6 18"/><path d="m6 6 12 12"/></svg></button>
<h1 class="text-2xl font-bold">Component Loss</h1>
<form class="space-y-4 p-4" hx-patch="/projects/00000000-0000-0000-0000-000000000000/component-loss/00000000-0000-0000-0000-00000000000D" hx-target="body" hx-swap="outerHTML">
<input class="hidden" name="id" value="00000000-0000-0000-0000-00000000000D">
<input class="hidden" name="projectID" value="00000000-0000-0000-0000-000000000000">
Name<label class="input w-full"><span class="label"></span>
<input name="name" type="text" value="return-grille" placeholder="Name" required autofocus>
Value</label><label class="input w-full"><span class="label"></span>
<input name="value" type="number" value="0.03" placeholder="0.2" min="0.03" max="1.0" step="0.01" required></label>
<button class="btn btn-secondary btn-block" type="submit">Submit</button>
</form>
</div>
</dialog>
</td>
</tr>
<tr class="text-lg">
<td>balancing-damper</td>
<td><span>0.03</span></td>
<td>
<div class="flex join items-end justify-end mx-auto">
<div class="tooltip tooltip-bottom" data-tip="Delete">
<button type="button" class="btn btn-error join-item btn-ghost" hx-delete="/projects/00000000-0000-0000-0000-000000000000/component-loss/00000000-0000-0000-0000-00000000000E" hx-target="body" hx-swap="outerHTML" hx-confirm="Are your sure?"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-trash2-icon lucide-trash-2"><path d="M10 11v6"/><path d="M14 11v6"/><path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"/><path d="M3 6h18"/><path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"/></svg></button>
</div>
<div class="tooltip tooltip-bottom" data-tip="Edit">
<button class="btn join-item btn-ghost" type="button" onclick="componentLossForm_0000000000000000000000000000000E.showModal()">
<div class="flex">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-square-pen-icon lucide-square-pen"><path d="M12 3H5a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7"/><path d="M18.375 2.625a1 1 0 0 1 3 3l-9.013 9.014a2 2 0 0 1-.853.505l-2.873.84a.5.5 0 0 1-.62-.62l.84-2.873a2 2 0 0 1 .506-.852z"/></svg>
</div>
</button>
</div>
</div>
<dialog id="componentLossForm_0000000000000000000000000000000E" class="modal">
<div class="modal-box">
<button class="btn btn-sm btn-circle btn-ghost absolute right-2 top-2" onclick="componentLossForm_0000000000000000000000000000000E.close()"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-x-icon lucide-x"><path d="M18 6 6 18"/><path d="m6 6 12 12"/></svg></button>
<h1 class="text-2xl font-bold">Component Loss</h1>
<form class="space-y-4 p-4" hx-patch="/projects/00000000-0000-0000-0000-000000000000/component-loss/00000000-0000-0000-0000-00000000000E" hx-target="body" hx-swap="outerHTML">
<input class="hidden" name="id" value="00000000-0000-0000-0000-00000000000E">
<input class="hidden" name="projectID" value="00000000-0000-0000-0000-000000000000">
Name<label class="input w-full"><span class="label"></span>
<input name="name" type="text" value="balancing-damper" placeholder="Name" required autofocus>
Value</label><label class="input w-full"><span class="label"></span>
<input name="value" type="number" value="0.03" placeholder="0.2" min="0.03" max="1.0" step="0.01" required></label>
<button class="btn btn-secondary btn-block" type="submit">Submit</button>
</form>
</div>
</dialog>
</td>
</tr>
</tbody>
</table>
</div>
<dialog id="componentLossForm" class="modal">
<div class="modal-box">
<button class="btn btn-sm btn-circle btn-ghost absolute right-2 top-2" onclick="componentLossForm.close()"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-x-icon lucide-x"><path d="M18 6 6 18"/><path d="m6 6 12 12"/></svg></button>
<h1 class="text-2xl font-bold">Component Loss</h1>
<form class="space-y-4 p-4" hx-post="/projects/00000000-0000-0000-0000-000000000000/component-loss" hx-target="body" hx-swap="outerHTML">
<input class="hidden" name="projectID" value="00000000-0000-0000-0000-000000000000">
Name<label class="input w-full"><span class="label"></span>
<input name="name" type="text" value="" placeholder="Name" required autofocus>
Value</label><label class="input w-full"><span class="label"></span>
<input name="value" type="number" value="" placeholder="0.2" min="0.03" max="1.0" step="0.01" required></label>
<button class="btn btn-secondary btn-block" type="submit">Submit</button>
</form>
</div>
</dialog>
</div>
</div>
</div>
<div class="drawer-side is-drawer-close:overflow-visible grow">
<label for="my-drawer-1" aria-label="close sidebar" class="drawer-overlay"></label>
<div class="flex grow h-full flex-col items-start bg-base-300 text-base-content
is-drawer-close:min-w-[80px] is-drawer-open:max-w-[300px]">
<ul class="w-full grow">
<li class="flex w-full">
<button class="w-full gap-1 py-2 border-b-1 border-gray-200
hover:bg-neutral data-active:bg-neutral
hover:text-white data-active:text-white
is-drawer-open:flex is-drawer-open:space-x-4
is-drawer-close:grid-cols-1" hx-get="/projects/00000000-0000-0000-0000-000000000000" hx-push-url="true" hx-target="body" hx-swap="outerHTML">
<div class="w-full p-2 gap-1
is-drawer-open:flex is-drawer-open:space-x-4
is-drawer-close:grid-cols-1">
<div class="items-center
is-drawer-open:justify-start is-drawer-open:flex is-drawer-open:space-x-4
is-drawer-close:justify-center is-drawer-close:mx-auto is-drawer-close:space-y-2">
<div class="flex items-center justify-center is-drawer-close:text-green-400"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-map-pin-icon lucide-map-pin"><path d="M20 10c0 4.993-5.539 10.193-7.399 11.799a1 1 0 0 1-1.202 0C9.539 20.193 4 14.993 4 10a8 8 0 0 1 16 0"/><circle cx="12" cy="10" r="3"/></svg></div>
<div class="flex items-center justify-center"><span>Project</span></div>
</div>
<div class="flex grow justify-end items-end is-drawer-close:hidden text-green-400"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-badge-check-icon lucide-badge-check"><path d="M3.85 8.62a4 4 0 0 1 4.78-4.77 4 4 0 0 1 6.74 0 4 4 0 0 1 4.78 4.78 4 4 0 0 1 0 6.74 4 4 0 0 1-4.77 4.78 4 4 0 0 1-6.75 0 4 4 0 0 1-4.78-4.77 4 4 0 0 1 0-6.76Z"/><path d="m9 12 2 2 4-4"/></svg></div>
</div>
</button>
</li>
<li class="w-full">
<button class="w-full gap-1 py-2 border-b-1 border-gray-200
hover:bg-neutral data-active:bg-neutral
hover:text-white data-active:text-white
is-drawer-open:flex is-drawer-open:space-x-4
is-drawer-close:grid-cols-1" hx-get="/projects/00000000-0000-0000-0000-000000000000/rooms" hx-push-url="true" hx-target="body" hx-swap="outerHTML">
<div class="w-full p-2 gap-1
is-drawer-open:flex is-drawer-open:space-x-4
is-drawer-close:grid-cols-1">
<div class="items-center
is-drawer-open:justify-start is-drawer-open:flex is-drawer-open:space-x-4
is-drawer-close:justify-center is-drawer-close:mx-auto is-drawer-close:space-y-2">
<div class="flex items-center justify-center is-drawer-close:text-green-400"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-door-closed-icon lucide-door-closed"><path d="M10 12h.01"/><path d="M18 20V6a2 2 0 0 0-2-2H8a2 2 0 0 0-2 2v14"/><path d="M2 20h20"/></svg></div>
<div class="flex items-center justify-center"><span>Rooms</span></div>
</div>
<div class="flex grow justify-end items-end is-drawer-close:hidden text-green-400"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-badge-check-icon lucide-badge-check"><path d="M3.85 8.62a4 4 0 0 1 4.78-4.77 4 4 0 0 1 6.74 0 4 4 0 0 1 4.78 4.78 4 4 0 0 1 0 6.74 4 4 0 0 1-4.77 4.78 4 4 0 0 1-6.75 0 4 4 0 0 1-4.78-4.77 4 4 0 0 1 0-6.76Z"/><path d="m9 12 2 2 4-4"/></svg></div>
</div>
</button>
</li>
<li class="flex w-full">
<button class="w-full gap-1 py-2 border-b-1 border-gray-200
hover:bg-neutral data-active:bg-neutral
hover:text-white data-active:text-white
is-drawer-open:flex is-drawer-open:space-x-4
is-drawer-close:grid-cols-1" hx-get="/projects/00000000-0000-0000-0000-000000000000/equipment" hx-push-url="true" hx-target="body" hx-swap="outerHTML">
<div class="w-full p-2 gap-1
is-drawer-open:flex is-drawer-open:space-x-4
is-drawer-close:grid-cols-1">
<div class="items-center
is-drawer-open:justify-start is-drawer-open:flex is-drawer-open:space-x-4
is-drawer-close:justify-center is-drawer-close:mx-auto is-drawer-close:space-y-2">
<div class="flex items-center justify-center is-drawer-close:text-green-400"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-fan-icon lucide-fan"><path d="M10.827 16.379a6.082 6.082 0 0 1-8.618-7.002l5.412 1.45a6.082 6.082 0 0 1 7.002-8.618l-1.45 5.412a6.082 6.082 0 0 1 8.618 7.002l-5.412-1.45a6.082 6.082 0 0 1-7.002 8.618l1.45-5.412Z"/><path d="M12 12v.01"/></svg></div>
<div class="flex items-center justify-center"><span>Equipment</span></div>
</div>
<div class="flex grow justify-end items-end is-drawer-close:hidden text-green-400"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-badge-check-icon lucide-badge-check"><path d="M3.85 8.62a4 4 0 0 1 4.78-4.77 4 4 0 0 1 6.74 0 4 4 0 0 1 4.78 4.78 4 4 0 0 1 0 6.74 4 4 0 0 1-4.77 4.78 4 4 0 0 1-6.75 0 4 4 0 0 1-4.78-4.77 4 4 0 0 1 0-6.76Z"/><path d="m9 12 2 2 4-4"/></svg></div>
</div>
</button>
</li>
<li class="w-full">
<button class="w-full gap-1 py-2 border-b-1 border-gray-200
hover:bg-neutral data-active:bg-neutral
hover:text-white data-active:text-white
is-drawer-open:flex is-drawer-open:space-x-4
is-drawer-close:grid-cols-1" hx-get="/projects/00000000-0000-0000-0000-000000000000/effective-lengths" hx-push-url="true" hx-target="body" hx-swap="outerHTML">
<div class="w-full p-2 gap-1
is-drawer-open:flex is-drawer-open:space-x-4
is-drawer-close:grid-cols-1">
<div class="items-center
is-drawer-open:justify-start is-drawer-open:flex is-drawer-open:space-x-4
is-drawer-close:justify-center is-drawer-close:mx-auto is-drawer-close:space-y-2">
<div class="flex items-center justify-center is-drawer-close:text-green-400"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-ruler-dimension-line-icon lucide-ruler-dimension-line"><path d="M10 15v-3"/><path d="M14 15v-3"/><path d="M18 15v-3"/><path d="M2 8V4"/><path d="M22 6H2"/><path d="M22 8V4"/><path d="M6 15v-3"/><rect x="2" y="12" width="20" height="8" rx="2"/></svg></div>
<div class="flex items-center justify-center"><span>T.E.L.</span></div>
</div>
<div class="flex grow justify-end items-end is-drawer-close:hidden text-green-400"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-badge-check-icon lucide-badge-check"><path d="M3.85 8.62a4 4 0 0 1 4.78-4.77 4 4 0 0 1 6.74 0 4 4 0 0 1 4.78 4.78 4 4 0 0 1 0 6.74 4 4 0 0 1-4.77 4.78 4 4 0 0 1-6.75 0 4 4 0 0 1-4.78-4.77 4 4 0 0 1 0-6.76Z"/><path d="m9 12 2 2 4-4"/></svg></div>
</div>
</button>
</li>
<li class="w-full">
<button class="w-full gap-1 py-2 border-b-1 border-gray-200
hover:bg-neutral data-active:bg-neutral
hover:text-white data-active:text-white
is-drawer-open:flex is-drawer-open:space-x-4
is-drawer-close:grid-cols-1" hx-get="/projects/00000000-0000-0000-0000-000000000000/friction-rate" hx-push-url="true" hx-target="body" hx-swap="outerHTML" data-active="true">
<div class="w-full p-2 gap-1
is-drawer-open:flex is-drawer-open:space-x-4
is-drawer-close:grid-cols-1">
<div class="items-center
is-drawer-open:justify-start is-drawer-open:flex is-drawer-open:space-x-4
is-drawer-close:justify-center is-drawer-close:mx-auto is-drawer-close:space-y-2">
<div class="flex items-center justify-center is-drawer-close:text-green-400"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-square-function-icon lucide-square-function"><rect width="18" height="18" x="3" y="3" rx="2" ry="2"/><path d="M9 17c2 0 2.8-1 2.8-2.8V10c0-2 1-3.3 3.2-3"/><path d="M9 11.2h5.7"/></svg></div>
<div class="flex items-center justify-center"><span>Friction Rate</span></div>
</div>
<div class="flex grow justify-end items-end is-drawer-close:hidden text-green-400"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-badge-check-icon lucide-badge-check"><path d="M3.85 8.62a4 4 0 0 1 4.78-4.77 4 4 0 0 1 6.74 0 4 4 0 0 1 4.78 4.78 4 4 0 0 1 0 6.74 4 4 0 0 1-4.77 4.78 4 4 0 0 1-6.75 0 4 4 0 0 1-4.78-4.77 4 4 0 0 1 0-6.76Z"/><path d="m9 12 2 2 4-4"/></svg></div>
</div>
</button>
</li>
<li class="w-full">
<button class="w-full gap-1 py-2 border-b-1 border-gray-200
hover:bg-neutral data-active:bg-neutral
hover:text-white data-active:text-white
is-drawer-open:flex is-drawer-open:space-x-4
is-drawer-close:grid-cols-1" hx-get="/projects/00000000-0000-0000-0000-000000000000/duct-sizing" hx-push-url="true" hx-target="body" hx-swap="outerHTML">
<div class="w-full p-2 gap-1
is-drawer-open:flex is-drawer-open:space-x-4
is-drawer-close:grid-cols-1">
<div class="items-center
is-drawer-open:justify-start is-drawer-open:flex is-drawer-open:space-x-4
is-drawer-close:justify-center is-drawer-close:mx-auto is-drawer-close:space-y-2">
<div class="flex items-center justify-center"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-wind-icon lucide-wind"><path d="M12.8 19.6A2 2 0 1 0 14 16H2"/><path d="M17.5 8a2.5 2.5 0 1 1 2 4H2"/><path d="M9.8 4.4A2 2 0 1 1 11 8H2"/></svg></div>
<div class="flex items-center justify-center"><span>Duct Sizes</span></div>
</div>
</div>
</button>
</li>
</ul>
</div>
</div>
</div>
</main>
<div class="bottom-0 left-0 bg-error">
<footer class="footer sm:footer-horizontal footer-center
bg-base-300 text-base-content p-4">
<aside>
<p>Copyright © 2026 - All rights reserved by Michael Housh</p>
</aside>
</footer>
</div>
</div>
</body>
</html>

File diff suppressed because it is too large Load Diff

View File

@@ -0,0 +1,111 @@
<!DOCTYPE html>
<html lang="en">
<head>
<title>Duct Calc</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta content="ductcalc.com" name="og:site_name">
<meta content="Duct Calc" name="og:title">
<meta content="Duct sizing based on ACCA, Manual-D." name="description">
<meta content="Duct sizing based on ACCA, Manual-D." name="og:description">
<meta content="/images/mand_logo.png" name="og:image">
<meta content="/images/mand_logo.png" name="twitter:image">
<meta content="Duct Calc" name="twitter:image:alt">
<meta content="summary_large_image" name="twitter:card">
<meta content="1536" name="og:image:width">
<meta content="1024" name="og:image:height">
<meta content="duct, hvac, duct-design, duct design, manual-d, manual d, design" name="keywords">
<script src="https://unpkg.com/htmx.org@2.0.8"></script>
<script src="/js/main.js"></script>
<link rel="stylesheet" href="/css/output.css">
<link rel="icon" href="/images/favicon.ico" type="image/x-icon">
<link rel="icon" href="/images/favicon-32x32.png" type="image/png">
<link rel="icon" href="/images/favicon-16x16.png" type="image/png">
<link rel="apple-touch-icon" sizes="180x180" href="/images/apple-touch-icon.png">
<link rel="manifest" href="/site.webmanifest">
<script src="https://unpkg.com/htmx-remove@latest" crossorigin="anonymous" integrity="sha384-NwB2Xh66PNEYfVki0ao13UAFmdNtMIdBKZ8sNGRT6hKfCPaINuZ4ScxS6vVAycPT"></script>
</head>
<body>
<div class="flex flex-col min-h-screen min-w-full justify-between">
<main class="flex flex-col min-h-screen min-w-full grow mb-auto">
<div>
<nav class="navbar w-full bg-base-300 text-base-content shadow-sm mb-4">
<div class="flex flex-1 space-x-4 items-center">
<div class="tooltip tooltip-right" data-tip="Home">
<a class="flex w-fit h-fit text-xl items-end px-4 py-2 btn btn-square btn-ghost hover:bg-neutral hover:text-white" href="/projects">
<img src="/images/mand_logo_sm.webp">
Duct Calc<span></span></a>
</div>
</div>
<div class="flex-none">
<div class="tooltip tooltip-left" data-tip="Profile"><a href="/profile" class="btn btn-square btn-ghost hover:bg-neutral hover:text-white"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-circle-user-icon lucide-circle-user"><circle cx="12" cy="12" r="10"/><circle cx="12" cy="10" r="3"/><path d="M7 20.662V19a2 2 0 0 1 2-2h6a2 2 0 0 1 2 2v1.662"/></svg></a></div>
</div>
</nav>
<div class="m-6">
<div class="flex justify-between bg-secondary border-2 border-primary rounded-sm shadow-sm
p-6 w-full pb-6">
<h1 class="text-3xl font-bold">Projects</h1>
<div class="tooltip tooltip-left" data-tip="Add project">
<button type="button" class="btn btn-primary" onclick="projectForm.showModal()"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-circle-plus-icon lucide-circle-plus"><circle cx="12" cy="12" r="10"/><path d="M8 12h8"/><path d="M12 8v8"/></svg></button>
</div>
</div>
<table class="table table-zebra">
<thead>
<tr>
<th><span class="text-lg label font-bold">Date</span></th>
<th><span class="text-lg label font-bold">Name</span></th>
<th><span class="text-lg label font-bold">Address</span></th>
<th></th>
</tr>
</thead>
<tbody>
<tr id="00000000-0000-0000-0000-000000000000">
<td><span>02/13/2009</span></td>
<td>Testy McTestface</td>
<td>1234 Sesame Street</td>
<td>
<div class="flex justify-end space-x-6">
<div class="join">
<div class="tooltip tooltip-left" data-tip="Delete project">
<button type="button" class="btn btn-error join-item btn-ghost" hx-delete="/projects/00000000-0000-0000-0000-000000000000" hx-confirm="Are you sure?" hx-target="closest tr"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-trash2-icon lucide-trash-2"><path d="M10 11v6"/><path d="M14 11v6"/><path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"/><path d="M3 6h18"/><path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"/></svg></button>
</div>
<div class="tooltip tooltip-left" data-tip="View project"><a class="join-item btn btn-success btn-ghost" href="/projects/00000000-0000-0000-0000-000000000000/rooms"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-chevron-right-icon lucide-chevron-right"><path d="m9 18 6-6-6-6"/></svg></a></div>
</div>
</div>
</td>
</tr>
</tbody>
</table>
</div>
<dialog id="projectForm" class="modal">
<div class="modal-box">
<button class="btn btn-sm btn-circle btn-ghost absolute right-2 top-2" onclick="projectForm.close()"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-x-icon lucide-x"><path d="M18 6 6 18"/><path d="m6 6 12 12"/></svg></button>
<h1 class="text-3xl font-bold pb-6 ps-2">Project</h1>
<form class="grid grid-cols-1 gap-4" hx-post="/projects" hx-target="body" hx-swap="outerHTML">
<label class="input w-full"><span class="label">Name</span>
<input name="name" type="text" value="" placeholder="Project Name" required autofocus>
Address</label><label class="input w-full"><span class="label"></span>
<input name="streetAddress" type="text" value="" placeholder="Street Address" required>
City</label><label class="input w-full"><span class="label"></span>
<input name="city" type="text" value="" placeholder="City" required>
State</label><label class="input w-full"><span class="label"></span>
<input name="state" type="text" value="" placeholder="State" required>
Zip</label><label class="input w-full"><span class="label"></span>
<input name="zipCode" type="text" value="" placeholder="Zip Code" required></label>
<button class="btn btn-secondary btn-block my-6" type="submit">Submit</button>
</form>
</div>
</dialog>
</div>
</main>
<div class="bottom-0 left-0 bg-error">
<footer class="footer sm:footer-horizontal footer-center
bg-base-300 text-base-content p-4">
<aside>
<p>Copyright © 2026 - All rights reserved by Michael Housh</p>
</aside>
</footer>
</div>
</div>
</body>
</html>

View File

@@ -0,0 +1,79 @@
<!DOCTYPE html>
<html lang="en">
<head>
<title>Duct Calc</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta content="ductcalc.com" name="og:site_name">
<meta content="Duct Calc" name="og:title">
<meta content="Duct sizing based on ACCA, Manual-D." name="description">
<meta content="Duct sizing based on ACCA, Manual-D." name="og:description">
<meta content="/images/mand_logo.png" name="og:image">
<meta content="/images/mand_logo.png" name="twitter:image">
<meta content="Duct Calc" name="twitter:image:alt">
<meta content="summary_large_image" name="twitter:card">
<meta content="1536" name="og:image:width">
<meta content="1024" name="og:image:height">
<meta content="duct, hvac, duct-design, duct design, manual-d, manual d, design" name="keywords">
<script src="https://unpkg.com/htmx.org@2.0.8"></script>
<script src="/js/main.js"></script>
<link rel="stylesheet" href="/css/output.css">
<link rel="icon" href="/images/favicon.ico" type="image/x-icon">
<link rel="icon" href="/images/favicon-32x32.png" type="image/png">
<link rel="icon" href="/images/favicon-16x16.png" type="image/png">
<link rel="apple-touch-icon" sizes="180x180" href="/images/apple-touch-icon.png">
<link rel="manifest" href="/site.webmanifest">
<script src="https://unpkg.com/htmx-remove@latest" crossorigin="anonymous" integrity="sha384-NwB2Xh66PNEYfVki0ao13UAFmdNtMIdBKZ8sNGRT6hKfCPaINuZ4ScxS6vVAycPT"></script>
</head>
<body>
<div class="flex flex-col min-h-screen min-w-full justify-between">
<main class="flex flex-col min-h-screen min-w-full grow mb-auto">
<dialog id="loginForm" class="modal modal-open">
<div class="modal-box">
<h1 class="text-2xl font-bold mb-6">Login</h1>
<form method="post" class="space-y-4">
<div>
<label class="input validator w-full"> <svg class="h-[1em] opacity-50" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
<g
stroke-linejoin="round"
stroke-linecap="round"
stroke-width="2.5"
fill="none"
stroke="currentColor"
>
<rect width="20" height="16" x="2" y="4" rx="2"></rect>
<path d="m22 7-8.97 5.7a1.94 1.94 0 0 1-2.06 0L2 7"></path>
</g>
</svg>
<input type="email" placeholder="Email" required name="email" id="email" autofocus></label>
<div class="validator-hint hidden">Enter valid email address.</div>
</div>
<div>
<label class="input validator w-full"> <svg class="h-[1em] opacity-50" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
<g
stroke-linejoin="round"
stroke-linecap="round"
stroke-width="2.5"
fill="none"
stroke="currentColor"
>
<path
d="M2.586 17.414A2 2 0 0 0 2 18.828V21a1 1 0 0 0 1 1h3a1 1 0 0 0 1-1v-1a1 1 0 0 1 1-1h1a1 1 0 0 0 1-1v-1a1 1 0 0 1 1-1h.172a2 2 0 0 0 1.414-.586l.814-.814a6.5 6.5 0 1 0-4-4z"
></path>
<circle cx="16.5" cy="7.5" r=".5" fill="currentColor"></circle>
</g>
</svg>
<input type="password" placeholder="Password" required pattern="(?=.*\d)(?=.*[a-z])(?=.*[A-Z]).{8,}" minlength="8" name="password" id="password"></label>
</div>
<div class="flex">
<button class="btn btn-secondary mt-4 w-full">Login</button>
</div>
<div class="flex justify-center"><a class="btn btn-link" href="/signup">Sign Up</a></div>
</form>
</div>
</dialog>
</main>
<div class="bottom-0 left-0 bg-error"></div>
</div>
</body>
</html>

View File

@@ -0,0 +1,159 @@
<!DOCTYPE html>
<html lang="en">
<head>
<title>Duct Calc</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta content="ductcalc.com" name="og:site_name">
<meta content="Duct Calc" name="og:title">
<meta content="Duct sizing based on ACCA, Manual-D." name="description">
<meta content="Duct sizing based on ACCA, Manual-D." name="og:description">
<meta content="/images/mand_logo.png" name="og:image">
<meta content="/images/mand_logo.png" name="twitter:image">
<meta content="Duct Calc" name="twitter:image:alt">
<meta content="summary_large_image" name="twitter:card">
<meta content="1536" name="og:image:width">
<meta content="1024" name="og:image:height">
<meta content="duct, hvac, duct-design, duct design, manual-d, manual d, design" name="keywords">
<script src="https://unpkg.com/htmx.org@2.0.8"></script>
<script src="/js/main.js"></script>
<link rel="stylesheet" href="/css/output.css">
<link rel="icon" href="/images/favicon.ico" type="image/x-icon">
<link rel="icon" href="/images/favicon-32x32.png" type="image/png">
<link rel="icon" href="/images/favicon-16x16.png" type="image/png">
<link rel="apple-touch-icon" sizes="180x180" href="/images/apple-touch-icon.png">
<link rel="manifest" href="/site.webmanifest">
<script src="https://unpkg.com/htmx-remove@latest" crossorigin="anonymous" integrity="sha384-NwB2Xh66PNEYfVki0ao13UAFmdNtMIdBKZ8sNGRT6hKfCPaINuZ4ScxS6vVAycPT"></script>
</head>
<body>
<div class="flex flex-col min-h-screen min-w-full justify-between">
<main class="flex flex-col min-h-screen min-w-full grow mb-auto">
<div>
<nav class="navbar w-full bg-base-300 text-base-content shadow-sm mb-4">
<div class="flex flex-1 space-x-4 items-center">
<div class="tooltip tooltip-right" data-tip="Home">
<a class="flex w-fit h-fit text-xl items-end px-4 py-2 btn btn-square btn-ghost hover:bg-neutral hover:text-white" href="/projects">
<img src="/images/mand_logo_sm.webp">
Duct Calc<span></span></a>
</div>
</div>
</nav>
<div class="p-4">
<div class="flex justify-between">
<h1 class="text-2xl font-bold">Account</h1>
<button class="btn" type="button" onclick="userProfileForm_00000000000000000000000000000001.showModal()">
<div class="flex">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-square-pen-icon lucide-square-pen"><path d="M12 3H5a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7"/><path d="M18.375 2.625a1 1 0 0 1 3 3l-9.013 9.014a2 2 0 0 1-.853.505l-2.873.84a.5.5 0 0 1-.62-.62l.84-2.873a2 2 0 0 1 .506-.852z"/></svg>
</div>
</button>
</div>
<table class="table table-zebra border rounded-lg">
<tr>
<td><span class="text-lg label font-bold">Name</span></td>
<td>Testy McTestface</td>
</tr>
<tr>
<td><span class="text-lg label font-bold">Company</span></td>
<td>Acme Co.</td>
</tr>
<tr>
<td><span class="text-lg label font-bold">Street Address</span></td>
<td>1234 Sesame St</td>
</tr>
<tr>
<td><span class="text-lg label font-bold">City</span></td>
<td>Monroe</td>
</tr>
<tr>
<td><span class="text-lg label font-bold">State</span></td>
<td>OH</td>
</tr>
<tr>
<td><span class="text-lg label font-bold">Zip Code</span></td>
<td>55555</td>
</tr>
<tr>
<td><span class="text-lg label font-bold">Theme</span></td>
<td></td>
</tr>
</table>
<dialog id="userProfileForm_00000000000000000000000000000001" class="modal">
<div class="modal-box">
<button class="btn btn-sm btn-circle btn-ghost absolute right-2 top-2" onclick="userProfileForm_00000000000000000000000000000001.close()"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-x-icon lucide-x"><path d="M18 6 6 18"/><path d="m6 6 12 12"/></svg></button>
<h1 class="text-xl font-bold pb-6">Profile</h1>
<form class="grid grid-cols-1 gap-4 p-4" hx-patch="/profile/00000000-0000-0000-0000-000000000001" hx-target="body" hx-swap="outerHTML">
<input class="hidden" name="id" value="00000000-0000-0000-0000-000000000001">
<input class="hidden" name="userID" value="00000000-0000-0000-0000-000000000000">
First Name<label class="input w-full"><span class="label"></span>
<input name="firstName" value="Testy" required autofocus>
Last Name</label><label class="input w-full"><span class="label"></span>
<input name="lastName" value="McTestface" required>
Company</label><label class="input w-full"><span class="label"></span>
<input name="companyName" value="Acme Co." required>
Address</label><label class="input w-full"><span class="label"></span>
<input name="streetAddress" value="1234 Sesame St" required>
City</label><label class="input w-full"><span class="label"></span>
<input name="city" value="Monroe" required>
State</label><label class="input w-full"><span class="label"></span>
<input name="state" value="OH" required>
Zip</label><label class="input w-full"><span class="label"></span>
<input name="zipCode" value="55555" required></label>
<div class="dropdown dropdown-top">
<div class="input btn m-1 w-full" tabindex="0" role="button">Theme<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-chevron-down-icon lucide-chevron-down"><path d="m6 9 6 6 6-6"/></svg></div>
<ul tabindex="-1" class="dropdown-content bg-base-300 rounded-box z-1 p-2 shadow-2xl">
<li>
<input type="radio" name="theme" class="theme-controller w-full btn btn-sm btn-block btn-ghost justify-start" aria-label="Default" value="default">
</li>
<li><span class="text-sm font-bold text-gray-400">Light</span></li>
<li>
<input type="radio" name="theme" class="theme-controller w-full btn btn-sm btn-block btn-ghost justify-start" aria-label="Cupcake" value="cupcake">
</li>
<li>
<input type="radio" name="theme" class="theme-controller w-full btn btn-sm btn-block btn-ghost justify-start" aria-label="Light" value="light">
</li>
<li>
<input type="radio" name="theme" class="theme-controller w-full btn btn-sm btn-block btn-ghost justify-start" aria-label="Nord" value="nord">
</li>
<li>
<input type="radio" name="theme" class="theme-controller w-full btn btn-sm btn-block btn-ghost justify-start" aria-label="Retro" value="retro">
</li>
<li><span class="text-sm font-bold text-gray-400">Dark</span></li>
<li>
<input type="radio" name="theme" class="theme-controller w-full btn btn-sm btn-block btn-ghost justify-start" aria-label="Aqua" value="aqua">
</li>
<li>
<input type="radio" name="theme" class="theme-controller w-full btn btn-sm btn-block btn-ghost justify-start" aria-label="Cyberpunk" value="cyberpunk">
</li>
<li>
<input type="radio" name="theme" class="theme-controller w-full btn btn-sm btn-block btn-ghost justify-start" aria-label="Dark" value="dark">
</li>
<li>
<input type="radio" name="theme" class="theme-controller w-full btn btn-sm btn-block btn-ghost justify-start" aria-label="Dracula" value="dracula">
</li>
<li>
<input type="radio" name="theme" class="theme-controller w-full btn btn-sm btn-block btn-ghost justify-start" aria-label="Night" value="night">
</li>
<li>
<input type="radio" name="theme" class="theme-controller w-full btn btn-sm btn-block btn-ghost justify-start" aria-label="Synthwave" value="synthwave">
</li>
</ul>
</div>
<button class="btn btn-secondary btn-block" type="submit">Submit</button>
</form>
</div>
</dialog>
</div>
</div>
</main>
<div class="bottom-0 left-0 bg-error">
<footer class="footer sm:footer-horizontal footer-center
bg-base-300 text-base-content p-4">
<aside>
<p>Copyright © 2026 - All rights reserved by Michael Housh</p>
</aside>
</footer>
</div>
</div>
</body>
</html>