added README.md
This commit is contained in:
106
README.md
Normal file
106
README.md
Normal file
@@ -0,0 +1,106 @@
|
|||||||
|
# vikingowls-ts-snippets
|
||||||
|
## A collection of often used typescript snippets
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
### Utils
|
||||||
|
#### sleep()
|
||||||
|
The sleep function takes the time to sleep in milliseconds.
|
||||||
|
```ts
|
||||||
|
import { sleep } from "vikingowls-ts-snippets";
|
||||||
|
|
||||||
|
sleep(2000).then(any => {
|
||||||
|
// do-something
|
||||||
|
})
|
||||||
|
```
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
### Dom Utils
|
||||||
|
#### addGlobalEventListener()
|
||||||
|
The addGlobalEventListener function takes a type (string), a selector (string), a callback function, options (boolean or AddEventListenerOptions), and a parent (DOM or querySelector, etc)
|
||||||
|
|
||||||
|
```ts
|
||||||
|
import {addGlobalEventListener, qs} from "./domUtils";
|
||||||
|
|
||||||
|
addGlobalEventListener(
|
||||||
|
"click",
|
||||||
|
".btn",
|
||||||
|
() => console.log("Run once"),
|
||||||
|
{once: true}
|
||||||
|
)
|
||||||
|
|
||||||
|
addGlobalEventListener(
|
||||||
|
"click",
|
||||||
|
".btn",
|
||||||
|
() => console.log("Only works inside the wrapper class"),
|
||||||
|
{},
|
||||||
|
qs(".wrapper")
|
||||||
|
)
|
||||||
|
```
|
||||||
|
#### qs()
|
||||||
|
The qs function takes a selector (string) and a parent (DOM etc)
|
||||||
|
|
||||||
|
```ts
|
||||||
|
import {qs} from "./domUtils";
|
||||||
|
|
||||||
|
// instead of document.querySelector(".btn")
|
||||||
|
qs(".btn")
|
||||||
|
```
|
||||||
|
#### qsa()
|
||||||
|
The qsa function takes a selector (string) and a parent (DOM etc) and returns an Array of Elements
|
||||||
|
|
||||||
|
```ts
|
||||||
|
import {qsa} from "./domUtils";
|
||||||
|
|
||||||
|
// instead of document.querySelectorAll(".btn")
|
||||||
|
qsa(".btn")
|
||||||
|
```
|
||||||
|
---
|
||||||
|
|
||||||
|
### Formatters
|
||||||
|
#### formatCurrency()
|
||||||
|
The formatCurrency function takes a number and a currency (as shown).
|
||||||
|
The output defaults to the locale set in the browser but can be set manually.
|
||||||
|
```ts
|
||||||
|
import { formatCurrency } from "vikingowls-ts-snippets";
|
||||||
|
|
||||||
|
formatCurrency(9_123_456.789123, "EUR", "de-de")
|
||||||
|
// prints in germany "9.123.456,79 €"
|
||||||
|
formatCurrency(9_123_456.789123, "USD")
|
||||||
|
// prints in usa "$9,123,456.79"
|
||||||
|
```
|
||||||
|
#### formatNumber()
|
||||||
|
The formatNumber function takes a number.
|
||||||
|
The output defaults to the locale set in the browser but can be set manually.
|
||||||
|
```ts
|
||||||
|
import { formatNumber } from "vikingowls-ts-snippets";
|
||||||
|
|
||||||
|
formatNumber(9_123_456.789123, "de-de")
|
||||||
|
// prints in germany "9.123.456,789"
|
||||||
|
formatNumber(9_123_456.789123)
|
||||||
|
// prints in usa "9,123,456.789"
|
||||||
|
```
|
||||||
|
#### formatCompactNumber()
|
||||||
|
The formatCompactNumber function takes a number.
|
||||||
|
The output defaults to the locale set in the browser but can be set manually.
|
||||||
|
```ts
|
||||||
|
import { formatCompactNumber } from "vikingowls-ts-snippets";
|
||||||
|
|
||||||
|
formatCompactNumber(9_123_456.789123, "de-de")
|
||||||
|
// prints in germany "9,1 Mio."
|
||||||
|
formatCompactNumber(9_123_456.789123)
|
||||||
|
// prints in usa "9.1M"
|
||||||
|
```
|
||||||
|
#### formatRelativeDate()
|
||||||
|
The formatRelativeDate function takes a Date (end Date).
|
||||||
|
You also can set a default 'start Date'.
|
||||||
|
The output defaults to the locale set in the browser but can be set manually.
|
||||||
|
```ts
|
||||||
|
import { formatRelativeDate } from "vikingowls-ts-snippets";
|
||||||
|
|
||||||
|
formatRelativeDate(new Date().getSeconds() - 20000, new Date().getSeconds(), "de-de")
|
||||||
|
// prints in germany "vor 20 Sekunden"
|
||||||
|
formatRelativeDate(new Date().getSeconds() - 20000, new Date().getSeconds())
|
||||||
|
// prints in usa "20 seconds ago"
|
||||||
|
```
|
Reference in New Issue
Block a user