Security News
The Dark Side of Open Source
At Node Congress, Socket CEO Feross Aboukhadijeh uncovers the darker aspects of open source, where applications that rely heavily on third-party dependencies can be exploited in supply chain attacks.
swipe-event-listener
Advanced tools
Readme
swipe-event-listener is a very minimal library that allows listening for swipe gesture, including the ones from the mouse from any DOM element. Once invoked with a DOM element, simply listen for swipe events.
<script src="https://unpkg.com/swipe-event-listener@1.2.1/dist/swipe-event-listener.js"></script>
Then anywhere in your JavaScript code.
const { SwipeEventListener } = window.SwipeEventListener;
OR
const SwipeEventListener = window.SwipeEventListener.SwipeEventListener;
npm i swipe-event-listener
Then anywhere in your code.
import { SwipeEventListener } from 'swipe-event-listener`
OR
const SwipeListener = require('swipe-listener');
const { swipeArea, updateOptions } = SwipeEventListener({
swipeArea: document.querySelector('body'),
});
swipeArea.addEventListener('swipeDown', () => {
console.log('swipe down');
});
swipeArea.addEventListener('swipeUp', () => {
console.log('swipe up');
});
swipeArea.addEventListener('swipeLeft', () => {
console.log('swipe left');
});
swipeArea.addEventListener('swipeRight', () => {
console.log('swipe right');
});
const SwipeEventListener: (
customOptions: Options,
) => {
swipeArea: HTMLElement;
updateOptions: (newOptions: Options) => void;
};
Option | Required | Type | Default | Description |
---|---|---|---|---|
swipeArea | yes | HTMLElement | undefined | The container where the swipe event can take place. |
swipeSensitivity | no | number | 80 | Swipe sensitivity in pixels. Across how many pixels does the cursor need to move to trigger the swipe event. |
isSwipeUpDesired | no | boolean | yes | Enable swipeUp event. |
isSwipeDownDesired | no | boolean | yes | Enable swipeDown event. |
isSwipeLeftDesired | no | boolean | yes | Enable swipeLeft event. |
isSwipeRightDesired | no | boolean | yes | Enable swipeRight event. |
listenForMouseEvents | no | boolean | yes | Enable swipe event using mouse event. |
listenForTouchEvents | no | boolean | yes | Enable swipe event using touch events (used for mobile). |
const SwipeEventListener = (customOptions: Options): SwipeEventListene => {...}
export interface SwipeEventListener {
swipeArea: HTMLElement;
updateOptions: (newOptions: Options) => void;
}
Types are included and are available for importation.
swipe-event-listener.d.ts
export interface Options {
swipeSensitivity: number;
isSwipeUpDesired: boolean;
isSwipeDownDesired: boolean;
isSwipeLeftDesired: boolean;
isSwipeRightDesired: boolean;
listenForTouchEvents: boolean;
listenForMouseEvents: boolean;
swipeArea: HTMLElement;
}
export declare enum CustomSwipeEvents {
swipeUp = 'swipeUp',
swipeDown = 'swipeDown',
swipeLeft = 'swipeLeft',
swipeRight = 'swipeRight',
}
export declare const SwipeEventListener: (
customOptions: Options,
) => {
swipeArea: HTMLElement;
updateOptions: (newOptions: Options) => void;
};
This project is licensed under the MIT License
FAQs
Low level, zero-dependency, minimal swipe event implementation for web.
The npm package swipe-event-listener receives a total of 324 weekly downloads. As such, swipe-event-listener popularity was classified as not popular.
We found that swipe-event-listener demonstrated a not healthy version release cadence and project activity because the last version was released a year ago. It has 1 open source maintainer collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
At Node Congress, Socket CEO Feross Aboukhadijeh uncovers the darker aspects of open source, where applications that rely heavily on third-party dependencies can be exploited in supply chain attacks.
Research
Security News
The Socket Research team found this npm package includes code for collecting sensitive developer information, including your operating system username, Git username, and Git email.
Security News
OpenJS is warning of social engineering takeovers targeting open source projects after receiving a credible attempt on the foundation.