mizugumo 0.1.0 → 0.1.1

data/LICENSE.txt

@@ -1,4 +1,15 @@
-Copyright (c) 2011 Evan Dorn
+Copyright (c) 2011 Evan Dorn and Logical Reality Design
+
+Includes a copy of NinjaScript, itself copyright (c) 2010-2011 Judson Lester and Logical Reality Design
+
+Includes a copy of jQuery 1.4.2, Copyright 2010 John Resig
+Dual licensed under the MIT or GPL Version 2 licenses.
+http://jquery.org/license
+
+Includes a copy of a jQuery-1.4.2 - compatible implementation of
+Rails 3's 'rails.js', available from: https://gist.github.com/704387
+
+--------------------------------------------------------------------
 
 Permission is hereby granted, free of charge, to any person obtaining
 a copy of this software and associated documentation files (the

data/README.rdoc

@@ -6,11 +6,21 @@ Mizugumo is a gem designed to provide Rails with JavaScript and AJAX behavior th
 * gracefully-degrading: defaults to fully functional and
 sensible page-reload behavior when javascript is not available.
 
+See a demo running at:
+  http://mizugumo-demo.lrdesign.com
+Or download the code for the demo at:
+  https://github.com/LRDesign/mizugumo_demo
+
 Mizugumo uses NinjaScript by Judson Lester to provide unobtrusive JS behaviors.   For more info, see:
   git@github.com:LRDesign/NinjaScript.git
 
-Mizugumo is currently in development and is not ready for public use.  We
-are expecting a release later this week (note written 1/26/2010).
+== WARNINGS
+
+In the current (early release) version, Mizugumo and NinjaScript have some limitations.   Notably, in this version they will clobber the normal rails.js and prevent its behaviors from
+working.  The installer will copy a jQuery-compatible version of rails.js that you should
+use instead if you depend on Rails' default (semi-obtrusive) approaches to AJAX, link_to with :confirm =>'Are you sure?' and similar things working.
+
+In addition, NinjaScript currently requires jQuery 1.4.2.  It is NOT compatible with the current version of jQuery, 1.4.4, or the development version 1.5.   We are eagerly working on a fix.
 
 == Features
 
@@ -51,6 +61,53 @@ NOTE:  If you still have javascript_include_tag :defaults, you probably want to
 Ninjascript is meant to work with jQuery, and we don't know what happens if you try to run it
 side-by-side with Prototype.
 
+== Graceful degradation of :method => 'delete' (or PUT, or POST) links
+
+Rails' concept of REST runs headlong into the desire to make a site degrade
+gracefully.   Specifically, the link_to() helper, when passed a method other
+than 'get', outputs a link with a data-method attribute that won't work
+when JS is absent.   To wit:  link_to('Delete Item', @item, :method => 'delete') in rails outputs this:
+
+   <a href='/items/1' data-method='delete'>Delete Item</a>
+
+When JS isn't available, this delete link acts as a show link.  This is bad,
+bad, bad.   What's worse, Rails' scaffold generator makes these exact links
+ubiquitous.
+
+When Mizugumo is installed, that same helper instead outputs this:
+
+  <form action='/items/1' class="mizugumo_graceful_form">
+    <input type='hidden' name='_method' value='delete'>
+    <input type='submit' value='Delete Item'>
+  </form>
+
+This gives the user a button instead of a form ... but it works without JS
+running.  Then, to give JS users the behavior the developer intended,
+Mizugumo appends this to your application.js:
+
+  Ninja.behavior({
+    '.mizugumo_graceful_form': Ninja.becomesLink
+  })
+
+This NinjaScript behavior converts that form back into a link.  The JS user
+sees no difference whatsoever, but the link at least *works* for the non-JS
+user.
+
+This behavior will work for :method => 'put' and :method => 'post' as well,
+and it supports links whose content is an image as well; creating an image
+submit button in the form rather than a text submit button.
+
+WARNING: This cycle won't work if your link has complex content with html
+structure; for example if you write
+
+  link_to('some <b>content</b><img src="foo">and text', @item, :method => 'delete' )
+
+Mizugomo will not be able to preserve all that content through the degraded
+form.   However, we think this is a rare case.  If you aren't passing :method
+to your link_to, mizugumo will ignore it entirely, so you can still create
+complex GET links.
+
+
 == Scaffold generator
 
 Mizugumo ships with a scaffold generator that builds out-of-the-box AJAX/UJS scaffolds that degrade gracefully in the absence of JavaScript.   To use it, add this to config/application.rb:
@@ -72,6 +129,8 @@ For HAML views:
 
 == Contributing to Mizugumo
 
+* Install MizugumoDemo and make sure that its tests still pass with your version of Mizugumo!
+
 * Check out the latest master to make sure the feature hasn't been implemented or the bug hasn't been fixed yet
 * Check out the issue tracker to make sure someone already hasn't requested it and/or contributed it
 * Fork the project
@@ -80,8 +139,14 @@ For HAML views:
 * Make sure to add tests for it. This is important so I don't break it in a future version unintentionally.
 * Please try not to mess with the Rakefile, version, or history. If you want to have your own version, or is otherwise necessary, that is fine, but please isolate to its own commit so I can cherry-pick around it.
 
+== Reporting Bugs
+
+Use the GitHub issue tracker.
+
 == Copyright
 
 Copyright (c) 2011 Evan Dorn and Logical Reality design. See LICENSE.txt for
 further details.
 
+Web Development by Logical Reality Design: http://LRDesign.com
+

data/doc/NAME.haml

@@ -0,0 +1,14 @@
+%h1 Mizugumo Ᾱ Name
+
+%p
+  'mizugumo' is Japanese for 'water-spider'.  Mythologically, however, it is the
+  name for special wooden shoes that ninja used to walk on water and thereby approach
+  targets via unexpected routes.
+
+%p
+  As much as the Mythbusters were not impressed (real mizugumo likely did not work
+  for actual water-walking, and probably only worked as snowshoes to cross marshy
+  terrain), we thought it an appropriate name for an unobtrusive JS behavior library.
+
+
+

data/doc/PURPOSE.haml

@@ -0,0 +1,71 @@
+%h1 Mizugumo Ᾱ Purpose
+
+%p
+  Mizugumo exists to help Rails developers quickly build apps that are both AJAXy and that degrade
+  gracefully when JavaScript is absent.   It uses NinjaScript to provide unobtrusive javascript
+  behaviors.
+
+%h2 Graceful Degradation
+
+%h3 Why we care
+
+%p
+  Rails developers are notorious for making apps that do not degrade well when JS is unavailable,
+  especially if the app uses AJAX for some actions. It's hard to blame anyone - generally, adding
+  AJAX is a bit of a pain, and adding degradation requires duplicating a lot of development.
+
+%p
+  Ideally, we should put the effort into graceful degradation because we can't count on JavaScript
+  in real-world conditions.   Some situations we care about in which JavaScript might not be
+  available:
+
+  %ul
+    %li NoScript users and other security-conscious folk
+    %li Screen readers for vision-impaired users
+    %li Search engines and spiders, which should see as accurate
+    %li Automation tools
+
+%h3 How to solve the problem
+
+%p
+  Because the client sees the normal, JS-enabled behavior, and because we are all busy people,
+  Rails developers usually won't make their sites degrade gracefully until it becomes no harder
+  to build in graceful degradation than not to.    Mizugumo aspires to this goal.
+
+%p
+  Mizugumo replaces some of rails' default behavior that depend on JS with ones that work
+  in the absence of JS.  Specifically, link_to with a :method option other than GET actually
+  outputs a <form>, not an <a href='foo'>.   It then provides a default javascript behavior,
+  written in NinjaScript, to implicitly convert those forms
+
+%p
+  Mizugumo also provides a scaffold tool that gives you an out-of-the box AJAX controller
+  in which all actions degrade perfectly in the absence of JS.  From that scaffold, it becomes
+  much easier to build rich behaviors into your sites while maintaining JS-less functionality.
+
+%h2 The Philosophy of Ninja-like Unobtrusiveness
+
+%p
+  The goal of Mizugumo's JS engine, NinjaScript, is to make javascript super easy to use, and
+  reliable for the developer &%8212; no surprises.
+
+%3 CSS is Great, JS Sucks
+
+%p
+  We take for granted CSS's super-easy behavior:  specify a selector and add a style.  That style
+  will always apply to anything that matches that selector, even if the DOM is restructured.  JavaScript
+  is not like this, however: if we use a library (say jQuery) to bind events to a selector, event
+  handlers will get bound to the DOM nodes that match that selector *now*, but elements that get added
+  later are out of luck.   We can fix event handlers with event delegation methods, but that still
+  doesn't help us if what we want to do is transform elements.   If I write a javascript block to
+  add rounded corners to a bunch of elements, or to add tooltip elements to a bunch of <li> nodes,
+  it will only make those changes to the elements that match at the time it is run.
+
+%p
+  NinjaScripts aims to make JS as much like CSS as possible: specify a behavior once - including
+  transformations of the elements themselves - and those behaviors will always apply to all elements
+  even if the elements are added to the DOM later.   So you can say "all divs with class .foo
+  get rounded corners" or "all forms matching .mizugomo_graceful_form  get replaced with
+  links with the text matching the submit button text" and likewise not worry about when
+  and how said forms get added to the DOM.
+

data/doc/making_generators.txt

@@ -0,0 +1,45 @@
+These are notes to myself to hopefully avoid this kind of suffering again.
+
+I ran into some troubles (a few hours worth)  trying to get the generators
+working.
+
+Rails wants to load generators from specific "namespaces", but parts of those
+namespaces are automatically generated.   In particular, when a generator is
+invoked, it will generally be looked for with both a "base" and a "context".
+Rails will use *one* of these two when looking, for example, it will look for:
+
+   <base>/<your generator>     and    <your generator>/<context>.
+
+These are interdependent; particularly, setting up a scaffold_controller
+generator will cause part of it's namespace to be assumed when looking for
+the other items, like template_engine and test_framework.
+
+For example, setting scaffold_generator to "ninja_helper:scaffold_controller"
+will cause it to assume a base of "ninja_helper" and a context of "scaffold"
+when you run "rails generate scaffold", which will make it look for your view
+generator in "ninja_helper:erb" and "erb:scaffold", even if you don't explicitly
+set template_engine to anything.
+
+The fix for this was to specify the hooks for template_engine etc. with an
+:in => :rails parameter which causes it to look in the rails namespace
+(and thus retrieve the defaults) unless configs in application.rb specifically
+override those generators.
+
+Ultimately, Rails will generate eight acceptable namespaces for the
+generator based on the requested name in config in application.rb
+***It must live in one of those paths on the filesystem.***  However, the
+actual ruby module namespace does not need to match (seems to be irrelevant).
+The Rails 'namespace' can be massaged just by setting self.namespace(blah)
+in the class, for example:
+
+  self.namespace("rails:ninja_helper:erb")
+
+This lives in generators/rails/ninja_helper/erb_generator.rb, which is
+one of the acceptable namespaces/paths for a beast with this config:
+
+config.generators do |g|
+  g.template_engine 'ninja_helper:erb'
+end
+
+
+

data/lib/generators/mizugumo/install/install_generator.rb

@@ -21,8 +21,9 @@ DESC
         file = File.join("public", "javascripts", "application.js")
         append_to_file(file) do
           <<ADDITIONAL_JS
+
+// Generated by mizugumo install script
 Ninja.behavior({
-  // Generated by mizugumo install script
   // This line enables the NH behavior of graceful degradation of method links
   // to forms and back again
   '.mizugumo_graceful_form': Ninja.becomesLink
@@ -35,14 +36,15 @@ ADDITIONAL_JS
         say (<<NOTICE
 
 Mizugumo is installed!
-Remember to remove the default JS and link to the jQuery/NinjaScript
-script and CSS files by adding these to your application layout:
+Remember to remove the default JS and link to the jQuery/NinjaScript script and CSS files by adding these to your application layout:
 
   <%= stylesheet_link_tag 'mizugumo.css' %>
   <%= javascript_include_tag 'jquery-1.4.2.js' %>
   <%= javascript_include_tag 'jquery.ninja_script.js' %>
+  <%= javascript_include_tag 'rails.js' %>
   <%= javascript_include_tag 'application.js' %>
 
+The included rails.js is a jQuery-1.4.2 compatible implementation of rails.js, and should replace the default rails.js.
 If you want to use the Mizugumo AJAX scaffold generators, add this to your application.rb:
 
   config.generators do |g|

data/lib/generators/mizugumo/install/templates/javascripts/jquery.ninja_script.js

@@ -1,12 +1,17 @@
-// vim: sw=2 ft=javascript
-
+/* 
+ * NinjaScript - 0.8.0
+ * written and copyright 2010-2011 Judson Lester and Logical Reality Design
+ * Licensed under the MIT license
+ */
 Ninja = (function() {
-  function log(message) {
-    try {
-      console.log(message)
+    function log(message) {
+      if(false) { //LOGGING TURNED OFF IS 100% faster!
+        try {
+          console.log(message)
+        }
+        catch(e) {} //we're in IE or FF w/o Firebug or something
+      }
     }
-    catch(e) {} //we're in IE or FF w/o Firebug or something
-  }
 
   function isArray(candidate) {
     return (candidate.constructor == Array)
@@ -69,7 +74,7 @@ Ninja = (function() {
           collection.addBehavior(selector, dispatching[selector])
         }
       }
-      $(window).load( function(){ Ninja.go() } )
+      jQuery(window).load( function(){ Ninja.go() } )
     },
 
     badBehavior: function(nonsense) {
@@ -83,8 +88,7 @@ Ninja = (function() {
         //If we ever receive either of the W3C DOMMutation events, we don't need our IE based
         //hack, so nerf it
         rootOfDocument.one("DOMSubtreeModified DOMNodeInserted", function(){
-            this.fireMutationEvent = function(){}
-            this.addMutationTargets = function(t){}
+            Ninja.tools.detachSyntheticMutationEvents()
           })
         this.behavior = this.badBehavior
         this.tools.fireMutationEvent()
@@ -95,47 +99,20 @@ Ninja = (function() {
 
   function Tools(ninja) {
     this.ninja = ninja
-    this.mutationTargets = []
   }
 
   Tools.prototype = {
+    //Handy JS things
     forEach: forEach,
     enrich: function(left, right) {
-      return $.extend(left, right)
+      return jQuery.extend(left, right)
     },
     ensureDefaults: function(config, defaults) {
       return this.enrich(defaults, config)
     },
-    copyAttributes: function(from, to, which) {
-      var attributeList = []
-      var attrs = []
-      var match = new RegExp("^" + which.join("$|^") + "$")
-      to = $(to)
-      this.forEach(from.attributes, function(att) {
-          if(match.test(att.nodeName)) {
-            to.attr(att.nodeName, att.nodeValue)
-          }
-        })
-    },
-    addMutationTargets: function(targets) {
-      this.mutationTargets = this.mutationTargets.concat(target)
-    },
+    //DOM and Events
     getRootOfDocument: function() {
-      return $("html") //document.firstChild)
-    },
-    fireMutationEvent: function() {
-      var targets = this.mutationTargets
-      if (targets.length > 0 ) {
-        for(var target = targets.shift(); 
-          targets.length > 0; 
-          target = targets.shift()) {
-          $(target).trigger("thisChangedDOM")
-        }
-      }
-      else {
-        this.getRootOfDocument().trigger("thisChangedDOM")
-        //$("html").trigger("thisChangedDOM")
-      }
+      return jQuery("html") //document.firstChild)
     },
     clearRootCollection: function() {
       Ninja.behavior = Ninja.goodBehavior
@@ -151,13 +128,6 @@ Ninja = (function() {
       rootOfDocument.data("ninja-behavior", collection);
       return collection
     },
-    deriveElementsFrom: function(element, means){
-      switch(typeof means){
-      case 'undefined': return element
-      case 'string': return $(means)
-      case 'function': return means(element)
-      }
-    },
     suppressChangeEvents: function() {
       return new Behavior({
           events: {
@@ -166,32 +136,34 @@ Ninja = (function() {
           }
         })
     },
-    hiddenDiv: function() {
-      var existing = $("div#ninja-hide")
-      if(existing.length > 0) {
-        return existing[0]
-      }
-
-      var hide = $("<div id='ninja-hide'></div>").css("display", "none")
-      $("body").append(hide)
-      Ninja.tools.getRootCollection().applyBehaviorsTo(hide, [Ninja.tools.suppressChangeEvents()])
-      return hide
+    addMutationTargets: function(targets) {
+      this.getRootCollection().addMutationTargets(targets)
     },
-    ajaxSubmitter: function(form) {
-      return new AjaxSubmitter(form)
+    fireMutationEvent: function() {
+      this.getRootCollection().fireMutationEvent()
     },
-    overlay: function() {
-      // I really liked using 
-      //return new Overlay([].map.apply(arguments,[function(i) {return i}]))
-      //but IE8 doesn't implement ECMA 2.6.2 5th ed.
-
-      return new Overlay(jQuery.makeArray(arguments))
+    detachSyntheticMutationEvents: function() {
+      this.getRootCollection().fireMutationEvent = function(){}
+      this.getRootCollection().addMutationTargets = function(t){}
     },
-    busyOverlay: function(elem) {
-      var overlay = this.overlay(elem)
-      overlay.set.addClass("ninja busy")
-      overlay.laziness = this.ninja.config.busyLaziness
-      return overlay
+    //HTML Utils
+    copyAttributes: function(from, to, which) {
+      var attributeList = []
+      var attrs = []
+      var match = new RegExp("^" + which.join("$|^") + "$")
+      to = jQuery(to)
+      this.forEach(from.attributes, function(att) {
+          if(match.test(att.nodeName)) {
+            to.attr(att.nodeName, att.nodeValue)
+          }
+        })
+    },
+    deriveElementsFrom: function(element, means){
+      switch(typeof means){
+      case 'undefined': return element
+      case 'string': return jQuery(means)
+      case 'function': return means(element)
+      }
     },
     extractMethod: function(element, formData) {
       if(element.dataset !== undefined && 
@@ -201,9 +173,9 @@ Ninja = (function() {
         return element.dataset["method"]
       }
       if(element.dataset === undefined && 
-        $(element).attr("data-method") !== undefined) {
-        log("Override via data-method: " + $(element).attr("data-method"))
-        return $(element).attr("data-method")
+        jQuery(element).attr("data-method") !== undefined) {
+        log("Override via data-method: " + jQuery(element).attr("data-method"))
+        return jQuery(element).attr("data-method")
       }
       if(typeof formData !== "undefined") {
         for(var i=0, len = formData.length; i<len; i++) {
@@ -218,10 +190,46 @@ Ninja = (function() {
       } 
       return "GET"
     },
+    //Ninjascript utils
+    applyBehaviors: function(element, behaviors) {
+      this.getRootCollection().apply(element, behaviors)
+    },
+    message: function(text, classes) {
+      var addingMessage = this.ninja.config.messageWrapping(text, classes)
+      jQuery(this.ninja.config.messageList).append(addingMessage)
+    },
+    hiddenDiv: function() {
+      var existing = jQuery("div#ninja-hide")
+      if(existing.length > 0) {
+        return existing[0]
+      }
+
+      var hide = jQuery("<div id='ninja-hide'></div>").css("display", "none")
+      jQuery("body").append(hide)
+      Ninja.tools.getRootCollection().applyBehaviorsTo(hide, [Ninja.tools.suppressChangeEvents()])
+      return hide
+    },
+    ajaxSubmitter: function(form) {
+      return new AjaxSubmitter(form)
+    },
+    overlay: function() {
+      // I really liked using 
+      //return new Overlay([].map.apply(arguments,[function(i) {return i}]))
+      //but IE8 doesn't implement ECMA 2.6.2 5th ed.
+
+      return new Overlay(jQuery.makeArray(arguments))
+    },
+    busyOverlay: function(elem) {
+      var overlay = this.overlay(elem)
+      overlay.set.addClass("ninja busy")
+      overlay.laziness = this.ninja.config.busyLaziness
+      return overlay
+    },
     //Currently, this doesn't respect changes to the original block...
+    //There should be an "Overlay behavior" that gets applied
     buildOverlayFor: function(elem) {
-      var overlay = $(document.createElement("div"))
-      var hideMe = $(elem)
+      var overlay = jQuery(document.createElement("div"))
+      var hideMe = jQuery(elem)
       var offset = hideMe.offset()
       overlay.css("position", "absolute")
       overlay.css("top", offset.top)
@@ -230,10 +238,6 @@ Ninja = (function() {
       overlay.height(hideMe.outerHeight())
       overlay.css("zIndex", "2")
       return overlay
-    },
-    message: function(text, classes) {
-      var addingMessage = this.ninja.config.messageWrapping(text, classes)
-      $(this.ninja.config.messageList).append(addingMessage)
     }
   }
 
@@ -259,7 +263,7 @@ Ninja = (function() {
   AjaxSubmitter.prototype = {
     submit: function() {
       log("Computed method: " + this.method)
-      $.ajax(this.ajaxData())
+      jQuery.ajax(this.ajaxData())
     },
 
     ajaxData: function() {
@@ -302,7 +306,7 @@ Ninja = (function() {
     var elements = this.convertToElementArray(list)
     this.laziness = 0
     var ov = this
-    this.set = $(jQuery.map(elements, function(element, idx) {
+    this.set = jQuery(jQuery.map(elements, function(element, idx) {
           return ov.buildOverlayFor(element)
         }))
   }
@@ -313,7 +317,7 @@ Ninja = (function() {
       switch(typeof list) {
       case 'undefined': return []
       case 'boolean': return []
-      case 'string': return h.convertToElementArray($(list))
+      case 'string': return h.convertToElementArray(jQuery(list))
       case 'function': return h.convertToElementArray(list())
       case 'object': {
           //IE8 barfs on 'list instanceof Element'
@@ -335,8 +339,8 @@ Ninja = (function() {
     },
 
     buildOverlayFor: function(elem) {
-      var overlay = $(document.createElement("div"))
-      var hideMe = $(elem)
+      var overlay = jQuery(document.createElement("div"))
+      var hideMe = jQuery(elem)
       var offset = hideMe.offset()
       overlay.css("position", "absolute")
       overlay.css("top", offset.top)
@@ -348,7 +352,7 @@ Ninja = (function() {
       return overlay[0]
     },
     affix: function() {
-      this.set.appendTo($("body"))
+      this.set.appendTo(jQuery("body"))
       overlaySet = this.set
       window.setTimeout(function() {
           overlaySet.css("display", "block")
@@ -359,14 +363,6 @@ Ninja = (function() {
     }
   }
 
-  function BehaviorCollection() {
-    this.lexicalCount = 0
-    this.eventQueue = []
-    this.behaviors = {}
-    this.selectors = []
-    return this
-  }
-
   function EventScribe() {
     this.handlers = {}
     this.currentElement = null
@@ -377,8 +373,8 @@ Ninja = (function() {
       for(var eventName in this.handlers) {
         var handler = this.handlers[eventName]
         this.handlers[eventName] = function(eventRecord) {
-          handler(eventRecord)
-          $(element).remove()
+          handler.call(this, eventRecord)
+          jQuery(element).remove()
         }
       }
     },
@@ -401,7 +397,7 @@ Ninja = (function() {
     },
     applyEventHandlers: function(element) {
       for(var eventName in this.handlers) {
-        $(element).bind(eventName, this.handlers[eventName])
+        jQuery(element).bind(eventName, this.handlers[eventName])
       }
     }
   }
@@ -413,24 +409,35 @@ Ninja = (function() {
     this.stashedElements = []
   }
 
-  RootContext.prototype = {
-    stash: function(element) {
-      this.stashedElements.unshift(element)
-    },
-    clearStash: function() {
-      this.stashedElements = []
-    },
-    //XXX Of concern: how do cascading events work out?
-    //Should there be a first catch?  Or a "doesn't cascade" or something?
-    cascadeEvent: function(event) {
-      var formDiv = Ninja.tools.hiddenDiv()
-      forEach(this.stashedElements, function(element) {
-          var elem = $(element)
-          elem.data("ninja-visited", true)
-          $(formDiv).append(elem)
-          elem.trigger(event)
-        })
-    }
+  RootContext.prototype = Ninja.tools.enrich(
+    new Tools(Ninja),
+    {
+      stash: function(element) {
+        this.stashedElements.unshift(element)
+      },
+      clearStash: function() {
+        this.stashedElements = []
+      },
+      //XXX Of concern: how do cascading events work out?
+      //Should there be a first catch?  Or a "doesn't cascade" or something?
+      cascadeEvent: function(event) {
+        var formDiv = Ninja.tools.hiddenDiv()
+        forEach(this.stashedElements, function(element) {
+            var elem = jQuery(element)
+            elem.data("ninja-visited", true)
+            jQuery(formDiv).append(elem)
+            elem.trigger(event)
+          })
+      }
+  })
+
+  function BehaviorCollection() {
+    this.lexicalCount = 0
+    this.eventQueue = []
+    this.behaviors = {}
+    this.selectors = []
+    this.mutationTargets = []
+    return this
   }
 
   BehaviorCollection.prototype = {
@@ -469,7 +476,22 @@ Ninja = (function() {
         this.behaviors[selector].push(behavior)
       }
     },
-
+    addMutationTargets: function(targets) {
+      this.mutationTargets = this.mutationTargets.concat(target)
+    },
+    fireMutationEvent: function() {
+      var targets = this.mutationTargets
+      if (targets.length > 0 ) {
+        for(var target = targets.shift(); 
+          targets.length > 0; 
+          target = targets.shift()) {
+          jQuery(target).trigger("thisChangedDOM")
+        }
+      }
+      else {
+        Ninja.tools.getRootOfDocument().trigger("thisChangedDOM")
+      }
+    },
     mutationEventTriggered: function(evnt){
       if(this.eventQueue.length == 0){
         log("mutation event - first")
@@ -485,8 +507,8 @@ Ninja = (function() {
       var eventCovered = false
       var uncovered = []
       forEach(this.eventQueue, function(val) {
-          eventCovered = eventCovered || $.contains(val.target, evnt.target)
-          if (!($.contains(evnt.target, val.target))) {
+          eventCovered = eventCovered || jQuery.contains(val.target, evnt.target)
+          if (!(jQuery.contains(evnt.target, val.target))) {
             uncovered.push(val)
           }
         })
@@ -548,10 +570,12 @@ Ninja = (function() {
           }
         }
       )
-      $(element).data("ninja-visited", true)
+      jQuery(element).data("ninja-visited", true)
 
       scribe.applyEventHandlers(element)
 
+      this.fireMutationEvent()
+
       return element
     },
     collectBehaviors: function(element, collection, behaviors) {
@@ -574,12 +598,12 @@ Ninja = (function() {
     apply: function(element, startBehaviors, selectorIndex) {
       var applicableBehaviors = [], len = this.selectors.length
       this.collectBehaviors(element, applicableBehaviors, startBehaviors)
-      if (!$(element).data("ninja-visited")) {
+      if (!jQuery(element).data("ninja-visited")) {
         if(typeof selectorIndex == "undefined") {
           selectorIndex = 0
         }
         for(var j = selectorIndex; j < len; j++) {
-          if($(element).is(this.selectors[j])) {
+          if(jQuery(element).is(this.selectors[j])) {
             this.collectBehaviors(element, applicableBehaviors, this.behaviors[this.selectors[j]])
           }
         }
@@ -592,9 +616,9 @@ Ninja = (function() {
         var collection = this
 
         //Sizzle?
-        $(root).find(this.selectors[i]).each( 
+        jQuery(root).find(this.selectors[i]).each( 
           function(index, elem){
-            if (!$(elem).data("ninja-visited")) { //Pure optimization
+            if (!jQuery(elem).data("ninja-visited")) { //Pure optimization
               collection.apply(elem, [], i)
             }
           }
@@ -629,7 +653,7 @@ Ninja = (function() {
   Selectabehavior.prototype = {
     choose: function(element) {
       for(var selector in this.menu) {
-        if($(element).is(selector)) {
+        if(jQuery(element).is(selector)) {
           return this.menu[selector].choose(element)
         }
       }
@@ -670,7 +694,7 @@ Ninja = (function() {
       var context = this.inContext({})
 
       elem = this.applyTransform(context, elem)
-      $(elem).data("ninja-visited", true)
+      jQuery(elem).data("ninja-visited", true)
 
       this.applyEventHandlers(context, elem)
 
@@ -701,7 +725,7 @@ Ninja = (function() {
     applyEventHandlers: function(context, elem) {
       for(var eventName in this.eventHandlers) {
         var handler = this.eventHandlers[eventName]
-        $(elem).bind(eventName, this.makeHandler.call(context, handler))
+        jQuery(elem).bind(eventName, this.makeHandler.call(context, handler))
       }
       return elem
     },
@@ -718,6 +742,7 @@ Ninja = (function() {
       var stopDefault = true
       var stopPropagate = true
       var stopImmediate = false
+      var fireMutation = false
       var config = this.eventHandlers[eventName]
 
       if (typeof config == "function") {
@@ -728,15 +753,19 @@ Ninja = (function() {
         config = config.slice(1,config.length)
         var len = config.length
         for(var i = 0; i < len; i++) {
-          if (config[i] == "default") {
+          if (config[i] == "andDoDefault" || config[i] == "allowDefault") {
             stopDefault = false
           }
-          if (config[i] == "propagate") {
+          if (config[i] == "allowPropagate" || config[i] == "dontStopPropagation") {
             stopPropagate = false
           }
-          if (config[i] == "immediate" || config[i] == "other") {
+          //stopImmediatePropagation is a jQuery thing
+          if (config[i] == "andDoOthers") {
             stopImmediate = false
           }
+          if (config[i] == "changesDOM") {
+            fireMutation = true
+          }
         }
       }
       var handler = function(eventRecord) {
@@ -758,13 +787,24 @@ Ninja = (function() {
             eventRecord.stopImmediatePropagation()
           })
       }
+      if (fireMutation) {
+        handler = this.appendAction(handler, function(eventRecord) {
+            Ninja.tools.fireMutationEvent()
+          })
+      }
 
       return handler
     },
     prependAction: function(handler, doWhat) {
       return function(eventRecord) {
-        doWhat(eventRecord)
-        handler(eventRecord)
+        doWhat.call(this, eventRecord)
+        handler.call(this, eventRecord)
+      }
+    },
+    appendAction: function(handler, doWhat) {
+      return function(eventRecord) {
+        handler.call(this, eventRecord)
+        doWhat.call(this, eventRecord)
       }
     },
     transform: function(elem){ 
@@ -818,15 +858,15 @@ Ninja = (function() {
             priority: 10,
             helpers: {
               findOverlay: function(elem) {
-                return Ninja.tools.deriveElementsFrom(elem, configs.busyElement)
+                return this.deriveElementsFrom(elem, configs.busyElement)
               }
             },
             events: {
               click:  function(evnt) {
-                var overlay = Ninja.tools.busyOverlay(this.findOverlay(evnt.target))
-                var submitter = Ninja.tools.ajaxSubmitter()
+                var overlay = this.busyOverlay(this.findOverlay(evnt.target))
+                var submitter = this.ajaxSubmitter()
                 submitter.action = evnt.target.href
-                submitter.method = Ninja.tools.extractMethod(evnt.target)
+                submitter.method = this.extractMethod(evnt.target)
 
                 submitter.onResponse = function(xhr, statusTxt) {
                   overlay.remove()
@@ -857,16 +897,16 @@ Ninja = (function() {
             priority: 20,
             helpers: {
               findOverlay: function(elem) {
-                return Ninja.tools.deriveElementsFrom(elem, configs.busyElement)
+                return this.deriveElementsFrom(elem, configs.busyElement)
               }
             },
             events: {
               submit: function(evnt) {
-                var overlay = Ninja.tools.busyOverlay(this.findOverlay(evnt.target))
-                var submitter = Ninja.tools.ajaxSubmitter()
-                submitter.formData = $(evnt.target).serializeArray()
+                var overlay = this.busyOverlay(this.findOverlay(evnt.target))
+                var submitter = this.ajaxSubmitter()
+                submitter.formData = jQuery(evnt.target).serializeArray()
                 submitter.action = evnt.target.action
-                submitter.method = Ninja.tools.extractMethod(evnt.target, submitter.formData)
+                submitter.method = this.extractMethod(evnt.target, submitter.formData)
 
                 submitter.onResponse = function(xhr, statusTxt) {
                   overlay.remove()
@@ -886,7 +926,7 @@ Ninja = (function() {
       //busy overlay - by default we overlay the element itself
       //
       //this.becomesAjaxLink({
-      //  busyElement: function(elem) { $("#user-notification") }
+      //  busyElement: function(elem) { jQuery("#user-notification") }
       //})
       becomesAjaxLink: function(configs) {
         if(!(configs instanceof Object)) {
@@ -917,11 +957,11 @@ Ninja = (function() {
             priority: 30,
             transform: function(form){
               var linkText
-              if ((images = $('input[type=image]', form)).size() > 0){
+              if ((images = jQuery('input[type=image]', form)).size() > 0){
                 image = images[0]
                 linkText = "<img src='" + image.src + "' alt='" + image.alt +"'";
               } 
-              else if((submits = $('input[type=submit]', form)).size() > 0) {
+              else if((submits = jQuery('input[type=submit]', form)).size() > 0) {
                 submit = submits[0]
                 if(submits.size() > 1) {
                   log("Multiple submits.  Using: " + submit)
@@ -932,9 +972,9 @@ Ninja = (function() {
                 log("Couldn't find a submit input in form");
               }
 
-              var link = $("<a rel='nofollow' href='#'>" + linkText + "</a>")
-              Ninja.tools.copyAttributes(form, link, configs.retainAttributes)
-              this.stash($(form).replaceWith(link))
+              var link = jQuery("<a rel='nofollow' href='#'>" + linkText + "</a>")
+              this.copyAttributes(form, link, configs.retainAttributes)
+              this.stash(jQuery(form).replaceWith(link))
               return link
             },
             events: {
@@ -955,26 +995,23 @@ Ninja = (function() {
       //{ lifetime: 10000, diesFor: 600 }
 
       decays: function(configs) {
-        if(typeof configs == "undefined") { configs = {} }
-
-        if(typeof configs.lifetime == "undefined") {
-          configs.lifetime = 10000
-        }
-
-        if(typeof configs.diesFor == "undefined") {
-          configs.diesFor = 600
-        }
+        configs = Ninja.tools.ensureDefaults(configs, {
+            lifetime: 10000,
+            diesFor: 600
+          })
 
         return new ninja.does({
             priority: 100,
             transform: function(elem) {
-              $(elem).delay(configs.lifetime).slideUp(configs.diesFor, function(){
-                  $(elem).remove()})
+              jQuery(elem).delay(configs.lifetime).slideUp(configs.diesFor, function(){
+                  jQuery(elem).remove()
+                  Ninja.tools.fireMutationEvent()
+                })
             },
             events: {
-              click:  function(evnt, elem) {
-                $(elem).remove();
-              }
+              click:  [function(event) {
+                jQuery(this.element).remove();
+              }, "changesDOM"]
             }
           })
       }

data/lib/generators/mizugumo/install/templates/javascripts/rails.js

@@ -0,0 +1,132 @@
+jQuery(function ($) {
+    var csrf_token = $('meta[name=csrf-token]').attr('content'),
+        csrf_param = $('meta[name=csrf-param]').attr('content');
+
+    $.fn.extend({
+        /**
+         * Triggers a custom event on an element and returns the event result
+         * this is used to get around not being able to ensure callbacks are placed
+         * at the end of the chain.
+         *
+         * TODO: deprecate with jQuery 1.4.2 release, in favor of subscribing to our
+         *       own events and placing ourselves at the end of the chain.
+         */
+        triggerAndReturn: function (name, data) {
+            var event = new $.Event(name);
+            this.trigger(event, data);
+
+            return event.result !== false;
+        },
+
+        /**
+         * Handles execution of remote calls firing overridable events along the way
+         */
+        callRemote: function () {
+            var el      = this,
+                method  = el.attr('method') || el.attr('data-method') || 'GET',
+                url     = el.attr('action') || el.attr('href'),
+                dataType  = el.attr('data-type')  || 'script';
+
+            if (url === undefined) {
+              throw "No URL specified for remote call (action or href must be present).";
+            } else {
+                if (el.triggerAndReturn('ajax:before')) {
+                    var data = el.is('form') ? el.serializeArray() : [];
+                    $.ajax({
+                        url: url,
+                        data: data,
+                        dataType: dataType,
+                        type: method.toUpperCase(),
+                        beforeSend: function (xhr) {
+                            el.trigger('ajax:loading', xhr);
+                        },
+                        success: function (data, status, xhr) {
+                            el.trigger('ajax:success', [data, status, xhr]);
+                        },
+                        complete: function (xhr) {
+                            el.trigger('ajax:complete', xhr);
+                        },
+                        error: function (xhr, status, error) {
+                            el.trigger('ajax:failure', [xhr, status, error]);
+                        }
+                    });
+                }
+
+                el.trigger('ajax:after');
+            }
+        }
+    });
+
+    /**
+     *  confirmation handler
+     */
+    $('a[data-confirm],input[data-confirm]').live('click', function () {
+        var el = $(this);
+        if (el.triggerAndReturn('confirm')) {
+            if (!confirm(el.attr('data-confirm'))) {
+                return false;
+            }
+        }
+    });
+
+
+    /**
+     * remote handlers
+     */
+    $('form[data-remote]').live('submit', function (e) {
+        $(this).callRemote();
+        e.preventDefault();
+    });
+
+    $('a[data-remote],input[data-remote]').live('click', function (e) {
+        $(this).callRemote();
+        e.preventDefault();
+    });
+
+    $('a[data-method]:not([data-remote])').live('click', function (e){
+        var link = $(this),
+            href = link.attr('href'),
+            method = link.attr('data-method'),
+            form = $('<form method="post" action="'+href+'"></form>'),
+            metadata_input = '<input name="_method" value="'+method+'" type="hidden" />';
+
+        if (csrf_param != null && csrf_token != null) {
+          metadata_input += '<input name="'+csrf_param+'" value="'+csrf_token+'" type="hidden" />';
+        }
+
+        form.hide()
+            .append(metadata_input)
+            .appendTo('body');
+
+        e.preventDefault();
+        form.submit();
+    });
+
+    /**
+     * disable-with handlers
+     */
+    var disable_with_input_selector           = 'input[data-disable-with]';
+    var disable_with_form_remote_selector     = 'form[data-remote]:has('       + disable_with_input_selector + ')';
+    var disable_with_form_not_remote_selector = 'form:not([data-remote]):has(' + disable_with_input_selector + ')';
+
+    var disable_with_input_function = function () {
+        $(this).find(disable_with_input_selector).each(function () {
+            var input = $(this);
+            input.data('enable-with', input.val())
+                .attr('value', input.attr('data-disable-with'))
+                .attr('disabled', 'disabled');
+        });
+    };
+
+    $(disable_with_form_remote_selector).live('ajax:before', disable_with_input_function);
+    $(disable_with_form_not_remote_selector).live('submit', disable_with_input_function);
+
+    $(disable_with_form_remote_selector).live('ajax:complete', function () {
+        $(this).find(disable_with_input_selector).each(function () {
+            var input = $(this);
+            input.removeAttr('disabled')
+                 .val(input.data('enable-with'));
+        });
+    });
+
+});

data/lib/mizugumo_link_helper.rb

@@ -43,11 +43,14 @@ module MizugumoLinkHelper
     # debugger
     method = html_options[:method]
 
+    # debugger
+
     cssclass      = [ 'mizugumo_graceful_form' ]
     cssclass      << html_options[:class] unless html_options[:class].blank?
     html_options = convert_options_to_data_attributes(options, html_options)
     html_options.merge!({:action => action, :method => :post, :title => title, :class => cssclass})
     html_options.delete('rel')
+    html_options.delete('class')
 
     content_tag(:form, html_options) do
       hidden_field_tag("_method", method) +

metadata

@@ -1,13 +1,13 @@
 --- !ruby/object:Gem::Specification 
 name: mizugumo
 version: !ruby/object:Gem::Version 
-  hash: 27
+  hash: 25
   prerelease: 
   segments: 
   - 0
   - 1
-  - 0
-  version: 0.1.0
+  - 1
+  version: 0.1.1
 platform: ruby
 authors: 
 - Evan Dorn
@@ -15,7 +15,7 @@ autorequire:
 bindir: bin
 cert_chain: []
 
-date: 2011-01-25 00:00:00 -08:00
+date: 2011-02-03 00:00:00 -08:00
 default_executable: 
 dependencies: 
 - !ruby/object:Gem::Dependency 
@@ -79,7 +79,7 @@ dependencies:
         version: "0"
   type: :development
   version_requirements: *id004
-description: Seamless UJS for Rails using NinjaScript
+description: "Seamless UJS for Rails using NinjaScript.\n    Get RESTFul delete links that work without JavaScript and AJAXy\n    behavior that degrades gracefully right out of your scaffold!\n  "
 email: evan@lrdesign.com
 executables: []
 
@@ -100,6 +100,7 @@ files:
 - lib/generators/mizugumo/install/templates/images/ui/spinner.gif
 - lib/generators/mizugumo/install/templates/javascripts/jquery-1.4.2.js
 - lib/generators/mizugumo/install/templates/javascripts/jquery.ninja_script.js
+- lib/generators/mizugumo/install/templates/javascripts/rails.js
 - lib/generators/mizugumo/install/templates/stylesheets/mizugumo.css
 - lib/generators/mizugumo/install/templates/stylesheets/sass/mizugumo.sass
 - lib/generators/rails/mizugumo/erb_generator.rb
@@ -126,9 +127,12 @@ files:
 - lib/generators/rails/mizugumo/view_generator.rb
 - lib/mizugumo.rb
 - lib/mizugumo_link_helper.rb
+- doc/making_generators.txt
+- doc/NAME.haml
+- doc/PURPOSE.haml
 - spec/spec_helper.rb
 has_rdoc: true
-homepage: http://github.com/IdahoEv/mizugumo
+homepage: http://github.com/LRDesign/mizugumo
 licenses: 
 - MIT
 post_install_message: