function drawItems()

in modules/ui/preset_browser.js [481:564]


    function drawItems(selection) {

        var item = selection
            .append('div')
            .attr('class', 'list-item')
            .attr('id', function(d) {
                return 'search-add-list-item-preset-' + d.id().replace(/[^a-zA-Z\d:]/g, '-');
            })
            .on('mouseover', function() {
                poplistContent.selectAll('.list .list-item.focused')
                    .classed('focused', false);
                d3_select(this)
                    .classed('focused', true);
            })
            .on('mouseout', function() {
                d3_select(this)
                    .classed('focused', false);
            });

        var row = item.append('div')
            .attr('class', 'row');

        row.append('button')
            .attr('class', 'choose')
            .on('click', function(d) {
                d.choose.call(this);
            });

        row.each(function(d) {
            var geometry = d.preset && d.preset.geometry[0];
            if ((d.preset && d.preset.geometry.length !== 1) ||
                (geometry !== 'area' && geometry !== 'line' && geometry !== 'vertex')) {
                geometry = null;
            }
            d3_select(this).call(
                uiPresetIcon(context)
                    .geometry(geometry)
                    .preset(d.preset || d.category)
                    .sizeClass('small')
            );
        });
        var label = row.append('div')
            .attr('class', 'label');

        label.each(function(d) {
            if (d.subitems) {
                d3_select(this)
                    .call(svgIcon((textDirection === 'rtl' ? '#iD-icon-backward' : '#iD-icon-forward'), 'inline'));
            }
        });

        label.each(function(d) {
            // NOTE: split/join on en-dash, not a hypen (to avoid conflict with fr - nl names in Brussels etc)
            d3_select(this)
                .append('div')
                .attr('class', 'label-inner')
                .selectAll('.namepart')
                .data(d.name().split(' – '))
                .enter()
                .append('div')
                .attr('class', 'namepart')
                .text(function(d) { return d; });
        });

        row.each(function(d) {
            if (!d.preset) return;

            var presetFavorite = uiPresetFavoriteButton(d.preset, null, context, 'accessory');
            d3_select(this).call(presetFavorite.button);
        });
        item.each(function(d) {
            if (!d.preset) return;

            var reference = uiTagReference(d.preset.reference(d.preset.defaultAddGeometry(context, shownGeometry)), context);

            var thisItem = d3_select(this);
            thisItem.selectAll('.row').call(reference.button, 'accessory', 'info');

            var subsection = thisItem
                .append('div')
                .attr('class', 'subsection reference');
            subsection.call(reference.body);
        });
    }