-
-
Notifications
You must be signed in to change notification settings - Fork 12
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge pull request #100 from blackfyre/feat/go-templ
Feat: go templ
- Loading branch information
Showing
71 changed files
with
4,298 additions
and
3,999 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,2 @@ | ||
| golang 1.22.0 | ||
| nodejs 20.11.1 |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,27 @@ | ||
| { | ||
| "files.exclude": { | ||
| "**/*_templ.go": false, | ||
| "**/*_templ.txt": true | ||
| }, | ||
| "editor.formatOnSave": true, | ||
| "[templ]": { | ||
| "editor.defaultFormatter": "a-h.templ" | ||
| }, | ||
| "emmet.includeLanguages": { | ||
| "templ": "html" | ||
| }, | ||
| "cSpell.words": [ | ||
| "Artform", | ||
| "bluemonday", | ||
| "bulma", | ||
| "daos", | ||
| "fontawesome", | ||
| "Htmx", | ||
| "labstack", | ||
| "Lexend", | ||
| "pocketbase", | ||
| "templ", | ||
| "tmpl", | ||
| "Upsert" | ||
| ] | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,2 @@ | ||
| htmx.min.js | ||
| loading-states.js |
This file was deleted.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,67 @@ | ||
| package components | ||
|
|
||
| templ FeedbackForm() { | ||
| <section class="container"> | ||
| <h1 class="title">Are we doing good?</h1> | ||
| <form hx-post="/feedback" enctype="multipart/form-data" hx-target="#d" id="postcard_create"> | ||
| <div class="field"> | ||
| <label class="label">Name</label> | ||
| <div class="control"> | ||
| <input class="input" type="text" name="fp_name" placeholder="My name" required autocomplete="name"/> | ||
| </div> | ||
| </div> | ||
| <div class="field"> | ||
| <label class="label">Email</label> | ||
| <div class="control"> | ||
| <input | ||
| class="input" | ||
| type="email" | ||
| name="fp_email" | ||
| placeholder="My email address" | ||
| autocomplete="email" | ||
| required | ||
| /> | ||
| </div> | ||
| </div> | ||
| <div class="field"> | ||
| <label class="label">Message</label> | ||
| <div class="control"> | ||
| <trix-editor input="message" placeholder="Any areas we can improve on?"></trix-editor> | ||
| <input type="hidden" id="message" name="message"/> | ||
| </div> | ||
| </div> | ||
| <label aria-hidden="true" class="hpt" for="name"></label> | ||
| <input | ||
| aria-hidden="true" | ||
| class="hpt" | ||
| autocomplete="off" | ||
| type="text" | ||
| id="name" | ||
| name="name" | ||
| placeholder="Your name here" | ||
| /> | ||
| <label aria-hidden="true" class="hpt" for="email"></label> | ||
| <input | ||
| aria-hidden="true" | ||
| class="hpt" | ||
| autocomplete="off" | ||
| type="email" | ||
| id="email" | ||
| name="email" | ||
| placeholder="Your e-mail here" | ||
| /> | ||
| <div class="field is-grouped"> | ||
| <p class="control"> | ||
| <button class="button is-link" type="submit"> | ||
| Send feedback | ||
| </button> | ||
| </p> | ||
| <p class="control"> | ||
| <button type="button" class="button" hx-on="click: wga.closeDialog();"> | ||
| Cancel | ||
| </button> | ||
| </p> | ||
| </div> | ||
| </form> | ||
| </section> | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,43 @@ | ||
| package components | ||
|
|
||
| templ Footer() { | ||
| <footer class="footer"> | ||
| <div class="container"> | ||
| <div class="columns"> | ||
| <div class="column has-text-left"> | ||
| <p> | ||
| Please send your comments, sign our guestbook and send a postcard. | ||
| © Web Gallery of Art, created by Emil Krén and Daniel Marx. | ||
| </p> | ||
| <p> | ||
| v2 was made possible by our <a | ||
| href="/contributors" | ||
| hx-get="/contributors" | ||
| >contributors</a>! | ||
| </p> | ||
| </div> | ||
| <div class="column has-text-center"> | ||
| <p> | ||
| Donations for maintaining and developing the Gallery are welcome. | ||
| </p> | ||
| <ul class="has-text-right"> | ||
| <li><a href="https://ko-fi.com/blackfyre" target="_blank">ko-fi.com/blackfyre</a></li> | ||
| <li><a href="https://github.com/sponsors/blackfyre" target="_blank">Github sponsorship</a></li> | ||
| </ul> | ||
| </div> | ||
| <div class="column has-text-right"> | ||
| <p> | ||
| This is an open source project. You can find the source code on <a | ||
| href="https://github.com/blackfyre/wga" | ||
| target="_blank" | ||
| >Github</a>, and you're welcome to join | ||
| our <a href="/contributors" hx-get="/contributors">code contributors</a>! | ||
| </p> | ||
| <p> | ||
| <a data-cc="c-settings" href="#">Manage cookie settings</a> | ||
| </p> | ||
| </div> | ||
| </div> | ||
| </div> | ||
| </footer> | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,81 @@ | ||
| package components | ||
|
|
||
| type Image struct { | ||
| Thumb string | ||
| Image string | ||
| Title string | ||
| Technique string | ||
| Comment string | ||
| Url string | ||
| Id string | ||
| Jsonld interface{} | ||
| } | ||
|
|
||
| type ImageGrid []Image | ||
|
|
||
| templ ImageBase(i Image) { | ||
| <figure class="image is-4by3 hidden-caption"> | ||
| <picture> | ||
| <source media="(max-width: 768px)" srcset={ i.Thumb }/> | ||
| <source media="(min-width: 769px)" srcset={ i.Thumb }/> | ||
| <source media="(min-width: 1024px)" srcset={ i.Thumb }/> | ||
| <img src={ i.Image } alt={ i.Title } loading="lazy" alt={ i.Title + " - " + i.Technique }/> | ||
| </picture> | ||
| <figcaption>{ i.Title } - { i.Technique } </figcaption> | ||
| </figure> | ||
| } | ||
|
|
||
| // image_big is a template that renders a big image with its title and artist. | ||
| // It takes three parameters: ImageUrl (string) - the URL of the image, | ||
| // Title (string) - the title of the image, and Artist (string) - the artist of the image. | ||
| templ ImageBig(ImageUrl string, Title string, Artist string) { | ||
| <figure class="image hidden-caption"> | ||
| <img src={ ImageUrl } alt={ Title + " by " + Artist }/> | ||
| <figcaption>{ Title } by { Artist }</figcaption> | ||
| </figure> | ||
| } | ||
|
|
||
| templ ImageCard(i Image, hasLearnMore bool) { | ||
| <section class="card is-art-card"> | ||
| <div class="card-image"> | ||
| @ImageBase(i) | ||
| </div> | ||
| <div class="card-content"> | ||
| <div> | ||
| <h3 class="title is-size-3">{ i.Title }</h3> | ||
| <p class="subtitle">{ i.Technique }</p> | ||
| <div class="line-clamp-3 content"> | ||
| @templ.Raw(i.Comment) | ||
| </div> | ||
| </div> | ||
| </div> | ||
| <footer class="card-footer"> | ||
| if hasLearnMore { | ||
| <a class="card-footer-item" href={ templ.SafeURL(i.Url) } hx-get={ i.Url }> | ||
| Learn | ||
| More | ||
| </a> | ||
| } | ||
| <a | ||
| href="#" | ||
| hx-on="click: document.getElementById('d').showModal();" | ||
| hx-get={ `/postcard/send?awid=` + i.Id } | ||
| hx-target="#d" | ||
| class="card-footer-item" | ||
| > | ||
| Send | ||
| Postcard | ||
| </a> | ||
| </footer> | ||
| </section> | ||
| } | ||
|
|
||
| templ ImageGridComponent(i ImageGrid, hasLearnMore bool) { | ||
| <div class="columns is-multiline is-mobile works-listing" data-viewer> | ||
| for _, img := range i { | ||
| <div class="column is-full-mobile is-one-third-tablet is-one-quarter-desktop"> | ||
| @ImageCard(img, hasLearnMore) | ||
| </div> | ||
| } | ||
| </div> | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,81 @@ | ||
| package components | ||
|
|
||
| templ TopNav() { | ||
| <nav class="navbar is-fixed-top" role="navigation" aria-label="main navigation"> | ||
| <div class="navbar-brand"> | ||
| <a class="navbar-item" id="nav-logo" href="/" hx-get="/"> | ||
| <img | ||
| src="/assets/images/logo.png" | ||
| loading="lazy" | ||
| width="318" | ||
| height="45" | ||
| alt="Web Gallery of Art" | ||
| title="Go to Home" | ||
| /> | ||
| </a> | ||
| <a role="button" class="navbar-burger" aria-label="menu" aria-expanded="false" data-target="top-navbar"> | ||
| <span aria-hidden="true"></span> | ||
| <span aria-hidden="true"></span> | ||
| <span aria-hidden="true"></span> | ||
| </a> | ||
| </div> | ||
| <div id="top-navbar" class="navbar-menu"> | ||
| <div class="navbar-start"> | ||
| <a class="navbar-item" href="/" hx-get="/"> | ||
| Home | ||
| </a> | ||
| <a class="navbar-item" href="/artists" hx-get="/artists"> | ||
| Artists | ||
| </a> | ||
| <a class="navbar-item" href="/artworks" hx-get="/artworks"> | ||
| Artworks | ||
| </a> | ||
| <a class="navbar-item" href="/guestbook" hx-get="/guestbook" hx-trigger="guestbook-updated from:body"> | ||
| Guestbook | ||
| </a> | ||
| <!-- | ||
| <a class="navbar-item"> | ||
| Tours | ||
| </a> | ||
| <a class="navbar-item is-hidden-touch" hx-on="click: ToggleDualMode()"> | ||
| Dual mode | ||
| </a> | ||
| --> | ||
| <div class="navbar-item has-dropdown is-hoverable"> | ||
| <a class="navbar-link"> | ||
| More | ||
| </a> | ||
| <div class="navbar-dropdown"> | ||
| <a | ||
| class="navbar-item" | ||
| href="/pages/privacy-policy" | ||
| hx-get="/pages/privacy-policy" | ||
| > | ||
| Privacy Policy | ||
| </a> | ||
| <!-- | ||
| <a class="navbar-item"> | ||
| Glossary | ||
| </a> | ||
| <a class="navbar-item"> | ||
| Music | ||
| </a> | ||
| <a class="navbar-item"> | ||
| Database | ||
| </a> | ||
| <a class="navbar-item"> | ||
| Sources | ||
| </a> | ||
| <a class="navbar-item"> | ||
| About Us | ||
| </a> | ||
| <a class="navbar-item"> | ||
| Contact Us | ||
| </a> | ||
| --> | ||
| </div> | ||
| </div> | ||
| </div> | ||
| </div> | ||
| </nav> | ||
| } |
Oops, something went wrong.