joeylin · January 6, 2014 03:34
diff --git a/lightJQ.html b/lightJQ.html
 <!doctype html>
 <html lang="en">
        <head>
                <title>JavaScript Patterns</title>
                <meta charset="utf-8">
        </head>
        <body>
                <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
                <script>
                /*!
                 * jQuery lightweight plugin boilerplate
                 * Original author: @ajpiano
                 * Further changes, comments: @addyosmani
                 * Licensed under the MIT license
                 */

                // the semi-colon before the function invocation is a safety
                // net against concatenated scripts and/or other plugins
                // that are not closed properly.
                ;(function ( $, window, document, undefined ) {

                    // undefined is used here as the undefined global
                    // variable in ECMAScript 3 and is mutable (i.e. it can
                    // be changed by someone else). undefined isn't really
                    // being passed in so we can ensure that its value is
                    // truly undefined. In ES5, undefined can no longer be
                    // modified.

                    // window and document are passed through as local
                    // variables rather than as globals, because this (slightly)
                    // quickens the resolution process and can be more
                    // efficiently minified (especially when both are
                    // regularly referenced in your plugin).

                    // Create the defaults once
                    var pluginName = 'defaultPluginName',
                        defaults = {
                            propertyName: "value"
                        };

                    // The actual plugin constructor
                    function Plugin( element, options ) {
                        this.element = element;

                        // jQuery has an extend method that merges the
                        // contents of two or more objects, storing the
                        // result in the first object. The first object
                        // is generally empty because we don't want to alter
                        // the default options for future instances of the plugin
                        this.options = $.extend( {}, defaults, options) ;

                        this._defaults = defaults;
                        this._name = pluginName;

                        this.init();
                    }

                    Plugin.prototype.init = function () {
                        // Place initialization logic here
                        // You already have access to the DOM element and
                        // the options via the instance, e.g. this.element
                        // and this.options
                    };

                    // A really lightweight plugin wrapper around the constructor,
                    // preventing against multiple instantiations
                    $.fn[pluginName] = function ( options ) {
                        return this.each(function () {
                            if (!$.data(this, 'plugin_' + pluginName)) {
                                $.data(this, 'plugin_' + pluginName,
                                new Plugin( this, options ));
                            }
                        });
                    }

                })( jQuery, window, document );


                // References
                /* 
                Plugins/Authoring (by jQuery) - http://goo.gl/98R9
                Signs of a poorly written jQuery plugin (by Remy Sharp) - http://goo.gl/5RNI
                How to Create Your Own jQuery Plugin (by Elijah Manor) - http://goo.gl/EoSFq
                Style in jQuery Plugins and Why it Matters (by "Cowboy" Ben Alman) - http://goo.gl/E7pd0
                Create Your First jQuery Plugin Part 2 (by Andrew Wirick) - http://goo.gl/IhCYO
                Essential jQuery Plugin Patterns (by Addy Osmani) - http://goo.gl/oE0ge
                */
                </script>
        </body>
 </html>
	<!doctype html>
	<html lang="en">
	<head>
	<title>JavaScript Patterns</title>
	<meta charset="utf-8">
	</head>
	<body>
	<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
	<script>
	/*!
	* jQuery lightweight plugin boilerplate
	* Original author: @ajpiano
	* Further changes, comments: @addyosmani
	* Licensed under the MIT license
	*/

	// the semi-colon before the function invocation is a safety
	// net against concatenated scripts and/or other plugins
	// that are not closed properly.
	;(function ( $, window, document, undefined ) {

	// undefined is used here as the undefined global
	// variable in ECMAScript 3 and is mutable (i.e. it can
	// be changed by someone else). undefined isn't really
	// being passed in so we can ensure that its value is
	// truly undefined. In ES5, undefined can no longer be
	// modified.

	// window and document are passed through as local
	// variables rather than as globals, because this (slightly)
	// quickens the resolution process and can be more
	// efficiently minified (especially when both are
	// regularly referenced in your plugin).

	// Create the defaults once
	var pluginName = 'defaultPluginName',
	defaults = {
	propertyName: "value"
	};

	// The actual plugin constructor
	function Plugin( element, options ) {
	this.element = element;

	// jQuery has an extend method that merges the
	// contents of two or more objects, storing the
	// result in the first object. The first object
	// is generally empty because we don't want to alter
	// the default options for future instances of the plugin
	this.options = $.extend( {}, defaults, options) ;

	this._defaults = defaults;
	this._name = pluginName;

	this.init();
	}

	Plugin.prototype.init = function () {
	// Place initialization logic here
	// You already have access to the DOM element and
	// the options via the instance, e.g. this.element
	// and this.options
	};

	// A really lightweight plugin wrapper around the constructor,
	// preventing against multiple instantiations
	$.fn[pluginName] = function ( options ) {
	return this.each(function () {
	if (!$.data(this, 'plugin_' + pluginName)) {
	$.data(this, 'plugin_' + pluginName,
	new Plugin( this, options ));
	}
	});
	}

	})( jQuery, window, document );


	// References
	/*
	Plugins/Authoring (by jQuery) - http://goo.gl/98R9
	Signs of a poorly written jQuery plugin (by Remy Sharp) - http://goo.gl/5RNI
	How to Create Your Own jQuery Plugin (by Elijah Manor) - http://goo.gl/EoSFq
	Style in jQuery Plugins and Why it Matters (by "Cowboy" Ben Alman) - http://goo.gl/E7pd0
	Create Your First jQuery Plugin Part 2 (by Andrew Wirick) - http://goo.gl/IhCYO
	Essential jQuery Plugin Patterns (by Addy Osmani) - http://goo.gl/oE0ge
	*/
	</script>
	</body>
	</html>