From a396cde295e55950bbf814962a3161beb0f7be92 Mon Sep 17 00:00:00 2001
From: Ansis Brammanis <ansis.brammanis@gmail.com>
Date: Wed, 20 Feb 2013 22:14:50 -0500
Subject: [PATCH] misc style tweaks, don't use select box

scroll when expanding additional tags
---
 css/app.css         | 10 ++++++----
 js/id/ui/address.js |  6 ++++++
 js/id/ui/preset.js  | 24 +++++++++++++-----------
 js/id/ui/taglist.js |  5 +++--
 4 files changed, 28 insertions(+), 17 deletions(-)

diff --git a/css/app.css b/css/app.css
index 0949f8d62..7af38d1d3 100644
--- a/css/app.css
+++ b/css/app.css
@@ -1561,6 +1561,7 @@ div.combobox {
     background-color: #fff;
     padding:1px 4px;
     white-space: nowrap;
+    height: 30px;
 }
 
 .combobox a:hover,
@@ -1599,14 +1600,15 @@ div.combobox {
 /* Address input */
 
 .preset-input .addr-housename {
-    width: 300px;
-    display: block;
+    border-bottom: none;
+    width:100%;
 }
 
 .preset-input .addr-number {
-    width: 50px;
+    width: 20%;
+    border-right: none;
 }
 
 .preset-input .addr-streetname {
-    width: 250px;
+    width: 80%;
 }
diff --git a/js/id/ui/address.js b/js/id/ui/address.js
index c3902aec8..fb96169f1 100644
--- a/js/id/ui/address.js
+++ b/js/id/ui/address.js
@@ -33,6 +33,12 @@ iD.ui.preset.address = function() {
 
     function address(selection) {
 
+        selection.append('input')
+            .property('type', 'text')
+            .attr('placeholder', 'Housename')
+            .attr('class', 'addr-housename')
+            .data({ 'key': 'addr:housename' });
+
         selection.append('input')
             .property('type', 'text')
             .attr('placeholder', '123')
diff --git a/js/id/ui/preset.js b/js/id/ui/preset.js
index a497e5f62..7120a390a 100644
--- a/js/id/ui/preset.js
+++ b/js/id/ui/preset.js
@@ -42,7 +42,7 @@ iD.ui.preset = function() {
 
     // generate form fields for a given field.
     function input(d) {
-        var i;
+        var i, wrap;
         switch (d.type) {
             case 'text':
                 i = this.append('input')
@@ -79,18 +79,20 @@ iD.ui.preset = function() {
                     });
                 break;
             case 'select':
-                this.append('select')
-                    .selectAll('options')
-                    .data([''].concat(d.options.slice()))
-                    .enter().append('option')
-                        .attr('value', function(d) { return d; })
-                        .attr('label', function(d) { return d; });
+                wrap = this.append('span').attr('class', 'input-wrap-position'),
+                i = wrap.append('input').attr('type', 'text');
+                wrap.call(d3.combobox().data(d.options.map(function(d) {
+                    return {
+                        title: d,
+                        value: d
+                    };
+                })));
                 break;
             case 'combo':
-                var w = this.append('span').attr('class', 'input-wrap-position'),
-                    combobox = d3.combobox();
-                i = w.append('input').attr('type', 'text');
-                w.call(combobox);
+                var combobox = d3.combobox();
+                wrap = this.append('span').attr('class', 'input-wrap-position'),
+                i = wrap.append('input').attr('type', 'text');
+                wrap.call(combobox);
                 taginfo.values({
                     key: d.key
                 }, function(err, data) {
diff --git a/js/id/ui/taglist.js b/js/id/ui/taglist.js
index 09cbe52e6..2a0d4af62 100644
--- a/js/id/ui/taglist.js
+++ b/js/id/ui/taglist.js
@@ -14,8 +14,9 @@ iD.ui.Taglist = function() {
                 .text('Additional tags')
                 .on('click', function() {
                     wrap.call(iD.ui.Toggle(wrap.classed('hide')));
-                })
-        };
+                    selection.node().parentNode.scrollTop += 200;
+                });
+        }
 
         var wrap = selection.append('div');