diff --git a/assets/code-style.css b/assets/code-style.css index 1aa7541..f584615 100644 --- a/assets/code-style.css +++ b/assets/code-style.css @@ -5,7 +5,7 @@ code { border-radius: 3px; font-family: "Maple Mono", monospace; font-style: normal; - /*font-size: 14pt;*/ + font-size: 13pt; } div.code-toolbar { @@ -30,7 +30,6 @@ code[class*="language-"] { overflow: auto; font-family: "Maple Mono", monospace; border-radius: 13px; - white-space: pre-wrap; } pre > code{ diff --git a/assets/fonts/MapleMono-Regular.ttf b/assets/fonts/MapleMono-Regular.ttf index 470e6c8..9388a2f 100644 Binary files a/assets/fonts/MapleMono-Regular.ttf and b/assets/fonts/MapleMono-Regular.ttf differ diff --git a/assets/fonts/MapleMono-Regular.woff2 b/assets/fonts/MapleMono-Regular.woff2 index 1ceeec1..fd0b49c 100644 Binary files a/assets/fonts/MapleMono-Regular.woff2 and b/assets/fonts/MapleMono-Regular.woff2 differ diff --git a/assets/img-style.css b/assets/img-style.css index 9c1e48e..f618645 100644 --- a/assets/img-style.css +++ b/assets/img-style.css @@ -1,4 +1,4 @@ -/* Image grid stuff */ +/* --- Image grid stuff --- */ section.img_grid { display: flex; align-items: center; diff --git a/assets/lib/scripts/music_status.css b/assets/lib/scripts/music_status.css new file mode 100755 index 0000000..7b9a1ea --- /dev/null +++ b/assets/lib/scripts/music_status.css @@ -0,0 +1,54 @@ +.music_tile { + font-family: "Noto Sans JP", sans-serif; + + display: flex; + flex-direction: column; + max-width: 300px; + margin: auto; + + .track_name { + font-size: 1.2em; + text-overflow: ellipsis; + overflow: hidden; + white-space: nowrap; + } + + .artist_name { + font-size: 1em; + text-overflow: ellipsis; + overflow: hidden; + white-space: nowrap; + } + + .album_name { + font-size: 0.9em; + color: #c1bfae; + text-overflow: ellipsis; + overflow: hidden; + white-space: nowrap; + } + + p { + margin: 0; + } + + p#musicStatus { + text-align: center; + margin-bottom: 20px; + } + + hr { + margin: 10px 0px; + border: none; + height: 1px; + background-color: grey; + } + + img { + margin: 20px; + border-radius: 10px; + height: 260px; + width: 260px; + object-fit: contain; + } +} diff --git a/assets/lib/scripts/music_status.js b/assets/lib/scripts/music_status.js new file mode 100644 index 0000000..7aaae75 --- /dev/null +++ b/assets/lib/scripts/music_status.js @@ -0,0 +1,100 @@ +async function getData(url) { + try { + const response = await fetch(url); + if (!response.ok) { + throw new Error(`Response status: ${response.status}`); + } + + const json = await response.json(); + return json + } catch (error) { + console.error(error.message); + } +} + +const USERNAME = "G2"; +const LUCENE_ESCAPE = /([\!\*\+\-\=\<\>\&\|\(\)\[\]\{\}\^\~\?\:\\/"])/g; + +let artworkTile = document.getElementById("mainArtwork"); +let albumTitle = document.getElementById("albumTitle"); +let albumArtist = document.getElementById("albumArtist"); +let track = document.getElementById("track"); +let status = document.getElementById("musicStatus"); +let prev_mbid = null; + +async function main() { + // Get my currently playing song! + let statusTmp = "Currently playing:"; + let songInfo = await getData("https://api.listenbrainz.org/1/user/" + USERNAME + "/playing-now") + if (songInfo["payload"]["count"] == 0) { + // If no current song, get last played + songInfo = await getData("https://api.listenbrainz.org/1/user/" + USERNAME + "/listens?count=1") + statusTmp = "Last played song:"; + } + + if (prev_mbid != null && prev_mbid == JSON.stringify(songInfo)) { + return; + } + prev_mbid = JSON.stringify(songInfo); + + let artistName = songInfo["payload"]["listens"][0]["track_metadata"]["artist_name"]; + let trackName = songInfo["payload"]["listens"][0]["track_metadata"]["track_name"]; + let releaseMBID = songInfo["payload"]["listens"][0]["track_metadata"]["additional_info"]["release_mbid"]; + if (releaseMBID == null && songInfo["payload"]["listens"][0]["track_metadata"]["mbid_mapping"] != null) { + releaseMBID = songInfo["payload"]["listens"][0]["track_metadata"]["mbid_mapping"]["release_mbid"]; + } + + // Search for the MBID if it's not included in the data + if (releaseMBID == null) { + let artistSearchName = encodeURIComponent(artistName.replace(LUCENE_ESCAPE, "\\$1")); + let trackSearchName = encodeURIComponent(trackName.replace(LUCENE_ESCAPE, "\\$1")); + + console.log("https://musicbrainz.org/ws/2/recording/?query=" + trackSearchName + " AND artist:%22" + artistSearchName + "%22&fmt=json"); + let searchedReleases = await getData( + "https://musicbrainz.org/ws/2/recording/?query=" + trackSearchName + " AND artist:%22" + artistSearchName + "%22&fmt=json" + ); + + console.log(searchedReleases); + + if (searchedReleases["count"] >= 1) { + if (searchedReleases["recordings"][0]["releases"][0]) { + + } + releaseMBID = searchedReleases["recordings"][0]["releases"][0]["id"]; + console.log("Found MBID by search " + releaseMBID); + } + } + + let albumName = "Unknown Album"; + let artworkSrc = "https://placehold.co/260/2220/FFFDE6?text=?&font=roboto"; + if (releaseMBID != null) { + // Get release information (like album title) + let releaseInfo = await getData("https://musicbrainz.org/ws/2/release/" + releaseMBID + "?fmt=json&inc=release-groups"); + albumName = releaseInfo["title"]; + + let releaseGroupMBID = releaseInfo["release-group"]["id"]; + + // Grab the image from the release ID + let coverArtGroup = await fetch("https://coverartarchive.org/release-group/" + releaseGroupMBID + "/front-500"); + if (coverArtGroup.status == 200) { + artworkSrc = coverArtGroup.url + } else { + let coverArtTrack = await fetch("https://coverartarchive.org/release/" + releaseMBID + "/front-500"); + if (coverArtTrack.status == 200) { + artworkSrc = coverArtTrack.url; + } + } + } + + console.log("%s %s by %s (%s)", statusTmp, trackName, artistName, albumName); + + // Fill in the data + status.textContent = statusTmp; + albumArtist.textContent = artistName; + track.textContent = trackName; + albumTitle.textContent = albumName; + artworkTile.src = artworkSrc; +} + +main().catch(console.log); +setInterval(main, 10000); diff --git a/assets/main-style.css b/assets/main-style.css index 686967a..80f3ead 100644 --- a/assets/main-style.css +++ b/assets/main-style.css @@ -35,8 +35,7 @@ hr { margin-bottom: 20px; } -/* Header */ - +/* --- Header --- */ header { margin-top: 20px; margin-bottom: 50px; @@ -121,8 +120,7 @@ abbr { text-decoration-line: dotted; } -/* Main Content */ - +/* --- Main Content --- */ main { display: grid; grid-template-columns: 50% 50%; @@ -185,13 +183,23 @@ main section { .centered { grid-column: span 2; - max-width: 800px; - min-width: 100%; + /*max-width: 800px;*/ + /*min-width: 100%;*/ +} + +.three_column { + display: flex; + flex-wrap: wrap; + + > * { + width: fit-content; + padding-right: 10px; + } } main section img { max-width: 95%; - margin: auto; + margin: 20px auto; display: block; border-radius: 13px; } @@ -308,8 +316,7 @@ main .tags p:first-child { margin-bottom: 0; } -/* Footer */ - +/* --- Footer --- */ footer { width: auto; margin-top: auto; @@ -326,36 +333,7 @@ footer p:last-child { margin-bottom: 0; } -nav.paginator { - display: flex; - gap: 10px; - align-items: center; - justify-content: center; - margin-bottom: 20px; - font-size: 1.8em; - position: relative; - - font-style: normal; - font-weight: bold; -} - -nav.paginator::hover { - all: unset; -} - -nav.paginator .next { - display: block; - position: absolute; - right: 10px; -} - -nav.paginator .prev { - display: block; - position: absolute; - left: 10px; -} - -/* Blog Style */ +/* --- Blog Style --- */ blockquote { font-family: "IBM Plex Serif", serif; font-size: 15pt; @@ -397,7 +375,36 @@ mark::selection { border-left: 1px solid grey; } -/* Mobile/Small Screens */ +nav.paginator { + display: flex; + gap: 10px; + align-items: center; + justify-content: center; + margin-bottom: 20px; + font-size: 1.8em; + position: relative; + + font-style: normal; + font-weight: bold; +} + +nav.paginator::hover { + all: unset; +} + +nav.paginator .next { + display: block; + position: absolute; + right: 10px; +} + +nav.paginator .prev { + display: block; + position: absolute; + left: 10px; +} + +/* --- Mobile/Small Screens --- */ @media(max-width: 700px) { header { flex-direction: column; @@ -428,6 +435,11 @@ mark::selection { .centered { grid-column: span 1; + min-width: 100%; + } + + .three_column { + grid-template-columns: 1fr; } figure.showcase { @@ -442,8 +454,7 @@ mark::selection { } } - -/* Dark theme stuff */ +/* --- Dark theme stuff --- */ @media (prefers-color-scheme: dark) { body { color: #fffde6; @@ -467,13 +478,13 @@ mark::selection { color: #b4e2ff; } - /* Header */ + /* --- Header --- */ header .navigation a.active::after { border-bottom: 2px solid #fffde6; } - /* Main Content */ + /* --- Main Content --- */ main > a:link, main > a:visited, main > a:hover { color: #FFF; @@ -483,11 +494,6 @@ mark::selection { background-color: aliceblue; } - /* - main p { - color: #FFF; - }*/ - section.clickable { color: white; background-color: #2b2b32; diff --git a/index.html b/index.html index b6cabb3..09318a3 100644 --- a/index.html +++ b/index.html @@ -20,8 +20,11 @@ A place for personal projects and things. Enjoy!"> - + + + +
@@ -56,8 +59,10 @@ A place for personal projects and things. Enjoy!">

Some more of my links:

GitHub ⧫ - Gitea ⧫ - Ko-fi + Forgejo ⧫ + Ko-fi ⧫ + Search ⧫ + Portfolio

@@ -70,13 +75,6 @@ A place for personal projects and things. Enjoy!"> always.

-
-

My Portfolio

-

This portfolio is a list of things I have done and things I am - currently doing. Not comprehensive, and also I dislike selling - myself.

-
-

Random Stuff

I tend to make a lot of random things on the internet. You can @@ -111,52 +109,63 @@ A place for personal projects and things. Enjoy!">

My Favorites

-
-

A small list of things I enjoy. Favorites! This isn't at - all comprehensive and I'd love to add more.

-
+
+
+

General Apps:

+ -
-

General Apps:

- +

Editors:

+
    +
  • Text Editor - Kate
    • +
  • Hex Editor - ImHex
    • +
-

Text/Code Editor:

- +

Fonts:

+ +
-

Fonts:

- -
+
+

Programming Languages:

+ -
-

Programming Languages:

- +

Shell:

+ -

Shell:

- +

Desktop Environment:

+ +
-

Desktop Environment:

- -
+
+
+

Currently listening to:

+

???

+
+
+

???

+

???

+
+ +
+
+
@@ -168,4 +177,5 @@ A place for personal projects and things. Enjoy!">

+ diff --git a/random/index.html b/random/index.html index 32aac95..1f457a1 100644 --- a/random/index.html +++ b/random/index.html @@ -35,11 +35,13 @@ A place for personal projects and things. Enjoy!">
+

What's this?

-

What's this?

This page contains random things I have made. Most of them have very little use, but some are kind of interesting! I'll keep it updated as I add more things. Please enjoy!

+ +

Random Stuff

diff --git a/random/mothofthemonth/color-thief.umd.js b/random/mothofthemonth/color-thief.umd.js new file mode 100644 index 0000000..c32f693 --- /dev/null +++ b/random/mothofthemonth/color-thief.umd.js @@ -0,0 +1 @@ +!function(t,r){"object"==typeof exports&&"undefined"!=typeof module?module.exports=r():"function"==typeof define&&define.amd?define(r):t.ColorThief=r()}(this,function(){if(!t)var t={map:function(t,r){var n={};return r?t.map(function(t,o){return n.index=o,r.call(n,t)}):t.slice()},naturalOrder:function(t,r){return tr?1:0},sum:function(t,r){var n={};return t.reduce(r?function(t,o,e){return n.index=e,t+r.call(n,o)}:function(t,r){return t+r},0)},max:function(r,n){return Math.max.apply(null,n?t.map(r,n):r)}};var r=function(){var r=5,n=8-r,o=1e3;function e(t,n,o){return(t<<2*r)+(n<f/2){for(e=n.copy(),i=n.copy(),u=(r=a-n[s])<=(o=n[h]-a)?Math.min(n[h]-1,~~(a+o/2)):Math.max(n[s],~~(a-1-r/2));!v[u];)u++;for(c=l[u];!c&&v[u-1];)c=l[--u];return e[h]=u,i[s]=e[h]+1,[e,i]}}(u==o?"r":u==i?"g":"b")}}return u.prototype={volume:function(t){return this._volume&&!t||(this._volume=(this.r2-this.r1+1)*(this.g2-this.g1+1)*(this.b2-this.b1+1)),this._volume},count:function(t){var r=this.histo;if(!this._count_set||t){var n,o,i,u=0;for(n=this.r1;n<=this.r2;n++)for(o=this.g1;o<=this.g2;o++)for(i=this.b1;i<=this.b2;i++)u+=r[e(n,o,i)]||0;this._count=u,this._count_set=!0}return this._count},copy:function(){return new u(this.r1,this.r2,this.g1,this.g2,this.b1,this.b2,this.histo)},avg:function(t){var n=this.histo;if(!this._avg||t){var o,i,u,a,s=0,h=1<<8-r,c=0,f=0,v=0;for(i=this.r1;i<=this.r2;i++)for(u=this.g1;u<=this.g2;u++)for(a=this.b1;a<=this.b2;a++)s+=o=n[e(i,u,a)]||0,c+=o*(i+.5)*h,f+=o*(u+.5)*h,v+=o*(a+.5)*h;this._avg=s?[~~(c/s),~~(f/s),~~(v/s)]:[~~(h*(this.r1+this.r2+1)/2),~~(h*(this.g1+this.g2+1)/2),~~(h*(this.b1+this.b2+1)/2)]}return this._avg},contains:function(t){var r=t[0]>>n;return gval=t[1]>>n,bval=t[2]>>n,r>=this.r1&&r<=this.r2&&gval>=this.g1&&gval<=this.g2&&bval>=this.b1&&bval<=this.b2}},a.prototype={push:function(t){this.vboxes.push({vbox:t,color:t.avg()})},palette:function(){return this.vboxes.map(function(t){return t.color})},size:function(){return this.vboxes.size()},map:function(t){for(var r=this.vboxes,n=0;n251&&e[1]>251&&e[2]>251&&(r[o].color=[255,255,255])}},{quantize:function(h,c){if(!h.length||c<2||c>256)return!1;var f=function(t){var o,i=new Array(1<<3*r);return t.forEach(function(t){o=e(t[0]>>n,t[1]>>n,t[2]>>n),i[o]=(i[o]||0)+1}),i}(h);f.forEach(function(){});var v=function(t,r){var o,e,i,a=1e6,s=0,h=1e6,c=0,f=1e6,v=0;return t.forEach(function(t){(o=t[0]>>n)s&&(s=o),(e=t[1]>>n)c&&(c=e),(i=t[2]>>n)v&&(v=i)}),new u(a,s,h,c,f,v,r)}(h,f),l=new i(function(r,n){return t.naturalOrder(r.count(),n.count())});function g(t,r){for(var n,e=t.size(),i=0;i=r)return;if(i++>o)return;if((n=t.pop()).count()){var u=s(f,n),a=u[0],h=u[1];if(!a)return;t.push(a),h&&(t.push(h),e++)}else t.push(n),i++}}l.push(v),g(l,.75*c);for(var p=new i(function(r,n){return t.naturalOrder(r.count()*r.volume(),n.count()*n.volume())});l.size();)p.push(l.pop());g(p,c);for(var d=new a;p.size();)d.push(p.pop());return d}}}().quantize,n=function(t){this.canvas=document.createElement("canvas"),this.context=this.canvas.getContext("2d"),this.width=this.canvas.width=t.width,this.height=this.canvas.height=t.height,this.context.drawImage(t,0,0,this.width,this.height)};n.prototype.getImageData=function(){return this.context.getImageData(0,0,this.width,this.height)};var o=function(){};return o.prototype.getColor=function(t,r){return void 0===r&&(r=10),this.getPalette(t,5,r)[0]},o.prototype.getPalette=function(t,o,e){var i=function(t){var r=t.colorCount,n=t.quality;if(void 0!==r&&Number.isInteger(r)){if(1===r)throw new Error("colorCount should be between 2 and 20. To get one color, call getColor() instead of getPalette()");r=Math.max(r,2),r=Math.min(r,20)}else r=10;return void 0===n||Number.isInteger(n)?n=10:n<1&&(n=10),{colorCount:r,quality:n}}({colorCount:o,quality:e}),u=new n(t),a=function(t,r,n){for(var o=t,e=[],i=0,u=void 0,a=void 0,s=void 0,h=void 0,c=void 0;i=125)&&(a>250&&s>250&&h>250||e.push([a,s,h]));return e}(u.getImageData().data,u.width*u.height,i.quality),s=r(a,i.colorCount);return s?s.palette():null},o.prototype.getColorFromUrl=function(t,r,n){var o=document.createElement("img"),e=this;o.addEventListener("load",function(){var i=e.getPalette(o,5,n);r(i[0],t)}),o.src=t},o.prototype.getImageData=function(t,r){var n=new XMLHttpRequest;n.open("GET",t,!0),n.responseType="arraybuffer",n.onload=function(){if(200==this.status){var t=new Uint8Array(this.response);o=t.length;for(var n=new Array(o),o=0;o + + + + + + Moth of the Month + + + +
+

Loading...

+
+
+

Moth of the Month

+
+
+ +

Japanese Silkmoth

+
+ + + + diff --git a/random/mothofthemonth/moth1.jpg b/random/mothofthemonth/moth1.jpg new file mode 100644 index 0000000..51a5864 Binary files /dev/null and b/random/mothofthemonth/moth1.jpg differ diff --git a/random/writing/bombadil.txt b/random/writing/bombadil.txt deleted file mode 100644 index 76741a6..0000000 --- a/random/writing/bombadil.txt +++ /dev/null @@ -1,6 +0,0 @@ -And then on his back Tom threw his knapsack roughly, -he made a right and left the room with vigor and -and while thumping down the passage-way twixt leaflets old and blanding, -and skipping up the stone-hewn steps right up to the landing; - -Tom took a right, by candle-light while walking to the