Skip to content

Commit c1b2fc1

Browse files
committed
Address linter warnings
1 parent f78009a commit c1b2fc1

34 files changed

+1304
-1304
lines changed

README.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -26,7 +26,7 @@ function draw() {
2626
</td>
2727
<td>
2828

29-
<img src="./contributor_docs/images/p5-readme-sketch.png" width="200" height="200" />
29+
<img src="./contributor_docs/images/p5-readme-sketch.png" width="200" height="200" alt="p5.js sketch of overlapping circles forming tube-like shapes in black outlines on a white background." />
3030

3131
</td>
3232
</tr>

contributor_docs/ko/method.example.js

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
/**
2-
* "이것은 메소드의 인라인 문서 템플릿입니다. 이 템플릿을 사용하려면 큰 따옴표
2+
* "이것은 메소드의 인라인 문서 템플릿입니다. 이 템플릿을 사용하려면 큰 따옴표
33
* 사이의 모든 텍스트를 제거하십시오. 메소드에 대한 일부 설명은 여기에 들어갑니다.
44
* 간단한 단어로 함수가 하는 일과 그에 대한 좋은/나쁜 사용 예를 설명하십시오.
55
* 만약 비정상적인 케이스나 경고가 있다면 여기에서 설명해 주세요."
@@ -31,7 +31,7 @@
3131
* "두 번째 예시를 명확히 설명하는 줄입니다"
3232
*/
3333

34-
// "메소드에 둘 이상의 특징이 있으면, 각 특징은 다음과 같은 파라미터 설명과 함께
34+
// "메소드에 둘 이상의 특징이 있으면, 각 특징은 다음과 같은 파라미터 설명과 함께
3535
// 자체 블록에 문서화할 수 있습니다."
3636
/**
3737
* @method "메소드명"
@@ -46,11 +46,11 @@ p5.prototype.methodName = function() {
4646

4747
// 이 부분은 템플릿을 채운 예시입니다.
4848
/**
49-
* <a href="#/p5/background">background()</a> 함수는 p5.js 캔버스의 배경 색상을
50-
* 설정합니다. 이 함수는 일반적으로 draw()에서 각 프레임의 시작 부분에 디스플레이
51-
* 윈도우를 지우는 데 사용되지만, 애니메이션의 첫 번째 프레임에 배경색을 설정하거나
49+
* <a href="#/p5/background">background()</a> 함수는 p5.js 캔버스의 배경 색상을
50+
* 설정합니다. 이 함수는 일반적으로 draw()에서 각 프레임의 시작 부분에 디스플레이
51+
* 윈도우를 지우는 데 사용되지만, 애니메이션의 첫 번째 프레임에 배경색을 설정하거나
5252
* 배경을 한 번만 설정해야 할 경우 setup() 내에서 사용할 수 있습니다.
53-
*
53+
*
5454
* 배경색 기본 설정은 투명입니다.
5555
*
5656
* @method background
@@ -81,7 +81,7 @@ p5.prototype.methodName = function() {
8181
/**
8282
* @method background
8383
* @param {String} 문자열 형태의 색상 설정에 사용할 수 있는 형식:
84-
정수, rgb(), rgba(), rgb() 비율, rgba() 비율,
84+
정수, rgb(), rgba(), rgb() 비율, rgba() 비율,
8585
3자리 16진법, 6자리 16진법,
8686
* @param {Number} [a]
8787
* @chainable

contributor_docs/project_wrapups/akshaypadte_gsoc_2020.md

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -19,14 +19,14 @@ I had been a p5 user for more than a year and had come to love it and rely on it
1919
#### Part 1: Addressing known problems with the FES
2020

2121
I kicked off the summer by addressing the issue of speed and size. The FES has a component called `validateParameters()`, responsible for checking if the arguments passed by the user are correct. It does this by matching the arguments against a file auto-generated from the inline docs. Earlier, this file was imported directly into the main library for the FES to use, but it also has a lot of information that is not needed by the FES which increases size unnecessarily. Pre-processing this file to keep only what was needed helped reduce the size of the final built p5.js library by around 25%.
22-
![](https://akshay-fes-gsoc.surge.sh/image1.png)
22+
![Graphical representation of bundle size reduced from 4.7 to 3.6 MB](https://akshay-fes-gsoc.surge.sh/image1.png)
2323

2424
Another issue was speed. validateParameters does a lot extra work before the actual function is executed. Sometimes, as seen in [this](https://github.com/processing/p5.js-website/tree/main/src/assets/learn/performance/code/friendly-error-system/) performance test, it would slow down a function by up to 10 times. My initial assumption to speed it up did not work so I played around in chrome dev tools to figure out what was actually happening. I learnt that most of the time was spent just trying to figure out the nearest matching overload intended by the user, and that this entire process happened over and over again if the function was called multiple times with the same arguments. I addressed this with a trie like data structure <sup>[[1]](https://github.com/processing/p5.js/blob/8226395d40a9df0113b13e42c983ae578b3856fa/src/core/error_helpers.js#L300)</sup>, where each node represents an argument. Thus if a function is called again with the same sequence of arguments, we don't need to run the entirety of validateParameters. This not only improved the speed but also prevented the FES from flooding the console on repetitive calls of the same function.
2525

2626
There was another issue which caused validateParameters to ignore the last undefined argument passed to function. This sometimes used to cause confusing and inaccurate messages. Fixing this was pretty easy and only involved one line of change.
2727

2828
Moving on. There was an issue that if one p5 function called another p5 function, validateParameters would run both times. For example, the function saveJSON() needs to call saveStrings() to do part of its work. It forwards the arguments it receives to saveStrings(). This meant that if arguments were wrong when calling saveJSON(), we used to get two messages: one for saveJSON() and one for saveStrings(). But the user never called the latter in their code! This could lead to confusion.
29-
![](https://akshay-fes-gsoc.surge.sh/image2.png)
29+
![Illustration of two FES messages, only one of which should be shown.](https://akshay-fes-gsoc.surge.sh/image2.png)
3030
To fix this, one can take a look at the stack trace. We need to answer "was the most recent p5 function invoked from another p5 function?" If so, we don't need to display a message even if the arguments are wrong. I used another library [stacktrace.js](https://www.stacktracejs.com/), to help with this. Analyzing stack traces was extensively employed later-on in the project as well. We'll come back to it later.
3131

3232
As a next step, internationationalization support was added for validateParameters messages and the language of some of the messages was simplified <sup>[[2]](https://github.com/processing/p5.js/pull/4629)</sup>. There were a couple of other small problems that were also fixed in this phase. You can see them in the full list of pull requests.

contributor_docs/project_wrapups/slominski_gsoc_2022.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -47,6 +47,6 @@ The tutorials can be found on the p5.js websites Learn section here (to be added
4747

4848
And the code and commits for these contributions can be found at (to be added):
4949

50-
##Acknowledgements
50+
## Acknowledgements
5151

5252
I want to express my gratitude towards my mentor Kate Hollenbach for her guidance throughout this project, as well as towards the p5.js community for its openness and helpfulness.

src/color/p5.Color.js

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -37,7 +37,7 @@ const map = (n, start1, stop1, start2, stop2, clamp) => {
3737
result = Math.min(result, Math.max(start2, stop2));
3838
}
3939
return result;
40-
}
40+
};
4141

4242
const serializationMap = {};
4343

@@ -547,11 +547,11 @@ class Color {
547547
let coords = structuredClone(to(this._color, 'srgb').coords);
548548
coords.push(this._color.alpha);
549549

550-
const rangeMaxes = maxes.map((v) => {
550+
const rangeMaxes = maxes.map(v => {
551551
if(!Array.isArray(v)){
552552
return [0, v];
553553
}else{
554-
return v
554+
return v;
555555
}
556556
});
557557

src/core/friendly_errors/sketch_verifier.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -24,7 +24,7 @@ const ignoreFunction = [
2424
'keyPressed',
2525
'keyReleased',
2626
'keyTyped',
27-
'windowResized',
27+
'windowResized'
2828
// 'name',
2929
// 'parent',
3030
// 'toString',

src/core/internationalization.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -148,7 +148,7 @@ export const initialize = () => {
148148
},
149149
backend: {
150150
fallback: 'en',
151-
151+
152152
// ensure that the FES internationalization strings are loaded
153153
// from the latest patch of the current minor version of p5.js
154154
loadPath: `https://cdn.jsdelivr.net/npm/p5@${

src/image/filterRenderer2D.js

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -257,9 +257,9 @@ class FilterRenderer2D {
257257

258258

259259
const identityMatrix = [1, 0, 0, 0,
260-
0, 1, 0, 0,
261-
0, 0, 1, 0,
262-
0, 0, 0, 1];
260+
0, 1, 0, 0,
261+
0, 0, 1, 0,
262+
0, 0, 0, 1];
263263
this._shader.setUniform('uModelViewMatrix', identityMatrix);
264264
this._shader.setUniform('uProjectionMatrix', identityMatrix);
265265

src/image/loading_displaying.js

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -273,7 +273,7 @@ function loadingDisplaying(p5, fn){
273273
const silent = (options && options.silent) || false;
274274
const notificationDuration = (options && options.notificationDuration) || 0;
275275
const notificationID = (options && options.notificationID) || 'progressBar';
276-
const resetAnimation = (options && options.reset !== undefined) ? options.reset : true;
276+
const resetAnimation = (options && options.reset !== undefined) ? options.reset : true;
277277
// if arguments in the options object are not correct, cancel operation
278278
if (typeof delay !== 'number') {
279279
throw TypeError('Delay parameter must be a number');
@@ -328,7 +328,7 @@ function loadingDisplaying(p5, fn){
328328
// initialize variables for the frames processing
329329
let frameIterator;
330330
let totalNumberOfFrames;
331-
331+
332332
if (resetAnimation) {
333333
frameIterator = nFramesDelay;
334334
this.frameCount = frameIterator;
@@ -379,7 +379,7 @@ function loadingDisplaying(p5, fn){
379379
//
380380
// Waiting on this empty promise means we'll continue as soon as setup
381381
// finishes without waiting for another frame.
382-
await new Promise(requestAnimationFrame)
382+
await new Promise(requestAnimationFrame);
383383

384384
while (frameIterator < totalNumberOfFrames) {
385385
/*

src/shape/curves.js

Lines changed: 19 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -517,22 +517,22 @@ function curves(p5, fn){
517517
* function setup() {
518518
* createCanvas(200, 200);
519519
* background(245);
520-
*
520+
*
521521
* // Ensure the curve includes both end spans p0->p1 and p2->p3
522522
* splineProperty('ends', INCLUDE);
523-
*
523+
*
524524
* // Control / anchor points
525525
* const p0 = createVector(30, 160);
526526
* const p1 = createVector(60, 40);
527527
* const p2 = createVector(140, 40);
528528
* const p3 = createVector(170, 160);
529-
*
529+
*
530530
* // Draw the spline that passes through ALL four points (INCLUDE)
531531
* noFill();
532532
* stroke(0);
533533
* strokeWeight(2);
534534
* spline(p0.x, p0.y, p1.x, p1.y, p2.x, p2.y, p3.x, p3.y);
535-
*
535+
*
536536
* // Draw markers + labels
537537
* fill(255);
538538
* stroke(0);
@@ -541,19 +541,19 @@ function curves(p5, fn){
541541
* circle(p1.x, p1.y, r);
542542
* circle(p2.x, p2.y, r);
543543
* circle(p3.x, p3.y, r);
544-
*
544+
*
545545
* noStroke();
546546
* fill(0);
547547
* text('p0', p0.x - 14, p0.y + 14);
548548
* text('p1', p1.x - 14, p1.y - 8);
549549
* text('p2', p2.x + 4, p2.y - 8);
550550
* text('p3', p3.x + 4, p3.y + 14);
551-
*
551+
*
552552
* describe('A black Catmull-Rom spline passes through p0, p1, p2, p3 with endpoints included.');
553553
* }
554554
* </code>
555555
* </div>
556-
*
556+
*
557557
* <div>
558558
* <code>
559559
* function setup() {
@@ -848,45 +848,45 @@ function curves(p5, fn){
848848
* }
849849
* </code>
850850
* </div>
851-
*
851+
*
852852
* <div>
853853
* <code>
854854
* let p0, p1, p2, p3;
855-
*
855+
*
856856
* function setup() {
857857
* createCanvas(200, 200);
858858
* splineProperty('ends', INCLUDE); // make endpoints part of the curve
859-
*
859+
*
860860
* // Four points forming a gentle arch
861861
* p0 = createVector(30, 160);
862862
* p1 = createVector(60, 50);
863863
* p2 = createVector(140, 50);
864864
* p3 = createVector(170, 160);
865-
*
865+
*
866866
* describe('Black spline through p0–p3. A red dot marks the location at parameter t on p1->p2 using splinePoint.');
867867
* }
868-
*
868+
*
869869
* function draw() {
870870
* background(245);
871-
*
871+
*
872872
* // Draw the spline for context
873873
* noFill();
874874
* stroke(0);
875875
* strokeWeight(2);
876876
* spline(p0.x, p0.y, p1.x, p1.y, p2.x, p2.y, p3.x, p3.y);
877-
*
877+
*
878878
* // Map mouse X to t in [0, 1] (span p1->p2)
879879
* let t = constrain(map(mouseX, 0, width, 0, 1), 0, 1);
880-
*
880+
*
881881
* // Evaluate the curve point by axis (splinePoint works one axis at a time)
882882
* let x = splinePoint(p0.x, p1.x, p2.x, p3.x, t);
883883
* let y = splinePoint(p0.y, p1.y, p2.y, p3.y, t);
884-
*
884+
*
885885
* // Marker at the evaluated position
886886
* noStroke();
887887
* fill('red');
888888
* circle(x, y, 8);
889-
*
889+
*
890890
* // Draw control/anchor points
891891
* stroke(0);
892892
* strokeWeight(1);
@@ -896,7 +896,7 @@ function curves(p5, fn){
896896
* circle(p1.x, p1.y, r);
897897
* circle(p2.x, p2.y, r);
898898
* circle(p3.x, p3.y, r);
899-
*
899+
*
900900
* // Labels + UI hint
901901
* noStroke();
902902
* fill(20);
@@ -909,7 +909,7 @@ function curves(p5, fn){
909909
* }
910910
* </code>
911911
* </div>
912-
*
912+
*
913913
*/
914914

915915
fn.splinePoint = function(a, b, c, d, t) {

0 commit comments

Comments
 (0)