stylus/manage/detail-dialog.js

85 lines
2.2 KiB
JavaScript

/* global messageBox makeLink makeAuthor */
'use strict';
function detailDialog(style) {
const TYPE_NAME = {
'urls': t('appliesUrlOption'),
'urlPrefixes': t('appliesUrlPrefixOption'),
'domains': t('appliesDomainOption'),
'regexps': t('appliesRegexpOption')
};
return messageBox({
title: style.name,
className: 'detail-dialog',
contents: buildContent(),
buttons: [t('confirmClose')]
});
function buildContent() {
return $element({
className: 'detail-table',
appendChild: [
makeRow(t('detailName'), 'name'),
makeRow(t('detailVersion'), 'version', true),
makeRow(t('detailAuthor'), makeStyleAuthor()),
makeRow(t('detailHomepageURL'), 'url'),
makeRow(t('detailSupportURL'), 'supportURL', true),
makeRow(t('detailUpdateURL'), 'updateUrl'),
makeRow(t('appliesLabel'), makeAppliesTo())
]
});
}
function makeRow(label, content, isUsercss) {
if (typeof content === 'string') {
if (isUsercss) {
if (style.usercssData) {
content = style.usercssData[content] || '';
} else {
content = '';
}
} else {
content = style[content] || '';
}
if (/^http[\S]+$/.test(content)) {
content = makeLink(content, content);
}
}
return $element({className: 'meta', appendChild: [
$element({className: 'meta-label', textContent: label}),
$element({className: 'meta-value', appendChild: content})
]});
}
function makeStyleAuthor() {
const author = style.author || style.usercssData && style.usercssData.author;
if (!author) {
return '';
}
return makeAuthor(author);
}
function makeAppliesTo() {
return $element({
'tag': 'ul',
appendChild: getApplies().map(([type, value]) => $element({
tag: 'li', textContent: `${type} - ${value}`
}))
});
}
function getApplies() {
const result = [];
for (const section of style.sections) {
for (const type of ['urls', 'urlPrefixes', 'domains', 'regexps']) {
if (section[type]) {
result.push(...section[type].map(pattern => ([TYPE_NAME[type], pattern])));
}
}
}
return result;
}
}