app/jquery/jquery-editable-1.3.3.js
author Lennard de Rijk <ljvderijk@gmail.com>
Sun, 25 Oct 2009 18:43:23 -0700
changeset 3050 5f135cfac194
parent 2420 645f4de26f99
permissions -rw-r--r--
Reworked the redirects to work with the new Request model. Also made use of the collection of Role Views in the Role View in combination with the role property in the Request model, to facilitate the redirects.

(function($){
/*
 * Editable 1.3.3
 *
 * Copyright (c) 2009 Arash Karimzadeh (arashkarimzadeh.com)
 * Licensed under the MIT (MIT-LICENSE.txt)
 * http://www.opensource.org/licenses/mit-license.php
 *
 * Date: Mar 02 2009
 */
$.fn.editable = function(options){
  var defaults = {
    onEdit: null,
    onSubmit: null,
    onCancel: null,
    editClass: null,
    submit: null,
    cancel: null,
    type: 'text', //text, textarea or select
    submitBy: 'blur', //blur,change,dblclick,click
    editBy: 'click',
    options: null
}
  if(options=='disable')
    return this.unbind(this.data('editable.options').editBy,this.data('editable.options').toEditable);
  if(options=='enable')
    return this.bind(this.data('editable.options').editBy,this.data('editable.options').toEditable);
  if(options=='destroy')
    return  this.unbind(this.data('editable.options').editBy,this.data('editable.options').toEditable)
          .data('editable.previous',null)
          .data('editable.current',null)
          .data('editable.options',null);
  
  var options = $.extend(defaults, options);
  
  options.toEditable = function(){
    $this = $(this);
    $this.data('editable.current',$this.html());
    opts = $this.data('editable.options');
    $.editableFactory[opts.type].toEditable($this.empty(),opts);
    // Configure events,styles for changed content
    $this.data('editable.previous',$this.data('editable.current'))
       .children()
         .focus()
         .addClass(opts.editClass);
    // Submit Event
    if(opts.submit){
      $('<button/>').appendTo($this)
            .html(opts.submit)
            .one('mouseup',function(){opts.toNonEditable($(this).parent(),true)});
}else
      $this.one(opts.submitBy,function(){opts.toNonEditable($(this),true)})
         .children()
           .one(opts.submitBy,function(){opts.toNonEditable($(this).parent(),true)});
    // Cancel Event
    if(opts.cancel)
      $('<button/>').appendTo($this)
            .html(opts.cancel)
            .one('mouseup',function(){opts.toNonEditable($(this).parent(),false)});
    // Call User Function
    if($.isFunction(opts.onEdit))
      opts.onEdit.apply(  $this,
                  [{
                    current:$this.data('editable.current'),
                    previous:$this.data('editable.previous')
}]
                );
}
  options.toNonEditable = function($this,change){
    opts = $this.data('editable.options');
    // Configure events,styles for changed content
    $this.one(opts.editBy,opts.toEditable)
       .data( 'editable.current',
            change
            ?$.editableFactory[opts.type].getValue($this,opts)
  :$this.data('editable.current')
          )
       .html(
            opts.type=='password'
               ?'*****'
  :$this.data('editable.current')
          );
    // Call User Function
    var func = null;
    if($.isFunction(opts.onSubmit)&&change==true)
      func = opts.onSubmit;
    else if($.isFunction(opts.onCancel)&&change==false)
      func = opts.onCancel;
    if(func!=null)
      func.apply($this,
            [{
              current:$this.data('editable.current'),
              previous:$this.data('editable.previous')
}]
          );
}
  this.data('editable.options',options);
  return  this.one(options.editBy,options.toEditable);
}
$.editableFactory = {
  'text': {
    toEditable: function($this,options){
      $('<input/>').appendTo($this)
             .val($this.data('editable.current'));
},
    getValue: function($this,options){
      return $this.children().val();
}
},
  'password': {
    toEditable: function($this,options){
      $this.data('editable.current',$this.data('editable.password'));
      $this.data('editable.previous',$this.data('editable.password'));
      $('<input type="password"/>').appendTo($this)
                     .val($this.data('editable.current'));
},
    getValue: function($this,options){
      $this.data('editable.password',$this.children().val());
      return $this.children().val();
}
},
  'textarea': {
    toEditable: function($this,options){
      $('<textarea/>').appendTo($this)
              .val($this.data('editable.current'));
},
    getValue: function($this,options){
      return $this.children().val();
}
},
  'select': {
    toEditable: function($this,options){
      $select = $('<select/>').appendTo($this);
      $.each( options.options,
          function(key,value){
            $('<option/>').appendTo($select)
                  .html(value)
                  .attr('value',key);
}
           )
      $select.children().each(
        function(){
          var opt = $(this);
          if(opt.text()==$this.data('editable.current'))
            return opt.attr('selected', 'selected').text();
}
      )
},
    getValue: function($this,options){
      var item = null;
      $('select', $this).children().each(
        function(){
          if($(this).attr('selected'))
            return item = $(this).text();
}
      )
      return item;
}
}
}
})(jQuery);