I have decided to try my luck with p5js. They showed a very straightforward to contributing to the community. Different pages help you guide through the website and the different elements you can contribute to. The different ways of contributing are :
- Creating an example for a specific example
- If you find a mistake somewhere you could raise an issue and correct it
- You can help with the translation of the project
- You can even make detailed tutorials and submitted
Compare to the other project I was working on, it was much easier to contribute as a beginner contributor. The community is based on learning as so, any skills you can have helps to contribute.
Once I decided I would contribute to P5js, I searched where I could add something useful. I found in the examples category a lack of examples for trigonometry (which is one of my interests). I created a simple sketch using trigonometry, mixing cos, sin and tan, to create beautiful shapes.
Here is the code I submitted:
/*
* @name Trigonometry and Particles
* @arialabel multiple white dot moving in pattern following trigonometry function
* @description Creative particle movement using cos(), sin() and tan(). You can sort
* through the different functions.
*/
let f = 0;
let value = 0;
let clicked = 0;
let x = 0;
let y = 0;
function Super_Tornado() {
ratio = frameCount * 0.01;
points = [];
fill(255);
for (let i = 0; i <= 360; i += 0.1) {
let theta = radians(i * ratio);
if (value == 0) {
x = cos(theta) * i;
y = sin(theta) * i;
}
if (value == 1) {
x = cos(1 / theta) * i * tan(i);
y = sin(1 / theta) * i * tan(i);
}
if (value == 2) {
x = cos(theta) * log(i) * tan(i);
y = sin(1 / theta) * log(i) * tan(i);
}
if (value == 3) {
x = cos(theta) * i * tan(i);
y = sin(log(theta)) * i / tan(i);
}
if (value == 4) {
x = cos(theta) * i / 3 * sin(theta) * tan(f + 1);
y = sin(1 / theta) * i / 3 * log(i) * tan(i);
}
ellipse(x, y, 3, 3);
points.push({
'x': x,
'y': y
})
}
}
function setup() {
createCanvas(400, 400);
noStroke();
}
function draw() {
background(30);
translate(width / 2, height / 2);
ratio = frameCount * 0.01;
points = [];
Super_Tornado();
}
function mouseClicked() {
if (clicked < 5) {
clicked++;
value++;
} else {
clicked = 0;
value = 0;
}
}
The process is rather simple. You first raise an issue indicating you are going to create an example. After you have written an example you have to indicate on the top of the page the name and the description of the sketch. After verifying that everything works using a local server you create a pull request on the p5js-website board.
My pull request is called Trigonometry example and was submitted on 05/06/2022.
