# @hscmap/inertial-mouse

> Inertial Mouse for TypeScript * Wraps native MouseEvent and emit pseudo mousemove events with inertial smooth motion. * [Working Demo](https://michitaro.github.io/inertial-mouse)

Latest version **3.5.0** (published 2018-09-05) · 0 weekly downloads

> **Deprecated.** This package is deprecated.

## Install

```sh
npm install @hscmap/inertial-mouse
pnpm add @hscmap/inertial-mouse
yarn add @hscmap/inertial-mouse
bun add @hscmap/inertial-mouse
```

## Health

**Score 10/100 (F)** — status: deprecated.

Negative: deprecated.

## Facts

| | |
|---|---|
| Version | 3.5.0 |
| Published | 2018-09-05 |
| First published | 2017-08-22 |
| Weekly downloads | 0 |
| TypeScript types | bundled |
| Module format | CommonJS |
| Dependencies | 0 |
| Unpacked size | 19.3 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Maintainers | michitaro |

## Links

- npm: https://www.npmjs.com/package/@hscmap/inertial-mouse
- Repository: https://github.com/michitaro/inertial-mouse
- Issues: https://github.com/michitaro/inertial-mouse/issues
- npm.io page: https://npm.io/package/@hscmap/inertial-mouse

## Recent versions

- 3.5.0 (latest) — 2018-09-05
- 3.4.0 — 2018-09-03
- 3.3.1 — 2018-07-04
- 3.3.0 — 2018-07-02
- 3.2.1 — 2018-03-02
- 3.2.0 — 2017-10-02
- 3.1.0 — 2017-10-02
- 3.0.1 — 2017-09-30
- 2.3.1 — 2017-09-25
- 2.3.0 — 2017-08-26
- 2.2.2 — 2017-08-24
- 2.2.1 — 2017-08-24
- 2.2.0 — 2017-08-24
- 2.1.0 — 2017-08-24
- 2.0.1 — 2017-08-23
- … 4 more at https://npm.io/package/@hscmap/inertial-mouse/versions

## README

# Inertial Mouse
Inertial Mouse for TypeScript
* Wraps native MouseEvent and emit pseudo mousemove events with inertial smooth motion.
* [Working Demo](https://michitaro.github.io/inertial-mouse)

## Install

```sh
npm instasll --save @hscmap/inertial-mouse
```

## Example (source code of the working demo)

```typescript
import { InertialMouse, V2 } from "@hscmap/inertial-mouse"


window.addEventListener('load', e => {
    const sandbox = document.querySelector('.sandbox') as HTMLElement
    const cursor = document.querySelector('.cursor') as HTMLElement
    const dxText = document.querySelector('[name="dx"]') as HTMLInputElement
    const dyText = document.querySelector('[name="dy"]') as HTMLInputElement

    function setCursorPosition(r: V2) {
        cursor.style.left = `${r.x}px`
        cursor.style.top = `${r.y}px`
    }

    const im = new InertialMouse(sandbox, {
        down: (e) => {
            setCursorPosition(e.r)
            cursor.classList.add('pressed')
        },
        up: () => {
            cursor.classList.remove('pressed')
        },
        move: (e) => {
            setCursorPosition(e.r)
            dxText.value = `${e.d.x}`
            dyText.value = `${e.d.y}`
        },
        movestart: () => cursor.classList.add('moving'),
        moveend: () => cursor.classList.remove('moving'),
    })

    document.addEventListener('keydown', e => im.stop())

    document.addEventListener('change', e => {
        const target = e.target as HTMLInputElement
        if (target.matches('[name="slick"]'))
            im.physics.slick = target.checked
        if (target.matches('[name="friction"]'))
            im.physics.friction = Number(target.value)
        if (target.matches('[name="k"]'))
            im.physics.k = Number(target.value)
    })
})


document.addEventListener('selectstart', e => e.preventDefault()) // disable selection```

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