diff options
Diffstat (limited to 'template')
| -rw-r--r-- | template/about.templ | 52 | ||||
| -rw-r--r-- | template/base.go | 3 | ||||
| -rw-r--r-- | template/base.templ | 51 | ||||
| -rw-r--r-- | template/coins.templ | 53 | ||||
| -rw-r--r-- | template/coins_designs.templ | 41 | ||||
| -rw-r--r-- | template/coins_designs_nl.templ | 43 | ||||
| -rw-r--r-- | template/coins_mintages.templ | 112 | ||||
| -rw-r--r-- | template/language.templ | 54 | ||||
| -rw-r--r-- | template/navbar.templ | 241 | ||||
| -rw-r--r-- | template/root.templ | 23 |
10 files changed, 673 insertions, 0 deletions
diff --git a/template/about.templ b/template/about.templ new file mode 100644 index 0000000..d7dfa06 --- /dev/null +++ b/template/about.templ @@ -0,0 +1,52 @@ +package template + +import "git.thomasvoss.com/euro-cash.eu/lib" + +const ( + contactEmail = `<a href="mailto:mail@euro-cash.eu">mail@euro-cash.eu</a>` + repoLinkStart = `<a href="https://git.thomasvoss.com/www.euro-cash.eu" target="_blank">` + linkEnd = `</a>` +) + +templ About() { + {{ p := ctx.Value("printer").(lib.Printer) }} + <header> + @navbar() + <h1>{ p.T("About Us") }</h1> + </header> + <main> + <h2>{ p.T("Open Source") }</h2> + <p> + @templ.Raw(p.T("This website is an open project, and a collaboration between developers, translators, and researchers. All source code, data, images, and more for the website are open source and can be found %shere%s. This site is licensed under the BSD 0-Clause license giving you the full freedom to do whatever you would like with any of the content on this site.", repoLinkStart, linkEnd)) + </p> + <h2>{ p.T("Contact Us") }</h2> + <p> + @templ.Raw(p.T("While we try to stay as up-to-date as possible and to fact check our information, it is always possible that we get something wrong, lack a translation, or are missing some piece of data you may have. In such a case don’t hesitate to contact us; we’ll try to get the site updated or fixed as soon as possible. You are always free to contribute via a git patch if you are more technically included, but if not you can always send an email to %s or contact ‘@onetruemangoman’ on Discord.", contactEmail)) + </p> + <h2>{ p.T("Special Thanks") }</h2> + <table> + <thead> + <th scope="col">{ p.T("Development") }</th> + <th scope="col">{ p.T("Research") }</th> + <th scope="col">{ p.T("Translations") }</th> + </thead> + <tbody> + <tr> + <td> + Jessika Wexler, + Lyyli Savolainen, + Ralf Nadel + </td> + <td> + Elín Hjartardóttir, + Storm Sørensen + </td> + <td> + <span data-tooltip={ p.T("British- & American English") }>Thomas Voss</span>, + <span data-tooltip={ p.T("Icelandic") }>Védís Indriðadóttir</span> + </td> + </tr> + </tbody> + </table> + </main> +} diff --git a/template/base.go b/template/base.go new file mode 100644 index 0000000..392b1c2 --- /dev/null +++ b/template/base.go @@ -0,0 +1,3 @@ +//go:generate templ generate -log-level warn + +package template diff --git a/template/base.templ b/template/base.templ new file mode 100644 index 0000000..bd8c082 --- /dev/null +++ b/template/base.templ @@ -0,0 +1,51 @@ +package template + +import "git.thomasvoss.com/euro-cash.eu/lib" + +templ Base(body templ.Component) { + {{ p := ctx.Value("printer").(lib.Printer) }} + <!DOCTYPE html> + <html lang={ p.Locale.Bcp }> + <head> + <meta charset="UTF-8"/> + <meta name="viewport" content="width=device-width, initial-scale=1.0"/> + <link rel="stylesheet" type="text/css" href="/style.css"/> + <title>Euro Cash</title> + <script type="text/javascript"> + const $ = q => document.querySelector(q); + const $$ = q => document.querySelectorAll(q); + + const validate = theme => + ["light", "dark"].includes(theme) ? theme : "light"; + const toggle = theme => + theme == "light" ? "dark" : "light"; + + const setTheme = theme => { + localStorage.setItem("theme", theme); + $("html").setAttribute("data-theme", theme); + $(`#nav-icon-theme-${theme}`) + .style.display = ""; + $(`#nav-icon-theme-${toggle(theme)}`) + .style.display = "none"; + }; + + document.addEventListener('DOMContentLoaded', _ => { + $("#theme-button").onclick = () => + setTheme(toggle(validate(localStorage.getItem("theme")))); + setTheme(validate(localStorage.getItem("theme"))); + }); + </script> + </head> + <body> + @body + <footer> + <p> + <small> + { p.T("Found a mistake or want to contribute missing information?") } + <a href="/">{ p.T("Feel free to contact us!") }</a> + </small> + </p> + </footer> + </body> + </html> +} diff --git a/template/coins.templ b/template/coins.templ new file mode 100644 index 0000000..ef1b0a1 --- /dev/null +++ b/template/coins.templ @@ -0,0 +1,53 @@ +package template + +import "git.thomasvoss.com/euro-cash.eu/lib" + +const newsLinkStart = `<a href="/news">` + +templ Coins() { + {{ p := ctx.Value("printer").(lib.Printer) }} + <header> + @navbar() + <h1>{ p.T("Euro Coins") }</h1> + </header> + <main> + <p> + @templ.Raw(p.T("On this section of the site you can find everything there is to know about the coins of the Eurozone. For the latest news on coin- and design releases, check out the %snews%s tab!", newsLinkStart, linkEnd)) + </p> + <hr/> + <section> + <div class="grid"> + <a class="no-deco" href="/coins/designs"> + <article> + <header> + <h3>{ p.T("Designs") }</h3> + </header> + <main> + { p.T("View the 600+ different Euro-coin designs!") } + </main> + </article> + </a> + <a class="no-deco" href="/coins/mintages"> + <article> + <header> + <h3>{ p.T("Mintages") }</h3> + </header> + <main> + { p.T("View the mintage figures of all the Euro coins!") } + </main> + </article> + </a> + <a class="no-deco" href="#TODO"> + <article> + <header> + <h3>{ p.T("Varieties") }</h3> + </header> + <main> + { p.T("View all the known Euro varieties!") } + </main> + </article> + </a> + </div> + </section> + </main> +} diff --git a/template/coins_designs.templ b/template/coins_designs.templ new file mode 100644 index 0000000..de47482 --- /dev/null +++ b/template/coins_designs.templ @@ -0,0 +1,41 @@ +package template + +import ( + "fmt" + "strings" + + "git.thomasvoss.com/euro-cash.eu/lib" +) + +var varietiesLinkStart = `<a href="/coins/varieties">` + +func makeURL(c lib.Country) templ.SafeURL { + url := fmt.Sprintf("/coins/designs/%s", c.Code) + return templ.SafeURL(url) +} + +templ CoinsDesigns() { + {{ p := ctx.Value("printer").(lib.Printer) }} + <header> + @navbar() + <h1>{ p.T("Euro Coin Designs") }</h1> + </header> + <main> + <p> + @templ.Raw(p.T("Here you’ll be able to view all the coin designs for each country in the Eurozone. This section of the site doesn’t include minor varieties such as different mintmarks or errors; those are on the %svarieties%s page.", varietiesLinkStart, linkEnd)) + </p> + <hr/> + <div class="country-grid"> + for _, c := range lib.SortedCountries(p) { + <a + role="button" + class="outline" + data-code={ strings.ToUpper(c.Code) } + href={ makeURL(c) } + > + { p.T(c.Name) } + </a> + } + </div> + </main> +} diff --git a/template/coins_designs_nl.templ b/template/coins_designs_nl.templ new file mode 100644 index 0000000..819b294 --- /dev/null +++ b/template/coins_designs_nl.templ @@ -0,0 +1,43 @@ +package template + +import "git.thomasvoss.com/euro-cash.eu/lib" + +templ CoinsDesignsNl() { + {{ p := ctx.Value("printer").(lib.Printer) }} + <header> + @navbar() + <h1>{ p.T("Dutch Euro Coin Designs") }</h1> + </header> + <main> + <div class="design-container"> + <img + src="/designs/nl-050-beatrix.png" + alt="Netherlands Queen Beatrix €0.50 Coin" + /> + <img + src="/designs/nl-050-willem-alexander.png" + alt="Netherlands King Willem-Alexander €0.50 Coin" + /> + </div> + <div class="design-container"> + <img + src="/designs/nl-100-beatrix.png" + alt="Netherlands Queen Beatrix €1 Coin" + /> + <img + src="/designs/nl-100-willem-alexander.png" + alt="Netherlands King Willem-Alexander €1 Coin" + /> + </div> + <p> + { p.T("From the years 1999–2013 all Dutch euro coins featured the portrait of Queen Beatrix of the Netherlands. After her abdication from the throne in 2013 the designs of all denominations were changed to feature the portrait of the new King Willem-Alexander. After her abdication the direction in which the monarchs portrait faced was flipped; a tradition dating back to the earliest coins of the Kingdom of the Netherlands.") } + </p> + <p> + { p.T("Coins featuring both monarchs contain text reading ‘BEATRIX KONINGIN DER NEDERLANDEN’ (‘BEATRIX QUEEN OF THE NETHERLANDS’) and ‘Willem-Alexander Koning der Nederlanden’ (‘Willem-Alexander King of the Netherlands’) respectively.") } + </p> + <p> + <!-- TODO: Link to the relief description in the Jargon page --> + { p.T("The €1 and €2 coins featuring King Willem-Alexander were minted with a much lower relief than most euro coins of the same denomination. As a result it is not uncommon for these coins to appear worn after little use in circulation.") } + </p> + </main> +} diff --git a/template/coins_mintages.templ b/template/coins_mintages.templ new file mode 100644 index 0000000..b6ed2de --- /dev/null +++ b/template/coins_mintages.templ @@ -0,0 +1,112 @@ +package template + +import ( + "strconv" + + "git.thomasvoss.com/euro-cash.eu/lib" + "git.thomasvoss.com/euro-cash.eu/lib/mintage" +) + +const muntrolpakketLinkStart = `<a href="#TODO">` + +var denoms = [...]float64{ + 0.01, 0.02, 0.05, 0.10, + 0.20, 0.50, 1.00, 2.00, +} + +templ CoinsMintages() { + {{ + code := ctx.Value("code").(string) + set := ctx.Value("set").(mintage.Set) + p := ctx.Value("printer").(lib.Printer) + }} + <header> + @navbar() + <h1>{ p.T("Euro Coin Mintages") }</h1> + </header> + <main> + <p> + { p.T("Here you’ll be able to view all the known mintages for all coins. You’ll also be able to filter on country, denomination, etc. If you have any mintage data that’s missing from our site, feel free to contact us.") } + </p> + <hr/> + if code == "nl" { + <h2>{ p.T("Additional Notes") }</h2> + <ul> + <li> + @templ.Raw(p.T("Most coins from the years 2003–2016 are listed as NIFC coins while other popular sources such as Numista claim they were minted for circulation. For more information on why others are wrong, %sclick here%s.", muntrolpakketLinkStart, linkEnd)) + </li> + <li> + { p.T("In 2003 Numista calculated a total of %d coins issued for coin sets per denomination. Our own calculations found only %d. Numista also forgot to include the many hundred thousand coins from the coin roll sets that were produced.", 217503, 177003) } + </li> + </ul> + } + <section> + <form> + <div class="grid"> + <label for="country-dd"> + { p.T("Country") } + <select id="country-dd" name="c"> + for _, c := range ctx.Value("countries"). + ([]lib.Country) { + <option + value={ c.Code } + selected?={ c.Code == code } + > + { c.Name } + </option> + } + </select> + </label> + <fieldset> + <label for="compact-circ"> + <input id="compact-circ" type="checkbox" name="circ" checked/> + { p.T("Circulation Coins") } + </label> + <label for="compact-nifc"> + <input id="compact-nifc" type="checkbox" name="nifc"/> + { p.T("NIFC / BU Sets") } + </label> + <label for="compact-proof"> + <input id="compact-proof" type="checkbox" name="proof"/> + { p.T("Proof Coins") } + </label> + </fieldset> + </div> + <button type="submit">{ p.T("Filter") }</button> + </form> + <figure> + <table class="mintage-table" role="grid"> + <thead> + <th>{ p.T("Year") }</th> + for _, x := range denoms { + <th>{ p.Money(x, false) }</th> + } + </thead> + <tbody> + for _, row := range set.Circ { + <tr> + <th scope="col"> + if row.Mintmark != "" { + { strconv.Itoa(row.Year) } <sub><small>{ row.Mintmark }</small></sub> + } else { + { strconv.Itoa(row.Year) } + } + </th> + for _, col := range row.Cols { + switch col { + case mintage.Unknown: + <td>{ p.T("Unknown") }</td> + case 0: + <td>—</td> + default: + <td>{ p.N(col) }</td> + } + } + </tr> + } + </tbody> + </table> + </figure> + </section> + </main> +} diff --git a/template/language.templ b/template/language.templ new file mode 100644 index 0000000..1b48295 --- /dev/null +++ b/template/language.templ @@ -0,0 +1,54 @@ +package template + +import ( + "strings" + + "git.thomasvoss.com/euro-cash.eu/lib" +) + +templ Language() { + {{ p := ctx.Value("printer").(lib.Printer) }} + <header> + @navbar() + <h1>{ p.T("Select Your Language") }</h1> + </header> + <main> + <p> + { p.T("Select your preferred language to use on the site.") } + </p> + <p> + If you are an American user, it’s suggested that you select + American English instead of British English. This will ensure that + dates will be formatted with the month before the day. + </p> + <hr/> + <h2>{ p.T("Eurozone Languages") }</h2> + @languageGrid(true) + <h2>{ p.T("Other Languages") }</h2> + @languageGrid(false) + </main> +} + +templ languageGrid(eurozone bool) { + <form action="/language" method="POST"> + <div class="lang-grid"> + for _, loc := range lib.Locales { + if loc.Eurozone == eurozone { + <button + type="submit" + name="locale" + value={ loc.Bcp } + disabled?={ !loc.Enabled } + > + <span + lang={ loc.Bcp } + data-code={ strings.ToUpper(loc.Language()) } + > + { loc.Name } + </span> + </button> + } + } + </div> + </form> +} diff --git a/template/navbar.templ b/template/navbar.templ new file mode 100644 index 0000000..2aceac2 --- /dev/null +++ b/template/navbar.templ @@ -0,0 +1,241 @@ +package template + +import "git.thomasvoss.com/euro-cash.eu/lib" + +templ navbar() { + {{ p := ctx.Value("printer").(lib.Printer) }} + <nav> + <menu> + <li><a href="/">{ p.T("Home") }</a></li> + <li><a href="#TODO">{ p.T("News") }</a></li> + <li><a href="#TODO">{ p.T("Coin Collecting") }</a></li> + <li><a href="/coins">{ p.T("Coins") }</a></li> + <li><a href="#TODO">{ p.T("Banknotes") }</a></li> + <li><a href="#TODO">{ p.T("Jargon") }</a></li> + </menu> + <menu> + <li> + <a + href="https://discord.gg/DCaXfRcy9C" + target="_blank" + > + { p.T("Discord") } + </a> + </li> + <li><a href="/about">{ p.T("About") }</a></li> + <li id="nav-icon-lang"> + <a href="/language"> + <svg + version="1.1" + width="19" + height="19" + viewBox="0 0 19 19" + fill="none" + xmlns="http://www.w3.org/2000/svg" + > + <circle + cx="9.5" + cy="9.5" + r="9" + stroke-linejoin="round" + ></circle> + <path + d="M 9.5 .5 + C 9.5 .5 + 6.0 3.5 + 6.0 9.5 + C 6.0 15.5 + 9.5 18.5 + 9.5 18.5" + stroke-linejoin="round" + ></path> + <path + d="M 9.5 .5 + C 9.5 .5 + 13.0 3.5 + 13.0 9.5 + C 13.0 15.5 + 9.5 18.5 + 9.5 18.5" + stroke-linejoin="round" + ></path> + <path d="M .5 9.5 H 18.5" stroke-linejoin="round"></path> + <path d="M 17.0 5.0 H 2.0" stroke-linejoin="round"></path> + <path d="M 17.0 14.0 H 2.0" stroke-linejoin="round"></path> + </svg> + { p.T("Language") } + </a> + </li> + <li id="nav-icon-theme"> + <button id="theme-button"> + <svg + id="nav-icon-theme-dark" + version="1.1" + width="24" + height="24" + viewBox="0 0 24 24" + fill="none" + xmlns="http://www.w3.org/2000/svg" + > + <path + d="M 7.28451 10.3333 + C 7.10026 10.8546 + 7 11.4156 + 7 12 + C 7 14.7614 + 9.23858 17 + 12 17 + C 14.7614 17 + 17 14.7614 + 17 12 + C 17 9.23858 + 14.7614 7 + 12 7 + C 11.4156 7 + 10.8546 7.10026 + 10.3333 7.28451" + stroke-width="1.5" + stroke-linecap="round" + ></path> + <path + d="M 12 2 V 4" + stroke-width="1.5" + stroke-linecap="round" + ></path> + <path + d="M 12 20 V 22" + stroke-width="1.5" + stroke-linecap="round" + ></path> + <path + d="M 4 12 L 2 12" + stroke-width="1.5" + stroke-linecap="round" + ></path> + <path + d="M 22 12 L 20 12" + stroke-width="1.5" + stroke-linecap="round" + ></path> + <path + d="M 19.7778 4.22266 L 17.5558 6.25424" + stroke-width="1.5" + stroke-linecap="round" + ></path> + <path + d="M 4.22217 4.22266 L 6.44418 6.25424" + stroke-width="1.5" + stroke-linecap="round" + ></path> + <path + d="M 6.44434 17.5557 L 4.22211 19.7779" + stroke-width="1.5" + stroke-linecap="round" + ></path> + <path + d="M 19.7778 19.7773 L 17.5558 17.5551" + stroke-width="1.5" + stroke-linecap="round" + ></path> + </svg> + <svg + id="nav-icon-theme-light" + version="1.1" + width="24" + height="24" + viewBox="0 0 24 24" + fill="none" + xmlns="http://www.w3.org/2000/svg" + > + <path + d="M 21.0672 11.8568 + L 20.4253 11.469 + L 21.0672 11.8568 + Z + M 12.1432 2.93276 + L 11.7553 2.29085 + V 2.29085 + L 12.1432 2.93276 + Z + M 7.37554 20.013 + C 7.017 19.8056 6.5582 19.9281 6.3508 20.2866 + C 6.14339 20.6452 6.26591 21.104 6.62446 21.3114 + L 7.37554 20.013 + Z + M 2.68862 17.3755 + C 2.89602 17.7341 3.35482 17.8566 3.71337 17.6492 + C 4.07191 17.4418 4.19443 16.983 3.98703 16.6245 + L 2.68862 17.3755 + Z + M 21.25 12 + C 21.25 17.1086 17.1086 21.25 12 21.25 + V 22.75 + C 17.9371 22.75 22.75 17.9371 22.75 12 + H 21.25 + Z + M 2.75 12 + C 2.75 6.89137 6.89137 2.75 12 2.75 + V 1.25 + C 6.06294 1.25 1.25 6.06294 1.25 12 + H 2.75 + Z + M 15.5 14.25 + C 12.3244 14.25 9.75 11.6756 9.75 8.5 + H 8.25 + C 8.25 12.5041 11.4959 15.75 15.5 15.75 + V 14.25 + Z + M 20.4253 11.469 + C 19.4172 13.1373 17.5882 14.25 15.5 14.25 + V 15.75 + C 18.1349 15.75 20.4407 14.3439 21.7092 12.2447 + L 20.4253 11.469 + Z + M 9.75 8.5 + C 9.75 6.41182 10.8627 4.5828 12.531 3.57467 + L 11.7553 2.29085 + C 9.65609 3.5593 8.25 5.86509 8.25 8.5 + H 9.75 + Z + M 12 2.75 + C 11.9115 2.75 11.8077 2.71008 11.7324 2.63168 + C 11.6686 2.56527 11.6538 2.50244 11.6503 2.47703 + C 11.6461 2.44587 11.6482 2.35557 11.7553 2.29085 + L 12.531 3.57467 + C 13.0342 3.27065 13.196 2.71398 13.1368 2.27627 + C 13.0754 1.82126 12.7166 1.25 12 1.25 + V 2.75 + Z + M 21.7092 12.2447 + C 21.6444 12.3518 21.5541 12.3539 21.523 12.3497 + C 21.4976 12.3462 21.4347 12.3314 21.3683 12.2676 + C 21.2899 12.1923 21.25 12.0885 21.25 12 + H 22.75 + C 22.75 11.2834 22.1787 10.9246 21.7237 10.8632 + C 21.286 10.804 20.7293 10.9658 20.4253 11.469 + L 21.7092 12.2447 + Z + M 12 21.25 + C 10.3139 21.25 8.73533 20.7996 7.37554 20.013 + L 6.62446 21.3114 + C 8.2064 22.2265 10.0432 22.75 12 22.75 + V 21.25 + Z + M 3.98703 16.6245 + C 3.20043 15.2647 2.75 13.6861 2.75 12 + H 1.25 + C 1.25 13.9568 1.77351 15.7936 2.68862 17.3755 + L 3.98703 16.6245 + Z + " + ></path> + </svg> + </button> + </li> + </menu> + </nav> +} + +css noMargin() { + margin: 0; +} diff --git a/template/root.templ b/template/root.templ new file mode 100644 index 0000000..657314c --- /dev/null +++ b/template/root.templ @@ -0,0 +1,23 @@ +package template + +import "git.thomasvoss.com/euro-cash.eu/lib" + +templ Root() { + {{ p := ctx.Value("printer").(lib.Printer) }} + <header> + @navbar() + <hgroup> + <h1>{ p.T("The Euro Cash Compendium") }</h1> + <p> + { p.T("United in") } + <del>{ p.T("diversity") }</del> + <ins>{ p.T("cash") }</ins> + </p> + </hgroup> + </header> + <main> + <p> + { p.T("Welcome to the Euro Cash Compendium. This sites aims to be a resource for you to discover everything there is to know about the coins and banknotes of the Euro, a currency that spans 26 countries and 350 million people. We also have dedicated sections of the site for collectors.") } + </p> + </main> +} |