Which arguments does p5.Color require

chrisgoc

I declared some variables outside of setup() and draw() like this:

 var BG = p5.Color(40, 40, 40)

It works but I get a console error: Uncaught TypeError: Cannot read property '_colorMode' of undefined(…)p5.Color @ p5.js:9277(anonymous function) @ VM15860:2InjectedScript._evaluateOn @ (program):878InjectedScript._evaluateAndWrap @ (program):811InjectedScript.evaluate @ (program):667

So I looked at p5.js:9277 and it checks for colorModes

p5.Color = function(pInst, vals) {

  // Record color mode and maxes at time of construction.
  this.mode = pInst._renderer._colorMode;
  this.maxes = pInst._renderer._colorMaxes;

  // Calculate normalized RGBA values.
  if (this.mode !== constants.RGB &&
      this.mode !== constants.HSL &&
      this.mode !== constants.HSB) {
  throw new Error(this.mode + ' is an invalid colorMode.');

I then looked at my object:

  p5.Color {mode: "rgb", maxes: Object, _array: Array[4], levels: Array[4]}_array: Array[4]levels: Array[4]maxes: Objectmode: "rgb"__proto__: Object

So I can see from console.log(BG) the property mode: "rgb" and levels corresponds to the RGB colors e.g. [40, 40, 40, 1] However, when I define the object like this it also gives the same error:

var BG = p5.Color({
mode: "rgb",
levels: [40, 40, 40, 1]
})

What arguments are required to construct p5.Color object?

GoToLoop

p5.Color class isn't supposed to be instantiated by ourselves.
Rather we call function color() to do that job: http://p5js.org/reference/#/p5/color

p5.Color's constructor signature is something like this;
constructor (p: p5, arr: ColorArgs) Where p is of type p5 and arr is an array.
More specifically, an array following this model for its indexed elements:

interface ColorArgs extends Array<color | gray | alpha | string> {
  0: color | gray | string, 1?: color | alpha, 2?: color, 3?: alpha
  [idx: number]: color | gray | alpha | string
}

chrisgoc

@GoToLoop can you elaborate on your answer? I'm not understanding why p5.Color should not be instantiated. I have instantiated these objects outside of the scope of the sketch and am able to change their properties in the console. I intend to change their properties using jQuery mobile widgets which is why I did not create them in the scope of the sketch. As far as the interface, since Javascript does not have interface is that a pattern you are referring to? I don't know how many p5 developers check these boards but since I can construct p5.Color objects it seems like someone should be able to give me the parameters.

GoToLoop

I'm not understanding why p5.Color should not be instantiated.

It's just class p5.Color is undocumented. I was able to find its hidden reference. But it's quite old and doesn't match its current implementation: http://p5js.org/reference/#/p5.Color

The recommended way to acquire a p5.Color object is via function color():
http://p5js.org/reference/#/p5/color

I have instantiated these objects outside of the scope of the sketch and...

As mentioned, its constructor's signature is: constructor (p: p5, arr: ColorArgs).
Its very 1st parameter demands a p5 object reference. As long as you've got 1 you're fine.

As far as the interface, since JavaScript does not have interface, is that a pattern you are referring to?

It's merely a more descriptive way to interpret the 2nd parameter, which is an array.
Actually, it's pretty much color()'s parameters, but enclosed in an array:

I don't know how many p5 developers check these boards...

I believe NONE! In the beginning they used to though. 8-|
They prefer their GitHub repository to focus on bug reports and this forum for doubts.

But of course if the few of us, who aren't p5.js devs, can't provide you satisfactory answers, you should definitely go there: :P https://GitHub.com/processing/p5.js/issues

P.S.: That interface feature is from TypeScript: O:-) http://www.TypeScriptLang.org/Playground

chrisgoc

Thanks GoToLoop. I appreciate your response. I have logged an actual issue and they responded so I guess I can try asking a question that way.