first commit! 🎉

Signed-off-by: ari melody <ari@arimelody.me>
2024-03-18 10:34:43 +00:00 · 2024-03-18 10:34:43 +00:00 · 27d6e4f011
commit 27d6e4f011
97 changed files with 2957 additions and 0 deletions
--- a/.gitattributes
+++ b/.gitattributes
@ -0,0 +1,10 @@
+*.woff2 filter=lfs diff=lfs merge=lfs -text
+*.gif filter=lfs diff=lfs merge=lfs -text
+*.png filter=lfs diff=lfs merge=lfs -text
+*.jpg filter=lfs diff=lfs merge=lfs -text
+*.webp filter=lfs diff=lfs merge=lfs -text
+*.webm filter=lfs diff=lfs merge=lfs -text
+*.mp3 filter=lfs diff=lfs merge=lfs -text
+*.mp4 filter=lfs diff=lfs merge=lfs -text
+. !text !filter !merge !diff
+* !text !filter !merge !diff
--- a/.gitignore
+++ b/.gitignore
@ -0,0 +1 @@
+**/.DS_Store
--- a/api/v1/music/music.go
+++ b/api/v1/music/music.go
@ -0,0 +1,343 @@
+package music
+
+var placeholders = []Album{
+				{
+								Id: "test",
+								Title: "test album",
+								Type: "album",
+								Year: 2024,
+								Buyname: "go get it!!",
+								Buylink: "https://arimelody.me/",
+								Artists: []string{
+												"ari melody",
+												"zaire",
+												"mae taylor",
+												"Loudar",
+								},
+								Links: []AlbumLink{
+												AlbumLink{
+																Name: "youtube",
+																Url: "https://youtu.be/dQw4w9WgXcQ",
+												},
+								},
+								Description: "she sample on my text 'til i 🚫🚫🚫",
+				},
+				{
+								Id: "free2play",
+								Title: "free2play",
+								Type: "upcoming",
+								Year: 2024,
+								Buyname: "pre-order",
+								Buylink: "https://arimelody.me/",
+								Artists: []string{ "ari melody" },
+								Description: "hello from your local SPACEGIRL! 💫",
+				},
+				{
+								Id: "dream",
+								Title: "Dream",
+								Type: "single",
+								Year: 2022,
+								Artists: []string{ "mellodoot" },
+								Artwork: "https://mellodoot.com/img/music_artwork/mellodoot_-_Dream.webp",
+								Buylink: "https://arimelody.bandcamp.com/track/dream",
+								Free: false,
+								Links: []AlbumLink{
+												AlbumLink{
+																Name: "spotify",
+																Url: "https://open.spotify.com/album/5talRpqzjExP1w6j5LFIAh",
+												},
+												AlbumLink{
+																Name: "apple music",
+																Url: "https://music.apple.com/ie/album/dream-single/1650037132",
+												},
+												AlbumLink{
+																Name: "soundcloud",
+																Url: "https://soundcloud.com/arimelody/dream2022",
+												},
+												AlbumLink{
+																Name: "youtube",
+																Url: "https://www.youtube.com/watch?v=nfFgtMuYAx8",
+												},
+								},
+								Description: "living the dream 🌌 ✨",
+				},
+				{
+								Id: "gomyway",
+								Title: "Go My Way",
+								Type: "single",
+								Year: 2021,
+								Artists: []string{ "mellodoot" },
+								Artwork: "https://mellodoot.com/img/music_artwork/mellodoot_-_Go_My_Way.webp",
+								Buylink: "https://arimelody.bandcamp.com/track/go-my-way",
+								Links: []AlbumLink{
+												AlbumLink{
+																Name: "spotify",
+																Url: "https://open.spotify.com/album/35WNtxK12IDHCUoXHDePGE",
+												},
+												AlbumLink{
+																Name: "apple music",
+																Url: "https://music.apple.com/ie/album/go-my-way-single/1547145699",
+												},
+												AlbumLink{
+																Name: "soundcloud",
+																Url: "https://soundcloud.com/arimelody/go-my-way",
+												},
+												AlbumLink{
+																Name: "youtube",
+																Url: "https://www.youtube.com/watch?v=CNptNQdLkl0",
+												},
+								},
+								Description: "hey! go my way! 💥 ✨",
+				},
+				{
+								Id: "rowboat",
+								Title: "Rowboat",
+								Type: "single",
+								Year: 2020,
+								Artists: []string{ "mellodoot" },
+								Artwork: "https://mellodoot.com/img/music_artwork/mellodoot_-_Rowboat.webp",
+								Buylink: "https://arimelody.bandcamp.com/track/rowboat",
+								Links: []AlbumLink{
+												{
+																Name: "spotify",
+																Url: "https://open.spotify.com/album/7jyqJFVKaENCPm58v5O44Y",
+												},
+												{
+																Name: "apple music",
+																Url: "https://music.apple.com/ie/album/rowboat-single/1502608714",
+												},
+												{
+																Name: "soundcloud",
+																Url: "https://soundcloud.com/arimelody/rowboat",
+												},
+												{
+																Name: "youtube",
+																Url: "https://www.youtube.com/watch?v=uOQyILDTzME",
+												},
+								},
+								Description: "let's take a trip. i've got a goddamn boat ⛵️",
+				},
+				{
+								Id: "helloworld",
+								Title: "Hello World",
+								Type: "single",
+								Year: 2019,
+								Artists: []string{ "mellodoot" },
+								Artwork: "https://mellodoot.com/img/music_artwork/mellodoot_-_Hello_World.webp",
+								Buylink: "https://arimelody.bandcamp.com/track/hello-world",
+								Links: []AlbumLink{
+												{
+																Name: "spotify",
+																Url: "https://open.spotify.com/album/3LbElPXD4dsDumttGBuYxx",
+												},
+												{
+																Name: "apple music",
+																Url: "https://music.apple.com/ie/album/hello-world-single/1491880155",
+												},
+												{
+																Name: "soundcloud",
+																Url: "https://soundcloud.com/arimelody/helloworld",
+												},
+												{
+																Name: "youtube",
+																Url: "https://www.youtube.com/watch?v=CQhlRsl0Mjk",
+												},
+								},
+								Description: "we'll dawn a new frontier! 👾",
+				},
+				{
+								Id: "sine",
+								Title: "Sine",
+								Type: "single",
+								Artists: []string{ "zaire", "mellodoot" },
+								Year: 2019,
+								Artwork: "https://mellodoot.com/img/music_artwork/zaire_-_Sine_ft._mellodoot.webp",
+								Links: []AlbumLink{
+												{
+																Name: "spotify",
+																Url: "https://open.spotify.com/album/4WPuaJtTV7z86KubD9Rnmk",
+												},
+												{
+																Name: "apple music",
+																Url: "https://music.apple.com/us/album/sine-feat-mellodoot/1489163020",
+												},
+												{
+																Name: "youtube",
+																Url: "https://www.youtube.com/watch?v=z1H1s6VRnyY",
+												},
+								},
+				},
+				{
+								Id: "10",
+								Title: "10",
+								Type: "single",
+								Year: 2019,
+								Artists: []string{ "mellodoot" },
+								Artwork: "https://mellodoot.com/img/music_artwork/mellodoot_-_10.webp",
+								Buylink: "https://arimelody.bandcamp.com/track/10",
+								Links: []AlbumLink{
+												{
+																Name: "spotify",
+																Url: "https://open.spotify.com/album/2x4gbACfDm99unaXpLXyj0",
+												},
+												{
+																Name: "apple music",
+																Url: "https://music.apple.com/ie/album/ten-single/1483193041",
+												},
+												{
+																Name: "soundcloud",
+																Url: "https://soundcloud.com/arimelody/ten",
+												},
+												{
+																Name: "youtube",
+																Url: "https://www.youtube.com/watch?v=C7WP5L2BK4U",
+												},
+								},
+				},
+				{
+								Id: "mad",
+								Title: "MAD",
+								Type: "single",
+								Year: 2018,
+								Artists: []string{ "mellodoot" },
+								Artwork: "https://mellodoot.com/img/music_artwork/mellodoot_-_MAD.webp",
+								Buylink: "https://arimelody.bandcamp.com/track/mad",
+								Links: []AlbumLink{
+												{
+																Name: "spotify",
+																Url: "https://open.spotify.com/album/59nFXw1WNoRhXou7lXqBZd",
+												},
+												{
+																Name: "apple music",
+																Url: "https://music.apple.com/ie/album/mad/1441233120",
+												},
+												{
+																Name: "soundcloud",
+																Url: "https://soundcloud.com/arimelody/mad",
+												},
+												{
+																Name: "youtube",
+																Url: "https://www.youtube.com/watch?v=OB-Pk6p6mfQ",
+												},
+								},
+				},
+				{
+								Id: "welcomingparty",
+								Title: "Welcoming Party",
+								Type: "album",
+								Year: 2018,
+								Artists: []string{ "mellodoot" },
+								Artwork: "https://mellodoot.com/img/music_artwork/mellodoot_-_Welcoming_Party.webp",
+								Buylink: "https://arimelody.bandcamp.com/album/welcoming-party",
+								Links: []AlbumLink{
+												{
+																Name: "spotify",
+																Url: "https://open.spotify.com/album/3EPa4HZpkISQVRAks64LfR",
+												},
+												{
+																Name: "apple music",
+																Url: "https://music.apple.com/ie/album/welcoming-party-ep/1441161424",
+												},
+												{
+																Name: "soundcloud",
+																Url: "https://soundcloud.com/arimelody/sets/welcoming-party",
+												},
+												{
+																Name: "youtube",
+																Url: "https://www.youtube.com/playlist?list=PLBG_QJeOHrB5EeniiXBIlHpoQbD6CUJca",
+												},
+								},
+								// "tracks": [
+								//         {
+								//                 "title": "Paradigm"
+								//         },
+								//         {
+								//                 "title": "Mitrio"
+								//         },
+								//         {
+								//                 "title": "Level One"
+								//         },
+								//         {
+								//                 "title": "Cubes"
+								//         },
+								//         {
+								//                 "title": "Aria"
+								//         }
+								// ]
+				},
+				{
+								Id: "howtheyknow2018",
+								Title: "How They Know (2018)",
+								Type: "single",
+								Year: 2018,
+								Artists: []string{ "mellodoot" },
+								Artwork: "https://mellodoot.com/img/music_artwork/mellodoot_-_How_They_Know_2018.webp",
+								Buylink: "https://arimelody.bandcamp.com/track/how-they-know-2018-remastered",
+								Free: true,
+								Links: []AlbumLink{
+												{
+																Name: "soundcloud",
+																Url: "https://soundcloud.com/arimelody/how-they-know-2018",
+												},
+												{
+																Name: "youtube",
+																Url: "https://www.youtube.com/watch?v=mbAgSwCzyMw",
+												},
+								},
+				},
+				{
+								Id: "howtheyknow",
+								Title: "How They Know",
+								Type: "single",
+								Year: 2017,
+								Artists: []string{ "mellodoot" },
+								Artwork: "https://mellodoot.com/img/music_artwork/mellodoot_-_How_They_Know.webp",
+								Buylink: "https://arimelody.bandcamp.com/track/how-they-know",
+								Free: true,
+								Links: []AlbumLink{
+												{
+																Name: "soundcloud",
+																Url: "https://soundcloud.com/arimelody/how-they-know",
+												},
+												{
+																Name: "youtube",
+																Url: "https://www.youtube.com/watch?v=q6lzKuG1Emo",
+												},
+								},
+				},
+				{
+								Id: "traveller",
+								Title: "Traveller",
+								Type: "single",
+								Year: 2017,
+								Artists: []string{ "mellodoot" },
+								Artwork: "https://mellodoot.com/img/music_artwork/mellodoot_-_Traveller.webp",
+								Buylink: "https://arimelody.bandcamp.com/track/traveller",
+								Free: true,
+								Links: []AlbumLink{
+												{
+																Name: "soundcloud",
+																Url: "https://soundcloud.com/arimelody/traveller",
+												},
+												{
+																Name: "youtube",
+																Url: "https://www.youtube.com/watch?v=ZTO7IQZ-yXA",
+												},
+								},
+								Description: "an 8-bit expedition! ⚔️🛡️",
+				},
+}
+
+func GetAlbum(id string) (Album, bool) {
+				for _, album := range placeholders {
+								if album.Id == id {
+												return album, true
+								}
+				}
+				return Album{}, false
+}
+
+func QueryAll() ([]Album) {
+				return placeholders
+}
+
--- a/api/v1/music/music_types.go
+++ b/api/v1/music/music_types.go
@ -0,0 +1,55 @@
+package music
+
+import (
+				"regexp"
+				"strings"
+)
+
+type (
+				Album struct {
+								Id string;
+								Title string;
+								Type string;
+								Year int;
+								Artists []string;
+								Artwork string;
+								Buyname string;
+								Buylink string;
+								Free bool;
+								Links []AlbumLink;
+								Description string;
+				}
+
+				AlbumLink struct {
+								Name string;
+								Url string;
+				}
+)
+
+func (album Album) PrintArtists() string {
+				if len(album.Artists) == 1 {
+								return album.Artists[0]
+				}
+				res := strings.Join(album.Artists[:len(album.Artists) - 1], ", ")
+				res += " & " + album.Artists[len(album.Artists) - 1]
+				return res
+}
+
+func (album Album) PrintCommaArtists() string {
+				if len(album.Artists) == 1 {
+								return album.Artists[0]
+				}
+				return strings.Join(album.Artists[:len(album.Artists)], ", ")
+}
+
+func (album Album) ResolveArtwork() string {
+				if album.Artwork != "" {
+								return album.Artwork
+				}
+				return "/img/music-artwork/default.png"
+}
+
+func (link AlbumLink) NormaliseName() string {
+				re := regexp.MustCompile(`[^a-z0-9]`)
+				return strings.ToLower(re.ReplaceAllString(link.Name, ""))
+}
--- a/go.mod
+++ b/go.mod
@ -0,0 +1,5 @@
+module arimelody.me/arimelody.me
+
+go 1.22.1
+
+require github.com/gomarkdown/markdown v0.0.0-20231222211730-1d6d20845b47 // indirect
--- a/go.sum
+++ b/go.sum
@ -0,0 +1,2 @@
+github.com/gomarkdown/markdown v0.0.0-20231222211730-1d6d20845b47 h1:k4Tw0nt6lwro3Uin8eqoET7MDA4JnT8YgbCjc/g5E3k=
+github.com/gomarkdown/markdown v0.0.0-20231222211730-1d6d20845b47/go.mod h1:JDGcbDT52eL4fju3sZ4TeHGsQwhG9nbDV21aMyhwPoA=
--- a/main.go
+++ b/main.go
@ -0,0 +1,122 @@
+package main
+
+import (
+				"arimelody.me/arimelody.me/api/v1/music"
+
+				"fmt"
+				"html/template"
+				"os"
+				"net/http"
+				"log"
+				"strings"
+
+				"github.com/gomarkdown/markdown"
+				"github.com/gomarkdown/markdown/html"
+				"github.com/gomarkdown/markdown/parser"
+)
+
+var mime_types = map[string]string{
+				"css": "text/css; charset=utf-8",
+				"png": "image/png",
+				"jpg": "image/jpg",
+				"webp": "image/webp",
+				"html": "text/html",
+				"asc": "text/plain",
+				"pub": "text/plain",
+				"js": "application/javascript",
+}
+
+var templates = template.Must(template.ParseFiles(
+				"views/header.html",
+				"views/footer.html",
+				"views/index.html",
+				"views/music.html",
+				"views/music-gateway.html",
+))
+
+func web_handler(writer http.ResponseWriter, req *http.Request) {
+				uri := req.URL.Path
+				
+				fmt.Printf("%s %s (%s)\n", req.Method, req.URL.Path, req.Header["User-Agent"][0])
+
+				if req.URL.Path == "/" {
+								index_handler(writer, req)
+								return
+				}
+				if uri == "/music" {
+								music_handler(writer, req)
+								return
+				}
+				if strings.HasPrefix(uri, "/music/") {
+								music_gateway_handler(writer, req)
+								return
+				}
+				static_handler(writer, req)
+}
+
+func index_handler(writer http.ResponseWriter, req *http.Request) {
+				err := templates.ExecuteTemplate(writer, "index.html", nil)
+				if err != nil {
+								http.Error(writer, err.Error(), http.StatusInternalServerError)
+				}
+}
+
+func music_handler(writer http.ResponseWriter, req *http.Request) {
+				err := templates.ExecuteTemplate(writer, "music.html", music.QueryAll())
+				if err != nil {
+								http.Error(writer, err.Error(), http.StatusInternalServerError)
+				}
+}
+
+func music_gateway_handler(writer http.ResponseWriter, req *http.Request) {
+				if len(req.URL.Path) <= len("/music/") {
+								http.Error(writer, "400 bad request", http.StatusBadRequest)
+								return
+				}
+
+				id := req.URL.Path[len("/music/"):]
+				// http.Redirect(writer, req, "https://mellodoot.com/music/"+title, 302)
+				// return
+				album, ok := music.GetAlbum(id)
+				if !ok {
+								http.Error(writer, "404 not found", http.StatusNotFound)
+								return
+				}
+				err := templates.ExecuteTemplate(writer, "music-gateway.html", album)
+				if err != nil {
+								http.Error(writer, err.Error(), http.StatusInternalServerError)
+				}
+}
+
+func static_handler(writer http.ResponseWriter, req *http.Request) {
+				filename := "public/" + req.URL.Path[1:]
+				body, err := os.ReadFile(filename)
+				if err != nil {
+								http.Error(writer, "404 not found", http.StatusNotFound)
+								return
+				}
+				filetype := filename[strings.LastIndex(filename, ".") + 1:]
+				if mime_type, ok := mime_types[filetype]; ok {
+								writer.Header().Set("Content-Type", mime_type)
+				} else {
+								writer.Header().Set("Content-Type", "text/plain; charset=utf-8")
+				}
+				writer.Write([]byte(body))
+}
+
+func parse_markdown(md []byte) []byte {
+				extensions := parser.CommonExtensions | parser.AutoHeadingIDs | parser.NoEmptyLineBeforeBlock
+				p := parser.NewWithExtensions(extensions)
+				doc := p.Parse(md)
+
+				htmlFlags := html.CommonFlags
+				opts := html.RendererOptions{ Flags: htmlFlags }
+				renderer := html.NewRenderer(opts)
+
+				return markdown.Render(doc, renderer)
+}
+
+func main() {
+				http.HandleFunc("/", web_handler)
+				log.Fatal(http.ListenAndServe(":8080", nil))
+}
--- a/public/font/monaspace-argon/AUTHORS.txt
+++ b/public/font/monaspace-argon/AUTHORS.txt
@ -0,0 +1 @@
+GitHub Next <next@github.com>
--- a/public/font/monaspace-argon/CODE_OF_CONDUCT.md
+++ b/public/font/monaspace-argon/CODE_OF_CONDUCT.md
@ -0,0 +1,74 @@
+# Contributor Covenant Code of Conduct
+
+## Our Pledge
+
+In the interest of fostering an open and welcoming environment, we as
+contributors and maintainers pledge to making participation in our project and
+our community a harassment-free experience for everyone, regardless of age, body
+size, disability, ethnicity, gender identity and expression, level of experience,
+nationality, personal appearance, race, religion, or sexual identity and
+orientation.
+
+## Our Standards
+
+Examples of behavior that contributes to creating a positive environment
+include:
+
+* Using welcoming and inclusive language
+* Being respectful of differing viewpoints and experiences
+* Gracefully accepting constructive criticism
+* Focusing on what is best for the community
+* Showing empathy towards other community members
+
+Examples of unacceptable behavior by participants include:
+
+* The use of sexualized language or imagery and unwelcome sexual attention or
+advances
+* Trolling, insulting/derogatory comments, and personal or political attacks
+* Public or private harassment
+* Publishing others' private information, such as a physical or electronic
+  address, without explicit permission
+* Other conduct which could reasonably be considered inappropriate in a
+  professional setting
+
+## Our Responsibilities
+
+Project maintainers are responsible for clarifying the standards of acceptable
+behavior and are expected to take appropriate and fair corrective action in
+response to any instances of unacceptable behavior.
+
+Project maintainers have the right and responsibility to remove, edit, or
+reject comments, commits, code, wiki edits, issues, and other contributions
+that are not aligned to this Code of Conduct, or to ban temporarily or
+permanently any contributor for other behaviors that they deem inappropriate,
+threatening, offensive, or harmful.
+
+## Scope
+
+This Code of Conduct applies both within project spaces and in public spaces
+when an individual is representing the project or its community. Examples of
+representing a project or community include using an official project e-mail
+address, posting via an official social media account, or acting as an appointed
+representative at an online or offline event. Representation of a project may be
+further defined and clarified by project maintainers.
+
+## Enforcement
+
+Instances of abusive, harassing, or otherwise unacceptable behavior may be
+reported by contacting the project team at opensource@github.com. All
+complaints will be reviewed and investigated and will result in a response that
+is deemed necessary and appropriate to the circumstances. The project team is
+obligated to maintain confidentiality with regard to the reporter of an incident.
+Further details of specific enforcement policies may be posted separately.
+
+Project maintainers who do not follow or enforce the Code of Conduct in good
+faith may face temporary or permanent repercussions as determined by other
+members of the project's leadership.
+
+## Attribution
+
+This Code of Conduct is adapted from the [Contributor Covenant][homepage], version 1.4,
+available at [https://contributor-covenant.org/version/1/4][version]
+
+[homepage]: https://contributor-covenant.org
+[version]: https://contributor-covenant.org/version/1/4/
--- a/public/font/monaspace-argon/CONTRIBUTORS.txt
+++ b/public/font/monaspace-argon/CONTRIBUTORS.txt
@ -0,0 +1,6 @@
+Riley Cran <riley@lettermatic.com>
+Heather Cran Arrow <heather@lettermatic.com>
+Danelle Cheney <danelle@lettermatic.com>
+Idan Gazit <idan@github.com>
+Cole Bemis <colebemis@github.com>
+Amelia Wattenberger <wattenberger@github.com>
--- a/public/font/monaspace-argon/LICENSE
+++ b/public/font/monaspace-argon/LICENSE
@ -0,0 +1,93 @@
+Copyright (c) 2023, GitHub https://github.com/githubnext/monaspace
+with Reserved Font Name "Monaspace", including subfamilies: "Argon", "Neon", "Xenon", "Radon", and "Krypton"
+
+This Font Software is licensed under the SIL Open Font License, Version 1.1.
+This license is copied below, and is also available with a FAQ at:
+http://scripts.sil.org/OFL
+
+-----------------------------------------------------------
+SIL OPEN FONT LICENSE Version 1.1 - 26 February 2007
+-----------------------------------------------------------
+
+PREAMBLE
+The goals of the Open Font License (OFL) are to stimulate worldwide
+development of collaborative font projects, to support the font creation
+efforts of academic and linguistic communities, and to provide a free and
+open framework in which fonts may be shared and improved in partnership
+with others.
+
+The OFL allows the licensed fonts to be used, studied, modified and
+redistributed freely as long as they are not sold by themselves. The
+fonts, including any derivative works, can be bundled, embedded, 
+redistributed and/or sold with any software provided that any reserved
+names are not used by derivative works. The fonts and derivatives,
+however, cannot be released under any other type of license. The
+requirement for fonts to remain under this license does not apply
+to any document created using the fonts or their derivatives.
+
+DEFINITIONS
+"Font Software" refers to the set of files released by the Copyright
+Holder(s) under this license and clearly marked as such. This may
+include source files, build scripts and documentation.
+
+"Reserved Font Name" refers to any names specified as such after the
+copyright statement(s).
+
+"Original Version" refers to the collection of Font Software components as
+distributed by the Copyright Holder(s).
+
+"Modified Version" refers to any derivative made by adding to, deleting,
+or substituting — in part or in whole — any of the components of the
+Original Version, by changing formats or by porting the Font Software to a
+new environment.
+
+"Author" refers to any designer, engineer, programmer, technical
+writer or other person who contributed to the Font Software.
+
+PERMISSION & CONDITIONS
+Permission is hereby granted, free of charge, to any person obtaining
+a copy of the Font Software, to use, study, copy, merge, embed, modify,
+redistribute, and sell modified and unmodified copies of the Font
+Software, subject to the following conditions:
+
+1) Neither the Font Software nor any of its individual components,
+in Original or Modified Versions, may be sold by itself.
+
+2) Original or Modified Versions of the Font Software may be bundled,
+redistributed and/or sold with any software, provided that each copy
+contains the above copyright notice and this license. These can be
+included either as stand-alone text files, human-readable headers or
+in the appropriate machine-readable metadata fields within text or
+binary files as long as those fields can be easily viewed by the user.
+
+3) No Modified Version of the Font Software may use the Reserved Font
+Name(s) unless explicit written permission is granted by the corresponding
+Copyright Holder. This restriction only applies to the primary font name as
+presented to the users.
+
+4) The name(s) of the Copyright Holder(s) or the Author(s) of the Font
+Software shall not be used to promote, endorse or advertise any
+Modified Version, except to acknowledge the contribution(s) of the
+Copyright Holder(s) and the Author(s) or with their explicit written
+permission.
+
+5) The Font Software, modified or unmodified, in part or in whole,
+must be distributed entirely under this license, and must not be
+distributed under any other license. The requirement for fonts to
+remain under this license does not apply to any document created
+using the Font Software.
+
+TERMINATION
+This license becomes null and void if any of the above conditions are
+not met.
+
+DISCLAIMER
+THE FONT SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
+EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO ANY WARRANTIES OF
+MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT
+OF COPYRIGHT, PATENT, TRADEMARK, OR OTHER RIGHT. IN NO EVENT SHALL THE
+COPYRIGHT HOLDER BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY,
+INCLUDING ANY GENERAL, SPECIAL, INDIRECT, INCIDENTAL, OR CONSEQUENTIAL
+DAMAGES, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
+FROM, OUT OF THE USE OR INABILITY TO USE THE FONT SOFTWARE OR FROM
+OTHER DEALINGS IN THE FONT SOFTWARE.
--- a/public/font/monaspace-argon/MonaspaceArgon-Bold.woff
+++ b/public/font/monaspace-argon/MonaspaceArgon-Bold.woff
--- a/public/font/monaspace-argon/MonaspaceArgon-BoldItalic.woff
+++ b/public/font/monaspace-argon/MonaspaceArgon-BoldItalic.woff
--- a/public/font/monaspace-argon/MonaspaceArgon-ExtraBold.woff
+++ b/public/font/monaspace-argon/MonaspaceArgon-ExtraBold.woff
--- a/public/font/monaspace-argon/MonaspaceArgon-ExtraBoldItalic.woff
+++ b/public/font/monaspace-argon/MonaspaceArgon-ExtraBoldItalic.woff
--- a/public/font/monaspace-argon/MonaspaceArgon-ExtraLight.woff
+++ b/public/font/monaspace-argon/MonaspaceArgon-ExtraLight.woff
--- a/public/font/monaspace-argon/MonaspaceArgon-ExtraLightItalic.woff
+++ b/public/font/monaspace-argon/MonaspaceArgon-ExtraLightItalic.woff
--- a/public/font/monaspace-argon/MonaspaceArgon-Italic.woff
+++ b/public/font/monaspace-argon/MonaspaceArgon-Italic.woff
--- a/public/font/monaspace-argon/MonaspaceArgon-Light.woff
+++ b/public/font/monaspace-argon/MonaspaceArgon-Light.woff
--- a/public/font/monaspace-argon/MonaspaceArgon-LightItalic.woff
+++ b/public/font/monaspace-argon/MonaspaceArgon-LightItalic.woff
--- a/public/font/monaspace-argon/MonaspaceArgon-Medium.woff
+++ b/public/font/monaspace-argon/MonaspaceArgon-Medium.woff
--- a/public/font/monaspace-argon/MonaspaceArgon-MediumItalic.woff
+++ b/public/font/monaspace-argon/MonaspaceArgon-MediumItalic.woff
--- a/public/font/monaspace-argon/MonaspaceArgon-Regular.woff
+++ b/public/font/monaspace-argon/MonaspaceArgon-Regular.woff
--- a/public/font/monaspace-argon/MonaspaceArgon-SemiBold.woff
+++ b/public/font/monaspace-argon/MonaspaceArgon-SemiBold.woff
--- a/public/font/monaspace-argon/MonaspaceArgon-SemiBoldItalic.woff
+++ b/public/font/monaspace-argon/MonaspaceArgon-SemiBoldItalic.woff
--- a/public/font/monaspace-argon/MonaspaceArgon-SemiWideBold.woff
+++ b/public/font/monaspace-argon/MonaspaceArgon-SemiWideBold.woff
--- a/public/font/monaspace-argon/MonaspaceArgon-SemiWideBoldItalic.woff
+++ b/public/font/monaspace-argon/MonaspaceArgon-SemiWideBoldItalic.woff
--- a/public/font/monaspace-argon/MonaspaceArgon-SemiWideExtraBold.woff
+++ b/public/font/monaspace-argon/MonaspaceArgon-SemiWideExtraBold.woff
--- a/public/font/monaspace-argon/MonaspaceArgon-SemiWideExtraBoldItalic.woff
+++ b/public/font/monaspace-argon/MonaspaceArgon-SemiWideExtraBoldItalic.woff
--- a/public/font/monaspace-argon/MonaspaceArgon-SemiWideExtraLight.woff
+++ b/public/font/monaspace-argon/MonaspaceArgon-SemiWideExtraLight.woff
--- a/public/font/monaspace-argon/MonaspaceArgon-SemiWideExtraLightItalic.woff
+++ b/public/font/monaspace-argon/MonaspaceArgon-SemiWideExtraLightItalic.woff
--- a/public/font/monaspace-argon/MonaspaceArgon-SemiWideItalic.woff
+++ b/public/font/monaspace-argon/MonaspaceArgon-SemiWideItalic.woff
--- a/public/font/monaspace-argon/MonaspaceArgon-SemiWideLight.woff
+++ b/public/font/monaspace-argon/MonaspaceArgon-SemiWideLight.woff
--- a/public/font/monaspace-argon/MonaspaceArgon-SemiWideLightItalic.woff
+++ b/public/font/monaspace-argon/MonaspaceArgon-SemiWideLightItalic.woff
--- a/public/font/monaspace-argon/MonaspaceArgon-SemiWideMedium.woff
+++ b/public/font/monaspace-argon/MonaspaceArgon-SemiWideMedium.woff
--- a/public/font/monaspace-argon/MonaspaceArgon-SemiWideMediumItalic.woff
+++ b/public/font/monaspace-argon/MonaspaceArgon-SemiWideMediumItalic.woff
--- a/public/font/monaspace-argon/MonaspaceArgon-SemiWideRegular.woff
+++ b/public/font/monaspace-argon/MonaspaceArgon-SemiWideRegular.woff
--- a/public/font/monaspace-argon/MonaspaceArgon-SemiWideSemiBold.woff
+++ b/public/font/monaspace-argon/MonaspaceArgon-SemiWideSemiBold.woff
--- a/public/font/monaspace-argon/MonaspaceArgon-SemiWideSemiBoldItalic.woff
+++ b/public/font/monaspace-argon/MonaspaceArgon-SemiWideSemiBoldItalic.woff
--- a/public/font/monaspace-argon/MonaspaceArgon-WideBold.woff
+++ b/public/font/monaspace-argon/MonaspaceArgon-WideBold.woff
--- a/public/font/monaspace-argon/MonaspaceArgon-WideBoldItalic.woff
+++ b/public/font/monaspace-argon/MonaspaceArgon-WideBoldItalic.woff
--- a/public/font/monaspace-argon/MonaspaceArgon-WideExtraBold.woff
+++ b/public/font/monaspace-argon/MonaspaceArgon-WideExtraBold.woff
--- a/public/font/monaspace-argon/MonaspaceArgon-WideExtraBoldItalic.woff
+++ b/public/font/monaspace-argon/MonaspaceArgon-WideExtraBoldItalic.woff
--- a/public/font/monaspace-argon/MonaspaceArgon-WideExtraLight.woff
+++ b/public/font/monaspace-argon/MonaspaceArgon-WideExtraLight.woff
--- a/public/font/monaspace-argon/MonaspaceArgon-WideExtraLightItalic.woff
+++ b/public/font/monaspace-argon/MonaspaceArgon-WideExtraLightItalic.woff
--- a/public/font/monaspace-argon/MonaspaceArgon-WideItalic.woff
+++ b/public/font/monaspace-argon/MonaspaceArgon-WideItalic.woff
--- a/public/font/monaspace-argon/MonaspaceArgon-WideLight.woff
+++ b/public/font/monaspace-argon/MonaspaceArgon-WideLight.woff
--- a/public/font/monaspace-argon/MonaspaceArgon-WideLightItalic.woff
+++ b/public/font/monaspace-argon/MonaspaceArgon-WideLightItalic.woff
--- a/public/font/monaspace-argon/MonaspaceArgon-WideMedium.woff
+++ b/public/font/monaspace-argon/MonaspaceArgon-WideMedium.woff
--- a/public/font/monaspace-argon/MonaspaceArgon-WideMediumItalic.woff
+++ b/public/font/monaspace-argon/MonaspaceArgon-WideMediumItalic.woff
--- a/public/font/monaspace-argon/MonaspaceArgon-WideRegular.woff
+++ b/public/font/monaspace-argon/MonaspaceArgon-WideRegular.woff
--- a/public/font/monaspace-argon/MonaspaceArgon-WideSemiBold.woff
+++ b/public/font/monaspace-argon/MonaspaceArgon-WideSemiBold.woff
--- a/public/font/monaspace-argon/MonaspaceArgon-WideSemiBoldItalic.woff
+++ b/public/font/monaspace-argon/MonaspaceArgon-WideSemiBoldItalic.woff
--- a/public/font/monaspace-argon/MonaspaceArgonVarVF[wght,wdth,slnt].woff
+++ b/public/font/monaspace-argon/MonaspaceArgonVarVF[wght,wdth,slnt].woff
--- a/public/font/monaspace-argon/MonaspaceArgonVarVF[wght,wdth,slnt].woff2
+++ b/public/font/monaspace-argon/MonaspaceArgonVarVF[wght,wdth,slnt].woff2
--- a/public/img/buttons/ari
+++ b/public/img/buttons/ari
--- a/public/img/buttons/mae.png
+++ b/public/img/buttons/mae.png
--- a/public/img/buttons/misc/debian.gif
+++ b/public/img/buttons/misc/debian.gif
--- a/public/img/buttons/misc/epicblazed.png
+++ b/public/img/buttons/misc/epicblazed.png
--- a/public/img/buttons/misc/gaywebring.gif
+++ b/public/img/buttons/misc/gaywebring.gif
--- a/public/img/buttons/misc/girls4notepad.gif
+++ b/public/img/buttons/misc/girls4notepad.gif
--- a/public/img/buttons/misc/gplv3.gif
+++ b/public/img/buttons/misc/gplv3.gif
--- a/public/img/buttons/misc/graphicdesign.gif
+++ b/public/img/buttons/misc/graphicdesign.gif
--- a/public/img/buttons/misc/h-free-anim.gif
+++ b/public/img/buttons/misc/h-free-anim.gif
--- a/public/img/buttons/misc/hl.gif
+++ b/public/img/buttons/misc/hl.gif
--- a/public/img/buttons/misc/iemandatory.gif
+++ b/public/img/buttons/misc/iemandatory.gif
--- a/public/img/buttons/misc/ipv6.gif
+++ b/public/img/buttons/misc/ipv6.gif
--- a/public/img/buttons/misc/learn_html.gif
+++ b/public/img/buttons/misc/learn_html.gif
--- a/public/img/buttons/misc/ltg.gif
+++ b/public/img/buttons/misc/ltg.gif
--- a/public/img/buttons/misc/mymusic.gif
+++ b/public/img/buttons/misc/mymusic.gif
--- a/public/img/buttons/misc/smokepowered.gif
+++ b/public/img/buttons/misc/smokepowered.gif
--- a/public/img/buttons/misc/sprunk.gif
+++ b/public/img/buttons/misc/sprunk.gif
--- a/public/img/buttons/misc/tohell.gif
+++ b/public/img/buttons/misc/tohell.gif
--- a/public/img/buttons/misc/virusalert.gif
+++ b/public/img/buttons/misc/virusalert.gif
--- a/public/img/buttons/misc/wii.gif
+++ b/public/img/buttons/misc/wii.gif
--- a/public/img/buttons/misc/www2.gif
+++ b/public/img/buttons/misc/www2.gif
--- a/public/img/buttons/zaire.gif
+++ b/public/img/buttons/zaire.gif
--- a/public/img/favicon.png
+++ b/public/img/favicon.png
--- a/public/img/mailicon.svg
+++ b/public/img/mailicon.svg
--- a/public/img/music-artwork/default.png
+++ b/public/img/music-artwork/default.png
--- a/melody_0x92678188_public.asc
+++ b/melody_0x92678188_public.asc
@ -0,0 +1,13 @@
+-----BEGIN PGP PUBLIC KEY BLOCK-----
+
+mDMEZNW03RYJKwYBBAHaRw8BAQdAuMUNVjXT7m/YisePPnSYY6lc1Xmm3oS79ZEO
+JriRCZy0HWFyaSBtZWxvZHkgPGFyaUBhcmltZWxvZHkubWU+iJMEExYKADsWIQTu
+jeuNYocuegkeKt/PmYKckmeBiAUCZNW03QIbAwULCQgHAgIiAgYVCgkICwIEFgID
+AQIeBwIXgAAKCRDPmYKckmeBiGCbAP4wTcLCU5ZlfSTJrFtGhQKWA6DxtUO7Cegk
+Vu8SgkY3KgEA1/YqjZ1vSaqPDN4137vmhkhfduoYOjN0iptNj39u2wG4OARk1bTd
+EgorBgEEAZdVAQUBAQdAnA2drPzQBoXNdwIrFnovuF0CjX+8+8QSugCF4a5ZEXED
+AQgHiHgEGBYKACAWIQTujeuNYocuegkeKt/PmYKckmeBiAUCZNW03QIbDAAKCRDP
+mYKckmeBiC/xAQD1hu4WcstR40lkUxMqhZ44wmizrDA+eGCdh7Ge3Gy79wEAx385
+GnYoNplMTA4BTGs7orV4WSfSkoBx0+px1UOewgs=
+=M1Bp
+-----END PGP PUBLIC KEY BLOCK-----
--- a/public/keys/id_ari_ed25519.pub
+++ b/public/keys/id_ari_ed25519.pub
@ -0,0 +1 @@
+ssh-ed25519 AAAAC3NzaC1lZDI1NTE5AAAAIBHkNL8tYKlEDX0eAQB9rD1GZ3jYzRXZfKmCEFuYJ9jP ari@aria
--- a/public/music.json
+++ b/public/music.json
@ -0,0 +1,313 @@
+[
+        {
+                "id": "dream",
+                "title": "Dream",
+                "type": "single",
+                "year": 2022,
+                "artists": [
+                        "mellodoot"
+                ],
+                "artwork": "https://mellodoot.com/img/music_artwork/mellodoot_-_Dream.webp",
+                "buylink": "https://arimelody.bandcamp.com/track/dream",
+                "links": [
+                        {
+                                "title": "Spotify",
+                                "url": "https://open.spotify.com/album/5talRpqzjExP1w6j5LFIAh"
+                        },
+                        {
+                                "title": "Apple Music",
+                                "url": "https://music.apple.com/ie/album/dream-single/1650037132"
+                        },
+                        {
+                                "title": "Soundcloud",
+                                "url": "https://soundcloud.com/arimelody/dream2022"
+                        },
+                        {
+                                "title": "YouTube",
+                                "url": "https://www.youtube.com/watch?v=nfFgtMuYAx8"
+                        }
+                ]
+        },
+        {
+                "id": "gomyway",
+                "title": "Go My Way",
+                "type": "single",
+                "year": 2021,
+                "artists": [
+                        "mellodoot"
+                ],
+                "artwork": "https://mellodoot.com/img/music_artwork/mellodoot_-_Go_My_Way.webp",
+                "buylink": "https://arimelody.bandcamp.com/track/go-my-way",
+                "links": [
+                        {
+                                "title": "Spotify",
+                                "url": "https://open.spotify.com/album/35WNtxK12IDHCUoXHDePGE"
+                        },
+                        {
+                                "title": "Apple Music",
+                                "url": "https://music.apple.com/ie/album/go-my-way-single/1547145699"
+                        },
+                        {
+                                "title": "Soundcloud",
+                                "url": "https://soundcloud.com/arimelody/go-my-way"
+                        },
+                        {
+                                "title": "YouTube",
+                                "url": "https://www.youtube.com/watch?v=CNptNQdLkl0"
+                        }
+                ]
+        },
+        {
+                "id": "rowboat",
+                "title": "Rowboat",
+                "type": "single",
+                "year": 2020,
+                "artists": [
+                        "mellodoot"
+                ],
+                "artwork": "https://mellodoot.com/img/music_artwork/mellodoot_-_Rowboat.webp",
+                "buylink": "https://arimelody.bandcamp.com/track/rowboat",
+                "links": [
+                        {
+                                "title": "Spotify",
+                                "url": "https://open.spotify.com/album/7jyqJFVKaENCPm58v5O44Y"
+                        },
+                        {
+                                "title": "Apple Music",
+                                "url": "https://music.apple.com/ie/album/rowboat-single/1502608714"
+                        },
+                        {
+                                "title": "Soundcloud",
+                                "url": "https://soundcloud.com/arimelody/rowboat"
+                        },
+                        {
+                                "title": "YouTube",
+                                "url": "https://www.youtube.com/watch?v=uOQyILDTzME"
+                        }
+                ]
+        },
+        {
+                "id": "helloworld",
+                "title": "Hello World",
+                "type": "single",
+                "year": 2019,
+                "artists": [
+                        "mellodoot"
+                ],
+                "artwork": "https://mellodoot.com/img/music_artwork/mellodoot_-_Hello_World.webp",
+                "buylink": "https://arimelody.bandcamp.com/track/hello-world",
+                "links": [
+                        {
+                                "title": "Spotify",
+                                "url": "https://open.spotify.com/album/3LbElPXD4dsDumttGBuYxx"
+                        },
+                        {
+                                "title": "Apple Music",
+                                "url": "https://music.apple.com/ie/album/hello-world-single/1491880155"
+                        },
+                        {
+                                "title": "Soundcloud",
+                                "url": "https://soundcloud.com/arimelody/helloworld"
+                        },
+                        {
+                                "title": "YouTube",
+                                "url": "https://www.youtube.com/watch?v=CQhlRsl0Mjk"
+                        }
+                ]
+        },
+        {
+                "id": "sine",
+                "title": "Sine",
+                "type": "single",
+                "artists": [
+                        "zaire",
+                        "mellodoot"
+                ],
+                "year": 2019,
+                "artwork": "https://mellodoot.com/img/music_artwork/zaire_-_Sine_ft._mellodoot.webp",
+                "links": [
+                        {
+                                "title": "Spotify",
+                                "url": "https://open.spotify.com/album/4WPuaJtTV7z86KubD9Rnmk"
+                        },
+                        {
+                                "title": "Apple Music",
+                                "url": "https://music.apple.com/us/album/sine-feat-mellodoot/1489163020"
+                        },
+                        {
+                                "title": "YouTube",
+                                "url": "https://www.youtube.com/watch?v=z1H1s6VRnyY"
+                        }
+                ]
+        },
+        {
+                "id": "10",
+                "title": "10",
+                "type": "single",
+                "year": 2019,
+                "artists": [
+                        "mellodoot"
+                ],
+                "artwork": "https://mellodoot.com/img/music_artwork/mellodoot_-_10.webp",
+                "buylink": "https://arimelody.bandcamp.com/track/10",
+                "links": [
+                        {
+                                "title": "Spotify",
+                                "url": "https://open.spotify.com/album/2x4gbACfDm99unaXpLXyj0"
+                        },
+                        {
+                                "title": "Apple Music",
+                                "url": "https://music.apple.com/ie/album/ten-single/1483193041"
+                        },
+                        {
+                                "title": "Soundcloud",
+                                "url": "https://soundcloud.com/arimelody/ten"
+                        },
+                        {
+                                "title": "YouTube",
+                                "url": "https://www.youtube.com/watch?v=C7WP5L2BK4U"
+                        }
+                ]
+        },
+        {
+                "id": "mad",
+                "title": "MAD",
+                "type": "single",
+                "year": 2018,
+                "artists": [
+                        "mellodoot"
+                ],
+                "artwork": "https://mellodoot.com/img/music_artwork/mellodoot_-_MAD.webp",
+                "buylink": "https://arimelody.bandcamp.com/track/mad",
+                "links": [
+                        {
+                                "title": "Spotify",
+                                "url": "https://open.spotify.com/album/59nFXw1WNoRhXou7lXqBZd"
+                        },
+                        {
+                                "title": "Apple Music",
+                                "url": "https://music.apple.com/ie/album/mad/1441233120"
+                        },
+                        {
+                                "title": "Soundcloud",
+                                "url": "https://soundcloud.com/arimelody/mad"
+                        },
+                        {
+                                "title": "YouTube",
+                                "url": "https://www.youtube.com/watch?v=OB-Pk6p6mfQ"
+                        }
+                ]
+        },
+        {
+                "id": "welcomingparty",
+                "title": "Welcoming Party",
+                "type": "album",
+                "year": 2018,
+                "artists": [
+                        "mellodoot"
+                ],
+                "artwork": "https://mellodoot.com/img/music_artwork/mellodoot_-_Welcoming_Party.webp",
+                "buylink": "https://arimelody.bandcamp.com/album/welcoming-party",
+                "links": [
+                        {
+                                "title": "Spotify",
+                                "url": "https://open.spotify.com/album/3EPa4HZpkISQVRAks64LfR"
+                        },
+                        {
+                                "title": "Apple Music",
+                                "url": "https://music.apple.com/ie/album/welcoming-party-ep/1441161424"
+                        },
+                        {
+                                "title": "Soundcloud",
+                                "url": "https://soundcloud.com/arimelody/sets/welcoming-party"
+                        },
+                        {
+                                "title": "YouTube",
+                                "url": "https://www.youtube.com/playlist?list=PLBG_QJeOHrB5EeniiXBIlHpoQbD6CUJca"
+                        }
+                ],
+                "tracks": [
+                        {
+                                "title": "Paradigm"
+                        },
+                        {
+                                "title": "Mitrio"
+                        },
+                        {
+                                "title": "Level One"
+                        },
+                        {
+                                "title": "Cubes"
+                        },
+                        {
+                                "title": "Aria"
+                        }
+                ]
+        },
+        {
+                "id": "howtheyknow2018",
+                "title": "How They Know (2018)",
+                "type": "single",
+                "year": 2018,
+                "artists": [
+                        "mellodoot"
+                ],
+                "artwork": "https://mellodoot.com/img/music_artwork/mellodoot_-_How_They_Know_2018.webp",
+                "buylink": "https://arimelody.bandcamp.com/track/how-they-know-2018-remastered",
+                "free": true,
+                "links": [
+                        {
+                                "title": "Soundcloud",
+                                "url": "https://soundcloud.com/arimelody/how-they-know-2018"
+                        },
+                        {
+                                "title": "YouTube",
+                                "url": "https://www.youtube.com/watch?v=mbAgSwCzyMw"
+                        }
+                ]
+        },
+        {
+                "id": "howtheyknow",
+                "title": "How They Know",
+                "type": "single",
+                "year": 2017,
+                "artists": [
+                        "mellodoot"
+                ],
+                "artwork": "https://mellodoot.com/img/music_artwork/mellodoot_-_How_They_Know.webp",
+                "buylink": "https://arimelody.bandcamp.com/track/how-they-know",
+                "free": true,
+                "links": [
+                        {
+                                "title": "Soundcloud",
+                                "url": "https://soundcloud.com/arimelody/how-they-know"
+                        },
+                        {
+                                "title": "YouTube",
+                                "url": "https://www.youtube.com/watch?v=q6lzKuG1Emo"
+                        }
+                ]
+        },
+        {
+                "id": "traveller",
+                "title": "Traveller",
+                "type": "single",
+                "year": 2017,
+                "artists": [
+                        "mellodoot"
+                ],
+                "artwork": "https://mellodoot.com/img/music_artwork/mellodoot_-_Traveller.webp",
+                "buylink": "https://arimelody.bandcamp.com/track/traveller",
+                "free": true,
+                "links": [
+                        {
+                                "title": "Soundcloud",
+                                "url": "https://soundcloud.com/arimelody/traveller"
+                        },
+                        {
+                                "title": "YouTube",
+                                "url": "https://www.youtube.com/watch?v=ZTO7IQZ-yXA"
+                        }
+                ]
+        }
+]
--- a/public/robots.txt
+++ b/public/robots.txt
@ -0,0 +1,14 @@
+User-agent: *
+Disallow: /nobot/
+Disallow: /private/
+
+User-agent: GPTBot
+Disallow: /
+User-agent: ChatGPT-User
+Disallow: /
+
+User-agent: Google-Extended
+Disallow: /
+
+User-agent: CCBot
+Disallow: /
--- a/public/script/accessibility.js
+++ b/public/script/accessibility.js
@ -0,0 +1,44 @@
+const accessibility = JSON.parse(localStorage.getItem("accessibility")) || {};
+
+function toggle_accessibility_setting(name) {
+	if (accessibility[name]) {
+		delete accessibility[name];
+		update_accessibility();
+		return true;
+	}
+	accessibility[name] = true;
+	update_accessibility();
+	return true;
+}
+
+function set_accessibility_setting(name, value) {
+	accessibility[name] = value;
+	update_accessibility();
+	return true;
+}
+
+function clear_accessibility_setting(name) {
+	if (!accessibility[name]) return false;
+	delete accessibility[name];
+	update_accessibility();
+	return true;
+}
+
+function update_accessibility() {
+	localStorage.setItem("accessibility", JSON.stringify(accessibility));
+}
+
+if (accessibility) {
+	if (accessibility.disable_crt) {
+		document.querySelector('div#overlay').setAttribute("hidden", true);
+		document.body.style.textShadow = "none";
+		document.getElementById('toggle-crt').classList.add("disabled");
+	}
+}
+
+document.getElementById("toggle-crt").addEventListener("click", () => {
+	toggle_accessibility_setting("disable_crt");
+	document.querySelector('div#overlay').toggleAttribute("hidden");
+	document.getElementById('toggle-crt').className = accessibility.disable_crt ? "disabled" : "";
+});
+
--- a/public/script/main.js
+++ b/public/script/main.js
@ -0,0 +1,66 @@
+const header_links = document.getElementById("header-links");
+const hamburger = document.getElementById("header-links-toggle");
+
+function type_out(e) {
+        const text = e.innerText;
+        const original = e.innerHTML;
+        e.innerText = "";
+        const delay = 25;
+        let chars = 0;
+
+        function insert_char(character, parent) {
+                const c = document.createElement("span");
+                c.innerText = character;
+                parent.appendChild(c);
+                c.classList.add("newchar");
+        }
+
+        function normalize() {
+                e.innerHTML = original;
+        }
+
+        function increment_char() {
+                const newchar = text.substring(chars - 1, chars);
+                insert_char(newchar, e);
+                chars++;
+                if (chars <= text.length) {
+                        setTimeout(increment_char, delay);
+                } else {
+                        setTimeout(normalize, 250);
+                }
+        }
+
+        increment_char();
+}
+
+function fill_list(list) {
+	const items = list.querySelectorAll("li a, li span");
+	items.innerText = "";
+	const delay = 100;
+
+	items.forEach((item, iter) => {
+		item.style.animationDelay = `${iter * delay}ms`;
+		item.style.animationPlayState = "playing";
+	});
+}
+
+[...document.querySelectorAll("h1, h2, h3, h4, h5, h6")]
+	.filter((e) => e.innerText != "")
+	.forEach((e) => {
+		type_out(e);
+	});
+[...document.querySelectorAll("ol, ul")]
+	.filter((e) => e.innerText != "")
+	.forEach((e) => {
+		fill_list(e);
+	});
+
+function toggle_header_links() {
+        header_links.classList.toggle("open");
+}
+
+document.addEventListener("click", event => {
+        if (!header_links.contains(event.target) && !hamburger.contains(event.target)) {
+                header_links.classList.remove("open");
+        }
+});
--- a/public/script/music-gateway.js
+++ b/public/script/music-gateway.js
@ -0,0 +1,67 @@
+const bg = document.getElementById("background");
+bg.style.backgroundImage = `url(${bg.dataset.url})`;
+bg.removeAttribute("data-url");
+
+const share_btn = document.getElementById("share");
+share_btn.onclick = (e) => {
+        navigator.clipboard.writeText(window.location.href);
+        share_btn.classList.remove('active');
+        void share_btn.offsetWidth;
+        share_btn.classList.add('active');
+}
+
+document.getElementById("go-back").addEventListener("click", () => {
+        window.history.back();
+});
+
+apply_funny_bob_to_upcoming_tags();
+
+function apply_funny_bob_to_upcoming_tags() {
+        upcomingTags = document.querySelectorAll("#type.upcoming");
+        for (var i = 0; i < upcomingTags.length; i++) {
+                const tag = upcomingTags[i];
+                chars = tag.innerText.split("");
+                result = chars.map((c, i) => `<span style="animation-delay: -${i * 100}ms;">${c}</span>`);
+                tag.innerHTML = result.join("");
+        }
+}
+
+const previews = document.querySelectorAll("[id^=preview-]");
+for (const preview of previews) {
+        preview.addEventListener("click", (e) => {
+                if (e.target.classList.contains('playing')) {
+                        stopPreview(e.target);
+                } else {
+                        playPreview(e.target);
+                }
+        });
+        preview.querySelector('audio').addEventListener("ended", () => { stopPreview(preview); });
+}
+
+var stupidsounds = false;
+
+function stopPreviews() {
+        for (const preview of previews) stopPreview(preview);
+}
+
+function playPreview(preview) {
+        if (!stupidsounds) stopPreviews();
+        const btn = preview.querySelector('i');
+        btn.classList.remove("play", "fa-play");
+        btn.classList.add("pause", "fa-pause");
+        const audio = preview.querySelector('audio');
+        audio.play();
+        preview.classList.add('playing');
+}
+
+function stopPreview(preview) {
+        const btn = preview.querySelector('i');
+        btn.classList.remove("pause", "fa-pause");
+        btn.classList.add("play", "fa-play");
+        const audio = preview.querySelector('audio');
+        audio.pause();
+        audio.currentTime = 0;
+        preview.classList.remove('playing');
+}
+
+stopPreviews();
--- a/public/script/music.js
+++ b/public/script/music.js
@ -0,0 +1,15 @@
+document.querySelectorAll("h2.question").forEach(element => {
+        element.onclick = (e) => {
+                const url = `${window.location.protocol}//${window.location.host}${window.location.pathname}#${e.target.id}`;
+                window.location = url;
+        };
+});
+
+document.querySelectorAll("div.music").forEach(element => {
+        console.log(element);
+        element.addEventListener("click", (e) => {
+                const url = `${window.location.protocol}//${window.location.host}/music/${element.id}`;
+                window.location = url;
+        });
+});
+
--- a/public/script/prideflag.js
+++ b/public/script/prideflag.js
@ -0,0 +1,66 @@
+/**
+ * 🏳️‍🌈🏳️‍⚧️💖 pride flag 💖🏳️‍⚧️🏳️‍🌈
+ * made with ❤️ by ari melody, 2023
+ * 
+ * web: https://arimelody.me
+ * source: https://github.com/mellodoot/prideflag
+ */
+
+const pride_flag_svg =
+        `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 120 120" width="120" height="120">
+                <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>`;
+
+const pride_flag_css =
+        `#pride-flag svg {
+                position: fixed;
+                top: 0;
+                right: 0;
+                width: 120px;
+                transform-origin: 100% 0%;
+                transition: transform .5s cubic-bezier(.32,1.63,.41,1.01);
+                z-index: 8008135;
+                pointer-events: none;
+        }
+        #pride-flag svg:hover {
+                transform: scale(110%);
+        }
+        #pride-flag svg:active {
+                transform: scale(110%);
+        }
+        #pride-flag svg * {
+                pointer-events: all;
+        }`;
+
+function create_pride_flag() {
+        const container = document.createElement("a");
+        container.id = "pride-flag";
+        container.href = "https://github.com/mellodoot/prideflag";
+        container.target = "_blank";
+        container.innerHTML = pride_flag_svg;
+        return container;
+}
+
+function load_pride_flag_style() {
+        const pride_stylesheet = document.createElement('style');
+        pride_stylesheet.textContent = pride_flag_css;
+        document.head.appendChild(pride_stylesheet);
+}
+
+load_pride_flag_style();
+pride_flag = create_pride_flag();
+document.body.appendChild(pride_flag);
--- a/public/style/main.css
+++ b/public/style/main.css
@ -0,0 +1,448 @@
+@font-face {
+        font-family: "Monaspace Argon";
+        src: url("/font/monaspace-argon/MonaspaceArgonVarVF[wght,wdth,slnt].woff2") format("woff2-variations");
+        font-weight: 125 950;
+        font-stretch: 75% 125%;
+        font-style: oblique 0deg 20deg;
+}
+
+:root {
+        --primary: #b7fd49;
+        --secondary: #f8e05b;
+        --tertiary: #f788fe;
+        --links: #5eb2ff;
+}
+
+.col-primary {
+        color: var(--primary);
+}
+
+.col-secondary {
+        color: var(--secondary);
+}
+
+.col-tertiary {
+        color: var(--tertiary);
+}
+
+body {
+        margin: 0;
+        padding: 0;
+        background: #080808;
+        color: #eee;
+        font-family: "Monaspace Argon", monospace;
+        font-size: 18px;
+        text-shadow: 0 0 3em;
+        scroll-behavior: smooth;
+}
+
+header {
+        position: fixed;
+        top: 0;
+        left: 0;
+        width: 100vw;
+        border-bottom: 1px solid #888;
+        background-color: #080808;
+        z-index: 1;
+}
+
+nav {
+        width: min(calc(100% - 4rem), 720px);
+        height: 3em;
+        margin: auto;
+        padding: 0 1em;
+        display: flex;
+        flex-direction: row;
+        gap: .8em;
+        align-items: center;
+}
+
+img#header-icon {
+        width: 2em;
+        height: 2em;
+        margin: .5em;
+        display: block;
+}
+
+#header-text {
+        width: 11em;
+        margin-left: -0.5rem;
+        display: flex;
+        flex-direction: column;
+        justify-content: center;
+        flex-grow: 1;
+}
+
+#header-text h1 {
+        margin: 0;
+        font-size: 1em;
+}
+
+#header-text h2 {
+        height: 1.2em;
+        line-height: 1.2em;
+        margin: 0;
+        font-size: .7em;
+        color: #bbb;
+}
+
+#header-links-toggle {
+        width: 3em;
+        height: 3em;
+        display: none;
+        justify-content: center;
+        align-items: center;
+        transition: background-color .2s;
+}
+
+#header-links-toggle:hover {
+        background-color: #fff2;
+}
+
+header ul#header-links {
+        margin: 0;
+        padding: 0;
+        display: flex;
+        flex-direction: row;
+        gap: .5em;
+        align-items: center;
+}
+
+header ul li {
+        list-style: none;
+}
+
+header ul li a,
+header ul li span {
+        padding: .2em .5em;
+        border: 1px solid var(--links);
+        color: var(--links);
+        border-radius: 2px;
+        background-color: transparent;
+        transition-property: color, border-color, background-color;
+        transition-duration: .2s;
+        animation-delay: 0s;
+        animation: list-item-fadein .2s forwards;
+        opacity: 0;
+}
+
+header ul li span {
+        color: #aaa;
+        border-color: #aaa;
+        cursor: default;
+        text-decoration: none;
+}
+
+header ul li a:hover {
+        color: #eee;
+        border-color: #eee;
+        background-color: var(--links) !important;
+        text-decoration: none;
+}
+
+
+#toggle-crt a {
+        color: var(--primary);
+        border-color: var(--primary);
+        opacity: 1;
+}
+
+#toggle-crt a:hover {
+        color: #111;
+        background-color: var(--primary) !important;
+}
+
+#toggle-crt.disabled a {
+        opacity: .5 !important;
+}
+
+main {
+        width: 	min(calc(100% - 4rem), 720px);
+        min-height: calc(100vh - 10.3rem);
+        margin: 5rem auto 2rem auto;
+}
+
+main h1 {
+        line-height: 3rem;
+        color: var(--primary);
+}
+
+main h2 {
+        color: var(--secondary);
+}
+
+main h3 {
+        color: var(--tertiary);
+}
+
+a {
+        color: var(--links);
+        text-decoration: none;
+}
+
+a:hover {
+        text-decoration: underline;
+}
+
+small {
+        font-size: 1em;
+        color: #aaa;
+}
+
+span.newchar {
+        animation: newchar 0.25s;
+}
+
+@keyframes newchar {
+        from {
+                background: #fff8;
+        }
+}
+
+span.hide {
+        display: none;
+}
+
+h1:hover span.hide {
+        display: initial;
+        opacity: 0.1;
+}
+
+div#me_irl {
+        width: fit-content;
+        height: fit-content;
+        border: 2px solid white;
+}
+
+div#me_irl img {
+        display: block;
+}
+
+div#me_irl::before {
+        content: "";
+        position: absolute;
+        width: 104px;
+        height: 104px;
+        transform: translate(2px, 2px);
+        background-image: linear-gradient(to top right,
+        var(--primary),
+        var(--secondary));
+        z-index: -1;
+}
+
+h1,
+h2,
+h3,
+h4,
+h5,
+h6,
+p,
+small,
+blockquote {
+        transition: background-color 0.1s;
+}
+
+h1 a,
+h2 a,
+h3 a,
+h4 a,
+h5 a,
+h6 a {
+        color: inherit;
+}
+
+h1 a:hover,
+h2 a:hover,
+h3 a:hover,
+h4 a:hover,
+h5 a:hover,
+h6 a:hover {
+        text-decoration: none;
+}
+
+main h1:hover,
+main h2:hover,
+main h3:hover,
+main h4:hover,
+main h5:hover,
+main h6:hover,
+main p:hover,
+main small:hover,
+main blockquote:hover {
+        background-color: #fff1;
+}
+
+blockquote {
+        margin: 1rem 0;
+        padding: 0 2.5rem;
+}
+
+hr {
+        text-align: center;
+        line-height: 0px;
+        border-width: 1px 0 0 0;
+        border-color: #888f;
+        margin: 1.5em 0;
+        overflow: visible;
+}
+
+ul.links {
+        display: flex;
+        gap: 1em .5em;
+        flex-wrap: wrap;
+}
+
+ul.links li {
+        list-style: none;
+}
+
+ul.links li a {
+        padding: .2em .5em;
+        border: 1px solid var(--links);
+        color: var(--links);
+        border-radius: 2px;
+        background-color: transparent;
+        transition-property: color, border-color, background-color;
+        transition-duration: .2s;
+        animation-delay: 0s;
+        animation: list-item-fadein .2s forwards;
+        opacity: 0;
+}
+
+ul.links li a:hover {
+        color: #eee;
+        border-color: #eee;
+        background-color: var(--links) !important;
+        text-decoration: none;
+        box-shadow: 0 0 1em var(--links);
+}
+
+@keyframes list-item-fadein {
+        from {
+                opacity: 1;
+                background: #fff8;
+        }
+
+        to {
+                opacity: 1;
+                background: transparent;
+        }
+}
+
+div#web-buttons {
+        margin: 2rem 0;
+}
+
+#web-buttons a {
+        text-decoration: none;
+}
+
+#web-buttons img {
+        image-rendering: auto;
+        image-rendering: crisp-edges;
+        image-rendering: pixelated;
+}
+
+#web-buttons img:hover {
+        margin: -1px;
+        border: 1px solid #eee;
+        transform: translate(-2px, -2px);
+        box-shadow: 1px 1px 0 #eee, 2px 2px 0 #eee;
+}
+
+footer {
+        border-top: 1px solid #888;
+}
+
+#footer {
+        width: 	min(calc(100% - 4rem), 720px);
+        margin: auto;
+        padding: 2rem 0;
+        color: #aaa;
+}
+
+@keyframes overlay-flicker {
+        from {
+                opacity: .5;
+        }
+        to {
+                opacity: .6;
+        }
+}
+
+@keyframes overlay-scroll {
+        from {
+                background-position-y: 0;
+        }
+        to {
+                background-position-y: .2em;
+        }
+}
+
+#overlay {
+        position: fixed;
+        top: 0;
+        left: 0;
+        width: 100vw;
+        height: 100vh;
+        background-image: linear-gradient(180deg, rgba(0,0,0,0) 15%, rgb(0, 0, 0) 40%, rgb(0, 0, 0) 60%, rgba(0,0,0,0) 85%);
+        background-size: 100vw .2em;
+        background-repeat: repeat;
+        opacity: .5;
+        pointer-events: none;
+        /* animation: linear .05s infinite alternate overlay-flicker; */
+        mix-blend-mode: overlay;
+}
+
+@media screen and (max-width: 780px) {
+        body {
+                font-size: 14px;
+        }
+
+        nav {
+                width: calc(100vw - 2rem);
+                margin: 0;
+        }
+
+        div#header-text {
+                flex-grow: 1;
+        }
+
+        a#header-links-toggle {
+                display: flex;
+        }
+
+        header ul#header-links {
+                position: fixed;
+                left: 0;
+                top: 2.7rem;
+                width: calc(100vw - 2rem);
+                padding: 1rem;
+                flex-direction: column;
+                gap: 1rem;
+                border-bottom: 1px solid #888;
+                background: #080808;
+                display: none;
+        }
+
+        header ul#header-links.open {
+                display: flex;
+        }
+
+        ul#header-links li {
+                width: 100%;
+        }	
+
+        ul#header-links li a,
+        ul#header-links li span {
+                margin: 0;
+                display: block;
+                font-size: 1rem;
+                text-align: center;
+        }
+
+        main {
+                margin-top: 4rem;
+        }
+}
+
--- a/public/style/music-gateway.css
+++ b/public/style/music-gateway.css
@ -0,0 +1,550 @@
+@font-face {
+        font-family: "Monaspace Argon";
+        src: url("/font/monaspace-argon/MonaspaceArgonVarVF[wght,wdth,slnt].woff2") format("woff2-variations");
+        font-weight: 125 950;
+        font-stretch: 75% 125%;
+        font-style: oblique 0deg 20deg;
+}
+
+html,
+body {
+        margin: 0;
+        padding: 0;
+        color: #fff;
+        background-color: #111;
+        font-family: "Monaspace Argon", monospace;
+}
+
+#background {
+        position: fixed;
+        top: 0;
+        left: 0;
+        width: 100vw;
+        height: 100vh;
+        background-size: cover;
+        background-position: center;
+        filter: blur(25px) saturate(25%) brightness(0.5);
+        -webkit-filter: blur(25px) saturate(25%) brightness(0.5);;
+        animation: background-init .5s forwards,background-loop 30s ease-in-out infinite
+}
+
+#go-back {
+        position: absolute;
+        top: 1rem;
+        left: 1rem;
+        width: 2.5rem;
+        height: 2.5rem;
+        margin: 0;
+        font-size: 1.5rem;
+        display: flex;
+        justify-content: center;
+        align-items: center;
+        color: #fff;
+        background-color: #fff1;
+        border-radius: 4px;
+        text-decoration: none;
+        box-shadow: 0 0 8px #0004;
+        z-index: 100
+}
+
+main {
+        display: flex;
+        min-height: calc(100vh - 6rem);
+        justify-content: center;
+        align-items: center
+}
+
+#music-container {
+        position: absolute;
+        width: min(960px, calc(100vw - 4rem));
+        display: flex;
+        flex-direction: row;
+        flex-wrap: nowrap;
+        gap: 4rem;
+        animation: card-init .5s forwards
+}
+
+#art-container {
+        display: flex;
+        align-items: center;
+        position: relative;
+        width: 20rem;
+        transition: transform .5s cubic-bezier(0,0,0,1);
+}
+
+#art-container:hover {
+        transform: scale(1.05) translateY(-5px);
+}
+
+#art-container:hover img#artwork {
+        box-shadow: 0 16px 18px #0003;
+}
+
+/* TILT CONTROLS */
+
+#art-container > div {
+        position: absolute;
+        width: 33.3%;
+        height: 33.3%;
+        z-index: 2;
+}
+
+#art-container > div.tilt-topleft {
+        top: 0;
+        left: 0;
+}
+
+#art-container > div.tilt-topleft:hover ~ #artwork {
+        transform: rotate3d(-1, 1, 0, 20deg);
+        filter: brightness(var(--shine));
+        -webkit-filter: brightness(var(--shine));
+}
+
+#art-container > div.tilt-top {
+        top: 0;
+        left: 33.3%;
+}
+
+#art-container > div.tilt-top:hover ~ #artwork {
+        transform: rotate3d(-1, 0, 0, 20deg);
+        filter: brightness(var(--shine));
+        -webkit-filter: brightness(var(--shine));
+}
+
+#art-container > div.tilt-topright {
+        top: 0;
+        right: 0;
+}
+
+#art-container > div.tilt-topright:hover ~ #artwork {
+        transform: rotate3d(-1, -1, 0, 20deg);
+        filter: brightness(var(--shine));
+        -webkit-filter: brightness(var(--shine));
+}
+
+#art-container > div.tilt-right {
+        top: 33.3%;
+        right: 0;
+}
+
+#art-container > div.tilt-right:hover ~ #artwork {
+        transform: rotate3d(0, -1, 0, 20deg);
+}
+
+#art-container > div.tilt-bottomright {
+        bottom: 0;
+        right: 0;
+}
+
+#art-container > div.tilt-bottomright:hover ~ #artwork {
+        transform: rotate3d(1, -1, 0, 20deg);
+        filter: brightness(var(--shadow));
+        -webkit-filter: brightness(var(--shadow));
+}
+
+#art-container > div.tilt-bottom {
+        bottom: 0;
+        left: 33.3%;
+}
+
+#art-container > div.tilt-bottom:hover ~ #artwork {
+        transform: rotate3d(1, 0, 0, 20deg);
+        filter: brightness(var(--shadow));
+        -webkit-filter: brightness(var(--shadow));
+}
+
+#art-container > div.tilt-bottomleft {
+        bottom: 0;
+        left: 0;
+}
+
+#art-container > div.tilt-bottomleft:hover ~ #artwork {
+        transform: rotate3d(1, 1, 0, 20deg);
+        filter: brightness(var(--shadow));
+        -webkit-filter: brightness(var(--shadow));
+}
+
+#art-container > div.tilt-left {
+        top: 33.3%;
+        left: 0;
+}
+
+#art-container > div.tilt-left:hover ~ #artwork {
+        transform: rotate3d(0, 1, 0, 20deg);
+}
+
+/* TILT CONTROLS */
+
+#artwork {
+        --shine: 1.05;
+        --shadow: 0.8;
+        width: 100%;
+        max-width: 512px;
+        margin: auto;
+        display: flex;
+        justify-content: center;
+        line-height: 15rem;
+        border-radius: 4px;
+        color: #888;
+        background-color: #ccc;
+        box-shadow: 0 16px 16px #0004;
+        transition: transform 1s cubic-bezier(0,0,0,1), filter .3s linear, box-shadow .3s linear;
+}
+
+div#vertical-line {
+        width: 1px;
+        background-color: #fff4;
+        box-shadow: 0 0 16px #000;
+}
+
+#title {
+        margin: 0;
+        line-height: 1em;
+        font-size: 3em;
+}
+
+#year {
+        margin-left: .9em;
+        font-size: .5em;
+        color: #eee
+}
+
+#artist {
+        margin: .2em 0 1em 0;
+        font-size: 1em;
+        color: #eee
+}
+
+#title,
+#artist {
+        text-shadow: 0 .05em 2px #0004
+}
+
+#type {
+        display: inline-block;
+        margin: 0;
+        padding: .3em .8em;
+        color: #fff;
+        background-color: #111;
+        text-transform: uppercase;
+        border-radius: 4px
+}
+
+#type.single {
+        background-color: #3b47f4
+}
+
+#type.ep {
+        background-color: #f419bd
+}
+
+#type.album {
+        background-color: #34c627
+}
+
+#type.comp {
+        background-color: #ee8d46
+}
+
+#type.upcoming {
+        background-color: #ff3e3e
+}
+
+#type.upcoming span {
+        animation: bob 2s ease-in-out infinite;
+        display: inline-block;
+}
+
+#links {
+        margin: 1rem 0;
+        display: flex;
+        flex-direction: row;
+        flex-wrap: wrap;
+        gap: .5rem
+}
+
+#links a {
+        padding: .5em .8em;
+        border-radius: 4px;
+        flex-grow: 1;
+        font-size: 1em;
+        color: #111;
+        background-color: #fff;
+        text-align: center;
+        text-decoration: none;
+        transition: filter .1s,-webkit-filter .1s
+}
+
+#links a.buy {
+        background-color: #ff94e9
+}
+
+#links a.presave {
+        background-color: #ff94e9
+}
+
+#links a.spotify {
+        background-color: #8cff83
+}
+
+#links a.applemusic {
+        background-color: #8cd9ff
+}
+
+#links a.soundcloud {
+        background-color: #fdaa6d
+}
+
+#links a.youtube {
+        background-color: #ff6e6e
+}
+
+#links a:hover {
+        filter: brightness(125%);
+        -webkit-filter: brightness(125%)
+}
+
+#description {
+        font-size: 1.2em;
+}
+
+#share {
+        margin: 0;
+        display: inline-block;
+        text-shadow: 0 .05em 2px #0004;
+        cursor: pointer;
+        opacity: .5;
+        transition: opacity .1s linear;
+}
+
+#share:hover {
+        opacity: 1;
+}
+
+#share.active {
+        animation: share-click .5s forwards
+}
+
+#share.active::after {
+        content: "✓";
+        font-size: 1.5em;
+        line-height: .75em;
+        position: absolute;
+        transform: translateX(.3em);
+        animation: share-after 2s cubic-bezier(.5,0,1,.5) forwards
+}
+
+#tracks {
+        flex-basis: 100%;
+        max-height: 10rem;
+        margin: auto 8rem;
+        display: flex;
+        flex-wrap: wrap;
+        gap: 0 2rem;
+        overflow-y: auto;
+        scrollbar-color: #fff transparent;
+        scrollbar-width: thin
+}
+
+#tracks .track-preview {
+        width: 100%;
+        height: 2.5rem;
+        display: flex;
+        flex-direction: row;
+        border-bottom: 1px solid #fff2;
+        border-radius: 4px;
+        user-select: none;
+        transition: background-color .2s,color .2s
+}
+
+#tracks .track-preview: last-of-type {
+        border-bottom: none
+}
+
+.track-preview:hover {
+        background-color: #0002
+}
+
+.track-preview.playing {
+        color: #111;
+        background-color: #fff
+}
+
+.track-preview i {
+        width: .7em;
+        margin: auto .8em;
+        pointer-events: none
+}
+
+.track-preview p {
+        margin: auto 0;
+        display: inline-block;
+        line-height: 2em;
+        font-size: 1em;
+        pointer-events: none
+}
+
+.track-preview audio {
+        width: 100%
+}
+
+footer {
+        position: fixed;
+        left: 0;
+        bottom: 0;
+        width: 100vw;
+        height: 6rem;
+        display: flex;
+        flex-direction: column;
+        justify-content: center;
+        align-items: center;
+        color: #eee;
+        background-color: #0008;
+        backdrop-filter: blur(25px)
+}
+
+footer p {
+        margin: 0
+}
+
+footer a {
+        color: inherit;
+        text-decoration: none
+}
+
+footer a:hover {
+        text-decoration: underline
+}
+
+@media only screen and (max-width: 800px) {
+        main {
+                min-height: calc(100vh - 4rem);
+        }
+
+        #music-container {
+                width: calc(100vw - 8rem);
+                height: fit-content;
+                gap: 1rem;
+                padding: 2rem 0;
+                flex-direction: column;
+                text-align: center
+        }
+
+        #art-container {
+                width: 100%;
+                margin-bottom: 2rem;
+        }
+
+        #artwork {
+                max-width: 40vh;
+                max-height: 40vh;
+        }
+
+        #vertical-line {
+                display: none;
+        }
+
+        #music-container #info {
+                width: 100%
+        }
+
+        #year {
+                display: block;
+                margin: -.5em 0 .5rem;
+        }
+
+        #links {
+                margin: 2rem 0;
+                justify-content: center;
+        }
+
+        #share.active: : after {
+                transform: translate(calc(-50% - .6em),1.5em);
+        }
+
+        #tracks {
+                margin: 0;
+        }
+
+        footer {
+                height: 4rem;
+                font-size: .8rem;
+        }
+
+}
+
+#overlay {
+        position: fixed;
+        top: 0;
+        left: 0;
+        width: 100vw;
+        height: 100vh;
+        background-image: linear-gradient(180deg, rgba(0,0,0,0) 15%, rgb(0, 0, 0) 40%, rgb(0, 0, 0) 60%, rgba(0,0,0,0) 85%);
+        background-size: 100vw .2em;
+        background-repeat: repeat;
+        opacity: .5;
+        pointer-events: none;
+        /* animation: linear .05s infinite alternate overlay-flicker; */
+        mix-blend-mode: overlay;
+}
+
+@keyframes background-init {
+        from {
+                opacity: 0
+        }
+        to {
+                opacity: 1
+        }
+}
+
+@keyframes background-loop {
+        from {
+                transform: scale(1)
+        }
+        50% {
+                transform: scale(1.05)
+        }
+        to {
+                transform: scale(1)
+        }
+}
+
+@keyframes card-init {
+        from {
+                opacity: 0;
+                transform: scale(.9)
+        }
+        to {
+                opacity: 1;
+                transform: scale(1)
+        }
+}
+
+@keyframes share-click {
+        from {
+                color: #5dfc01
+        }
+        to {
+                color: #eee
+        }
+}
+
+@keyframes share-after {
+        from {
+                opacity: 1
+        }
+        to {
+                opacity: 0
+        }
+}
+
+@keyframes bob {
+        from,
+        to {
+                transform: translateY(-10%);
+        }
+        50% {
+                transform: translateY(10%);
+        }
+}
+
--- a/public/style/music.css
+++ b/public/style/music.css
@ -0,0 +1,134 @@
+div.music {
+        margin-bottom: 1rem;
+        padding: 1.5rem;
+        display: flex;
+        flex-direction: row;
+        gap: 1.5em;
+        border: 1px solid #222;
+        border-radius: 4px;
+        background-color: #ffffff08;
+        transition: background-color .1s;
+        text-decoration: none;
+        cursor: pointer;
+}
+
+div.music:hover {
+        background-color: #fff1;
+}
+
+div.music a {
+        text-decoration: none;
+}
+
+.music h1:hover,
+.music h2:hover,
+.music h3:hover {
+        background: initial;
+}
+
+.music-artwork img {
+        border: 1px solid #888;
+}
+
+.music-title {
+        margin: 0;
+        color: #eee;
+        font-size: 1.6em;
+        line-height: 1.6em;
+}
+
+.music-year {
+        color: #888;
+}
+
+.music-artist {
+        margin: -.5rem 0 0 0;
+        font-size: 1em;
+        color: #aaa;
+}
+
+h3[class^=music-type] {
+        margin: 0 0 1rem 0;
+        font-size: .8em;
+        color: #eee;
+}
+
+h3.music-type-single {
+        color: var(--tertiary);
+}
+
+h3.music-type-compilation {
+        color: var(--secondary);
+}
+
+h3.music-type-album {
+        color: var(--primary);
+}
+
+h3.music-type-upcoming {
+        color: #f47070;
+}
+
+.music-links {
+        width: fit-content;
+        margin: .5em 0;
+        padding: 0;
+        display: flex;
+        gap: .5rem;
+        flex-wrap: wrap;
+        line-height: 1.7em;
+        justify-content: center;
+}
+
+.music-links li {
+        list-style: none;
+}
+
+.music-links li a {
+        padding: .2em .5em;
+        border: 1px solid #65b4fd;
+        color: #65b4fd;
+        border-radius: 2px;
+        background-color: transparent;
+        transition-property: color, border-color, background-color;
+        transition-duration: .2s;
+        animation: list-item-fadein .2s forwards;
+        animation-delay: 0s;
+        opacity: 0;
+}
+
+
+.music-links li a:hover {
+        color: #eee;
+        border-color: #eee;
+        background-color: var(--links) !important;
+        text-decoration: none;
+}
+
+h2.question {
+        margin: 1rem 0;
+        padding: 1rem 1.5rem;
+        border-radius: 4px;
+        cursor: pointer;
+}
+
+.collapse {
+        margin: -1rem 0 1rem 0;
+        padding: .5em 1.5em;
+        border-radius: 4px;
+}
+
+@media screen and (max-width: 740px) {
+        div.music {
+                flex-direction: column;
+        }
+
+        .music-artwork,
+        .music-details {
+                text-align: center;
+                align-items: center;
+                display: flex;
+                flex-direction: column;
+        }
+}
+
--- a/views/footer.html
+++ b/views/footer.html
@ -0,0 +1,9 @@
+{{define "footer"}}
+
+<footer>
+        <div id="footer">
+                <small><em>*made with ♥ by ari, 2024*</em></small>
+        </div>
+</footer>
+
+{{end}}
--- a/views/header.html
+++ b/views/header.html
@ -0,0 +1,42 @@
+{{define "header"}}
+
+<header>
+        <nav>
+                <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>
+                <a id="header-links-toggle" onclick="toggle_header_links()">
+                        <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="/">home</a>
+                        </li>
+                        <li>
+                                <a href="/music">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}}
--- a/views/index.html
+++ b/views/index.html
@ -0,0 +1,196 @@
+<!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">
+
+                <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">
+
+                <script src="/script/main.js" defer></script>
+                <script src="/script/accessibility.js" defer></script>
+                <link rel="me" href="https://wetdry.world/@ari">
+        </head>
+        <body>
+                {{block "header" .}}{{end}}
+
+                <main>
+                        <h1>
+                                # hello, world!
+                        </h1>
+
+
+                <p>
+                                <strong>i'm ari!</strong>
+                                <br>
+                                <small>she/her 🏳️‍⚧️🏳️‍🌈💫🦆🇮🇪</small>
+                        </p>
+
+                <p>
+                                i like to create things on the internet! namely <a href="/music">music</a>,
+                                <a href="https://youtube.com/mellodoot" target="_blank">videos</a>, art <small><em>(link pending)</em></small>, and the odd
+                                <a href="https://github.com/mellodoot?tab=repositories" target="_blank">code project</a> from time to time!
+                                if it's a thing you can create on a computer, i've probably taken a swing at it.
+                        </p>
+                <p>
+                                you're very welcome to take a look around my little slice of the internet here,
+                                or explore any of the other corners i inhabit!
+                        </p>
+                <p>	
+                                and if you're looking to support me financially, that's so cool of you!!
+                                if you like, you can buy one or more of my songs 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>
+                                ## metadata
+                        </h2>
+
+                <p>
+                                <strong>my colours 🌈</strong>
+                        </p>
+                        <ul>
+                        <li>primary: <span class="col-primary">#b7fd49</span></li>
+                        <li>secondary: <span class="col-secondary">#f8e05b</span></li>
+                        <li>tertiary: <span class="col-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/@mellodoot" target="_blank">youtube</a>
+                                </li>
+                        <li>
+                                        <a href="https://mellodoot.tumblr.com" target="_blank">tumblr</a>
+                                </li>
+                        <li>
+                                        <a href="https://twitch.tv/mellodoot" target="_blank">twitch</a>
+                                </li>
+                        <li>
+                                        <a href="https://sptfy.com/mellodoot" target="_blank">spotify</a>
+                                </li>
+                        <li>
+                                        <a href="https://soundcloud.com/arimelody" target="_blank">soundcloud</a>
+                                </li>
+                        <li>
+                                        <a href="https://github.com/mellodoot" target="_blank">github</a>
+                                </li>
+                        </ul>
+
+                <p>
+                                <strong>projects i've worked on 🛠️</strong>
+                        </p>
+                        <ul class="links">
+                        <li>
+                                        <a href="https://catdance.xyz" target="_blank">
+                                                catdance
+                                        </a>
+                                </li>
+                        <li>
+                                        <a href="https://github.com/mellodoot/sandblock" target="_blank">
+                                                sandblock
+                                        </a>
+                                </li>
+                        <li>
+                                        <a href="https://github.com/mellodoot/prideflag" target="_blank">
+                                                pride flag
+                                        </a>
+                                </li>
+                        <li>
+                                        <a href="https://github.com/mellodoot/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>
+                        </ul>
+
+                        <hr>
+
+                        <h2>## cool people</h2>
+
+                        <div id="web-buttons">
+                                <a href="https://arimelody.me">
+                                        <img src="/img/buttons/ari melody.gif" alt="ari melody web button">
+                                </a>
+                                <a href="https://supitszaire.com" target="_blank">
+                                        <img src="/img/buttons/zaire.gif" alt="zaire web button">
+                                </a>
+                                <a href="https://mae.wtf" target="_blank">
+                                        <img src="/img/buttons/mae.png" alt="vimae web button">
+                                </a>
+
+                        <hr>
+
+                                <img src="/img/buttons/misc/debian.gif" alt="powered by debian">
+                                <img src="/img/buttons/misc/girls4notepad.gif" alt="girls 4 notepad">
+                                <img src="/img/buttons/misc/gaywebring.gif" alt="this website is GAY">
+                                <img src="/img/buttons/misc/graphicdesign.gif" alt="graphic design is my passion">
+                                <img src="/img/buttons/misc/gplv3.gif" alt="GPLv3 free software">
+                                <img src="/img/buttons/misc/hl.gif" alt="half-life">
+                                <img src="/img/buttons/misc/h-free-anim.gif" alt="dis site is hentai FREE">
+                                <img src="/img/buttons/misc/sprunk.gif" alt="sprunk">
+                                <img src="/img/buttons/misc/tohell.gif" alt="go straight to hell">
+                                <img src="/img/buttons/misc/virusalert.gif" alt="virus alert! click here" onclick="alert('meow :3')">
+                                <img src="/img/buttons/misc/wii.gif" alt="wii">
+                                <img src="/img/buttons/misc/www2.gif" alt="www">
+                                <img src="/img/buttons/misc/iemandatory.gif" alt="get mandatory internet explorer">
+                                <img src="/img/buttons/misc/learn_html.gif" alt="HTML - learn it today!">
+                                <a href="https://smokepowered.com" target="_blank">
+                                        <img src="/img/buttons/misc/smokepowered.gif" alt="high on SMOKE">
+                                </a>
+                                <a href="https://epicblazed.com" target="_blank">
+                                        <img src="/img/buttons/misc/epicblazed.png" alt="epic blazed">
+                                </a>
+                        </div>
+                </main>
+
+                {{block "footer" .}}{{end}}
+
+                <div id="overlay"></div>
+        </body>
+</html>
--- a/views/music-gateway.html
+++ b/views/music-gateway.html
@ -0,0 +1,121 @@
+<!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">
+
+                <title>{{.PrintArtists}} - {{.Title}}</title>
+                <link rel="icon" href="{{.ResolveArtwork}}">
+
+                <meta name="description" content="Stream &quot;{{.Title}}&quot; by {{.PrintArtists}} on all platforms!">
+                <meta name="author" content="{{.PrintArtists}}">
+                <meta name="keywords" content="{{.PrintCommaArtists}}, music, {{.Title}}, {{.Id}}, {{.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="{{.PrintArtists}} - {{.Title}}">
+                <meta property="og:description" content="Stream &quot;{{.Title}}&quot; by {{.PrintArtists}} on all platforms!">
+                <meta property="og:image" content="https://arimelody.me{{.ResolveArtwork}}">
+
+                <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}} - {{.Title}}">
+                <meta name="twitter:description" content="Stream &quot;{{.Title}}&quot; by mellodoot on all platforms!">
+                <meta name="twitter:image" content="https://arimelody.me{{.ResolveArtwork}}">
+                <meta name="twitter:image:alt" content="Cover art for &quot;{{.Title}}&quot;">
+
+                <script type="text/javascript" src="/script/music-gateway.js" defer=""></script>
+                <script type="text/javascript" src="/script/prideflag.js" defer=""></script>
+                <link rel="stylesheet" href="/style/music-gateway.css">
+        </head>
+        <body>
+                <div id="background" data-url="{{.ResolveArtwork}}"></div>
+                <div id="overlay"></div>
+
+                <a id="go-back" title="back to arimelody.me" href="/music">&lt;</a>
+
+                <main>
+                        <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="{{.ResolveArtwork}}" alt="{{.Title}} artwork">
+                                </div>
+                                <div id="vertical-line"></div>
+                                <div id="info">
+                                        <h1 id="title">{{.Title}}<span id="year">{{.Year}}</span></h1>
+                                        <p id="artist">{{.PrintArtists}}</p>
+                                        <p id="type" class="{{.Type}}">{{.Type}}</p>
+
+                                        <div id="links">
+                                                {{if .Buylink}}
+                                                <a href="{{.Buylink}}" target="_blank" class="buy">
+                                                        {{if .Buyname}}
+                                                                {{.Buyname}}
+                                                        {{else}}
+                                                                {{if .Free}}
+                                                                        download
+                                                                {{else}}
+                                                                        buy
+                                                                {{end}}
+                                                        {{end}}</a>
+                                                {{end}}
+
+                                                {{range .Links}}
+                                                <a class="{{.NormaliseName}}" target="_blank" href="{{.Url}}">
+                                                        {{.Name}}
+                                                </a>
+                                                {{end}}
+                                        </div>
+
+                                        <p id="description">
+                                                {{.Description}}
+                                        </p>
+
+                                        <p id="share">share</p>
+                                </div>
+                                <!-- <div id="tracks"> -->
+                                <!--         <% var file = `/audio/preview/${data.id}.webm` %> -->
+                                <!--         <% if (data.tracks && typeof(data.tracks) == typeof([])) { %> -->
+                                <!--         <% for( let i = 0; i < data.tracks.length; i++ ) { %> -->
+                                <!--                 <%  -->
+                                <!--                 songid = data.tracks[i].title.toLowerCase().replace(/[^a-z0-9]/g, ""); -->
+                                <!--                 file = `/audio/preview/${data.id}-${songid}.webm`; -->
+                                <!--                 %> -->
+                                <!---->
+                                <!--                 <div class="track-preview" id="preview-<%= songid %>"> -->
+                                <!--                         <i class="fa-solid fa-play play"></i> -->
+                                <!--                         <p><%= data.tracks[i].title %></p> -->
+                                <!--                         <audio src="<%= file %>"></audio> -->
+                                <!--                 </div> -->
+                                <!---->
+                                <!--                 <% } %> -->
+                                <!--                 <% } else { %> -->
+                                <!--                 <div class="track-preview" id="preview-<%= data.id %>"> -->
+                                <!--                         <i class="fa-solid fa-play play"></i> -->
+                                <!--                         <p>{{.Title}}</p> -->
+                                <!--                         <audio src="<%= file %>"></audio> -->
+                                <!--                 </div> -->
+                                <!--                 <% } %> -->
+                                <!-- </div> -->
+                        </div>
+                </main>
+
+                <footer>
+                        <p>made with &#10084; by <a href="/" target="_blank">ari melody</a>, 2024</p>
+                </footer>
+        </body>
+</html>
--- a/views/music.html
+++ b/views/music.html
@ -0,0 +1,145 @@
+<!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">
+
+                <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/music.css">
+
+                <script src="/script/main.js" defer></script>
+                <script src="/script/accessibility.js" defer></script>
+                <script src="/script/music.js" defer></script>
+        </head>
+        <body>
+                <header>
+                        <nav>
+                                <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>
+                                <a id="header-links-toggle" onclick="toggle_header_links()">
+                                        <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="/">home</a>
+                                        </li>
+                                        <li>
+                                                <a href="/music">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>
+
+                <main>
+                        <h1>
+                                # my music
+                        </h1>
+
+                        <div id="music-container">
+                                {{range $Album := .}}
+                                <div class="music" id="{{$Album.Id}}">
+                                        <div class="music-artwork">
+                                                <img src="{{$Album.ResolveArtwork}}" alt="{{$Album.Title}} artwork" width="128">
+                                        </div>
+                                        <div class="music-details">
+                                                <a href="/music/{{$Album.Id}}"><h1 class="music-title">{{$Album.Title}}</h1></a>
+                                                <h2 class="music-artist">{{$Album.PrintArtists}}</h2>
+                                                <h3 class="music-type-{{.Type}}">{{$Album.Type}}</h3>
+                                                <ul class="music-links">
+                                                {{range $Link := $Album.Links}}
+                                                        <li>
+                                                                <a href="{{$Link.Url}}">{{$Link.Name}}</a>
+                                                        </li>
+                                                {{end}}
+                                                </ul>
+                                        </div>
+                                </div>
+                                {{end}}
+                        </div>
+
+                        <h2 id="usage" class="question">
+                                <a href="#usage">
+                                        &gt; "can i use your music in my content?"
+                                </a>
+                        </h2>
+                        <div class="collapse">
+                                <p>
+                                        <strong class="big">yes!</strong> well, in most cases...
+                                </p>
+                                <p>
+                                        from <a href="/music/dream">Dream (2022)</a> onward, all of my <em>self-released</em> songs are
+                                        licensed under <a href="https://creativecommons.org/licenses/by-sa/3.0/" target="_blank">Creative Commons Attribution-ShareAlike 3.0</a>. anyone may use these
+                                        songs freely, so long as they provide credit back to me!
+                                </p>
+                                <p>
+                                        a great example of some credit text would be as follows:
+                                </p>
+                                <blockquote>
+                                        music used: mellodoot - Dream<br>
+                                                buy it here: <a href="/music/dream">https://arimelody.me/music/dream</a><br>
+                                                licensed under CC BY-SA 3.0.
+                                </blockquote>
+                                <p>
+                                        for any songs prior to this, they were all either released by me (in which case, i honestly
+                                        don't mind), or in collaboration with chill people who i don't see having an issue with it.
+                                        do be sure to ask them about it, though!
+                                </p>
+                                <p>
+                                        in the event the song you want to use is released under some other label, their usage rights
+                                        will more than likely trump whatever i'd otherwise have in mind. i'll try to negotiate some
+                                        nice terms, though! ;3
+                                </p>
+                                <p>
+                                        i love the idea of other creators using my songs in their work, so if you do happen to use
+                                        my stuff in a work 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>
+
+                <footer>
+                        <div id="footer">
+                                <small><em>*made with ♥ by ari, 2024*</em></small>
+                        </div>
+                </footer>
+
+                <div id="overlay"></div>
+        </body>
+</html>
				`@ -0,0 +1 @@`
				`ssh-ed25519 AAAAC3NzaC1lZDI1NTE5AAAAIBHkNL8tYKlEDX0eAQB9rD1GZ3jYzRXZfKmCEFuYJ9jP ari@aria`