consolidate view and views directories

This commit is contained in:
ari melody 2025-04-02 21:21:19 +01:00
parent 5cc9a1ca76
commit 8eb432539c
Signed by: ari
GPG key ID: 60B5F0386E3DDB7E
10 changed files with 34 additions and 27 deletions

21
view/404.html Normal file
View file

@ -0,0 +1,21 @@
{{define "head"}}
<title>404 - ari melody 💫</title>
<link rel="shortcut icon" href="/img/favicon.png" type="image/x-icon">
<link rel="stylesheet" href="/style/error.css">
{{end}}
{{define "content"}}
<main>
<h1>
# 404 - not found!
</h1>
<p>
the page you're looking for does not exist.
<br>
if you like, you can head back <a href="/">home</a> or <a href="{{.Target}}">try again!</a>
</p>
<p><small>status: ERR_NOT_FOUND</small></p>
</main>
{{end}}

9
view/footer.html Normal file
View file

@ -0,0 +1,9 @@
{{define "footer"}}
<footer>
<div id="footer">
<small><em>*made with <span aria-label="love"></span> by ari, 2025*</em></small>
</div>
</footer>
{{end}}

44
view/header.html Normal file
View file

@ -0,0 +1,44 @@
{{define "header"}}
<header>
<nav>
<div id="header-home">
<img src="/img/favicon.png" id="header-icon" width="100" height="100" alt="">
<div id="header-text">
<h1>ari melody</h1>
<h2>your local SPACEGIRL 💫</h2>
</div>
</div>
<a id="header-links-toggle">
<svg viewBox="0 0 70 50" xmlns="http://www.w3.org/2000/svg" width="24" height="24">
<rect y="00" width="70" height="10" rx="5" fill="#eee" />
<rect y="20" width="70" height="10" rx="5" fill="#eee" />
<rect y="40" width="70" height="10" rx="5" fill="#eee" />
</svg>
</a>
<ul id="header-links">
<li>
<a href="/" preload="mouseover">home</a>
</li>
<li>
<a href="/music" preload="mouseover">music</a>
</li>
<li>
<a href="https://git.arimelody.me/ari/arimelody.me" target="_blank">source</a>
</li>
<li>
<!-- coming later! -->
<span title="coming later!">blog</span>
</li>
<li>
<!-- coming later! -->
<span title="coming later!">art</span>
</li>
<li id="toggle-crt">
<a href="javascript:void(0)">crt</a>
</li>
</ul>
</nav>
</header>
{{end}}

215
view/index.html Normal file
View file

