Commit 0e5edd42 authored by Romain Courteaud's avatar Romain Courteaud

erp5_web_renderjs_ui: drop translateHTML usage

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