GitHub - wethegit/wtc-utility-helpers: Javascript helpers.

Functions

floatRandomBetween(min, max) ⇒ number

Generate a random float number max and min.

floatRandomBetween(-10, 20); // 12.513

randomBetween(min, max) ⇒ number

Generate a random integer number max and min.

randomBetween(-10, 20); // 12

lerp(x, y, amount) ⇒ number

Linearly interpolate between two values by a unit interval

lerp(100, 200, .5); // 150

clampfunction(min, max, value) ⇒ number

Clamps a value between an upper and lower bound.

clamp(0, 1, 2); // 1

shuffleArray(array, [modifyOriginal]) ⇒ array

Shuffle an array.

fireCustomEvent(name, data, [bubbles], [cancelable])

Fire a custom event.

fireCustomEvent(name, data);

getElementPosition(element, [toWorld]) ⇒ Object

Get the position of the element relative to document or optionally to the nearest offset parent.

getElementPosition(element); // returns something like { top: 100, left: 500 }

isChildOf(element, parentElement, [toWorld]) ⇒ Boolean

Determines whether the element is a child 0 ancestor of the other. If the toWorld flag is true (default), this will test recursively up the node hierarchy.

This method can be used to determine whether a node is detached by something like:

attached = isChildOf(element, document.body);

getSiblings(e) ⇒

Get siblings from element

getSiblings(e);

getAncestors(e, [toBody], [ancestors])

Retrieves all of the ancestors of an element, optionally to the document body (true by default). The list that is returned is the list of ancestors in order from the oldest to youngest.

getSelectorForElement(el) ⇒ String

Returns the CSS selector for a provided element

fixWidows()

Fix widows replaces the last space in a sentence with a non-breaking space This function is a little dangerous at the moment so we should revisit it at some point in the future

serializeArray(form) ⇒ Array

Returns the form data as an array of name/value pairs.

asyncImageLoadfunction(props) ⇒ Promise

Asynchronous image loader. Returns a promise for an image allowing it to be used directly via .then() or as a part of an async workload via await.

The then returns the provided image for use in the promise fulfullment.

Usage:

try {
 const img = asyncImageLoad({ src: '/assets/images/cool_image.png', alt: 'Cool Cats', crossOrigin: "anonymous" })
 // do something cool with img
} catch(err) {
 // Something happened and img didn't load
}

Without async/await:

