Merge branch 'master' into refactor/deployment

HISTORY.md

@@ -2,8 +2,14 @@
 
 ## 0.6.10
 
- - Fixed bug where `changed()` was returning true for values that had not changed.
  - Fixed certain errors returned as HTML rather than JSON.
+ - Fixed bug where changing a property type from "number" to "string" made existing properties uneditable.
+ - Fixed bug where `changed()` was returning true for values that had not changed.
+ - Fixed certain error's returned as HTML rather than JSON.
+ - Data editor
+   - Fixed bug where data editor would expand as the page scrolls
+   - Fixed bug where the cursor would randomly move around while editing text
+   - Removed overlay for inline editing
 
 ## 0.6.9 
 

lib/resources/collection/dashboard/data.html

@@ -1,5 +1,5 @@
 <div data-bind="scrollbarWidth: view.scrollWidth"></div>
-<div id="data" class="well full-page">
+<div id="data" class="well">
   <h3>Data</h3>
 
   <div id="no-property-warning" class="alert alert-info hide">
@@ -7,7 +7,7 @@
     <a href="../properties">Add some now</a> before editing data.
   </div>
 
-  <div id="table-container" data-bind="scrollY: view.scrollY, scrollX: view.scrollX, screenDimensions: view.dimensions, reflow: view.init">      
+  <div id="table-container" data-bind="scrollY: view.scrollY, scrollX: view.scrollX, screenDimensions: view.dimensions, reflow: view.init, style: {height: view.dimensions().height + 'px'}">      
 
     <div id="editor-modal" class="modal hide" data-bind="if: propertiesLoaded, bootstrapModal: edit.editingModal">
       <div class="modal-header">
@@ -29,7 +29,7 @@
         <div class="mini-edit" data-bind="style: {top: view.selectedCellPos().top + 'px', left: view.selectedCellPos().left + 'px'}, if: edit.editingInline, click: view.noOp, clickBubble: false">
           <!-- ko if: selectedProp().type === 'string' -->
             <a href="#" title="Edit in modal" data-bind="click: edit.openModal"><i class="icon-edit icon-white"></i></a>
-            <input type="text" data-bind="hasfocus: edit.focusInput, select: 'selectEditor', value: edit.editValue, valueUpdate: 'afterkeydown', typeahead: edit.typeahead" />
+            <input type="text" class="inline-editor-input" data-bind="hasfocus: edit.focusInput, select: 'selectEditor', customValue: edit.editValue, valueUpdate: 'afterkeydown', typeahead: edit.typeahead" />
           <!-- /ko -->
           <!-- ko if: selectedProp().type === 'number' -->
             <input type="text" class="number" data-bind="hasfocus: edit.focusInput, select: 'selectEditor', numberValue: edit.editValue, valueUpdate: 'afterkeydown'" />

lib/resources/collection/dashboard/js/data.js

@@ -207,7 +207,7 @@
     var val = vm.selectedRow()[vm.selectedProp().name]();
 
     if (type === 'string') {
-      return !val || val.indexOf('\n') === -1;  
+      return !val || val.toString().indexOf('\n') === -1;  
     }
 
     return true;

lib/resources/collection/dashboard/js/util/knockout-util.js

