{"id":71220,"date":"2022-09-10T19:52:03","date_gmt":"2022-09-10T23:52:03","guid":{"rendered":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/?p=71220"},"modified":"2022-09-13T09:55:04","modified_gmt":"2022-09-13T13:55:04","slug":"project-02-crying-or-mad","status":"publish","type":"post","link":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/2022\/09\/10\/project-02-crying-or-mad\/","title":{"rendered":"Project-02 Variable Faces"},"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>I was going to try with different expressions, but my if-else statement doesn&rsquo;t seem to work for random(). However, I used mouseY instead for the crying effect.<\/p>\n\n\n\n<div class=\"wp-block-file\"><a class=\"p5_sketch_link\" data-width=\"480\" data-height=\"640\" id=\"wp-block-file--media-394ae689-f110-4c7f-8948-9e7ab9d5eb81\" href=\"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/wp-content\/uploads\/2022\/09\/sketch-180.js\">sketch<\/a><a href=\"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/wp-content\/uploads\/2022\/09\/sketch-180.js\" class=\"wp-block-file__button\" download=\"\" aria-describedby=\"wp-block-file--media-394ae689-f110-4c7f-8948-9e7ab9d5eb81\">Download<\/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=\"640\"><\/iframe><pre class=\"language-javascript\"><code class=\"p5_editor language-javascript\">\/* Jiayi Chen\n   jiayiche    Section A *\/\nfunction setup() {\n    createCanvas(480, 640);\n}\n\nvar width = 480;\nvar height = 640;\nvar x=width \/100;\nvar y=height\/100;\nvar faceWidth= 80*x;\nvar faceHeight= 80*y;\nvar r = 0;\nvar g = 0;\nvar b = 0;\nvar eyebrowshape=1;\nvar eyebrowy2= 27*y;\nvar eyebrowy1= 27*y;\nvar mouthSizeX = 20*x;\nvar mouthSizeY = 10*y;\n\n\nfunction draw() {\n    background(220);\n    fill(255,229,204);\n    ellipse(50*x, 50*y, faceWidth,  faceHeight); \/\/head\n\n    var leftEyex=50*x-faceWidth\/4;                 \/\/eyes\n    var rightEyex=50*x+faceWidth\/4;\n    var leftEyey=50*y-faceHeight\/8;\n    var rightEyey=50*y-faceHeight\/8;\n    var eyeSizex=20*x;\n    var eyeSizey=20*y;\n    fill(255);\n    ellipse(leftEyex, leftEyey, eyeSizex,eyeSizey);\/\/Left eyes\n    fill(r,g,b);\n    ellipse(leftEyex, leftEyey, eyeSizex*2\/3,eyeSizey*2\/3);\n    fill(255);\n    ellipse(rightEyex,rightEyey,eyeSizex,eyeSizey);\/\/Right eyes\n    fill(r,g,b);\n    ellipse(rightEyex,rightEyey,eyeSizex*2\/3,eyeSizey*2\/3);\n    fill(r,g,b);                                     \/\/hairs\n    strokeWeight(0)\n    rect(20*x,5*y,60*x,10*y);\n    rect(20*x,15*y,10*x,7*y);\n    rect(70*x,15*y,10*x,7*y);\n    rect(30*x,15*y,10*x,5*y);\n    rect(60*x,15*y,10*x,5*y);\n    rect(40*x,15*y,15*x,2*y);\n    rect(50*x,15*y,15*x,2*y);\n    strokeWeight(10);                                  \/\/eyebrow\n    stroke(0);\n    var z=5*x;\n    var Leyebrowx1= 50*x-faceWidth\/4-z ;\n    var Reyebrowx1= 50*x+faceWidth\/4-z;\n    var Leyebrowx2= 50*x-faceWidth\/4+10*x-z;\n    var Reyebrowx2= 50*x+faceWidth\/4+10*x-z;\n\n    line(Leyebrowx1,eyebrowy1,Leyebrowx2,eyebrowy2); \/\/left eyebrow\n    line(Reyebrowx1,eyebrowy2,Reyebrowx2,eyebrowy1); \/\/right eyebrow\n    var mouthStroke = 2\n    strokeWeight(mouthStroke);                       \/\/mouthes\n    fill(255,0,0);\n    ellipse(50*x,70*y,mouthSizeX,mouthSizeY);     \n    if(mouseY&lt;=100*y\/2) {        \/\/tears\n      fill(0,0,255)\n      strokeWeight(0)\n      rect(leftEyex,leftEyey+10*y,5*x,20*y)\n      rect(rightEyex,rightEyey+10*y,5*x,20*y)\n      rect(leftEyex-5*x,leftEyey+20*y,5*x,20*y)\n      rect(rightEyex-5*x,rightEyey+20*y,5*x,20*y)\n    }\n    fill(204,102,0)\n    ellipse(50*x,50*y,10*x,10*y);   \n\n}\n\n\nfunction mousePressed() {\n    r = random(0,255);\n    g = random(0,255);\n    b = random(0,255);\n    mouthSizeX =random(10*x,30*x);\n    mouthSizeY =random(0*y,20*y);\n    eyebrowy2= random (20*y,35*y)\n    eyebrowy1= random (20*y,35*y)\n}\n\n<\/code><\/pre><\/div><\/body><\/html>\n","protected":false},"excerpt":{"rendered":"<p>I was going to try with different expressions, but my if-else statement doesn&rsquo;t seem to work for random(). However, I used mouseY instead for the crying effect. sketchDownload \/* Jiayi Chen jiayiche Section A *\/ function setup() { createCanvas(480, 640); } var width = 480; var height = 640; var x=width \/100; var y=height\/100; var &hellip; <a href=\"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/2022\/09\/10\/project-02-crying-or-mad\/\" class=\"more-link\">Continue reading<span class=\"screen-reader-text\"> &#8220;Project-02 Variable Faces&#8221;<\/span><\/a><\/p>\n","protected":false},"author":710,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":[],"categories":[97],"tags":[],"_links":{"self":[{"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/wp-json\/wp\/v2\/posts\/71220"}],"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\/710"}],"replies":[{"embeddable":true,"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/wp-json\/wp\/v2\/comments?post=71220"}],"version-history":[{"count":4,"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/wp-json\/wp\/v2\/posts\/71220\/revisions"}],"predecessor-version":[{"id":71790,"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/wp-json\/wp\/v2\/posts\/71220\/revisions\/71790"}],"wp:attachment":[{"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/wp-json\/wp\/v2\/media?parent=71220"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/wp-json\/wp\/v2\/categories?post=71220"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/wp-json\/wp\/v2\/tags?post=71220"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}