Gathering detailed insights and metrics for propagating-hammerjs
Gathering detailed insights and metrics for propagating-hammerjs
Extend hammer.js with event propagation
Installations
npm install propagating-hammerjsDeveloper Guide
BETA
Typescript
No
Module System
CommonJS
Node Version
20.5.0
NPM Version
9.8.0
Score
99.7
Supply Chain
100
Quality
75.9
Maintenance
100
Vulnerability
100
License
Releases
Unable to fetch releases
Languages
1
JavaScript
JavaScript (100%)
Developer
josdejong
Download Statistics
Total Downloads
38,117,253
Last Day
12,568
Last Week
426,904
Last Month
1,897,075
Last Year
17,595,465
GitHub Statistics
MIT License
40 Stars
51 Commits
14 Forks
3 Watchers
1 Branches
3 Contributors
Updated on Sep 25, 2024
Bundle Size
1.75 kB
Minified
779.00 B
Minified + Gzipped
Maintainers
1
Package Meta Information
Latest Version
3.0.0
Package Id
propagating-hammerjs@3.0.0
Unpacked Size
29.00 kB
Size
6.90 kB
File Count
10
NPM Version
9.8.0
Node Version
20.5.0
Published on
Jan 25, 2024
Total Downloads
Cumulative downloads
Total Downloads
38,117,253
Last Day
-13.9%
12,568
Compared to previous day
Last Week
-12.3%
426,904
Compared to previous week
Last Month
5.6%
1,897,075
Compared to previous month
Last Year
148.7%
17,595,465
Compared to previous year
Weekly Downloads
Monthly Downloads
Yearly Downloads
Peer Dependencies
1
Dev Dependencies
2
propagating-hammerjs
Extend hammer.js (v2) with event propagation.
We use the @egjs/hammerjs fork because hammer.js is not maintained anymore.
Features
- Events emitted by hammer will propagate in order from child to parent elements.
- Events are extended with a function
event.stopPropagation()to stop propagation to parent elements. - Events are extended with a property
event.firstTargetcontaining the element where a gesture started. - Supports changing and rearranging the HTML DOM on the fly.
- Load via commonjs, AMD, or as a plain old JavaScript file.
Install
1npm install @egjs/hammerjs propagating-hammerjs
Load
Browser
1<!DOCTYPE html> 2<html> 3<head> 4 <script src="https://unpkg.com/@egjs/hammerjs@latest/dist/hammer.js"></script> 5 <script src="https://unpkg.com/propagating-hammerjs@latest/propagating.js"></script> 6 <script> 7 function init() { 8 var hammer = propagating(new Hammer(element)); 9 } 10 </script> 11</head> 12<body> 13</body> 14</html>
Commonjs (e.g. Node.js, Browserify)
1var Hammer = require('@egjs/hammerjs'); 2var propagating = require('propagating-hammerjs'); 3 4function init() { 5 var hammer = propagating(new Hammer(element)); 6}
ESM (e.g. ES6, typescript)
1import Hammer from '@egjs/hammerjs'; 2import propagating from 'propagating-hammerjs'; 3 4function init() { 5 const hammer = propagating(new Hammer(element)); 6}
Use
To extend individual hammer.js instances with event propagation:
1var hammer = propagating(new Hammer(element));
To extend the global hammer.js constructor
1Hammer = propagating(Hammer);
Examples
Here a basic usage example. More examples are available in the folder /examples.
1<!DOCTYPE html> 2<html> 3<head> 4 <script src="node_modules/@egjs/hammerjs/dist/hammer.js"></script> 5 <script src="node_muludes/propagating-hammerjs/propagating.js"></script> 6 <style> 7 div {border: 1px solid black;} 8 #parent {width: 400px; height: 400px; background: lightgreen;} 9 #child {width: 200px; height: 200px; background: yellow; margin: 10px;} 10 </style> 11</head> 12<body> 13 14<div id="parent"> 15 parent 16 <div id="child"> 17 child 18 </div> 19</div> 20 21<script> 22 var parent = document.getElementById('parent'); 23 var hammer1 = propagating(new Hammer(parent)) 24 .on('tap', function (event) { 25 alert('tap on parent'); 26 }); 27 28 var child = document.getElementById('child'); 29 var hammer2 = propagating(new Hammer(child)) 30 .on('tap', function (event) { 31 alert('tap on child'); 32 33 // stop propagation from child to parent 34 event.stopPropagation(); 35 }); 36</script> 37</body> 38</html>
API
Construction:
1propagating(hammer: Hammer.Manager, options?: { 2 preventDefault?: true | 'mouse' | 'touch' | 'pen' 3}): Hammer.Manager
parameters
-
hammer: Hammer.ManagerAn hammer instance or the global hammer constructor. -
options: ObjectAn optional object with options. Available options:preventDefault: true | 'mouse' | 'touch' | 'pen'. Optional. Enforce preventing the default browser behavior. Cannot be set tofalse.
returns
Returns the same hammer instance with extended functionality.
events
The emitted hammer.js events are extended with:
-
event.stopPropagation()If called, the event will not further propagate the elements parents.
-
event.firstTargetContains the HTML element where a gesture started (where as
event.targetcontains the element where the pointer is right now).
Develop
To generate the UMD bundle for commonjs and browser, run:
1npm run build
License
MIT
No vulnerabilities found.
Reason
no binaries found in the repo
Reason
license file detected
Details
- Info: project has a license file: LICENSE:0
- Info: FSF or OSI recognized license: MIT License: LICENSE:0
Reason
0 existing vulnerabilities detected
Reason
Found 5/22 approved changesets -- score normalized to 2
Reason
0 commit(s) and 0 issue activity found in the last 90 days -- score normalized to 0
Reason
no effort to earn an OpenSSF best practices badge detected
Reason
security policy file not detected
Details
- Warn: no security policy file detected
- Warn: no security file to analyze
- Warn: no security file to analyze
- Warn: no security file to analyze
Reason
project is not fuzzed
Details
- Warn: no fuzzer integrations found
Reason
branch protection not enabled on development/release branches
Details
- Warn: branch protection not enabled for branch 'master'
Reason
SAST tool is not run on all commits -- score normalized to 0
Details
- Warn: 0 commits out of 13 are checked with a SAST tool
Score
3.3
/10
Last Scanned on 2025-06-23
The Open Source Security Foundation is a cross-industry collaboration to improve the security of open source software (OSS). The Scorecard provides security health metrics for open source projects.
Learn More