@hscmap/inertial-mouse

Inertial Mouse

Inertial Mouse for TypeScript

• Wraps native MouseEvent and emit pseudo mousemove events with inertial smooth motion.
• Working Demo

Install

npm instasll --save @hscmap/inertial-mouse

Example (source code of the working demo)

import { InertialMouse } from "@hscmap/inertial-mouse"


window.addEventListener('load', e => {
    const cursor = document.querySelector('.cursor') as HTMLElement
    const sandbox = document.querySelector('.sandbox') as HTMLElement

    const im = new InertialMouse(sandbox, {
        down() {
            cursor.classList.add('active')
        },
        move(e) {
            cursor.style.left = `${e.r.x}px`
            cursor.style.top = `${e.r.y}px`
        },
        stop() {
            cursor.classList.remove('active')
        }
    })

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


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