@ -0,0 +1,215 @@
{{define "head"}}
<title>ari melody 💫</title>
<link rel="shortcut icon" href="/img/favicon.png" type="image/x-icon">
<meta name="description" content="home to your local SPACEGIRL 💫">
<meta property="og:title" content="ari melody">
<meta property="og:type" content="website">
<meta property="og:url" content="www.arimelody.me">
<meta property="og:image" content="https://www.arimelody.me/img/favicon.png">
<meta property="og:site_name" content="ari melody">
<meta property="og:description" content="home to your local SPACEGIRL 💫">
<link rel="stylesheet" href="/style/main.css">
<link rel="stylesheet" href="/style/index.css">
<link rel="me" href="https://ice.arimelody.me/@ari">
<link rel="me" href="https://wetdry.world/@ari">
<script type="module" src="/script/index.js" defer> </script>
{{end}}
{{define "content"}}
<main>
<h1 class="typeout">
# hello, world!
</h1>
<p>
<strong>i'm ari!</strong>
<br>
<small>she/her 🏳️‍⚧️🏳️‍🌈💫🦆🇮🇪</small>
</p>
<p>
i'm a <a href="/music">musician</a>, <a href="https://github.com/arimelody?tab=repositories">developer</a>,
<a href="https://twitch.tv/arispacegirl">streamer</a>, <a href="https://youtube.com/@arispacegirl">youtuber</a>,
and probably a bunch of other things i forgot to mention!
</p>
<p>
you're very welcome to take a look around my little space on the internet here,
or explore any of the other parts i inhabit!
</p>
<p>
if you're looking to support me financially, that's so cool of you!!
if you like, you can buy some of my music over on
<a href="https://arimelody.bandcamp.com" target="_blank">bandcamp</a>
so you can at least get something for your money.
thank you very much either way!! 💕
</p>
<p>
for anything else, you can reach me for any and all communications through
<a href="mailto:ari@arimelody.me">ari@arimelody.me</a>. if your message
contains anything beyond a silly gag, i strongly recommend encrypting
your message using my public pgp key, listed below!
</p>
<p>
thank you for stopping by- i hope you have a lovely rest of your day! 💫
</p>
<hr>
<h2 class="typeout">
## metadata
</h2>
<p>
<strong>my colours 🌈</strong>
</p>
<ul>
<li>primary: <span class="col-primary" id="hex-primary">#b7fd49</span></li>
<li>secondary: <span class="col-secondary" id="hex-secondary">#f8e05b</span></li>
<li>tertiary: <span class="col-tertiary" id="hex-tertiary">#f788fe</span></li>
</ul>
<p>
<strong>my keys 🔑</strong>
</p>
<ul>
<li>pgp: <a href="/keys/ari melody_0x92678188_public.asc" target="_blank">[link]</a></li>
<li>ssh (ed25519): <a href="/keys/id_ari_ed25519.pub" target="_blank">[link]</a></li>
</ul>
<p>
<strong>where to find me 🛰️</strong>
</p>
<ul class="links">
<li>
<a href="https://youtube.com/@arispacegirl" target="_blank">youtube</a>
</li>
<li>
<a href="https://twitch.tv/arispacegirl" target="_blank">twitch</a>
</li>
<li>
<a href="https://sptfy.com/mellodoot" target="_blank">spotify</a>
</li>
<li>
<a href="https://arimelody.bandcamp.com" target="_blank">bandcamp</a>
</li>
<li>
<a href="https://github.com/arimelody" target="_blank">github</a>
</li>
</ul>
<p>
<strong>projects i've worked on 🛠️</strong>
</p>
<ul class="links">
<li>
<a href="https://catdance.arimelody.me" target="_blank">
catdance
</a>
</li>
<li>
<a href="https://git.arimelody.me/ari/prideflag" target="_blank">
pride flag
</a>
</li>
<li>
<a href="https://github.com/arimelody/ipaddrgen" target="_blank">
ipaddrgen
</a>
</li>
<li>
<a href="https://impact.arimelody.me/" target="_blank">
impact meme
</a>
</li>
<li>
<a href="https://term.arimelody.me/" target="_blank">
OpenTerminal
</a>
</li>
<li>
<a href="https://silver.bliss.town/" target="_blank">
Silver.js
</a>
</li>
</ul>
<hr>
<h2 class="typeout">
## cool critters
</h2>
<div id="web-buttons">
<a href="https://arimelody.me">
<img src="/img/buttons/ari melody.gif" alt="ari melody web button" width="88" height="31">
</a>
<a href="https://supitszaire.com" target="_blank">
<img src="/img/buttons/zaire.gif" alt="zaire web button" width="88" height="31">
</a>
<a href="https://mae.wtf" target="_blank">
<img src="/img/buttons/mae.png" alt="vimae web button" width="88" height="31">
</a>
<a href="https://zvava.org" target="_blank">
<img src="/img/buttons/zvava.png" alt="zvava web button" width="88" height="31">
</a>
<a href="https://elke.cafe" target="_blank">
<img src="/img/buttons/elke.gif" alt="elke web button" width="88" height="31">
</a>
<a href="https://invoxiplaygames.uk/" target="_blank">
<img src="/img/buttons/ipg.png" alt="InvoxiPlayGames web button" width="88" height="31">
</a>
<a href="https://ioletsgo.gay" target="_blank">
<img src="/img/buttons/ioletsgo.gif" alt="ioletsgo web button" width="88" height="31">
</a>
<a href="https://notnite.com/" target="_blank">
<img src="/img/buttons/notnite.png" alt="notnite web button" width="88" height="31">
</a>
<a href="https://www.da.vidbuchanan.co.uk/" target="_blank">
<img src="/img/buttons/retr0id_now.gif" alt="retr0id web button" width="88" height="31">
</a>
<a href="https://aikoyori.xyz" target="_blank">
<img src="/img/buttons/aikoyori.gif" alt="aikoyori web button" width="88" height="31">
</a>
<a href="https://xenia.blahaj.land/" target="_blank">
<img src="/img/buttons/xenia.png" alt="xenia web button" width="88" height="31">
</a>
<a href="https://stardust.elysium.gay/" target="_blank">
<img src="/img/buttons/stardust.png" alt="stardust web button" width="88" height="31">
</a>
<a href="https://isabelroses.com/" target="_blank">
<img src="/img/buttons/isabelroses.gif" alt="isabel roses web button" width="88" height="31">
</a>
<hr>
<img src="/img/buttons/misc/debian.gif" alt="powered by debian" width="88" height="31">
<img src="/img/buttons/misc/girls4notepad.gif" alt="girls 4 notepad" width="88" height="31">
<img src="/img/buttons/misc/gaywebring.gif" alt="this website is GAY" width="88" height="31">
<img src="/img/buttons/misc/graphicdesign.gif" alt="graphic design is my passion" width="88" height="31">
<img src="/img/buttons/misc/gplv3.gif" alt="GPLv3 free software" width="88" height="31">
<img src="/img/buttons/misc/hl.gif" alt="half-life" width="88" height="31">
<img src="/img/buttons/misc/h-free-anim.gif" alt="dis site is hentai FREE" width="88" height="31">
<img src="/img/buttons/misc/sprunk.gif" alt="sprunk" width="88" height="31">
<img src="/img/buttons/misc/tohell.gif" alt="go straight to hell" width="88" height="31">
<img src="/img/buttons/misc/virusalert.gif" alt="virus alert! click here" onclick="alert('meow :3')" width="88" height="31">
<a href="http://wiishopchannel.net/" target="_blank">
<img src="/img/buttons/misc/wii.gif" alt="wii" width="88" height="31">
</a>
<img src="/img/buttons/misc/www2.gif" alt="www" width="88" height="31">
<img src="/img/buttons/misc/iemandatory.gif" alt="get mandatory internet explorer" width="88" height="31">
<img src="/img/buttons/misc/learn_html.gif" alt="HTML - learn it today!" width="88" height="31">
<a href="https://smokepowered.com" target="_blank">
<img src="/img/buttons/misc/smokepowered.gif" alt="high on SMOKE" width="88" height="31">
</a>
<a href="https://epicblazed.com" target="_blank">
<img src="/img/buttons/misc/epicblazed.png" alt="epic blazed" width="88" height="31">
</a>
<img src="/img/buttons/misc/blink.gif" alt="closeup anime blink" width="88" height="31">
</div>
</main>
{{end}}

