From f9074de87dcc8b2c71bfd24ee9c13920ae31b7d7 Mon Sep 17 00:00:00 2001 From: gauthiier Date: Wed, 18 Jan 2023 16:18:38 +0100 Subject: [PATCH] exercises --- collection/sketch-1.1.js | 20 ++++++ collection/sketch-1.2.js | 28 ++++++++ collection/sketch-1.3.js | 47 +++++++++++++ collection/sketch-2.0.js | 21 ++++++ collection/sketch-2.1.js | 25 +++++++ collection/sketch-2.2.js | 28 ++++++++ collection/sketch-3.0.js | 24 +++++++ collection/sketch-3.1.js | 25 +++++++ collection/sketch-3.2.js | 24 +++++++ collection/sketch-3.3.js | 31 +++++++++ collection/sketch-LoveLetter.js | 113 ++++++++++++++++++++++++++++++++ 11 files changed, 386 insertions(+) create mode 100644 collection/sketch-1.1.js create mode 100644 collection/sketch-1.2.js create mode 100644 collection/sketch-1.3.js create mode 100644 collection/sketch-2.0.js create mode 100644 collection/sketch-2.1.js create mode 100644 collection/sketch-2.2.js create mode 100644 collection/sketch-3.0.js create mode 100644 collection/sketch-3.1.js create mode 100644 collection/sketch-3.2.js create mode 100644 collection/sketch-3.3.js create mode 100644 collection/sketch-LoveLetter.js diff --git a/collection/sketch-1.1.js b/collection/sketch-1.1.js new file mode 100644 index 0000000..28cb04c --- /dev/null +++ b/collection/sketch-1.1.js @@ -0,0 +1,20 @@ +// Sketch 1.1: Mouse Events! + +function setup() { + createCanvas(800, 800); +} + +function draw() { + // background("yellow"); + if(mouseIsPressed) { + print("Pressed: " + mouseX + " - " + mouseY) ; // see the console below ↓ + background("yellow"); // 2 + } +} + +function mouseMoved() { + print("Moved: " + mouseX + " - " + mouseY) ; // see the console below ↓ + circle(mouseX, mouseY, 10); +} + +// Reference: https://p5js.org/reference/ \ No newline at end of file diff --git a/collection/sketch-1.2.js b/collection/sketch-1.2.js new file mode 100644 index 0000000..8fe3b3e --- /dev/null +++ b/collection/sketch-1.2.js @@ -0,0 +1,28 @@ +// Sketch 1.2: Variables! + +var previous_mouseX_pressed = 0; // global "var" variable +var previous_mouseY_pressed = 0; // global "var" variable + +function setup() { + createCanvas(400, 400); +} + +function draw() { + // background(220); + if(mouseIsPressed) { + let current_mouseX_pressed = mouseX; // local "let" variable valid within "{" brackets "}" + let current_mouseY_pressed = mouseY; // local "let" variable valid within "{" brackets "}" + + print("Pressed: " + current_mouseX_pressed + " - " + current_mouseY_pressed) ; + + previous_mouseX_pressed = current_mouseX_pressed; + previous_mouseY_pressed = current_mouseY_pressed; + } +} + +// this is a special p5 function +function mouseMoved() { + print("Moved: " + mouseX + " - " + mouseY) ; // see the console below ↓ +} + +// Reference: https://p5js.org/reference/ \ No newline at end of file diff --git a/collection/sketch-1.3.js b/collection/sketch-1.3.js new file mode 100644 index 0000000..7bc9c8e --- /dev/null +++ b/collection/sketch-1.3.js @@ -0,0 +1,47 @@ +// Sketch 1.3: Distance and Text! + +var previous_mouseX_pressed = 0; +var previous_mouseY_pressed = 0; +var distance_previous_current = 0; + +function setup() { + createCanvas(800, 800); +} + +function draw() { + background("yellow"); + + distance_previous_current = dist(previous_mouseX_pressed, previous_mouseY_pressed, mouseX, mouseY); + + circle(previous_mouseX_pressed, previous_mouseY_pressed, 5); + line(previous_mouseX_pressed, previous_mouseY_pressed, mouseX, mouseY); + circle(mouseX, mouseY, 5); + + // text(distance_previous_current, mouseX, mouseY); + + if(distance_previous_current < 200) { + text("🍕", mouseX, mouseY); + text("PIZZA", previous_mouseX_pressed, previous_mouseY_pressed); + } else if (distance_previous_current < 350) { + text("🍍", mouseX, mouseY); + text("ANANAS", previous_mouseX_pressed, previous_mouseY_pressed); + } else { + text("😵‍💫", mouseX, mouseY); + text("WOOOOO", previous_mouseX_pressed, previous_mouseY_pressed); + } + + + + if(mouseIsPressed) { + let current_mouseX_pressed = mouseX; + let current_mouseY_pressed = mouseY; + + print("Pressed: " + current_mouseX_pressed + " - " + current_mouseY_pressed) ; + + previous_mouseX_pressed = current_mouseX_pressed; + previous_mouseY_pressed = current_mouseY_pressed; + } +} + + +// Reference: https://p5js.org/reference/ \ No newline at end of file diff --git a/collection/sketch-2.0.js b/collection/sketch-2.0.js new file mode 100644 index 0000000..bf81eeb --- /dev/null +++ b/collection/sketch-2.0.js @@ -0,0 +1,21 @@ +// Sketch 2.0: Array + Index! + +var NAMES = ["David", "Karin", "Sigrid", "Nanna", "Laura", "Maaike"]; +var INDEX = 0; + +function setup() { + createCanvas(400, 400); +} + +function draw() { + background(220); +} + +function keyTyped() { + if(key == 'x') { + print("Hi " + NAMES[INDEX] + "!"); + INDEX++; + } +} + +// Reference: https://p5js.org/reference/ \ No newline at end of file diff --git a/collection/sketch-2.1.js b/collection/sketch-2.1.js new file mode 100644 index 0000000..518907b --- /dev/null +++ b/collection/sketch-2.1.js @@ -0,0 +1,25 @@ +// Sketch 2.1: Array + Index + Loop! + +var NAMES = ["David", "Karin", "Sigrid", "Nanna", "Laura", "Maaike"]; +var ACTIVITIES = ["piano", "tennis", "chess", "records"]; +var INDEX = 0; + +function setup() { + createCanvas(400, 400); +} + +function draw() { + background(220); +} + +function keyTyped() { + if(key == 'x') { + for(let j = 0; j < NAMES.length; j++) { + for(let i = 0; i < ACTIVITIES.length; i++) { + print(NAMES[j] + " likes to play " + ACTIVITIES[i]); + } + } + } +} + +// Reference: https://p5js.org/reference/ \ No newline at end of file diff --git a/collection/sketch-2.2.js b/collection/sketch-2.2.js new file mode 100644 index 0000000..36b9b63 --- /dev/null +++ b/collection/sketch-2.2.js @@ -0,0 +1,28 @@ +// Sketch 2.2: Array + Index + Randomness! + +var NAMES = ["David", "Karin", "Sigrid", "Nanna", "Laura", "Maaike"]; +var ACTIVITIES = ["piano", "tennis", "chess", "records"]; +var ADJ = ["blue", "yellow", "black", "orange", "fabulous", "expensive", "ridiculous"]; +var CLOTHES = ["jacket", "sweater", "cap", "scarf"]; + +function setup() { + createCanvas(400, 400); +} + +function draw() { + background(220); +} + +// function selecting a random element from an array +function choice(array_to_choose_from) { + let random_index = floor(random(array_to_choose_from.length)); + return array_to_choose_from[random_index]; +} + +function keyTyped() { + if(key == 'x') { + print(choice(NAMES) + " wears a " + choice(ADJ) + " " + choice(CLOTHES) + " when " + choice(NAMES) + " plays " + choice(ACTIVITIES)); + } +} + +// Reference: https://p5js.org/reference/ \ No newline at end of file diff --git a/collection/sketch-3.0.js b/collection/sketch-3.0.js new file mode 100644 index 0000000..9b22ca0 --- /dev/null +++ b/collection/sketch-3.0.js @@ -0,0 +1,24 @@ +// Sketch 3.0: Drawing Text! + +const sentence = "YOU ARE MY AMOROUS ENCHANTMENT.: MY KEEN EAGERNESS. YOU ARE MY DEVOTED ENCHANTMENT. MY YEARNING FERVENTLY LIKES YOUR AMOROUS PASSION. MY EAGERNESS TENDERLY YEARNS FOR YOUR PASSION." + +function setup() { + createCanvas(800, 800); +} + +function draw() { + // backgroud colour (click on swatch) + background("rgb(101,240,101)"); + // font + textFont('Courier'); + // font stroke colour + stroke(0, 0, 255); + // font fill colour + fill(255, 140, 0); + // text size + textSize(30); + // aligment + textAlign(CENTER, TOP); + // creates a 800 by 800 text box + text(sentence, 0, 10 , 800, 800); +} diff --git a/collection/sketch-3.1.js b/collection/sketch-3.1.js new file mode 100644 index 0000000..d42ee84 --- /dev/null +++ b/collection/sketch-3.1.js @@ -0,0 +1,25 @@ +// Sketch 3.1: Colour animation! + +const sentence = "I DON'T LIKE PIZZA\n(I just don't)"; + +function setup() { + createCanvas(800, 800); +} + +function draw() { + + background("yellow"); + textSize(45); + textAlign(CENTER, TOP); + noStroke(); + + let osc = 128 + sin(frameCount * 0.1) * 127; + // print(variation); + + let R = osc; + let G = 255 - osc; + let B = osc; + + fill(R, G, B); + text(sentence, 800/2, 800/2); +} \ No newline at end of file diff --git a/collection/sketch-3.2.js b/collection/sketch-3.2.js new file mode 100644 index 0000000..c38a3b6 --- /dev/null +++ b/collection/sketch-3.2.js @@ -0,0 +1,24 @@ +// Sketch 3.2: Capture mouse pressed and record locations! + +var circles = []; + +function setup() { + createCanvas(800, 800); +} + +function draw() { + background("yellow"); + + if(mouseIsPressed) { + let v = createVector(mouseX, mouseY); + circles.push(v); + } + + for(let i = 0; i < circles.length; i++) { + let c = circles[i]; + let x = c.x + cos(frameCount * 0.1) * random(3); + let y = c.y + sin(frameCount * 0.1) * random(3); + circle(x, y, 10); + } + +} \ No newline at end of file diff --git a/collection/sketch-3.3.js b/collection/sketch-3.3.js new file mode 100644 index 0000000..c23c394 --- /dev/null +++ b/collection/sketch-3.3.js @@ -0,0 +1,31 @@ +// Sketch 3.3: Image! + +var alan_image; +var img_x, img_y; + +function preload() { + alan_image = loadImage("alan-turing.png") +} + +function setup() { + createCanvas(800, 800); + img_x = 400 - alan_image.width/2; + img_y = 400 - alan_image.height/2; + colorMode(RGB, 255, 255, 255, 255); +} + +function draw() { + background("yellow"); + image(alan_image, img_x, img_y); + let R = 255; + let G = 100; + let B = mouseY / 800.0 * 255; + let A = mouseX / 800.0 * 255; + tint(R, G, B, A); +} + +function keyTyped() { + if(key == 's') { + saveCanvas("yeah", "png"); + } +} diff --git a/collection/sketch-LoveLetter.js b/collection/sketch-LoveLetter.js new file mode 100644 index 0000000..b535008 --- /dev/null +++ b/collection/sketch-LoveLetter.js @@ -0,0 +1,113 @@ +// Strachey's Love Letter generator! + +// vocabulary +const first = ['DARLING', 'DEAR', 'HONEY', 'JEWEL']; +const second = ['DUCK', 'LOVE', 'MOPPET', 'SWEETHEART']; +const adjectives = ['ADORABLE', 'AFFECTIONATE', 'AMOROUS', 'ANXIOUS', 'ARDENT', 'AVID', 'BREATHLESS', 'BURNING', 'COVETOUS', 'CRAVING', 'CURIOUS', 'DARLING', 'DEAR', 'DEVOTED', 'EAGER', 'EROTIC', 'FERVENT', 'FOND', 'IMPATIENT', 'KEEN', 'LITTLE', 'LOVEABLE', 'LOVESICK', 'LOVING', 'PASSIONATE', 'PRECIOUS', 'SWEET', 'SYMPATHETIC', 'TENDER', 'UNSATISFIED', 'WISTFUL']; +const nouns = ['ADORATION', 'AFFECTION', 'AMBITION', 'APPETITE', 'ARDOUR', 'CHARM', 'DESIRE', 'DEVOTION', 'EAGERNESS', 'ENCHANTMENT', 'ENTHUSIASM', 'FANCY', 'FELLOW FEELING', 'FERVOUR', 'FONDNESS', 'HEART', 'HUNGER', 'INFATUATION', 'LIKING', 'LONGING', 'LOVE', 'LUST', 'PASSION', 'RAPTURE', 'SYMPATHY', 'TENDERNESS', 'THIRST', 'WISH', 'YEARNING']; +const adverbs = ['AFFECTIONATELY', 'ANXIOUSLY', 'ARDENTLY', 'AVIDLY', 'BEAUTIFULLY', 'BREATHLESSLY', 'BURNINGLY', 'COVETOUSLY', 'CURIOUSLY', 'DEVOTEDLY', 'EAGERLY', 'FERVENTLY', 'FONDLY', 'IMPATIENTLY', 'KEENLY', 'LOVINGLY', 'PASSIONATELY', 'SEDUCTIVELY', 'TENDERLY', 'WINNINGLY', 'WISTFULLY']; +const verbs = ['KICKS', 'ADORES', 'ATTRACTS', 'CARES FOR', 'CHERISHES', 'CLINGS TO', 'DESIRES','HOLDS DEAR', 'HOPES FOR', 'HUNGERS FOR', 'IS WEDDED TO', 'LIKES', 'LONGS FOR', 'LOVES', 'LUSTS AFTER', 'PANTS FOR', 'PINES FOR', 'PRIZES', 'SIGHS FOR', 'TEMPTS', 'THIRSTS FOR', 'TREASURES', 'WANTS', 'WISHES', 'WOOS', 'YEARNS FOR']; + + +function setup() { + createCanvas(400, 400); +} + +function draw() { + background(220); +} + +// function selecting a random element from an array +function choice(array_to_choose_from) { + let random_index = floor(random(array_to_choose_from.length)); + return array_to_choose_from[random_index]; +} + +// function that randomly decides if an element from an array should be selected or not +function maybe(array_to_choose_from) { + // choose between true or false + if(choice([true, false])) { + // if true then return an element from the array + return choice(array_to_choose_from); + } else { + // otherwise return and empty sentence (i.e. nothing) + return ""; + } +} + +// function that randomly generates a long form sentence +function long() { + return "MY " + maybe(adjectives) + " " + choice(nouns) + " " + maybe(adverbs) + " " + choice(verbs) + " YOUR " + maybe(adjectives) + " " + choice(nouns) + "."; +} + +// function that randomly generates a short form sentence +function short() { + return choice(adjectives) + ' ' + choice(nouns) + '. '; +} + +// function that randomly an opening +function opening() { + return choice(first) + ' ' + choice(second); +} + +// function that randomly a closing +function closing() { + return "YOURS " + choice(adverbs); +} + +function write_letter(){ + var text = ""; + + // write opening + text += opening(); + text += "\n"; // this is a new line! + + let YOU_ARE = false; + // write 5 sentences + for(let i = 0; i < 5; i++) { + + // choose if the next sentence is a short or long + let sentence_form = choice(['short', 'long']); + + if(sentence_form == 'short') { + // there's two types of short to switch from + if(YOU_ARE) { + // the ": MY" can only follow a "YOU ARE MY" + text += ": MY " + short(); + YOU_ARE = false; + } else { + text += "YOUR ARE MY " + short(); + // the ": MY" can only follow a "YOU ARE MY" + YOU_ARE = true; + } + } else if(sentence_form == 'long') { + text += long(); + // make sure the next sentence is not ": MY" + YOU_ARE = false; + } + } + + text += "\n"; // this is a new line! + + // write closing + text += " " + closing(); + + text += "\n"; // this is a new line! + + // sign + text += "MUC"; + + // return the letter + return text; +} + + + +function keyTyped() { + if(key == 'x') { + let letter = write_letter(); + print(letter); + } +} + +// Reference: https://p5js.org/reference/ \ No newline at end of file