const img = asyncImageLoad({ src: '/assets/images/cool_image.png', alt: 'Cool Cats', crossOrigin: "anonymous" }).then((img) => {
 // do something cool with img
 return img
}).catch((err) => {
 // Something happened and img didn't load
}) {

floatRandomBetween(min, max) ⇒ number

Generate a random float number max and min.

floatRandomBetween(-10, 20); // 12.513

randomBetween(min, max) ⇒ number

Generate a random integer number max and min.

randomBetween(-10, 20); // 12

lerp(x, y, amount) ⇒ number

Linearly interpolate between two values by a unit interval

lerp(100, 200, .5); // 150

clampfunction(min, max, value) ⇒ number

Clamps a value between an upper and lower bound.

clamp(0, 1, 2); // 1

shuffleArray(array, [modifyOriginal]) ⇒ array

Shuffle an array.

fireCustomEvent(name, data, [bubbles], [cancelable])

Fire a custom event.

fireCustomEvent(name, data);

getElementPosition(element, [toWorld]) ⇒ Object

Get the position of the element relative to document or optionally to the nearest offset parent.

getElementPosition(element); // returns something like { top: 100, left: 500 }

isChildOf(element, parentElement, [toWorld]) ⇒ Boolean

Determines whether the element is a child 0 ancestor of the other. If the toWorld flag is true (default), this will test recursively up the node hierarchy.

This method can be used to determine whether a node is detached by something like:

attached = isChildOf(element, document.body);

getSiblings(e) ⇒

Get siblings from element

getSiblings(e);

getAncestors(e, [toBody], [ancestors])

Retrieves all of the ancestors of an element, optionally to the document body (true by default). The list that is returned is the list of ancestors in order from the oldest to youngest.

getSelectorForElement(el) ⇒ String

Returns the CSS selector for a provided element

fixWidows()

Fix widows replaces the last space in a sentence with a non-breaking space This function is a little dangerous at the moment so we should revisit it at some point in the future

serializeArray(form) ⇒ Array

Returns the form data as an array of name/value pairs.

asyncImageLoadfunction(props) ⇒ Promise

Asynchronous image loader. Returns a promise for an image allowing it to be used directly via .then() or as a part of an async workload via await.

The then returns the provided image for use in the promise fulfullment.

Usage:

try {
 const img = asyncImageLoad({ src: '/assets/images/cool_image.png', alt: 'Cool Cats', crossOrigin: "anonymous" })
 // do something cool with img
} catch(err) {
 // Something happened and img didn't load
}

Without async/await:

const img = asyncImageLoad({ src: '/assets/images/cool_image.png', alt: 'Cool Cats', crossOrigin: "anonymous" }).then((img) => {
 // do something cool with img
 return img
}).catch((err) => {
 // Something happened and img didn't load
}) {

floatRandomBetween(min, max) ⇒ `number`

Generate a random float number max and min.

floatRandomBetween(-10, 20); // 12.513

Kind: global function
Returns: number -

Random number.

Param	Type	Description
min	`number`	Minimum value.
max	`number`	Maximum value.

randomBetween(min, max) ⇒ `number`

Generate a random integer number max and min.

randomBetween(-10, 20); // 12

Kind: global function
Returns: number -

Random number.

Param	Type	Description
min	`number`	Minimum value.
max	`number`	Maximum value.

lerp(x, y, amount) ⇒ `number`

Linearly interpolate between two values by a unit interval

lerp(100, 200, .5); // 150

Kind: global function
Returns: number -

The interpolated value

Param	Type	Description
x	`number`	The lower value
y	`number`	The upper value
amount	`number`	the amount to interpolate. The expected value is a unit interval (a float between 0 and 1), but this will work with higher and lower values as well.

clampfunction(min, max, value) ⇒ `number`

Clamps a value between an upper and lower bound.

clamp(0, 1, 2); // 1

Kind: global function
Returns: number -

A number in the range [min, max]

Param	Type	Description
min	`number`	The lower bound
max	`number`	The upper bound
value	`number`	The value to clamp.

shuffleArray(array, [modifyOriginal]) ⇒ `array`

Shuffle an array.

Kind: global function
Returns: array -

Shuffled array.

Param	Type	Description
array	`Array`	Arrray to be shuffled.
[modifyOriginal]	`Boolean`	A boolean indicating whether the original array should be modified or whether a copy should be created. (default True)

fireCustomEvent(name, data, [bubbles], [cancelable])

Fire a custom event.

fireCustomEvent(name, data);

Kind: global function

Param	Type	Description
name	`string`	Name of the event.
data	`object`	Object to be passed to the event.
[bubbles]	`Boolean`	Indicates whether the event bubbles (default True)
[cancelable]	`Boolean`	Indicates whether the event is cancellable default True)

getElementPosition(element, [toWorld]) ⇒ `Object`

Get the position of the element relative to document or optionally to the nearest offset parent.

getElementPosition(element); // returns something like { top: 100, left: 500 }

Kind: global function
Returns: Object -

the element coordinates.

Param	Type	Description
element	`DOMNode`	Element.
[toWorld]	`Boolean`	indicates whether the calculation of the element offset should be to the page or to the offset parent. (default True)

isChildOf(element, parentElement, [toWorld]) ⇒ `Boolean`

Determines whether the element is a child 0 ancestor of the other. If the toWorld flag is true (default), this will test recursively up the node hierarchy.

This method can be used to determine whether a node is detached by something like:

attached = isChildOf(element, document.body);

Kind: global function
Returns: Boolean -

true is the parentElement is parent (or ancestor) to Element

Param	Type	Description
element	`DomNode`	The element to test with
parentElement	`DomNode`	The parent element to test against
[toWorld]	`Boolean`	Whether to test this up the DOM hierarchy

getSiblings(e) ⇒

Get siblings from element

getSiblings(e);

Kind: global function
Returns:

Returns a list with the element's siblings.

Param	Type	Description
e	`DOMElement`	Element

getAncestors(e, [toBody], [ancestors])

Retrieves all of the ancestors of an element, optionally to the document body (true by default). The list that is returned is the list of ancestors in order from the oldest to youngest.

Kind: global function

Param	Type	Description
e	`DOMElement`	The element to retrieve the ancestors for
[toBody]	`boolean`	whether to only test to the body (default True)
[ancestors]	`array`	the list of already existing elements to pass. This is nromally only used internally

getSelectorForElement(el) ⇒ `String`

Returns the CSS selector for a provided element

Kind: global function
Returns: String -

The CSS selector the describes exactly where to find the element

Param	Type	Description
el	`DOMElement`	The DOM node to find a selector for

fixWidows()

Fix widows replaces the last space in a sentence with a non-breaking space This function is a little dangerous at the moment so we should revisit it at some point in the future

Kind: global function

serializeArray(form) ⇒ `Array`

Returns the form data as an array of name/value pairs.

Kind: global function
Returns: Array -

Serialized data

Param Type Description

form

DOMElement

The

DOM node

asyncImageLoadfunction(props) ⇒ `Promise`

Asynchronous image loader. Returns a promise for an image allowing it to be used directly via .then() or as a part of an async workload via await.

The then returns the provided image for use in the promise fulfullment.

Usage:

try {
 const img = asyncImageLoad({ src: '/assets/images/cool_image.png', alt: 'Cool Cats', crossOrigin: "anonymous" })
 // do something cool with img
} catch(err) {
 // Something happened and img didn't load
}

Without async/await:

const img = asyncImageLoad({ src: '/assets/images/cool_image.png', alt: 'Cool Cats', crossOrigin: "anonymous" }).then((img) => {
 // do something cool with img
 return img
}).catch((err) => {
 // Something happened and img didn't load
}) {

Kind: global function
Returns: Promise -

A promise

Param	Type	Description
props	`Object`	Image properties
props.src	`String`	The image SRC

floatRandomBetween(min, max) ⇒ `number`

Generate a random float number max and min.

floatRandomBetween(-10, 20); // 12.513

Kind: global function
Returns: number -

Random number.

Param	Type	Description
min	`number`	Minimum value.
max	`number`	Maximum value.

randomBetween(min, max) ⇒ `number`

Generate a random integer number max and min.

randomBetween(-10, 20); // 12

Kind: global function
Returns: number -

Random number.

Param	Type	Description
min	`number`	Minimum value.
max	`number`	Maximum value.

lerp(x, y, amount) ⇒ `number`

Linearly interpolate between two values by a unit interval

lerp(100, 200, .5); // 150

Kind: global function
Returns: number -

The interpolated value

Param	Type	Description
x	`number`	The lower value
y	`number`	The upper value
amount	`number`	the amount to interpolate. The expected value is a unit interval (a float between 0 and 1), but this will work with higher and lower values as well.

clampfunction(min, max, value) ⇒ `number`

Clamps a value between an upper and lower bound.

clamp(0, 1, 2); // 1

Kind: global function
Returns: number -

A number in the range [min, max]

Param	Type	Description
min	`number`	The lower bound
max	`number`	The upper bound
value	`number`	The value to clamp.

shuffleArray(array, [modifyOriginal]) ⇒ `array`

Shuffle an array.

Kind: global function
Returns: array -

Shuffled array.

Param	Type	Description
array	`Array`	Arrray to be shuffled.
[modifyOriginal]	`Boolean`	A boolean indicating whether the original array should be modified or whether a copy should be created. (default True)

fireCustomEvent(name, data, [bubbles], [cancelable])

Fire a custom event.

fireCustomEvent(name, data);

Kind: global function

Param	Type	Description
name	`string`	Name of the event.
data	`object`	Object to be passed to the event.
[bubbles]	`Boolean`	Indicates whether the event bubbles (default True)
[cancelable]	`Boolean`	Indicates whether the event is cancellable default True)

getElementPosition(element, [toWorld]) ⇒ `Object`

Get the position of the element relative to document or optionally to the nearest offset parent.

getElementPosition(element); // returns something like { top: 100, left: 500 }

Kind: global function
Returns: Object -

the element coordinates.

Param	Type	Description
element	`DOMNode`	Element.
[toWorld]	`Boolean`	indicates whether the calculation of the element offset should be to the page or to the offset parent. (default True)

isChildOf(element, parentElement, [toWorld]) ⇒ `Boolean`

Determines whether the element is a child 0 ancestor of the other. If the toWorld flag is true (default), this will test recursively up the node hierarchy.

This method can be used to determine whether a node is detached by something like:

attached = isChildOf(element, document.body);

Kind: global function
Returns: Boolean -

true is the parentElement is parent (or ancestor) to Element

Param	Type	Description
element	`DomNode`	The element to test with
parentElement	`DomNode`	The parent element to test against
[toWorld]	`Boolean`	Whether to test this up the DOM hierarchy

getSiblings(e) ⇒

Get siblings from element

getSiblings(e);

Kind: global function
Returns:

Returns a list with the element's siblings.

Param	Type	Description
e	`DOMElement`	Element

getAncestors(e, [toBody], [ancestors])

Retrieves all of the ancestors of an element, optionally to the document body (true by default). The list that is returned is the list of ancestors in order from the oldest to youngest.

Kind: global function

Param	Type	Description
e	`DOMElement`	The element to retrieve the ancestors for
[toBody]	`boolean`	whether to only test to the body (default True)
[ancestors]	`array`	the list of already existing elements to pass. This is nromally only used internally

getSelectorForElement(el) ⇒ `String`

Returns the CSS selector for a provided element

Kind: global function
Returns: String -

The CSS selector the describes exactly where to find the element

Param	Type	Description
el	`DOMElement`	The DOM node to find a selector for

fixWidows()

Fix widows replaces the last space in a sentence with a non-breaking space This function is a little dangerous at the moment so we should revisit it at some point in the future

Kind: global function

serializeArray(form) ⇒ `Array`

Returns the form data as an array of name/value pairs.

Kind: global function
Returns: Array -

Serialized data

Param	Type	Description
form	`DOMElement`	The DOM node

asyncImageLoadfunction(props) ⇒ `Promise`

Asynchronous image loader. Returns a promise for an image allowing it to be used directly via .then() or as a part of an async workload via await.

The then returns the provided image for use in the promise fulfullment.

Usage:

try {
 const img = asyncImageLoad({ src: '/assets/images/cool_image.png', alt: 'Cool Cats', crossOrigin: "anonymous" })
 // do something cool with img
} catch(err) {
 // Something happened and img didn't load
}

Without async/await:

const img = asyncImageLoad({ src: '/assets/images/cool_image.png', alt: 'Cool Cats', crossOrigin: "anonymous" }).then((img) => {
 // do something cool with img
 return img
}).catch((err) => {
 // Something happened and img didn't load
}) {

Kind: global function
Returns: Promise -

A promise

Param	Type	Description
props	`Object`	Image properties
props.src	`String`	The image SRC

Name		Name	Last commit message	Last commit date
Latest commit History 25 Commits
.github/workflows		.github/workflows
src		src
.gitignore		.gitignore
.npmignore		.npmignore
LICENSE		LICENSE
README.md		README.md
jsdoc.json		jsdoc.json
package-lock.json		package-lock.json
package.json		package.json

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Repository files navigation

Functions

floatRandomBetween(min, max) ⇒ `number`

randomBetween(min, max) ⇒ `number`

lerp(x, y, amount) ⇒ `number`

clampfunction(min, max, value) ⇒ `number`

shuffleArray(array, [modifyOriginal]) ⇒ `array`

fireCustomEvent(name, data, [bubbles], [cancelable])

getElementPosition(element, [toWorld]) ⇒ `Object`

isChildOf(element, parentElement, [toWorld]) ⇒ `Boolean`

getSiblings(e) ⇒

getAncestors(e, [toBody], [ancestors])

getSelectorForElement(el) ⇒ `String`

fixWidows()

serializeArray(form) ⇒ `Array`

asyncImageLoadfunction(props) ⇒ `Promise`

floatRandomBetween(min, max) ⇒ `number`

randomBetween(min, max) ⇒ `number`

lerp(x, y, amount) ⇒ `number`

clampfunction(min, max, value) ⇒ `number`

shuffleArray(array, [modifyOriginal]) ⇒ `array`

fireCustomEvent(name, data, [bubbles], [cancelable])

getElementPosition(element, [toWorld]) ⇒ `Object`

isChildOf(element, parentElement, [toWorld]) ⇒ `Boolean`

getSiblings(e) ⇒

getAncestors(e, [toBody], [ancestors])

getSelectorForElement(el) ⇒ `String`

fixWidows()

serializeArray(form) ⇒ `Array`

asyncImageLoadfunction(props) ⇒ `Promise`

About

Releases

Packages

Contributors 4

Languages

License

wethegit/wtc-utility-helpers

Folders and files

Latest commit

History

Repository files navigation

Functions

floatRandomBetween(min, max) ⇒ number

randomBetween(min, max) ⇒ number

lerp(x, y, amount) ⇒ number

clampfunction(min, max, value) ⇒ number

shuffleArray(array, [modifyOriginal]) ⇒ array

fireCustomEvent(name, data, [bubbles], [cancelable])

getElementPosition(element, [toWorld]) ⇒ Object

isChildOf(element, parentElement, [toWorld]) ⇒ Boolean

getSiblings(e) ⇒

getAncestors(e, [toBody], [ancestors])

getSelectorForElement(el) ⇒ String

fixWidows()

serializeArray(form) ⇒ Array

asyncImageLoadfunction(props) ⇒ Promise

floatRandomBetween(min, max) ⇒ number

randomBetween(min, max) ⇒ number

lerp(x, y, amount) ⇒ number

clampfunction(min, max, value) ⇒ number

shuffleArray(array, [modifyOriginal]) ⇒ array

fireCustomEvent(name, data, [bubbles], [cancelable])

getElementPosition(element, [toWorld]) ⇒ Object

isChildOf(element, parentElement, [toWorld]) ⇒ Boolean

getSiblings(e) ⇒

getAncestors(e, [toBody], [ancestors])

getSelectorForElement(el) ⇒ String

fixWidows()

serializeArray(form) ⇒ Array

asyncImageLoadfunction(props) ⇒ Promise

About

Resources

License

Stars

Watchers

Forks

Releases

Packages 0

Contributors 4

Languages

floatRandomBetween(min, max) ⇒ `number`

randomBetween(min, max) ⇒ `number`

lerp(x, y, amount) ⇒ `number`

clampfunction(min, max, value) ⇒ `number`

shuffleArray(array, [modifyOriginal]) ⇒ `array`

getElementPosition(element, [toWorld]) ⇒ `Object`

isChildOf(element, parentElement, [toWorld]) ⇒ `Boolean`

getSelectorForElement(el) ⇒ `String`

serializeArray(form) ⇒ `Array`

asyncImageLoadfunction(props) ⇒ `Promise`

floatRandomBetween(min, max) ⇒ `number`

randomBetween(min, max) ⇒ `number`

lerp(x, y, amount) ⇒ `number`

clampfunction(min, max, value) ⇒ `number`

shuffleArray(array, [modifyOriginal]) ⇒ `array`

getElementPosition(element, [toWorld]) ⇒ `Object`

isChildOf(element, parentElement, [toWorld]) ⇒ `Boolean`

getSelectorForElement(el) ⇒ `String`

serializeArray(form) ⇒ `Array`

asyncImageLoadfunction(props) ⇒ `Promise`

Packages