restore "x" in messageBox(), add namespace#tag to $element()

This commit is contained in:
tophf 2017-04-24 14:07:35 +03:00
parent f9e90f9cd0
commit 736302962c
2 changed files with 21 additions and 6 deletions

18
dom.js
View File

@ -81,11 +81,16 @@ function $$(selector, base = document) {
function $element(opt) {
// tag: string, default 'div'
// tag: string, default 'div', may include namespace like 'ns#tag'
// appendChild: element or an array of elements
// dataset: object
// any DOM property: assigned as is
const element = document.createElement(opt.tag || 'div');
const [ns, tag] = opt.tag && opt.tag.includes('#')
? opt.tag.split('#')
: [null, opt.tag];
const element = ns
? document.createElementNS(ns == 'SVG' || ns == 'svg' ? 'http://www.w3.org/2000/svg' : ns, tag)
: document.createElement(tag || 'div');
(opt.appendChild instanceof Array ? opt.appendChild : [opt.appendChild])
.forEach(child => child && element.appendChild(child));
delete opt.appendChild;
@ -94,5 +99,12 @@ function $element(opt) {
Object.assign(element.dataset, opt.dataset);
delete opt.dataset;
}
return Object.assign(element, opt);
if (ns) {
for (const attr in opt) {
element.setAttributeNS(null, attr, opt[attr]);
}
} else {
Object.assign(element, opt);
}
return element;
}

View File

@ -56,9 +56,12 @@ function messageBox({
messageBox.element = $element({id, className, appendChild: [
$element({appendChild: [
$element({id: `${id}-title`, innerHTML: title}),
$element({
id: `${id}-close-icon`,
innerHTML: '<svg class="svg-icon"><use xlink:href="#svg-icon-close"/></svg>',
$element({id: `${id}-close-icon`, appendChild:
$element({tag: 'SVG#svg', class: 'svg-icon', viewBox: '0 0 20 20', appendChild:
$element({tag: 'SVG#path', d: 'M11.69,10l4.55,4.55-1.69,1.69L10,11.69,' +
'5.45,16.23,3.77,14.55,8.31,10,3.77,5.45,5.45,3.77,10,8.31l4.55-4.55,1.69,1.69Z',
})
}),
onclick: messageBox.listeners.closeIcon}),
$element({id: `${id}-contents`, [putAs]: contents}),
$element({id: `${id}-buttons`, appendChild: