From ad312b05c4753eea327ced28b55c2159ee4ee86e Mon Sep 17 00:00:00 2001
From: Robert Robinson <Robr3rd@gmail.com>
Date: Thu, 19 Sep 2013 23:17:12 -0400
Subject: [PATCH 1/3] Improved the aesthetic look to fall more inline with
 Twitter Bootstrap design p$

-Changed the placeholder to a more "clean-looking" sequence of non-blank spaces
-Added an input type for Bootstrap Datepicker
-Said datepicker autocloses and submits the input upon date selection
-Tweaked the input and textarea input types to use Twitter Bootstrap's clases/styles
---
 jquery.jeditable.js | 33 ++++++++++++++++++++++++++++-----
 1 file changed, 28 insertions(+), 5 deletions(-)

diff --git a/jquery.jeditable.js b/jquery.jeditable.js
index 1d066d4..8eb293e 100644
--- a/jquery.jeditable.js
+++ b/jquery.jeditable.js
@@ -421,7 +421,7 @@
                             });
                         /* Otherwise use button with given string as text. */
                         } else {
-                            var submit = $('<button type="submit" />');
+                            var submit = $('<button type="submit" class="btn btn-sm btn-primary" />');
                             submit.html(settings.submit);                            
                         }
                         $(this).append(submit);
@@ -432,7 +432,7 @@
                             var cancel = $(settings.cancel);
                         /* otherwise use button with given string as text */
                         } else {
-                            var cancel = $('<button type="cancel" />');
+                            var cancel = $('<button type="cancel" class="btn btn-sm" />');
                             cancel.html(settings.cancel);
                         }
                         $(this).append(cancel);
@@ -451,7 +451,7 @@
             },
             text: {
                 element : function(settings, original) {
-                    var input = $('<input />');
+                    var input = $('<input class="form-control input-sm" />');
                     if (settings.width  != 'none') { input.attr('width', settings.width);  }
                     if (settings.height != 'none') { input.attr('height', settings.height); }
                     /* https://bugzilla.mozilla.org/show_bug.cgi?id=236791 */
@@ -463,7 +463,7 @@
             },
             textarea: {
                 element : function(settings, original) {
-                    var textarea = $('<textarea />');
+                    var textarea = $('<textarea class="form-control" />');
                     if (settings.rows) {
                         textarea.attr('rows', settings.rows);
                     } else if (settings.height != "none") {
@@ -537,10 +537,33 @@
         onblur     : 'cancel',
         loadtype   : 'GET',
         loadtext   : 'Loading...',
-        placeholder: 'Click to edit',
+        placeholder: '&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;', // CUSTOM
+        indicator  : '<img src="assets/img/indicator.gif" /> Saving...', // CUSTOM
+        style      : 'display: inline;',  // CUSTOM
         loaddata   : {},
         submitdata : {},
         ajaxoptions: {}
     };
 
 })(jQuery);
+
+// Datepicker extension
+// From: http://anotherjsl.blogspot.com/2012/10/jeditable-custom-type-using-bootstrap.html
+$.editable.addInputType('datepicker', {
+    element: function(settings, original) {
+        var input = $('<input class="form-control" style="display:inline" />'); // CUSTOM - added class
+        $(this).append(input);
+        if (settings.width  != 'none') { input.width(settings.width);  } // CUSTOM (from text type above)
+        if (settings.height != 'none') { input.height(settings.height); } // CUSTOM (from text type above)
+        return (input);
+    },
+    plugin: function(settings, original) {
+        settings.onblur = 'ignore';
+        $(this).find('input').datepicker({
+            'autoclose': true, // CUSTOM
+            format: 'mm/dd/yyyy' // CUSTOM
+        }).on('changeDate', function(){ // CUSTOM
+            $(this).submit(); // CUSTOM -- Submits input as soon as a date is selected
+        }); // CUSTOM
+    }
+});
\ No newline at end of file

From d6e6631545c48028abe5581d933f7fdca71556cb Mon Sep 17 00:00:00 2001
From: Robert Robinson <Robr3rd@gmail.com>
Date: Thu, 19 Sep 2013 23:28:37 -0400
Subject: [PATCH 2/3] Made use of the included indicator.gif image (actually
 using it when saving now), and replace the long &nbsp; placeholder with the
 FontAwesome "icon-edit" as a placeholder

---
 jquery.jeditable.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/jquery.jeditable.js b/jquery.jeditable.js
index 8eb293e..8c9a086 100644
--- a/jquery.jeditable.js
+++ b/jquery.jeditable.js
@@ -537,7 +537,7 @@
         onblur     : 'cancel',
         loadtype   : 'GET',
         loadtext   : 'Loading...',
-        placeholder: '&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;', // CUSTOM
+        placeholder: '<i class="icon-edit"></i>', // CUSTOM
         indicator  : '<img src="assets/img/indicator.gif" /> Saving...', // CUSTOM
         style      : 'display: inline;',  // CUSTOM
         loaddata   : {},

From 96a50f8f561c4fdee40074f4268b109f5e041dc1 Mon Sep 17 00:00:00 2001
From: Robert Robinson <Robr3rd@gmail.com>
Date: Thu, 19 Sep 2013 23:37:06 -0400
Subject: [PATCH 3/3] Changed the indicator from the included spinner.gif image
 to FontAwesome's "icon-spinner" set to spin with "icon-spin"

---
 jquery.jeditable.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/jquery.jeditable.js b/jquery.jeditable.js
index 8c9a086..44f875f 100644
--- a/jquery.jeditable.js
+++ b/jquery.jeditable.js
@@ -538,7 +538,7 @@
         loadtype   : 'GET',
         loadtext   : 'Loading...',
         placeholder: '<i class="icon-edit"></i>', // CUSTOM
-        indicator  : '<img src="assets/img/indicator.gif" /> Saving...', // CUSTOM
+        indicator  : '<i class="icon-spinner icon-spin"></i> Saving...', // CUSTOM
         style      : 'display: inline;',  // CUSTOM
         loaddata   : {},
         submitdata : {},