diff --git a/src/containers/editable-container.js b/src/containers/editable-container.js
index 84aa882..0594368 100644
--- a/src/containers/editable-container.js
+++ b/src/containers/editable-container.js
@@ -9,12 +9,16 @@ Applied as jQuery method.
**/
(function ($) {
- var EditableContainer = function (element, options) {
+ var Popup = function (element, options) {
this.init(element, options);
};
+
+ var Inline = function (element, options) {
+ this.init(element, options);
+ };
//methods
- EditableContainer.prototype = {
+ Popup.prototype = {
containerName: null, //tbd in child class
innerCss: null, //tbd in child class
init: function(element, options) {
@@ -48,7 +52,7 @@ Applied as jQuery method.
return;
} else {
//close all open containers (except one)
- EditableContainer.prototype.closeOthers(e.target);
+ Popup.prototype.closeOthers(e.target);
}
});
@@ -310,11 +314,12 @@ Applied as jQuery method.
return this.each(function () {
var $this = $(this),
dataKey = 'editableContainer',
- data = $this.data(dataKey),
- options = typeof option === 'object' && option;
+ data = $this.data(dataKey),
+ options = typeof option === 'object' && option,
+ Constructor = (options.mode === 'inline') ? Inline : Popup;
if (!data) {
- $this.data(dataKey, (data = new EditableContainer(this, options)));
+ $this.data(dataKey, (data = new Constructor(this, options)));
}
if (typeof option === 'string') { //call method
@@ -323,8 +328,9 @@ Applied as jQuery method.
});
};
- //store constructor
- $.fn.editableContainer.Constructor = EditableContainer;
+ //store constructors
+ $.fn.editableContainer.Popup = Popup;
+ $.fn.editableContainer.Inline = Inline;
//defaults
$.fn.editableContainer.defaults = {
@@ -363,7 +369,25 @@ Applied as jQuery method.
@default 'cancel'
@since 1.1.1
**/
- onblur: 'cancel'
+ onblur: 'cancel',
+
+ /**
+ Animation speed (inline mode)
+ @property anim
+ @type string
+ @default 'fast'
+ **/
+ anim: 'fast',
+
+ /**
+ Mode of editable, can be `popup` or `inline`
+
+ @property mode
+ @type string
+ @default 'popup'
+ @since 1.4.0
+ **/
+ mode: 'popup'
};
/*
diff --git a/src/containers/editable-inline.js b/src/containers/editable-inline.js
index 05800dc..a9ce758 100644
--- a/src/containers/editable-inline.js
+++ b/src/containers/editable-inline.js
@@ -3,9 +3,10 @@
* ---------------------
*/
(function ($) {
-
+
+ //copy prototype from EditableContainer
//extend methods
- $.extend($.fn.editableContainer.Constructor.prototype, {
+ $.extend($.fn.editableContainer.Inline.prototype, $.fn.editableContainer.Popup.prototype, {
containerName: 'editableform',
innerCss: null,
@@ -51,10 +52,4 @@
}
});
- //defaults
- $.fn.editableContainer.defaults = $.extend({}, $.fn.editableContainer.defaults, {
- anim: 'fast'
- });
-
-
}(window.jQuery));
\ No newline at end of file
diff --git a/src/containers/editable-popover.js b/src/containers/editable-popover.js
index 127ca4c..ab540f2 100644
--- a/src/containers/editable-popover.js
+++ b/src/containers/editable-popover.js
@@ -6,7 +6,7 @@
(function ($) {
//extend methods
- $.extend($.fn.editableContainer.Constructor.prototype, {
+ $.extend($.fn.editableContainer.Popup.prototype, {
containerName: 'popover',
//for compatibility with bootstrap <= 2.2.1 (content inserted into <p> instead of directly .popover-content)
innerCss: $($.fn.popover.defaults.template).find('p').length ? '.popover-content p' : '.popover-content',
@@ -82,11 +82,4 @@
}
});
- //defaults
- /*
- $.fn.editableContainer.defaults = $.extend({}, $.fn.popover.defaults, $.fn.editableContainer.defaults, {
-
- });
- */
-
}(window.jQuery));
\ No newline at end of file
diff --git a/src/containers/editable-poshytip.js b/src/containers/editable-poshytip.js
index 3488ec9..d41f1db 100644
--- a/src/containers/editable-poshytip.js
+++ b/src/containers/editable-poshytip.js
@@ -6,7 +6,7 @@
(function ($) {
//extend methods
- $.extend($.fn.editableContainer.Constructor.prototype, {
+ $.extend($.fn.editableContainer.Popup.prototype, {
containerName: 'poshytip',
innerCss: 'div.tip-inner',
diff --git a/src/containers/editable-tooltip.js b/src/containers/editable-tooltip.js
index 4fbc842..83bebb9 100644
--- a/src/containers/editable-tooltip.js
+++ b/src/containers/editable-tooltip.js
@@ -6,7 +6,7 @@
(function ($) {
//extend methods
- $.extend($.fn.editableContainer.Constructor.prototype, {
+ $.extend($.fn.editableContainer.Popup.prototype, {
containerName: 'tooltip',
innerCss: '.ui-tooltip-content',
@@ -109,12 +109,4 @@
}
});
- //defaults
- /*
- $.fn.editableContainer.defaults = $.extend({}, $.fn.tooltip.defaults, $.fn.editableContainer.defaults, {
- items: '*',
- content: ' ',
- });
- */
-
}(window.jQuery));
\ No newline at end of file
diff --git a/src/element/editable-element.js b/src/element/editable-element.js
index 762c25b..a458ba6 100644
--- a/src/element/editable-element.js
+++ b/src/element/editable-element.js
@@ -554,13 +554,13 @@ Makes editable any HTML element on the page. Applied as jQuery method.
_Parameters:_
* `value` current value to be displayed
- * `response` server response (if display called after ajax submit), since 1.3.1
+ * `response` server response (if display called after ajax submit), since 1.4.0
For **inputs with source** (select, checklist) parameters are different:
* `value` current value to be displayed
* `sourceData` array of items for current input (e.g. dropdown items)
- * `response` server response (if display called after ajax submit), since 1.3.1
+ * `response` server response (if display called after ajax submit), since 1.4.0
To get currently selected items use `$.fn.editableutils.itemsByValue(value, sourceData)`.
diff --git a/src/inputs/list.js b/src/inputs/list.js
index 4e28ae6..e5b7ba9 100644
--- a/src/inputs/list.js
+++ b/src/inputs/list.js
@@ -248,7 +248,7 @@ List - abstract class for inputs that have source option loaded from js array or
If **string** - considered ajax url to load items. In that case results will be cached for fields with the same source and name. See also `sourceCache` option.
- If **function**, it should return data in format above (since 1.3.1).
+ If **function**, it should return data in format above (since 1.4.0).
@property source
@type string | array | object | function
@@ -285,4 +285,4 @@ List - abstract class for inputs that have source option loaded from js array or
$.fn.editabletypes.list = List;
-}(window.jQuery));
\ No newline at end of file
+}(window.jQuery));
diff --git a/test/loader.js b/test/loader.js
index 5ec827a..327d64e 100644
--- a/test/loader.js
+++ b/test/loader.js
@@ -20,7 +20,11 @@ define(function () {
init: function(require) {
loadCss(require.toUrl("./editable-container.css"));
}
- },
+ },
+
+ //inline container
+ 'containers/editable-inline': ['containers/editable-container'],
+
'element/editable-element': {
deps: ['require'], //here should be dynamically added container
init: function(require) {
@@ -55,11 +59,12 @@ define(function () {
}
},
'editable-form/editable-form-bootstrap': [
- 'editable-form/editable-form',
- 'bootstrap/js/bootstrap'
+ 'editable-form/editable-form',
+ 'bootstrap/js/bootstrap'
],
- 'containers/editable-popover': ['containers/editable-container',
- 'bootstrap/js/bootstrap'
+ 'containers/editable-popover': [
+ 'containers/editable-inline',
+ 'bootstrap/js/bootstrap'
],
'inputs/date/date': {
deps: ['require',
@@ -79,19 +84,20 @@ define(function () {
}
},
'editable-form/editable-form-jqueryui': [
- 'editable-form/editable-form',
- 'jqueryui/js/jquery-ui-1.9.1.custom'
+ 'editable-form/editable-form',
+ 'jqueryui/js/jquery-ui-1.9.1.custom'
],
- 'containers/editable-tooltip': ['containers/editable-container',
- 'jqueryui/js/jquery-ui-1.9.1.custom'
+ 'containers/editable-tooltip': [
+ 'containers/editable-inline',
+ 'jqueryui/js/jquery-ui-1.9.1.custom'
],
'inputs/dateui/dateui': ['inputs/abstract'],
//plain
//'inputs/dateui/dateui': ['inputs/abstract', 'inputs/date/bootstrap-datepicker/js/bootstrap-datepicker'],
'containers/editable-poshytip': [
- 'containers/editable-container',
- 'poshytip/jquery.poshytip'
+ 'containers/editable-inline',
+ 'poshytip/jquery.poshytip'
],
'poshytip/jquery.poshytip': {
deps: ['require'],
@@ -105,9 +111,7 @@ define(function () {
loadCss(require.toUrl("../css/redmond/jquery-ui-1.9.1.custom.css"));
}
},
-
- //inline container
- 'containers/editable-inline': ['containers/editable-container'],
+
//inputs-ext
'inputs-ext/address/address': {
@@ -126,17 +130,17 @@ define(function () {
//bootstrap
shim['editable-form/editable-form'].deps.push('inputs/date/date');
shim['element/editable-element'].deps.push('editable-form/editable-form-bootstrap');
- shim['element/editable-element'].deps.push(c === 'popup' ? 'containers/editable-popover' : 'containers/editable-inline');
+ shim['element/editable-element'].deps.push('containers/editable-popover');
} else if(f === 'jqueryui') {
//jqueryui
shim['editable-form/editable-form'].deps.push('inputs/dateui/dateui');
shim['element/editable-element'].deps.push('editable-form/editable-form-jqueryui');
- shim['element/editable-element'].deps.push(c === 'popup' ? 'containers/editable-tooltip' : 'containers/editable-inline');
+ shim['element/editable-element'].deps.push('containers/editable-tooltip');
} else {
//plain
shim['editable-form/editable-form'].deps.push('inputs/dateui/dateui');
shim['inputs/dateui/dateui'].push('inputs/dateui/jquery-ui-datepicker/js/jquery-ui-1.9.1.custom');
- shim['element/editable-element'].deps.push(c === 'popup' ? 'containers/editable-poshytip' : 'containers/editable-inline');
+ shim['element/editable-element'].deps.push('containers/editable-poshytip');
}
diff --git a/test/main.js b/test/main.js
index d15b23b..f9e3e00 100644
--- a/test/main.js
+++ b/test/main.js
@@ -19,7 +19,8 @@ require(["loader", jqurl], function(loader) {
function() {
//disable effects
$.fx.off = true;
- $.support.transition = false;
+ $.support.transition = false;
+ $.fn.editable.defaults.mode = params.c === 'inline' ? 'inline' : 'popup';
QUnit.load();
QUnit.start();
diff --git a/test/unit/common.js b/test/unit/common.js
index ed95e0f..feb1a7a 100644
--- a/test/unit/common.js
+++ b/test/unit/common.js
@@ -64,7 +64,7 @@
test("container's title and placement from json options", function () {
//do not test inline
- if($.fn.editableContainer.Constructor.prototype.containerName === 'editableform') {
+ if($.fn.editable.defaults.mode === 'inline') {
expect(0);
return;
}
@@ -81,7 +81,7 @@
ok(p.is(':visible'), 'popover shown');
//todo: for jqueryui phantomjs calcs wrong position. Need investigation
- if(!$.browser.webkit && $.fn.editableContainer.Constructor.prototype.containerName !== 'tooltip') {
+ if(!$.browser.webkit && e.data('editableContainer').containerName !== 'tooltip') {
ok(p.offset().top > e.offset().top, 'placement ok');
}
@@ -520,5 +520,23 @@
});
+ test("mode: popup / inline", function () {
+ var e = $('<a href="#" id="a"></a>').appendTo('#qunit-fixture').editable({
+ mode: 'popup'
+ }),
+ e1 = $('<a href="#" id="a1"></a>').appendTo('#qunit-fixture').editable({
+ mode: 'inline'
+ });
+
+ e.click();
+ var p = tip(e);
+ ok(p.is(':visible'), 'popup visible');
+ ok(!p.hasClass('editable-inline'), 'no inline class');
+
+ e1.click();
+ p = tip(e1);
+ ok(p.is(':visible'), 'inline visible visible');
+ ok(p.hasClass('editable-inline'), 'has inline class');
+ });
}(jQuery));
\ No newline at end of file