how can i default a library?

P14082003

i just downloaded p5.collide2d.js and i wanted to know how to "change" the index.html file for default sketches to include a line to load said library.

only problem is, i don't know where the default sketch.js and index.html are. only thing i found was the template for processing's p5.js mode ( it's inside a folder called template) but it doesn't apply to p5 itself

any help is much appreciated

GoToLoop

I don't have "p5.js Mode" b/c I'm still using PDE v3.1.2. 3:-O
Instead I use online JS editors for it. :-j

Anyways, here's my "index.html" minimum template to load p5.js + p5.collide2d libraries: :ar!

<script defer src=http://cdn.JsDelivr.net/npm/p5></script>
<script defer src=http://cdn.JsDelivr.net/gh/bmoren/p5.collide2D/p5.collide2d.min.js></script>
<script defer src=sketch.js></script>

Also posted an example online for n1 to see it in action: :bz
http://CodePen.io/GoSubRoutine/pen/YpmRRR/right/?editors=101

And below's the whole "sketch.js" file: O:-)

/**
 * p5.collide2D Circle-Triangle (v1.0)
 * GoToLoop (2016-Dec-30)
 *
 * Forum.Processing.org/two/discussion/19988/how-can-i-default-a-library#Item_1
 * CodePen.io/GoSubRoutine/pen/YpmRRR/right/?editors=101
 */

"use strict";

const DIAM = 30, triPoly = Array(3);
let bg, hitColor, normalColor;

function setup() {
  createCanvas(300, 300).mouseMoved(redraw);
  noLoop();
  noCursor();
  strokeWeight(2.5).stroke(0).blendMode(REPLACE);

  triPoly[0] = createVector(width>>1,  height/3);
  triPoly[1] = createVector(2*width/3, 2*height/3);
  triPoly[2] = createVector(width/3,   2*height/3);

  bg = color('lightgray');
  hitColor = color('red'), normalColor = color('blue');
}

function draw() {
  const hit = collideCirclePoly(mouseX, mouseY, DIAM, triPoly);
  background(bg).fill(hit && hitColor || normalColor);

  const [{x: x1, y: y1}, {x: x2, y: y2}, {x: x3, y: y3}] = triPoly;
  triangle(x1, y1, x2, y2, x3, y3).ellipse(mouseX, mouseY, DIAM, DIAM);
}

P14082003

hey goto, where is that html file at though? mine is at:

C:\Users-------\Documents\Processing\modes\p5jsMode\template

and there inside template, are the sketch.js, index.html and libraries folder.

is that right?

GoToLoop

• In my model, both "index.html" & "sketch.js" files are in the same folder.
• I can run the "index.html" file via any Firefox-based browser w/o any modification.
• Or under any Chromium-based browser via a command-line argument.
• As I said, I don't have "p5.js Mode". I can't help ya out there, sorry. :(

jeremydouglass

@P14082003 -- did you find an answer to this question? If not, this would be a great question to ask the p5 developers as an issue:

• https://github.com/processing/p5.js/issues