# clearhead-utilities

> Common utility functions for Clearhead

Latest version **1.0.15** (published 2020-02-24) · ISC license · 0 weekly downloads

## Install

```sh
npm install clearhead-utilities
pnpm add clearhead-utilities
yarn add clearhead-utilities
bun add clearhead-utilities
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.0.15 |
| Published | 2020-02-24 |
| First published | 2020-02-12 |
| Weekly downloads | 0 |
| License | ISC |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 0 |
| Unpacked size | 13.7 KB |
| Known vulnerabilities | 0 |
| Install scripts | yes |
| Author | doctafaustus |
| Maintainers | doctafaustus |
| Keywords | clearhead, utilities |

## Links

- npm: https://www.npmjs.com/package/clearhead-utilities
- Repository: https://source.digital.accenture.com:7999/clear/clearhead-utilities
- npm.io page: https://npm.io/package/clearhead-utilities

## Recent versions

- 1.0.15 (latest) — 2020-02-24
- 1.0.14 — 2020-02-24
- 1.0.13 — 2020-02-24
- 1.0.12 — 2020-02-24
- 1.0.11 — 2020-02-24
- 1.0.10 — 2020-02-24
- 1.0.9 — 2020-02-24
- 1.0.8 — 2020-02-17
- 1.0.7 — 2020-02-17
- 1.0.6 — 2020-02-13
- 1.0.5 — 2020-02-12
- 1.0.4 — 2020-02-12
- 1.0.3 — 2020-02-12
- 1.0.2 — 2020-02-12
- 1.0.1 — 2020-02-12
- … 1 more at https://npm.io/package/clearhead-utilities/versions

## README

# Clearhead Utilities

These are commonly used utility functions that can be selectively used in experiments via ES6 imports.

## Installation
This module can be added directly to an experiment folder's package.json file or manually installed via:
```shell
npm install clearhead-utilities --save-dev
```

## Usage
Import via your experiment code:
```javascript
import { getCookie, slugify, when } from 'clearhead-utilities';
```

## Utility Functions

### console-proxy
For use when a site's console is overwritten to an empty function. Sets the console object back to it's original state.
```javascript
import { consoleProxy } from 'clearhead-utilities';

// Call consoleProxy to reset console back to its original state
consoleProxy();
console.log('The console is back');
```

### cookie
Sets, gets, and deletes a cookie with a given name, value, and optional expiration date (in days).
```javascript
import { getCookie, setCookie, deleteCookie } from 'clearhead-utilities';

getCookie('cookie-name');
setCookie('cookie-name', 'cookie-value', 365);
deleteCookie('cookie-name');
```

### debounce
Prevents a function from being recalled repeatedly. The function will be called again after it stops being called for N milliseconds.

See https://css-tricks.com/the-difference-between-throttling-and-debouncing/ for a good writeup for the difference between debounce and throttle.

```javascript
import { debounce } from 'clearhead-utilities';

// The inner function will only be called after the user has stopped scrolling for 100ms
$(window).on('scroll', debounce(function() {
  console.log('The user started scrolling and this function didn\'t execute until there was a 100ms break in the scrolling');
}, 100));
```

### dollar-to-float
Turns dollar format string into a "mathable" float.

```javascript
import { dollarToFloat } from 'clearhead-utilities'; 

const cartValue = dollarToFloat('$59.00'); // Returns 59
```

### float-to-dollar
Turns floats into a dollar format string with commas.

```javascript
import { floatToDollar } from 'clearhead-utilities';

const dollarValue = floatToDollar(59.00); // Returns "$59.00"
```

### load-script
Loads a script and fires callback.

```javascript
import { loadScript } from 'clearhead-utilities';

function optCallBack() {
  console.log('my callback function is firing after the script loads!');
};
loadScript('../src/main.js', optCallBack);
```

### preload
Preloads images.

```javascript
import { preload } from 'clearhead-utilities';

const arrayOfLoadedImages = preload('./imgs/img01.jpg', './imgs/img02.jpg', './imgs/img03.jpg', './imgs/img04.jpg');
```

### slugify
Returns the 'slug' of a string (replaces non-word characters with hyphens).

```javascript
import { slugify } from 'clearhead-utilities';

const articleTitle = 'How to use Clearhead utilities!';
const articleSlug = slugify(articleTitle);
console.log(articleSlug); // Outputs: how-to-use-clearhead-utilities
```

### throttle
Borrowed from http://underscorejs.org/docs/underscore.html

Returns a function, that, when invoked, will only be triggered at most once during a given window of time. Normally, the throttled function will run as much as it can, without ever going more than once per wait duration; but if you’d like to disable the execution on the leading edge, pass {leading: false}. To disable execution on the trailing edge, ditto.

See https://css-tricks.com/the-difference-between-throttling-and-debouncing/ for a good writeup for the difference between throttle and debounce.

```javascript
import { throttle } from 'clearhead-utilities';

// The inner function will only be called every 100ms while the user is scrolling
$(window).on('scroll', throttle(function() {
  console.log('You\'ll see this message every 100ms while the user is still scrolling');
}, 100));
```

### wait-for
Uses a recursive setTimeout to wait for a condition to be true and then runs a callback. It has a default interval of 50ms and default timeout of 20 seconds.

```javascript
import { waitFor } from 'clearhead-utilities';

waitFor(
  () => {
    return document.querySelector('.something') &&
      window.someOtherVariable;
  },
  () => {
    console.log('Callback fn');
  }
);
```

### when
Polls for a DOM element, and executes code when the element is found. It times out after DOM ready.

```javascript
import { when } from 'clearhead-utilities';

when('.this-div', elements => {
  console.log('Found elements!');
});
```

---
_Source: https://npm.io/package/clearhead-utilities · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._