multiple updates

README.md

@@ -125,6 +125,10 @@ Gulp Boilerplate is licensed under the [MIT License](http://gomakethings.com/mit
 
 Gulp Boilerplate uses [semantic versioning](http://semver.org/).
 
+* v0.4.0 - August 15, 2014
+	* Added `STARTER-README.MD`.
+	* Added `index.html` template.
+	* Added placeholders for variables, settings extending, and other methods.
 * v0.3.0 - August 15, 2014
 	* Updated path with testing path for scripts.
 	* Switched to Ruby Sass for better compatibility with Sass 3.x features.

STARTER-README.md

@@ -0,0 +1,145 @@
+# NAMESPACE-UP [![Build Status](https://travis-ci.org/GITHUB-USERNAME/NAMESPACE-LOW.svg)](https://travis-ci.org/GITHUB-USERNAME/NAMESPACE-LOW)
+DESCRIPTION.
+
+[Download NAMESPACE-UP](https://github.com/GITHUB-USERNAME/NAMESPACE-LOW/archive/master.zip) / [View the demo](http://GITHUB-USERNAME.github.io/NAMESPACE-LOW/).
+
+**In This Documentation**
+
+1. [Getting Started](#getting-started)
+2. [Installing with Package Managers](#installing-with-package-managers)
+3. [Options & Settings](#options-and-settings)
+4. [Browser Compatibility](#browser-compatibility)
+5. [How to Contribute](#how-to-contribute)
+6. [License](#license)
+7. [Changelog](#changelog)
+8. [Older Docs](#older-docs)
+
+
+
+## Getting Started
+
+Compiled and production-ready code can be found in the `dist` directory. The `src` directory contains development code. Unit tests are located in the `test` directory.
+
+### 1. Include NAMESPACE-UP on your site.
+
+```html
+<link rel="stylesheet" href="dist/css/NAMESPACE-LOW.css">
+<script src="dist/js/classList.js"></script>
+<script src="dist/js/bind-polyfill.js"></script>
+<script src="dist/js/NAMESPACE-LOW.js"></script>
+```
+
+NAMESPACE-UP is [built with Sass](http://sass-lang.com/) for easy customization. If you don't use Sass, that's ok. The `css` folder contains compiled vanilla CSS.
+
+The `_config.scss` and `_mixins.scss` files are the same ones used in [Kraken](http://GITHUB-USERNAME.github.io/kraken/), so you can drop the `_NAMESPACE-LOW.css` file right into Kraken without making any updates. Or, adjust the variables to suit your own project.
+
+NAMESPACE-UP also requires [classList.js](https://github.com/eligrey/classList.js) and `bind-polyfill.js`, polyfills that extend ECMAScript 5 API support to more browsers.
+
+### 2. Add the markup to your HTML.
+
+```html
+Markup here...
+```
+
+Details.
+
+### 3. Initialize NAMESPACE-UP.
+
+```html
+<script>
+	NAMESPACE-LOW.init();
+</script>
+```
+
+In the footer of your page, after the content, initialize NAMESPACE-UP. And that's it, you're done. Nice work!
+
+
+
+## Installing with Package Managers
+
+You can install NAMEPSACE-UP with your favorite package manager.
+
+* **NPM:** `npm install GITHUB-USERNAME/NAMESPACE-LOW`
+* **Bower:** `bower install https://github.com/GITHUB-USERNAME/NAMESPACE-LOW.git`
+* **Component:** `component install GITHUB-USERNAME/NAMESPACE-LOW`
+
+
+
+## Options and Settings
+
+NAMESPACE-UP includes smart defaults and works right out of the box. But if you want to customize things, it also has a robust API that provides multiple ways for you to adjust the default options and settings.
+
+### Global Settings
+
+You can pass options and callbacks into NAMESPACE-UP through the `init()` function:
+
+```javascript
+NAMESPACE-LOW.init();
+```
+
+### Override settings with data attributes
+
+NAMESPACE-UP also lets you override global settings on a link-by-link basis using the `[data-options]` data attribute:
+
+```html
+// Markup here...
+```
+
+### Use NAMESPACE-UP events in your own scripts
+
+You can also call NAMESPACE-UP events in your own scripts.
+
+#### functionName()
+Description
+
+```javascript
+// Functions here...
+```
+
+**Example**
+
+```javascript
+// Example here...
+```
+
+#### destroy()
+Destroy the current `NAMESPACE-LOW.init()`.
+
+```javascript
+NAMESPACE-LOW.destroy();
+```
+
+
+
+## Browser Compatibility
+
+NAMESPACE-UP works in all modern browsers, and IE 9 and above.
+
+NAMESPACE-UP is built with modern JavaScript APIs, and uses progressive enhancement. If the JavaScript file fails to load, or if your site is viewed on older and less capable browsers, all content will be displayed by default.
+
+
+
+## How to Contribute
+
+In lieu of a formal style guide, take care to maintain the existing coding style. Don't forget to update the version number, the changelog (in the `readme.md` file), and when applicable, the documentation.
+
+
+
+## License
+
+NAMESPACE-UP is licensed under the [MIT License](http://gomakethings.com/mit/).
+
+
+
+## Changelog
+
+NAMESPACE-UP uses [semantic versioning](http://semver.org/).
+
+* v1.0 - DATE
+	* Initial release.
+
+
+
+## Older Docs
+
+* [Version 1](#)

dist/css/myplugin.css

@@ -1,5 +1,5 @@
 /**
- * gulp-boilerplate v0.3.0
+ * gulp-boilerplate v0.4.0
  * My Gulp.js boilerplate for creating new web projects, by Chris Ferdinandi.
  * http://github.com/cferdinandi/Plugin
  * 

dist/css/myplugin.min.css

@@ -1 +1 @@
-/** gulp-boilerplate v0.3.0, by Chris Ferdinandi | http://github.com/cferdinandi/Plugin | Licensed under MIT: http://gomakethings.com/mit/ */
+/** gulp-boilerplate v0.4.0, by Chris Ferdinandi | http://github.com/cferdinandi/Plugin | Licensed under MIT: http://gomakethings.com/mit/ */

dist/js/bind-polyfill.js

@@ -1,5 +1,5 @@
 /**
- * gulp-boilerplate v0.3.0
+ * gulp-boilerplate v0.4.0
  * My Gulp.js boilerplate for creating new web projects, by Chris Ferdinandi.
  * http://github.com/cferdinandi/Plugin
  * 

dist/js/classList.js

@@ -1,5 +1,5 @@
 /**
- * gulp-boilerplate v0.3.0
+ * gulp-boilerplate v0.4.0
  * My Gulp.js boilerplate for creating new web projects, by Chris Ferdinandi.
  * http://github.com/cferdinandi/Plugin
  * 

dist/js/myplugin.js

@@ -1,5 +1,5 @@
 /**
- * gulp-boilerplate v0.3.0
+ * gulp-boilerplate v0.4.0
  * My Gulp.js boilerplate for creating new web projects, by Chris Ferdinandi.
  * http://github.com/cferdinandi/Plugin
  * 
@@ -25,6 +25,8 @@
 
 	var myPlugin = {}; // Object for public APIs
 	var supports = !!document.querySelector && !!root.addEventListener; // Feature test
+	var eventListeners = []; //Listeners array
+	var settings, ELEMENTS, eventTimeout;
 
 	// Default settings
 	var defaults = {
@@ -96,7 +98,40 @@
 	 * @public
 	 */
 	myPlugin.destroy = function () {
-		// @todo Undo init...
+
+		if ( !settings ) return;
+
+		// @todo Undo init functions...
+
+		// Remove event listeners
+		if ( ELEMENTS ) {
+			forEach( ELEMENTS, function ( elem, index ) {
+				elem.removeEventListener( 'click', eventListeners[index], false );
+			});
+			eventListeners = [];
+		}
+
+		// Reset variables
+		settings = null;
+		ELEMENTS = null;
+		eventTimeout = null;
+
+	};
+
+	/**
+	 * On window scroll and resize, only run events at a rate of 15fps for better performance
+	 * @private
+	 * @param  {Function} eventTimeout Timeout function
+	 * @param  {TBD} ELEMENTS Some element, nodelist, or other variable to pass in
+	 * @param  {Object} settings
+	 */
+	var eventThrottler = function ( eventTimeout, ELEMENTS, settings ) {
+		if ( !eventTimeout ) {
+			eventTimeout = setTimeout(function() {
+				eventTimeout = null;
+				setWrapHeight( wrap, footer, settings );
+			}, 66);
+		}
 	};
 
 	/**
@@ -109,8 +144,21 @@
 		// feature test
 		if ( !supports ) return;
 
+		// Destroy any existing initializations
+		myPlugin.destroy();
+
+		// Selectors and variables
+		settings = extend( defaults, options || {} ); // Merge user options with defaults
+		ELEMENTS = document.querySelectorAll('[data-ELEM]'); // Set your variable here
+
 		// @todo Do something...
 
+		// Assigns event listeners to an array so they can be programatically destroyed
+		forEach(ELEMENTS, function (elem, index) {
+			eventListeners[index] = myPlugin.METHOD.bind( null, elem, ELEMENTSS, settings );
+			elem.addEventListener('click', eventListeners[index], false);
+		});
+
 	};
 
 

index.html

@@ -2,7 +2,7 @@
 <html lang="en">
 <head>
 	<meta charset="utf-8">
-	<title>MyPlugin</title>
+	<title>NAMESPACE-UP</title>
 	<meta name="viewport" content="width=device-width, initial-scale=1.0">
 
 	<!-- A basic responsive reset -->
@@ -27,7 +27,7 @@
 	</style>
 
 	<!-- stylesheets -->
-	<link rel="stylesheet" href="dist/css/myplugin.css" type="text/css">
+	<link rel="stylesheet" href="dist/css/NAMESPACE-LOW.css" type="text/css">
 
 	<!-- HTML5 Shim for IE -->
 	<!--[if IE]>
@@ -38,9 +38,9 @@
 <body>
 	<section class="container">
 
-		<h1 style="text-align: center; font-size: 3em; margin-bottom: 0;">MyPlugin</h1>
+		<h1 style="text-align: center; font-size: 3em; margin-bottom: 0;">NAMESPACE-UP</h1>
 		<p style="text-align: center; font-size: 1.5em; margin: 0;">description</p>
-		<p style="text-align: center;"><a href="https://github.com/yourname/myplugin">MyPlugin on GitHub</a></p>
+		<p style="text-align: center;"><a href="https://github.com/GITHUB-USERNAME/NAMESPACE-LOW">NAMESPACE-UP on GitHub</a></p>
 
 
 
@@ -50,9 +50,9 @@ <h1 style="text-align: center; font-size: 3em; margin-bottom: 0;">MyPlugin</h1>
 	<!-- Javascript -->
 	<script src="dist/js/classList.js"></script>
 	<script src="dist/js/bind-polyfill.js"></script>
-	<script src="dist/js/myplugin.js"></script>
+	<script src="dist/js/NAMESPACE-LOW.js"></script>
 	<script>
-		myplugin.init();
+		NAMESPACE-LOW.init();
 	</script>
 
 </body>

package.json

@@ -1,6 +1,6 @@
 {
 	"name": "gulp-boilerplate",
-	"version": "0.3.0",
+	"version": "0.4.0",
 	"description": "My Gulp.js boilerplate for creating new web projects",
 	"author": {
 		"name": "Chris Ferdinandi",