Skip to content

erp5
erp5
Commit e9f7d150 authored by Romain Courteaud's avatar Romain Courteaud
Browse files
Options

[erp5_web_renderjs_ui] Add a label field to simplify field error display

parent cd4e37b2
Expand all Show whitespace changes
Inline Side-by-side
Showing with 809 additions and 96 deletions
bt5/erp5_web_renderjs_ui/PathTemplateItem/web_page_module/rjs_gadget_erp5_form_html.html
View file @ e9f7d150
...@@ -14,8 +14,6 @@ ...@@ -14,8 +14,6 @@
</head> </head>
<body> <body>
<div class="field_container"></div> <div class="field_container"></div>
</body> </body>
</html> </html>
\ No newline at end of file
bt5/erp5_web_renderjs_ui/PathTemplateItem/web_page_module/rjs_gadget_erp5_form_html.xml
View file @ e9f7d150
...@@ -220,7 +220,7 @@ ...@@ -220,7 +220,7 @@
</item> </item>
<item> <item>
<key> <string>actor</string> </key> <key> <string>actor</string> </key>
<value> <string>romain</string> </value> <value> <string>zope</string> </value>
</item> </item>
<item> <item>
<key> <string>comment</string> </key> <key> <string>comment</string> </key>
...@@ -234,7 +234,7 @@ ...@@ -234,7 +234,7 @@
</item> </item>
<item> <item>
<key> <string>serial</string> </key> <key> <string>serial</string> </key>
<value> <string>936.23256.32810.49595</string> </value> <value> <string>952.64761.25287.18397</string> </value>
</item> </item>
<item> <item>
<key> <string>state</string> </key> <key> <string>state</string> </key>
...@@ -252,8 +252,8 @@ ...@@ -252,8 +252,8 @@
</tuple> </tuple>
<state> <state>
<tuple> <tuple>
<float>1405948378.28</float> <float>1474465679.72</float>
<string>GMT</string> <string>UTC</string>
</tuple> </tuple>
</state> </state>
</object> </object>
......
bt5/erp5_web_renderjs_ui/PathTemplateItem/web_page_module/rjs_gadget_erp5_form_js.js
View file @ e9f7d150
...@@ -3,12 +3,6 @@ ...@@ -3,12 +3,6 @@
(function (window, document, rJS, RSVP) { (function (window, document, rJS, RSVP) {
"use strict"; "use strict";
/////////////////////////////////////////////////////////////////
// Handlebars
/////////////////////////////////////////////////////////////////
// Precompile the templates while loading the first gadget instance
var gadget_klass = rJS(window);
function getFieldTypeGadgetUrl(type) { function getFieldTypeGadgetUrl(type) {
var field_url = 'gadget_erp5_field_readonly.html'; var field_url = 'gadget_erp5_field_readonly.html';
if (type === 'ListField') { if (type === 'ListField') {
...@@ -56,45 +50,11 @@ ...@@ -56,45 +50,11 @@
return field_url; return field_url;
} }
gadget_klass rJS(window)
/////////////////////////////////////////////////////////////////
// ready
/////////////////////////////////////////////////////////////////
// Init local properties
.ready(function (g) { .ready(function (g) {
g.props = {}; g.props = {};
}) })
// Assign the element to a variable
.ready(function (g) {
return g.getElement()
.push(function (element) {
g.props.element = element;
});
})
.declareAcquiredMethod("translateHtml", "translateHtml")
.allowPublicAcquisition("notifyInvalid", function (param_list, scope) {
return this.getDeclaredGadget(scope)
.push(function (gadget) {
return gadget.getElement();
})
.push(function (gadget_element) {
gadget_element.previousElementSibling.querySelector("span").textContent = " (" + param_list[0] + ")";
});
})
.allowPublicAcquisition("notifyValid", function (param_list, scope) {
/*jslint unparam:true*/
return this.getDeclaredGadget(scope)
.push(function (gadget) {
return gadget.getElement();
})
.push(function (gadget_element) {
gadget_element.previousElementSibling.querySelector("span").textContent = "";
});
})
.allowPublicAcquisition("getFieldTypeGadgetUrl", function (param_list) { .allowPublicAcquisition("getFieldTypeGadgetUrl", function (param_list) {
return getFieldTypeGadgetUrl(param_list[0]); return getFieldTypeGadgetUrl(param_list[0]);
}) })
...@@ -105,6 +65,7 @@ ...@@ -105,6 +65,7 @@
///////////////////////////////////////////////////////////////// /////////////////////////////////////////////////////////////////
// declared methods // declared methods
///////////////////////////////////////////////////////////////// /////////////////////////////////////////////////////////////////
.declareMethod('render', function (options) { .declareMethod('render', function (options) {
var i, var i,
erp5_document = options.erp5_document, erp5_document = options.erp5_document,
...@@ -116,10 +77,6 @@ ...@@ -116,10 +77,6 @@
suboption_dict = {}, suboption_dict = {},
parent_element = document.createElement("div"); parent_element = document.createElement("div");
delete options.erp5_document;
delete options.form_definition;
// options = options.form_gadget || {};
form_gadget.state_parameter_dict = options.form_gadget || {}; form_gadget.state_parameter_dict = options.form_gadget || {};
// XXX Hardcoded for searchfield - remove later! // XXX Hardcoded for searchfield - remove later!
if (form_definition.extended_search) { if (form_definition.extended_search) {
...@@ -129,7 +86,6 @@ ...@@ -129,7 +86,6 @@
suboption_dict.hide_enabled = form_definition.hide_enabled; suboption_dict.hide_enabled = form_definition.hide_enabled;
form_gadget.props.gadget_list = []; form_gadget.props.gadget_list = [];
form_gadget.props.id = options.jio_key;
function addGroup(group) { function addGroup(group) {
queue queue
...@@ -140,67 +96,44 @@ ...@@ -140,67 +96,44 @@
group_queue = new RSVP.Queue(); group_queue = new RSVP.Queue();
function addField(field) { function addField(field) {
group_queue.push(function () { group_queue.push(function () {
if (rendered_form.hasOwnProperty(field[0])) { if (rendered_form.hasOwnProperty(field[0])) {
// Field is enabled in this context // Field is enabled in this context
var field_queue = new RSVP.Queue(), var field_queue = new RSVP.Queue(),
sandbox = "public", sandbox = "public",
field_url,
// Don't change the structure without changing notifyValid and notifyInvalid
field_element = document.createElement("div"), field_element = document.createElement("div"),
gadget_element = document.createElement("div"), renderered_field = rendered_form[field[0]],
label_element = document.createElement("label"), suboptions = options[renderered_field.key] || suboption_dict;
error_element = document.createElement("span"), suboptions.field_url = getFieldTypeGadgetUrl(renderered_field.type);
renderered_field = rendered_form[field[0]]; suboptions.label = false;
suboptions.field_json = renderered_field;
suboptions.field_json.view = options.view;
field_element.className = "ui-field-contain";
if (renderered_field.hidden === 1) {
// Hide field
field_element.className = field_element.className + " ui-screen-hidden";
}
// field_element.setAttribute('data-role', 'fieldcontain');
label_element.setAttribute('for', renderered_field.key);
label_element.textContent = renderered_field.title;
label_element.setAttribute('data-i18n', renderered_field.title);
if (renderered_field.hasOwnProperty('error_text')) {
error_element.textContent = " (" + renderered_field.error_text + ")";
}
// error_element.setAttribute('class', 'ui-state-error ui-corner-all');
label_element.appendChild(error_element);
if (group[0] !== "bottom") { if (group[0] !== "bottom") {
field_element.appendChild(label_element); suboptions.label = true;
} }
field_url = getFieldTypeGadgetUrl(renderered_field.type);
return field_queue return field_queue
.push(function () { .push(function () {
return form_gadget.translateHtml(field_element.innerHTML); return form_gadget.declareGadget('gadget_erp5_label_field.html', {
})
.push(function (my_translate_html) {
field_element.innerHTML = my_translate_html;
field_element.appendChild(gadget_element);
fieldset_element.appendChild(field_element);
})
.push(function () {
return form_gadget.declareGadget(field_url, {
scope: renderered_field.key, scope: renderered_field.key,
element: gadget_element, element: field_element,
sandbox: sandbox sandbox: sandbox
}); });
}) })
.push(function (field_gadget) { .push(function (label_gadget) {
//XXXXX Hardcoded to get one listbox gadget //XXXXX Hardcoded to get one listbox gadget
//pt form list gadget will get this listbox's info //pt form list gadget will get this listbox's info
//then pass to search field gadget //then pass to search field gadget
if (field_url === "gadget_erp5_field_listbox.html") { if (suboptions.field_url === "gadget_erp5_field_listbox.html") {
form_gadget.props.listbox_gadget = field_gadget; form_gadget.props.listbox_gadget = label_gadget;
} }
form_gadget.props.gadget_list.push(field_gadget); form_gadget.props.gadget_list.push(label_gadget);
var suboptions = options[renderered_field.key] || suboption_dict; return label_gadget.render(suboptions);
suboptions.field_json = renderered_field; })
suboptions.field_json.view = options.view; .push(function () {
return field_gadget.render(suboptions); fieldset_element.appendChild(field_element);
}); });
} }
}); });
...@@ -222,7 +155,7 @@ ...@@ -222,7 +155,7 @@
return queue return queue
.push(function () { .push(function () {
var dom_element = form_gadget.props.element var dom_element = form_gadget.element
.querySelector(".field_container"); .querySelector(".field_container");
while (dom_element.firstChild) { while (dom_element.firstChild) {
dom_element.removeChild(dom_element.firstChild); dom_element.removeChild(dom_element.firstChild);
...@@ -233,6 +166,8 @@ ...@@ -233,6 +166,8 @@
}); });
}) })
.declareMethod("getListboxInfo", function () { .declareMethod("getListboxInfo", function () {
//XXXXX get listbox gadget's info //XXXXX get listbox gadget's info
var gadget = this; var gadget = this;
......
bt5/erp5_web_renderjs_ui/PathTemplateItem/web_page_module/rjs_gadget_erp5_form_js.xml
View file @ e9f7d150
...@@ -230,7 +230,7 @@ ...@@ -230,7 +230,7 @@
</item> </item>
<item> <item>
<key> <string>serial</string> </key> <key> <string>serial</string> </key>
<value> <string>952.26028.18168.33945</string> </value> <value> <string>954.24492.61471.3703</string> </value>
</item> </item>
<item> <item>
<key> <string>state</string> </key> <key> <string>state</string> </key>
...@@ -248,7 +248,7 @@ ...@@ -248,7 +248,7 @@
</tuple> </tuple>
<state> <state>
<tuple> <tuple>
<float>1467906142.5</float> <float>1475681076.93</float>
<string>UTC</string> <string>UTC</string>
</tuple> </tuple>
</state> </state>
......
bt5/erp5_web_renderjs_ui/PathTemplateItem/web_page_module/rjs_gadget_erp5_label_field_html.html 0 → 100644
View file @ e9f7d150
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-type" content="text/html; charset=utf-8" />
<meta name="viewport" content="width=device-width, user-scalable=no" />
<title>ERP5 Label Field</title>
<!-- renderjs -->
<script src="rsvp.js" type="text/javascript"></script>
<script src="renderjs.js" type="text/javascript"></script>
<!-- custom script -->
<script src="gadget_erp5_label_field.js" type="text/javascript"></script>
</head>
<body>
<div class="ui-field-contain">
<label> <span></span></label>
<div></div>
</div>
</body>
</html>
\ No newline at end of file
bt5/erp5_web_renderjs_ui/PathTemplateItem/web_page_module/rjs_gadget_erp5_label_field_js.js 0 → 100644
View file @ e9f7d150
/*global window, rJS, RSVP */
/*jslint indent: 2, maxerr: 3 */
(function (window, rJS, RSVP) {
"use strict";
var SCOPE = 'field';
rJS(window)
.setState({
label_text: '',
error_text: '',
label: true
})
.ready(function () {
return this.changeState({
label_element: this.element.querySelector('label'),
label_text_element: this.element.querySelector('label').firstChild,
error_element: this.element.querySelector('span'),
container_element: this.element.querySelector('div')
});
})
.declareMethod('render', function (options) {
var state_dict = {
label_text: options.field_json.title || '',
label: options.label,
field_url: options.field_url,
error_text: options.field_json.error_text || '',
options: options,
scope: options.field_json.key
};
return this.changeState(state_dict);
})
.declareMethod('updateDOM', function (modification_dict) {
var gadget = this;
if (modification_dict.hasOwnProperty('label_text')) {
this.state.label_text_element.textContent = this.state.label_text;
}
this.state.label_element.setAttribute('for', gadget.state.scope);
if (modification_dict.hasOwnProperty('error_text')) {
if (this.state.error_text) {
this.state.error_element.textContent = " (" + this.state.error_text + ")";
} else {
this.state.error_element.textContent = "";
}
}
// Remove/add label_element from DOM
if (modification_dict.hasOwnProperty('label')) {
if (this.state.label === true) {
this.state.container_element.insertBefore(this.state.label_element, this.state.container_element.firstChild);
} else {
this.state.container_element.removeChild(this.state.label_element);
}
}
if (this.state.field_url) {
return new RSVP.Queue()
.push(function () {
if (modification_dict.hasOwnProperty('field_url')) {
return gadget.declareGadget(gadget.state.field_url, {
scope: SCOPE
})
.push(function (field_gadget) {
gadget.state.container_element.removeChild(
gadget.state.container_element.querySelector('div')
);
gadget.state.container_element.appendChild(field_gadget.element);
return field_gadget;
});
}
return gadget.getDeclaredGadget(SCOPE);
})
.push(function (field_gadget) {
return field_gadget.render(gadget.state.options);
});
}
})
.declareMethod("checkValidity", function () {
return this.getDeclaredGadget(SCOPE)
.push(function (gadget) {
// XXX Implement checkValidity on all fields
if (gadget.checkValidity !== undefined) {
return gadget.checkValidity();
}
return true;
});
})
.declareMethod('getContent', function () {
var argument_list = arguments;
return this.getDeclaredGadget(SCOPE)
.push(function (gadget) {
return gadget.getContent.apply(gadget, argument_list);
});
})
.declareMethod('getListboxInfo', function () {
var argument_list = arguments;
return this.getDeclaredGadget(SCOPE)
.push(function (gadget) {
return gadget.getListboxInfo.apply(gadget, argument_list);
});
})
.allowPublicAcquisition("notifyInvalid", function (param_list) {
return this.changeState({error_text: param_list[0]});
})
.allowPublicAcquisition("notifyValid", function () {
return this.changeState({error_text: ''});
});
}(window, rJS, RSVP));
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment
GitLab Nexedi Edition | About GitLab | About Nexedi | 沪ICP备2021021310号-2 | 沪ICP备2021021310号-7