From d8d68a50fe42b7f73be3f8ce65ce90c129dd825d Mon Sep 17 00:00:00 2001 From: Sandro Date: Fri, 10 Jun 2011 10:14:42 -0500 Subject: [PATCH] Adds a template for creating jQuery plugins. --- chapters/jquery/plugin.textile | 62 ++++++++++++++++++++++++++++++++++ 1 file changed, 62 insertions(+) create mode 100644 chapters/jquery/plugin.textile diff --git a/chapters/jquery/plugin.textile b/chapters/jquery/plugin.textile new file mode 100644 index 0000000..6293212 --- /dev/null +++ b/chapters/jquery/plugin.textile @@ -0,0 +1,62 @@ +--- +layout: recipe +title: Create a jQuery plugin +chapter: jQuery +--- + +h2. Problem + +You'd like to create jQuery plugin using CoffeeScript + +h2. Solution + +{% highlight coffeescript %} +# Reference jQuery +$ = jQuery + +# Adds plugin object to jQuery +$.fn.extend + # Change pluginName to your plugin's name. + pluginName: (options) -> + # Default settings + settings = + option1: true + option2: false + debug: false + + # Merge default settings with options. + settings = $.extend settings, options + + # Simple logger. + log = (msg) -> + console?.log msg if settings.debug + + # _Insert magic here._ + return @each ()-> + log "Preparing magic show." + # You can use your settings in here now. + log "Option 1 value: #{settings.option1}" +{% endhighlight %} + +h2. Discussion + +h3. Usage + +Here are a couple of examples of how to use your new plugin. + +h4. JavaScript + +{% highlight javascript %} +$("body").pluginName({ + debug: true +}; + +{% endhighlight %} + +h4. CoffeeScript: + +{% highlight coffeescript %} +$("body").pluginName + debug: true + +{% endhighlight %}