34
view/layout.html Normal file
View file

@ -0,0 +1,34 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
{{block "head" .}}{{end}}
<script type="module", src="/script/main.js"></script>
</head>
<body>
{{template "header"}}
{{block "content" .}}
<main>
<h1>
# hello, world!
</h1>
<p>
this is a default page!
</p>
</main>
{{end}}
{{template "footer"}}
<div id="overlay"></div>
{{template "prideflag"}}
</body>
</html>

179
view/music-gateway.html Normal file
View file

@ -0,0 +1,179 @@
{{define "head"}}
<title>{{.Title}} - {{.PrintArtists true true}}</title>
<link rel="shortcut icon" href="{{.GetArtwork}}" type="image/x-icon">
<meta name="description" content="Stream &quot;{{.Title}}&quot; by {{.PrintArtists true true}} on all platforms!">
<meta name="author" content="{{.PrintArtists true true}}">
<meta name="keywords" content="{{.PrintArtists true false}}, music, {{.Title}}, {{.ID}}, {{.ReleaseDate.Year}}">
<meta property="og:url" content="https://arimelody.me/music/{{.ID}}">
<meta property="og:type" content="website">
<meta property="og:locale" content="en_IE">
<meta property="og:site_name" content="ari melody music">
<meta property="og.Title" content="{{.Title}} - {{.PrintArtists true true}}">
<meta property="og:description" content="Stream &quot;{{.Title}}&quot; by {{.PrintArtists true true}} on all platforms!">
<meta property="og:image" content="https://arimelody.me{{.GetArtwork}}">
<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:site" content="@funniduck">
<meta name="twitter:creator" content="@funniduck">
<meta property="twitter:domain" content="arimelody.me">
<meta property="twitter:url" content="https://arimelody.me/music/{{.ID}}">
<meta name="twitter.Title" content="{{.PrintArtists true true}} - {{.Title}}">
<meta name="twitter:description" content="Stream &quot;{{.Title}}&quot; by {{.PrintArtists true true}} on all platforms!">
<meta name="twitter:image" content="https://arimelody.me{{.GetArtwork}}">
<meta name="twitter:image:alt" content="Cover art for &quot;{{.Title}}&quot;">
<link rel="stylesheet" href="/style/main.css">
<link rel="stylesheet" href="/style/music-gateway.css">
{{end}}
{{define "content"}}
<main >
<script type="module" src="/script/music-gateway.js"></script>
<div id="background" style="background-image: url({{.GetArtwork}})"></div>
<a href="/music" id="go-back" title="back to arimelody.me">&lt;</a>
<br><br>
<div id="music-container">
<div id="art-container">
<div class="tilt-topleft"></div>
<div class="tilt-top"></div>
<div class="tilt-topright"></div>
<div class="tilt-right"></div>
<div class="tilt-bottomright"></div>
<div class="tilt-bottom"></div>
<div class="tilt-bottomleft"></div>
<div class="tilt-left"></div>
<img id="artwork" src="{{.GetArtwork}}" alt="{{.Title}} artwork" width=240 height=240>
</div>
<div id="vertical-line"></div>
<div id="info">
<div id="overview">
<div id="title-container">
<h1 id="title">{{.Title}}</h1>
<span id="year" title="{{.PrintReleaseDate}}">{{.ReleaseDate.Year}}</span>
</div>
<p id="artist">{{.PrintArtists true true}}</p>
{{if .IsReleased}}
<p id="type" class="{{.ReleaseType}}">{{.ReleaseType}}</p>
{{else}}
<p id="type" class="upcoming">upcoming</p>
<p id="upcoming-release">Releases: {{.PrintReleaseDate}}</p>
{{end}}
{{if .IsReleased}}
{{if .Buylink}}
<a href="{{.Buylink}}" id="buylink">{{or .Buyname "buy"}}</a>
{{end}}
<ul id="links">
{{range .Links}}
<li>
<a class="{{.NormaliseName}}" href="{{.URL}}">{{.Name}}</a>
</li>
{{end}}
</ul>
{{end}}
{{if .Description}}
<p id="description">{{.GetDescriptionHTML}}</p>
{{else if .IsSingle}}
{{$Track := index .Tracks 0}}
{{if $Track.Description}}
<p id="description">{{$Track.Description}}</p>
{{end}}
{{end}}
{{if and .Copyright .CopyrightURL}}
<p id="copyright">{{.Title}} &copy; {{.ReleaseDate.Year}} by {{.PrintArtists true true}} is licensed under <a href="{{.CopyrightURL}}" target="_blank">{{.Copyright}}</a></p>
{{end}}
<button id="share">share</button>
</div>
{{if .IsReleased}}
{{if .Credits}}
<div id="credits">
<h2>CREDITS</h2>
<ul>
{{range .Credits}}
{{$Artist := .Artist}}
{{if $Artist.Website}}
<li><strong><a href="{{$Artist.Website}}">{{$Artist.Name}}</a></strong>: {{.Role}}</li>
{{else}}
<li><strong>{{$Artist.Name}}</strong>: {{.Role}}</li>
{{end}}
{{end}}
</ul>
</div>
{{end}}
{{if .IsSingle}}
{{$Track := index .Tracks 0}}
{{if $Track.Lyrics}}
<div id="lyrics">
<p class="album-track-subheading">LYRICS</p>
{{if $Track.Lyrics}}
{{$Track.GetLyricsHTML}}
{{else}}
<span class="empty">No lyrics.</span>
{{end}}
</div>
{{end}}
{{else if .Tracks}}
<div id="tracks">
<h2>TRACKS</h2>
{{range $i, $track := .Tracks}}
<details>
<summary class="album-track-title">{{$track.Add $i 1}}. {{$track.Title}}</summary>
{{if $track.Description}}
<p class="album-track-subheading">DESCRIPTION</p>
{{$track.Description}}
{{end}}
<p class="album-track-subheading">LYRICS</p>
{{if $track.Lyrics}}
{{$track.GetLyricsHTML}}
{{else}}
<span class="empty">No lyrics.</span>
{{end}}
</details>
{{end}}
</div>
{{end}}
{{end}}
</div>
{{if .IsReleased}}
<div id="extras">
<ul>
<li><a href="#overview">overview</a></li>
{{if .Credits}}
<li><a href="#credits">credits</a></li>
{{end}}
{{if .IsSingle}}
{{$Track := index .Tracks 0}}
{{if $Track.Lyrics}}
<li><a href="#lyrics">lyrics</a></li>
{{end}}
{{else if .Tracks}}
<li><a href="#tracks">tracks</a></li>
{{end}}
</ul>
</div>
{{end}}
</div>
</main>
{{end}}

