Commit 95dace31 authored by Tomáš Peterka's avatar Tomáš Peterka

[renderjs_ui] WIP formbox

parent 91ff428e
<!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 Stringfield</title>
<!-- renderjs -->
<script src="rsvp.js" type="text/javascript"></script>
<script src="renderjs.js" type="text/javascript"></script>
<!-- custom script -->
<script src="gadget_erp5_field_formbox.js" type="text/javascript"></script>
</head>
<body>
</body>
</html>
\ No newline at end of file
/*global window, rJS, RSVP, URI */
/*jslint nomen: true, indent: 2, maxerr: 3 */
(function (window, rJS, RSVP, URI) {
"use strict";
rJS(window)
.setState({
subgadget_template: null
})
.declareAcquiredMethod("jio_getAttachment", "jio_getAttachment")
.declareMethod('render', function (options) {
var element = this.element,
gadget = this,
field_json = options.field_json || {},
new_state = {
value: field_json.value || field_json.default || "",
text_content: field_json.value || field_json.default || "",
editable: field_json.editable,
required: field_json.required,
name: field_json.key,
title: field_json.title,
hidden: field_json.hidden,
view: field_json.view,
jio_key: field_json.jio_key,
erp5_form: field_json.erp5_form // form spec obtained from HATEOAS
};
if (gadget.state.subgadget_template === null || options.reset === true) {
// render subgadget only when there is none OR render is explicitely requested
return this.declareGadget('gadget_erp5_page_form.html', {scope: 'sub'})
.push(function (form_gadget) {
// Clear first to DOM, append after to reduce flickering/manip
while (element.firstChild) {
element.removeChild(element.firstChild);
}
element.appendChild(form_gadget.element);
// Add newly created subgadget to the state
new_state.subgadget_template = 'gadget_erp5_page_form.html';
return gadget.changeState(new_state);
});
}
return gadget.changeState(new_state);
})
.onStateChange(function (modification_dict) {
var gadget = this,
form_options = gadget.state.erp5_form,
erp5_document_uri = new URI(form_options._links.traversed_document.href);
form_options.view = gadget.state.view;
form_options.jio_jey = erp5_document_uri.segment(2);
// XXX: can be uncommented - dunno if it is needed
// if `editable` changes - force reloading of the gadget
// if (modification_dict.hasOwnProperty('editable')) {
// return gadget.render({reset: true});
// }
// XXX: should not be uncommented
// if FormBox's form document is different from parent form's document
// we have to force the subgadget to get the correct document
// if (gadget.state.jio_key === form_options.jio_jey) {
// form_options.erp5_document = gadget.state.erp5_document;
// }
// do not preserve objects in the state
// delete gadget.state.erp5_document;
return gadget.getDeclaredGadget('sub')
.push(function (subgadget) {
subgadget.render(form_options);
});
})
.declareMethod('getContent', function () {
if (this.state.editable) {
return this.getDeclaredGadget('sub')
.push(function (gadget) {
return gadget.getContent();
});
}
return {};
})
.declareMethod('checkValidity', function () {
if (this.state.editable) {
return this.getDeclaredGadget('sub')
.push(function (gadget) {
return gadget.checkValidity();
});
}
return true;
});
}(window, rJS, RSVP, URI));
\ No newline at end of file
......@@ -47,6 +47,8 @@
field_url = 'gadget_erp5_field_image.html';
} else if (type === 'EmailField') {
field_url = 'gadget_erp5_field_email.html';
} else if (type === 'FormBox') {
field_url = 'gadget_erp5_field_formbox.html';
}
return field_url;
}
......@@ -57,8 +59,8 @@
// Field is enabled in this context
var sandbox = "public",
field_element = document.createElement("div"),
renderered_field = rendered_form[field[0]],
// suboptions = options[renderered_field.key] || suboption_dict;
rendered_field = rendered_form[field[0]],
// suboptions = options[rendered_field.key] || suboption_dict;
suboptions = {};
// XXX Hardcoded for searchfield - remove later!
......@@ -68,10 +70,12 @@
// XXX Hardcoded for listbox's hide functionality
suboptions.hide_enabled = form_definition.hide_enabled;
suboptions.field_url = getFieldTypeGadgetUrl(renderered_field.type);
suboptions.field_url = getFieldTypeGadgetUrl(rendered_field.type);
suboptions.label = false;
suboptions.field_json = renderered_field;
suboptions.field_json = rendered_field;
suboptions.field_json.view = form_gadget.state.view;
suboptions.field_json.jio_key = form_gadget.state.jio_key;
suboptions.field_json.erp5_document = form_gadget.state.erp5_document;
if (group[0] !== "bottom") {
suboptions.label = true;
......@@ -81,12 +85,12 @@
.push(function () {
if (modification_dict.hasOwnProperty('hash')) {
return form_gadget.declareGadget('gadget_erp5_label_field.html', {
scope: renderered_field.key,
scope: rendered_field.key,
element: field_element,
sandbox: sandbox
});
}
return form_gadget.getDeclaredGadget(renderered_field.key);
return form_gadget.getDeclaredGadget(rendered_field.key);
})
.push(function (label_gadget) {
if (modification_dict.hasOwnProperty('hash')) {
......@@ -175,6 +179,7 @@
return this.changeState({
erp5_document: options.erp5_document,
form_definition: options.form_definition,
jio_key: options.jio_key,
hash: hash,
view: options.view
});
......
......@@ -230,7 +230,7 @@
</item>
<item>
<key> <string>serial</string> </key>
<value> <string>955.49459.46929.49339</string> </value>
<value> <string>961.9083.63657.29132</string> </value>
</item>
<item>
<key> <string>state</string> </key>
......@@ -248,7 +248,7 @@
</tuple>
<state>
<tuple>
<float>1480936090.54</float>
<float>1501679999.16</float>
<string>UTC</string>
</tuple>
</state>
......
......@@ -88,7 +88,7 @@
.declareMethod('render', function (options) {
var state_dict = {
id: options.jio_key,
jio_key: options.jio_key,
view: options.view,
editable: options.editable,
erp5_document: options.erp5_document,
......@@ -158,6 +158,8 @@
form_options.erp5_document = form_gadget.state.erp5_document;
form_options.form_definition = form_gadget.state.form_definition;
form_options.view = form_gadget.state.view;
form_options.jio_key = form_gadget.state.jio_key;
return erp5_form.render(form_options);
})
.push(function () {
......@@ -217,7 +219,7 @@
}
return form_gadget.jio_putAttachment(
form_gadget.state.id,
form_gadget.state.jio_key,
action.href,
data
);
......@@ -267,7 +269,7 @@
form_gadget.deferRevokeObjectUrlWithLink(object_url, a);
} else {
jio_key = new URI(location).segment(2);
if (form_gadget.state.id === jio_key) {
if (form_gadget.state.jio_key === jio_key) {
// Do not update navigation history if dialog redirect to the same document
list.push(form_gadget.redirect({command: 'change', options: {jio_key: jio_key, view: "view", page: undefined, editable: form_gadget.state.editable}}));
} else {
......
......@@ -230,7 +230,7 @@
</item>
<item>
<key> <string>serial</string> </key>
<value> <string>961.657.32982.5239</string> </value>
<value> <string>961.7890.60472.26811</string> </value>
</item>
<item>
<key> <string>state</string> </key>
......@@ -248,7 +248,7 @@
</tuple>
<state>
<tuple>
<float>1501168424.28</float>
<float>1501602552.87</float>
<string>UTC</string>
</tuple>
</state>
......
......@@ -21,7 +21,7 @@
return gadget.getUrlParameter('extended_search')
.push(function (extended_search) {
var state_dict = {
id: options.jio_key,
jio_key: options.jio_key,
view: options.view,
editable: options.editable,
erp5_document: options.erp5_document,
......@@ -44,6 +44,7 @@
form_options.erp5_document = form_gadget.state.erp5_document;
form_options.form_definition = form_gadget.state.form_definition;
form_options.view = form_gadget.state.view;
form_options.jio_key = form_gadget.state.jio_key;
// XXX Hardcoded for listbox's hide functionality
form_options.form_definition.hide_enabled = true;
......
......@@ -230,7 +230,7 @@
</item>
<item>
<key> <string>serial</string> </key>
<value> <string>954.34605.28227.45721</string> </value>
<value> <string>960.5523.58984.43537</string> </value>
</item>
<item>
<key> <string>state</string> </key>
......@@ -248,7 +248,7 @@
</tuple>
<state>
<tuple>
<float>1476198578.1</float>
<float>1501602470.2</float>
<string>UTC</string>
</tuple>
</state>
......
......@@ -25,7 +25,7 @@
.declareMethod('render', function (options) {
var state_dict = {
id: options.jio_key,
jio_key: options.jio_key,
view: options.view,
editable: options.editable,
erp5_document: options.erp5_document,
......@@ -55,6 +55,7 @@
form_options.erp5_document = form_gadget.state.erp5_document;
form_options.form_definition = form_gadget.state.form_definition;
form_options.view = form_gadget.state.view;
form_options.jio_key = form_gadget.state.jio_key
return erp5_form.render(form_options);
})
......@@ -129,7 +130,7 @@
return RSVP.all([
form_gadget.notifySubmitting(),
form_gadget.jio_putAttachment(
form_gadget.state.id,
form_gadget.state.jio_key,
action.href,
data
)
......
......@@ -230,7 +230,7 @@
</item>
<item>
<key> <string>serial</string> </key>
<value> <string>960.32739.63971.65297</string> </value>
<value> <string>961.7890.7169.33672</string> </value>
</item>
<item>
<key> <string>state</string> </key>
......@@ -248,7 +248,7 @@
</tuple>
<state>
<tuple>
<float>1499430902.76</float>
<float>1501604413.95</float>
<string>UTC</string>
</tuple>
</state>
......
/*global window, rJS */
/*jslint nomen: true, indent: 2, maxerr: 3 */
(function (window, rJS) {
"use strict";
rJS(window)
.declareMethod('render', function (options) {
var state_dict = {
id: options.jio_key,
view: options.view,
editable: options.editable,
erp5_document: options.erp5_document,
form_definition: options.form_definition,
erp5_form: options.erp5_form || {},
new_content_action: false,
delete_action: false,
save_action: false
};
return this.changeState(state_dict);
})
.onStateChange(function () {
var form_gadget = this;
// render the erp5 form
return form_gadget.getDeclaredGadget("erp5_form")
.push(function (erp5_form) {
var form_options = form_gadget.state.erp5_form;
form_options.erp5_document = form_gadget.state.erp5_document;
form_options.form_definition = form_gadget.state.form_definition;
form_options.view = form_gadget.state.view;
return erp5_form.render(form_options);
})
});
}(window, rJS));
\ No newline at end of file
<!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 PT Form View</title>
<!-- renderjs -->
<script src="rsvp.js" type="text/javascript"></script>
<script src="renderjs.js" type="text/javascript"></script>
<!-- custom script -->
<script src="gadget_erp5_global.js" type="text/javascript"></script>
<script src="gadget_erp5_pt_embedded_form_render.js" type="text/javascript"></script>
</head>
<body>
<div class="ui-body-c">
<div data-gadget-url="gadget_erp5_form.html"
data-gadget-scope="erp5_form"
data-gadget-sandbox="public">
</div>
</div>
</body>
</html>
\ No newline at end of file
......@@ -15,7 +15,7 @@
/////////////////////////////////////////////////////////////////
.declareMethod('render', function (options) {
var state_dict = {
id: options.jio_key,
jio_key: options.jio_key,
view: options.view,
editable: options.editable,
erp5_document: options.erp5_document,
......@@ -52,6 +52,7 @@
form_options.erp5_document = gadget.state.erp5_document;
form_options.form_definition = gadget.state.form_definition;
form_options.view = gadget.state.view;
form_options.jio_key = gadget.state.jio_key;
return erp5_form.render(form_options);
})
......
......@@ -230,7 +230,7 @@
</item>
<item>
<key> <string>serial</string> </key>
<value> <string>954.5630.32927.153</string> </value>
<value> <string>960.5523.58984.43537</string> </value>
</item>
<item>
<key> <string>state</string> </key>
......@@ -248,7 +248,7 @@
</tuple>
<state>
<tuple>
<float>1476194151.17</float>
<float>1501602183.01</float>
<string>UTC</string>
</tuple>
</state>
......
/*global window, rJS, URI */
/*global window, rJS, URI, RSVP */
/*jslint nomen: true, indent: 2, maxerr: 3 */
(function (window, rJS, URI) {
(function (window, rJS, URI, RSVP) {
"use strict";
function loadFormContent(gadget, result) {
......@@ -53,47 +53,72 @@
});
})
.declareMethod("render", function (options) {
var gadget = this;
return gadget.jio_getAttachment(options.jio_key, options.view)
.push(function (result) {
var uri;
if (!result._embedded) {
return gadget.jio_getAttachment(options.jio_key, "links")
.push(function (result2) {
return gadget.redirect({command: 'change', options: {
view: result2._links.view[0].href,
page: undefined
}});
});
}
var gadget = this,
promise_queue = new RSVP.Queue(),
new_state = {
jio_key: options.jio_key,
options: options,
view: options.view,
};
if (options.hasOwnProperty('erp5_document')) {
// if we get erp5 document during rendering then no need to fetch it
new_state.erp5_document = options.erp5_document;
} else {
promise_queue
.push(function () {
return gadget.jio_getAttachment(options.jio_key, options.view);
})
.push(function (result) {
new_state.erp5_document = result;
uri = new URI(result._embedded._view._links.form_definition.href);
return gadget.jio_getAttachment(uri.segment(2), "view")
.push(function (erp5_form) {
var url = "gadget_erp5_pt_" + erp5_form.pt;
// XXX Hardcoded specific behaviour for form_view
if ((options.editable !== undefined) && (erp5_form.pt === "form_view")) {
url += "_editable";
}
url += ".html";
if (!result._embedded) {
return gadget.jio_getAttachment(options.jio_key, "links")
.push(function (result2) {
return gadget.redirect({command: 'change', options: {
view: result2._links.view[0].href,
page: undefined
}});
});
}
});
}
return promise_queue
.push(function () {
var uri = new URI(new_state.erp5_document._embedded._view._links.form_definition.href);
if (new_state.options !== undefined &&
new_state.options.hasOwnProperty('_links') &&
new_state.options._links.form_definition !== undefined) {
uri = new URI(new_state.options._links.form_definition.href);
}
return gadget.jio_getAttachment(uri.segment(2), "view");
})
.push(function (erp5_form) {
var url = "gadget_erp5_pt_" + erp5_form.pt;
// XXX Hardcoded specific behaviour for form_view
if ((options.editable !== undefined) && (erp5_form.pt === "form_view")) {
url += "_editable";
}
url += ".html";
new_state.url = url;
new_state.erp5_form = JSON.stringify(erp5_form);
return gadget.changeState({
jio_key: options.jio_key,
options: options,
view: options.view,
url: url,
erp5_document: JSON.stringify(result),
erp5_form: JSON.stringify(erp5_form)
});
});
new_state.erp5_document = JSON.stringify(new_state.erp5_document);
return gadget.changeState(new_state);
});
})
.onStateChange(function (modification_dict) {
var queue,
gadget = this,
options = this.state.options,
page_template_gadget,
clean_dom = modification_dict.hasOwnProperty('url');
clean_dom = modification_dict.hasOwnProperty('url'),
erp5_document = JSON.parse(gadget.state.erp5_document),
erp5_form = JSON.parse(gadget.state.erp5_form);
if (clean_dom) {
queue = gadget.declareGadget(gadget.state.url, {scope: "fg"});
} else {
......@@ -103,9 +128,7 @@
.push(function (result) {
page_template_gadget = result;
var sub_options = options.fg || {},
erp5_document = JSON.parse(gadget.state.erp5_document),
erp5_form = JSON.parse(gadget.state.erp5_form);
var sub_options = options.fg || {};
loadFormContent(gadget, erp5_document._embedded._view);
......@@ -117,7 +140,6 @@
sub_options.editable = options.editable;
return page_template_gadget.render(sub_options);
})
.push(function () {
if (clean_dom) {
......@@ -138,7 +160,7 @@
if (/^[^\/]+_module\/.+$/.test(jio_key)) {
/*jslint regexp: false*/
return gadget.updatePanel({
erp5_document: JSON.parse(gadget.state.erp5_document),
erp5_document: erp5_document,
editable: gadget.state.options.editable
});
}
......@@ -153,4 +175,4 @@
return this.changeState({erp5_document: JSON.stringify(erp5_document)});
});
}(window, rJS, URI));
\ No newline at end of file
}(window, rJS, URI, RSVP));
\ No newline at end of file
......@@ -230,7 +230,7 @@
</item>
<item>
<key> <string>serial</string> </key>
<value> <string>958.28347.56387.25600</string> </value>
<value> <string>961.9132.11809.49510</string> </value>
</item>
<item>
<key> <string>state</string> </key>
......@@ -248,7 +248,7 @@
</tuple>
<state>
<tuple>
<float>1491391860.07</float>
<float>1501679227.36</float>
<string>UTC</string>
</tuple>
</state>
......
......@@ -41,7 +41,7 @@
<!--li class="ui-autocomplete ui-li ui-li-divider ui-bar-inherit ui-first-child" role="heading">No result</li-->
{{#each type}}
<li class="ui-li-static ui-body-inherit ui-bar-inherit ui-icon-plus ui-btn-icon-right" data-i18n="Create New" data-create-object="{{value}}" name="{{name}}">Create New
<span data-create-object="{{value}}">{{name}}: {{../value}}</span></li>
<span data-create-object="{{value}}"> {{name}}: {{../value}}</span></li>
{{/each}}
{{/if}}
<li class="ui-li-static ui-body-inherit ui-last-child ui-bar-inherit ui-icon-search ui-btn-icon-right" data-explore=true data-i18n="Explore the Search Result List" >Explore the Search Result List</li>
......
......@@ -234,7 +234,7 @@
</item>
<item>
<key> <string>serial</string> </key>
<value> <string>956.58742.58866.48708</string> </value>
<value> <string>960.5523.58984.43537</string> </value>
</item>
<item>
<key> <string>state</string> </key>
......@@ -252,7 +252,7 @@
</tuple>
<state>
<tuple>
<float>1490623129.84</float>
<float>1501248770.95</float>
<string>UTC</string>
</tuple>
</state>
......
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