From c788cbd487b4d61e9f55304560057ee1d41144ab Mon Sep 17 00:00:00 2001
From: Arvind <arvindkhadri@gmail.com>
Date: Wed, 3 Sep 2014 17:50:19 +0530
Subject: [PATCH] Updates to linked data page.         - Images related to tag
 or user are shown below the tags/user         count.       
  - Scroll to the image after the image is loaded.

---
 swtr/static/css/swtmaker.css |    4 +++-
 swtr/static/js/main.js       |   50 +++++-------------------------------------
 swtr/templates/index.html    |   44 ++++++++++++++++++++-----------------
 3 files changed, 32 insertions(+), 66 deletions(-)

diff --git a/swtr/static/css/swtmaker.css b/swtr/static/css/swtmaker.css
index 168d68a..62d03c0 100644
--- a/swtr/static/css/swtmaker.css
+++ b/swtr/static/css/swtmaker.css
@@ -149,7 +149,9 @@ footer {
 }
 #tag-cloud {
     display: none;
-    height:768px;
+}
+#gallery {
+    margin-top: 10em;
 }
 #tags-tag-cloud svg {
     position: absolute;
diff --git a/swtr/static/js/main.js b/swtr/static/js/main.js
index 6a21baa..419b592 100644
--- a/swtr/static/js/main.js
+++ b/swtr/static/js/main.js
@@ -718,7 +718,6 @@
     },
     userTagClicked: function(e) {
       var user = $(e.currentTarget).text();
-      console.log(user);
       var swts = swtr.LDs.filter(function(swt) {
         if(swt.get('who') == user) {
           return swt;
@@ -726,7 +725,7 @@
       });
       swts = _.uniq(swts,'how'.src);
       this.setGalleryView(swts);
-      $(this.el).hide();
+      // $(this.el).hide();
     },
     tagsTagClicked: function(e) {
       var tag = $(e.currentTarget).text();
@@ -738,7 +737,7 @@
         }
       });
       this.setGalleryView(swts);
-      $(this.el).hide();
+      // $(this.el).hide();
     },
     setGalleryView: function(swts) {
       if(this.galleryView) {
@@ -761,31 +760,6 @@
       _.each(weights, function(weight, who) {
         $(this.user_tag_el).append(this.template({weight: weight, who: who}));
       }, this);
-      // d3.layout.cloud().size([1000, 1000])
-      //   .words(words.map(function(d) {
-      //     return {text: d, size: 5};
-      //   }))
-      //   .padding(5)
-      //   .font("Impact")
-      //   .fontSize(function(d) { return d.size; })
-      //   .on("end", this.draw)
-      //   .start();
-    },
-    draw: function (words) {
-      var fill = d3.scale.category20();
-      d3.select("#user-tag-cloud").append("svg")
-        .append("g")
-        .attr("transform", "translate(370,180)")
-        .selectAll("text")
-        .data(words)
-        .enter().append("text")
-        .style("font-size", function(d) { return "16px"; })
-        .style("font-family", "Impact")
-        .style("fill", function(d, i) { return fill(i); })
-        .attr("text-anchor", "middle")
-        .attr("transform", function(d) {
-          return "translate(" + [d.x, d.y] + ")";})
-        .text(function(d) { return d.text; });
     },
     renderTagsTagCloud: function() {
       var sweetsWithTags = swtr.LDs.filter(function(k) {
@@ -802,23 +776,6 @@
         $(this.tags_tag_el).append(this.template({weight: weight, who: who}));
       }, this);
 
-    },
-    drawTags: function(words) {
-      var fill = d3.scale.category20();
-        d3.select("#tags-tag-cloud").append("svg")
-        .append("g")
-        .attr("transform", "translate(700,300)")
-        .selectAll("text")
-        .data(words)
-        .enter().append("text")
-        .style("font-size", function(d) { return "20px"; })
-        .style("font-family", "Impact")
-        .style("fill", function(d, i) { return fill(i); })
-        .attr("text-anchor", "middle")
-        .attr("transform", function(d) {
-          return "translate(" + [d.x, d.y] + ")";
-        })
-        .text(function(d) { return d.text; });
     }
   });
 
@@ -833,6 +790,9 @@
       _.each(this.collection, function(model) {
         $(this.el).append(this.template(model.toJSON()));
       }, this);
+      $('html, body').animate({
+        scrollTop: $("#gallery").offset().top
+      }, 1000);
     },
     setUp: function() {
       if(!$(this.el).is(':visible')) {
diff --git a/swtr/templates/index.html b/swtr/templates/index.html
index d173fd2..5738a9d 100644
--- a/swtr/templates/index.html
+++ b/swtr/templates/index.html
@@ -162,39 +162,43 @@
       <div id="search-page" class="page"></div>
 
       <div id="linked-data-page" class="page">
-        <div id="tag-cloud" class="col-md-4">
+        <div id="tag-cloud" class="row">
           <div class="panel-group" id="accordion">
-            <div class="panel panel-default">
-              <div class="panel-heading">
-                <h4 class="panel-title">
+            <div class="col-md-6">
+              <div class="panel panel-default">
+                <div class="panel-heading">
                   <a data-toggle="collapse" data-parent="#accordion" href="#tag-list">
-                    Tags
+                    <h4 class="panel-title">
+                      Tags
+                    </h4>
                   </a>
-                </h4>
-              </div>
-              <div id="tag-list" class="panel-collapse collapse in">
-                <div class="panel-body">
-                  <ul class="list-group" id="tags-tag-cloud"></ul>
+                </div>
+                <div id="tag-list" class="panel-collapse collapse in">
+                  <div class="panel-body">
+                    <ul class="list-group" id="tags-tag-cloud"></ul>
+                  </div>
                 </div>
               </div>
             </div>
-            <div class="panel panel-default">
-              <div class="panel-heading">
-                <h4 class="panel-title">
+            <div class="col-md-6">
+              <div class="panel panel-default">
+                <div class="panel-heading">
                   <a data-toggle="collapse" data-parent="#accordion" href="#user-list">
-                    User
+                    <h4 class="panel-title">
+                      User
+                    </h4>
                   </a>
-                </h4>
-              </div>
-              <div id="user-list" class="panel-collapse collapse in">
-                <div class="panel-body">
-                  <ul class="list-group" id="user-tag-cloud"></ul>
+                </div>
+                <div id="user-list" class="panel-collapse collapse in">
+                  <div class="panel-body">
+                    <ul class="list-group" id="user-tag-cloud"></ul>
+                  </div>
                 </div>
               </div>
             </div>
           </div>
         </div>
-        <div id="gallery">
+        <div id="gallery" class="row">
         </div>
       </div>
 
-- 
1.7.10.4