Added docs for rgba/hsla

This commit is contained in:
Devine Lu Linvega 2019-07-28 13:12:32 +09:00
parent 5ad6ec3936
commit 7bd740f257
2 changed files with 20 additions and 19 deletions

View File

@ -62,13 +62,16 @@ Ronin helpers are keywords that facilitates adding coordinates from the canvas i
- `(gradient line ~colors 'black'])` Defines a gradient color. - `(gradient line ~colors 'black'])` Defines a gradient color.
- `(guide shape color)` Draws a shape on the guide layer. - `(guide shape color)` Draws a shape on the guide layer.
- `(clear ~rect)` Clears a rect. - `(clear ~rect)` Clears a rect.
- `(rgba r g b ~a)` Defines a color r, g, b values are from 0 to 255, a from 0 to 1
- `(hsla h s l ~a)` Defines a color h from 0 to 360, s and l from 0 to 100, a from 0 to 1
- `(frame)` Returns a rect of the frame. - `(frame)` Returns a rect of the frame.
- `(center)` Returns a position of the center of the frame. - `(center)` Returns a position of the center of the frame.
- `(resize w h ~fit)` Resizes the canvas to target w and h, returns the rect. - `(resize w h ~fit)` Resizes the canvas to target w and h, returns the rect.
- `(rescale w h)` Rescales the canvas to target ratio of w and h, returns the rect. - `(rescale w h)` Rescales the canvas to target ratio of w and h, returns the rect.
- `(crop rect)` Crop canvas to rect. - `(crop rect)` Crop canvas to rect.
- `(clone a b)` - `(clone a b)`
- `(drag ~rect)` - `(drag ~rect)` Drag a part of the canvas.
- `(view a b)` View a part of the canvas.
- `(theme variable ~el)` - `(theme variable ~el)`
- `(pixels rect fn ~q)` - `(pixels rect fn ~q)`
- `(saturation pixel q)` Change the saturation of pixels. - `(saturation pixel q)` Change the saturation of pixels.
@ -88,13 +91,13 @@ Ronin helpers are keywords that facilitates adding coordinates from the canvas i
- `(min)` - `(min)`
- `(max)` - `(max)`
- `(ceil)` - `(ceil)`
- `(floor)` round down to the nearest integer. - `(floor)` Round down to the nearest integer.
- `(sin)` - `(sin)`
- `(cos)` - `(cos)`
- `(log)` caclulates on the base of e. - `(log)` Caclulates on the base of e.
- `(pow a b)` calculates a^b. - `(pow a b)` Calculates a^b.
- `(sqrt)` calculate the square root. - `(sqrt)` Calculate the square root.
- `(sq a)` calculate the square. - `(sq a)` Calculate the square.
- `(PI)` - `(PI)`
- `(TWO_PI)` - `(TWO_PI)`
- `(random ...args)` - `(random ...args)`
@ -132,7 +135,7 @@ Ronin helpers are keywords that facilitates adding coordinates from the canvas i
- `(js)` Javascript interop. - `(js)` Javascript interop.
- `(on event f)` Triggers on event. - `(on event f)` Triggers on event.
- `(test name a b)` - `(test name a b)`
- `(benchmark fn)` logs time taken to execute a function. - `(benchmark fn)` Logs time taken to execute a function.
<img src='https://raw.githubusercontent.com/hundredrabbits/Ronin/master/PREVIEW2.jpg' width='600'/> <img src='https://raw.githubusercontent.com/hundredrabbits/Ronin/master/PREVIEW2.jpg' width='600'/>

View File

@ -117,16 +117,14 @@ function Library (ronin) {
// colors // colors
this.rgba = (r, g, b, a) => { // defines a color r, g, b values are from 0 to 255, a from 0 to 1 this.rgba = (r, g, b, a = 1) => { // Defines a color r, g, b values are from 0 to 255, a from 0 to 1
return "rgba("+r+","+g+","+b+","+a+")"; return `rgba(${r},${g},${b},${a})`
} }
this.hsla = (h, s, l, a = 1) => { // Defines a color h from 0 to 360, s and l from 0 to 100, a from 0 to 1
this.hsla = (h, s, l, a) => { // defines a color h from 0 to 360, s and l from 0 to 100, a from 0 to 1 return `hsla(${h},${s}%,${l}%,${a})`
return "hsla("+h+","+s+"%,"+l+"%,"+a+")";
} }
// Frame // Frame
this.frame = () => { // Returns a rect of the frame. this.frame = () => { // Returns a rect of the frame.
@ -274,21 +272,21 @@ function Library (ronin) {
this.ceil = Math.ceil this.ceil = Math.ceil
this.floor = Math.floor // round down to the nearest integer. this.floor = Math.floor // Round down to the nearest integer.
this.sin = Math.sin this.sin = Math.sin
this.cos = Math.cos this.cos = Math.cos
this.log = Math.log // caclulates on the base of e. this.log = Math.log // Caclulates on the base of e.
this.pow = (a, b) => { // calculates a^b. this.pow = (a, b) => { // Calculates a^b.
return Math.pow(a, b) return Math.pow(a, b)
} }
this.sqrt = Math.sqrt // calculate the square root. this.sqrt = Math.sqrt // Calculate the square root.
this.sq = (a) => { // calculate the square. this.sq = (a) => { // Calculate the square.
return a * a return a * a
} }
@ -524,7 +522,7 @@ function Library (ronin) {
return a === b return a === b
} }
this.benchmark = async (fn) => { // logs time taken to execute a function. this.benchmark = async (fn) => { // Logs time taken to execute a function.
const start = Date.now() const start = Date.now()
const result = await fn() const result = await fn()
console.log(`time taken: ${Date.now() - start}ms`) console.log(`time taken: ${Date.now() - start}ms`)