implement requirejs loading to test

This commit is contained in:
vitalets 2012-12-04 17:24:20 +04:00
parent a1c6d34730
commit 5d3d7d8c4c
26 changed files with 11719 additions and 231 deletions

@ -2,6 +2,12 @@ X-editable changelog
============================= =============================
Version 1.1.2 wip
----------------------------
[enh] playground and tests now use requrejs (vitalets)
[bug #27] 'today' button bug in bootstrap-datepicker (vitalets)
Version 1.1.1 Nov 30, 2012 Version 1.1.1 Nov 30, 2012
---------------------------- ----------------------------
[enh] 'showbuttons' option to hide buttons in form (vitalets) [enh] 'showbuttons' option to hide buttons in form (vitalets)

@ -7,7 +7,7 @@ It is a new life of [bootstrap-editable plugin](http://github.com/vitalets/boots
See **http://vitalets.github.com/x-editable** See **http://vitalets.github.com/x-editable**
## Reporting issues ## Reporting issues
When creating issues please provide jsFiddle example. You can just fork [this fiddle](http://jsfiddle.net/xBB5x/5/) as starting point. When creating issues please provide jsFiddle example. You can easily fork one of templates: [bootstrap](http://jsfiddle.net/xBB5x/5/), [jqueryui](http://jsfiddle.net/xBB5x/14/), [plain](http://jsfiddle.net/xBB5x/16/).
Your feedback is very appreciated! Your feedback is very appreciated!
## Contribution ## Contribution

@ -1,5 +1,5 @@
.editable-container { .editable-container {
max-width: none; /* without this rule poshytip does not stretch */ max-width: none !important; /* without this rule poshytip/tooltip does not stretch */
} }
.editable-container.popover { .editable-container.popover {
@ -10,4 +10,8 @@
.editable-container.editable-inline { .editable-container.editable-inline {
display: inline; display: inline;
vertical-align: middle; vertical-align: middle;
}
.editable-container.ui-widget {
font-size: inherit; /* jqueryui widget font 1.1em too big, overwrite it */
} }

@ -20,7 +20,7 @@ Applied as jQuery method.
init: function(element, options) { init: function(element, options) {
this.$element = $(element); this.$element = $(element);
//todo: what is in priority: data or js? //todo: what is in priority: data or js?
this.options = $.extend({}, $.fn.editableContainer.defaults, $.fn.editableform.utils.getConfigData(this.$element), options); this.options = $.extend({}, $.fn.editableContainer.defaults, $.fn.editableutils.getConfigData(this.$element), options);
this.splitOptions(); this.splitOptions();
this.initContainer(); this.initContainer();

@ -14,7 +14,7 @@
$.extend(this.containerOptions, { $.extend(this.containerOptions, {
trigger: 'manual', trigger: 'manual',
selector: false, selector: false,
content: 'dfgh' content: ' '
}); });
this.call(this.containerOptions); this.call(this.containerOptions);
}, },

@ -2,10 +2,11 @@
* EditableForm utilites * EditableForm utilites
*/ */
(function ($) { (function ($) {
$.fn.editableform.utils = { //utils
$.fn.editableutils = {
/** /**
* classic JS inheritance function * classic JS inheritance function
*/ */
inherit: function (Child, Parent) { inherit: function (Child, Parent) {
var F = function() { }; var F = function() { };
F.prototype = Parent.prototype; F.prototype = Parent.prototype;

@ -16,6 +16,8 @@
*display: inline; *display: inline;
} }
.editable-input { .editable-input {
vertical-align: top; vertical-align: top;
display: inline-block; /* should be inline to take effect of parent's white-space: nowrap */ display: inline-block; /* should be inline to take effect of parent's white-space: nowrap */
@ -31,8 +33,9 @@
} }
/*for jquery-ui buttons need set height to look more pretty*/ /*for jquery-ui buttons need set height to look more pretty*/
.editable-buttons button.ui-button { .editable-buttons button.ui-button-icon-only {
height: 24px; height: 24px;
width: 30px;
} }
.editableform-loading { .editableform-loading {

@ -21,9 +21,9 @@ Editableform is linked with one of input types, e.g. 'text' or 'select'.
var TypeConstructor, typeOptions; var TypeConstructor, typeOptions;
//create input of specified type //create input of specified type
if(typeof $.fn.editableform.types[this.options.type] === 'function') { if(typeof $.fn.editabletypes[this.options.type] === 'function') {
TypeConstructor = $.fn.editableform.types[this.options.type]; TypeConstructor = $.fn.editabletypes[this.options.type];
typeOptions = $.fn.editableform.utils.sliceObj(this.options, $.fn.editableform.utils.objectKeys(TypeConstructor.defaults)); typeOptions = $.fn.editableutils.sliceObj(this.options, $.fn.editableutils.objectKeys(TypeConstructor.defaults));
this.input = new TypeConstructor(typeOptions); this.input = new TypeConstructor(typeOptions);
} else { } else {
$.error('Unknown type: '+ this.options.type); $.error('Unknown type: '+ this.options.type);
@ -246,7 +246,7 @@ Editableform is linked with one of input types, e.g. 'text' or 'select'.
$.extend(params, this.options.params.call(this, params)); $.extend(params, this.options.params.call(this, params));
} else { } else {
//try parse json in single quotes (from data-params attribute) //try parse json in single quotes (from data-params attribute)
this.options.params = $.fn.editableform.utils.tryParseJson(this.options.params, true); this.options.params = $.fn.editableutils.tryParseJson(this.options.params, true);
$.extend(params, this.options.params); $.extend(params, this.options.params);
} }
@ -456,7 +456,7 @@ Editableform is linked with one of input types, e.g. 'text' or 'select'.
@default true @default true
**/ **/
showbuttons: true showbuttons: true
/*todo: /*todo:
Submit strategy. Can be <code>normal|never</code> Submit strategy. Can be <code>normal|never</code>
<code>submitmode='never'</code> usefull for turning into classic form several inputs and submitting them together manually. <code>submitmode='never'</code> usefull for turning into classic form several inputs and submitting them together manually.
@ -493,9 +493,4 @@ Editableform is linked with one of input types, e.g. 'text' or 'select'.
//error class attahced to editable-error-block //error class attahced to editable-error-block
$.fn.editableform.errorBlockClass = 'editable-error'; $.fn.editableform.errorBlockClass = 'editable-error';
//input types
$.fn.editableform.types = {};
//utils
$.fn.editableform.utils = {};
}(window.jQuery)); }(window.jQuery));

@ -8,7 +8,7 @@ Makes editable any HTML element on the page. Applied as jQuery method.
var Editable = function (element, options) { var Editable = function (element, options) {
this.$element = $(element); this.$element = $(element);
this.options = $.extend({}, $.fn.editable.defaults, $.fn.editableform.utils.getConfigData(this.$element), options); this.options = $.extend({}, $.fn.editable.defaults, $.fn.editableutils.getConfigData(this.$element), options);
this.init(); this.init();
}; };
@ -33,9 +33,9 @@ Makes editable any HTML element on the page. Applied as jQuery method.
this.options.name = this.options.name || this.$element.attr('id'); this.options.name = this.options.name || this.$element.attr('id');
//create input of specified type. Input will be used for converting value, not in form //create input of specified type. Input will be used for converting value, not in form
if(typeof $.fn.editableform.types[this.options.type] === 'function') { if(typeof $.fn.editabletypes[this.options.type] === 'function') {
TypeConstructor = $.fn.editableform.types[this.options.type]; TypeConstructor = $.fn.editabletypes[this.options.type];
this.typeOptions = $.fn.editableform.utils.sliceObj(this.options, $.fn.editableform.utils.objectKeys(TypeConstructor.defaults)); this.typeOptions = $.fn.editableutils.sliceObj(this.options, $.fn.editableutils.objectKeys(TypeConstructor.defaults));
this.input = new TypeConstructor(this.typeOptions); this.input = new TypeConstructor(this.typeOptions);
} else { } else {
$.error('Unknown type: '+ this.options.type); $.error('Unknown type: '+ this.options.type);
@ -89,7 +89,7 @@ Makes editable any HTML element on the page. Applied as jQuery method.
} }
/** /**
Fired each time when element's text is rendered. Occurs on initialization and on each update of value. Fired each time when element's text is rendered. Occurs on initialization and on each update of value.
Can be used for display customization. Can be used to customize display of value.
@event render @event render
@param {Object} event event object @param {Object} event event object

@ -26,7 +26,7 @@ $(function(){
this.init('address', options, Address.defaults); this.init('address', options, Address.defaults);
}; };
$.fn.editableform.utils.inherit(Address, $.fn.editableform.types.abstract); $.fn.editableutils.inherit(Address, $.fn.editabletypes.abstract);
$.extend(Address.prototype, { $.extend(Address.prototype, {
render: function() { render: function() {
@ -94,7 +94,7 @@ $(function(){
} }
}); });
Address.defaults = $.extend({}, $.fn.editableform.types.abstract.defaults, { Address.defaults = $.extend({}, $.fn.editabletypes.abstract.defaults, {
tpl: '<div><label><span>City: </span><input type="text" name="city" class="span2"></label></div>'+ tpl: '<div><label><span>City: </span><input type="text" name="city" class="span2"></label></div>'+
'<div><label><span>Street: </span><input type="text" name="street" class="span2"></label></div>'+ '<div><label><span>Street: </span><input type="text" name="street" class="span2"></label></div>'+
'<div><label><span>Building: </span><input type="text" name="building" class="span1"></label></div>', '<div><label><span>Building: </span><input type="text" name="building" class="span1"></label></div>',
@ -102,6 +102,6 @@ $(function(){
inputclass: 'editable-address' inputclass: 'editable-address'
}); });
$.fn.editableform.types.address = Address; $.fn.editabletypes.address = Address;
}(window.jQuery)); }(window.jQuery));

@ -6,6 +6,9 @@ To create your own input you should inherit from this class.
**/ **/
(function ($) { (function ($) {
//types
$.fn.editabletypes = {};
var Abstract = function () { }; var Abstract = function () { };
Abstract.prototype = { Abstract.prototype = {
@ -164,6 +167,6 @@ To create your own input you should inherit from this class.
name: null name: null
}; };
$.extend($.fn.editableform.types, {abstract: Abstract}); $.extend($.fn.editabletypes, {abstract: Abstract});
}(window.jQuery)); }(window.jQuery));

@ -27,7 +27,7 @@ $(function(){
this.init('checklist', options, Checklist.defaults); this.init('checklist', options, Checklist.defaults);
}; };
$.fn.editableform.utils.inherit(Checklist, $.fn.editableform.types.list); $.fn.editableutils.inherit(Checklist, $.fn.editabletypes.list);
$.extend(Checklist.prototype, { $.extend(Checklist.prototype, {
renderList: function() { renderList: function() {
@ -123,7 +123,7 @@ $(function(){
} }
}); });
Checklist.defaults = $.extend({}, $.fn.editableform.types.list.defaults, { Checklist.defaults = $.extend({}, $.fn.editabletypes.list.defaults, {
/** /**
@property tpl @property tpl
@default <div></div> @default <div></div>
@ -173,6 +173,6 @@ $(function(){
limitText: 'Selected {checked} of {count}' limitText: 'Selected {checked} of {count}'
}); });
$.fn.editableform.types.checklist = Checklist; $.fn.editabletypes.checklist = Checklist;
}(window.jQuery)); }(window.jQuery));

@ -27,7 +27,7 @@ $(function(){
this.init('date', options, Date.defaults); this.init('date', options, Date.defaults);
//set popular options directly from settings or data-* attributes //set popular options directly from settings or data-* attributes
var directOptions = $.fn.editableform.utils.sliceObj(this.options, ['format']); var directOptions = $.fn.editableutils.sliceObj(this.options, ['format']);
//overriding datepicker config (as by default jQuery extend() is not recursive) //overriding datepicker config (as by default jQuery extend() is not recursive)
this.options.datepicker = $.extend({}, Date.defaults.datepicker, directOptions, options.datepicker); this.options.datepicker = $.extend({}, Date.defaults.datepicker, directOptions, options.datepicker);
@ -48,7 +48,7 @@ $(function(){
this.parsedViewFormat = this.dpg.parseFormat(this.options.viewformat); this.parsedViewFormat = this.dpg.parseFormat(this.options.viewformat);
}; };
$.fn.editableform.utils.inherit(Date, $.fn.editableform.types.abstract); $.fn.editableutils.inherit(Date, $.fn.editabletypes.abstract);
$.extend(Date.prototype, { $.extend(Date.prototype, {
render: function () { render: function () {
@ -108,7 +108,7 @@ $(function(){
}); });
Date.defaults = $.extend({}, $.fn.editableform.types.abstract.defaults, { Date.defaults = $.extend({}, $.fn.editabletypes.abstract.defaults, {
/** /**
@property tpl @property tpl
@default <div></div> @default <div></div>
@ -165,6 +165,6 @@ $(function(){
clear: '&times; clear' clear: '&times; clear'
}); });
$.fn.editableform.types.date = Date; $.fn.editabletypes.date = Date;
}(window.jQuery)); }(window.jQuery));

@ -27,7 +27,7 @@ $(function(){
this.init('dateui', options, DateUI.defaults); this.init('dateui', options, DateUI.defaults);
//set popular options directly from settings or data-* attributes //set popular options directly from settings or data-* attributes
var directOptions = $.fn.editableform.utils.sliceObj(this.options, ['format']); var directOptions = $.fn.editableutils.sliceObj(this.options, ['format']);
//overriding datepicker config (as by default jQuery extend() is not recursive) //overriding datepicker config (as by default jQuery extend() is not recursive)
this.options.datepicker = $.extend({}, DateUI.defaults.datepicker, directOptions, options.datepicker); this.options.datepicker = $.extend({}, DateUI.defaults.datepicker, directOptions, options.datepicker);
@ -46,7 +46,7 @@ $(function(){
this.options.datepicker.dateFormat = this.options.datepicker.format; this.options.datepicker.dateFormat = this.options.datepicker.format;
}; };
$.fn.editableform.utils.inherit(DateUI, $.fn.editableform.types.abstract); $.fn.editableutils.inherit(DateUI, $.fn.editabletypes.abstract);
$.extend(DateUI.prototype, { $.extend(DateUI.prototype, {
render: function () { render: function () {
@ -125,7 +125,7 @@ $(function(){
}); });
DateUI.defaults = $.extend({}, $.fn.editableform.types.abstract.defaults, { DateUI.defaults = $.extend({}, $.fn.editabletypes.abstract.defaults, {
/** /**
@property tpl @property tpl
@default <div></div> @default <div></div>
@ -183,7 +183,7 @@ $(function(){
clear: '&times; clear' clear: '&times; clear'
}); });
$.fn.editableform.types.dateui = DateUI; $.fn.editabletypes.dateui = DateUI;
$.fn.editableform.types.date = DateUI; $.fn.editabletypes.date = DateUI;
}(window.jQuery)); }(window.jQuery));

@ -10,7 +10,7 @@ List - abstract class for inputs that have source option loaded from js array or
}; };
$.fn.editableform.utils.inherit(List, $.fn.editableform.types.abstract); $.fn.editableutils.inherit(List, $.fn.editabletypes.abstract);
$.extend(List.prototype, { $.extend(List.prototype, {
render: function () { render: function () {
@ -58,7 +58,7 @@ List - abstract class for inputs that have source option loaded from js array or
// try parse json in single quotes (for double quotes jquery does automatically) // try parse json in single quotes (for double quotes jquery does automatically)
try { try {
this.options.source = $.fn.editableform.utils.tryParseJson(this.options.source, false); this.options.source = $.fn.editableutils.tryParseJson(this.options.source, false);
} catch (e) { } catch (e) {
error.call(this); error.call(this);
return; return;
@ -139,7 +139,7 @@ List - abstract class for inputs that have source option loaded from js array or
if(!$.isArray(this.prependData)) { if(!$.isArray(this.prependData)) {
//try parse json in single quotes //try parse json in single quotes
this.options.prepend = $.fn.editableform.utils.tryParseJson(this.options.prepend, true); this.options.prepend = $.fn.editableutils.tryParseJson(this.options.prepend, true);
if (typeof this.options.prepend === 'string') { if (typeof this.options.prepend === 'string') {
this.options.prepend = {'': this.options.prepend}; this.options.prepend = {'': this.options.prepend};
} }
@ -220,7 +220,7 @@ List - abstract class for inputs that have source option loaded from js array or
}); });
List.defaults = $.extend({}, $.fn.editableform.types.abstract.defaults, { List.defaults = $.extend({}, $.fn.editabletypes.abstract.defaults, {
/** /**
Source data for list. If string - considered ajax url to load items. Otherwise should be an array. Source data for list. If string - considered ajax url to load items. Otherwise should be an array.
Array format is: <code>[{value: 1, text: "text"}, {...}]</code><br> Array format is: <code>[{value: 1, text: "text"}, {...}]</code><br>
@ -249,6 +249,6 @@ List - abstract class for inputs that have source option loaded from js array or
sourceError: 'Error when loading list' sourceError: 'Error when loading list'
}); });
$.fn.editableform.types.list = List; $.fn.editabletypes.list = List;
}(window.jQuery)); }(window.jQuery));

@ -26,7 +26,7 @@ $(function(){
this.init('select', options, Select.defaults); this.init('select', options, Select.defaults);
}; };
$.fn.editableform.utils.inherit(Select, $.fn.editableform.types.list); $.fn.editableutils.inherit(Select, $.fn.editabletypes.list);
$.extend(Select.prototype, { $.extend(Select.prototype, {
renderList: function() { renderList: function() {
@ -54,7 +54,7 @@ $(function(){
} }
}); });
Select.defaults = $.extend({}, $.fn.editableform.types.list.defaults, { Select.defaults = $.extend({}, $.fn.editabletypes.list.defaults, {
/** /**
@property tpl @property tpl
@default <select></select> @default <select></select>
@ -62,6 +62,6 @@ $(function(){
tpl:'<select></select>' tpl:'<select></select>'
}); });
$.fn.editableform.types.select = Select; $.fn.editabletypes.select = Select;
}(window.jQuery)); }(window.jQuery));

@ -20,18 +20,18 @@ $(function(){
this.init('text', options, Text.defaults); this.init('text', options, Text.defaults);
}; };
$.fn.editableform.utils.inherit(Text, $.fn.editableform.types.abstract); $.fn.editableutils.inherit(Text, $.fn.editabletypes.abstract);
$.extend(Text.prototype, { $.extend(Text.prototype, {
activate: function() { activate: function() {
if(this.$input.is(':visible')) { if(this.$input.is(':visible')) {
this.$input.focus(); this.$input.focus();
$.fn.editableform.utils.setCursorPosition(this.$input.get(0), this.$input.val().length); $.fn.editableutils.setCursorPosition(this.$input.get(0), this.$input.val().length);
} }
} }
}); });
Text.defaults = $.extend({}, $.fn.editableform.types.abstract.defaults, { Text.defaults = $.extend({}, $.fn.editabletypes.abstract.defaults, {
/** /**
@property tpl @property tpl
@default <input type="text"> @default <input type="text">
@ -47,6 +47,6 @@ $(function(){
placeholder: null placeholder: null
}); });
$.fn.editableform.types.text = Text; $.fn.editabletypes.text = Text;
}(window.jQuery)); }(window.jQuery));

@ -21,7 +21,7 @@ $(function(){
this.init('textarea', options, Textarea.defaults); this.init('textarea', options, Textarea.defaults);
}; };
$.fn.editableform.utils.inherit(Textarea, $.fn.editableform.types.abstract); $.fn.editableutils.inherit(Textarea, $.fn.editabletypes.abstract);
$.extend(Textarea.prototype, { $.extend(Textarea.prototype, {
render: function () { render: function () {
@ -60,13 +60,13 @@ $(function(){
activate: function() { activate: function() {
if(this.$input.is(':visible')) { if(this.$input.is(':visible')) {
$.fn.editableform.utils.setCursorPosition(this.$input.get(0), this.$input.val().length); $.fn.editableutils.setCursorPosition(this.$input.get(0), this.$input.val().length);
this.$input.focus(); this.$input.focus();
} }
} }
}); });
Textarea.defaults = $.extend({}, $.fn.editableform.types.abstract.defaults, { Textarea.defaults = $.extend({}, $.fn.editabletypes.abstract.defaults, {
/** /**
@property tpl @property tpl
@default <textarea></textarea> @default <textarea></textarea>
@ -87,6 +87,6 @@ $(function(){
placeholder: null placeholder: null
}); });
$.fn.editableform.types.textarea = Textarea; $.fn.editabletypes.textarea = Textarea;
}(window.jQuery)); }(window.jQuery));

@ -3,55 +3,24 @@
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8">
<title>Test X-editable</title> <title>Test X-editable</title>
<!-- jquery -->
<script src="libs/jquery/jquery-1.8.2.js"></script>
<!-- qunit -->
<link rel="stylesheet" href="libs/qunit/qunit-1.10.0.css" type="text/css" media="screen" />
<script src="libs/qunit/qunit-1.10.0.js"></script>
<!-- mockjax -->
<script src="libs/mockjax/jquery.mockjax.js"></script>
<script src="mocks.js"></script>
<script src="loader.js"></script>
<script> <script>
var fc = getFC(), window.onload = function() {
assets = getAssets(fc.f, fc.c, '../src/', 'libs/'); QUnit.config.autostart = false;
loadAssets(assets.css, assets.js); };
</script>
var fx, sfx;
$(function () { <script data-main="main.js" src="require-jquery.js"></script>
$.fx.off = true;
$.support.transition = false; <!-- qunit -->
}); <link rel="stylesheet" href="libs/qunit/qunit-1.10.0.css" type="text/css" media="screen" />
</script> <script src="libs/qunit/qunit-1.10.0.js"></script>
</head> </head>
<body> <body>
<div> <div>
<div id="qunit"></div> <div id="qunit"></div>
<div id="qunit-fixture"></div> <div id="qunit-fixture"></div>
<div id="async-fixture"></div> <div id="async-fixture"></div>
</div> </div>
<!-- unit tests -->
<!-- You can also add "?module=[module]" URL to run only tests within that module-->
<script src="unit/common.js"></script>
<script src="unit/text.js"></script>
<script src="unit/select.js"></script>
<script src="unit/textarea.js"></script>
<script src="unit/api.js"></script>
<script src="unit/checklist.js"></script>
<script>
if(fc.f === 'bootstrap') {
loadJs('unit/date.js');
} else {
loadJs('unit/dateui.js');
}
</script>
</body> </body>
</html> </html>

@ -1,128 +1,171 @@
/** define(function () {
* load requred js and css according to f (form) and c (container) parameters
*/ function loadCss(url) {
var link = document.createElement("link");
link.type = "text/css";
link.rel = "stylesheet";
link.href = url;
document.getElementsByTagName("head")[0].appendChild(link);
};
return {
loadCss: loadCss,
getConfig: function (baseUrl) {
var params = this.getParams(),
f = params.f,
c = params.c,
shim = {
'editable-form/editable-form-utils': ['jquery'],
'containers/editable-container': {
deps: ['require', 'editable-form/editable-form-utils', 'editable-form/editable-form'],
init: function(require) {
loadCss(require.toUrl("./editable-container.css"));
}
},
'element/editable-element': {
deps: ['require'], //here should be dynamically added container
init: function(require) {
loadCss(require.toUrl("./editable-element.css"));
}
},
'editable-form/editable-form': {
deps: ['require',
'inputs/text',
'inputs/textarea',
'inputs/select',
'inputs/checklist',
'inputs-ext/address/address'],
init: function(require) {
loadCss(require.toUrl("./editable-form.css"));
}
},
'inputs/select': ['inputs/list'],
'inputs/checklist': ['inputs/list'],
'inputs/list': ['inputs/abstract'],
'inputs/text': ['inputs/abstract'],
'inputs/textarea': ['inputs/abstract'],
'inputs/abstract': ['editable-form/editable-form-utils'],
function getFC() { //bootstrap
var url = window.location.href, f, c; 'bootstrap/js/bootstrap': {
if(url.match(/f=jqueryui/i)) { deps: ['require'],
f = 'jqueryui'; init: function(require) {
} else if(url.match(/f=plain/i)) { loadCss(require.toUrl("../css/bootstrap.css"));
f = 'plain'; }
} else { //bootstrap },
f = 'bootstrap'; 'editable-form/editable-form-bootstrap': [
'editable-form/editable-form',
'bootstrap/js/bootstrap'
],
'containers/editable-popover': ['containers/editable-container',
'bootstrap/js/bootstrap'
],
'inputs/date/date': {
deps: ['require',
'bootstrap/js/bootstrap',
'inputs/abstract',
'inputs/date/bootstrap-datepicker/js/bootstrap-datepicker'],
init: function(require) {
loadCss(require.toUrl("./bootstrap-datepicker/css/datepicker.css"));
}
},
//jqueryui
'jqueryui/js/jquery-ui-1.9.1.custom': {
deps: ['require'],
init: function(require) {
loadCss(require.toUrl("../css/redmond/jquery-ui-1.9.1.custom.css"));
}
},
'editable-form/editable-form-jqueryui': [
'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'
],
'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'
],
'poshytip/jquery.poshytip': {
deps: ['require'],
init: function(require) {
loadCss(require.toUrl("./tip-yellowsimple/tip-yellowsimple.css"));
}
},
'inputs/dateui/jquery-ui-datepicker/js/jquery-ui-1.9.1.custom': {
deps: ['require'],
init: function(require) {
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': {
deps: ['require', 'inputs/abstract'],
init: function(require) {
loadCss(require.toUrl("./address.css"));
}
}
};
/*
modify shim for bootstrap, jqueryui or plain
*/
if(f === 'bootstrap') {
//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');
} 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');
} 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');
}
/*
return requirejs config
*/
return {
baseUrl: baseUrl,
paths: {
"bootstrap": "../test/libs/bootstrap221",
"jqueryui": "../test/libs/jquery-ui-1.9.1.custom",
"poshytip": "../test/libs/poshytip",
"test": "../test"
},
shim: shim
};
},
getParams: function() {
var url = window.location.href, f, c;
if(url.match(/f=jqueryui/i)) {
f = 'jqueryui';
} else if(url.match(/f=plain/i)) {
f = 'plain';
} else {
f = 'bootstrap';
}
c = url.match(/c=inline/i) ? 'inline' : 'popup';
return {f: f, c: c};
}
} }
c = url.match(/c=inline/i) ? 'inline' : 'popup'; });
return {f: f, c: c};
}
function getAssets(f, c, src, libs) {
var
forms = src+'editable-form/',
inputs = src+'inputs/',
containers = src+'containers/',
element = src+'element/',
bootstrap = libs+'bootstrap221/',
jqueryui = libs+'jquery-ui-1.9.1.custom/',
js = [
forms+'editable-form.js',
forms+'editable-form-utils.js',
containers+'editable-container.js',
element+'editable-element.js',
inputs+'abstract.js',
inputs+'list.js',
inputs+'text.js',
inputs+'textarea.js',
inputs+'select.js',
inputs+'checklist.js'
],
css = [
forms+'editable-form.css',
containers+'editable-container.css',
element+'editable-element.css'
];
//tune js and css
if(f==='jqueryui') {
//core
js.unshift(jqueryui+'js/jquery-ui-1.9.1.custom.js')
css.unshift(jqueryui+'css/redmond/jquery-ui-1.9.1.custom.css');
//editable
js.push(forms+'editable-form-jqueryui.js');
js.push(getContainer('editable-tooltip.js'));
//date
js.push(inputs+'dateui/dateui.js');
//style
css.push('style.css');
} else if(f==='plain') {
//core
js.unshift(libs+'poshytip/jquery.poshytip.js');
css.unshift(libs+'poshytip/tip-yellowsimple/tip-yellowsimple.css');
//editable
js.push(getContainer('editable-poshytip.js'));
//date
js.push(inputs+'dateui/dateui.js');
js.push(inputs+'dateui/jquery-ui-datepicker/js/jquery-ui-1.9.1.custom.js');
css.unshift(inputs+'dateui/jquery-ui-datepicker/css/redmond/jquery-ui-1.9.1.custom.css');
//style
css.push('style.css');
/* bootstrap */
} else {
//core
js.unshift(bootstrap+'js/bootstrap.js')
css.unshift(bootstrap+'css/bootstrap.css');
css.unshift(bootstrap+'css/bootstrap-responsive.css');
//editable
js.push(forms+'editable-form-bootstrap.js');
js.push(getContainer('editable-popover.js'));
//date
js.push(inputs+'date/bootstrap-datepicker/js/bootstrap-datepicker.js');
js.push(inputs+'date/date.js');
css.push(inputs+'date/bootstrap-datepicker/css/datepicker.css');
}
function getContainer(container) {
return (c === 'inline') ? containers+'/editable-inline.js' : containers + container;
}
//js.push('main.js');
return {css: css, js: js};
}
function loadAssets(css, js) {
for(var i = 0; i < css.length; i++) {
loadCss(css[i]);
}
for(i = 0; i < js.length; i++) {
loadJs(js[i]);
}
}
function loadCss(url) {
var link = document.createElement("link");
link.type = "text/css";
link.rel = "stylesheet";
link.href = url;
document.getElementsByTagName("head")[0].appendChild(link);
}
function loadJs(url) {
if(!url) return;
var script = document.createElement("script");
script.src = url;
document.getElementsByTagName("head")[0].appendChild(script);
}

32
test/main.js Normal file

@ -0,0 +1,32 @@
require(["jquery", "loader"], function($, loader) {
requirejs.config(loader.getConfig("../src"));
//loader.loadCss('libs/qunit/qunit-1.10.0.css');
require(['element/editable-element',
'test/libs/mockjax/jquery.mockjax',
// 'test/libs/qunit/qunit-1.10.0'
],
function() {
//disable effects
$.fx.off = true;
$.support.transition = false;
var params = loader.getParams();
require([
'test/mocks',
'test/unit/common',
'test/unit/text',
'test/unit/textarea',
'test/unit/select',
'test/unit/checklist',
'test/unit/api',
(params.f === 'bootstrap') ? 'test/unit/date' : 'test/unit/dateui'
], function() {
QUnit.load();
QUnit.start();
});
});
});

11433
test/require-jquery.js Normal file

File diff suppressed because it is too large Load Diff

@ -231,16 +231,15 @@ $(function () {
}); });
e.editable({ e.editable({
source: 'groups.php', source: groups,
}); });
e.click(); e.click();
var p = tip(e); var p = tip(e);
p.find('select').val(2); p.find('select').val(2);
p.find('form').submit(); p.find('form').submit();
setTimeout(function() { setTimeout(function() {
p.find('button[type=button]').click();
e.remove(); e.remove();
start(); start();
}, timeout); }, timeout);

@ -64,7 +64,7 @@
test("should take container's title from json options", function () { test("should take container's title from json options", function () {
//do not test inline //do not test inline
if(fc.c === 'inline') { if($.fn.editableContainer.Constructor.prototype.containerName === 'editableform') {
expect(0); expect(0);
return; return;
} }
@ -81,7 +81,7 @@
ok(p.is(':visible'), 'popover shown'); ok(p.is(':visible'), 'popover shown');
//todo: for jqueryui phantomjs calcs wrong position. Need investigation //todo: for jqueryui phantomjs calcs wrong position. Need investigation
if(!$.browser.webkit && fc.f !== 'jqueryui') { if(!$.browser.webkit && $.fn.editableContainer.Constructor.prototype.containerName !== 'tooltip') {
ok(p.offset().top > e.offset().top, 'placement ok'); ok(p.offset().top > e.offset().top, 'placement ok');
} }

@ -16,7 +16,7 @@ $(function () {
asyncTest("container should contain datepicker with value and save new entered date", function () { asyncTest("container should contain datepicker with value and save new entered date", function () {
expect(9); expect(9);
$.fn.editableform.types.date.defaults.datepicker.weekStart = 1; $.fn.editabletypes.date.defaults.datepicker.weekStart = 1;
var d = '15.05.1984', var d = '15.05.1984',
e = $('<a href="#" data-type="date" data-pk="1" data-url="post-date.php">'+d+'</a>').appendTo(fx).editable({ e = $('<a href="#" data-type="date" data-pk="1" data-url="post-date.php">'+d+'</a>').appendTo(fx).editable({
@ -60,7 +60,7 @@ $(function () {
asyncTest("viewformat, init by text", function () { asyncTest("viewformat, init by text", function () {
$.fn.editableform.types.date.defaults.datepicker.weekStart = 1; $.fn.editabletypes.date.defaults.datepicker.weekStart = 1;
var dview = '15/05/1984', var dview = '15/05/1984',
d = '1984-05-15', d = '1984-05-15',

@ -345,7 +345,7 @@ $(function () {
var e = $('<a href="#" data-type="select" data-pk="1" data-name="name1" data-value="1" data-autotext="always" data-url="post.php" data-source="groups-cache-sim-err.php">35</a>').appendTo(fx).editable(), var e = $('<a href="#" data-type="select" data-pk="1" data-name="name1" data-value="1" data-autotext="always" data-url="post.php" data-source="groups-cache-sim-err.php">35</a>').appendTo(fx).editable(),
e1 = $('<a href="#" data-type="select" data-pk="1" data-name="name1" data-value="2" data-autotext="always" data-url="post.php" data-source="groups-cache-sim-err.php">35</a>').appendTo(fx).editable(), e1 = $('<a href="#" data-type="select" data-pk="1" data-name="name1" data-value="2" data-autotext="always" data-url="post.php" data-source="groups-cache-sim-err.php">35</a>').appendTo(fx).editable(),
e2 = $('<a href="#" data-type="select" data-pk="1" data-name="name1" data-value="3" data-autotext="always" data-url="post.php" data-source="groups-cache-sim-err.php">6456</a>').appendTo(fx).editable(), e2 = $('<a href="#" data-type="select" data-pk="1" data-name="name1" data-value="3" data-autotext="always" data-url="post.php" data-source="groups-cache-sim-err.php">6456</a>').appendTo(fx).editable(),
errText = $.fn.editableform.types.select.defaults.sourceError; errText = $.fn.editabletypes.select.defaults.sourceError;
setTimeout(function() { setTimeout(function() {