move dateui to folder, add jquery-ui-datepicker

src/containers/editable-container.js

@@ -1,8 +1,11 @@
 /**
-Container for editableform. It can be popup (bootstrap-popover, jqueryui-tooltip, poshytip..) or inline.
+Attaches stand-alone container with editable-form to HTML element. Element is used only for positioning, value is not stored anywhere.<br>
-Applied as jQuery method to any element. Element is used only for positioning!
+This method applied internally in <code>$().editable()</code>. You should subscribe on it's events (save / cancel) to get profit of it.<br>
+Final realization can be different: bootstrap-popover, jqueryui-tooltip, poshytip, inline-div. It depends on which js file you include.<br>
+Applied as jQuery method.
 
 @class editableContainer
+@uses editableform
 **/
 (function ($) {
 
@@ -168,10 +171,11 @@ Applied as jQuery method to any element. Element is used only for positioning!
         @property value 
         @type mixed
         @default null
+        @private
         **/        
         value: null,
         /**
-        Placement of container relative to element. Can be top|right|bottom|left. Not used for inline container.
+        Placement of container relative to element. Can be <code>top|right|bottom|left</code>. Not used for inline container.
 
         @property placement 
         @type string
@@ -184,6 +188,7 @@ Applied as jQuery method to any element. Element is used only for positioning!
         @property autohide 
         @type boolean
         @default true
+        @private 
         **/        
         autohide: true
     };

src/editable-form/editable-form-bootstrap.js

@@ -1,10 +1,6 @@
-/**
+/*
 Editableform based on Twitter Bootstrap
-
+*/
-@class editableform (bootstrap)
-@module editableform
-@uses editableform
-**/
 (function ($) {
     
     //form template

src/editable-form/editable-form-jqueryui.js

@@ -1,10 +1,6 @@
-/**
+/*
 Editableform based on jQuery UI
-
+*/
-@class editableform (jqueryui)
-@module editableform
-@uses editableform
-**/
 (function ($) {
     
     $.extend($.fn.editableform.Constructor.prototype, {

src/editable-form/editable-form-utils.js

@@ -1,5 +1,5 @@
 /**
-* EditableForm utils
+* EditableForm utilites
 */
 (function ($) {
     $.extend($.fn.editableform, {

src/editable-form/editable-form.js

@@ -4,6 +4,8 @@ Applied as jQuery method to DIV tag (not to form tag!)
 Editableform is linked with one of input types, e.g. 'text' or 'select'.
 
 @class editableform
+@uses text
+@uses textarea
 **/
 (function ($) {
     
@@ -39,7 +41,7 @@ Editableform is linked with one of input types, e.g. 'text' or 'select'.
         @method render
         **/        
         render: function() {
-            this.$loading = $(this.options.loading);        
+            this.$loading = $($.fn.editableform.loading);        
             this.$container.empty().append(this.$loading);
             this.showLoading();
            
@@ -258,7 +260,7 @@ Editableform is linked with one of input types, e.g. 'text' or 'select'.
         /* see also defaults for input */
         
         /**
-        Type of input. Can be text|textarea|select|date
+        Type of input. Can be <code>text|textarea|select|date</code>
 
         @property type 
         @type String
@@ -316,14 +318,6 @@ Editableform is linked with one of input types, e.g. 'text' or 'select'.
         **/          
         send: 'auto', 
         /**
-        Template for loading element
-
-        @property loading 
-        @type String
-        @default <div class="editableform-loading"></div>
-        **/         
-        loading: '<div class="editableform-loading"></div>',
-        /**
         Function for client-side validation. If returns string - means validation not passed and string showed as error.
 
         @property validate 
@@ -348,14 +342,18 @@ Editableform is linked with one of input types, e.g. 'text' or 'select'.
     '<div class="editable-error-block"></div>' + 
     '</form>';
       
+      //loading div
+      $.fn.editableform.loading = '<div class="editableform-loading"></div>';
+      
       //error class attahced to control-group
-      $.fn.editableform.errorGroupClass = null;
+      $.fn.editableform.errorGroupClass = null;  
+      
       //error class attahced to editable-error-block
       $.fn.editableform.errorBlockClass = 'editable-error';
 
         
     //input types
-    $.fn.editableform.types = {};
+//    $.fn.editableform.types = {};
-    $.fn.editableform.utils = {};
+    //$.fn.editableform.utils = {};
 
 }(window.jQuery));

src/element/editable-element.js

@@ -1,8 +1,8 @@
 /**
-Makes editable any HTML element on page.
+Makes editable any HTML element on the page. Applied as jQuery method.
-Applied as jquery method.
 
 @class editable
+@uses editableContainer
 **/
 (function ($) {
 
@@ -449,7 +449,7 @@ Applied as jquery method.
 
     $.fn.editable.defaults = {
         /**
-        Type of input. Can be text|textarea|select|date
+        Type of input. Can be <code>text|textarea|select|date</code>
 
         @property type 
         @type String
@@ -482,7 +482,7 @@ Applied as jquery method.
         emptytext: 'Empty',
         /**
         Allows to automatically set element's text based on it's value. Usefull for select and date.
-        For example, if element's list is <code>{1: 'a', 2: 'b'}</code> value set to <code>1</code>, it's text will be automatically set to <code>a</code>.
+        For example, if dropdown list is <code>{1: 'a', 2: 'b'}</code> and elements value set to <code>1</code>, it's html will be automatically set to <code>a</code>.
         Can be auto|always|never. <code>auto</code> means text will be set only if element is empty.
         <code>always|never</code> means always(never) try to set element's text.
 
@@ -501,6 +501,14 @@ Applied as jquery method.
         **/          
         enablefocus: false,
         /**
+        Initial value of input
+
+        @property value 
+        @type mixed
+        @default element's text
+        **/
+        value: null,
+        /**
         Success callback. Called when value successfully sent on server and response status = 200.
         Can be used to process json response. If this function returns string - means error occured and string is shown as error message.
         

src/inputs/abstract.js

@@ -1,16 +1,19 @@
 /**
-* editable abstract type definition
+Abstract editable input class.
-* Every new type must implement this interface
+To create your own input you should inherit from this class.
-* It does not store value or text. It just store settings and input
+
-*/
+@class abstract
+**/
 (function ($) {
 
     var Abstract = function () { };
 
     Abstract.prototype = {
        /**
-        * initialize settings
+        Iinitializes input
-        */
+        
+        @method init() 
+        **/
        init: function(type, options, defaults) {
            this.type = type;
            this.options = $.extend({}, defaults, options); 
@@ -19,9 +22,10 @@
        },
        
        /**
-       * creates DOM element which is ready to be shown
+        Renders input. Can return jQuery deferred object.
-       * Can return jQuery deferred object
+        
-       */
+        @method render() 
+       **/       
        render: function() {
             this.$input = $(this.options.tpl);
             if(this.options.inputclass) {
@@ -34,51 +38,74 @@
        }, 
 
        /**
-       * set element's html by value
+        Sets element's html by value. 
-       */
+        
+        @method value2html(value, element) 
+        @param {mixed} value
+        @param {DOMElement} element
+       **/       
        value2html: function(value, element) {
            var html = $('<div>').text(value).html();
            $(element).html(html);
        },
         
        /**
-       * returns value from element's html
+        Converts element's html to value
-       */       
+        
+        @method html2value(html) 
+        @param {string} html
+        @returns {mixed}
+       **/             
        html2value: function(html) {
            return $('<div>').html(html).text();
        },
         
        /**
-       * convert value to string for submiting on server
+        Converts value to string (for submiting to server)
-       */
+        
+        @method value2str(value) 
+        @param {mixed} value
+        @returns {string}
+       **/       
        value2str: function(value) {
            return value;
        }, 
        
        /**
-       * convert string received from server (data-value or options.value) into value object
+        Converts string received from server into value.
-       */
+        
+        @method str2value(str) 
+        @param {string} str
+        @returns {mixed}
+       **/        
        str2value: function(str) {
            return str;
        }, 
        
        /**
-       * set value to input
+        Sets value of input.
-       */
+        
+        @method value2input(value) 
+        @param {mixed} value
+       **/       
        value2input: function(value) {
            this.$input.val(value);
        },
         
        /**
-       * returns value (object) by input 
+        Returns value of input. Value can be object (e.g. datepicker)
-       */
+        
+        @method input2value() 
+       **/         
        input2value: function() { 
            return this.$input.val();
        }, 
 
        /**
-       * method called to focus input again
+        Activates input. For text it sets focus.
-       */
+        
+        @method activate() 
+       **/        
        activate: function() {
            if(this.$input.is(':visible')) {
                this.$input.focus();
@@ -86,11 +113,31 @@
        } 
     };
         
-    Abstract.defaults = {    
+    Abstract.defaults = {  
+        /**
+        HTML template of input
+
+        @property tpl 
+        @type string
+        @default ''
+        **/   
         tpl: '',
+        /**
+        CSS class automatically applied to input
+
+        @property inputclass 
+        @type string
+        @default 'span2'
+        **/         
         inputclass: 'span2',
-        name: null,
+        /**
-        placeholder: false
+        Name attribute of input
+
+        @property name 
+        @type string
+        @default null
+        **/         
+        name: null
     };
     
     $.extend($.fn.editableform.types, {abstract: Abstract});

src/inputs/dateui/dateui.js

@@ -1,7 +1,10 @@
 /**
-* jQuery UI Datepicker
+jQuery UI Datepicker
-* Note: you can not use both date and dateui on the one page!
+Note: you can not use both date and dateui on the same page.
-*/
+
+@class dateui
+@extends abstract
+**/
 (function ($) {
 
     var DateUI = function (options) {
@@ -86,14 +89,48 @@
     });
     
     DateUI.defaults = $.extend({}, $.fn.editableform.types.abstract.defaults, {
+        /**
+        @property tpl 
+        @default <div style="float: left"></div>
+        **/         
         tpl:'<div style="float: left"></div>',
+        /**
+        @property inputclass 
+        @default ''
+        **/         
         inputclass: '',
-        format:'yyyy-mm-dd', //format used for sending to server and converting from value
+        /**
-        viewformat: null,  //used for display date in element
+        Format used for sending value to server. Also applied when converting date from <code>data-value</code> attribute.<br>
+        Full <a href="http://docs.jquery.com/UI/Datepicker/formatDate">list of tokens</a>.  
         
-        //special options
+        @property format 
-        firstDay: 0,
+        @type string
-        datepicker:{
+        @default yyyy-mm-dd
+        **/          
+        format:'yyyy-mm-dd', 
+        /**
+        Format used for displaying date. If not specified equals to <code>format</code>
+        
+        @property viewformat 
+        @type string
+        @default null
+        **/          
+        viewformat: null,
+        
+        /**
+        Configuration of datepicker.
+        Full list of <a href="http://api.jqueryui.com/datepicker">possible options</a>. 
+        
+        @property datepicker 
+        @type object
+        @default {
+           firstDay: 0, 
+           changeYear: true, 
+           changeMonth: true
+        }
+        **/
+        datepicker: {
+            firstDay: 0,
             changeYear: true,
             changeMonth: true
         }

src/inputs/select.js

@@ -1,6 +1,9 @@
 /**
-* select
+Select input
-*/
+
+@class select
+@extends abstract
+**/
 (function ($) {
 
     var Select = function (options) {
@@ -213,9 +216,38 @@
     });      
 
     Select.defaults = $.extend({}, $.fn.editableform.types.abstract.defaults, {
+        /**
+        @property tpl 
+        @default <select></select>
+        **/         
         tpl:'<select></select>',
-        source:null,  //can be string (url), object or array [{value: 1, text: 'abc'}, {...}]
+        /**
+        Source data for dropdown list. If string - considered ajax url to load items. Otherwise should be an array.
+        Array format is: <code>[{value: 1, text: "text"}, {...}]</code><br>
+        For compability it also supports format <code>{value1: text1, value2: text2 ...}</code> but it does not guarantee elements order.      
+
+        @property source 
+        @type string|array|object
+        @default null
+        @example
+        source: 'groups.php' 
+        **/         
+        source:null, 
+        /**
+        Data automatically prepended to the begining of dropdown list.
+        
+        @property prepend 
+        @type string|array|object
+        @default false
+        **/         
         prepend:false,
+        /**
+        Error message shown when list cannot be loaded (e.g. ajax error)
+        
+        @property sourceError 
+        @type string
+        @default Error when loading options
+        **/          
         sourceError: 'Error when loading options'
     });
 

src/inputs/text.js

@@ -1,6 +1,9 @@
 /**
-* text
+Text input
-*/
+
+@class text
+@extends abstract
+**/
 (function ($) {
     var Text = function (options) {
         this.init('text', options, Text.defaults);
@@ -18,9 +21,21 @@
     });
 
     Text.defaults = $.extend({}, $.fn.editableform.types.abstract.defaults, {
-        tpl: '<input type="text">' 
+        /**
+        @property tpl 
+        @default <input type="text">
+        **/         
+        tpl: '<input type="text">',
+        /**
+        Placeholder attribute of input. Shown when input is empty.
+
+        @property placeholder 
+        @type string
+        @default null
+        **/             
+        placeholder: null
     });
 
     $.fn.editableform.types.text = Text;
 
-}(window.jQuery));
+}(window.jQuery));

src/inputs/textarea.js

@@ -1,6 +1,10 @@
 /**
-* textarea
+Textarea input
-*/
+
+@class textarea
+@extends abstract
+@module inputs
+**/
 (function ($) {
 
     var Textarea = function (options) {
@@ -53,8 +57,24 @@
     });
 
     Textarea.defaults = $.extend({}, $.fn.editableform.types.abstract.defaults, {
+        /**
+        @property tpl 
+        @default <textarea rows="8"></textarea>
+        **/          
         tpl:'<textarea rows="8"></textarea>',
-        inputclass:'span3'
+        /**
+        @property inputclass 
+        @default 'span3'
+        **/          
+        inputclass:'span3',
+        /**
+        Placeholder attribute of input. Shown when input is empty.
+
+        @property placeholder 
+        @type string
+        @default null
+        **/             
+        placeholder: null        
     });
 
     $.fn.editableform.types.textarea = Textarea;