Skip to content

E
ecommerce-ui
Commit 050b7fcc authored by Sven Franck's avatar Sven Franck
Browse files
Options

js: updated listview to new mapping

parent a80beb88
Hide whitespace changes
Inline Side-by-side
Showing with 68 additions and 193 deletions
js/erp5_loader.js
View file @ 050b7fcc
......@@ -1751,7 +1751,6 @@
* "divider_theme": "slapos-white",
* "autodividers": true,
* "count_theme": "slapos-white",
* "ribbon": null
* },
* "children": [
* {
......@@ -1762,54 +1761,53 @@
* "icon": "foo"/null,
* "title": null,
* "title_i18n":"",
* "left": {
* "icon": "foo",
* "image": "http://www.xyz.com/img/foo.png",
* "alt": null,
* "alt_i18n": null
* },
* "center": {
* "text": [
* {"type":"p", "aside": true, "text":"foo", "text_i18n":null},
* {"type": "span", "count": true, "text": "3689"}
* ]
* },
* "right": {
* "radio": true,
* "checkbox": true,
* "icon": null,
* "action": "foo",
* "href": "http://www.foo.com",
* "title": null,
* "title_i18n": "",
* "external": true
* }
* ]
*}
* "left": [
* {"type": "icon", "icon":"foo"},
* {
* "type": "image":
* "src": "http://www.xyz.com/img/foo.png",
* "alt": null,
* "alt_i18n": null
* }
* ],
* "center": [
* {"type":"text", "aside": true, "text":"foo", "text_i18n":null},
* {"type": "count", "count": true, "text": "3689"}
* ],
* "right": [
* {"type": "radio/checkbox", "action": "foo"},
* {
* "type": "link",
* "action": "foo",
* "icon": "bar",
* "external": true,
* "title": "ha",
* "title_i18n": "ha",
* "href": "http://foo.com"
* }
* ]
* }
* @method listview
* @param {object} spec Configuration for controlgroup
* @return configuration object including wrapper, child-selector etc
*/
// TODO: add collapsible support if needed
// TODO: dividers? will not be in spec, so can only be listview option!
// TODO: count/aside still not implemented on listview
// TODO: ribbon???
factory.widget.listview = function (spec) {
var fragment, filter, has_filter, generator;
// generate list item
generator = function (element, wrapper, i) {
var divider, static_item, icon, theme, action, config, auto, last, item,
ribbon, target, block, j, input_dict, mock_id;
var divider, static_item, theme, config, auto, last, item, section,
target, block, j, section, len, k, made, class_string, split, arr;
config = wrapper.property_dict;
divider = element.type === "divider" ? true : undefined;
static_item = (element.href === undefined && !divider) ? true : undefined;
icon = element.icon;
theme = config.divider_theme || config.theme || "inherit";
action = element.right && element.right.action;
class_string = "";
// autodividers
// autodividers (TODO: does this work?)
if (config.autodividers) {
auto = element.text[0].text.slice(0, 1).toUpperCase();
if (last !== auto) {
......@@ -1828,183 +1826,60 @@
}
}
// static item, divider or link
if (static_item || divider) {
target = document.createDocumentFragment();
} else {
element.is_main = true;
target = factory.util.generateCustomElement("link", element, config)[0];
}
// loop over all sections = array (left|center|right...?)
for (section in element) {
if (element.hasOwnProperty(section)) {
arr = element[section];
if (typeof arr === "object" && arr !== null) {
len = arr.length;
for (k = 0; k < len; k += 1) {
block = arr[k];
made = factory.util.generateCustomElement(block.type, block, element);
class_string += made[1];
// split
if (made[1] === "ui-li-has-alt") {
split = made[0];
} else {
target.appendChild(made[0]);
}
}
}
}
}
// list item spec
item = factory.element({
"type": "li",
"direct": {
"className": divider ? ("ui-li-divider ui-bar-" + theme) : " " +
(i === 0 ? " ui-first-child" :
(i === 0 ? " ui-first-child " :
((i === config.length - 1) ?
" ui-last-child" : " ")) +
" ui-last-child " : " ")) + class_string +
(static_item ? " ui-li-static ui-body-inherit " : " ") +
(element.center.count ? " ui-li-has-count" : " ") +
(config.alt_icon ? " ui-icon-alt " : "") +
(element.left !== undefined ? (element.left.icon ?
" ui-li-has-icon " : " ") +
(element.left.image ? " ui-li-has-thumb " : " ") : " ") +
(element.right ? " ui-li-has-alt " : " ") +
(config.form_item ? "ui-field-contain " : " ") +
(config.reveal ? "ui-screen-hidden " : " ")
},
"attributes": {},
},
"logic": {
"data-role": divider ? "divider" : null,
"role": divider ? "heading" : null,
"data-icon": icon === null ?
false : (icon === undefined ? null : icon)
"role": divider ? "heading" : null
}
});
// ribbon
if (element.ribbon) {
ribbon = factory.element({
"type": "span",
"direct": {"className": "ribbon-wrapper"}
});
ribbon.appendChild(factory.element({
"type": "span",
"direct": {"className": "ribbon"}
}));
item.appendChild(ribbon);
// assemble
item.appendChild(target);
if (split) {
item.appendChild(split);
}
// static item or link
if (static_item || divider) {
target = item;
} else {
// TODO: fallback href ok?
target = factory.element({
"type": "a",
"direct": {
"className": "ui-btn " + (icon === null ? "" :
"ui-btn-icon-right ui-icon-" + (icon === undefined ?
"carat-r" : icon)),
"href": element.href || "#"
},
"attributes": {
"title": element.title || "",
"data-i18n": "[title]" + (element.title_i18n || "")
},
"logic":{
"rel": element.external ? "external" : null,
"data-ajax": element.external ? "false" : null
}
});
}
if (element.left) {
// image
if (element.left.image) {
target.appendChild(factory.element({
"type": "img",
"direct": {"src": element.left.image, "alt": (element.left.alt || "")}
}));
}
// custom icon
if (element.left.icon !== undefined) {
target.appendChild(factory.element({
"type": "span",
"direct": {
"className": "ui-li-icon ui-li-icon-custom ui-icon-" +
element.left.icon + " ui-icon"
},
"attributes": {},
"logic": {"text": "\u00A0"}
}));
}
}
// text elements/aside elements
for (j = 0; j < element.center.text.length; j += 1) {
block = element.center.text[j];
target.appendChild(
factory.element({
"type": block.type,
"direct": {
"className": (block.aside ? "ui-li-aside " : " ") +
(block.text_i18n ? "translate " : " ") + block.class_list
},
"logic": {
"text": block.text,
"data-i18n": block.text_i18n || null
}
})
);
}
// count bubble
if (element.center.count) {
target.appendChild(factory.element({
"type": "span",
"direct": {
"className": "ui-li-count ui-body-" +
(config.count_theme || config.theme)
},
"attributes": {},
"logic": {"text": element.center.count}
}));
}
// NOTE: if we made a link, target = a, else target = item
if (static_item || divider) {
item = target;
} else {
item.appendChild(target);
}
// split
if (element.right) {
// split button
if (element.right.link) {
item.appendChild(factory.element({
"type": "a",
"direct": {
"href": element.right.href,
"className": "ui-btn ui-btn-icon-notext ui-icon-" +
element.right.icon + " ui-btn-" +
(config.split_theme || config.theme || "inherit")
},
"attributes": {
"title": element.right.title || "",
"data-i18n": "[title]" + (element.right.title_i18n || "")
},
"logic":{
"rel": element.right.external ? "external" : null,
"data-ajax": element.external ? "false" : null
}
}));
}
// split check/radio
if (element.right.check || element.right.radio) {
// need to do this out here to account for action
mock_id = util.uuid();
input_dict = {
"type": element.right.check ? "checkbox" : "radio",
"data-i18n": "[value]",
"data-enhanced": true,
"value": "Select item",
"data-iconpos": "notext"
};
if (action) {
input_dict["data-action"] = element.right.action;
input_dict["data-reference"] = config.reference;
}
item.appendChild(factory.widget.formElement({
"type": "input",
"direct": {
"id": "select_" + (element.id || mock_id),
"name": "select_" +
(element.right.check ? (element.id || mock_id) : config.id),
"className": action ? "action" : ""
},
"attributes": input_dict,
"logic": {"wrap": false, "add_label": true}
}));
}
}
return {
"type": "item",
"content": item
......
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