function setup()
{
	createCanvas(800, 800);

}

function draw()
{
    background(0);
    fill(255, 0, 255);
    noStroke();
    
    for(var j = 0; j < 20; j ++) // rows
    {
        for(var i = 0; i < 20; i ++) // columns
        {
            ellipse(50 + i * 30,
                   50 + j * 30,
                   i + j,
                   i + j);
        }
    }
    // i is the columns value, so using it as the width and height size it becomes smaller to bigger from left to right ( 0-19 size)
    // j is the rows value, so using it as the width and height size it becomes smaller to bigger from top to bottom ( 0-19 size)

}

var maxDist;

function setup()
{
	createCanvas(800, 800);
    maxDist = dist(0, 0, width/2, height/2); //0, 0 is the farthest corner, and width/2 and height/2 is the center of the canvas
}

function draw()
{
    background(0);
    fill(255, 0, 255);
    noStroke();
    
    for(var j = 0; j < 20; j ++) // rows
    {
        for(var i = 0; i < 20; i ++) // columns
        {
            if(i%2 == 0)//it divides the number on the left by the number on the right, and sees if the remainder is 0 or something else. If it's even number, if I divide it by two, will then there will be no remainder, so that means it's an even column, otherwise there will be a remainder, so the value will be higher and therefore, it's an odd column
            {
                fill(255);
            }
            else
            {
                fill(255, 0, 255);
            }
            var d = dist(mouseX, mouseY, 50 + i * 30, 50 + j * 30/*this value is the center of each ellipse*/);//distance of each ellipse from the center
            var r = d/maxDist; // goes to the center of the canvas
            //consider the longest distance and scale my radius by it, longest distance is from the center to any of the corner
//            var r = i + j * 2; // added this variable instead of repeating the equation - i + j * 2
            ellipse(50 + i * 30,
                   50 + j * 30,
                   r * 30,
                   r * 30);
        }
    }
    // i is the columns value, so using it as the width and height size it becomes smaller to bigger from left to right ( 0-19 size)
    // j is the rows value, so using it as the width and height size it becomes smaller to bigger from top to bottom ( 0-19 size)

}

    wordCloud.push("first", "second"); // I can put everything in one command
    wordCloud.push("third"); // I can also separate them

var wordCloud;
var wordsX;
var wordsY;
var currentWord;

function setup()
{
    createCanvas(500,500);
    wordCloud = [];
    wordsX = [];
    wordsY = [];
    
//    wordCloud.push("first", "second");
//    wordCloud.push("third", "fourth");
    
    currentWord = "";
}

function draw()
{

    background(0);
    fill(255);
    
    text("Add to the word cloud: " + currentWord, 20,20);
    
//    for(var i = 0; i < wordCloud.length; i++)
//    {
//        text(wordCloud[i], wordPositionsX[i], wordPositionsY[i]); 
//        wordPositionsX[i] += random(-1,1);
//        wordPositionsY[i] += random(-1,1);
//    }
    for(var i = 0; i < wordCloud.length; i++)//wordCloud.length adjusts to whatever the number of the items in the wordCloud array
    {
        text(wordCloud[i], wordsX[i], wordsY[i]); 
        wordsX[i] += random(-1, 1); // makes the item from the array to float in between -1 to 1 in the x position
        wordsY[i] += random(-1, 1); // makes the item from the array to float in between -1 to 1 in the y position
    }
    
}

function keyPressed()
{
    console.log(keyCode,key); //DELETE = 8, RETURN = 13
    
//    currentWord += key;//whatever the user types in is "key"
    
    if(keyCode == 13)//13 is the keycode of "Return" or "Enter"
    {
        wordCloud.push(currentWord);//enters whatever the user types in
        currentWord = "";//after entering, resets the value back to empty 
        wordsX.push(random(width/4, width * 3/4)); // the value of X is being added to the array
        wordsY.push(random(height/4, height * 3/4));
    }
    else
    {
        currentWord += key; //if not "Return" or "Enter" is pressed, carry on typing the letters the user enters // currentWord is equals to every character the user types in, till enter or return is pressed
    }
    
//    if(keyCode == 8)
//    {
//        currentWord = currentWord.substr(0,currentWord.length -1);
//    }
//    else if(keyCode == 13)
//    {
//        wordCloud.push(currentWord);
//        wordPositionsX.push(random(width/4, width *3/4));
//        wordPositionsY.push(random(height/4, height *3/4));
//        currentWord = "";
//    }
//    else
//    {
//        currentWord += key;
//    }  
}

    var roseArray = [0];
    
    for(var i = 0; i < 100; i ++) // 0-99 times this loop happens, or equal to 100 times of the value of 1 added to the array, with an existing 0 item in the array, makes it 101 total items
    {
        roseArray.push(roseArray[0] + 1);//first value in the array + 1
        console.log(roseArray);
    }

    var a = [1, 2, 3];
    
    for(var i = 0; i < 3; i ++)
    {
        a = []; // this empties the array in every loop
        a.push(i); // added 0, 1, 2
    }
    console.log(a); // returns 2 because that is the last value in the loop

var starPositionsX;
var starPositionsY;
var starDirectionsX;
var starDirectionsY;

var numStars;
var maxDist;


function setup() 
{
    createCanvas(800,800);
    
    starPositionsX = [];
    starPositionsY = [];
    starDirectionsX = [];
    starDirectionsY = [];
    numStars = 1000;
    
    for(var i = 0; i < numStars; i++)
    {
        starPositionsX.push(width/2);
        starPositionsY.push(height/2);
        starDirectionsX.push(random(-1,1));
        starDirectionsY.push(random(-1,1));
    }
    
    maxDist = dist(width/2, height/2, width, height);
}

function draw() 
{

    background(0);
    fill(255);
    noStroke();
    
    for(var i = 0; i < starPositionsX.length; i++)
    {
        var d = dist(starPositionsX[i],starPositionsY[i], width/2,height/2);
        var r = d * 20/maxDist;
        ellipse(starPositionsX[i],starPositionsY[i], r,r);
        starPositionsX[i] += starDirectionsX[i] * max(0.01, r);
        starPositionsY[i] += starDirectionsY[i] * max(0.01, r);
        
        if(d > maxDist)
        {
            starPositionsX[i] = width/2;
            starPositionsY[i] = height/2;
        }
    }

 
}