refactor uiSections to not inject html

This commit is contained in:
Martin Raifer
2022-06-24 11:45:54 +02:00
parent 85022dcc6c
commit 28eae9ed87
21 changed files with 27 additions and 22 deletions

View File

@@ -51,8 +51,13 @@ export function uiDisclosure(context, key, expandedDefault) {
.attr('aria-expanded', _expanded)
.classed('expanded', _expanded);
hideToggle.selectAll('.hide-toggle-text')
.html(_label());
const label = _label();
const labelSelection = hideToggle.selectAll('.hide-toggle-text');
if (typeof label !== 'function') {
labelSelection.text(_label());
} else {
labelSelection.text('').call(label);
}
hideToggle.selectAll('.hide-toggle-icon')
.attr('xlink:href', _expanded ? '#iD-icon-down'

View File

@@ -11,7 +11,7 @@ import { uiSection } from '../section';
export function uiSectionBackgroundDisplayOptions(context) {
var section = uiSection('background-display-options', context)
.label(t.html('background.display_options'))
.label(() => t.append('background.display_options'))
.disclosureContent(renderDisclosureContent);
var _storedOpacity = prefs('background-opacity');

View File

@@ -21,7 +21,7 @@ export function uiSectionBackgroundList(context) {
.on('change', customChanged);
var section = uiSection('background-list', context)
.label(t.html('background.backgrounds'))
.label(() => t.append('background.backgrounds'))
.disclosureContent(renderDisclosureContent);
function previousBackgroundID() {

View File

@@ -11,7 +11,7 @@ import { uiSection } from '../section';
export function uiSectionBackgroundOffset(context) {
var section = uiSection('background-offset', context)
.label(t.html('background.fix_misalignment'))
.label(() => t.append('background.fix_misalignment'))
.disclosureContent(renderDisclosureContent)
.expandedByDefault(false);

View File

@@ -26,7 +26,7 @@ export function uiSectionChanges(context) {
.label(function() {
var history = context.history();
var summary = history.difference().summary();
return t.html('inspector.title_count', { title: { html: t.html('commit.changes') }, count: summary.length });
return t.append('inspector.title_count', { title: t('commit.changes'), count: summary.length });
})
.disclosureContent(renderDisclosureContent);

View File

@@ -21,7 +21,7 @@ export function uiSectionDataLayers(context) {
var layers = context.layers();
var section = uiSection('data-layers', context)
.label(t.html('map_data.data_layers'))
.label(() => t.append('map_data.data_layers'))
.disclosureContent(renderDisclosureContent);
function renderDisclosureContent(selection) {

View File

@@ -24,7 +24,7 @@ export function uiSectionEntityIssues(context) {
return _issues.length > 0;
})
.label(function() {
return t.html('inspector.title_count', { title: { html: t.html('issues.list_title') }, count: _issues.length });
return t.append('inspector.title_count', { title: t('issues.list_title'), count: _issues.length });
})
.disclosureContent(renderDisclosureContent);

View File

@@ -20,7 +20,7 @@ export function uiSectionFeatureType(context) {
var _tagReference;
var section = uiSection('feature-type', context)
.label(t.html('inspector.feature_type'))
.label(() => t.append('inspector.feature_type'))
.disclosureContent(renderDisclosureContent);
function renderDisclosureContent(selection) {

View File

@@ -7,7 +7,7 @@ export function uiSectionMapFeatures(context) {
var _features = context.features().keys();
var section = uiSection('map-features', context)
.label(t.html('map_data.map_features'))
.label(() => t.append('map_data.map_features'))
.disclosureContent(renderDisclosureContent)
.expandedByDefault(false);

View File

@@ -5,7 +5,7 @@ import { uiSection } from '../section';
export function uiSectionMapStyleOptions(context) {
var section = uiSection('fill-area', context)
.label(t.html('map_data.style_options'))
.label(() => t.append('map_data.style_options'))
.disclosureContent(renderDisclosureContent)
.expandedByDefault(false);

View File

@@ -11,7 +11,7 @@ import { uiSection } from '../section';
export function uiSectionOverlayList(context) {
var section = uiSection('overlay-list', context)
.label(t.html('background.overlays'))
.label(() => t.append('background.overlays'))
.disclosureContent(renderDisclosureContent);
var _overlayList = d3_select(null);

View File

@@ -12,7 +12,7 @@ export function uiSectionPhotoOverlays(context) {
var layers = context.layers();
var section = uiSection('photo-overlays', context)
.label(t.html('photo_overlays.title'))
.label(() => t.append('photo_overlays.title'))
.disclosureContent(renderDisclosureContent)
.expandedByDefault(false);

View File

@@ -12,7 +12,7 @@ import { uiSection } from '../section';
export function uiSectionPresetFields(context) {
var section = uiSection('preset-fields', context)
.label(t.html('inspector.fields'))
.label(() => t.append('inspector.fields'))
.disclosureContent(renderDisclosureContent);
var dispatch = d3_dispatch('change', 'revert');

View File

@@ -6,7 +6,7 @@ import { uiSection } from '../section';
export function uiSectionPrivacy(context) {
let section = uiSection('preferences-third-party', context)
.label(t.html('preferences.privacy.title'))
.label(() => t.append('preferences.privacy.title'))
.disclosureContent(renderDisclosureContent);
function renderDisclosureContent(selection) {

View File

@@ -33,7 +33,7 @@ export function uiSectionRawMemberEditor(context) {
var gt = entity.members.length > _maxMembers ? '>' : '';
var count = gt + entity.members.slice(0, _maxMembers).length;
return t.html('inspector.title_count', { title: { html: t.html('inspector.members') }, count: count });
return t.append('inspector.title_count', { title: t('inspector.members'), count: count });
})
.disclosureContent(renderDisclosureContent);

View File

@@ -31,7 +31,7 @@ export function uiSectionRawMembershipEditor(context) {
var parents = getSharedParentRelations();
var gt = parents.length > _maxMemberships ? '>' : '';
var count = gt + parents.slice(0, _maxMemberships).length;
return t.html('inspector.title_count', { title: { html: t.html('inspector.relations') }, count: count });
return t.append('inspector.title_count', { title: t('inspector.relations'), count: count });
})
.disclosureContent(renderDisclosureContent);

View File

@@ -19,7 +19,7 @@ export function uiSectionRawTagEditor(id, context) {
.classes('raw-tag-editor')
.label(function() {
var count = Object.keys(_tags).filter(function(d) { return d; }).length;
return t.html('inspector.title_count', { title: { html: t.html('inspector.tags') }, count: count });
return t.append('inspector.title_count', { title: t('inspector.tags'), count: count });
})
.expandedByDefault(false)
.disclosureContent(renderDisclosureContent);

View File

@@ -17,7 +17,7 @@ export function uiSectionSelectionList(context) {
return _selectedIDs.length > 1;
})
.label(function() {
return t.html('inspector.title_count', { title: { html: t.html('inspector.features') }, count: _selectedIDs.length });
return t.append('inspector.title_count', { title: t('inspector.features'), count: _selectedIDs.length });
})
.disclosureContent(renderDisclosureContent);

View File

@@ -19,7 +19,7 @@ export function uiSectionValidationIssues(id, severity, context) {
.label(function() {
if (!_issues) return '';
var issueCountText = _issues.length > 1000 ? '1000+' : String(_issues.length);
return t.html('inspector.title_count', { title: { html: t.html('issues.' + severity + 's.list_title') }, count: issueCountText });
return t.append('inspector.title_count', { title: t('issues.' + severity + 's.list_title'), count: issueCountText });
})
.disclosureContent(renderDisclosureContent)
.shouldDisplay(function() {

View File

@@ -16,7 +16,7 @@ export function uiSectionValidationRules(context) {
var section = uiSection('issues-rules', context)
.disclosureContent(renderDisclosureContent)
.label(t.html('issues.rules.title'));
.label(() => t.append('issues.rules.title'));
var _ruleKeys = context.validator().getRuleKeys()
.filter(function(key) { return key !== 'maprules'; })

View File

@@ -66,7 +66,7 @@ export function uiSplash(context) {
}));
uiSectionPrivacy(context)
.label(t.html('splash.privacy_settings'))
.label(() => t.append('splash.privacy_settings'))
.render(modalSection);
let buttonWrap = introModal