Initial commit

matthewmueller · Nov 6, 2012 · 63d7f27 · 63d7f27
commit 63d7f27
Show file tree

Hide file tree

Showing 7 changed files with 107 additions and 0 deletions.
diff --git a/.gitignore b/.gitignore
@@ -0,0 +1,2 @@
+components
+build
diff --git a/History.md b/History.md
diff --git a/Makefile b/Makefile
@@ -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
diff --git a/Readme.md b/Readme.md
@@ -0,0 +1,34 @@
+
+# debounce
+
+  Underscore's debounce method as a component.
+
+  Creates and returns a new debounced version of the passed function that will postpone its execution until after wait milliseconds have elapsed since the last time it was invoked.
+
+## Installation
+
+    $ component install matthewmueller/debounce
+
+## Example
+
+  ```js
+    var debounce = require('debounce');
+    window.onresize = debounce(resize, 200);
+
+    function resize(e) {
+      console.log('height', window.innerHeight);
+      console.log('width', window.innerWidth);
+    }
+  ```
+
+## API
+
+  ### debounce(fn, wait, [ immediate ])
+
+  Creates and returns a new debounced version of the passed function that will postpone its execution until after wait milliseconds have elapsed since the last time it was invoked. Useful for implementing behavior that should only happen after the input has stopped arriving. For example: rendering a preview of a Markdown comment, recalculating a layout after the window has stopped being resized, and so on.
+
+  Pass true for the immediate parameter to cause debounce to trigger the function on the leading instead of the trailing edge of the wait interval. Useful in circumstances like preventing accidental double-clicks on a "submit" button from firing a second time.
+
+## License
+
+  MIT
diff --git a/component.json b/component.json
@@ -0,0 +1,13 @@
+{
+  "name": "debounce",
+  "repo": "matthewmueller/debounce",
+  "description": "Creates and returns a new debounced version of the passed function that will postpone its execution until after wait milliseconds have elapsed since the last time it was invoked",
+  "version": "0.0.1",
+  "keywords": [],
+  "dependencies": {},
+  "development": {},
+  "license": "MIT",
+  "scripts": [
+    "index.js"
+  ]
+}
diff --git a/index.js b/index.js
@@ -0,0 +1,29 @@
+/**
+ * Debounce
+ *
+ * Returns a function, that, as long as it continues to be invoked, will not
+ * be triggered. The function will be called after it stops being called for
+ * N milliseconds. If `immediate` is passed, trigger the function on the
+ * leading edge, instead of the trailing.
+ *
+ * @param {Function} func
+ * @param {Number} wait
+ * @param {Boolean} immediate
+ * @return {Function}
+ */
+
+module.exports = function(func, wait, immediate) {
+  var timeout, result;
+  return function() {
+    var context = this, args = arguments;
+    var later = function() {
+      timeout = null;
+      if (!immediate) result = func.apply(context, args);
+    };
+    var callNow = immediate && !timeout;
+    clearTimeout(timeout);
+    timeout = setTimeout(later, wait);
+    if (callNow) result = func.apply(context, args);
+    return result;
+  };
+};
diff --git a/test.html b/test.html
@@ -0,0 +1,18 @@
+<html>
+<head>
+  <title>Debounce Component</title>
+</head>
+<body>
+  <script src="../build/build.js" type="text/javascript"></script>
+  <script type="text/javascript">
+    var debounce = require('debounce');
+    window.onresize = debounce(resize, 200);
+
+    function resize(e) {
+      console.log('height', window.innerHeight);
+      console.log('width', window.innerWidth);
+    }
+
+  </script>
+</body>
+</html>