Errything changing
This commit is contained in:
@ -11,92 +11,67 @@ Atridad Lahiji // Root
|
||||
{{end}}
|
||||
|
||||
{{define "main"}}
|
||||
<h1 class="text-4xl font-extrabold text-white sm:text-8xl">
|
||||
Hi, I'm <span
|
||||
class="bg-gradient-to-r from-pink-500 to-blue-500 bg-clip-text text-transparent"
|
||||
>Atridad</span
|
||||
>
|
||||
</h1>
|
||||
<h1 class="text-4xl font-extrabold text-white sm:text-8xl">
|
||||
Hi, I'm <span class="bg-gradient-to-r from-pink-500 to-blue-500 bg-clip-text text-transparent">Atridad</span>
|
||||
</h1>
|
||||
|
||||
<h2 class="text-2xl font-extrabold tracking-tight text-white sm:text-[2rem]">
|
||||
I'm a full stack developer who builds cool things for the web.
|
||||
</h2>
|
||||
<h2 class="text-2xl font-extrabold tracking-tight text-white sm:text-[2rem]">
|
||||
I'm a full stack developer who builds cool things for the web.
|
||||
</h2>
|
||||
|
||||
<span>
|
||||
<h2 class="mb-2 text-xl text-white sm:text-[1.5rem]">Places I exist:</h2>
|
||||
<div
|
||||
class="flex flex-row flex-wrap items-center justify-center gap-4 text-center"
|
||||
>
|
||||
{{range .Socials}}
|
||||
{{if eq .Name "Spotify"}}
|
||||
<div class="indicator indicator-top indicator-end">
|
||||
<div hx-ext="sse" sse-connect="/api/sse?channel=spotify" sse-swap="message">
|
||||
<span class="link link-hover link-success" hx-get="/api/nowplaying" hx-trigger="load" hx-swap="self">
|
||||
</span>
|
||||
</div>
|
||||
<span>
|
||||
<h2 class="mb-2 text-xl text-white sm:text-[1.5rem]">Places I exist:</h2>
|
||||
<div class="flex flex-row flex-wrap items-center justify-center gap-4 text-center">
|
||||
{{range .Socials}}
|
||||
{{if eq .Name "Spotify"}}
|
||||
<div class="indicator indicator-top indicator-end">
|
||||
<div hx-ext="sse" sse-connect="/api/sse?channel=spotify" sse-swap="message">
|
||||
<span class="link link-hover link-success" hx-get="/api/spotify/nowplaying" hx-trigger="load" hx-swap="self">
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<a class="fill-white hover:fill-pink-500"
|
||||
href={{.Href}} target="_blank" rel="me" aria-label={{.Name}}>
|
||||
{{.Icon}}
|
||||
</a>
|
||||
</div>
|
||||
{{else}}
|
||||
<a class="fill-white hover:fill-pink-500"
|
||||
href={{.Href}} target="_blank" rel="me" aria-label={{.Name}}>
|
||||
{{.Icon}}
|
||||
</a>
|
||||
{{end}}
|
||||
{{end}}
|
||||
<a class="fill-white hover:fill-pink-500" href={{.Href}} target="_blank" rel="me" aria-label={{.Name}}>
|
||||
{{.Icon}}
|
||||
</a>
|
||||
</div>
|
||||
</span>
|
||||
|
||||
|
||||
<span>
|
||||
<h2 class="mb-2 text-xl text-white sm:text-[1.5rem]">Stuff I Use:</h2>
|
||||
<div
|
||||
class="flex flex-row flex-wrap items-center justify-center gap-4 text-center"
|
||||
>
|
||||
{{range .Tech}}
|
||||
<a class="fill-white hover:fill-pink-500"
|
||||
href={{.Href}} target="_blank" rel="me" aria-label={{.Name}}>
|
||||
{{.Icon}}
|
||||
</a>
|
||||
{{end}}
|
||||
</div>
|
||||
</span>
|
||||
|
||||
<div class="flex flex-row flex-wrap gap-2">
|
||||
<a
|
||||
class="btn btn-primary btn-outline btn-md lg:btn-lg"
|
||||
href={{.ContractLink}}
|
||||
target="_blank"
|
||||
rel="noreferrer"
|
||||
>
|
||||
Contract Me
|
||||
</a>
|
||||
|
||||
<a
|
||||
class="btn btn-primary btn-outline btn-md lg:btn-lg"
|
||||
href={{.ResumeURL}}
|
||||
target="_blank"
|
||||
rel="noreferrer"
|
||||
>
|
||||
Resumé
|
||||
</a>
|
||||
|
||||
<a
|
||||
class="btn btn-primary btn-outline btn-md lg:btn-lg"
|
||||
href={{.SupportLink}}
|
||||
target="_blank"
|
||||
rel="noreferrer"
|
||||
>
|
||||
Support 🩵
|
||||
{{else}}
|
||||
<a class="fill-white hover:fill-pink-500" href={{.Href}} target="_blank" rel="me" aria-label={{.Name}}>
|
||||
{{.Icon}}
|
||||
</a>
|
||||
{{end}}
|
||||
{{end}}
|
||||
</div>
|
||||
</span>
|
||||
|
||||
|
||||
<span>
|
||||
<h2 class="mb-2 text-xl text-white sm:text-[1.5rem]">Stuff I Use:</h2>
|
||||
<div class="flex flex-row flex-wrap items-center justify-center gap-4 text-center">
|
||||
{{range .Tech}}
|
||||
<a class="fill-white hover:fill-pink-500" href={{.Href}} target="_blank" rel="me" aria-label={{.Name}}>
|
||||
{{.Icon}}
|
||||
</a>
|
||||
{{end}}
|
||||
</div>
|
||||
</span>
|
||||
|
||||
<div class="flex flex-row flex-wrap gap-2">
|
||||
<a class="btn btn-primary btn-outline btn-md lg:btn-lg" href={{.ContractLink}} target="_blank" rel="noreferrer">
|
||||
Contract Me
|
||||
</a>
|
||||
|
||||
<a class="btn btn-primary btn-outline btn-md lg:btn-lg" href={{.ResumeURL}} target="_blank" rel="noreferrer">
|
||||
Resumé
|
||||
</a>
|
||||
|
||||
<a class="btn btn-primary btn-outline btn-md lg:btn-lg" href={{.SupportLink}} target="_blank" rel="noreferrer">
|
||||
Support 🩵
|
||||
</a>
|
||||
</div>
|
||||
{{end}}
|
||||
|
||||
{{define "foot"}}
|
||||
<script src="/public/js/htmx.base.js"></script>
|
||||
<script src="/public/js/htmx.sse.js"></script>
|
||||
<script src="/public/js/hyperscript.js"></script>
|
||||
{{end}}
|
||||
{{end}}
|
||||
@ -1,33 +0,0 @@
|
||||
{{define "title"}}Atridad Lahiji // SSE{{end}}
|
||||
|
||||
{{define "headercontent"}}
|
||||
Atridad Lahiji // SSE <div class="badge badge-accent">BETA</div>
|
||||
{{end}}
|
||||
|
||||
{{define "head"}}
|
||||
<link rel="stylesheet" href="/public/css/styles.ssedemo.css" />
|
||||
{{end}}
|
||||
|
||||
{{define "main"}}
|
||||
<h1 class="text-4xl">Server Sent Events</h1>
|
||||
<h2 class="text-xl">This page demonstrates the use of the <a href="https://htmx.org/extensions/sse/">HTMX SSE Extention</a> to receive Server Sent Events on the "default" channel.</h2>
|
||||
<p class="text-lg">Any events received on the "default" channel will appear below:</p>
|
||||
<div hx-ext="sse" sse-connect="/api/sse" sse-swap="message">
|
||||
Waiting for SSE Message...
|
||||
</div>
|
||||
|
||||
<p class="text-lg">Here you can send messages on the default channel:</p>
|
||||
<form hx-post="/api/sendsse" hx-trigger="submit" hx-swap="none" class="flex-col flex gap-2">
|
||||
<div class="label">
|
||||
<span class="label-text">Message</span>
|
||||
</div>
|
||||
<input type="text" name="message" value="Hello world!" placeholder="Enter your message here" class="input input-bordered input-primary w-full max-w-xs" />
|
||||
|
||||
<button type="submit" class="btn btn-primary">Send Event</button>
|
||||
</form>
|
||||
{{end}}
|
||||
|
||||
{{define "foot"}}
|
||||
<script src="/public/js/htmx.base.js"></script>
|
||||
<script src="/public/js/htmx.sse.js"></script>
|
||||
{{end}}
|
||||
@ -12,7 +12,7 @@ Atridad Lahiji // Tools // Resizer
|
||||
|
||||
{{define "main"}}
|
||||
<h2 class="text-2xl font-extrabold tracking-tight text-white sm:text-[2rem]">Image Resizer</h2>
|
||||
<form action="/api/resize" method="post" enctype="multipart/form-data" class="flex-col flex gap-4">
|
||||
<form action="/api/tools/resize" method="post" enctype="multipart/form-data" class="flex-col flex gap-4">
|
||||
Select image to resize:
|
||||
<input type="file" name="image" accept=".png,.jpg,.jpeg"
|
||||
class="file-input file-input-bordered file-input-secondary w-full max-w-xs" required />
|
||||
|
||||
36
pages/templates/tools.ssedemo.html
Normal file
36
pages/templates/tools.ssedemo.html
Normal file
@ -0,0 +1,36 @@
|
||||
{{define "title"}}Atridad Lahiji // SSE{{end}}
|
||||
|
||||
{{define "headercontent"}}
|
||||
Atridad Lahiji // SSE <div class="badge badge-accent">BETA</div>
|
||||
{{end}}
|
||||
|
||||
{{define "head"}}
|
||||
<link rel="stylesheet" href="/public/css/styles.tools.ssedemo.css" />
|
||||
{{end}}
|
||||
|
||||
{{define "main"}}
|
||||
<h2 class="text-2xl font-extrabold tracking-tight text-white sm:text-[2rem]">Server Sent Events</h2>
|
||||
|
||||
<p class="text-lg">This page demonstrates the use of the <a href="https://htmx.org/extensions/sse/">HTMX SSE
|
||||
Extention</a> to receive Server Sent Events on the "default" channel.</p>
|
||||
<p class="text-lg">Any events received on the "default" channel will appear below:</p>
|
||||
<div hx-ext="sse" sse-connect="/api/sse" sse-swap="message">
|
||||
Waiting for SSE Message...
|
||||
</div>
|
||||
|
||||
<p class="text-lg">Here you can send messages on the default channel:</p>
|
||||
<form hx-post="/api/tools/sendsse" hx-trigger="submit" hx-swap="none" class="flex-col flex gap-2">
|
||||
<div class="label">
|
||||
<span class="label-text">Message</span>
|
||||
</div>
|
||||
<input type="text" name="message" value="Hello world!" placeholder="Enter your message here"
|
||||
class="input input-bordered input-primary w-full max-w-xs" />
|
||||
|
||||
<button type="submit" class="btn btn-primary">Send Event</button>
|
||||
</form>
|
||||
{{end}}
|
||||
|
||||
{{define "foot"}}
|
||||
<script src="/public/js/htmx.base.js"></script>
|
||||
<script src="/public/js/htmx.sse.js"></script>
|
||||
{{end}}
|
||||
@ -11,6 +11,12 @@ type ToolsProps struct {
|
||||
|
||||
func Tools(c echo.Context) error {
|
||||
tools := []lib.CardLink{
|
||||
{
|
||||
Name: "Server Sent Events Demo",
|
||||
Description: "Server Sent Events Demo",
|
||||
Href: "/tools/ssedemo",
|
||||
Internal: true,
|
||||
},
|
||||
{
|
||||
Name: "Image Resizer",
|
||||
Description: "Image Resizer Tool",
|
||||
|
||||
Reference in New Issue
Block a user