Skip to content

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

erp5_web_renderjs_ui: drop translateHTML usage

parent 2f1bb079
Hide whitespace changes
Inline Side-by-side
Showing with 278 additions and 231 deletions
bt5/erp5_web_renderjs_ui/PathTemplateItem/web_page_module/rjs_gadget_erp5_header_html.html
View file @ 0e5edd42
...@@ -36,6 +36,7 @@ ...@@ -36,6 +36,7 @@
<script src="rsvp.js" type="text/javascript"></script> <script src="rsvp.js" type="text/javascript"></script>
<script src="renderjs.js" type="text/javascript"></script> <script src="renderjs.js" type="text/javascript"></script>
<script src="gadget_global.js" type="text/javascript"></script> <script src="gadget_global.js" type="text/javascript"></script>
<script src="domsugar.js" type="text/javascript"></script>
<!-- custom script --> <!-- custom script -->
<script src="gadget_erp5_header.js" type="text/javascript"></script> <script src="gadget_erp5_header.js" type="text/javascript"></script>
......
bt5/erp5_web_renderjs_ui/PathTemplateItem/web_page_module/rjs_gadget_erp5_header_html.xml
View file @ 0e5edd42
...@@ -152,171 +152,183 @@ ...@@ -152,171 +152,183 @@
</record> </record>
<record id="3" aka="AAAAAAAAAAM="> <record id="3" aka="AAAAAAAAAAM=">
<pickle> <pickle>
<global name="WorkflowHistoryList" module="Products.ERP5Type.patches.WorkflowTool"/> <global name="WorkflowHistoryList" module="Products.ERP5Type.Workflow"/>
</pickle> </pickle>
<pickle> <pickle>
<tuple> <dictionary>
<none/> <item>
<list> <key> <string>_log</string> </key>
<dictionary> <value>
<item> <list>
<key> <string>action</string> </key> <dictionary>
<value> <string>publish_alive</string> </value> <item>
</item> <key> <string>action</string> </key>
<item> <value> <string>publish_alive</string> </value>
<key> <string>actor</string> </key> </item>
<value> <string>romain</string> </value> <item>
</item> <key> <string>actor</string> </key>
<item> <value> <string>romain</string> </value>
<key> <string>comment</string> </key> </item>
<value> <string></string> </value> <item>
</item> <key> <string>comment</string> </key>
<item> <value> <string></string> </value>
<key> <string>error_message</string> </key> </item>
<value> <string></string> </value> <item>
</item> <key> <string>error_message</string> </key>
<item> <value> <string></string> </value>
<key> <string>time</string> </key> </item>
<value> <item>
<object> <key> <string>time</string> </key>
<klass> <value>
<global name="DateTime" module="DateTime.DateTime"/> <object>
</klass> <klass>
<tuple> <global name="DateTime" module="DateTime.DateTime"/>
<none/> </klass>
</tuple> <tuple>
<state> <none/>
<tuple> </tuple>
<float>1411375779.88</float> <state>
<string>GMT</string> <tuple>
</tuple> <float>1411375779.88</float>
</state> <string>GMT</string>
</object> </tuple>
</value> </state>
</item> </object>
<item> </value>
<key> <string>validation_state</string> </key> </item>
<value> <string>published_alive</string> </value> <item>
</item> <key> <string>validation_state</string> </key>
</dictionary> <value> <string>published_alive</string> </value>
</list> </item>
</tuple> </dictionary>
</list>
</value>
</item>
</dictionary>
</pickle> </pickle>
</record> </record>
<record id="4" aka="AAAAAAAAAAQ="> <record id="4" aka="AAAAAAAAAAQ=">
<pickle> <pickle>
<global name="WorkflowHistoryList" module="Products.ERP5Type.patches.WorkflowTool"/> <global name="WorkflowHistoryList" module="Products.ERP5Type.Workflow"/>
</pickle> </pickle>
<pickle> <pickle>
<tuple> <dictionary>
<none/> <item>
<list> <key> <string>_log</string> </key>
<dictionary> <value>
<item> <list>
<key> <string>action</string> </key> <dictionary>
<value> <string>edit</string> </value> <item>
</item> <key> <string>action</string> </key>
<item> <value> <string>edit</string> </value>
<key> <string>actor</string> </key> </item>
<value> <string>zope</string> </value> <item>
</item> <key> <string>actor</string> </key>
<item> <value> <string>zope</string> </value>
<key> <string>comment</string> </key> </item>
<value> <item>
<none/> <key> <string>comment</string> </key>
</value> <value>
</item> <none/>
<item> </value>
<key> <string>error_message</string> </key> </item>
<value> <string></string> </value> <item>
</item> <key> <string>error_message</string> </key>
<item> <value> <string></string> </value>
<key> <string>serial</string> </key> </item>
<value> <string>971.18968.42363.15974</string> </value> <item>
</item> <key> <string>serial</string> </key>
<item> <value> <string>982.18030.39356.30993</string> </value>
<key> <string>state</string> </key> </item>
<value> <string>current</string> </value> <item>
</item> <key> <string>state</string> </key>
<item> <value> <string>current</string> </value>
<key> <string>time</string> </key> </item>
<value> <item>
<object> <key> <string>time</string> </key>
<klass> <value>
<global name="DateTime" module="DateTime.DateTime"/> <object>
</klass> <klass>
<tuple> <global name="DateTime" module="DateTime.DateTime"/>
<none/> </klass>
</tuple> <tuple>
<state> <none/>
<tuple> </tuple>
<float>1540898036.46</float> <state>
<string>UTC</string> <tuple>
</tuple> <float>1583231026.08</float>
</state> <string>UTC</string>
</object> </tuple>
</value> </state>
</item> </object>
</dictionary> </value>
</list> </item>
</tuple> </dictionary>
</list>
</value>
</item>
</dictionary>
</pickle> </pickle>
</record> </record>
<record id="5" aka="AAAAAAAAAAU="> <record id="5" aka="AAAAAAAAAAU=">
<pickle> <pickle>
<global name="WorkflowHistoryList" module="Products.ERP5Type.patches.WorkflowTool"/> <global name="WorkflowHistoryList" module="Products.ERP5Type.Workflow"/>
</pickle> </pickle>
<pickle> <pickle>
<tuple> <dictionary>
<none/> <item>
<list> <key> <string>_log</string> </key>
<dictionary> <value>
<item> <list>
<key> <string>action</string> </key> <dictionary>
<value> <string>detect_converted_file</string> </value> <item>
</item> <key> <string>action</string> </key>
<item> <value> <string>detect_converted_file</string> </value>
<key> <string>actor</string> </key> </item>
<value> <string>romain</string> </value> <item>
</item> <key> <string>actor</string> </key>
<item> <value> <string>romain</string> </value>
<key> <string>comment</string> </key> </item>
<value> <string></string> </value> <item>
</item> <key> <string>comment</string> </key>
<item> <value> <string></string> </value>
<key> <string>error_message</string> </key> </item>
<value> <string></string> </value> <item>
</item> <key> <string>error_message</string> </key>
<item> <value> <string></string> </value>
<key> <string>external_processing_state</string> </key> </item>
<value> <string>converted</string> </value> <item>
</item> <key> <string>external_processing_state</string> </key>
<item> <value> <string>converted</string> </value>
<key> <string>serial</string> </key> </item>
<value> <string>0.0.0.0</string> </value> <item>
</item> <key> <string>serial</string> </key>
<item> <value> <string>0.0.0.0</string> </value>
<key> <string>time</string> </key> </item>
<value> <item>
<object> <key> <string>time</string> </key>
<klass> <value>
<global name="DateTime" module="DateTime.DateTime"/> <object>
</klass> <klass>
<tuple> <global name="DateTime" module="DateTime.DateTime"/>
<none/> </klass>
</tuple> <tuple>
<state> <none/>
<tuple> </tuple>
<float>1411375660.35</float> <state>
<string>GMT</string> <tuple>
</tuple> <float>1411375660.35</float>
</state> <string>GMT</string>
</object> </tuple>
</value> </state>
</item> </object>
</dictionary> </value>
</list> </item>
</tuple> </dictionary>
</list>
</value>
</item>
</dictionary>
</pickle> </pickle>
</record> </record>
</ZopeData> </ZopeData>
bt5/erp5_web_renderjs_ui/PathTemplateItem/web_page_module/rjs_gadget_erp5_header_js.js
View file @ 0e5edd42
/*jslint nomen: true, indent: 2, maxerr: 3 */ /*jslint nomen: true, indent: 2, maxerr: 3 */
/*global window, rJS, document, RSVP */ /*global window, rJS, document, RSVP, domsugar */
(function (window, rJS, document, RSVP) { (function (window, rJS, document, RSVP, domsugar) {
"use strict"; "use strict";
var possible_left_button_list = [ var possible_left_button_list = [
...@@ -39,36 +39,47 @@ ...@@ -39,36 +39,47 @@
['upload_url', 'Upload', 'upload'], ['upload_url', 'Upload', 'upload'],
['download_url', 'Download', 'download'] ['download_url', 'Download', 'download']
], ],
header_button_template = function (data) { promiseHeaderButton = function (gadget, data) {
// <form><button name='{{name}}' data-i18n="{{title}}" type='submit' class='ui-icon-{{icon}} ui-btn-icon-left {{class}}'>{{title}}</button></form> return gadget.translate(data.title)
var form_element = document.createElement('form'), .push(function (result) {
button_element = document.createElement('button'); return domsugar('form', [
domsugar('button', {
button_element.setAttribute('name', data.name); name: data.name,
button_element.setAttribute('data-i18n', data.title); text: result,
button_element.setAttribute('type', 'submit'); type: 'submit',
button_element.setAttribute('class', 'ui-icon-' + data.icon + ' ui-btn-icon-left ' + data.class); 'class': 'ui-icon-' + data.icon + ' ui-btn-icon-left ' +
form_element.appendChild(button_element); data.class
return form_element.outerHTML; })
]);
});
}, },
sub_header_template = function (data) {
promiseSubHeader = function (gadget, data) {
// {{#each sub_header_list}} // {{#each sub_header_list}}
// <li><a href="{{url}}" data-i18n="{{title}}" class="ui-btn-icon-top ui-icon-{{icon}} {{class}}">{{title}}</a></li> // <li><a href="{{url}}" data-i18n="{{title}}" class="ui-btn-icon-top ui-icon-{{icon}} {{class}}">{{title}}</a></li>
// {{/each}} // {{/each}}
var fragment = document.createElement('div'), var i,
li_element, translation_list = [];
a_element,
i;
for (i = 0; i < data.sub_header_list.length; i += 1) { for (i = 0; i < data.sub_header_list.length; i += 1) {
li_element = document.createElement('li'); translation_list.push(data.sub_header_list[i].title);
a_element = document.createElement('a');
a_element.setAttribute('href', data.sub_header_list[i].url);
a_element.setAttribute('data-i18n', data.sub_header_list[i].title);
a_element.setAttribute('class', 'ui-btn-icon-top ui-icon-' + data.sub_header_list[i].icon + ' ' + data.sub_header_list[i].class);
li_element.appendChild(a_element);
fragment.appendChild(li_element);
} }
return fragment.innerHTML; return gadget.getTranslationList(translation_list)
.push(function (result_list) {
var dom_list = [];
for (i = 0; i < data.sub_header_list.length; i += 1) {
dom_list.push(domsugar('li', [
domsugar('a', {
text: result_list[i],
href: data.sub_header_list[i].url,
'class': 'ui-btn-icon-top ui-icon-' +
data.sub_header_list[i].icon + ' ' +
data.sub_header_list[i].class
})
]));
}
return domsugar(null, dom_list);
});
}; };
rJS(window) rJS(window)
...@@ -81,25 +92,12 @@ ...@@ -81,25 +92,12 @@
title_icon: undefined, title_icon: undefined,
title_url: undefined title_url: undefined
}) })
/////////////////////////////////////////////////////////////////
// ready
/////////////////////////////////////////////////////////////////
// Init local properties
.ready(function ready() {
this.props = {
element_list: [
this.element.querySelector("h1"),
this.element.querySelector(".ui-btn-left > div"),
this.element.querySelector(".ui-btn-right > div"),
this.element.querySelector(".ui-subheader").querySelector("ul")
]
};
})
////////////////////////////////////////////// //////////////////////////////////////////////
// acquired methods // acquired methods
////////////////////////////////////////////// //////////////////////////////////////////////
.declareAcquiredMethod("translateHtml", "translateHtml") .declareAcquiredMethod("translate", "translate")
.declareAcquiredMethod("getTranslationList", "getTranslationList")
.declareAcquiredMethod("triggerSubmit", "triggerSubmit") .declareAcquiredMethod("triggerSubmit", "triggerSubmit")
.declareAcquiredMethod("triggerPanel", "triggerPanel") .declareAcquiredMethod("triggerPanel", "triggerPanel")
.declareAcquiredMethod("triggerMaximize", "triggerMaximize") .declareAcquiredMethod("triggerMaximize", "triggerMaximize")
...@@ -250,9 +248,7 @@ ...@@ -250,9 +248,7 @@
default_title_icon = "", default_title_icon = "",
default_right_icon = "", default_right_icon = "",
title_link, title_link,
title_button, promise_list = [];
promise_list = [],
tmp_element;
// Main title // Main title
if (modification_dict.hasOwnProperty('error') || if (modification_dict.hasOwnProperty('error') ||
modification_dict.hasOwnProperty('loaded') || modification_dict.hasOwnProperty('loaded') ||
...@@ -273,35 +269,46 @@ ...@@ -273,35 +269,46 @@
// Be careful, this is CPU costly // Be careful, this is CPU costly
document.title = gadget.state.title_text; document.title = gadget.state.title_text;
} }
// H1
title_link = { title_link = {
title: gadget.state.title_text, title: gadget.state.title_text,
icon: default_title_icon || gadget.state.title_icon, icon: default_title_icon || gadget.state.title_icon,
url: gadget.state.title_url url: gadget.state.title_url
}; };
if (gadget.state.title_button_name) { if (gadget.state.title_button_name) {
title_button = { promise_list.push(promiseHeaderButton(gadget, {
title: gadget.state.title_text, title: gadget.state.title_text,
icon: default_title_icon || gadget.state.title_button_icon, icon: default_title_icon || gadget.state.title_button_icon,
name: gadget.state.title_button_name name: gadget.state.title_button_name
}; }));
promise_list.push(gadget.translateHtml(header_button_template(title_button)));
} else if (title_link.url === undefined) { } else if (title_link.url === undefined) {
// <span data-i18n="{{title}}" class="ui-btn-icon-left ui-icon-{{icon}}" >{{title}}</span> // <span data-i18n="{{title}}" class="ui-btn-icon-left ui-icon-{{icon}}" >{{title}}</span>
tmp_element = document.createElement('span'); promise_list.push(
tmp_element.setAttribute('data-i18n', title_link.title); gadget.translate(title_link.title)
tmp_element.setAttribute('class', 'ui-btn-icon-left ui-icon-' + title_link.icon); .push(function (result) {
promise_list.push(gadget.translateHtml(tmp_element.outerHTML)); return domsugar('span', {
'class': 'ui-btn-icon-left ui-icon-' + title_link.icon,
text: result
});
})
);
} else { } else {
// <a data-i18n="{{title}}" class="ui-btn-icon-left ui-icon-{{icon}}" href="{{url}}" accesskey="u">{{title}}</a> // <a data-i18n="{{title}}" class="ui-btn-icon-left ui-icon-{{icon}}" href="{{url}}" accesskey="u">{{title}}</a>
tmp_element = document.createElement('a'); promise_list.push(
tmp_element.setAttribute('data-i18n', title_link.title); gadget.translate(title_link.title)
tmp_element.setAttribute('class', 'ui-btn-icon-left ui-icon-' + title_link.icon); .push(function (result) {
tmp_element.setAttribute('href', title_link.url); return domsugar('a', {
tmp_element.setAttribute('accesskey', 'u'); 'class': 'ui-btn-icon-left ui-icon-' + title_link.icon,
promise_list.push(gadget.translateHtml(tmp_element.outerHTML)); 'href': title_link.url,
'accesskey': 'u',
text: result
});
})
);
} }
} else { } else {
promise_list.push(null); promise_list.push(gadget.element.querySelector("h1"));
} }
// Left button // Left button
...@@ -311,14 +318,14 @@ ...@@ -311,14 +318,14 @@
if (gadget.state.left_button_title === undefined) { if (gadget.state.left_button_title === undefined) {
promise_list.push(""); promise_list.push("");
} else { } else {
promise_list.push(gadget.translateHtml(header_button_template({ promise_list.push(promiseHeaderButton(gadget, {
title: gadget.state.left_button_title, title: gadget.state.left_button_title,
icon: gadget.state.left_button_icon, icon: gadget.state.left_button_icon,
name: gadget.state.left_button_name name: gadget.state.left_button_name
}))); }));
} }
} else { } else {
promise_list.push(null); promise_list.push(gadget.element.querySelector(".ui-btn-left > div"));
} }
// Handle right link // Handle right link
...@@ -354,38 +361,65 @@ ...@@ -354,38 +361,65 @@
} }
if (right_button !== undefined) { if (right_button !== undefined) {
promise_list.push(gadget.translateHtml(header_button_template(right_button))); promise_list.push(promiseHeaderButton(gadget, right_button));
} else if (right_link !== undefined) { } else if (right_link !== undefined) {
// <a data-i18n="{{title}}" href="{{url}}" class="ui-icon-{{icon}} ui-btn-icon-left {{class}}">{{title}}</a> // <a data-i18n="{{title}}" href="{{url}}" class="ui-icon-{{icon}} ui-btn-icon-left {{class}}">{{title}}</a>
tmp_element = document.createElement('a'); promise_list.push(
tmp_element.setAttribute('data-i18n', right_link.title); gadget.translate(right_link.title)
tmp_element.setAttribute('class', 'ui-icon-' + right_link.icon + ' ui-btn-icon-left ' + right_link.class); .push(function (result) {
tmp_element.setAttribute('href', right_link.url); return domsugar('a', {
promise_list.push(gadget.translateHtml(tmp_element.outerHTML)); text: result,
'class': 'ui-icon-' + right_link.icon + ' ui-btn-icon-left ' +
right_link.class,
href: right_link.url
});
})
);
} else { } else {
promise_list.push(""); promise_list.push("");
} }
} else { } else {
promise_list.push(null); promise_list.push(gadget.element.querySelector(".ui-btn-right > div"));
} }
// Handle sub header // Handle sub header
if (modification_dict.hasOwnProperty('sub_header_list')) { if (modification_dict.hasOwnProperty('sub_header_list')) {
promise_list.push(gadget.translateHtml(sub_header_template({ promise_list.push(promiseSubHeader(gadget, {
sub_header_list: gadget.state.sub_header_list sub_header_list: gadget.state.sub_header_list
}))); }));
} else { } else {
promise_list.push(null); promise_list.push(gadget.element.querySelector(".ui-subheader")
.querySelector("ul"));
} }
return new RSVP.Queue(RSVP.all(promise_list)) return new RSVP.Queue(RSVP.all(promise_list))
.push(function (result_list) { .push(function (result_list) {
var j; domsugar(gadget.element, [
for (j = 0; j < result_list.length; j += 1) { domsugar('div', {'data-role': 'header', class: 'ui-header'}, [
if (result_list[j] !== null) {
gadget.props.element_list[j].innerHTML = result_list[j]; // Left button
} domsugar('div', {class: 'ui-btn-left'}, [
} domsugar('div', {class: 'ui-controlgroup-controls'}, [
result_list[1]
])
]),
// H1
domsugar('h1', [result_list[0]]),
// Right button
domsugar('div', {class: 'ui-btn-right'}, [
domsugar('div', {class: 'ui-controlgroup-controls'}, [
result_list[2]
])
]),
// Subheader
domsugar('div', {class: 'ui-subheader'}, [
domsugar('ul', [result_list[3]])
])
])
]);
}); });
}) })
...@@ -406,4 +440,4 @@ ...@@ -406,4 +440,4 @@
throw new Error("Unsupported button " + name); throw new Error("Unsupported button " + name);
}); });
}(window, rJS, document, RSVP)); }(window, rJS, document, RSVP, domsugar));
\ No newline at end of file \ No newline at end of file
bt5/erp5_web_renderjs_ui/PathTemplateItem/web_page_module/rjs_gadget_erp5_header_js.xml
View file @ 0e5edd42
...@@ -240,7 +240,7 @@ ...@@ -240,7 +240,7 @@
</item> </item>
<item> <item>
<key> <string>serial</string> </key> <key> <string>serial</string> </key>
<value> <string>982.16970.11028.17066</string> </value> <value> <string>982.18038.52896.46933</string> </value>
</item> </item>
<item> <item>
<key> <string>state</string> </key> <key> <string>state</string> </key>
...@@ -258,7 +258,7 @@ ...@@ -258,7 +258,7 @@
</tuple> </tuple>
<state> <state>
<tuple> <tuple>
<float>1583167358.84</float> <float>1583231569.7</float>
<string>UTC</string> <string>UTC</string>
</tuple> </tuple>
</state> </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
GitLab Nexedi Edition | About GitLab | About Nexedi | 沪ICP备2021021310号-2 | 沪ICP备2021021310号-7