diff --git a/LICENSE b/Day-1/LICENSE similarity index 100% rename from LICENSE rename to Day-1/LICENSE diff --git a/Day-1/index.html b/Day-1/index.html new file mode 100644 index 0000000..acd1738 --- /dev/null +++ b/Day-1/index.html @@ -0,0 +1,20 @@ + + + + + + + Sketch + + + + + + + + + + Rectangles Script + Labyrinth Script + + diff --git a/jsconfig.json b/Day-1/jsconfig.json similarity index 100% rename from jsconfig.json rename to Day-1/jsconfig.json diff --git a/labyrinth.js b/Day-1/labyrinth.js similarity index 100% rename from labyrinth.js rename to Day-1/labyrinth.js diff --git a/rectangles.js b/Day-1/rectangles.js similarity index 100% rename from rectangles.js rename to Day-1/rectangles.js diff --git a/script_labyrinth.html b/Day-1/script_labyrinth.html similarity index 100% rename from script_labyrinth.html rename to Day-1/script_labyrinth.html diff --git a/script_rectangles.html b/Day-1/script_rectangles.html similarity index 100% rename from script_rectangles.html rename to Day-1/script_rectangles.html diff --git a/style.css b/Day-1/style.css similarity index 100% rename from style.css rename to Day-1/style.css diff --git a/Day-2/image.js b/Day-2/image.js new file mode 100644 index 0000000..dabd656 --- /dev/null +++ b/Day-2/image.js @@ -0,0 +1,10 @@ +let img; + +function preload() { + img = loadImage("Images/monitoring-miku.png"); +} + +function setup() { + createCanvas(720, 400); + image(img, 0, 0, 300, 300); +} \ No newline at end of file diff --git a/Day-2/pixels.js b/Day-2/pixels.js new file mode 100644 index 0000000..5b0a318 --- /dev/null +++ b/Day-2/pixels.js @@ -0,0 +1,38 @@ +let img; + +function preload() { + img = loadImage("Images/monitoring-miku.png"); +} + +function setup() { + createCanvas(600, 600); + pixelDensity(1); +} + +function draw() { + background(0); + image(img, 100, 100, 400, 400); + /* img.loadPixels(); + for (let i = 0; i < img.pixels.length; i += 4) { + let red = img.pixels[i + 0]; + let green = img.pixels[i + 1]; + let blue = img.pixels[i + 2]; + let alpha = img.pixels[i + 3]; + img.pixels[i + 0] = red; + img.pixels[i + 1] = green; + img.pixels[i + 2] = blue; + img.pixels[i + 3] = alpha; + } + img.updatePixels(); */ + img.loadPixels(); + for ( let y = 0; y < height; y++) { + for (let x = 0; x < width; x++) { + const index = (x + y * width) * 4; + img.pixels[index + 0] = mouseX; + img.pixels[index + 1] = mouseY; + img.pixels[index + 2] = y; + img.pixels[index + 3] = 100; + } + } + img.updatePixels(); +} \ No newline at end of file diff --git a/Day-2/styleSettings.js b/Day-2/styleSettings.js new file mode 100644 index 0000000..36b5d5c --- /dev/null +++ b/Day-2/styleSettings.js @@ -0,0 +1,32 @@ +function setup() { + createCanvas(100, 150); + background(0, 150, 0); + + ellipse(0, 50, 33, 33); + + push(); + translate(50, 0); + strokeWeight(10); + fill(204, 153, 0); + ellipse(0, 50, 33, 33); + pop(); + + ellipse(100, 50, 33, 33); + translate(0, 50); + + ellipse(0, 50, 33, 33); + + push(); + strokeWeight(10); + fill(204, 153, 0); + ellipse(33, 50, 33, 33); + + push(); + stroke(0, 102, 153); + ellipse(66, 50, 33, 33); + pop(); + + pop(); + + ellipse(100, 50, 33, 33); +} \ No newline at end of file diff --git a/Day-2/transformations.js b/Day-2/transformations.js new file mode 100644 index 0000000..66691a9 --- /dev/null +++ b/Day-2/transformations.js @@ -0,0 +1,13 @@ +function setup() { + createCanvas(800, 800); + background(200); + fill(150, 0, 0); + rect(0, 0, 60, 150); + + translate(200, 120); + rotate(0.5); + scale(1.5); + + fill(0, 150, 0); + rect(0, 0, 60, 150); +} \ No newline at end of file diff --git a/Images/monitoring-miku.png b/Images/monitoring-miku.png new file mode 100644 index 0000000..b1b7784 Binary files /dev/null and b/Images/monitoring-miku.png differ diff --git a/index.html b/index.html index acd1738..d8b43d3 100644 --- a/index.html +++ b/index.html @@ -14,7 +14,5 @@ - Rectangles Script - Labyrinth Script diff --git a/sketch.js b/sketch.js new file mode 100644 index 0000000..93ceef1 --- /dev/null +++ b/sketch.js @@ -0,0 +1,10 @@ +let img; + +function preload() { + img = loadImage("Images/monitoring-miku.png"); +} + +function setup() { + createCanvas(800, 800) + image(img, 0, 0, mouseX, mouseY); +}