API Docs for: 6.0.1
Show:

Color Class

Extends Base
Module: scrawlColor

Color

Instantiation

  • scrawl.makeColor()

Purpose

  • Defines a color object
  • Used with entity.strokeStyle and entity.fillStyle attributes

Access

  • scrawl.design.COLORNAME - for the Color design object

Constructor

Color

(
  • [items]
)

Parameters:

  • [items] Object optional

    Key:value Object argument for setting attributes

Methods

checkValues

() private chainable

Checks that color channel values are of the permitted form (integer vs float) and within permitted ranges

Returns:

This

clone

(
  • items
)

Inherited from Base but overwritten in source\scrawlColor.js:287

Augments Base.clone()

Parameters:

  • items Object

    Object consisting of key:value attributes

Returns:

Cloned Color object

convert

(
  • items
)
chainable

Convert a CSS color string value into native attribute values.

Converts: '#nnn', '#nnnnnn', 'rgb(n, n, n)', 'rgba(n, n, n, a), color keywords.

Does not convert hsl() or hsla() strings.

Color keywords harvested from https://developer.mozilla.org/en/docs/Web/CSS/color_value (13 Dec 2015).

Parameters:

  • items String

    CSS color String

Returns:

This

generateRandomColor

(
  • items
)
private chainable

Generates a random color

Argument can include preset color channel values (0-255, 0-1 for alpha): {r:Number, g:Number, b:Number, a:Number}

Parameters:

  • items Object

    Object consisting of key:value attributes

Returns:

This

get

(
  • item
)

Inherited from Base but overwritten in source\scrawlColor.js:266

Augments Base.get()

  • If called with no argument, will return the current color String
  • if called with the String argument 'random', will generate a random color (within permitted limits) and return that

Parameters:

  • item String

    Attribute key String

Returns:

Attribute value, or CSS color string

getData

() private

Returns current color, or next color value in sequence if .autoUpdate is true

Returns:

CSS color String

numberConvert

(
  • val
  • dim
)
private

Stamp helper function - convert string percentage values to numerical values

Parameters:

  • val String

    coordinate String

  • dim Number

    dimension value

Returns:

Number - value

parse

()

Turn the object into a JSON String

Returns:

object of object's currently set attributes

remove

()

Delete this Color object from the scrawl-canvas library

Returns:

Always true

set

(
  • items
)
chainable

Inherited from Base but overwritten in source\scrawlColor.js:368

Augments Base.set()

In addition to setting any native color object attribute, the .set() function also accepts the following keys:

  • random (boolean) - when set to true, a random color (within minimum and maximum bounds) will be generated
  • color (string) - any legitimate CSS color string (including color names as defined in the SVGTiny standard)

Parameters:

  • items Object

    Object consisting of key:value attributes

Returns:

This

setDelta

(
  • items
)
chainable

Add values to Number attributes - limited to altering r, g, b and a attributes

Parameters:

  • items Object

    Object consisting of key:value attributes

Returns:

This

toDecimal

(
  • Hexidecimal
)

Convert a hexidecimal String to its decimal Number value

Parameters:

  • Hexidecimal String

    String value

Returns:

Decimal Number

toHex

(
  • items
)

Convert a decimal Number to its hexidecimal String value

Parameters:

  • items Number

    decimal value

Returns:

Hexidecimal String

update

() chainable

Update the current color, taking into account shift and bounce attribute values

Returns:

This

Properties

a

Number

Alpha channel value: 0 - 1

Default: 1

aBounce

Boolean

Drawing flag - if true, when color updates the delta value will reverse its sign just before the channel's maximum or minimum value is breached

Default: false

aMax

Number

Alpha channel maximum permitted value: 0 - 1

Default: 1

aMin

Number

Alpha channel minimum permitted value: 0 - 1

Default: 0

aShift

Number

Alpha channel delta value

Default: 0

autoUpdate

Boolean

Requires Color object to recalculate its attribute values before each display cycle commences

Default: false

b

Number

Blue channel value: 0 - 255

Default: 0

bBounce

Boolean

Drawing flag - if true, when color updates the delta value will reverse its sign just before the channel's maximum or minimum value is breached

Default: false

bMax

Number

Blue channel maximum permitted value: 0 - 255

Default: 255

bMin

Number

Blue channel minimum permitted value: 0 - 255

Default: 0

bShift

Number

Blue channel delta value

Default: 0

comment

String

Comment, for accessibility

Default: ''

g

Number

Green channel value: 0 - 255

Default: 0

gBounce

Boolean

Drawing flag - if true, when color updates the delta value will reverse its sign just before the channel's maximum or minimum value is breached

Default: false

gMax

Number

Green channel maximum permitted value: 0 - 255

Default: 255

gMin

Number

Green channel minimum permitted value: 0 - 255

Default: 0

gShift

Number

Green channel delta value

Default: 0

name

String

Unique identifier for each object; default: computer-generated String based on Object's type

r

Number

Red channel value: 0 - 255

Default: 0

random

Boolean

Generation flag - if true, Color object will set itself to a random color within minimum and maximum attributes

This attribute is not retained by the color object, and can only be used in the scrawl.makeColor() and Color.set() functions

Default: false

rBounce

Boolean

Drawing flag - if true, when color updates the delta value will reverse its sign just before the channel's maximum or minimum value is breached

Default: false

rMax

Number

Red channel maximum permitted value: 0 - 255

Default: 255

rMin

Number

Red channel minimum permitted value: 0 - 255

Default: 0

rShift

Number

Red channel delta value

Default: 0

timestamp

String

Creation timestamp

Default: ''

title

String

Title, for accessibility

Default: ''

type

String final

Inherited from Base but overwritten in source\scrawlColor.js:100

Default: 'Color'