Skip to content

Commit

Permalink
Merge pull request #222 from pedromml/update-sources-field
Browse files Browse the repository at this point in the history
Update sources field
  • Loading branch information
pedromml authored Aug 8, 2024
2 parents 5cfff58 + 59b8e94 commit 846e2f2
Show file tree
Hide file tree
Showing 6 changed files with 167 additions and 6 deletions.
26 changes: 22 additions & 4 deletions css/80_app.css
Original file line number Diff line number Diff line change
Expand Up @@ -1591,12 +1591,20 @@ input.date-selector {
display: flex;
flex-flow: row nowrap;
}
.form-field ul.rows li.labeled-input > div {
.form-field ul.rows li.labeled-input > div,
.form-field ul.rows li.labeled-input-source > div {
flex: 1 1 auto;
width: 100%;
border-radius: 0;
line-height: 0.95rem;
}
.form-field ul.rows li.labeled-input div > span,
.form-field ul.rows li.labeled-input-source div > span{
vertical-align: middle;
}
.form-field ul.rows li.labeled-input-source > div {
width: auto;
}
.form-field ul.rows li input {
border-radius: 0;
border-width: 0;
Expand All @@ -1620,18 +1628,21 @@ input.date-selector {
display: table;
width: 100%;
}
.form-field ul.rows.rows-table li.labeled-input {
.form-field ul.rows.rows-table li.labeled-input,
.form-field ul.rows.rows-table li.labeled-input-source {
display: table-row;
}
.form-field ul.rows.rows-table li.labeled-input > div:first-child {
.form-field ul.rows.rows-table li.labeled-input > div:first-child,
.form-field ul.rows.rows-table li.labeled-input-source > div:first-child {
display: table-cell;
width: auto;
max-width: 170px;
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
}
.form-field ul.rows.rows-table li.labeled-input > div:nth-child(2) {
.form-field ul.rows.rows-table li.labeled-input > div:nth-child(2),
.form-field ul.rows.rows-table li.labeled-input-source > div:nth-child(2) {
display: table-cell;
width: auto;
}
Expand Down Expand Up @@ -2051,6 +2062,9 @@ input.date-selector {

/* Field - date, roadheight, and roadspeed
------------------------------------------------------- */
.form-field-input-source {
flex-direction: column;
}
.form-field-input-date input.date-year,
.form-field-input-date input.date-month,
.form-field-input-roadheight input.roadheight-number,
Expand Down Expand Up @@ -2960,6 +2974,10 @@ img.tag-reference-wiki-image {
.add-row .space-value {
flex: 1 1 50%;
}
.add-row .add-subkey {
width: 32px;
flex: 0 1 auto;
}
.add-row .space-buttons {
flex: 0 0 62px;
}
Expand Down
7 changes: 7 additions & 0 deletions data/core.yaml
Original file line number Diff line number Diff line change
Expand Up @@ -801,6 +801,11 @@ en:
field_source: add source
field_source_label: Source for {field_name}
field_source_placeholder: URL, newspaper article, book...
source:
main_input: Description
name: Name
url: https://example.com
date: Date the source was created
max_length_reached: "This string is longer than the maximum length of {maxChars} characters. Anything exceeding that length will be truncated."
set_today: "Sets the value to today."
background:
Expand Down Expand Up @@ -2535,6 +2540,8 @@ en:
label: License
placeholder: CC0
terms: copyleft, copyright
source:
label: Source
presets:
type/chronology:
name: Chronology
Expand Down
3 changes: 2 additions & 1 deletion modules/presets/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -57,8 +57,9 @@ function addHistoricalFields(fields) {

// A combo box would encourage mappers to choose one of the suggestions, but we want mappers to be as detailed as possible.
if (fields.source) {
fields.source.type = 'text';
fields.source.type = 'source';
fields.source.source = false;
fields.source.keys = ['source', 'source:url', 'source:name', 'source:date'];
}

fields.license = {
Expand Down
2 changes: 2 additions & 0 deletions modules/ui/fields/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -54,6 +54,7 @@ import { uiFieldLocalized } from './localized';
import { uiFieldRoadheight } from './roadheight';
import { uiFieldRoadspeed } from './roadspeed';
import { uiFieldRestrictions } from './restrictions';
import { uiFieldSources } from './sources';
import { uiFieldTextarea } from './textarea';
import { uiFieldWikidata } from './wikidata';
import { uiFieldWikipedia } from './wikipedia';
Expand Down Expand Up @@ -82,6 +83,7 @@ export var uiFields = {
radio: uiFieldRadio,
restrictions: uiFieldRestrictions,
semiCombo: uiFieldSemiCombo,
source: uiFieldSources,
structureRadio: uiFieldStructureRadio,
tel: uiFieldTel,
text: uiFieldText,
Expand Down
134 changes: 134 additions & 0 deletions modules/ui/fields/sources.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,134 @@
import { dispatch as d3_dispatch } from 'd3-dispatch';
import { select as d3_select } from 'd3-selection';

import { t } from '../../core/localizer';
import { utilGetSetValue, utilNoAuto, utilRebind } from '../../util';

export function uiFieldSources(field, context) {
let dispatch = d3_dispatch('change');
let items = d3_select(null);
let _tags = {};
let _selection = d3_select(null);
let _pendingChange;

const mainKey = 'source';
const sourceHeader = mainKey + ':';

// Pre-selected subkeys to show
const possibleSourceSubkeys = [{key:'name'}, {key:'url'}, {key:'date'}];

function scheduleChange() {
if (!_pendingChange) return;
dispatch.call('change', this, _pendingChange);
_pendingChange = null;
_selection.call(sources);
}

function valueChange(d3_event, d) {
// exit if this is a multiselection and no value was entered
if (typeof d.key !== 'string' && !this.value) return;

var key = sourceHeader + d.key;

_pendingChange = _pendingChange || {};

var value = context.cleanTagValue(this.value);

_pendingChange[key] = value === '' ? undefined : value;
_tags[key] = value === '' ? undefined : value;
scheduleChange();
}

function mainChange() {
_pendingChange = _pendingChange || {};
var value = context.cleanTagValue(this.value);
_pendingChange[mainKey] = value === '' ? undefined : value;
_tags[mainKey] = value === '' ? undefined : value;
scheduleChange();
}

function sources(selection) {
_selection = selection;

var wrap = selection.selectAll('.form-field-input-wrap')
.data([0]);

selection.exit()
.style('top', '0')
.style('max-height', '240px')
.transition()
.duration(200)
.style('opacity', '0')
.style('max-height', '0px')
.remove();

wrap = wrap.enter()
.append('div')
.attr('class', 'form-field-input-wrap form-field-input-' + field.type)
.merge(wrap);

// source key
wrap.selectAll('input')
.data([0])
.enter()
.append('input')
.attr('class', 'main-value')
.attr('type', 'text')
.attr('placeholder', t('inspector.source.main_input'))
.call(utilNoAuto)
.on('change', mainChange)
.on('blur', mainChange);

var list = wrap.selectAll('ul')
.data([0]);

list = list.enter()
.append('ul')
.attr('class', 'rows')
.merge(list);

list = list.merge(list);

// source:*= keys
items = list.selectAll('li.labeled-input-source')
.data(possibleSourceSubkeys);

items = items.enter()
.append('li')
.attr('class', 'labeled-input-source');

items
.append('input')
.attr('type', 'text')
.attr('class', 'value')
.attr('placeholder', function(d) {
return t('inspector.source.' + d.key);
})
.call(utilNoAuto)
.call(utilGetSetValue, function(d) {
return _tags[sourceHeader + d.key];
})
.on('change', valueChange)
.on('blur', valueChange);

items.exit()
.remove();

utilGetSetValue(_selection.selectAll('.value'), function(d) {
return (_tags[sourceHeader + d.key] === undefined) ? '' : _tags[sourceHeader + d.key];
});

utilGetSetValue(_selection.selectAll('.main-value'), function() {
return (_tags[mainKey] === undefined) ? '' : _tags[mainKey];
});
}

sources.tags = function(tags){
if (!arguments.length) return _tags;
_tags = tags;

_selection.call(sources);
};

return utilRebind(sources, dispatch, 'on');
}
1 change: 0 additions & 1 deletion modules/ui/source_subfield.js
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,6 @@ import {

import { t } from '../core/localizer';
import { svgIcon } from '../svg/icon';
import { uiTooltip } from './tooltip';
import { utilGetSetValue, utilUniqueDomId } from '../util';

export function uiSourceSubfield(context, field, tags, dispatch) {
Expand Down

0 comments on commit 846e2f2

Please sign in to comment.