{"id":73951,"date":"2022-10-08T18:25:37","date_gmt":"2022-10-08T22:25:37","guid":{"rendered":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/?p=73951"},"modified":"2022-10-08T18:26:00","modified_gmt":"2022-10-08T22:26:00","slug":"project-06-abstract-clock-4","status":"publish","type":"post","link":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/2022\/10\/08\/project-06-abstract-clock-4\/","title":{"rendered":"Project 06 Abstract Clock"},"content":{"rendered":"<!DOCTYPE html PUBLIC \"-\/\/W3C\/\/DTD HTML 4.0 Transitional\/\/EN\" \"http:\/\/www.w3.org\/TR\/REC-html40\/loose.dtd\">\n<html><body><p>The way time is tracked in this piece of design is by having the little blue fish tracking seconds, the little pink fish tracking minutes, and the rainbow tracking hours. So the blue fish moves right a bit every second and when the minute increases the pink fish moves right. the rainbow goes from red to blue every hour and it restarts from red again when the full rainbow is done. <\/p> <div><a class=\"p5_sketch_link\" href=\"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/wp-content\/uploads\/2022\/10\/sketch-72.js\" data-width=\"480\" data-height='400\"'>sketch<\/a><iframe src=\"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/wp-content\/plugins\/p5-embedder\/p5_iframe.html\" class=\"p5_exampleFrame\" width=\"480\" height='400\"'><\/iframe><pre class=\"language-javascript\"><code class=\"p5_editor language-javascript\">\/\/Jenny Wang\n\/\/Section B\n\/\/jiayiw3@andrew.cmu.edu\n\/\/Project 06 Abstract Clock\n\n\/\/set variables\nvar H;\/\/hour\nvar M;\/\/min\nvar S;\/\/sec\nvar bx;\/\/blue fish x\nvar px;\/\/piink fish x\n\nfunction setup() {\n    createCanvas(480, 400);\n    background(255);\n\n} \n\nfunction draw() {\n    background(199,137,201);\/\/purple\n    \n    \/\/current time\n    H = hour();\n    M = minute();\n    S = second();\n\n    \/\/rainbow (hour)\n    if(H == 6 || H == 12 || H==18 || H==24){\n        noStroke();\n        fill(122,153,229);\/\/blue\n        ellipse(240,140,560,470)\n        fill(131,226,210);\/\/teal\n        ellipse(240,140,480,390);\n        fill(151,226,134);\/\/green\n        ellipse(240,140,400,310);\n        fill(239,232,101);\/\/yellow\n        ellipse(240,140,320,230);\n        fill(229,156,90);\/\/orange\n        ellipse(240,140,240,150);\n        fill(247,129,87);\/\/red\n        ellipse(240,140,160,70);\n    }\n    else if(H == 5 || H == 11 || H==17 || H==23){\n        noStroke();\n        fill(131,226,210);\/\/teal\n        ellipse(240,140,480,390);\n        fill(151,226,134);\/\/green\n        ellipse(240,140,400,310);\n        fill(239,232,101);\/\/yellow\n        ellipse(240,140,320,230);\n        fill(229,156,90);\/\/orange\n        ellipse(240,140,240,150);\n        fill(247,129,87);\/\/red\n        ellipse(240,140,160,70);\n    }\n    else if(H == 4 || H == 10 || H== 16 || H== 22){\n        noStroke();\n        fill(151,226,134);\/\/green\n        ellipse(240,140,400,310);\n        fill(239,232,101);\/\/yellow\n        ellipse(240,140,320,230);\n        fill(229,156,90);\/\/orange\n        ellipse(240,140,240,150);\n        fill(247,129,87);\/\/red\n        ellipse(240,140,160,70);\n    }\n\n    else if(H == 3 || H == 9 || H== 15 || H== 21){\n        noStroke();\n        fill(239,232,101);\/\/yellow\n        ellipse(240,140,320,230);\n        fill(229,156,90);\/\/orange\n        ellipse(240,140,240,150);\n        fill(247,129,87);\/\/red\n        ellipse(240,140,160,70);\n    }\n\n    else if(H == 2 || H == 8 || H== 14 || H== 20){\n        noStroke();\n        fill(229,156,90);\/\/orange\n        ellipse(240,140,240,150);\n        fill(247,129,87);\/\/red\n        ellipse(240,140,160,70);\n    }\n\n    else if(H == 1 || H == 7 || H== 13 || H== 19){\n        noStroke();\n        fill(247,129,87);\/\/red\n        ellipse(240,140,160,70);\n    }\n\n    \/\/ocean\n    fill(198,230,227);\n    rect(0,132,480,351);\n\n    \/\/bluefish(sec)\n    bx = width\/59;\n    bluefish(S*bx,height\/2);\n\n    \/\/pink fish(min)\n    px = width\/59\n    pinkfish(M*px,3*height\/4);\n}\n \nfunction bluefish(x,y){\n    \/\/tail\n    fill(44,170,213);\n    triangle(x-38,y+13,x-38,y-13,x,y);\n    \/\/fin on top and bottom\n    fill(144,214,235);\n    triangle(x+5,y-17,x-10,y-23,x-10,y+10);\n    \/\/body\n    fill(44,170,213);\n    ellipse(x,y,55,34);\n    \/\/fin\n    fill(144,214,235);\n    triangle(x-15,y-6,x-15,y+6,x,y-2);\n    \/\/head\n    fill(144,214,235);\n    ellipse(x+16,y,23,27);\n    \/\/eye\n    fill(73,64,24);\n    ellipse(x+15,y-3,5,5);\n    fill(\"white\");\n    ellipse(x+14,y-4,2,2);\n    \/\/smile\n    stroke(73,64,24);\n    strokeWeight(1);\n    point(x+19,y+6);\n    point(x+20,y+6.5);\n    point(x+21,y+7);\n    point(x+22,y+7.3);\n    point(x+23,y+7);\n    point(x+24,y+6.5);\n}\n\nfunction pinkfish(x,y){\n    \/\/tail\n    noStroke();\n    fill(193,82,144);\/\/dark pink\n    triangle(x-38,y+13,x-38,y-13,x,y);\n    \/\/fin on top and bottom\n    fill(233,171,205);\/\/light pink\n    triangle(x+5,y-17,x-10,y-23,x-10,y+10);\n    \/\/body\n    fill(193,82,144);\n    ellipse(x,y,55,34);\n    \/\/fin\n    fill(233,171,205);\n    triangle(x-15,y-6,x-15,y+6,x,y-2);\n    \/\/head\n    fill(233,171,205);\n    ellipse(x+16,y,23,27);\n    \/\/eye\n    fill(73,64,24);\n    ellipse(x+15,y-3,5,5);\n    fill(\"white\");\n    ellipse(x+14,y-4,2,2);\n    \/\/smile\n    stroke(73,64,24);\n    strokeWeight(1);\n    point(x+19,y+6);\n    point(x+20,y+6.5);\n    point(x+21,y+7);\n    point(x+22,y+7.3);\n    point(x+23,y+7);\n    point(x+24,y+6.5);\n}\n<\/code><\/pre><\/div><\/body><\/html>\n","protected":false},"excerpt":{"rendered":"<p>The way time is tracked in this piece of design is by having the little blue fish tracking seconds, the little pink fish tracking minutes, and the rainbow tracking hours. So the blue fish moves right a bit every second and when the minute increases the pink fish moves right. the rainbow goes from red &hellip; <a href=\"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/2022\/10\/08\/project-06-abstract-clock-4\/\" class=\"more-link\">Continue reading<span class=\"screen-reader-text\"> &#8220;Project 06 Abstract Clock&#8221;<\/span><\/a><\/p>\n","protected":false},"author":769,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":[],"categories":[106,56],"tags":[],"_links":{"self":[{"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/wp-json\/wp\/v2\/posts\/73951"}],"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\/769"}],"replies":[{"embeddable":true,"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/wp-json\/wp\/v2\/comments?post=73951"}],"version-history":[{"count":1,"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/wp-json\/wp\/v2\/posts\/73951\/revisions"}],"predecessor-version":[{"id":73953,"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/wp-json\/wp\/v2\/posts\/73951\/revisions\/73953"}],"wp:attachment":[{"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/wp-json\/wp\/v2\/media?parent=73951"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/wp-json\/wp\/v2\/categories?post=73951"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/wp-json\/wp\/v2\/tags?post=73951"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}