summaryrefslogtreecommitdiffstats
path: root/slick.editors.js
diff options
context:
space:
mode:
authorMichael Leibman <michael.leibman@gmail.com>2012-01-23 23:45:23 -0800
committerMichael Leibman <michael.leibman@gmail.com>2012-01-23 23:45:23 -0800
commit3154140977a6fe14ff8654be2940a2e40f975335 (patch)
tree0e805879d87cda70e8ed5f0c3e0a46a75c30201b /slick.editors.js
parent7c2da892d70a267959fdc5f88a063ec5c937cc03 (diff)
downloadSlickGrid-3154140977a6fe14ff8654be2940a2e40f975335.zip
SlickGrid-3154140977a6fe14ff8654be2940a2e40f975335.tar.gz
SlickGrid-3154140977a6fe14ff8654be2940a2e40f975335.tar.bz2
Fixed indenting in editors.
Diffstat (limited to 'slick.editors.js')
-rw-r--r--slick.editors.js874
1 files changed, 437 insertions, 437 deletions
diff --git a/slick.editors.js b/slick.editors.js
index 6b3364d..a3666c2 100644
--- a/slick.editors.js
+++ b/slick.editors.js
@@ -20,493 +20,493 @@
}
});
- function TextEditor(args) {
- var $input;
- var defaultValue;
- var scope = this;
-
- this.init = function () {
- $input = $("<INPUT type=text class='editor-text' />")
- .appendTo(args.container)
- .bind("keydown.nav", function (e) {
- if (e.keyCode === $.ui.keyCode.LEFT || e.keyCode === $.ui.keyCode.RIGHT) {
- e.stopImmediatePropagation();
- }
- })
- .focus()
- .select();
- };
-
- this.destroy = function () {
- $input.remove();
- };
-
- this.focus = function () {
- $input.focus();
- };
-
- this.getValue = function () {
- return $input.val();
- };
-
- this.setValue = function (val) {
- $input.val(val);
- };
-
- this.loadValue = function (item) {
- defaultValue = item[args.column.field] || "";
- $input.val(defaultValue);
- $input[0].defaultValue = defaultValue;
- $input.select();
- };
-
- this.serializeValue = function () {
- return $input.val();
- };
-
- this.applyValue = function (item, state) {
- item[args.column.field] = state;
- };
-
- this.isValueChanged = function () {
- return (!($input.val() == "" && defaultValue == null)) && ($input.val() != defaultValue);
- };
-
- this.validate = function () {
- if (args.column.validator) {
- var validationResults = args.column.validator($input.val());
- if (!validationResults.valid) {
- return validationResults;
- }
- }
-
- return {
- valid: true,
- msg: null
- };
- };
-
- this.init();
- }
-
- function IntegerEditor(args) {
- var $input;
- var defaultValue;
- var scope = this;
-
- this.init = function () {
- $input = $("<INPUT type=text class='editor-text' />");
-
- $input.bind("keydown.nav", function (e) {
- if (e.keyCode === $.ui.keyCode.LEFT || e.keyCode === $.ui.keyCode.RIGHT) {
- e.stopImmediatePropagation();
- }
- });
-
- $input.appendTo(args.container);
- $input.focus().select();
- };
-
- this.destroy = function () {
- $input.remove();
- };
-
- this.focus = function () {
- $input.focus();
- };
-
- this.loadValue = function (item) {
- defaultValue = item[args.column.field];
- $input.val(defaultValue);
- $input[0].defaultValue = defaultValue;
- $input.select();
- };
-
- this.serializeValue = function () {
- return parseInt($input.val(), 10) || 0;
- };
-
- this.applyValue = function (item, state) {
- item[args.column.field] = state;
- };
-
- this.isValueChanged = function () {
- return (!($input.val() == "" && defaultValue == null)) && ($input.val() != defaultValue);
- };
-
- this.validate = function () {
- if (isNaN($input.val())) {
- return {
- valid: false,
- msg: "Please enter a valid integer"
- };
+ function TextEditor(args) {
+ var $input;
+ var defaultValue;
+ var scope = this;
+
+ this.init = function () {
+ $input = $("<INPUT type=text class='editor-text' />")
+ .appendTo(args.container)
+ .bind("keydown.nav", function (e) {
+ if (e.keyCode === $.ui.keyCode.LEFT || e.keyCode === $.ui.keyCode.RIGHT) {
+ e.stopImmediatePropagation();
+ }
+ })
+ .focus()
+ .select();
+ };
+
+ this.destroy = function () {
+ $input.remove();
+ };
+
+ this.focus = function () {
+ $input.focus();
+ };
+
+ this.getValue = function () {
+ return $input.val();
+ };
+
+ this.setValue = function (val) {
+ $input.val(val);
+ };
+
+ this.loadValue = function (item) {
+ defaultValue = item[args.column.field] || "";
+ $input.val(defaultValue);
+ $input[0].defaultValue = defaultValue;
+ $input.select();
+ };
+
+ this.serializeValue = function () {
+ return $input.val();
+ };
+
+ this.applyValue = function (item, state) {
+ item[args.column.field] = state;
+ };
+
+ this.isValueChanged = function () {
+ return (!($input.val() == "" && defaultValue == null)) && ($input.val() != defaultValue);
+ };
+
+ this.validate = function () {
+ if (args.column.validator) {
+ var validationResults = args.column.validator($input.val());
+ if (!validationResults.valid) {
+ return validationResults;
}
+ }
- return {
- valid: true,
- msg: null
- };
+ return {
+ valid: true,
+ msg: null
};
+ };
- this.init();
- }
+ this.init();
+ }
- function DateEditor(args) {
- var $input;
- var defaultValue;
- var scope = this;
- var calendarOpen = false;
-
- this.init = function () {
- $input = $("<INPUT type=text class='editor-text' />");
- $input.appendTo(args.container);
- $input.focus().select();
- $input.datepicker({
- showOn: "button",
- buttonImageOnly: true,
- buttonImage: "../images/calendar.gif",
- beforeShow: function () {
- calendarOpen = true
- },
- onClose: function () {
- calendarOpen = false
- }
- });
- $input.width($input.width() - 18);
- };
+ function IntegerEditor(args) {
+ var $input;
+ var defaultValue;
+ var scope = this;
- this.destroy = function () {
- $.datepicker.dpDiv.stop(true, true);
- $input.datepicker("hide");
- $input.datepicker("destroy");
- $input.remove();
- };
+ this.init = function () {
+ $input = $("<INPUT type=text class='editor-text' />");
- this.show = function () {
- if (calendarOpen) {
- $.datepicker.dpDiv.stop(true, true).show();
+ $input.bind("keydown.nav", function (e) {
+ if (e.keyCode === $.ui.keyCode.LEFT || e.keyCode === $.ui.keyCode.RIGHT) {
+ e.stopImmediatePropagation();
}
- };
+ });
- this.hide = function () {
- if (calendarOpen) {
- $.datepicker.dpDiv.stop(true, true).hide();
- }
- };
+ $input.appendTo(args.container);
+ $input.focus().select();
+ };
- this.position = function (position) {
- if (!calendarOpen) {
- return;
- }
- $.datepicker.dpDiv
- .css("top", position.top + 30)
- .css("left", position.left);
- };
+ this.destroy = function () {
+ $input.remove();
+ };
- this.focus = function () {
- $input.focus();
- };
+ this.focus = function () {
+ $input.focus();
+ };
- this.loadValue = function (item) {
- defaultValue = item[args.column.field];
- $input.val(defaultValue);
- $input[0].defaultValue = defaultValue;
- $input.select();
- };
+ this.loadValue = function (item) {
+ defaultValue = item[args.column.field];
+ $input.val(defaultValue);
+ $input[0].defaultValue = defaultValue;
+ $input.select();
+ };
- this.serializeValue = function () {
- return $input.val();
- };
+ this.serializeValue = function () {
+ return parseInt($input.val(), 10) || 0;
+ };
- this.applyValue = function (item, state) {
- item[args.column.field] = state;
- };
+ this.applyValue = function (item, state) {
+ item[args.column.field] = state;
+ };
- this.isValueChanged = function () {
- return (!($input.val() == "" && defaultValue == null)) && ($input.val() != defaultValue);
- };
+ this.isValueChanged = function () {
+ return (!($input.val() == "" && defaultValue == null)) && ($input.val() != defaultValue);
+ };
- this.validate = function () {
+ this.validate = function () {
+ if (isNaN($input.val())) {
return {
- valid: true,
- msg: null
+ valid: false,
+ msg: "Please enter a valid integer"
};
- };
-
- this.init();
- }
-
- function YesNoSelectEditor(args) {
- var $select;
- var defaultValue;
- var scope = this;
-
- this.init = function () {
- $select = $("<SELECT tabIndex='0' class='editor-yesno'><OPTION value='yes'>Yes</OPTION><OPTION value='no'>No</OPTION></SELECT>");
- $select.appendTo(args.container);
- $select.focus();
- };
-
- this.destroy = function () {
- $select.remove();
- };
-
- this.focus = function () {
- $select.focus();
- };
-
- this.loadValue = function (item) {
- $select.val((defaultValue = item[args.column.field]) ? "yes" : "no");
- $select.select();
- };
-
- this.serializeValue = function () {
- return ($select.val() == "yes");
- };
-
- this.applyValue = function (item, state) {
- item[args.column.field] = state;
- };
-
- this.isValueChanged = function () {
- return ($select.val() != defaultValue);
- };
-
- this.validate = function () {
- return {
- valid: true,
- msg: null
- };
- };
-
- this.init();
- }
-
- function CheckboxEditor(args) {
- var $select;
- var defaultValue;
- var scope = this;
-
- this.init = function () {
- $select = $("<INPUT type=checkbox value='true' class='editor-checkbox' hideFocus>");
- $select.appendTo(args.container);
- $select.focus();
- };
-
- this.destroy = function () {
- $select.remove();
- };
-
- this.focus = function () {
- $select.focus();
- };
+ }
- this.loadValue = function (item) {
- defaultValue = item[args.column.field];
- if (defaultValue) {
- $select.attr("checked", "checked");
- } else {
- $select.removeAttr("checked");
+ return {
+ valid: true,
+ msg: null
+ };
+ };
+
+ this.init();
+ }
+
+ function DateEditor(args) {
+ var $input;
+ var defaultValue;
+ var scope = this;
+ var calendarOpen = false;
+
+ this.init = function () {
+ $input = $("<INPUT type=text class='editor-text' />");
+ $input.appendTo(args.container);
+ $input.focus().select();
+ $input.datepicker({
+ showOn: "button",
+ buttonImageOnly: true,
+ buttonImage: "../images/calendar.gif",
+ beforeShow: function () {
+ calendarOpen = true
+ },
+ onClose: function () {
+ calendarOpen = false
}
- };
-
- this.serializeValue = function () {
- return $select.attr("checked");
- };
-
- this.applyValue = function (item, state) {
- item[args.column.field] = state;
- };
-
- this.isValueChanged = function () {
- return ($select.attr("checked") != defaultValue);
- };
-
- this.validate = function () {
- return {
- valid: true,
- msg: null
- };
- };
-
- this.init();
- }
-
- function PercentCompleteEditor(args) {
- var $input, $picker;
- var defaultValue;
- var scope = this;
+ });
+ $input.width($input.width() - 18);
+ };
+
+ this.destroy = function () {
+ $.datepicker.dpDiv.stop(true, true);
+ $input.datepicker("hide");
+ $input.datepicker("destroy");
+ $input.remove();
+ };
+
+ this.show = function () {
+ if (calendarOpen) {
+ $.datepicker.dpDiv.stop(true, true).show();
+ }
+ };
- this.init = function () {
- $input = $("<INPUT type=text class='editor-percentcomplete' />");
- $input.width($(args.container).innerWidth() - 25);
- $input.appendTo(args.container);
+ this.hide = function () {
+ if (calendarOpen) {
+ $.datepicker.dpDiv.stop(true, true).hide();
+ }
+ };
- $picker = $("<div class='editor-percentcomplete-picker' />").appendTo(args.container);
- $picker.append("<div class='editor-percentcomplete-helper'><div class='editor-percentcomplete-wrapper'><div class='editor-percentcomplete-slider' /><div class='editor-percentcomplete-buttons' /></div></div>");
+ this.position = function (position) {
+ if (!calendarOpen) {
+ return;
+ }
+ $.datepicker.dpDiv
+ .css("top", position.top + 30)
+ .css("left", position.left);
+ };
+
+ this.focus = function () {
+ $input.focus();
+ };
+
+ this.loadValue = function (item) {
+ defaultValue = item[args.column.field];
+ $input.val(defaultValue);
+ $input[0].defaultValue = defaultValue;
+ $input.select();
+ };
+
+ this.serializeValue = function () {
+ return $input.val();
+ };
+
+ this.applyValue = function (item, state) {
+ item[args.column.field] = state;
+ };
+
+ this.isValueChanged = function () {
+ return (!($input.val() == "" && defaultValue == null)) && ($input.val() != defaultValue);
+ };
+
+ this.validate = function () {
+ return {
+ valid: true,
+ msg: null
+ };
+ };
+
+ this.init();
+ }
+
+ function YesNoSelectEditor(args) {
+ var $select;
+ var defaultValue;
+ var scope = this;
+
+ this.init = function () {
+ $select = $("<SELECT tabIndex='0' class='editor-yesno'><OPTION value='yes'>Yes</OPTION><OPTION value='no'>No</OPTION></SELECT>");
+ $select.appendTo(args.container);
+ $select.focus();
+ };
+
+ this.destroy = function () {
+ $select.remove();
+ };
+
+ this.focus = function () {
+ $select.focus();
+ };
+
+ this.loadValue = function (item) {
+ $select.val((defaultValue = item[args.column.field]) ? "yes" : "no");
+ $select.select();
+ };
+
+ this.serializeValue = function () {
+ return ($select.val() == "yes");
+ };
+
+ this.applyValue = function (item, state) {
+ item[args.column.field] = state;
+ };
+
+ this.isValueChanged = function () {
+ return ($select.val() != defaultValue);
+ };
+
+ this.validate = function () {
+ return {
+ valid: true,
+ msg: null
+ };
+ };
+
+ this.init();
+ }
+
+ function CheckboxEditor(args) {
+ var $select;
+ var defaultValue;
+ var scope = this;
+
+ this.init = function () {
+ $select = $("<INPUT type=checkbox value='true' class='editor-checkbox' hideFocus>");
+ $select.appendTo(args.container);
+ $select.focus();
+ };
+
+ this.destroy = function () {
+ $select.remove();
+ };
+
+ this.focus = function () {
+ $select.focus();
+ };
+
+ this.loadValue = function (item) {
+ defaultValue = item[args.column.field];
+ if (defaultValue) {
+ $select.attr("checked", "checked");
+ } else {
+ $select.removeAttr("checked");
+ }
+ };
- $picker.find(".editor-percentcomplete-buttons").append("<button val=0>Not started</button><br/><button val=50>In Progress</button><br/><button val=100>Complete</button>");
+ this.serializeValue = function () {
+ return $select.attr("checked");
+ };
- $input.focus().select();
+ this.applyValue = function (item, state) {
+ item[args.column.field] = state;
+ };
- $picker.find(".editor-percentcomplete-slider").slider({
- orientation: "vertical",
- range: "min",
- value: defaultValue,
- slide: function (event, ui) {
- $input.val(ui.value)
- }
- });
+ this.isValueChanged = function () {
+ return ($select.attr("checked") != defaultValue);
+ };
- $picker.find(".editor-percentcomplete-buttons button").bind("click", function (e) {
- $input.val($(this).attr("val"));
- $picker.find(".editor-percentcomplete-slider").slider("value", $(this).attr("val"));
- })
+ this.validate = function () {
+ return {
+ valid: true,
+ msg: null
};
+ };
- this.destroy = function () {
- $input.remove();
- $picker.remove();
- };
+ this.init();
+ }
- this.focus = function () {
- $input.focus();
- };
+ function PercentCompleteEditor(args) {
+ var $input, $picker;
+ var defaultValue;
+ var scope = this;
- this.loadValue = function (item) {
- $input.val(defaultValue = item[args.column.field]);
- $input.select();
- };
+ this.init = function () {
+ $input = $("<INPUT type=text class='editor-percentcomplete' />");
+ $input.width($(args.container).innerWidth() - 25);
+ $input.appendTo(args.container);
- this.serializeValue = function () {
- return parseInt($input.val(), 10) || 0;
- };
+ $picker = $("<div class='editor-percentcomplete-picker' />").appendTo(args.container);
+ $picker.append("<div class='editor-percentcomplete-helper'><div class='editor-percentcomplete-wrapper'><div class='editor-percentcomplete-slider' /><div class='editor-percentcomplete-buttons' /></div></div>");
- this.applyValue = function (item, state) {
- item[args.column.field] = state;
- };
+ $picker.find(".editor-percentcomplete-buttons").append("<button val=0>Not started</button><br/><button val=50>In Progress</button><br/><button val=100>Complete</button>");
- this.isValueChanged = function () {
- return (!($input.val() == "" && defaultValue == null)) && ((parseInt($input.val(), 10) || 0) != defaultValue);
- };
+ $input.focus().select();
- this.validate = function () {
- if (isNaN(parseInt($input.val(), 10))) {
- return {
- valid: false,
- msg: "Please enter a valid positive number"
- };
+ $picker.find(".editor-percentcomplete-slider").slider({
+ orientation: "vertical",
+ range: "min",
+ value: defaultValue,
+ slide: function (event, ui) {
+ $input.val(ui.value)
}
-
+ });
+
+ $picker.find(".editor-percentcomplete-buttons button").bind("click", function (e) {
+ $input.val($(this).attr("val"));
+ $picker.find(".editor-percentcomplete-slider").slider("value", $(this).attr("val"));
+ })
+ };
+
+ this.destroy = function () {
+ $input.remove();
+ $picker.remove();
+ };
+
+ this.focus = function () {
+ $input.focus();
+ };
+
+ this.loadValue = function (item) {
+ $input.val(defaultValue = item[args.column.field]);
+ $input.select();
+ };
+
+ this.serializeValue = function () {
+ return parseInt($input.val(), 10) || 0;
+ };
+
+ this.applyValue = function (item, state) {
+ item[args.column.field] = state;
+ };
+
+ this.isValueChanged = function () {
+ return (!($input.val() == "" && defaultValue == null)) && ((parseInt($input.val(), 10) || 0) != defaultValue);
+ };
+
+ this.validate = function () {
+ if (isNaN(parseInt($input.val(), 10))) {
return {
- valid: true,
- msg: null
+ valid: false,
+ msg: "Please enter a valid positive number"
};
- };
-
- this.init();
- }
-
- /*
- * An example of a "detached" editor.
- * The UI is added onto document BODY and .position(), .show() and .hide() are implemented.
- * KeyDown events are also handled to provide handling for Tab, Shift-Tab, Esc and Ctrl-Enter.
- */
- function LongTextEditor(args) {
- var $input, $wrapper;
- var defaultValue;
- var scope = this;
-
- this.init = function () {
- var $container = $("body");
-
- $wrapper = $("<DIV style='z-index:10000;position:absolute;background:white;padding:5px;border:3px solid gray; -moz-border-radius:10px; border-radius:10px;'/>")
- .appendTo($container);
-
- $input = $("<TEXTAREA hidefocus rows=5 style='backround:white;width:250px;height:80px;border:0;outline:0'>")
- .appendTo($wrapper);
-
- $("<DIV style='text-align:right'><BUTTON>Save</BUTTON><BUTTON>Cancel</BUTTON></DIV>")
- .appendTo($wrapper);
-
- $wrapper.find("button:first").bind("click", this.save);
- $wrapper.find("button:last").bind("click", this.cancel);
- $input.bind("keydown", this.handleKeyDown);
-
- scope.position(args.position);
- $input.focus().select();
- };
+ }
- this.handleKeyDown = function (e) {
- if (e.which == $.ui.keyCode.ENTER && e.ctrlKey) {
- scope.save();
- } else if (e.which == $.ui.keyCode.ESCAPE) {
- e.preventDefault();
- scope.cancel();
- } else if (e.which == $.ui.keyCode.TAB && e.shiftKey) {
- e.preventDefault();
- grid.navigatePrev();
- } else if (e.which == $.ui.keyCode.TAB) {
- e.preventDefault();
- grid.navigateNext();
- }
- };
+ return {
+ valid: true,
+ msg: null
+ };
+ };
+
+ this.init();
+ }
+
+ /*
+ * An example of a "detached" editor.
+ * The UI is added onto document BODY and .position(), .show() and .hide() are implemented.
+ * KeyDown events are also handled to provide handling for Tab, Shift-Tab, Esc and Ctrl-Enter.
+ */
+ function LongTextEditor(args) {
+ var $input, $wrapper;
+ var defaultValue;
+ var scope = this;
+
+ this.init = function () {
+ var $container = $("body");
+
+ $wrapper = $("<DIV style='z-index:10000;position:absolute;background:white;padding:5px;border:3px solid gray; -moz-border-radius:10px; border-radius:10px;'/>")
+ .appendTo($container);
+
+ $input = $("<TEXTAREA hidefocus rows=5 style='backround:white;width:250px;height:80px;border:0;outline:0'>")
+ .appendTo($wrapper);
+
+ $("<DIV style='text-align:right'><BUTTON>Save</BUTTON><BUTTON>Cancel</BUTTON></DIV>")
+ .appendTo($wrapper);
+
+ $wrapper.find("button:first").bind("click", this.save);
+ $wrapper.find("button:last").bind("click", this.cancel);
+ $input.bind("keydown", this.handleKeyDown);
+
+ scope.position(args.position);
+ $input.focus().select();
+ };
+
+ this.handleKeyDown = function (e) {
+ if (e.which == $.ui.keyCode.ENTER && e.ctrlKey) {
+ scope.save();
+ } else if (e.which == $.ui.keyCode.ESCAPE) {
+ e.preventDefault();
+ scope.cancel();
+ } else if (e.which == $.ui.keyCode.TAB && e.shiftKey) {
+ e.preventDefault();
+ grid.navigatePrev();
+ } else if (e.which == $.ui.keyCode.TAB) {
+ e.preventDefault();
+ grid.navigateNext();
+ }
+ };
- this.save = function () {
- args.commitChanges();
- };
+ this.save = function () {
+ args.commitChanges();
+ };
- this.cancel = function () {
- $input.val(defaultValue);
- args.cancelChanges();
- };
+ this.cancel = function () {
+ $input.val(defaultValue);
+ args.cancelChanges();
+ };
- this.hide = function () {
- $wrapper.hide();
- };
+ this.hide = function () {
+ $wrapper.hide();
+ };
- this.show = function () {
- $wrapper.show();
- };
+ this.show = function () {
+ $wrapper.show();
+ };
- this.position = function (position) {
- $wrapper
- .css("top", position.top - 5)
- .css("left", position.left - 5)
- };
+ this.position = function (position) {
+ $wrapper
+ .css("top", position.top - 5)
+ .css("left", position.left - 5)
+ };
- this.destroy = function () {
- $wrapper.remove();
- };
+ this.destroy = function () {
+ $wrapper.remove();
+ };
- this.focus = function () {
- $input.focus();
- };
+ this.focus = function () {
+ $input.focus();
+ };
- this.loadValue = function (item) {
- $input.val(defaultValue = item[args.column.field]);
- $input.select();
- };
+ this.loadValue = function (item) {
+ $input.val(defaultValue = item[args.column.field]);
+ $input.select();
+ };
- this.serializeValue = function () {
- return $input.val();
- };
+ this.serializeValue = function () {
+ return $input.val();
+ };
- this.applyValue = function (item, state) {
- item[args.column.field] = state;
- };
+ this.applyValue = function (item, state) {
+ item[args.column.field] = state;
+ };
- this.isValueChanged = function () {
- return (!($input.val() == "" && defaultValue == null)) && ($input.val() != defaultValue);
- };
+ this.isValueChanged = function () {
+ return (!($input.val() == "" && defaultValue == null)) && ($input.val() != defaultValue);
+ };
- this.validate = function () {
- return {
- valid: true,
- msg: null
- };
+ this.validate = function () {
+ return {
+ valid: true,
+ msg: null
};
+ };
- this.init();
- }
+ this.init();
+ }
})(jQuery);