implement pinch to zoom

This commit is contained in:
marlon-erler
2026-08-30 16:15:14 +02:00
parent ea50704f8a
commit 7eb02f07dc
160 changed files with 15806 additions and 61 deletions
+1
View File
@@ -0,0 +1 @@
node_modules
+28
View File
@@ -0,0 +1,28 @@
0.2.2 / 2014-03-06
==================
* fix require() call again
0.2.1 / 2014-03-01
==================
* make clone work in all environments FOR REAL
* change npm name to component-clone
0.2.0 / 2014-01-27
==================
* make clone work in all environments
0.1.1 / 2014-01-07
==================
* add repo field to component.json
* add tests around cloning functions
* package: fixed package.json
0.1.0 / 2012-10-18
==================
* initial release
+9
View File
@@ -0,0 +1,9 @@
REPORTER = dot
test:
@./node_modules/.bin/mocha \
--reporter $(REPORTER) \
--bail
.PHONY: test
+27
View File
@@ -0,0 +1,27 @@
# clone
Object clone supporting `date`, `regexp`, `array` and `object` types.
## Example
```js
var obj = clone({
a: 'b',
c: [
new Date(),
'tobi',
'jane'
]
})
```
## API
### clone(obj)
Clones `obj` recursively and returns it.
## License
MIT
+15
View File
@@ -0,0 +1,15 @@
{
"name": "clone",
"repo": "component/clone",
"version": "0.2.2",
"dependencies": {
"component/type": "*"
},
"devDependencies": {
"visionmedia/mocha": "*",
"guille/expect.js": "*"
},
"scripts": [
"index.js"
]
}
+57
View File
@@ -0,0 +1,57 @@
/**
* Module dependencies.
*/
var type;
try {
type = require('component-type');
} catch (_) {
type = require('type');
}
/**
* Module exports.
*/
module.exports = clone;
/**
* Clones objects.
*
* @param {Mixed} any object
* @api public
*/
function clone(obj){
switch (type(obj)) {
case 'object':
var copy = {};
for (var key in obj) {
if (obj.hasOwnProperty(key)) {
copy[key] = clone(obj[key]);
}
}
return copy;
case 'array':
var copy = new Array(obj.length);
for (var i = 0, l = obj.length; i < l; i++) {
copy[i] = clone(obj[i]);
}
return copy;
case 'regexp':
// from millermedeiros/amd-utils - MIT
var flags = '';
flags += obj.multiline ? 'm' : '';
flags += obj.global ? 'g' : '';
flags += obj.ignoreCase ? 'i' : '';
return new RegExp(obj.source, flags);
case 'date':
return new Date(obj.getTime());
default: // string, number, boolean, …
return obj;
}
}
+26
View File
@@ -0,0 +1,26 @@
{
"name": "component-clone",
"version": "0.2.2",
"dependencies": {
"component-type": "*"
},
"devDependencies": {
"mocha": "*",
"expect.js": "*"
},
"component": {
"scripts": {
"clone/index.js": "index.js"
}
},
"scripts": {
"test": "make test"
},
"repository": {
"type": "git",
"url": "https://github.com/component/clone.git"
},
"browser": {
"type": "component-type"
}
}
+80
View File
@@ -0,0 +1,80 @@
/* test dependencies */
var clone = require('..');
var expect = require('expect.js');
/* tests */
describe('clone', function(){
it('date', function(){
var obj = new Date;
var cloned = clone(obj);
expect(cloned.getTime()).to.be(obj.getTime());
expect(cloned).not.to.be(obj);
});
it('regexp', function(){
var obj = /hello/i;
var cloned = clone(obj);
expect(cloned.toString()).to.be(obj.toString());
expect(cloned).not.to.be(obj);
});
it('array', function(){
var obj = [1, 2, 3, '4'];
var cloned = clone(obj);
expect(cloned).to.eql(obj);
expect(cloned).not.to.be(obj);
});
it('object', function(){
var obj = {
a: 1,
b: 2,
c: 3
};
var cloned = clone(obj);
expect(cloned).to.eql(obj);
expect(cloned).not.to.be(obj);
});
it('object combined', function(){
var date = new Date;
var obj = {
a: {
b: [1, 2, date, { hello: 'world' }]
}
};
var cloned = clone(obj);
expect(cloned).to.eql(obj);
expect(cloned.a).not.to.be(obj.a);
expect(cloned.a.b).not.to.be(obj.a.b);
expect(cloned.a.b[2]).not.to.be(obj.a.b[2]);
expect(cloned.a.b[2].getTime()).to.be(obj.a.b[2].getTime());
expect(cloned.a.b[3]).to.eql(obj.a.b[3]);
expect(cloned.a.b[3]).not.to.be(obj.a.b[3]);
});
it('object with functions', function() {
var func = function () { return 'original'; };
var host = { fluent: func };
var cloned = clone(host);
// cloned function matches original
expect(cloned.fluent).to.be(func);
// change cloned function (no longer matches original)
cloned.fluent = function () { return 'updated'; };
expect(cloned.fluent).not.to.be(func);
expect(cloned.fluent()).to.be('updated');
// original function is still in place
expect(func()).to.be('original');
});
});
+59
View File
@@ -0,0 +1,59 @@
# Compiled source #
###################
*.com
*.class
*.dll
*.exe
*.o
*.so
# Packages #
############
# it's better to unpack these files and commit the raw source
# git has its own built in compression methods
*.7z
*.dmg
*.gz
*.iso
*.jar
*.rar
*.tar
*.zip
# Logs and databases #
######################
*.log
*.sql
*.sqlite
# OS generated files #
######################
.DS_Store*
ehthumbs.db
Icon?
Thumbs.db
# Node.js #
###########
lib-cov
*.seed
*.log
*.csv
*.dat
*.out
*.pid
*.gz
pids
logs
results
node_modules
npm-debug.log
# Components #
##############
/build
/components
/vendors
+28
View File
@@ -0,0 +1,28 @@
1.0.1 / 2016-04-01
==================
* component, package: bump matches-selector dependency to 0.1.6 (#4, @ockham)
* index: fall back to `require('component-matches-selector')` (#3, @ockham)
1.0.0 / 2015-07-15
==================
* BREAKING: rewrite to always check self. If you need the old functionality, do closest(el.parentNode, ...)
0.1.4 / 2014-07-27
==================
* test: add TextNode closest() test case
* component, package: pin "matches-selector" to v0.1.5
* component, package: fix "repository" URL
* package: rename to "component-closest" for npm
* index: fix whitespace
0.1.3 / 2014-05-27
==================
* package: add "browser" section for browserify
* package: add "author" field
* package: add "repository" field
* add `package.json` file
+5
View File
@@ -0,0 +1,5 @@
build:
component install
component build
.PHONY: build
+44
View File
@@ -0,0 +1,44 @@
# Closest
Similar to jQuery's `$.fn.closest` and `$.fn.parents`.
Finds the closest parent that matches a selector.
## API
### closest(element, selector, scope)
* `element` - will check this elements parents
* `selector` - CSS selector to match parents
* `scope` - check this element and within. By default, `document.documentElement`.
Example:
```js
closest(document.body, 'html') === document.documentElement
closest(document.body, 'body') === document.body
closest(document.documentElement, 'body') == null
```
## License
The MIT License (MIT)
Copyright (c) 2013 Jonathan Ong me@jongleberry.com
Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in
all copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
THE SOFTWARE.
+14
View File
@@ -0,0 +1,14 @@
{
"name": "closest",
"description": "Find the closest ancestor matching a selector string",
"version": "1.0.1",
"repo": "component/closest",
"dependencies": {
"component/matches-selector": "0.1.6"
},
"main": "index.js",
"scripts": [
"index.js"
],
"license": "MIT"
}
+36
View File
@@ -0,0 +1,36 @@
/**
* Module Dependencies
*/
try {
var matches = require('matches-selector')
} catch (err) {
var matches = require('component-matches-selector')
}
/**
* Export `closest`
*/
module.exports = closest
/**
* Closest
*
* @param {Element} el
* @param {String} selector
* @param {Element} scope (optional)
*/
function closest (el, selector, scope) {
scope = scope || document.documentElement;
// walk up the dom
while (el && el !== scope) {
if (matches(el, selector)) return el;
el = el.parentNode;
}
// check scope for match
return matches(el, selector) ? el : null;
}
+23
View File
@@ -0,0 +1,23 @@
{
"name": "component-closest",
"description": "Find the closest ancestor matching a selector string",
"version": "1.0.1",
"author": "Jonathan Ong",
"dependencies": {
"component-matches-selector": "~0.1.6"
},
"browser": {
"matches-selector": "component-matches-selector"
},
"component": {
"scripts": {
"closest/index.js": "index.js"
}
},
"main": "index.js",
"license": "MIT",
"repository": {
"type": "git",
"url": "git://github.com/component/closest.git"
}
}
+45
View File
@@ -0,0 +1,45 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf8">
<title>closest</title>
<script src="../build/build.js"></script>
</head>
<body>
<div id="d1">
<div id="d2">
<div id="d3">hello</div>
</div>
</div>
<script>
var closest = require('closest')
var d1 = document.querySelector('#d1')
var d2 = document.querySelector('#d2')
var d3 = document.querySelector('#d3')
var d4 = document.querySelector('#d3').cloneNode(true);
var text = d3.firstChild;
var errors = false;
assert(closest(d3, '#d2'), d2)
assert(closest(d3, '#d3'), d3)
assert(closest(d3, '#d3'), d3)
assert(closest(d3, '#d1'), d1)
assert(closest(d3, '#d1', d2), null)
assert(closest(d3, '#d1', d1), d1)
assert(closest(d4, 'body'), null)
assert(closest(document.documentElement, '*'), document.documentElement);
assert(closest(text, '#d1'), d1);
if (!errors) {
console.log('all good!');
}
function assert(el1, el2) {
if (el1 !== el2) {
errors = true;
console.log(new Error().stack)
}
}
</script>
</body>
</html>
+2
View File
@@ -0,0 +1,2 @@
components
build
+34
View File
@@ -0,0 +1,34 @@
0.2.4 / 2016-04-01
==================
* index: fall back to require('component-*') for node compat
0.2.3 / 2014-08-01
==================
* component, package: use "component/closest"
0.2.2 / 2014-05-27
==================
* add package.json file
* component: beautify "keywords"
0.2.1 / 2013-10-02
==================
* optimize closest
0.2.0 / 2013-09-30
==================
* delegate child elements, closes #3
* Fixed e.target for IE [anthonyshort]
* Use `call()` to correctly assign `this` in handler [necolas]
* remove weird dead code. Closes #4
0.1.0 / 2012-12-19
==================
* add "event" dependency for x-browser
+11
View File
@@ -0,0 +1,11 @@
build: components index.js
@component build
components: component.json
@component install --dev
clean:
rm -fr build components
.PHONY: clean
+39
View File
@@ -0,0 +1,39 @@
# delegate
Low-level event delegation component.
## Installation
$ component install component/delegate
## Example
```js
var delegate = require('delegate');
var ul = document.querySelector('ul');
var n = 0;
var fn = delegate.bind(ul, 'li a', 'click', function(e){
console.log(e.target);
console.log(e.delegateTarget); // => "<a>"
if (++n == 3) {
console.log('unbind');
delegate.unbind(ul, 'click', fn, false);
}
}, false);
```
## API
### .bind(el, selector, type, callback, [capture])
Bind and return a callback which may be passed to `.unbind()`.
### .unbind(el, type, callback, [capture])
Unbind.
## License
MIT
+19
View File
@@ -0,0 +1,19 @@
{
"name": "delegate",
"repo": "component/delegate",
"description": "Event delegation component",
"version": "0.2.4",
"keywords": [
"event",
"events",
"delegate",
"delegation"
],
"dependencies": {
"component/closest": "*",
"component/event": "*"
},
"scripts": [
"index.js"
]
}
+51
View File
@@ -0,0 +1,51 @@
/**
* Module dependencies.
*/
try {
var closest = require('closest');
} catch(err) {
var closest = require('component-closest');
}
try {
var event = require('event');
} catch(err) {
var event = require('component-event');
}
/**
* Delegate event `type` to `selector`
* and invoke `fn(e)`. A callback function
* is returned which may be passed to `.unbind()`.
*
* @param {Element} el
* @param {String} selector
* @param {String} type
* @param {Function} fn
* @param {Boolean} capture
* @return {Function}
* @api public
*/
exports.bind = function(el, selector, type, fn, capture){
return event.bind(el, type, function(e){
var target = e.target || e.srcElement;
e.delegateTarget = closest(target, selector, true, el);
if (e.delegateTarget) fn.call(el, e);
}, capture);
};
/**
* Unbind event `type`'s callback `fn`.
*
* @param {Element} el
* @param {String} type
* @param {Function} fn
* @param {Boolean} capture
* @api public
*/
exports.unbind = function(el, type, fn, capture){
event.unbind(el, type, fn, capture);
};
+28
View File
@@ -0,0 +1,28 @@
{
"name": "component-delegate",
"description": "Event delegation component",
"version": "0.2.4",
"keywords": [
"event",
"events",
"delegate",
"delegation"
],
"dependencies": {
"component-closest": "*",
"component-event": "*"
},
"browser": {
"closest": "component-closest",
"event": "component-event"
},
"component": {
"scripts": {
"delegate/index.js": "index.js"
}
},
"repository": {
"type": "git",
"url": "git://github.com/component/delegate.git"
}
}
+55
View File
@@ -0,0 +1,55 @@
<html>
<head>
<title>Event</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
</head>
<body>
<ul>
<li><a href="#">One</a></li>
<li><a href="#">Two</a></li>
<li><a href="#">Three</a></li>
</ul>
<ul id="list-two">
<li><a href="#">One</a></li>
</ul>
<ul>
<li><span>one</span></li>
</ul>
<button>Button</button>
<script src="../build/build.js"></script>
<script>
var delegate = require('delegate');
var uls = document.querySelectorAll('ul');
var n = 0;
var fn = delegate.bind(uls[0], 'li a', 'click', function(e){
console.log(e.target);
if (++n >= 3) {
console.log('unbind');
delegate.unbind(uls[0], 'click', fn, false);
}
}, false);
var fn2 = delegate.bind(uls[1], 'li a', 'click', function(e){
console.log(e.target);
if (++n >= 8) {
console.log('unbind');
delegate.unbind(uls[1], 'click', fn2, false);
}
}, false);
var fn3 = delegate.bind(uls[2], 'li', 'click', function(e){
console.log(e.target);
if (++n >= 8) {
console.log('unbind');
delegate.unbind(uls[2], 'click', fn2, false);
}
}, false);
</script>
</body>
</html>
+24
View File
@@ -0,0 +1,24 @@
(The MIT License)
Copyright (c) 2014 Component contributors <dev@component.io>
Permission is hereby granted, free of charge, to any person
obtaining a copy of this software and associated documentation
files (the "Software"), to deal in the Software without
restriction, including without limitation the rights to use,
copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the
Software is furnished to do so, subject to the following
conditions:
The above copyright notice and this permission notice shall be
included in all copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES
OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT
HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY,
WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR
OTHER DEALINGS IN THE SOFTWARE.
+74
View File
@@ -0,0 +1,74 @@
# Emitter [![Build Status](https://travis-ci.org/component/emitter.png)](https://travis-ci.org/component/emitter)
Event emitter component.
## Installation
```
$ component install component/emitter
```
## API
### Emitter(obj)
The `Emitter` may also be used as a mixin. For example
a "plain" object may become an emitter, or you may
extend an existing prototype.
As an `Emitter` instance:
```js
var Emitter = require('emitter');
var emitter = new Emitter;
emitter.emit('something');
```
As a mixin:
```js
var Emitter = require('emitter');
var user = { name: 'tobi' };
Emitter(user);
user.emit('im a user');
```
As a prototype mixin:
```js
var Emitter = require('emitter');
Emitter(User.prototype);
```
### Emitter#on(event, fn)
Register an `event` handler `fn`.
### Emitter#once(event, fn)
Register a single-shot `event` handler `fn`,
removed immediately after it is invoked the
first time.
### Emitter#off(event, fn)
* Pass `event` and `fn` to remove a listener.
* Pass `event` to remove all listeners on that event.
* Pass nothing to remove all listeners on all events.
### Emitter#emit(event, ...)
Emit an `event` with variable option args.
### Emitter#listeners(event)
Return an array of callbacks, or an empty array.
### Emitter#hasListeners(event)
Check if this emitter has `event` handlers.
## License
MIT
+175
View File
@@ -0,0 +1,175 @@
/**
* Expose `Emitter`.
*/
if (typeof module !== 'undefined') {
module.exports = Emitter;
}
/**
* Initialize a new `Emitter`.
*
* @api public
*/
function Emitter(obj) {
if (obj) return mixin(obj);
};
/**
* Mixin the emitter properties.
*
* @param {Object} obj
* @return {Object}
* @api private
*/
function mixin(obj) {
for (var key in Emitter.prototype) {
obj[key] = Emitter.prototype[key];
}
return obj;
}
/**
* Listen on the given `event` with `fn`.
*
* @param {String} event
* @param {Function} fn
* @return {Emitter}
* @api public
*/
Emitter.prototype.on =
Emitter.prototype.addEventListener = function(event, fn){
this._callbacks = this._callbacks || {};
(this._callbacks['$' + event] = this._callbacks['$' + event] || [])
.push(fn);
return this;
};
/**
* Adds an `event` listener that will be invoked a single
* time then automatically removed.
*
* @param {String} event
* @param {Function} fn
* @return {Emitter}
* @api public
*/
Emitter.prototype.once = function(event, fn){
function on() {
this.off(event, on);
fn.apply(this, arguments);
}
on.fn = fn;
this.on(event, on);
return this;
};
/**
* Remove the given callback for `event` or all
* registered callbacks.
*
* @param {String} event
* @param {Function} fn
* @return {Emitter}
* @api public
*/
Emitter.prototype.off =
Emitter.prototype.removeListener =
Emitter.prototype.removeAllListeners =
Emitter.prototype.removeEventListener = function(event, fn){
this._callbacks = this._callbacks || {};
// all
if (0 == arguments.length) {
this._callbacks = {};
return this;
}
// specific event
var callbacks = this._callbacks['$' + event];
if (!callbacks) return this;
// remove all handlers
if (1 == arguments.length) {
delete this._callbacks['$' + event];
return this;
}
// remove specific handler
var cb;
for (var i = 0; i < callbacks.length; i++) {
cb = callbacks[i];
if (cb === fn || cb.fn === fn) {
callbacks.splice(i, 1);
break;
}
}
// Remove event specific arrays for event types that no
// one is subscribed for to avoid memory leak.
if (callbacks.length === 0) {
delete this._callbacks['$' + event];
}
return this;
};
/**
* Emit `event` with the given args.
*
* @param {String} event
* @param {Mixed} ...
* @return {Emitter}
*/
Emitter.prototype.emit = function(event){
this._callbacks = this._callbacks || {};
var args = new Array(arguments.length - 1)
, callbacks = this._callbacks['$' + event];
for (var i = 1; i < arguments.length; i++) {
args[i - 1] = arguments[i];
}
if (callbacks) {
callbacks = callbacks.slice(0);
for (var i = 0, len = callbacks.length; i < len; ++i) {
callbacks[i].apply(this, args);
}
}
return this;
};
/**
* Return array of callbacks for `event`.
*
* @param {String} event
* @return {Array}
* @api public
*/
Emitter.prototype.listeners = function(event){
this._callbacks = this._callbacks || {};
return this._callbacks['$' + event] || [];
};
/**
* Check if this emitter has `event` handlers.
*
* @param {String} event
* @return {Boolean}
* @api public
*/
Emitter.prototype.hasListeners = function(event){
return !! this.listeners(event).length;
};
+28
View File
@@ -0,0 +1,28 @@
{
"name": "component-emitter",
"description": "Event emitter",
"version": "1.3.1",
"license": "MIT",
"funding": "https://github.com/sponsors/sindresorhus",
"devDependencies": {
"mocha": "*",
"should": "*"
},
"component": {
"scripts": {
"emitter/index.js": "index.js"
}
},
"main": "index.js",
"repository": {
"type": "git",
"url": "https://github.com/sindresorhus/component-emitter.git"
},
"scripts": {
"test": "make test"
},
"files": [
"index.js",
"LICENSE"
]
}
+2
View File
@@ -0,0 +1,2 @@
components
build
+28
View File
@@ -0,0 +1,28 @@
0.1.4 / 2014-05-27
==================
* component, package: add "browser" as a keyword
* package: remove "repo" field
0.1.3 / 2014-02-10
==================
* package: rename module to "component-event"
0.1.2 / 2013-12-01
==================
* package: add "repository" field
* check if addEventListener method is supported by the browser, just once
* test: update to test in IE7+
0.1.1 / 2013-08-16
==================
* fix: default `capture` to `false`
0.1.0 / 2012-12-18
==================
* add returning of the callback function
+11
View File
@@ -0,0 +1,11 @@
build: components index.js
@component build
components: component.json
@component install --dev
clean:
rm -fr build components
.PHONY: clean
+39
View File
@@ -0,0 +1,39 @@
# event
Element event binding component.
## Installation
$ component install component/event
## Example
```js
var events = require('event');
var a = document.querySelector('a');
function onclick(e) {
e.preventDefault();
console.log(e.target);
events.unbind(a, 'click', onclick);
}
events.bind(a, 'click', onclick);
```
## API
### .bind(el, type, callback, [capture])
Bind to `el`'s event `type` with `callback`,
returns the `callback` passed.
### .unbind(el, type, callback, [capture])
Unbind `el`'s event `type` `callback`,
returns the `callback` passed.
## License
MIT
+14
View File
@@ -0,0 +1,14 @@
{
"name": "event",
"repo": "component/event",
"description": "Event binding component",
"version": "0.1.4",
"keywords": [
"browser",
"event",
"events"
],
"scripts": [
"index.js"
]
}
+35
View File
@@ -0,0 +1,35 @@
var bind = window.addEventListener ? 'addEventListener' : 'attachEvent',
unbind = window.removeEventListener ? 'removeEventListener' : 'detachEvent',
prefix = bind !== 'addEventListener' ? 'on' : '';
/**
* Bind `el` event `type` to `fn`.
*
* @param {Element} el
* @param {String} type
* @param {Function} fn
* @param {Boolean} capture
* @return {Function}
* @api public
*/
exports.bind = function(el, type, fn, capture){
el[bind](prefix + type, fn, capture || false);
return fn;
};
/**
* Unbind `el` event `type`'s callback `fn`.
*
* @param {Element} el
* @param {String} type
* @param {Function} fn
* @param {Boolean} capture
* @return {Function}
* @api public
*/
exports.unbind = function(el, type, fn, capture){
el[unbind](prefix + type, fn, capture || false);
return fn;
};
+19
View File
@@ -0,0 +1,19 @@
{
"name": "component-event",
"description": "Event binding component",
"version": "0.1.4",
"keywords": [
"browser",
"event",
"events"
],
"component": {
"scripts": {
"event/index.js": "index.js"
}
},
"repository": {
"type": "git",
"url": "https://github.com/component/event.git"
}
}
+33
View File
@@ -0,0 +1,33 @@
<html>
<head>
<title>Event</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
</head>
<body>
<a href="/something">link</a>
<script src="../build/build.js"></script>
<script>
var events = require('event');
var a = document.getElementsByTagName('a')[0];
function onclick(e) {
e = e || window.e;
events.unbind(a, 'click', onclick);
console.log(e);
if (e.preventDefault) {
e.preventDefault();
} else {
return false;
}
}
events.bind(a, 'click', onclick);
</script>
</body>
</html>
+2
View File
@@ -0,0 +1,2 @@
components
build
+53
View File
@@ -0,0 +1,53 @@
1.0.10 / 2014-04-01
==================
* component, package: bump component-delegate dependency to 0.2.4
* index: Fall back to require('component-*') for node compat
1.0.9 / 2014-08-01
==================
* component, package: update "delegate" to v0.2.3
1.0.8 / 2014-07-21
==================
* component, package: update "event" to v0.1.4
1.0.7 / 2014-05-27
==================
* component, package: update "component/delegate" to v0.2.2
1.0.6 / 2014-02-10
==================
* package: rename to "component-events"
* component: update "event" to v0.1.3
1.0.5 / 2014-01-22
==================
* update deps
1.0.4 / 2013-07-28
==================
* add delegation support and inline manager
1.0.3 / 2013-05-27
==================
* pin deps
* rename for broken npm tooling
1.0.2 / 2013-01-08
==================
* fix unbind
1.0.1 / 2013-01-08
==================
* fix typo
+11
View File
@@ -0,0 +1,11 @@
build: components index.js
@component build --dev
components: component.json
@component install --dev
clean:
rm -fr build components template.js
.PHONY: clean
+112
View File
@@ -0,0 +1,112 @@
# events
Higher level dom event management with direct and delegate event handling support.
This component makes subscription management easy and unobtrusive since it does not muck with your view prototypes. Unbinding to "clean up" after your view is as simple as invoking `this.events.unbind()`, or more specific unbinds may be performed.
It's design to work with a "host" object, typically a view, that provides callbacks, making callback management much less tedious than libraries like jQuery.
## Installation
$ component install component/events
## Example
```js
var events = require('events');
var el = document.querySelector('.user');
var view = new UserView(el);
function UserView(el) {
this.events = events(el, this);
this.events.bind('click .remove', 'remove');
this.events.bind('click .hide', 'hide');
}
UserView.prototype.remove = function(){
// remove the user
this.hide();
};
UserView.prototype.hide = function(){
// hide the view
};
UserView.prototype.destroy = function(){
// clean up anything you need to
this.events.unbind();
};
```
## API
### Events(el, obj)
Initialize a new events manager targetting the
given element. Methods are delegated to `obj`.
### Events#bind(event, [method])
Bind direct event handlers or delegates with `event` and
invoke `method` when the event occurs, passing the event object.
When `method` is not defined the `event` name prefixed with "on" is used.
For example the following will invoke `onmousedown`, `onmousemove`,
and `onmouseup`:
```js
events.bind('mousedown')
events.bind('mousemove')
events.bind('mouseup')
```
Alternatively you may specify the `method` name:
```js
events.bind('click', 'toggleDisplay')
```
To use event delegation simply pass a selector after the
event name as shown here:
```js
events.bind('click .remove', 'remove')
events.bind('click .close', 'hide')
```
You may bind to the same element with several events if necessary,
for example here perhaps `.remove()` does not manually invoke `.hide()`:
```js
events.bind('click .remove', 'remove')
events.bind('click .remove', 'hide')
events.bind('click .close', 'hide')
```
Addition arguments are passed to the callee, which
is helpful for slight variations of a method, for
example sorting:
```js
events.bind('click .sort-asc', 'sort', 'asc')
events.bind('click .sort-dsc', 'sort', 'dsc')
```
### Events.unbind([event], [method])
There are three flavours of unbinding -- you may unbind _all_
event handlers, all specific to `event`, or all specific to
`event` and the given `method`. For example these are all valid:
```js
events.unbind('click', 'remove')
events.unbind('click', 'hide')
events.unbind('click')
events.unbind()
```
## License
MIT
+20
View File
@@ -0,0 +1,20 @@
{
"name": "events",
"repo": "component/events",
"description": "Higher level dom event management",
"version": "1.0.10",
"keywords": [
"event",
"events",
"subscriptions"
],
"dependencies": {
"component/event": "0.1.4",
"component/delegate": "0.2.4"
},
"development": {},
"license": "MIT",
"scripts": [
"index.js"
]
}
+45
View File
@@ -0,0 +1,45 @@
<html>
<head>
<title>Events</title>
<style>
body {
padding: 150px;
}
ul li {
padding: 5px;
}
</style>
</head>
<body>
<ul>
<li><a href="#">One</a></li>
<li><a href="#">Two</a></li>
<li><a href="#">Three</a></li>
</ul>
<button onclick="unbind()">Unbind</button>
<script src="../build/build.js"></script>
<script>
var Events = require('events');
var ul = document.querySelector('ul');
var events = Events(ul, {
onclick: function(e){
alert('clicked ' + e.target.textContent)
},
first: function(e){
alert('clicked the first');
}
});
events.bind('click li > a');
events.bind('click li:first-child > a', 'first');
function unbind() {
events.unbind('click', 'onclick');
// events.unbind('click');
// events.unbind();
}
</script>
</body>
</html>
+26
View File
@@ -0,0 +1,26 @@
<html>
<head>
<title>Events</title>
</head>
<body>
<button>Click me</button>
<button onclick="unbind()">Unbind</button>
<script src="../build/build.js"></script>
<script>
var Events = require('events');
var button = document.querySelector('button');
var events = Events(button, {
onclick: function(){
alert('clicked')
}
});
events.bind('click');
function unbind() {
events.unbind();
}
</script>
</body>
</html>
+26
View File
@@ -0,0 +1,26 @@
<html>
<head>
<title>Events</title>
</head>
<body>
<button>Click me</button>
<button onclick="unbind()">Unbind</button>
<script src="../build/build.js"></script>
<script>
var Events = require('events');
var button = document.querySelector('button');
var events = Events(button, {
remove: function(){
alert('removed')
}
});
events.bind('click', 'remove');
function unbind() {
events.unbind();
}
</script>
</body>
</html>
+185
View File
@@ -0,0 +1,185 @@
/**
* Module dependencies.
*/
try {
var events = require('event');
} catch(err) {
var events = require('component-event');
}
try {
var delegate = require('delegate');
} catch(err) {
var delegate = require('component-delegate');
}
/**
* Expose `Events`.
*/
module.exports = Events;
/**
* Initialize an `Events` with the given
* `el` object which events will be bound to,
* and the `obj` which will receive method calls.
*
* @param {Object} el
* @param {Object} obj
* @api public
*/
function Events(el, obj) {
if (!(this instanceof Events)) return new Events(el, obj);
if (!el) throw new Error('element required');
if (!obj) throw new Error('object required');
this.el = el;
this.obj = obj;
this._events = {};
}
/**
* Subscription helper.
*/
Events.prototype.sub = function(event, method, cb){
this._events[event] = this._events[event] || {};
this._events[event][method] = cb;
};
/**
* Bind to `event` with optional `method` name.
* When `method` is undefined it becomes `event`
* with the "on" prefix.
*
* Examples:
*
* Direct event handling:
*
* events.bind('click') // implies "onclick"
* events.bind('click', 'remove')
* events.bind('click', 'sort', 'asc')
*
* Delegated event handling:
*
* events.bind('click li > a')
* events.bind('click li > a', 'remove')
* events.bind('click a.sort-ascending', 'sort', 'asc')
* events.bind('click a.sort-descending', 'sort', 'desc')
*
* @param {String} event
* @param {String|function} [method]
* @return {Function} callback
* @api public
*/
Events.prototype.bind = function(event, method){
var e = parse(event);
var el = this.el;
var obj = this.obj;
var name = e.name;
var method = method || 'on' + name;
var args = [].slice.call(arguments, 2);
// callback
function cb(){
var a = [].slice.call(arguments).concat(args);
obj[method].apply(obj, a);
}
// bind
if (e.selector) {
cb = delegate.bind(el, e.selector, name, cb);
} else {
events.bind(el, name, cb);
}
// subscription for unbinding
this.sub(name, method, cb);
return cb;
};
/**
* Unbind a single binding, all bindings for `event`,
* or all bindings within the manager.
*
* Examples:
*
* Unbind direct handlers:
*
* events.unbind('click', 'remove')
* events.unbind('click')
* events.unbind()
*
* Unbind delegate handlers:
*
* events.unbind('click', 'remove')
* events.unbind('click')
* events.unbind()
*
* @param {String|Function} [event]
* @param {String|Function} [method]
* @api public
*/
Events.prototype.unbind = function(event, method){
if (0 == arguments.length) return this.unbindAll();
if (1 == arguments.length) return this.unbindAllOf(event);
// no bindings for this event
var bindings = this._events[event];
if (!bindings) return;
// no bindings for this method
var cb = bindings[method];
if (!cb) return;
events.unbind(this.el, event, cb);
};
/**
* Unbind all events.
*
* @api private
*/
Events.prototype.unbindAll = function(){
for (var event in this._events) {
this.unbindAllOf(event);
}
};
/**
* Unbind all events for `event`.
*
* @param {String} event
* @api private
*/
Events.prototype.unbindAllOf = function(event){
var bindings = this._events[event];
if (!bindings) return;
for (var method in bindings) {
this.unbind(event, method);
}
};
/**
* Parse `event`.
*
* @param {String} event
* @return {Object}
* @api private
*/
function parse(event) {
var parts = event.split(/ +/);
return {
name: parts.shift(),
selector: parts.join(' ')
}
}
+21
View File
@@ -0,0 +1,21 @@
{
"name": "component-events",
"version": "1.0.10",
"dependencies": {
"component-event": "0.1.4",
"component-delegate": "0.2.4"
},
"component": {
"scripts": {
"events/index.js": "index.js"
}
},
"browser": {
"delegate": "component-delegate",
"event": "component-event"
},
"repository": {
"type": "git",
"url": "https://github.com/component/events.git"
}
}
+2
View File
@@ -0,0 +1,2 @@
components
build
+42
View File
@@ -0,0 +1,42 @@
0.1.7 / 2019-04-21
==================
* using global-object to get `global.Element` so this code can be safely run inside of non-browser environments (#16, @antialias)
0.1.6 / 2016-04-01
==================
* index: fall back to `require('component-query')` (#15, @ockham)
0.1.5 / 2014-07-27
==================
* index: don't throw an Error when given falsey or non-Element nodes
0.1.4 / 2014-05-27
==================
* force re-publish since something happened with npm
0.1.3 / 2014-05-27
==================
* package: add "browser" field for browserify
0.1.2 / 2014-02-10
==================
* package: pin "component-query" version
* package: add `package.json` file
* component: beautify "keywords"
0.1.1 / 2013-10-15
==================
* use `query.all()` not `query()`
* use `proto.matches`
0.1.0 / 2013-04-15
==================
* use component/query to support fallbacks
+11
View File
@@ -0,0 +1,11 @@
build: components index.js
@component build --dev
components: component.json
@component install --dev
clean:
rm -fr build components template.js
.PHONY: clean
+20
View File
@@ -0,0 +1,20 @@
# matches-selector
Check if an element matches a given selector.
## Installation
$ component install component/matches-selector
## Example
```js
var matches = require('matches-selector');
matches(el, 'ul li a');
// => true
```
## License
MIT
+20
View File
@@ -0,0 +1,20 @@
{
"name": "matches-selector",
"repo": "component/matches-selector",
"description": "Check if an element matches a given selector",
"version": "0.1.7",
"keywords": [
"match",
"element",
"selector"
],
"dependencies": {
"component/query": "*"
},
"development": {
"component/domify": "*"
},
"scripts": [
"index.js"
]
}
+51
View File
@@ -0,0 +1,51 @@
/**
* Module dependencies.
*/
try {
var query = require('query');
} catch (err) {
var query = require('component-query');
}
/**
* Element prototype.
*/
var Element = require('global-object').Element;
var proto = Element && Element.prototype || {};
/**
* Vendor function.
*/
var vendor = proto.matches
|| proto.webkitMatchesSelector
|| proto.mozMatchesSelector
|| proto.msMatchesSelector
|| proto.oMatchesSelector;
/**
* Expose `match()`.
*/
module.exports = match;
/**
* Match `el` to `selector`.
*
* @param {Element} el
* @param {String} selector
* @return {Boolean}
* @api public
*/
function match(el, selector) {
if (!el || el.nodeType !== 1) return false;
if (vendor) return vendor.call(el, selector);
var nodes = query.all(selector, el.parentNode);
for (var i = 0; i < nodes.length; ++i) {
if (nodes[i] == el) return true;
}
return false;
}
+22
View File
@@ -0,0 +1,22 @@
{
"name": "component-matches-selector",
"version": "0.1.7",
"description": "Check if an element matches a given selector",
"keywords": [
"match",
"element",
"selector"
],
"repository": {
"type": "git",
"url": "git://github.com/component/matches-selector.git"
},
"dependencies": {
"component-query": "*",
"global-object": "^1.0.0"
},
"browser": {
"query": "component-query"
},
"license": "MIT"
}
+17
View File
@@ -0,0 +1,17 @@
<html>
<head>
<title>Mocha</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<link rel="stylesheet" href="mocha.css" />
</head>
<body>
<div id="mocha"></div>
<script src="mocha.js"></script>
<script>mocha.setup('bdd')</script>
<script src="../build/build.js"></script>
<script src="tests.js"></script>
<script>
mocha.run();
</script>
</body>
</html>
+199
View File
@@ -0,0 +1,199 @@
@charset "UTF-8";
body {
font: 20px/1.5 "Helvetica Neue", Helvetica, Arial, sans-serif;
padding: 60px 50px;
}
#mocha ul, #mocha li {
margin: 0;
padding: 0;
}
#mocha ul {
list-style: none;
}
#mocha h1, #mocha h2 {
margin: 0;
}
#mocha h1 {
margin-top: 15px;
font-size: 1em;
font-weight: 200;
}
#mocha h1 a {
text-decoration: none;
color: inherit;
}
#mocha h1 a:hover {
text-decoration: underline;
}
#mocha .suite .suite h1 {
margin-top: 0;
font-size: .8em;
}
#mocha h2 {
font-size: 12px;
font-weight: normal;
cursor: pointer;
}
#mocha .suite {
margin-left: 15px;
}
#mocha .test {
margin-left: 15px;
}
#mocha .test:hover h2::after {
position: relative;
top: 0;
right: -10px;
content: '(view source)';
font-size: 12px;
font-family: arial;
color: #888;
}
#mocha .test.pending:hover h2::after {
content: '(pending)';
font-family: arial;
}
#mocha .test.pass.medium .duration {
background: #C09853;
}
#mocha .test.pass.slow .duration {
background: #B94A48;
}
#mocha .test.pass::before {
content: '✓';
font-size: 12px;
display: block;
float: left;
margin-right: 5px;
color: #00d6b2;
}
#mocha .test.pass .duration {
font-size: 9px;
margin-left: 5px;
padding: 2px 5px;
color: white;
-webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.2);
-moz-box-shadow: inset 0 1px 1px rgba(0,0,0,.2);
box-shadow: inset 0 1px 1px rgba(0,0,0,.2);
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
-ms-border-radius: 5px;
-o-border-radius: 5px;
border-radius: 5px;
}
#mocha .test.pass.fast .duration {
display: none;
}
#mocha .test.pending {
color: #0b97c4;
}
#mocha .test.pending::before {
content: '◦';
color: #0b97c4;
}
#mocha .test.fail {
color: #c00;
}
#mocha .test.fail pre {
color: black;
}
#mocha .test.fail::before {
content: '✖';
font-size: 12px;
display: block;
float: left;
margin-right: 5px;
color: #c00;
}
#mocha .test pre.error {
color: #c00;
}
#mocha .test pre {
display: inline-block;
font: 12px/1.5 monaco, monospace;
margin: 5px;
padding: 15px;
border: 1px solid #eee;
border-bottom-color: #ddd;
-webkit-border-radius: 3px;
-webkit-box-shadow: 0 1px 3px #eee;
}
#report.pass .test.fail {
display: none;
}
#report.fail .test.pass {
display: none;
}
#error {
color: #c00;
font-size: 1.5 em;
font-weight: 100;
letter-spacing: 1px;
}
#stats {
position: fixed;
top: 15px;
right: 10px;
font-size: 12px;
margin: 0;
color: #888;
}
#stats .progress {
float: right;
padding-top: 0;
}
#stats em {
color: black;
}
#stats a {
text-decoration: none;
color: inherit;
}
#stats a:hover {
border-bottom: 1px solid #eee;
}
#stats li {
display: inline-block;
margin: 0 5px;
list-style: none;
padding-top: 11px;
}
code .comment { color: #ddd }
code .init { color: #2F6FAD }
code .string { color: #5890AD }
code .keyword { color: #8A6343 }
code .number { color: #2F6FAD }
File diff suppressed because it is too large Load Diff
+35
View File
@@ -0,0 +1,35 @@
var matches = require('matches-selector')
, domify = require('domify');
function assert(expr) {
if (!expr) throw new Error('assertion failed');
}
var ul = domify('<ul><li><em>foo</em></li></ul>');
var li = ul.children[0];
var em = li.children[0];
describe('matchesSelector(el, selector)', function(){
it('should work', function(){
assert(true === matches(em, 'ul li em'));
assert(true === matches(em, 'ul em'));
assert(true === matches(em, 'ul > li > em'));
assert(false === matches(em, 'ul ul em'));
assert(true === matches(li, 'ul li'));
assert(true === matches(li, 'ul > li'));
assert(true === matches(li, 'li'));
assert(false === matches(li, 'div > li'));
assert(true == matches(ul, 'ul'));
assert(false == matches(ul, 'div ul'));
assert(false == matches(ul, 'body > ul'));
})
it('should not throw an Error when given `null`', function(){
assert(false == matches(null, 'ul'));
})
it('should not throw an Error when given a TextNode', function(){
assert(false == matches(em.firstChild, 'ul'));
})
})
+2
View File
@@ -0,0 +1,2 @@
components
build
+18
View File
@@ -0,0 +1,18 @@
0.0.3 / 2014-02-10
==================
* package: rename to "component-query"
* package: add "component" section
* component: beautify "keywords"
0.0.2 / 2013-11-01
==================
* return exports on `exports.engine()`
* add `package.json` file
0.0.1 / 2013-03-14
==================
* initial commit
+11
View File
@@ -0,0 +1,11 @@
build: components index.js
@component build --dev
components: component.json
@component install --dev
clean:
rm -fr build components template.js
.PHONY: clean
+42
View File
@@ -0,0 +1,42 @@
# query
Query the DOM with selector engine fallback support. This abstraction
allows all other components that require dom querying to indirectly support
old browsers, without explicitly adding support for them.
## Installation
$ component install component/query
## API
### query(selector, [el])
Query `selector` against the document or `el`
and return a single match.
```js
query('ul > li');
query('ul > li', articles);
```
### query.all(selector, [el])
Query `selector` against the document or `el`
and return all matches.
```js
query.all('ul > li');
query.all('ul > li', articles);
```
## Fallback engines
Currently supported:
- [query-zest](https://github.com/component/query-zest)
- [query-qwery](https://github.com/jamischarles/query-qwery)
## License
MIT
+21
View File
@@ -0,0 +1,21 @@
{
"name": "query",
"repo": "component/query",
"description": "Query the DOM with selector engine fallback support",
"version": "0.0.3",
"keywords": [
"query",
"selector",
"engine",
"dom",
"elements"
],
"dependencies": {},
"development": {
"component/assert": "*"
},
"license": "MIT",
"scripts": [
"index.js"
]
}
+19
View File
@@ -0,0 +1,19 @@
<html>
<head>
<title>Query</title>
</head>
<body>
<ul>
<li>one</li>
<li>two</li>
<li>three</li>
</ul>
<script src="build/build.js"></script>
<script>
var query = require('query');
console.log(query('ul > li'));
console.log(query.all('ul > li'));
</script>
</body>
</html>
+21
View File
@@ -0,0 +1,21 @@
function one(selector, el) {
return el.querySelector(selector);
}
exports = module.exports = function(selector, el){
el = el || document;
return one(selector, el);
};
exports.all = function(selector, el){
el = el || document;
return el.querySelectorAll(selector);
};
exports.engine = function(obj){
if (!obj.one) throw new Error('.one callback required');
if (!obj.all) throw new Error('.all callback required');
one = obj.one;
exports.all = obj.all;
return exports;
};
+24
View File
@@ -0,0 +1,24 @@
{
"name": "component-query",
"description": "Query the DOM with selector engine fallback support",
"version": "0.0.3",
"keywords": [
"query",
"selector",
"engine",
"dom",
"elements"
],
"dependencies": {},
"license": "MIT",
"main": "index.js",
"repository": {
"type": "git",
"url": "https://github.com/component/query.git"
},
"component": {
"scripts": {
"query/index.js": "index.js"
}
}
}
+2
View File
@@ -0,0 +1,2 @@
components
build
+26
View File
@@ -0,0 +1,26 @@
1.2.0 / 2014-09-14
==================
* remove never implemented -o and -ms prefixes (@darsain)
1.1.3 / 2014-02-11
==================
* package: rename to "component-raf"
* package: add "main" field
1.1.2 / 2013-07-12
==================
* fix .cancel() with fallback #4 @ilsken
1.1.1 / 2013-07-12
==================
* fix .cancel(), bitches when window is not the receiver...
1.1.0 / 2013-07-12
==================
* add .cancel(id)
+11
View File
@@ -0,0 +1,11 @@
build: components index.js
@component build --dev
components:
@component install --dev
clean:
rm -fr build components template.js
.PHONY: clean
+46
View File
@@ -0,0 +1,46 @@
# raf
request animation frame
## Installation
$ component install component/raf
## Example
Request the animation frame with `raf(fn)`, cancel with `raf.cancel(id)`.
```js
var x = 0;
var y = 50;
var canvas = document.querySelector('canvas');
var ctx = canvas.getContext('2d');
var raf = require('raf');
function animate() {
raf(animate);
draw();
}
var prev = Date.now();
function draw() {
var curr = Date.now();
var diff = curr - prev;
var p = diff / 16;
ctx.clearRect(0, 0, 900, 300);
ctx.beginPath();
ctx.globalAlpha = .5;
ctx.arc(x, y, 10, 0, Math.PI * 2, false);
ctx.fill();
x += 2;
y += Math.sin(x/20) * 5;
prev = curr;
}
animate();
```
## License
MIT
+16
View File
@@ -0,0 +1,16 @@
{
"name": "raf",
"repo": "component/raf",
"description": "request animation frame",
"version": "1.2.0",
"keywords": [
"animate",
"requestAnimationFrame",
"performance"
],
"dependencies": {},
"development": {},
"scripts": [
"index.js"
]
}
+43
View File
@@ -0,0 +1,43 @@
<style>
body {
padding: 50px;
}
canvas {
border: 1px solid #eee;
}
</style>
<script src="build/build.js"></script>
<canvas width=900 height=300></canvas>
<script>
var x = 0;
var y = 50;
var canvas = document.querySelector('canvas');
var ctx = canvas.getContext('2d');
var raf = require('raf');
function animate() {
raf(animate);
draw();
}
var prev = Date.now();
function draw() {
var curr = Date.now();
var diff = curr - prev;
var p = diff / 16;
ctx.clearRect(0, 0, 900, 300);
ctx.beginPath();
ctx.globalAlpha = .5;
ctx.arc(x, y, 10, 0, Math.PI * 2, false);
ctx.fill();
x += 2;
y += Math.sin(x/20) * 5;
prev = curr;
}
animate();
</script>
+34
View File
@@ -0,0 +1,34 @@
/**
* Expose `requestAnimationFrame()`.
*/
exports = module.exports = window.requestAnimationFrame
|| window.webkitRequestAnimationFrame
|| window.mozRequestAnimationFrame
|| fallback;
/**
* Fallback implementation.
*/
var prev = new Date().getTime();
function fallback(fn) {
var curr = new Date().getTime();
var ms = Math.max(0, 16 - (curr - prev));
var req = setTimeout(fn, ms);
prev = curr;
return req;
}
/**
* Cancel.
*/
var cancel = window.cancelAnimationFrame
|| window.webkitCancelAnimationFrame
|| window.mozCancelAnimationFrame
|| window.clearTimeout;
exports.cancel = function(id){
cancel.call(window, id);
};
+21
View File
@@ -0,0 +1,21 @@
{
"name": "component-raf",
"description": "request animation frame",
"version": "1.2.0",
"keywords": [
"animate",
"requestAnimationFrame",
"performance"
],
"dependencies": {},
"component": {
"scripts": {
"raf/index.js": "index.js"
}
},
"main": "index.js",
"repository": {
"type": "git",
"url": "https://github.com/component/raf.git"
}
}
+22
View File
@@ -0,0 +1,22 @@
The MIT License (MIT)
Copyright (c) 2015 Jonathan Ong me@jongleberry.com
Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in
all copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
THE SOFTWARE.
+63
View File
@@ -0,0 +1,63 @@
# Tap Event
[![Build Status](https://secure.travis-ci.org/chemzqm/tap-event.svg)](http://travis-ci.org/chemzqm/tap-event)
Make your `touchstart` event listeners into a `tap` event listener!
What is "correct" behavior? The `tap` event:
- shouldn't be triggered until the user removes his/her finger from the surface of the screen.
- shouldn't be triggered when the user moves his/her finger at all (ie it should not interfere with drag events).
- shouldn't be triggered if there's ever more than a single finger on the surface at all.
- should never trigger the `click` event.
Preserve context and arguments in 1.1.0, works with delegate easily
## Install
npm install component-tap-event -S
## API
```js
var tap = require('tap-event')
var el = document.querySelector('#container')
// the event you want to handle
function changeLocation(e) {
// e.preventDefault() is already called!
location.href = this.href
}
// wrap the listener
var listener = tap(changeLocation)
// listen to `touchstart`
el.addEventListener('touchstart', listener)
// remove the listener
el.removeEventListener('touchstart', listener)
```
or, more succinctly:
```js
document.querySelector('#container').addEventListener('touchstart', tap(function (e) {
location.href = this.href
}))
```
To set a custom timeout (default is `200ms`), you have two options:
```js
// set globally
tap.timeout = 300
// set per instance
tap(function (e) {
}, {
timeout: 300
})
```
+87
View File
@@ -0,0 +1,87 @@
var endEvents = [
'touchend'
]
module.exports = Tap
// default tap timeout in ms
Tap.timeout = 200
function Tap(callback, options) {
options = options || {}
// if the user holds his/her finger down for more than 200ms,
// then it's not really considered a tap.
// however, you can make this configurable.
var timeout = options.timeout || Tap.timeout
// to keep track of the original listener
listener.handler = callback
return listener
// el.addEventListener('touchstart', listener)
function listener(e1) {
// tap should only happen with a single finger
if (!e1.touches || e1.touches.length > 1) return
var el = e1.target
var context = this
var args = arguments;
var timeout_id = setTimeout(cleanup, timeout)
el.addEventListener('touchmove', cleanup)
endEvents.forEach(function (event) {
el.addEventListener(event, done)
})
function done(e2) {
// since touchstart is added on the same tick
// and because of bubbling,
// it'll execute this on the same touchstart.
// this filters out the same touchstart event.
if (e1 === e2) return
cleanup()
// already handled
if (e2.defaultPrevented) return
// overwrite these functions so that they all to both start and events.
var preventDefault = e1.preventDefault
var stopPropagation = e1.stopPropagation
e1.stopPropagation = function () {
stopPropagation.call(e1)
stopPropagation.call(e2)
}
e1.preventDefault = function () {
//preventDefault.call(e1)
preventDefault.call(e2)
}
// calls the handler with the `end` event,
// but i don't think it matters.
callback.apply(context, args)
}
// cleanup end events
// to cancel the tap, just run this early
function cleanup(e2) {
// if it's the same event as the origin,
// then don't actually cleanup.
// hit issues with this - don't remember
if (e1 === e2) return
clearTimeout(timeout_id)
el.removeEventListener('touchmove', cleanup)
endEvents.forEach(function (event) {
el.removeEventListener(event, done)
})
}
}
}
+38
View File
@@ -0,0 +1,38 @@
{
"name": "component-tap-event",
"description": "Create tap event listeners",
"version": "1.1.4",
"license": "MIT",
"repository": "https://github.com/chemzqm/tap-event",
"keywords": [
"tap",
"event",
"listener"
],
"main": "index.js",
"files": [
"index.js"
],
"devDependencies": {
"coveralls": "^2.11.4",
"istanbul": "^0.4.0",
"istanbul-instrumenter-loader": "^0.2.0",
"karma": "^0.13.15",
"karma-cli": "^0.1.1",
"karma-coverage": "^0.5.3",
"karma-firefox-launcher": "^0.1.7",
"karma-mocha": "^0.2.0",
"karma-webpack": "^1.7.0",
"karma-wrap-preprocessor": "^0.1.0",
"mocha": "^2.3.3",
"mocha-loader": "^0.7.1",
"standardberry": "^3.5.1",
"touch-simulate": "^0.1.1",
"webpack": "^1.12.4",
"webpack-dev-server": "^1.12.1"
},
"scripts": {
"test": "make test-karma"
},
"browser": {}
}
+2
View File
@@ -0,0 +1,2 @@
components
build
+27
View File
@@ -0,0 +1,27 @@
1.2.0 / 2015-03-16
==================
* update "emitter" to v1.2.0
* use "component-clone" and "component-type" for browsers support (#5, @cristiandouce)
* update component.json (#4, @pgherveou)
* package: add browserify mappings (#7, @dfcreative)
* package: add "repository" field (#3)
1.1.0 / 2013-05-29
==================
* add Tween#stop(). Closes #2
* fix final update to complete the tween. Closes #1
1.0.0 / 2013-05-27
==================
* pin deps
* add package.json
* add interactive example
0.1.0 / 2012-11-10
==================
* add array tweening support
+16
View File
@@ -0,0 +1,16 @@
build: components index.js
@component build --dev
components: component.json
@component install --dev
clean:
rm -fr build components template.js
tween.js:
@component build --standalone tween \
&& mv build/build.js $@ \
&& rm -fr build
.PHONY: clean tween.js
+78
View File
@@ -0,0 +1,78 @@
# tween
Motion tween component using [ease](https://github.com/component/ease).
## Installation
$ component install component/tween
## Example
```js
var Tween = require('tween');
var raf = require('raf');
var button = document.querySelector('button');
var tween = Tween({ rotate: 0, opacity: 0 })
.ease('out-bounce')
.to({ rotate: 360, opacity: 1 })
.duration(800);
tween.update(function(o){
button.style.opacity = o.opacity;
button.style.webkitTransform = 'rotate(' + (o.rotate | 0) + 'deg)';
});
tween.on('end', function(){
animate = function(){};
});
function animate() {
raf(animate);
tween.update();
}
animate();
```
## API
### Tween(obj:Object|Array)
Initialize a new `Tween` with `obj`.
### Tween#reset()
Reset the tween.
### Tween#to(obj:Object|Array)
Tween to `obj` and reset internal state.
tween.to({ x: 50, y: 100 })
### Tween#duration(ms:Number)
Set duration to `ms` [500].
### Tween#ease(fn:String|Function)
Set easing function to `fn`.
tween.ease('in-out-sine')
### Tween#update(fn:Function)
Set update function to `fn` or
when no argument is given this performs
a "step".
### Tween#stop()
Immediately stop the tween and emit "stop" and end" events. `tween.stopped`
is then marked as `true`.
## License
MIT
+25
View File
@@ -0,0 +1,25 @@
{
"name": "tween",
"repo": "component/tween",
"description": "Motion tween engine using 'ease'",
"version": "1.2.0",
"keywords": [
"tween",
"tweening",
"animation"
],
"dependencies": {
"component/clone": "0.2.2",
"component/ease": "1.0.0",
"component/emitter": "1.2.0",
"component/type": "1.1.0"
},
"development": {
"component/raf": "*",
"component/autoscale-canvas": "*"
},
"license": "MIT",
"scripts": [
"index.js"
]
}
+48
View File
@@ -0,0 +1,48 @@
<style>
canvas {
border: 1px solid #eee;
}
</style>
<script src="../build/build.js"></script>
<canvas width=1000 height=500></canvas>
<script>
var Tween = require('tween');
var raf = require('component-raf');
var canvas = document.querySelector('canvas');
var ctx = canvas.getContext('2d');
var h = 500;
function random(n, f) {
var arr = [];
while (n--) arr.push(Math.random() * f);
return arr;
}
var tween = Tween(random(1000, 50))
.ease('out-bounce')
.to(random(1000, 400))
.duration(800);
tween.update(function(a){
canvas.width = canvas.width;
ctx.fillStyle = '#0070ff';
for (var i = 0; i < a.length; i++) {
ctx.fillRect(i, h - a[i], 1, a[i]);
}
});
tween.on('end', function(){
animate = function(){};
});
function animate() {
raf(animate);
tween.update();
}
animate();
</script>
+64
View File
@@ -0,0 +1,64 @@
<style>
canvas {
border: 1px solid #eee;
}
</style>
<script src="../build/build.js"></script>
<canvas width=500 height=400></canvas>
<script>
var Tween = require('tween');
var raf = require('component-raf');
var canvas = document.querySelector('canvas');
var ctx = canvas.getContext('2d');
var w = canvas.width, h = canvas.height;
var tween = Tween({ x: w/2, y: 20, r: 10, a: .5 })
.ease('out-bounce')
.to({ x: w/2, y: h-8, r: 10, a: .5 })
.duration(2000);
tween.update(function(o){
canvas.width = canvas.width;
ctx.fillStyle = 'red';
ctx.globalAlpha = o.a;
ctx.arc(o.x | 0, o.y | 0, o.r, 0, Math.PI * 2, false);
ctx.fill();
});
var n = 0;
tween.on('end', function(){
switch (n++) {
case 0:
tween
.to({ x: w/2, y: 20, r: 10, a: .5 })
.ease('out-sine')
.duration(500);
break;
case 1:
tween
.to({ x: w/2, y: h/2, r: 10, a: .5 })
.ease('in-out-back')
.duration(800);
break;
case 2:
tween
.to({ x: w/2, y: h/2, r: 80, a: 1 })
.ease('out-bounce')
.duration(1500);
break;
default:
animate = function(){};
}
});
function animate() {
raf(animate);
tween.update();
}
animate();
</script>
+45
View File
@@ -0,0 +1,45 @@
<style>
canvas {
border: 1px solid #eee;
}
</style>
<script src="../build/build.js"></script>
<canvas width=500 height=400></canvas>
<button onclick='tween.stop()'>Stop</button>
<script>
var Tween = require('tween');
var raf = require('component-raf');
var canvas = document.querySelector('canvas');
var ctx = canvas.getContext('2d');
var tween = Tween({ alpha: 0, border: 1, radius: 1 })
.ease('out-bounce')
.to({ alpha: 1, border: 15, radius: 150 })
.duration(1000);
tween.update(function(o){
canvas.width = canvas.width;
ctx.strokeStyle = 'black';
ctx.globalAlpha = o.alpha;
ctx.lineWidth = o.border;
ctx.arc(canvas.width / 2, canvas.height / 2, o.radius, 0, Math.PI * 2, false);
ctx.stroke();
ctx.fill();
});
tween.on('end', function(){
animate = function(){};
});
function animate() {
raf(animate);
tween.update();
}
animate();
</script>
+41
View File
@@ -0,0 +1,41 @@
<style>
body {
padding: 50px;
}
button {
padding: 15px 25px;
}
</style>
<button>Button</button>
<script src="../build/build.js"></script>
<script>
var Tween = require('tween');
var raf = require('component-raf');
var button = document.querySelector('button');
var tween = Tween({ rotate: 0, opacity: 0 })
.ease('out-bounce')
.to({ rotate: 360, opacity: 1 })
.duration(800);
tween.update(function(o){
button.style.opacity = o.opacity;
button.style.webkitTransform = 'rotate(' + (o.rotate | 0) + 'deg)';
});
tween.on('end', function(){
animate = function(){};
});
function animate() {
raf(animate);
tween.update();
}
animate();
</script>
+62
View File
@@ -0,0 +1,62 @@
<style>
canvas {
border: 1px solid #eee;
}
</style>
<script src="../build/build.js"></script>
<canvas width=500 height=400></canvas>
<script>
var Tween = require('tween');
var raf = require('component-raf');
var canvas = document.querySelector('canvas');
var ctx = canvas.getContext('2d');
var w = canvas.width, h = canvas.height;
function Ball(x, y) {
this.moveTo(x, y);
this.rad = 10;
}
Ball.prototype.moveTo = function(x, y){
this.x = x;
this.y = y;
};
Ball.prototype.draw = function(ctx){
ctx.save();
ctx.fillStyle = 'red';
ctx.arc(this.x | 0, this.y | 0, this.rad, 0, Math.PI * 2, false);
ctx.fill();
ctx.restore();
};
var ball = new Ball(100, 100);
ball.draw(ctx);
canvas.onclick = function(e){
console.log('move');
var tween = Tween({ x: ball.x, y: ball.y })
.ease('out-bounce')
.to({ x: e.offsetX, y: e.offsetY })
.duration(1500);
tween.update(function(o){
canvas.width = canvas.width;
ball.moveTo(o.x, o.y);
ball.draw(ctx);
});
function animate() {
raf(animate);
tween.update();
}
animate();
};
</script>
+43
View File
@@ -0,0 +1,43 @@
<style>
canvas {
border: 1px solid #eee;
}
</style>
<script src="../build/build.js"></script>
<canvas width=500 height=400></canvas>
<script>
var Tween = require('tween');
var raf = require('component-raf');
var canvas = document.querySelector('canvas');
var ctx = canvas.getContext('2d');
var tween = Tween({ w: 1, h: 1, border: 1, alpha: 0 })
.ease('out-circ')
.to({ border: 5, w: 150, h: 100, alpha: 1 })
.duration(800);
tween.update(function(o){
canvas.width = canvas.width;
ctx.strokeStyle = 'black';
ctx.globalAlpha = o.alpha;
ctx.lineWidth = o.border;
ctx.rect(canvas.width / 2 - o.w / 2, canvas.height / 2 - o.h / 2, o.w, o.h);
ctx.stroke();
ctx.fill();
});
tween.on('end', function(){
animate = function(){};
});
function animate() {
raf(animate);
tween.update();
}
animate();
</script>
+178
View File
@@ -0,0 +1,178 @@
/**
* Module dependencies.
*/
var Emitter = require('emitter');
var clone = require('clone');
var type = require('type');
var ease = require('ease');
/**
* Expose `Tween`.
*/
module.exports = Tween;
/**
* Initialize a new `Tween` with `obj`.
*
* @param {Object|Array} obj
* @api public
*/
function Tween(obj) {
if (!(this instanceof Tween)) return new Tween(obj);
this._from = obj;
this.ease('linear');
this.duration(500);
}
/**
* Mixin emitter.
*/
Emitter(Tween.prototype);
/**
* Reset the tween.
*
* @api public
*/
Tween.prototype.reset = function(){
this.isArray = 'array' === type(this._from);
this._curr = clone(this._from);
this._done = false;
this._start = Date.now();
return this;
};
/**
* Tween to `obj` and reset internal state.
*
* tween.to({ x: 50, y: 100 })
*
* @param {Object|Array} obj
* @return {Tween} self
* @api public
*/
Tween.prototype.to = function(obj){
this.reset();
this._to = obj;
return this;
};
/**
* Set duration to `ms` [500].
*
* @param {Number} ms
* @return {Tween} self
* @api public
*/
Tween.prototype.duration = function(ms){
this._duration = ms;
return this;
};
/**
* Set easing function to `fn`.
*
* tween.ease('in-out-sine')
*
* @param {String|Function} fn
* @return {Tween}
* @api public
*/
Tween.prototype.ease = function(fn){
fn = 'function' == typeof fn ? fn : ease[fn];
if (!fn) throw new TypeError('invalid easing function');
this._ease = fn;
return this;
};
/**
* Stop the tween and immediately emit "stop" and "end".
*
* @return {Tween}
* @api public
*/
Tween.prototype.stop = function(){
this.stopped = true;
this._done = true;
this.emit('stop');
this.emit('end');
return this;
};
/**
* Perform a step.
*
* @return {Tween} self
* @api private
*/
Tween.prototype.step = function(){
if (this._done) return;
// duration
var duration = this._duration;
var now = Date.now();
var delta = now - this._start;
var done = delta >= duration;
// complete
if (done) {
this._from = this._to;
this._update(this._to);
this._done = true;
this.emit('end');
return this;
}
// tween
var from = this._from;
var to = this._to;
var curr = this._curr;
var fn = this._ease;
var p = (now - this._start) / duration;
var n = fn(p);
// array
if (this.isArray) {
for (var i = 0; i < from.length; ++i) {
curr[i] = from[i] + (to[i] - from[i]) * n;
}
this._update(curr);
return this;
}
// objech
for (var k in from) {
curr[k] = from[k] + (to[k] - from[k]) * n;
}
this._update(curr);
return this;
};
/**
* Set update function to `fn` or
* when no argument is given this performs
* a "step".
*
* @param {Function} fn
* @return {Tween} self
* @api public
*/
Tween.prototype.update = function(fn){
if (0 == arguments.length) return this.step();
this._update = fn;
return this;
};
+63
View File
@@ -0,0 +1,63 @@
1.2.0 / 2014-02-12
==================
* prefix events with `$` to support object prototype method names
1.1.3 / 2014-06-20
==================
* republish for npm
* add LICENSE file
1.1.2 / 2014-02-10
==================
* package: rename to "component-emitter"
* package: update "main" and "component" fields
* Add license to Readme (same format as the other components)
* created .npmignore
* travis stuff
1.1.1 / 2013-12-01
==================
* fix .once adding .on to the listener
* docs: Emitter#off()
* component: add `.repo` prop
1.1.0 / 2013-10-20
==================
* add `.addEventListener()` and `.removeEventListener()` aliases
1.0.1 / 2013-06-27
==================
* add support for legacy ie
1.0.0 / 2013-02-26
==================
* add `.off()` support for removing all listeners
0.0.6 / 2012-10-08
==================
* add `this._callbacks` initialization to prevent funky gotcha
0.0.5 / 2012-09-07
==================
* fix `Emitter.call(this)` usage
0.0.3 / 2012-07-11
==================
* add `.listeners()`
* rename `.has()` to `.hasListeners()`
0.0.2 / 2012-06-28
==================
* fix `.off()` with `.once()`-registered callbacks
+24
View File
@@ -0,0 +1,24 @@
(The MIT License)
Copyright (c) 2014 Component contributors <dev@component.io>
Permission is hereby granted, free of charge, to any person
obtaining a copy of this software and associated documentation
files (the "Software"), to deal in the Software without
restriction, including without limitation the rights to use,
copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the
Software is furnished to do so, subject to the following
conditions:
The above copyright notice and this permission notice shall be
included in all copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES
OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT
HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY,
WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR
OTHER DEALINGS IN THE SOFTWARE.
+74
View File
@@ -0,0 +1,74 @@
# Emitter [![Build Status](https://travis-ci.org/component/emitter.png)](https://travis-ci.org/component/emitter)
Event emitter component.
## Installation
```
$ component install component/emitter
```
## API
### Emitter(obj)
The `Emitter` may also be used as a mixin. For example
a "plain" object may become an emitter, or you may
extend an existing prototype.
As an `Emitter` instance:
```js
var Emitter = require('emitter');
var emitter = new Emitter;
emitter.emit('something');
```
As a mixin:
```js
var Emitter = require('emitter');
var user = { name: 'tobi' };
Emitter(user);
user.emit('im a user');
```
As a prototype mixin:
```js
var Emitter = require('emitter');
Emitter(User.prototype);
```
### Emitter#on(event, fn)
Register an `event` handler `fn`.
### Emitter#once(event, fn)
Register a single-shot `event` handler `fn`,
removed immediately after it is invoked the
first time.
### Emitter#off(event, fn)
* Pass `event` and `fn` to remove a listener.
* Pass `event` to remove all listeners on that event.
* Pass nothing to remove all listeners on all events.
### Emitter#emit(event, ...)
Emit an `event` with variable option args.
### Emitter#listeners(event)
Return an array of callbacks, or an empty array.
### Emitter#hasListeners(event)
Check if this emitter has `event` handlers.
## License
MIT
+161
View File
@@ -0,0 +1,161 @@
/**
* Expose `Emitter`.
*/
module.exports = Emitter;
/**
* Initialize a new `Emitter`.
*
* @api public
*/
function Emitter(obj) {
if (obj) return mixin(obj);
};
/**
* Mixin the emitter properties.
*
* @param {Object} obj
* @return {Object}
* @api private
*/
function mixin(obj) {
for (var key in Emitter.prototype) {
obj[key] = Emitter.prototype[key];
}
return obj;
}
/**
* Listen on the given `event` with `fn`.
*
* @param {String} event
* @param {Function} fn
* @return {Emitter}
* @api public
*/
Emitter.prototype.on =
Emitter.prototype.addEventListener = function(event, fn){
this._callbacks = this._callbacks || {};
(this._callbacks['$' + event] = this._callbacks['$' + event] || [])
.push(fn);
return this;
};
/**
* Adds an `event` listener that will be invoked a single
* time then automatically removed.
*
* @param {String} event
* @param {Function} fn
* @return {Emitter}
* @api public
*/
Emitter.prototype.once = function(event, fn){
function on() {
this.off(event, on);
fn.apply(this, arguments);
}
on.fn = fn;
this.on(event, on);
return this;
};
/**
* Remove the given callback for `event` or all
* registered callbacks.
*
* @param {String} event
* @param {Function} fn
* @return {Emitter}
* @api public
*/
Emitter.prototype.off =
Emitter.prototype.removeListener =
Emitter.prototype.removeAllListeners =
Emitter.prototype.removeEventListener = function(event, fn){
this._callbacks = this._callbacks || {};
// all
if (0 == arguments.length) {
this._callbacks = {};
return this;
}
// specific event
var callbacks = this._callbacks['$' + event];
if (!callbacks) return this;
// remove all handlers
if (1 == arguments.length) {
delete this._callbacks['$' + event];
return this;
}
// remove specific handler
var cb;
for (var i = 0; i < callbacks.length; i++) {
cb = callbacks[i];
if (cb === fn || cb.fn === fn) {
callbacks.splice(i, 1);
break;
}
}
return this;
};
/**
* Emit `event` with the given args.
*
* @param {String} event
* @param {Mixed} ...
* @return {Emitter}
*/
Emitter.prototype.emit = function(event){
this._callbacks = this._callbacks || {};
var args = [].slice.call(arguments, 1)
, callbacks = this._callbacks['$' + event];
if (callbacks) {
callbacks = callbacks.slice(0);
for (var i = 0, len = callbacks.length; i < len; ++i) {
callbacks[i].apply(this, args);
}
}
return this;
};
/**
* Return array of callbacks for `event`.
*
* @param {String} event
* @return {Array}
* @api public
*/
Emitter.prototype.listeners = function(event){
this._callbacks = this._callbacks || {};
return this._callbacks['$' + event] || [];
};
/**
* Check if this emitter has `event` handlers.
*
* @param {String} event
* @return {Boolean}
* @api public
*/
Emitter.prototype.hasListeners = function(event){
return !! this.listeners(event).length;
};
@@ -0,0 +1,24 @@
{
"name": "component-emitter",
"description": "Event emitter",
"version": "1.2.0",
"license": "MIT",
"devDependencies": {
"mocha": "*",
"should": "*"
},
"component": {
"scripts": {
"emitter/index.js": "index.js"
}
},
"main": "index.js",
"repository": {
"type": "git",
"url": "https://github.com/component/emitter.git"
},
"scripts": {
"test": "make test"
},
"files": ["index.js", "LICENSE"]
}
+32
View File
@@ -0,0 +1,32 @@
{
"name": "component-tween",
"description": "Motion tween engine using 'ease'",
"version": "1.2.0",
"keywords": [
"tween",
"tweening",
"animation"
],
"dependencies": {
"component-clone": "0.2.2",
"component-emitter": "1.2.0",
"component-type": "1.1.0",
"ease-component": "1.0.0"
},
"browser": {
"clone": "component-clone",
"emitter": "component-emitter",
"type": "component-type",
"ease": "ease-component"
},
"license": "MIT",
"component": {
"scripts": {
"tween/index.js": "index.js"
}
},
"repository": {
"type": "git",
"url": "https://github.com/component/tween.git"
}
}
+3
View File
@@ -0,0 +1,3 @@
components
build
node_modules
+14
View File
@@ -0,0 +1,14 @@
build: components index.js
@component build --dev
components:
@component install --dev
clean:
rm -fr build components template.js
test:
open test/index.html
.PHONY: clean test
+37
View File
@@ -0,0 +1,37 @@
# type
Type assertions aka less-broken `typeof`.
## Example
```js
var type = require('type');
var obj = new Date;
if (type(obj) == 'date') ...
```
## API
```js
type(new Date) == 'date'
type({}) == 'object'
type(null) == 'null'
type(undefined) == 'undefined'
type("hey") == 'string'
type(true) == 'boolean'
type(false) == 'boolean'
type(12) == 'number'
type(type) == 'function'
type(/asdf/) == 'regexp'
type((function(){ return arguments })()) == 'arguments'
type([]) == 'array'
type(document.createElement('div')) == 'element'
type(NaN) == 'nan'
type(new Error('Ups! Something wrong...')) == 'error'
```
## License
MIT
+13
View File
@@ -0,0 +1,13 @@
{
"name": "type",
"description": "Cross-browser type assertions (less broken typeof)",
"version": "1.1.0",
"keywords": ["typeof", "type", "utility"],
"dependencies": {},
"development": {
"component/assert": "*"
},
"scripts": [
"index.js"
]
}
+34
View File
@@ -0,0 +1,34 @@
/**
* toString ref.
*/
var toString = Object.prototype.toString;
/**
* Return the type of `val`.
*
* @param {Mixed} val
* @return {String}
* @api public
*/
module.exports = function(val){
switch (toString.call(val)) {
case '[object Date]': return 'date';
case '[object RegExp]': return 'regexp';
case '[object Arguments]': return 'arguments';
case '[object Array]': return 'array';
case '[object Error]': return 'error';
}
if (val === null) return 'null';
if (val === undefined) return 'undefined';
if (val !== val) return 'nan';
if (val && val.nodeType === 1) return 'element';
val = val.valueOf
? val.valueOf()
: Object.prototype.valueOf.apply(val)
return typeof val;
};

Some files were not shown because too many files have changed in this diff Show More