{"id":5228,"date":"2020-09-16T14:42:19","date_gmt":"2020-09-16T18:42:19","guid":{"rendered":"https:\/\/courses.ideate.cmu.edu\/60-212\/f2020\/?p=5228"},"modified":"2020-09-17T21:43:42","modified_gmt":"2020-09-18T01:43:42","slug":"miniverse-clock","status":"publish","type":"post","link":"https:\/\/courses.ideate.cmu.edu\/60-212\/f2020\/hgururajandrew-cmu-edu\/09\/16\/miniverse-clock\/","title":{"rendered":"miniverse-clock"},"content":{"rendered":"<p>my code: <a href=\"https:\/\/editor.p5js.org\/miniverse\/sketches\/uhuv5GAOY\">https:\/\/editor.p5js.org\/miniverse\/sketches\/uhuv5GAOY<\/a><\/p>\n<p>***EDIT***<\/p>\n<p>my process:<del datetime=\"2020-09-17T21:56:16+00:00\"><br \/>\n<\/del><del datetime=\"2020-09-17T21:56:16+00:00\"><\/del><\/p>\n<p>I wanted to make an API based clock where I took the time and searched for a spotify song with related words or numbers in the title. However, because the clock won&#8217;t have internet connection when displayed, Golan suggested scraping texts and getting excerpts which mention the time. Those could be\u00a0 stored statically as small files along with the code. Therefore I wouldn&#8217;t need the internet.<\/p>\n<p>To do this, one needs some knowledge of python and mountains of plain text to look at. I had python expertise, and Golan pointed me to a repo with all of Project Gutenberg (database of text out of copywrite) saved as a plain text 8 GB zip file.<\/p>\n<p>The picture below is part of the preprocessing python script I used to parse Gutenberg for a couple hours. I listed calendar key words and looked for them linearly by looping through all the files. I stored the line the keyword was in to a JSON.<img loading=\"lazy\" class=\"alignnone wp-image-5244\" src=\"https:\/\/courses.ideate.cmu.edu\/60-212\/f2020\/wp-content\/uploads\/2020\/09\/Screen-Shot-2020-09-15-at-11.19.54-PM.png\" alt=\"\" width=\"483\" height=\"243\" srcset=\"https:\/\/courses.ideate.cmu.edu\/60-212\/f2020\/wp-content\/uploads\/2020\/09\/Screen-Shot-2020-09-15-at-11.19.54-PM.png 2880w, https:\/\/courses.ideate.cmu.edu\/60-212\/f2020\/wp-content\/uploads\/2020\/09\/Screen-Shot-2020-09-15-at-11.19.54-PM-640x322.png 640w, https:\/\/courses.ideate.cmu.edu\/60-212\/f2020\/wp-content\/uploads\/2020\/09\/Screen-Shot-2020-09-15-at-11.19.54-PM-1024x516.png 1024w, https:\/\/courses.ideate.cmu.edu\/60-212\/f2020\/wp-content\/uploads\/2020\/09\/Screen-Shot-2020-09-15-at-11.19.54-PM-768x387.png 768w, https:\/\/courses.ideate.cmu.edu\/60-212\/f2020\/wp-content\/uploads\/2020\/09\/Screen-Shot-2020-09-15-at-11.19.54-PM-1536x773.png 1536w, https:\/\/courses.ideate.cmu.edu\/60-212\/f2020\/wp-content\/uploads\/2020\/09\/Screen-Shot-2020-09-15-at-11.19.54-PM-2048x1031.png 2048w, https:\/\/courses.ideate.cmu.edu\/60-212\/f2020\/wp-content\/uploads\/2020\/09\/Screen-Shot-2020-09-15-at-11.19.54-PM-1200x604.png 1200w\" sizes=\"(max-width: 483px) 85vw, 483px\" \/><\/p>\n<p>This was the first iteration of the clock when I didn&#8217;t scrape the text properly and and didn&#8217;t read the documentation for p5.js:<\/p>\n<p><img loading=\"lazy\" class=\"wp-image-5249 alignleft\" src=\"https:\/\/courses.ideate.cmu.edu\/60-212\/f2020\/wp-content\/uploads\/2020\/09\/gif2.gif\" alt=\"\" width=\"509\" height=\"382\" \/><\/p>\n<p><img loading=\"lazy\" class=\"alignnone wp-image-5233\" src=\"https:\/\/courses.ideate.cmu.edu\/60-212\/f2020\/wp-content\/uploads\/2020\/09\/Screen-Shot-2020-09-16-at-10.06.30-AM.png\" alt=\"\" width=\"512\" height=\"381\" srcset=\"https:\/\/courses.ideate.cmu.edu\/60-212\/f2020\/wp-content\/uploads\/2020\/09\/Screen-Shot-2020-09-16-at-10.06.30-AM.png 1290w, https:\/\/courses.ideate.cmu.edu\/60-212\/f2020\/wp-content\/uploads\/2020\/09\/Screen-Shot-2020-09-16-at-10.06.30-AM-640x477.png 640w, https:\/\/courses.ideate.cmu.edu\/60-212\/f2020\/wp-content\/uploads\/2020\/09\/Screen-Shot-2020-09-16-at-10.06.30-AM-1024x764.png 1024w, https:\/\/courses.ideate.cmu.edu\/60-212\/f2020\/wp-content\/uploads\/2020\/09\/Screen-Shot-2020-09-16-at-10.06.30-AM-768x573.png 768w, https:\/\/courses.ideate.cmu.edu\/60-212\/f2020\/wp-content\/uploads\/2020\/09\/Screen-Shot-2020-09-16-at-10.06.30-AM-1200x895.png 1200w\" sizes=\"(max-width: 512px) 85vw, 512px\" \/><\/p>\n<p>changes to the display code from the photos above:<\/p>\n<ol>\n<li>I removed the font. The text has german, Russian, Spanish and other characters that &#8220;Vogue.tff&#8221; from free fonts.com doesn&#8217;t support. Now I use Times New Roman.<\/li>\n<li>I rescraped all the texts and screened for profanity.\u00a0 The way I scraped before had bugs and was on a computer with not enough processing power.\n<ol>\n<li>Here are the scripts for scraping and filtering profanity: <a href=\"https:\/\/github.com\/himalinig\/gutenberg_clock\">https:\/\/github.com\/himalinig\/gutenberg_clock<\/a><\/li>\n<\/ol>\n<\/li>\n<li>I include the minutes and seconds. For each text excerpt I also include the title of the text it came from. I restructured the code and read through the p5.js documentation which opened allowed me to fix the irregular highlighting.<\/li>\n<\/ol>\n<p>Here&#8217;s the gifs of the new and improved project:<\/p>\n<p>during the minute:<img loading=\"lazy\" class=\"alignnone size-full wp-image-5297\" src=\"https:\/\/courses.ideate.cmu.edu\/60-212\/f2020\/wp-content\/uploads\/2020\/09\/final_clock_during.gif\" alt=\"\" width=\"600\" height=\"450\" \/><\/p>\n<p>when the minute changes:<\/p>\n<p><img loading=\"lazy\" class=\"alignnone size-full wp-image-5298\" src=\"https:\/\/courses.ideate.cmu.edu\/60-212\/f2020\/wp-content\/uploads\/2020\/09\/final_clock_minute_change.gif\" alt=\"\" width=\"600\" height=\"450\" \/><\/p>\n<p>Another one:<\/p>\n<p><img loading=\"lazy\" class=\"alignnone size-full wp-image-5313\" src=\"https:\/\/courses.ideate.cmu.edu\/60-212\/f2020\/wp-content\/uploads\/2020\/09\/fin_gid.gif\" alt=\"\" width=\"600\" height=\"449\" \/><\/p>\n<p>Things I learned:<\/p>\n<ul>\n<li>Don&#8217;t do this the night before. I couple of hours when I wasn&#8217;t exhausted was more productive than the all nighter I pulled.<\/li>\n<li>Process is important. It was hard to isolate bugs when too many variables could be responsible. Make small changes, test, and then add complexity.<\/li>\n<li>\u00a0Make changes in order of importance. Small changes that are hard to figure out can be done later.<\/li>\n<\/ul>\n<p>&nbsp;<\/p>\n<p>&nbsp;<\/p>\n","protected":false},"excerpt":{"rendered":"<p>my code: https:\/\/editor.p5js.org\/miniverse\/sketches\/uhuv5GAOY ***EDIT*** my process: I wanted to make an API based clock where I took the time and searched for a spotify song with related words or numbers in the title. However, because the clock won&#8217;t have internet connection when displayed, Golan suggested scraping texts and getting excerpts which mention the time. Those &hellip; <a href=\"https:\/\/courses.ideate.cmu.edu\/60-212\/f2020\/hgururajandrew-cmu-edu\/09\/16\/miniverse-clock\/\" class=\"more-link\">Continue reading<span class=\"screen-reader-text\"> &#8220;miniverse-clock&#8221;<\/span><\/a><\/p>\n","protected":false},"author":49,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":[],"categories":[49],"tags":[],"_links":{"self":[{"href":"https:\/\/courses.ideate.cmu.edu\/60-212\/f2020\/wp-json\/wp\/v2\/posts\/5228"}],"collection":[{"href":"https:\/\/courses.ideate.cmu.edu\/60-212\/f2020\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/courses.ideate.cmu.edu\/60-212\/f2020\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/courses.ideate.cmu.edu\/60-212\/f2020\/wp-json\/wp\/v2\/users\/49"}],"replies":[{"embeddable":true,"href":"https:\/\/courses.ideate.cmu.edu\/60-212\/f2020\/wp-json\/wp\/v2\/comments?post=5228"}],"version-history":[{"count":11,"href":"https:\/\/courses.ideate.cmu.edu\/60-212\/f2020\/wp-json\/wp\/v2\/posts\/5228\/revisions"}],"predecessor-version":[{"id":5315,"href":"https:\/\/courses.ideate.cmu.edu\/60-212\/f2020\/wp-json\/wp\/v2\/posts\/5228\/revisions\/5315"}],"wp:attachment":[{"href":"https:\/\/courses.ideate.cmu.edu\/60-212\/f2020\/wp-json\/wp\/v2\/media?parent=5228"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/courses.ideate.cmu.edu\/60-212\/f2020\/wp-json\/wp\/v2\/categories?post=5228"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/courses.ideate.cmu.edu\/60-212\/f2020\/wp-json\/wp\/v2\/tags?post=5228"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}