-
@@ -71,7 +80,7 @@
-
+
|
diff --git a/lib/resources/collection/dashboard/js/data.js b/lib/resources/collection/dashboard/js/data.js
index 4edee6c..d56283d 100644
--- a/lib/resources/collection/dashboard/js/data.js
+++ b/lib/resources/collection/dashboard/js/data.js
@@ -139,7 +139,9 @@
, selectedProp: ko.observable()
, inlineEdit: {
- editing: ko.observable(false)
+ editing: ko.observable(false)
+ , editValue: ko.observable()
+ , editProp: null
}
, propertiesLoaded: ko.observable(false)
@@ -226,6 +228,11 @@
sel.removeAllRanges();
}
};
+
+ vm.view.noOp = function() {
+ return true;
+ };
+
vm.view.loadSpaceBefore = ko.computed(function() {
var totalHeight = 0
, rows = vm.data().length
@@ -257,6 +264,7 @@
var $table = vm.view.$table();
if (!$table) return result;
$cell = $table.find('.highlight');
+ if (!$cell.length) return result;
result = $cell.position();
}
return result;
@@ -264,21 +272,30 @@
vm.inlineEdit.dismiss = function() {
vm.inlineEdit.editing(false);
+ vm.inlineEdit.editProp(vm.inlineEdit.editValue());
};
vm.inlineEdit.start = function() {
vm.inlineEdit.editing(true);
+ vm.inlineEdit.editProp = vm.selectedRow()[vm.selectedProp().name];
+ vm.inlineEdit.editValue(vm.inlineEdit.editProp());
};
vm.inlineEdit.onKeyDown = function(e) {
if (e.which == 27) { // escape
- vm.inlineEdit.editing(false);
+ vm.inlineEdit.editing(false); //cancel directly, don't apply changes
return false;
+ } else if (e.which == 13) { //enter
+ vm.inlineEdit.dismiss();
}
return true;
};
+ vm.inlineEdit.focusInput = ko.computed(function() {
+ return vm.inlineEdit.editing();
+ }, vm.inlineEdit).extend({throttle: 100});
+
function createRow(data) {
var rowVm = {};
@@ -291,8 +308,10 @@
});
rowVm._textFor = function(prop) {
- var val = rowVm[prop]();
- if (typeof val === 'undefined' || val === null) {
+ var val = rowVm[prop.name]();
+ if (prop.type === 'boolean') {
+ return val ? 'true' : 'false';
+ } else if (typeof val === 'undefined' || val === null) {
return '...';
} else if (typeof val === 'object') {
return JSON.stringify(val);
@@ -317,6 +336,21 @@
vm.selectedRow(rowVm);
};
+
+ if (rowVm.id) {
+ vm.properties().forEach(function(p) {
+ var name = p.name;
+ rowVm[name].subscribe(function(newValue) {
+ var body = {};
+ body[name] = newValue;
+ dpd(resource).put(rowVm.id, body, function() {
+ console.log("Saved");
+ });
+ });
+ });
+ }
+
+
return rowVm;
}
@@ -324,7 +358,8 @@
'data': {
create: function(options) {
return createRow(options.data);
- }, id: function(data) {
+ }, key: function(data) {
+ console.log("key", ko.utils.unwrapObservable(data.id));
return ko.utils.unwrapObservable(data.id);
}
}
diff --git a/lib/resources/collection/dashboard/style.css b/lib/resources/collection/dashboard/style.css
index a4a3ee5..42ef32a 100644
--- a/lib/resources/collection/dashboard/style.css
+++ b/lib/resources/collection/dashboard/style.css
@@ -32,13 +32,27 @@
position: fixed;
}
#inline-editor .mini-edit {
+ padding: 8px;
position: absolute;
background: url('../../img/outlets-light.png');
- height: 38px;
box-sizing: border-box;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
- width: 300px;
+}
+#inline-editor .mini-edit input {
+ margin: 0;
+}
+#inline-editor .mini-edit input[type=text] {
+ min-width: 200px;
+ max-width: 300px;
+}
+#inline-editor .mini-edit label {
+ min-width: 200px;
+}
+#inline-editor .mini-edit label input[type=checkbox] {
+ display: inline-block;
+ vertical-align: middle;
+ margin-right: 8px;
}
#data {
display: box;
diff --git a/lib/resources/collection/dashboard/style.less b/lib/resources/collection/dashboard/style.less
index fbaa434..9365f33 100644
--- a/lib/resources/collection/dashboard/style.less
+++ b/lib/resources/collection/dashboard/style.less
@@ -37,11 +37,29 @@
}
.mini-edit {
+ padding: 8px;
position: absolute;
background: @backgroundLight;
- height: @cellHeight;
.box-sizing(border-box);
- width: 300px;
+
+ input {
+ margin: 0;
+ }
+
+ input[type=text] {
+ min-width: 200px;
+ max-width: 300px;
+ }
+
+ label {
+ min-width: 200px;
+ input[type=checkbox] {
+ display: inline-block;
+ vertical-align: middle;
+ margin-right: 8px;
+ }
+ }
+
}
}