{"id":73809,"date":"2022-10-06T12:27:41","date_gmt":"2022-10-06T16:27:41","guid":{"rendered":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/?p=73809"},"modified":"2022-10-06T12:27:41","modified_gmt":"2022-10-06T16:27:41","slug":"abstract-clock","status":"publish","type":"post","link":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/2022\/10\/06\/abstract-clock\/","title":{"rendered":"Abstract clock"},"content":{"rendered":"\n

This is my abstract clock, I try to record my schedule in a day. Like during the day, I typed notes, or during the night, I drank coffee. The hour plays a role in changing the background color, the minute plays a role in changing the scene content, and the second plays a role in the flicking of elements. <\/p>\n\n\n\n

Abstract Clock <\/a><\/iframe><pre class=\"language-javascript\"><code class=\"p5_editor language-javascript\">\/\/Jason Jiang\n\/\/Section E\n\n\nfunction setup() {\n createCanvas(400, 400);\n colorMode(HSB)\n }\n \n\n\nfunction draw() { \n\/\/Setting scenes for different time \n if(hour()>=0 & hour()<=6){\n sleep() \n }\n if(hour()>=6 && hour()<=18){\n note()\n }\n if(hour()>=18 && hour()<=24){\n coffee() \n }\n}\n\n\/\/0:00-6:00\nfunction sleep(){\n var secondcount = map(minute(), 0, 60, 0, 3600)+second()\n var c = map(hour(), 0, 6, 0, 100)\n var h = map(secondcount, 0, 3600, 0, 90)\n\n \/\/Changing background color per hour\n background(80, 100-c, 100)\n\n \/\/Drawing battery\n noFill();\n strokeWeight(10)\n rect(width\/2-25, height\/2-50, 50, 100)\n rect(width\/2-7.5, height\/2-60, 15, 5)\n \n \/\/Changing color and height of battery per second, the battery becomes full per hour\n strokeWeight(0)\n push()\n translate(width\/2, height\/2)\n rotate(radians(180))\n fill(255-c, c, 0)\n rect(-20, -45, 40, h)\n pop()\n \/\/Drawing lightning\n lightning()\n}\n\n\/\/Flickering lightning per second\nfunction lightning(){\n if (second()%2==0){\n push()\n translate(width\/2, height\/2)\n strokeWeight(8)\n rotate(radians(-10))\n line(10, -25, -10, 0)\n line(-10, 0, 10, 0)\n line(10, 0, -10, 25)\n pop()\n } \n}\n\n\/\/6:00-18:00\nfunction note(x, y, m){\n var secondcount = map(minute(), 0, 60, 0, 3600)+second()\n var m = floor(map(minute(), 0, 60, 0, 10))\n var x = map(secondcount, 0, 3600, 0, 340)\n var y = 10+m*40\n var c = map(hour(), 6, 18, 0, 100)\n \/\/Changing background color per hour\n background(30, c, 100)\n \n \/\/Changing line length per second, a row takes 6 minutes\n fill(50)\n strokeWeight(0)\n rect(25, y, x, 15) \n strokeWeight(5)\n\n \/\/Flickering line per second\n if(second()%2==0){\n line(x+30, y-5, x+30, y+20) \n } \n \/\/Adding lines for previous minutes\n for(var i=0; i<m; i++){\n strokeWeight(0);\n rect(25, 10+i*40, 340, 15) \n }\n}\n\n\/\/18:00-24:00\nfunction coffee() {\n var secondcount = map(minute(), 0, 60, 0, 3600)+second()\n var c = map(hour(), 18, 24, 0, 100)\n var h = map(secondcount, 0, 3600, 0, 140)\n \n \/\/Changing background color per hour\n background(200, c, 50)\n\n \/\/Drawing coffee cup\n fill(20, 50, 40);\n strokeWeight(10)\n rect(width\/2-50, height\/2-50, 100, 150)\n noFill();\n strokeWeight(15)\n rect(width\/2-92.5, height\/2-10, 40, 60)\n strokeWeight(0)\n fill(255)\n\n \/\/Changing height of coffee per min\n rect(width\/2-45, height\/2-45, 90, h)\n\n \/\/Adding heat\n heat()\n}\n\n\/\/Flickering heat per second\nfunction heat(){\n strokeWeight(6)\n noFill()\n var w = width\/2 \n var h = height\/2\n if (second()%2==0){\n for(i=0; i<3; i++){\n bezier(w-30, h-70, w-20, h-80, w-40, h-100, w-30, h-110)\n w+=30\n }\n }\n}<\/code><\/pre><\/p><\/body><\/html>\n","protected":false},"excerpt":{"rendered":"<p>This is my abstract clock, I try to record my schedule in a day. Like during the day, I typed notes, or during the night, I drank coffee. The hour plays a role in changing the background color, the minute plays a role in changing the scene content, and the second plays a role in … <a href=\"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/2022\/10\/06\/abstract-clock\/\" class=\"more-link\">Continue reading<span class=\"screen-reader-text\"> “Abstract clock”<\/span><\/a><\/p>\n","protected":false},"author":723,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":[],"categories":[106,121],"tags":[],"_links":{"self":[{"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/wp-json\/wp\/v2\/posts\/73809"}],"collection":[{"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/wp-json\/wp\/v2\/users\/723"}],"replies":[{"embeddable":true,"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/wp-json\/wp\/v2\/comments?post=73809"}],"version-history":[{"count":2,"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/wp-json\/wp\/v2\/posts\/73809\/revisions"}],"predecessor-version":[{"id":73813,"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/wp-json\/wp\/v2\/posts\/73809\/revisions\/73813"}],"wp:attachment":[{"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/wp-json\/wp\/v2\/media?parent=73809"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/wp-json\/wp\/v2\/categories?post=73809"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/wp-json\/wp\/v2\/tags?post=73809"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}