91
view/music.html Normal file
View file

@ -0,0 +1,91 @@
{{define "head"}}
<title>music - ari melody 💫</title>
<link rel="shortcut icon" href="/img/favicon.png" type="image/x-icon">
<meta name="description" content="music from your local SPACEGIRL 💫">
<meta property="og:title" content="ari melody music">
<meta property="og:type" content="website">
<meta property="og:url" content="www.arimelody.me/music">
<meta property="og:image" content="https://www.arimelody.me/img/favicon.png">
<meta property="og:site_name" content="ari melody">
<meta property="og:description" content="music from your local SPACEGIRL 💫">
<link rel="stylesheet" href="/style/main.css">
<link rel="stylesheet" href="/style/index.css">
<link rel="stylesheet" href="/style/music.css">
{{end}}
{{define "content"}}
<main>
<script type="module" src="/script/music.js"></script>
<h1 class="typeout">
# my music
</h1>
<div id="music-container">
{{range $Release := .}}
<div class="music" id="{{$Release.ID}}">
<div class="music-artwork">
<img src="{{$Release.GetArtwork}}" alt="{{$Release.Title}} artwork" width="128" loading="lazy">
</div>
<div class="music-details">
<h1 class="music-title">
<a href="/music/{{$Release.ID}}">
{{$Release.Title}}
</a>
</h1>
<h2 class="music-artist">{{$Release.PrintArtists true true}}</h2>
<h3 class="music-type-{{$Release.ReleaseType}}">{{$Release.ReleaseType}}</h3>
{{if $Release.IsReleased}}
<ul class="music-links">
{{range $Link := $Release.Links}}
<li>
<a href="{{$Link.URL}}" class="link-button">{{$Link.Name}}</a>
</li>
{{end}}
</ul>
{{end}}
</div>
</div>
{{end}}
</div>
<h2 id="usage" class="question typeout">
<a href="#usage">
&gt; "can i use your music in my content?"
</a>
</h2>
<div class="answer">
<p>
<strong class="big">yes!*</strong> <em>in most cases...</em>
</p>
<p>
all of my <em>self-released</em> songs are licensed under
<a href="https://creativecommons.org/licenses/by-sa/4.0/" target="_blank">Creative Commons Attribution-ShareAlike 4.0</a>.
anyone may use and remix these songs freely, so long as they provide credit back to me and link back to this license!
please note that all derivative works must inherit this license.
</p>
<p>
a great example of some credit text would be as follows:
</p>
<blockquote>
music used: ari melody - free2play<br>
<a href="/music/free2play">https://arimelody.me/music/free2play</a><br>
licensed under <a href="https://creativecommons.org/licenses/by-sa/4.0/" target="_blank">CC BY-SA 4.0</a>.
</blockquote>
<p>
if the song you want to use is <em>not</em> released by me (i.e. under a record label), their usage rights
will likely trump whatever i'd otherwise have in mind. i'll try to negotiate some nice terms, though!
</p>
<p>
i believe that encouraging creative use of artistic works is better than stifling any use at all.
if you do happen to use my work in something you're particularly proud of, feel free to send it my way!
</p>
<p>
&gt; <a href="mailto:ari@arimelody.me">ari@arimelody.me</a>
</p>
</div>
</main>
{{end}}

