From ffaea10ca44cbd84759155dcc60939d5709ca5fb Mon Sep 17 00:00:00 2001
From: saman bb <samanpwbb@gmail.com>
Date: Mon, 25 Mar 2013 21:34:40 -0400
Subject: [PATCH] sketchy version of reference animation.

---
 css/app.css               |  5 ++++-
 js/id/ui/preset.js        | 22 +++++++++++++++++++---
 js/id/ui/tag_reference.js |  1 -
 3 files changed, 23 insertions(+), 5 deletions(-)

diff --git a/css/app.css b/css/app.css
index 82dac0161..79921ba30 100644
--- a/css/app.css
+++ b/css/app.css
@@ -1249,7 +1249,6 @@ div.combobox {
     border-right: 1px solid #CCC;
 }
 
-
 .tag-row:first-child input.key {
     border-top: 1px solid #CCC;
     border-top-left-radius: 4px;
@@ -1309,6 +1308,10 @@ div.combobox {
 
 /* Tag reference */
 
+.tag-help { 
+    overflow: hidden;
+}
+
 img.wiki-image { 
     float: left;
     max-width: 33.3333%;
diff --git a/js/id/ui/preset.js b/js/id/ui/preset.js
index 076a35d4a..2afb1c1f8 100644
--- a/js/id/ui/preset.js
+++ b/js/id/ui/preset.js
@@ -143,13 +143,29 @@ iD.ui.preset = function(context, entity, preset) {
 
         selection.selectAll('.tag-help')
             .style('display', function(field) {
-                return field.showingReference ? 'block' : 'none';
+                return field.showingReference ? 'block' : 'block';
             })
             .each(function(field) {
                 if (field.showingReference) {
                     d3.select(this)
-                        .call(iD.ui.TagReference(entity, {key: field.key}));
-                }
+                    .call(iD.ui.TagReference(entity, {key: field.key}))
+                    .style('max-height', '0px')
+                    .style('padding-top', '0px')
+                    .style('opacity', '0')
+                    .transition()
+                    .duration(200)
+                    .style('padding-top', '20px')
+                    .style('max-height', '200px')
+                    .style('opacity', '1');
+               } else { 
+                 d3.select(this)
+                    .call(iD.ui.TagReference(entity, {key: field.key}))
+                    .transition()
+                    .duration(200)
+                    .style('max-height', '0px')
+                    .style('padding-top', '0px')
+                    .style('opacity', '0');                       
+               }
             });
 
         selection.exit()
diff --git a/js/id/ui/tag_reference.js b/js/id/ui/tag_reference.js
index 8d6b132a1..b2c90dbf4 100644
--- a/js/id/ui/tag_reference.js
+++ b/js/id/ui/tag_reference.js
@@ -59,7 +59,6 @@ iD.ui.TagReference = function(entity, tag) {
                 .attr('target', '_blank')
                 .attr('href', 'http://wiki.openstreetmap.org/wiki/' + docs.title)
                 .text(t('inspector.reference'));
-
         });
     }
 };