Updated Lists

Added MyAnimeList, Goodreads list, list of useful mnemonics, and list of my favorite albums.
This commit is contained in:
Jim Shepich III 2022-02-02 03:30:33 -05:00
parent da47bf091a
commit 32e2c75475
6 changed files with 347 additions and 11 deletions

View File

@ -1,10 +1,12 @@
{ {
"master":{ "master":{
"title":"Master List", "title":"Master List",
"type":"master",
"description":"A lot of the things I want to convey on this website (my likes, my dislikes, useful links, helpful tips, etc.) can be sorted into lists. So, I thought that it would be a good idea to make a page of all my lists instead of having all this information scattered across a bunch of different articles. I was inspired in large part by a book I saw called Listography: Your Life in Lists, which is a journal with a bunch of prompts for making lists of things about yourself." "description":"A lot of the things I want to convey on this website (my likes, my dislikes, useful links, helpful tips, etc.) can be sorted into lists. So, I thought that it would be a good idea to make a page of all my lists instead of having all this information scattered across a bunch of different articles. I was inspired in large part by a book I saw called Listography: Your Life in Lists, which is a journal with a bunch of prompts for making lists of things about yourself."
}, },
"quotes":{ "quotes":{
"title":"My Favorite Quotes", "title":"My Favorite Quotes",
"type":"quotes",
"description":"This list contains quotes that I live by, quotes that have shaped my fundamental understanding of things, and quotes that I otherwise just like.", "description":"This list contains quotes that I live by, quotes that have shaped my fundamental understanding of things, and quotes that I otherwise just like.",
"list":[ "list":[
{ {
@ -135,6 +137,21 @@
"quote":"The convoluted wording of legalisms grew up around the necessity to hide from ourselves the violence we intend toward each other. Between depriving a man of one hour from his life and depriving him of his life there exists only a difference of degree. You have done violence to him, consumed his energy. Elaborate euphemisms may conceal your intent to kill, but behind any use of power over another the ultimate assumption remains: \"I feed on your energy.\"", "quote":"The convoluted wording of legalisms grew up around the necessity to hide from ourselves the violence we intend toward each other. Between depriving a man of one hour from his life and depriving him of his life there exists only a difference of degree. You have done violence to him, consumed his energy. Elaborate euphemisms may conceal your intent to kill, but behind any use of power over another the ultimate assumption remains: \"I feed on your energy.\"",
"quotee":"Frank Herbert", "quotee":"Frank Herbert",
"source":"Dune Messiah" "source":"Dune Messiah"
},
{
"quote":"If you don't think your life is worth more than someone else's, sign your donor card and kill yourself.",
"quotee":"Dr. Gregory House",
"source":"House MD (S5E09 Last Resort)"
},
{
"quote":"If there can be no victory, then I will fight forever.",
"quotee":"Koth of the Hammer",
"card":"Darksteel Plate",
"multiverseid":"213749"
},
{
"quote":"If you want something done right, do it yourself.",
"quotee":"Grandma Mary Kay Shepich"
} }
@ -144,5 +161,237 @@
"title":"Words I Like", "title":"Words I Like",
"description":"This list contains a bunch of words I like. Some of them I like because of how they sound, some of them I like because of what they mean, and some of them I like because of what I associate with them.", "description":"This list contains a bunch of words I like. Some of them I like because of how they sound, some of them I like because of what they mean, and some of them I like because of what I associate with them.",
"list":["guppy","wrought","confectionery","immaculate","phantasmal","imperious","chevalier","glisten","hasami","genuflect","spectre","delineate","confluence","libation","Pythonic"] "list":["guppy","wrought","confectionery","immaculate","phantasmal","imperious","chevalier","glisten","hasami","genuflect","spectre","delineate","confluence","libation","Pythonic"]
},
"mal":{
"title":"All of the Anime I've Watched",
"description":"MyAnimeList",
"external":true,
"link":"https://myanimelist.net/animelist/epicshepich"
},
"goodreads":{
"title":"Books I've Read Since High School",
"description":"My Goodreads list",
"external":true,
"link":"https://www.goodreads.com/review/list/110528977-jim-shepich?shelf=read"
},
"mnemonics":{
"title":"Mnemonics I Use",
"type":"key-value",
"description":"When you've been in school as long as I have, you pick up a few tricks to help remember things. <br /><br />Since antiquity, culture was passed down throughout the ages via oral tradition. Grand works of epic poetry, sacred knowledge, and more were passed from generation to generation, with each new generation memorizing these works through the use of mantras, chants, and verse. Sounds and rhythms carved out a place in people's memories that stood the test of time. <br /><br />When I memorized the Periodic Table of the Elements, I found that my general strategy was to just say a group of symbols as if they spelled out a word, and then I memorized that sound (it got a little bit awkward with dysprosium-holmium-erbium). A lot of the mnemonics I present here are short, otherwise-meaningless mantras such as Roy G. Biv, SOH CAH TOA, etc. And with these mantras, I welcome you into my own oral tradition.",
"list":[
{
"k":"<u>An</u> <u>Ox</u> and a <u>Red</u> <u>Cat</u>",
"v":"In electrochemical cells (both voltaic/galvanic and electrolytic), <u>ox</u>idation occurs at the <u>an</u>ode, and <u>red</u>uction occurs at the <u>cat</u>hode."
},
{
"k":"<u>Oil Rig</u>",
"v":"<u>O</u>xidation <u>i</u>s <u>l</u>oss of electrons, <u>R</u>eduction <u>i</u>s <u>g</u>ain of electrons."
},
{
"k":"<u>M Vem Jsun P</u>",
"v":"Listed in order of distance from the sun, the planets of the solar system are: <u>M</u>ercury, <u>V</u>enus, <u>E</u>arth, <u>M</u>ars, <u>J</u>upiter, <u>S</u>aturn, <u>U</u>ranus, <u>N</u>eptune, (<u>P</u>luto)"
},
{
"k":"<u>B</u>en <u>S</u>tiller's <u>G</u>randma <u>L</u>ikes <u>C</u>orn",
"v":"Strata of the epidermis listed in deep-to-superficial order: <u>b</u>asale, <u>s</u>pinosum, <u>g</u>ranulum, <u>l</u>ucidum, <u>c</u>orneum"
},
{
"k":"<u>WX</u> <u>w</u>ater <u>x</u>ylem, <u>OP</u> <u>o</u>rganics <u>p</u>hloem",
"v":"The types of transport tissue in vascular plants, xylem transports fresh water up from the roots, while phloem transports sugars and other organics down from the leaves."
},
{
"k":"<u>SOH CAH TOA</u>",
"v":"the trigonometric functions are ratios of the side lengths of a right triangle: <u>s</u>ine is <u>o</u>pposite over <u>h</u>ypotenuse, <u>c</u>osine is <u>a</u>djacent over <u>h</u>ypotenuse, and <u>t</u>angent is <u>o</u>pposite over <u>a</u>djacent."
},
{
"k":"<u>HOMES</u>",
"v":"The Great Lakes of Michigan are: <u>H</u>uron, <u>O</u>ntario, <u>M</u>ichigan, <u>E</u>rie, <u>S</u>uperior."
},
{
"k":"<u>Roy G. Biv</u>",
"v":"The colors of a rainbow (visible light) in order of increasing wavelength is: <u>r</u>ed, <u>o</u>range, <u>y</u>ellow, <u>g</u>reen, <u>b</u>lue, <u>i</u>ndigo, <u>v</u>iolet."
}
]
},
"albums":{
"hidden":true,
"type":"albums",
"inline":true,
"title":"My Favorite Albums",
"description":"Albums I listen to in the car, albums I listen to when I'm going to sleep, albums I listen to while I work, and more.",
"list":[
{
"title":"Boston",
"artist":"Boston",
"year":"1976",
"link":"https://youtu.be/wu77H0gsAYY",
"cover":"https://i.pinimg.com/736x/53/4c/6e/534c6e1931b4c123d1c14d0e65ad25eb--more-than-a-feeling-boston-boston.jpg"
},
{
"title":"Rumours",
"artist":"Fleetwood Mac",
"year":"1977",
"link":"https://youtu.be/uzEt9cATWFw",
"cover":"https://qph.fs.quoracdn.net/main-qimg-b3593ea30145790da58d4f39f4ed0231"
},
{
"title":"Fleetwood Mac",
"artist":"Fleetwood Mac",
"year":"1975",
"link":"https://youtu.be/qs-hn1y7T7c",
"cover":"https://static-musique.qub.ca/images/covers/7b/ov/n65tnqwnjov7b_max.jpg"
},
{
"title":"The Green Letter",
"artist":"Mitsukiyo",
"year":"2017",
"link":"https://youtu.be/e2MhdE9szv8",
"cover":"https://i.discogs.com/8x-MsOu_eY-RZkr1qyyxT3jyYWMYw5IteCG3KbHoQ-Y/rs:fit/g:sm/q:90/h:600/w:600/czM6Ly9kaXNjb2dz/LWltYWdlcy9SLTEz/NDQzMzA5LTE1NTQz/MTAxMjktMzExNi5q/cGVn.jpeg"
},
{
"title":"Moenie and Kitchi",
"artist":"Gregory and the Hawk",
"year":"2017",
"link":"https://youtu.be/EMZOtHIL7QM",
"cover":"https://f4.bcbits.com/img/0011833953_10.jpg"
},
{
"title":"Don't Look Back",
"artist":"Boston",
"year":"1978",
"link":"https://youtu.be/s2_xH7vOK7k",
"cover":"https://i.etsystatic.com/20562574/r/il/6769bc/2377662835/il_570xN.2377662835_juft.jpg"
},
{
"title":"Out of the Blue",
"artist":"Electric Light Orchestra",
"year":"1977",
"link":"https://youtu.be/2f9CoaIH9FE",
"cover":"https://m.media-amazon.com/images/I/71-4vcunM+L._SL1500_.jpg"
},
{
"title":"Master of Puppets",
"artist":"Metallica",
"year":"1986",
"link":"https://youtu.be/K6LA7v1PApU",
"cover":"https://m.media-amazon.com/images/I/71SziOTzXrL._AC_SL1425_.jpg"
},
{
"title":"Ride the Lightning",
"artist":"Metallica",
"year":"1984",
"link":"https://youtu.be/H0XGswUuZU0",
"cover":"https://www.revolvermag.com/sites/default/files/styles/original_image__844px_x_473px_/public/media/section-media/ridethelightning.jpg?itok=Fd0KtaS2&timestamp=1549044407"
},
{
"title":"The Black Album",
"artist":"Metallica",
"year":"1991",
"link":"https://youtu.be/DqDeH3hwxfw",
"cover":"https://m.media-amazon.com/images/I/71z4zm5yohL._SL1425_.jpg"
},
{
"title":"Point of Know Return",
"artist":"Kansas",
"year":"1977",
"link":"https://youtu.be/LepSiqpC6hA",
"cover":"http://static-1.ivoox.com/audios/2/9/5/0/7241500500592_XXL.jpg"
},
{
"title":"Leftoverture",
"artist":"Kansas",
"year":"1976",
"link":"https://youtu.be/f5jom_YYeGU",
"cover":"https://m.media-amazon.com/images/I/91CLL0FhHbL._SL1500_.jpg"
},
{
"title":"Heroes",
"artist":"David Bowie",
"year":"1977",
"link":"https://youtu.be/TFLLE8LPA_k",
"cover":"https://m.media-amazon.com/images/I/81VycvvC49L._SL1300_.jpg"
},
{
"title":"Frontiers",
"artist":"Journey",
"year":"1983",
"link":"https://youtu.be/eD7HC7g0dG8",
"cover":"https://m.media-amazon.com/images/I/81RPFmr49sL._SL1500_.jpg"
},
{
"title":"...And Justice For All",
"artist":"Metallica",
"year":"1988",
"link":"https://youtu.be/7PktvdsPXjI",
"cover":"https://images.genius.com/79908883b42660f49d71b42f4f82216c.1000x1000x1.jpg"
},
{
"title":"Escape",
"artist":"Journey",
"year":"1981",
"link":"https://youtu.be/T8gTlHInJIA",
"cover":"https://i.discogs.com/J6fEDZdk6kTWDArqmpjsTo5rrHnl9jUr655FedNoErU/rs:fit/g:sm/q:90/h:600/w:600/czM6Ly9kaXNjb2dz/LWltYWdlcy9SLTU0/MzIwNS0xMzY1NDUw/ODczLTkzMTQuanBl/Zw.jpeg"
},
{
"title":"Babymetal",
"artist":"Babymetal",
"year":"2014",
"link":"https://youtu.be/yIVRs6YSbOM",
"cover":"https://pbs.twimg.com/media/D0QrY-UX0AUTyfe?format=jpg&name=4096x4096"
},
{
"title":"OMNI",
"artist":"Minus the Bear",
"year":"2010",
"link":"https://www.youtube.com/watch?v=0RsY_mjiqk4&list=PL9B0A0664758349FA",
"cover":"https://m.media-amazon.com/images/I/91DhrWe+g4L._SL1500_.jpg"
},
{
"title":"The Stranger",
"artist":"Billy Joel",
"year":"1977",
"link":"https://youtu.be/DglOd7Wdueg",
"cover":"https://m.media-amazon.com/images/I/71JxCGwe9cL._SL1500_.jpg"
},
{
"title":"Planet of Ice",
"artist":"Minus the Bear",
"year":"2007",
"link":"https://www.youtube.com/watch?v=iZaBD3pymH0&list=OLAK5uy_lvNJl_TeMmqtjJJj0qH3ZhW5msijTqhvQ",
"cover":"https://f4.bcbits.com/img/a2748888567_10.jpg"
},
{
"title":"idyll",
"artist":"Steven Naylor",
"year":"2021",
"link":"https://youtu.be/dN6KMdvx8sM",
"cover":"https://i.scdn.co/image/ab67616d0000b2739117378d83714dd38a0340b7"
},
{
"title":"Ocean Eyes",
"artist":"Owl City",
"year":"2009",
"link":"https://www.youtube.com/watch?v=Kiwea1iV6cs&list=PLOKKW8hN_oU8Tc41hbE8QzuL6Zi8Ri0pt",
"cover":"https://m.media-amazon.com/images/I/51wQ1iymmsL.jpg"
},
{
"title":"All Things Bright and Beautiful",
"artist":"Owl City",
"year":"2011",
"link":"https://www.youtube.com/watch?v=LhTHXZfw3vY&list=PL23315D4CDDFE9D6C",
"cover":"https://m.media-amazon.com/images/I/71pTeXLg9kL._SL1200_.jpg"
},
{
"title":"An Airplane Carried Me To Bed",
"artist":"Sky Sailing",
"year":"2010",
"link":"https://www.youtube.com/watch?v=SlOQPOR8z7g&list=PL7MiJHw2jDfFJOh3NoL6x_2EtYExminHg",
"cover":"https://m.media-amazon.com/images/I/91nhQdHvTrL._SL1500_.jpg"
}
]
},
"future_lists":{
"title":"Lists I Plan on Adding",
"list":["My Favorite Albums","Useful Websites (nested?)","My Favorite Food"]
} }
} }

View File

@ -7,7 +7,7 @@ Welcome to my website! My name Jim <span title="'&#643;&#603;p&#618;k">Shepich</
<li>This website</li> <li>This website</li>
<li>Finding a job</li> <li>Finding a job</li>
<li><a href="https://epics.shepich.com">Epics & Emprises</a> - a tabletop roleplaying system inspired by 3.5e D&D, 5e D&D, and JRPGs, with a focus on martial arts and a hard magic system</li> <li><a href="https://epics.shepich.com">Epics & Emprises</a> - a tabletop roleplaying system inspired by 3.5e D&D, 5e D&D, and JRPGs, with a focus on martial arts and a hard magic system</li>
<li>Design & Dissection - a podcast co-hosted by Houston Webb about the design and philosophy of games, specifically TTRPGs (like E&E)</li> <li><a href="https://www.youtube.com/watch?v=-qdo_XNdCbU" target="blank_">Design & Dissection</a> - a podcast co-hosted by Houston Webb about the design and philosophy of games, specifically TTRPGs (like E&E)</li>
</ul> </ul>
<h2>Some useful things I've learned:</h2> <h2>Some useful things I've learned:</h2>
<ul> <ul>

View File

@ -1,6 +1,6 @@
<!--<details></details>--> <!--<details></details>-->
<article id="lists"> <article id="lists">
<h1 id="list-title">Master List</h1> <h1 id="list-title">List</h1>
<hr /> <hr />
<p id="list-description"></p> <p id="list-description"></p>
<br /> <br />

View File

@ -10,14 +10,26 @@ if(lists.hasOwnProperty(list_id)){
//If the list id in the query is invalid, go back to the main list. //If the list id in the query is invalid, go back to the main list.
} }
$("#list-title")[0].innerText = list.title; if(list.hasOwnProperty("external") && list.external){
if(list.hasOwnProperty("description")){ setTimeout(function(){location.assign(list["link"])}, 600);
$("#list-description")[0].innerText = list.description; //If the list specified in the query has the external property, then redirect to the external link. Note that because external lists in the master list are links to external URLs, the only situation where this will arise is if someone manually enters the list name into the query. I use setTimeout in order to allow the rest of the code to run.
list["title"] = `Redirecting to List of ${list["title"]}...`;
list["list"] = [];
//It takes a second to redirect, so put some filler on the page while the reader waits.
} }
$("#list-title")[0].innerHTML = list.title;
if(list.hasOwnProperty("description")){
$("#list-description")[0].innerHTML = list.description;
}
//Generate the article header from the list's title and description.
if(list.hasOwnProperty("ordered") && list.ordered){ if(list.hasOwnProperty("ordered") && list.ordered){
$("#list-container")[0].innerHTML += "<ol id='list'></ol>"; $("#list-container")[0].innerHTML += "<ol id='list'></ol>";
//Create an ordered list of the list has attribute "ordered":true. //Create an ordered list of the list has attribute "ordered":true.
} else if (list.hasOwnProperty("inline") && list.inline){
$("#list-container")[0].innerHTML += "<span id='list'></span>";
//Inline lists do not use HTML list tags but instead display list elements side by side.
} else { } else {
$("#list-container")[0].innerHTML += "<ul id='list'></ul>"; $("#list-container")[0].innerHTML += "<ul id='list'></ul>";
//By default, lists are unordered. //By default, lists are unordered.
@ -26,11 +38,29 @@ if(list.hasOwnProperty("ordered") && list.ordered){
$("#lists")[0].innerHTML += "<br /><a id='list-return-link' href='index.php?page=lists&list=master'>Return to Master List &#11148;</a>"; $("#lists")[0].innerHTML += "<br /><a id='list-return-link' href='index.php?page=lists&list=master'>Return to Master List &#11148;</a>";
//Add a return link to the bottom of the article. //Add a return link to the bottom of the article.
if(!list.hasOwnProperty("type")){
list["type"] = "default";
}
switch(list_id){ switch(list["type"]){
case "master": case "master":
//The master list has its own special format to follow.
for(id in lists){ for(id in lists){
var item = `<li><a href='index.php?page=lists&list=${id}'>${lists[id].title}</a></li>`; if(lists[id].hasOwnProperty("hidden") && lists[id].hidden){
continue;
}
var tooltip = "";
if(lists[id].hasOwnProperty("description")){
tooltip=lists[id]["description"];
//When hovering over a list in the directory, display its description as a tooltip.
}
var link = `href='index.php?page=lists&list=${id}' target='self_'`;
//By default, lists have internal links that change the query value to that list's title. Internal links should open in the same tab.
if(lists[id].hasOwnProperty("external") && lists[id].external){
link = `href='${lists[id]["link"]}' target='blank_'`;
//For external lists, use their link instead of an internal link. External links should open in a new tab.
}
var item = `<li title="${tooltip}"><a ${link}>${lists[id].title}</a></li>`;
$("#list")[0].innerHTML += item; $("#list")[0].innerHTML += item;
//The Master List contains a link to every other list in the JSON file. //The Master List contains a link to every other list in the JSON file.
} }
@ -38,6 +68,7 @@ switch(list_id){
//"Return to Master List" link is not needed on Master List itself. //"Return to Master List" link is not needed on Master List itself.
break; break;
case "quotes": case "quotes":
//Make the quotes section look like a quote board on Goodreads.
for(quote of list.list){ for(quote of list.list){
var item = "<p>"; var item = "<p>";
if(quote.hasOwnProperty("title")){ if(quote.hasOwnProperty("title")){
@ -74,7 +105,33 @@ switch(list_id){
$("#list")[0].innerHTML += item; $("#list")[0].innerHTML += item;
} }
break; break;
case "key-value":
//Handle key-value or term-definition type data.
for(pair of list.list){
var item = "";
if(pair.hasOwnProperty("link")){
item = `<span class="list-key"><a href="${pair.link}" target="blank_">${pair["k"]}</a></span>`
} else {
item = `<span class="list-key">${pair["k"]}</span>`
}
item += ` &mdash; ${pair["v"]}`;
$("#list")[0].innerHTML += `<li>${item}</li>`;
}
break;
case "albums":
for(album of list.list){
var tooltip = `${album.title} &mdash; ${album.artist} (${album.year})`;
//Display album data when hovering over cover art.
var item = `<img title="${tooltip}" src="${album.cover}" class="list-album-cover" />`;
//Display the album cover. Can be an external link or internal path.
if(album.hasOwnProperty("link")){
item = `<a href='${album.link}' target='blank_'>${item}</a>`;
//If there's a link to the album, put it on the cover.
}
item = `<div class="list-album">${item}<br />${album.title}<br />${album.artist}<br />${album.year}</div>`;
$("#list")[0].innerHTML += `${item}`;
}
break;
default: default:
for(item of list.list){ for(item of list.list){
$("#list")[0].innerHTML += `<li>${item}</li>`; $("#list")[0].innerHTML += `<li>${item}</li>`;

View File

@ -50,5 +50,8 @@ b{
font-weight:bold; font-weight:bold;
} }
i { i {
font-style: italic; font-style: italic;
}
u{
text-decoration: underline;
} }

View File

@ -102,8 +102,8 @@ footer{
} }
a{ a{
color:inherit; color:var(--azure);
text-decoration:inherit; text-decoration:underline;
} }
.nav-tab{ .nav-tab{
@ -164,3 +164,30 @@ article{
ul{ ul{
list-style-type: disc; list-style-type: disc;
} }
ul li ul{
list-style-type: circle;
/*Nested list*/
}
u{
text-underline-offset: 0.14em;
/*Without this, underlines won't show under descender characters (g,y,j,p,q)*/
}
.list-key{
font-weight:bold;
}
.list-album{
display:inline-block;
margin:0.75em;
text-align:center;
padding:0;
}
.list-album-cover{
width:10em;
height:10em;
margin:0;
}