Updated lists

data/lists.json

@@ -877,6 +877,11 @@
                 "year":"2001",
                 "poster":"https://m.media-amazon.com/images/M/MV5BMjlmZmI5MDctNDE2YS00YWE0LWE5ZWItZDBhYWQ0NTcxNWRhXkEyXkFqcGdeQXVyMTMxODk2OTU@._V1_.jpg"
             },
+            {
+                "title":"Space Jam",
+                "year":"1996",
+                "poster":"https://m.media-amazon.com/images/M/MV5BMDgyZTI2YmYtZmI4ZC00MzE0LWIxZWYtMWRlZWYxNjliNTJjXkEyXkFqcGdeQXVyNjY5NDU4NzI@._V1_.jpg"
+            },
             {
                 "title":"Fight Club",
                 "year":"1999",
@@ -1024,13 +1029,14 @@
         "description":"This list does not include countries that I have been in but not outside an airport (e.g. Germany).",
         "list":["United States","Canada","Mexico","Belize","Puerto Rico","Jamaica","Bahamas","Japan","India"]
     },
-    "links":{
+    "internet":{
         "title":"Guide to the Internet",
         "description":"This is a collection of all of the websites on the Internet I like to use.",
         "type":"key-value",
+        "dropdown-open":"true",
         "sections":[
             {
-                "title":"Computer Science Resources",
+                "title":"Computer Science",
                 "description":"When I was in middle school, I taught myself how to program using various tutorials and resources on the Internet. Here are the resources that I've found useful over the years.",
                 "sections":[
                     {
@@ -1040,7 +1046,7 @@
                             {"k":"Codecademy","link":"https://www.codecademy.com/","v":"This was my starting point for learning most of the languages I know. Codecademy has courses of tutorials to get you up and running with almost all of the most popular languages. It has in-browser interpreters/compilers, which are really convenient. In the last few years, a lot of the content has become paid, which is really a travesty, but the free courses can still get you started."},
                             {"k":"GitHub","link":"https://github.com/","v":"The most popular platform for hosting code. GitHub allows developers to manage and track changes with a version control software called Git."},
                             {"k":"Esolang Wiki","v":"A Wiki about esoteric programming languages (esolangs). Many of these languages were created as jokes, but trying to use these languages can be a genuinely beneficial exercise. Because of how different esolangs are from normal languages, they make you approach problems in new and creative ways.","link":"https://esolangs.org/"},
-                            {"k":"Atom Editor","link":"https://atom.io/","v":"Atom is my IDE of choice. It's free, open-source, has a nice, uncluttered UI (as compared to something like Eclipse). Some of the packages I've found that improve my Atom experience are:","list":[
+                            {"k":"Atom Editor","dropdown":true,"link":"https://atom.io/","v":"Atom is my IDE of choice. It's free, open-source, integrates nicely with GitHub, and has a slick, uncluttered UI (as compared to something like Eclipse). Some of the packages I've found that improve my Atom experience are:","list":[
                                 {"script":"By far the most important Atom package, script allows you to run code from most popular languages within the Atom editor. Hit CTRL+SHIFT+B and the console will pop up at the bottom and your code will do its thing. Go to the settings and change the first setting (CWD) to \"Directory of the script\"."},
                                 {"autoclose-html":"Pretty self-explanatory; this package will automatically create the corresponding close tag when you type in an open HTML tag. If you don't want the close tag on the next line, then type the wildcard (*) in the Force Inline field."},
                                 {"markdown-preview-plus":"Will render Markdown syntax in a new pane when you press CTRL+SHIFT+M. If you want to include LaTeX-formatted math script in your Markdown, tick \"Enable Math Rendering By Default\" in the Math Options."},
@@ -1054,13 +1060,58 @@
                     {
                         "title":"Web Development",
                         "list":[
-                            {"k":"W3Schools","link":"https://www.w3schools.com/","v":"The best documentation for learning JavaScript, HTML, and CSS. You can often learn a lot by just browsing through documentation to learn what you can do with the language."}
+                            {"k":"W3Schools","link":"https://www.w3schools.com/","v":"The best documentation for learning JavaScript, HTML, and CSS. You can often learn a lot by just browsing through documentation to learn what you can do with the language."},
+                            {"k":"Font Awesome","link":"https://fontawesome.com/start","v":"A huge library of icons that you can use on your website. Font Awesome integrates beautifully with CSS, and it's what I used to make those silver social media icons on the footer of this website. There are paid upgrades, but the basic free package still offers a huge selection of icons. Check out some cool Font Awesome icons: <span class='fa-solid fa-atom'></span><span class='fa-solid fa-flask'></span><span class='fa-solid fa-code'></span><span class='fa-solid fa-dice-d20'></span><span class='fa-solid fa-hat-wizard'></span><span class='fa-brands fa-wizards-of-the-coast'></span>"}
                         ]
                     },
                     {
                         "title":"Home Server",
                         "list":[
-                            {"k":"Certbot","link":"https://certbot.eff.org/instructions","v":"A free SSL/TLS certificate generator application. Just follow the instructions, and Certbot will take care of the rest for you. Make sure you renew your certificate periodically or set up <a href='https://eff-certbot.readthedocs.io/en/stable/using.html#automated-renewals'>automatic renewal</a>."}
+                            {"k":"Installing Apache","v":"Apache HTTP Server is a widely popular open-source server software. This link is to a tutorial for setting up Apache on a Windows machine.","link":"https://www.sitepoint.com/how-to-install-apache-on-windows/"},
+                            {"k":"Configuring PHP","v":"Back-end development is a key component of creating a dynamic, interactive website, and PHP is a popular language for back-end. This link is a tutorial for installing and configuring PHP on your Apache server.","link":"https://www.sitepoint.com/how-to-install-php-on-windows/"},
+                            {"k":"Certbot","link":"https://certbot.eff.org/instructions","v":"A free SSL/TLS certificate generator application. Just follow the instructions, and Certbot will take care of the rest for you. Make sure you renew your certificate periodically or set up <a href='https://eff-certbot.readthedocs.io/en/stable/using.html#automated-renewals'>automatic renewal</a>."},
+                            {"k":"DokuWiki","link":"https://www.dokuwiki.org/","v":"If you want to create a wiki on your server, DokuWiki is the way to do it. It's free, open-source, and user-friendly. All you have to do is download a version of it and extract the files into whatever directory of your server that you want to be the root of the wiki. After that, everything can be configured in your browser through the wiki's settings."}
+                        ]
+                    }
+                ]
+            },
+            {
+                "title":"Websites for Students",
+                "sections":[
+                    {
+                        "title":"General",
+                        "list":[
+                            {"k":"BibMe","v":"Generates formatted citations (MLA, APA, ACS, etc.) from the link to or title of a source. Makes writing a bibliography a lot less painful.","link":"https://www.bibme.org/"}
+                        ]
+                    },
+                    {
+                        "title":"Johns Hopkins Engineering for Professionals",
+                        "list":[
+                            {"k":"Course Evaluation Results Database","v":"This is where all the course/instructor evaluations are compiled.","link":"https://ep.jhu.edu/course-evaluation-results-public-reports"}
+                        ]
+                    },
+                    {
+                        "title":"University of Michigan",
+                        "list":[
+                            {"k":"LSA Course Guide","link":"https://www.lsa.umich.edu/cg/","v":"This may have changed, but when I was a student, the course catalog on Wolverine Access had an awful interface, so I always used the LSA Course Guide."},
+                            {"k":"Vertere","v":"The inventory management system for the chemistry department. This link was always way too difficult for me to find, so I finally ended up bookmarking it. You'll need login credentials, which are hard to come by.","link":"http://chem-vim.chem.lsa.umich.edu/VimWebV2/(S(jao5q1jgvvfjwzqi0rlpwejc))/Login.aspx"},
+                            {"k":"NMR Scheduler","v":"If you want to use the department NMR spectrometers, schedule your time here.","link":"https://apps-prod.chem.lsa.umich.edu/nmr/horarios/index.php#now"},
+                            {"k":"GC-MS Scheduler","v":"If you want to use the department GC-MS, schedule your time here.","link":"https://sites.google.com/a/umich.edu/lsa-chemistry-instrumentation-reservations/home/shimadzu-gcms"}
+                        ]
+                    },
+                    {
+                        "title":"Learning Japanese",
+                        "list":[
+                            {"k":"Free Japanese Lessons","v":"Using this website, I learned enough Japanese to find my way around Japan as well as place out of the first year of college Japanese. \"Free\" is not entirely accurate, but the one-time payment of $12.95 is well worth it. The site had a major update since I last used it, but I checked it out and it seems even higher quality than before.","link":"https://freejapaneselessons.com/"},
+                            {"k":"Rikaikun","v":"A Google Chrome extension that displays the reading and English translation of Japanese words when you hover over them. Rikaikun is very helpful when you're trying to read something that has a bunch of kanji that you don't know.","link":"https://chrome.google.com/webstore/detail/rikaikun/jipdnfibhldikgcjhfnomkfpcebammhp?hl=en"},
+                            {"k":"Suzuki-Kun","v":"This software analyzes inputted Japanese text and predicts the pitch-accent of the text. It displays pitch contours over the text and will generate synthesized speech so you can listen along. Use this tool if you want to take your pronunciation to the next level, or if you want an mp3 of some text (maybe for help memorizing a speech).","link":"http://www.gavo.t.u-tokyo.ac.jp/ojad/eng/phrasing/index"},
+                            {"k":"Vocabulary Lists","v":"Free Japanese Lessons has a lot of great wordbanks, but if you're looking for some esoteric subjects, you're going to go off the beaten path. These are some of the lists that I've found useful:",
+                                "list":[
+                                    "<a target='_blank' href='https://selftaughtjapanese.com/2018/06/22/japanese-vocabulary-list-card-and-board-games/'>Board Games</a>",
+                                    "<a target='_blank' href='https://sciencenotes.org/list-elements-japanese/'>Chemical Elements</a>",
+                                    "<a target='_blank' href='https://bulbapedia.bulbagarden.net/wiki/List_of_Japanese_Pok%C3%A9mon_names'>Pokemon Names</a>"
+                                ]
+                            }
                         ]
                     }
                 ]
@@ -1070,7 +1121,7 @@
                 "description":"Useful links for all you 21st century swashbucklers out there.",
                 "list":[
                     {"k":"Library Genesis (libgen)","link":"https://libgen.is/","v":"Textbooks, comic books, novels, you name it and there's a good chance that libgen has it."},
-                    {"k":"SciHub","link":"https://sci-hub.se/","v":"Paste in the link or DOI of a scientific article, SciHub will almost always get the PDF for you. Research is paid for by your tax dollars; you deserve access to the scientific knowledge you fund."},
+                    {"k":"SciHub","link":"https://sci-hub.se/","v":"Paste in the link or DOI of a scientific article, SciHub will almost always get the PDF for you. Research is paid for largely by government grants funded by tax dollars, so you should be entitled to its results."},
                     {"k":"YT1s","link":"https://yt1s.com/","v":"Allows you to download videos or audio files from YouTube."},
                     {"k":"WatchCartoonOnline","link":"https://www.wcostream.com/","v":"This has my site for cartoons and anime since around 2013."},
                     {"k":"Nyaa","link":"https://nyaa.si/","v":"The best magnets for torrenting anime."},

scripts/footer.php

@@ -4,7 +4,7 @@
     $socials = json_decode($socials_string);
 
     foreach($socials as $s){
-        echo "<a class='social' href='" . $s->link . "'><span class='fab fa-" . $s->icon . "' title='".$s->platform."'></span></a>";
+        echo "<a class='social' href='" . $s->link . "'><span class='fa-brands fa-" . $s->icon . "' title='".$s->platform."'></span></a>";
     }
 
     echo "<br /><span class='copyright'>Copyright &copy; 2021-".date("Y")." Jim Shepich</span>";

scripts/lists.js

@@ -75,31 +75,39 @@ function gen_list_html(list){
             break;
 
         case "sectioned":
-            if(!list.hasOwnProperty("section-level")){
+            if(!list.hasOwnProperty("section-level")||list["section-level"]==null){
                 list["section-level"] = 1;
                 //Section-level defines the heading level of the section. Top level is 1.
             }
-            if(!list.hasOwnProperty("dropdown")){
+            if(!list.hasOwnProperty("dropdown")||list.dropdown==null){
                 list.dropdown = true;
                 //By default, sections ARE in details/summary tags.
             }
+            if(!list.hasOwnProperty("dropdown-open")||list["dropdown-open"]==null){
+                list["dropdown-open"] = false;
+                //By default, sections are collapsed.
+            }
             for(section of list.sections){
                 var section_html = "";
                 var level = list["section-level"] + 1;
                 section["section-level"] = level;
                 //Nested secions are of lower levels.
-                if(!section.hasOwnProperty("type")){
+                if(!section.hasOwnProperty("type")||section.type==undefined){
                     section.type = list.type;
                     //This branch transfers the list type down from higher levels. By default, the bottom-level lists will inherit the type of the top-level object unless otherwise specified.
                 }
-                if(!section.hasOwnProperty("subtype")){
+                if(!section.hasOwnProperty("subtype")||section.subtype==undefined){
                     section.subtype = list.subtype;
                     //Sections should also inherit subtypes.
                 }
-                if(!section.hasOwnProperty("dropdown")){
+                if(!section.hasOwnProperty("dropdown")||section.dropdown==undefined){
                     section.dropdown = list.dropdown;
                     //Inherit dropdown-ness unless otherwise specified.
                 }
+                if(!section.hasOwnProperty("dropdown-open")||section["dropdown-open"]==undefined){
+                    section["dropdown-open"] = list["dropdown-open"];
+                    //Inherit whether the dropdown should be collapsed or open.
+                }
                 var description = (section.hasOwnProperty("description")) ? `<p>${section.description}</p>` : "";
                 //Sections can have their own descriptions.
 
@@ -108,7 +116,8 @@ function gen_list_html(list){
 
                 if(section.hasOwnProperty("dropdown") && section.dropdown){
                     //If the section is marked with the "dropdown" attribute, then nest the section's data in a details/summary tag.
-                    section_html = `<details class="heading" open><summary>${title}</summary>${description}${gen_list_html(section)}</details>`;
+                    var open = (section["dropdown-open"]) ? "open":"";
+                    section_html = `<details class="heading" ${open}><summary class="heading">${title}</summary>${description}${gen_list_html(section)}</details>`;
                 } else {
                     section_html = `${title}${description}${gen_list_html(section)}`;
                 }
@@ -199,7 +208,6 @@ function gen_item_html(item,type="default",subtype=null){
             break;
 
         case "kv-pair":
-            console.log(item);
             if(!(item.hasOwnProperty("k")&&item.hasOwnProperty("v"))||Object.keys(item).length==1){
                 var key = Object.keys(item)[0];
                 item["k"] = key;
@@ -218,7 +226,9 @@ function gen_item_html(item,type="default",subtype=null){
                  var temp = {
                      "title":item_html,
                      "list":item.list,
-                     "ordered": (item.hasOwnProperty("ordered")) ? item.ordered:false
+                     "ordered": (item.hasOwnProperty("ordered")) ? item.ordered:undefined,
+                     "dropdown": (item.hasOwnProperty("dropdown")) ? item.dropdown:undefined,
+                     "dropdown-open": (item.hasOwnProperty("dropdown-open")) ? item["dropdown-open"]:undefined
                  };
                  //If a key-value pair has a list key with an array attribute, then reformat it as a sublist whose title is the kv pair and whose list is the array.
                  item_html = gen_item_html(temp,type="sublist")
@@ -313,7 +323,8 @@ function gen_item_html(item,type="default",subtype=null){
         case "sublist":
             //Sublists can be any type (most likely default or key-value), so the best way to deal with them is recursion.
             if(item.hasOwnProperty("dropdown") && item.dropdown){
-                item_html = `<li><details><summary>${item.title}</summary>${gen_list_html(item)}</details></li>`;
+                var open = (item.hasOwnProperty("dropdown-open")&&item["dropdown-open"])?"open":"";
+                item_html = `<li><details ${open}><summary>${item.title}</summary>${gen_list_html(item)}</details></li>`;
             } else {
                 item_html = `<li>${item.title}${gen_list_html(item)}</li>`;
             }

styles/layout.css

@@ -91,7 +91,7 @@ summary{
     padding-left:1em;
 }
 
-details.heading summary{
+summary.heading{
     margin-bottom:0.25em;
     padding:0.5em;
 }
@@ -104,6 +104,10 @@ details details{
     padding-left:1.5rem;
 }
 
+li details{
+    padding-left:0;
+}
+
 details.heading{
     display:block;
     margin-bottom:0.1rem;

styles/theme.css

@@ -134,10 +134,12 @@ summary{
 
 }
 
-details.heading summary{
+summary.heading{
     background: var(--silver-right);
 }
 
+
+
 .no-highlight{
     user-select:none;
     -webkit-tap-highlight-color: rgba(0,0,0,0);