Ziningy1 – Section C – Project 10 Generative Landscape

The concept behind this project is the rotating sushi bar I used to love when i was a child living in china. The sushi chef will prepare the sushi in dishes and place them on top of the transporting track. Customers will just wait and select the different sushi and sea food dishes they want. So I drawn this graphic sushi bar from the customer standing perspective. The dishes will change randomly between two types: Sushi roll, Sushi and fish head that I illustrated. It will also generate randomly size and color of the dishes.

sketch

//Zining Ye 
//15104 lecture 1 recitation C
//ziningy1@andrew.cmu.edu 
//Project-10 
var speed= -4;
var linex=-100;
var disk = [];
var sushilink = 
["https://i.imgur.com/b6hRo0j.png",
"https://i.imgur.com/QaOb647.png",
"https://i.imgur.com/099E6kA.png"] 

var roll;
var sushi;
var fish;

function preload(){ //load sushi image 
    roll= loadImage(sushilink[0]);
    fish= loadImage(sushilink[1]);
    sushi=loadImage(sushilink[2]);



}

function setup() {
    createCanvas(480, 480); 
    var rx = 0;
    // create an initial collection of disks 
    for (var i = 0; i < 30; i++){
        disk[i] = makeDisk(rx);
        rx+=250;
    }
    frameRate(10);
}


function draw(){
    background(80);
    translate(0,-20); //frame shift upward 

    sushiBar(); //calling sushi bar function 
    displayLine();
    updatedisplayDisk(); //call disk draw funciton 
    displayChopstick(); //calling chopstick draw function 
    displayChopstick1(); //calling second chopstick function 

   

}

function sushiBar(){ // drawing of the sushi bar 
    noStroke();

    //drawing the transporting trail 
    fill(120,120,90);
    rect(0,0,width,120);
    fill(220,180,130);
    stroke(0);
    strokeWeight(3);
    rect(0,height/2-140,width,20);
    fill(170,140,100);
    strokeWeight(1);
    rect(0,height/2-130,width,20);
    fill(180);
    strokeWeight(3);
    rect(0,height/2-120,width,150);
    //drawing the sushi counter
    fill(220,180,130)
    rect(0,height/2+30,width,10);
    strokeWeight(1);
    fill(170,140,100)
    rect(0,height/2+39,width,10);
    strokeWeight(1.5);
    fill(190,170,130)
    rect(0,height/2+49,width,80);
    fill(230,220,190)
    rect(0,height/2+129,width,140);
}

function updatedisplayDisk(){ //keep the sushi and disk display

    for(var i=0;i<disk.length;i++){
        disk[i].move();
        disk[i].display();
    }
}


function diskMove(){ //moving the disk by updating the speed 
    this.x += this.speed; 

}

function displayDisk(){ //drawing the disk 
    push();
    fill(this.color);
    //line(30,height/2-120,30,height/2+30)
    strokeWeight(2); //the ellipse of the plate 
    ellipse(this.x,this.disky,this.diskw,this.diskh);
    fill(120);
    noStroke();
    ellipse(this.x+5,this.disky+10,80,30); //shadow of the food 


    //deciding which food will be on the plate  
    if(this.food == roll){

        image(roll,this.x-230,50,roll.width*0.7,roll.height*0.8);  
        rectMode(CENTER);
        fill(250);

    }else if(this.food == fish){
        fill(0);
        image(fish,this.x-70,120,fish.width*0.8,fish.height*0.8);  
    } else{

        image(sushi,this.x-190,70,roll.width*0.6,roll.height*0.7);  

    }
    
    pop();


}
function displayLine(){

    push();
   
    //drawing the sushi trail 
    stroke(0);
    strokeWeight(2);
    for(var i=0; i<300;i++){
    var space = i*30
    line(linex+space,height/2-120,linex+space,height/2+30);
    }
    linex += speed
    pop();


}

function displayChopstick(){ //drawing of the chopstick 

    translate(-120,0);
    var chopx=190
    var chopy1= height/2+180
    var chopy2= height/2+192
    fill(90,80,70);
    noStroke();
    rect(chopx+17,chopy1-10,7,38);
    fill(120,120,70);
    rect(chopx+17,chopy1-10,7,33);
    strokeCap(ROUND);
    stroke(220,70,60);
    strokeWeight(6)
    line(chopx,chopy1,chopx+120,chopy1)
    line(chopx,chopy2,chopx+120,chopy2)
    stroke(20);
    line(chopx+90,chopy1,chopx+120,chopy1)
    line(chopx+90,chopy2,chopx+120,chopy2)
    stroke(190,190,20);
    strokeCap(SQUARE);
    line(chopx+85,chopy1,chopx+90,chopy1)
    line(chopx+85,chopy2,chopx+90,chopy2)
}

function displayChopstick1(){ //same chopstick drawing copyed to a different position 

    translate(220,0);
    var chopx=190
    var chopy1= height/2+180
    var chopy2= height/2+192
    fill(90,80,70);
    noStroke();
    rect(chopx+17,chopy1-10,7,38);
    fill(120,120,70);
    rect(chopx+17,chopy1-10,7,33);
    strokeCap(ROUND);
    stroke(220,70,60);
    strokeWeight(6)
    line(chopx,chopy1,chopx+120,chopy1)
    line(chopx,chopy2,chopx+120,chopy2)
    stroke(20);
    line(chopx+90,chopy1,chopx+120,chopy1)
    line(chopx+90,chopy2,chopx+120,chopy2)
    stroke(190,190,20);
    strokeCap(SQUARE);
    line(chopx+85,chopy1,chopx+90,chopy1)
    line(chopx+85,chopy2,chopx+90,chopy2)
}


function makeDisk(diskx){ //object of the disk 

    var disk = {x: diskx, 
                disky: 200,
                diskw: random(100,200),
                diskh: random(70,130),
                speed: -4.0,
                move: diskMove, 
                display:displayDisk,
                color: random(190,230),
                food: random([roll,fish,sushi])
    }

     return disk; 
}





   


    







Leave a Reply