added click on image to get current details

JustinBeckwith · Sep 29, 2012 · 4e3fdbf · 4e3fdbf
1 parent 83e39d1
commit 4e3fdbf
Show file tree

Hide file tree

Showing 2 changed files with 27 additions and 3 deletions.
diff --git a/frontend/routes/home.js b/frontend/routes/home.js
@@ -1,3 +1,4 @@
+var request = require('request');
 
 module.exports = function (app, nconf, serviceBusService) {
 
@@ -11,4 +12,14 @@ module.exports = function (app, nconf, serviceBusService) {
         console.log(req.params.city);
         res.render('images.html');
     });
+
+    // service calls to get media details
+    app.get('/media/:id', function (req, res) {
+        console.log('request for media: ' + req.params.id);
+        var url = "https://api.instagram.com/v1/media/" + req.params.id + "/?client_id=" + nconf.get('instagramClientId');
+        console.log(url);
+        request(url, function (e, r, b) {
+            res.end(b);            
+        });
+    });
 }
diff --git a/frontend/views/images.html b/frontend/views/images.html
@@ -8,6 +8,7 @@
         <script>
             $(function () {
                 var socket = io.connect();
+
                 socket.on('connect', function () {
                     var city = '';
                     var urlParts = window.location.href.split("/");
@@ -24,15 +25,27 @@
                         socket.emit('setCity', { city: city });
                     }
                 });
+
                 socket.on('newPic', function (pic) {
                     console.log('got a new pic!!!')
                     var p = JSON.parse(pic);
                     console.log(p);
-                    for (var i = 0; i< p.data.length; i++ ) {
+                    for (var i = 0; i < p.data.length; i++) {
-                        $("#pics").append($("<img src=\"" + p.data[i].images.low_resolution.url + "\">"));
+                        $("#pics").prepend($("<img data-id=\"" + p.data[i].id + "\" src=\"" + p.data[i].images.low_resolution.url + "\">"));
                     }
                 });
-            })            
+
+
+                $("#pics").on("click", "img", function () {
+
+                    var id = $(this).data("id");
+                    console.log(id);
+                    $.ajax("/media/" + id).done(function (data) {
+                        console.log(data);
+                    });
+                });
+
+            });            
         </script>
     </head>
     <body>