Skip to content

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

app: fixed logo/title in header, themes in buttons, ribbon

parent 714f0e92
Hide whitespace changes
Inline Side-by-side
Showing with 82 additions and 75 deletions
js/erp5_loader.js
View file @ a5b0564b
......@@ -195,7 +195,6 @@
addLabel = function (config, label_class_list) {
// [r]equired class
star = util.testForString("equire", config.direct.className, true);
return factory.element({
"type": "label",
"direct": {
......@@ -221,9 +220,8 @@
spec.attributes["data-enhanced"] = true;
// class string: theme
if (spec.attributes["data-theme"] !== undefined) {
theme = " ui-btn-" + spec.attributes["data-theme"];
}
theme = spec.attributes["data-theme"];
// class string: first/last element in button groups (default = undefined)
index = "";
......@@ -270,7 +268,7 @@
// optionally wrap input in a div-fieldcontain
// NOTE: route is for custom HTML elements... service_instance_status
if (!spec.logic.route && (spec.wrap !== true || hidden_field)) {
if (!spec.logic.route && (spec.logic.wrap !== true || hidden_field)) {
wrapper = document.createDocumentFragment();
} else {
wrapper = factory.element({
......@@ -363,7 +361,7 @@
spec.attributes.autocapitalize = "none";
spec.attributes.autocorrect = "none";
container_class_list = "ui-input-" + text + " ui-body-inherit ";
container_class_list = "ui-input-" + text;
}
break;
}
......@@ -377,12 +375,13 @@
// class string: assemble
container_class_list += (no_validate ? "" : " ui-corner-all ui-shadow-inset") +
disabled + readonly + (action || "") + (clear || "") + (theme || "");
disabled + readonly + (action || "") + (clear || "") +
(theme ? (" ui-bar-" + theme + " ") : " ui-body-inherit ");
}
// NOTE: time to make elements - needs shuffling to fit all variants
// container
if (spec.type === "textarea" || hidden_field || spec.logic.plain_element || spec.logic.route) {
if (spec.type === "textarea" || hidden_field || spec.logic.route) {
container = wrapper;
} else {
wrap_in_container = true;
......@@ -430,9 +429,8 @@
// NOTE: hidden fields & security fields get no la
// the input, otherwise "invalid" CSS sibling selector will not work.
// This saves doing "invalid" handler with javascript
if ((need_text_node === undefined &&
(push_label || !label_inside) && !hidden_field &&
spec.logic.plain_element === undefined) || spec.logic.route) {
if (spec.logic.add_label !== false && ((need_text_node === undefined &&
(push_label || !label_inside) && !hidden_field) || spec.logic.route)) {
label_target.appendChild(addLabel(spec, label_class_list));
}
......@@ -451,6 +449,11 @@
// alas... make the ELEMENT itself
element_target.appendChild(factory.element(spec));
// checkbox radio need label after input
if (label_inside) {
label_target.appendChild(addLabel(spec, label_class_list));
}
// add invalid validation messages
// TODO: "wrong" is wrong
if (!no_validate && !spec.logic.route) {
......@@ -474,7 +477,8 @@
"direct": {
"title": "Clear",
"className": "ui-input-clear ui-btn ui-icon-delete translate " +
"ui-btn-icon-notext ui-corner-all ui-input-clear-hidden",
"ui-btn-icon-notext ui-corner-all ui-input-clear-hidden " +
(theme ? ("ui-btn-" + theme) : ""),
"href": "#"
},
"attributes": {"data-i18n": "global.actions.clear", "tabindex": "-1"},
......@@ -491,7 +495,8 @@
"title": spec.logic.action.text || "Search",
"className": "ui-input-action ui-btn ui-icon-" +
(spec.logic.action.icon || "search") +
" ui-btn-icon-notext ui-corner-all translate ",
" ui-btn-icon-notext ui-corner-all translate " +
(theme ? ("ui-btn-" + theme) : ""),
"href": "#"
},
"attributes": {
......@@ -842,6 +847,7 @@
* "title": "",
* "title_i18n":"",
* "fixed": true,
* "add_content": 1,
* "image": {
* "src": null,
* "alt": null,
......@@ -855,52 +861,54 @@
* @return {object} object including fragment, child-selector, placeholder
*/
factory.widget.header = function (spec) {
var container, id, target, fragment;
var container, id, target, set_img, img;
container = document.createDocumentFragment();
id = spec.id || ((spec.data_url || "global") + "-header");
set_img = spec.image;
img = spec.image || {};
// button group wrappers and title (inserted before last wrapper!)
target = function (j, len, conf) {
switch (true) {
case (j === 0):
return factory.element({
"type": "div",
"direct": {"className": "ui-first-wrap"}
});
case (j === len - 1):
fragment = document.createDocumentFragment();
if (conf.img) {
fragment.appendChild(factory.element({
"type": "img",
"direct": {"src": conf.src},
"attributes": {"alt": conf.title},
"logic": {
"data-i18n": config.title_i18n ?
("[alt]" + config.title_i18n) : null
}
}));
} else {
fragment.appendChild(factory.element({
"type": "h1",
"direct": {"className": "translate ui-title"},
"attributes": {
"data-i18n": conf.title_i18n || "",
"role": "heading",
"aria-level": "1"
},
"logic": {"text": conf.title || "\u00A0"}
}));
}
fragment.appendChild(
factory.element({
"type": "div",
"direct": {"className": "ui-last-wrap"}
})
);
return fragment;
var position, drop_content, fragment;
fragment = document.createDocumentFragment();
position = (conf.section_list || ["first", "last"])[j];
drop_content = conf.add_content === 0 ? 0 : 1;
if (j === drop_content) {
if (conf && conf.img) {
fragment.appendChild(factory.element({
"type": "img",
"direct": {"src": conf.src, "className": "ui-title-logo"},
"attributes": {"alt": conf.title},
"logic": {
"data-i18n": conf.title_i18n ?
("[alt]" + conf.title_i18n) : null
}
}));
} else {
fragment.appendChild(factory.element({
"type": "h1",
"direct": {"className": "translate ui-title"},
"attributes": {
"data-i18n": conf.title_i18n || "",
"role": "heading",
"aria-level": "1"
},
"logic": {"text": conf.title || "\u00A0"}
}));
}
}
}
if (position) {
fragment.appendChild(factory.element({
"type": "div",
"direct": {"className": "ui-wrap ui-" + position + "-wrap"}
}));
}
return fragment;
};
// container
container.appendChild(factory.element({
......@@ -908,7 +916,7 @@
"direct": {
"id": id,
"className": (spec.class_list || " ") +
(spec.fixed ? "ui-header-fixed " : " ") + "bar ui-header foo " +
(spec.fixed ? " ui-header-fixed " : " ") + " bar ui-header foo " +
" slidedown ui-bar-" + (spec.theme || "inherit")
},
"attributes": {
......@@ -929,10 +937,12 @@
"target": target,
"target_selector": "last",
"spec": {
"img": spec.image,
"src": spec.src,
"title": spec.title || spec.alt,
"title_i18n": spec.title_i18n || spec.alt_i18n
"img": !!set_img,
"src": img.src,
"title": img.alt || spec.title,
"title_i18n": img.alt_i18n || spec.title_i18n,
"section_list": spec.section_list,
"add_content": spec.add_content
}
};
};
......@@ -1479,7 +1489,6 @@
"data-i18n": null
},
"logic": {
"plain_element": true,
"label": "Please do not fill out this field",
"label_i18n": null
}
......@@ -1506,7 +1515,6 @@
"data-i18n": "[placeholder]global.form_helpers.secure_filled"
},
"logic": {
"plain_element": true,
"label": "Please leave this value unchanged",
"label_i18n": "global.form_helpers.secure_filled"
}
......@@ -1560,7 +1568,8 @@
* "filter_theme": null,
* "divider_theme": "slapos-white",
* "autodividers": true,
* "count_theme": "slapos-white"
* "count_theme": "slapos-white",
* "ribbon": null
* },
* "children": [
* {
......@@ -1602,13 +1611,14 @@
// 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;
ribbon, target, block, j, input_dict, mock_id;
config = wrapper.property_dict;
divider = element.type === "divider" ? true : undefined;
......@@ -1785,6 +1795,7 @@
// 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",
......@@ -1797,17 +1808,16 @@
input_dict["data-action"] = element.right.action;
input_dict["data-reference"] = config.reference;
}
item.appendChild(factory.formElement({
item.appendChild(factory.widget.formElement({
"type": "input",
"direct": {
"id": "select_" + element.id,
"id": "select_" + (element.id || mock_id),
"name": "select_" +
(element.right.check ? element.id : config.id),
(element.right.check ? (element.id || mock_id) : config.id),
"className": action ? "action" : ""
},
"attributes": input_dict,
"wrap": false,
"label": true
"logic": {"wrap": false, "add_label": true}
}));
}
}
......@@ -2456,10 +2466,10 @@
var def, string, iconpos, icon;
string = "";
icon = element.attributes["data-icon"] || default_icon;
// NOTE: we only set on <a>
if (element.type === "a") {
icon = (element.attributes || {})["data-icon"] || default_icon;
// because of custom a in service_instance_status!
if (!element.logic.plain_link) {
string += " ui-btn ui-shadow ";
......@@ -3373,7 +3383,6 @@
**/
// TODO: move radio/check into property_dict and on item level?
// TODO: not nice & find better handling for text elements and i18n tags
// TODO: keep ribbon?
map.listItem = function (item, wrapper, i) {
var quirk_dict, level, core, new_item, section, pos, label, j, k, field,
record;
......@@ -3395,11 +3404,6 @@
}
};
// ribbon
if (quirk_dict.ribbon) {
new_item.ribbon = true;
}
// radio
if (quirk_dict.radio) {
label = true;
......@@ -6211,7 +6215,10 @@
target = undefined;
if (response) {
// generate target for and append response
// NOTE: wrapper.spec is used for header only
// NOTE: wrapper.spec is used for header only.
// TODO: remove, spec must be available here, too
// NOTE: len is needed for header only to place title
// TODO: no longer needed, remove
if (wrapper.target) {
wrapper_selector = wrapper.target(
wrapper.child_selector.children.length,
......@@ -6241,7 +6248,7 @@
if (util.testForString("ui-footer", last.className)) {
document.body.insertBefore(wrapper.fragment, last);
} else {
document.body.appendChild(content);
document.body.insertBefore(content, document.body.children[0]);
}
} else {
// TODO: terrible. what about footer/header/popup.
......
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