From 81996ee55166a5e7a6b8c008c9517430ac3ed8d3 Mon Sep 17 00:00:00 2001 From: Quincy Morgan Date: Thu, 28 Feb 2019 17:13:38 -0500 Subject: [PATCH] Add favoriting or presets in the search add bar --- css/80_app.css | 24 ++++++++++++++++++------ modules/ui/preset_favorite.js | 6 +++--- modules/ui/search_add.js | 10 ++++++++++ 3 files changed, 31 insertions(+), 9 deletions(-) diff --git a/css/80_app.css b/css/80_app.css index 6c0d53eb9..07a6ea192 100644 --- a/css/80_app.css +++ b/css/80_app.css @@ -649,11 +649,12 @@ button.add-note svg.icon { display: flex; align-items: center; line-height: 1.2em; + width: 100%; } .search-add .list-item > *:not(button) { pointer-events: none; } -.search-add .list-item button { +.search-add .list-item button.choose { position: absolute; border-radius: 0; height: 100%; @@ -661,7 +662,17 @@ button.add-note svg.icon { top: 0; left: 0; } - +.search-add .list-item button.accessory { + position: relative; + flex: 0 0 auto; + color: #808080; + background: transparent; + padding-right: 3px; + padding-left: 3px; +} +.search-add .list-item button.accessory:hover { + color: #666; +} /* Header for modals / panes ------------------------------------------------------- */ .header { @@ -1209,7 +1220,8 @@ a.hide-toggle { .preset-list-item button.tag-reference-button { height: 100%; border: 1px solid #ccc; - flex: 32px; + width: 32px; + flex: 0 0 auto; background: #f6f6f6; } [dir='ltr'] .preset-list-item button.preset-favorite-button, @@ -1238,11 +1250,11 @@ a.hide-toggle { opacity: .5; } -.preset-list-item button.preset-favorite-button .icon { +button.preset-favorite-button .icon { fill-opacity: 0; - stroke-width: 1.6; + stroke-width: 1; } -.preset-list-item button.preset-favorite-button.active .icon { +button.preset-favorite-button.active .icon { fill-opacity: inherit; } diff --git a/modules/ui/preset_favorite.js b/modules/ui/preset_favorite.js index ef43ee338..d100b6e18 100644 --- a/modules/ui/preset_favorite.js +++ b/modules/ui/preset_favorite.js @@ -6,7 +6,7 @@ import { import { t } from '../util/locale'; import { svgIcon } from '../svg'; -export function uiPresetFavorite(preset, geom, context) { +export function uiPresetFavorite(preset, geom, context, klass) { var presetFavorite = {}; @@ -15,7 +15,7 @@ export function uiPresetFavorite(preset, geom, context) { presetFavorite.button = function(selection) { - var canFavorite = geom !== 'vertex' && geom !== 'relation' && !preset.isFallback(); + var canFavorite = geom !== 'vertex' && geom !== 'relation'; _button = selection.selectAll('.preset-favorite-button') .data(canFavorite ? [0] : []); @@ -24,7 +24,7 @@ export function uiPresetFavorite(preset, geom, context) { _button = _button.enter() .insert('button', '.tag-reference-button') - .attr('class', 'preset-favorite-button') + .attr('class', 'preset-favorite-button ' + klass) .attr('title', t('icons.favorite')) .attr('tabindex', -1) .call(svgIcon('#iD-icon-favorite')) diff --git a/modules/ui/search_add.js b/modules/ui/search_add.js index a4b44242e..72a75ab9e 100644 --- a/modules/ui/search_add.js +++ b/modules/ui/search_add.js @@ -17,6 +17,7 @@ import { actionChangePreset } from '../actions/index'; import { operationDelete } from '../operations/index'; import { svgIcon } from '../svg/index'; import { tooltip } from '../util/tooltip'; +import { uiPresetFavorite } from './preset_favorite'; import { uiPresetIcon } from './preset_icon'; import { uiTagReference } from './tag_reference'; import { utilKeybinding, utilNoAuto, utilRebind } from '../util'; @@ -116,6 +117,7 @@ export function uiSearchAdd(context) { .attr('class', function(item) { return 'list-item preset-' + item.id.replace('/', '-'); }); var button = row.append('button') + .attr('class', 'choose') .on('click', function(d) { var geom = defaultGeometry(d); var markerClass = 'add-preset add-' + geom + ' add-preset-' + d.name() @@ -159,6 +161,14 @@ export function uiSearchAdd(context) { return d.name(); }); + row.each(function(d) { + var supportedGeom = supportedGeometry(d); + if (supportedGeom.length === 1) { + var presetFavorite = uiPresetFavorite(d, supportedGeom[0], context, 'accessory'); + d3_select(this).call(presetFavorite.button); + } + }); + //updateForFeatureHiddenState(); }