@@ -159,22 +159,28 @@ ko.bindingHandlers.screenDimensions = {
 function calculateScreenDimensions(element) {
   var $element = $(element)
     , $window = $(window)
-    , top = $element.offset().top - $window.scrollTop()
+    , windowHeight = $window.height()
+    , windowWidth = $window.width()
+    , staticTop = $element.offset().top
+    , top = staticTop - $window.scrollTop()
     , left = $element.offset().left - $window.scrollLeft()
-    , height = $element.height()
+    , height = windowHeight - staticTop - 60 // 60 is bottom padding - probably shouldn't be hardcoded
     , width = $element.width()
     , bottom = top + height
     , right = left + width
-    , bottomRelative = $(window).height() - bottom
-    , rightRelative = $(window).width() - right;
+    , bottomRelative = windowHeight - bottom
+    , rightRelative = windowWidth - right;
 
   return {
-      top: top
+      staticTop: staticTop
+    , top: top
     , left: left
     , bottom: bottom
     , right: right
     , height: height
     , width: width
+    , windowHeight: windowHeight
+    , windowWidth: windowWidth
     , bottomRelative: bottomRelative
     , rightRelative: rightRelative
   };
@@ -220,13 +226,46 @@ ko.bindingHandlers.element = {
   }
 };
 
+// I don't know why I have to do this; seems like Knock's built-in version is bugged
+ko.bindingHandlers.customValue = {
+  init: function(element, valueAccessor, allBindingsAccessor, vm) {
+    var prop = valueAccessor()
+      , allBindings = allBindingsAccessor()
+      , updateMode = allBindings.valueUpdate || 'blur';
+
+    if (typeof prop === 'function') {
+
+      if (updateMode === 'afterkeydown') {
+
+        $(element).on('keydown', function(e) {
+          setTimeout(function() {
+            prop($(element).val());
+          }, 0);
+        });
+      }
+
+      $(element).blur(function() {
+        prop($(element).val());
+      });
+    }
+  }, update: function(element, valueAccessor) {
+    var newVal = ko.utils.unwrapObservable(valueAccessor());
+
+    if (newVal !== $(element).val()) {
+      $(element).val(newVal);  
+    }
+  }
+};
+
 ko.bindingHandlers.numberValue = {
   init: function(element, valueAccessor, allBindingsAccessor, vm) {
     var prop = valueAccessor()
       , allBindings = allBindingsAccessor()
       , updateMode = allBindings.valueUpdate || 'blur';
 
-    $(element).val(ko.utils.unwrapObservable(prop));
+    if (parseFloat($(element).val()) !== ko.utils.unwrapObservable(prop)) {
+      $(element).val(ko.utils.unwrapObservable(prop));
+    }
 
     if (typeof prop === 'function') {
 
@@ -234,7 +273,7 @@ ko.bindingHandlers.numberValue = {
 
         $(element).on('keydown', function(e) {
           var num = parseFloat($(element).val());
-          if (isNaN(num)) return;
+          if (isNaN(num)) return true;
 
           if (e.which == 38) { // up 
             prop(num + 1);
@@ -266,7 +305,7 @@ ko.bindingHandlers.numberValue = {
 
 function setNumberProp(element, prop) {
   var num = parseFloat($(element).val());
-  if (!isNaN(num)) prop(num);
+  if (!isNaN(num) && prop() != num) prop(num);
 }
 
 ko.bindingHandlers.select = {
@@ -323,10 +362,10 @@ ko.bindingHandlers.aceEditor = {
     $(element).data('aceEditor', editor);
 
     editor.getSession().on('change', function(e) {
-        var newVal = editor.getValue();
-        if (newVal !== val()) {
-          val(newVal);  
-        }
+      var newVal = editor.getValue();
+      if (newVal !== val() && $(element).is(':visible')) {
+        val(newVal);  
+      }
     });
   }, update: function(element, valueAccessor) {
     var editor = $(element).data('aceEditor')
@@ -338,7 +377,6 @@ ko.bindingHandlers.aceEditor = {
       val = val.toString(); 
     }
     
-
     if (val !== editor.getValue()) {
       editor.setValue(val);
     }
@@ -358,6 +396,21 @@ ko.bindingHandlers.aceEditorResize = {
   }
 };
 
+// ko.bindingHandlers.customHasFocus = {
+//   update: function(element, valueAccessor) {
+//     var $el = $(element)
+//       , val = ko.utils.unwrapObservable(valueAccessor());
+
+//     setTimeout(function() {
+//       if (val && !$el.is(':focus')) {
+//         $el.focus();  
+//       } else if (!val && $el.is(':focus')) {
+//         $el.blur();
+//       }
+//     }, 5);
+//   }
+// };
+
 ko.bindingHandlers.aceEditorFocus = {
   update: function(element, valueAccessor) {
     var editor = $(element).data('aceEditor')

lib/resources/collection/dashboard/style.css

@@ -15,7 +15,7 @@
   bottom: 0;
   right: 0;
   left: 0;
-  background: rgba(0, 0, 0, 0.5);
+  background: rgba(0, 0, 0, 0);
   z-index: 100;
 }
 #inline-editor #inline-editor-table-overlay {
@@ -65,11 +65,6 @@
 }
 #table-container {
   position: relative;
-  box-flex: 1;
-  -moz-box-flex: 1;
-  -webkit-box-flex: 1;
-  -ms-box-flex: 1;
-  -o-box-flex: 1;
   height: 0px;
   overflow: scroll;
 }

lib/resources/collection/dashboard/style.less

@@ -29,7 +29,7 @@
   right: 0;
   left: 0;
 
-  background: rgba(0, 0, 0, 0.5);
+  background: rgba(0, 0, 0, 0);
   z-index: 100;
 
   #inline-editor-table-overlay {
@@ -78,7 +78,7 @@
 
 #table-container {
   position: relative;
-  .box-flex(1);
+  // .box-flex(1);
   height: 0px;
   
   overflow: scroll;

lib/resources/collection/index.js

@@ -467,9 +467,13 @@ Collection.prototype.save = function (ctx, fn) {
       } 
       if(err) return done(err);
 
+      // copy previous obj
+      Object.keys(obj).forEach(function (key) {
+        prev[key] = obj[key];
+      });
+
       // merge changes
       Object.keys(item).forEach(function (key) {
-        prev[key] = obj[key];
         obj[key] = item[key];
       });