hotlink tags

kevinmarks · Apr 15, 2012 · 8ddd675 · 8ddd675
1 parent 1269b2c
commit 8ddd675
Show file tree

Hide file tree

Showing 4 changed files with 25 additions and 11 deletions.
diff --git a/public/grid.css b/public/grid.css
@@ -18,6 +18,9 @@ a:hover {color: #cb2027; text-decoration: underline;}
 textarea, input {padding: 5px; line-height: 1em; color: #8c7e7e; background: #fcf9f9; border: 1px solid; border-color: #ddd #e1dfdf #d1cdcd; box-shadow: inset 0 0 2px rgba(255,255,255,0.75); -moz-box-shadow: inset 0 0 2px rgba(255,255,255,0.75); -webkit-box-shadow: inset 0 0 2px rgba(255,255,255,0.75);}
 textarea:focus, input:focus {background-color: #fff; box-shadow: inset 0 1px 1px rgba(34,29,29,0.1); -moz-box-shadow: inset 0 1px 1px rgba(34,29,29,0.1); -webkit-box-shadow: inset 0 1px 1px rgba(34,29,29,0.1);}
 
+.header { font-size: 3em; background-color:#fff; display:inline; }
+img .logo {float:left;display:inline;}
+
 .item { width: 192px; padding: 15px 15px 0; font-size: 11px; background-color: #fff; box-shadow: 0 1px 3px rgba(34,25,25,0.4); -moz-box-shadow: 0 1px 2px rgba(34,25,25,0.4); -webkit-box-shadow: 0 1px 3px rgba(34,25,25,0.4); float: left; margin:10px;}
 .item .holder {position: relative;}
 .item .PriceContainer {position: absolute; z-index: 2; top: -15px; left: -15px; width: 110px; height: 110px; overflow: hidden;}

diff --git a/public/grid.js b/public/grid.js
@@ -1,8 +1,11 @@
+  $(function(){
 
-$(function(){
-  $('#grid').masonry({
-    // options
-    itemSelector : '.item',
-    isAnimated: true
-  });
-});
+    var $container = $('#grid');
+
+    $container.imagesLoaded( function(){
+      $container.masonry({
+        itemSelector : '.item'
+      });
+    });
+
+  });
diff --git a/views/index.jade b/views/index.jade
@@ -5,10 +5,14 @@ html
     script(src='http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js')
     script(src='/jquery.masonry.min.js')
     script(src='/grid.js')
-    link(rel='stylesheet', href='grid.css')
+    link(rel='stylesheet', href='/grid.css')
   body
     div.header
-      img.logo(src="images/pgram2.png") p One site to the tune of another
+      a.imglink(href="/")
+        img.logo(src="/images/pgram2.png") 
+      form(method="post",action="/")
+        label enter a tag
+        input(type="text",id="tag",name="tag")
     div#grid
         each image in images
           div.item
@@ -26,7 +30,7 @@ html
                 -if (image.tags) 
                   onto
                   each tag in image.tags
-                    #{tag}, 
+                    a(href="/tag/#{tag}")#{tag} , 
             div.convo.comments
               each comment in image.comments.data
                 div.comment

diff --git a/web.js b/web.js
@@ -21,13 +21,17 @@ app.get('/', function(request, response) {
     });
 });
 
-app.get('/:tag', function(request, response) {
+app.get('/tag/:tag', function(request, response) {
   instagram.tags.media(request.params.tag,function (images, error) {
     response.render('index', {title:'Hello World!', 
     url: request.headers.host, images:images});
     });
 });
 
+app.post('/', function(request, response) {
+  response.redirect('/tag/'+request.body.tag);
+});
+
 
 var port = process.env.PORT || 3000;
 app.listen(port, function() {