21
view/prideflag.html Normal file
View file

@ -0,0 +1,21 @@
{{define "prideflag"}}
<a href="https://github.com/arimelody/prideflag" target="_blank" id="prideflag">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 120 120" width="120" height="120" hx-preserve="true">
<path id="red" d="M120,80 L100,100 L120,120 Z" style="fill:#d20605"/>
<path id="orange" d="M120,80 V40 L80,80 L100,100 Z" style="fill:#ef9c00"/>
<path id="yellow" d="M120,40 V0 L60,60 L80,80 Z" style="fill:#e5fe02"/>
<path id="green" d="M120,0 H80 L40,40 L60,60 Z" style="fill:#09be01"/>
<path id="blue" d="M80,0 H40 L20,20 L40,40 Z" style="fill:#081a9a"/>
<path id="purple" d="M40,0 H0 L20,20 Z" style="fill:#76008a"/>
<rect id="black" x="60" width="60" height="60" style="fill:#010101"/>
<rect id="brown" x="70" width="50" height="50" style="fill:#603814"/>
<rect id="lightblue" x="80" width="40" height="40" style="fill:#73d6ed"/>
<rect id="pink" x="90" width="30" height="30" style="fill:#ffafc8"/>
<rect id="white" x="100" width="20" height="20" style="fill:#fff"/>
<rect id="intyellow" x="110" width="10" height="10" style="fill:#fed800"/>
<circle id="intpurple" cx="120" cy="0" r="5" stroke="#7601ad" stroke-width="2" fill="none"/>
</svg>
</a>
{{end}}