created .findById

app/controllers/vacations.js

@@ -21,3 +21,9 @@ exports.index = function(req, res){
   });
 };
 
+exports.show = function(req, res){
+  // console.log(req.body);
+  Vacation.findById(req.params.id, function(err, v){
+    res.render('vacations/show', {vacation:v, moment:moment});
+  });
+};

app/models/vacation.js

@@ -1,5 +1,7 @@
 'use strict';
 
+var Mongo = require('mongodb');
+
 function Vacation(o){
   this.name = o.name.trim();
   this.startDate = new Date(o.from);
@@ -24,6 +26,11 @@ Vacation.save = function(o, cb){
   });
 };
 
+Vacation.findById = function(id, cb){
+  id = Mongo.ObjectID(id);
+  Vacation.collection.findOne({_id:id}, cb);
+};
+
 module.exports = Vacation;
 /* Will need later:
 Vacation.collection.update({_id:id}, {$set:{balance:a.balance}, $inc:{numTransacts:1}, $push:{transactions:t}}, function(){

app/routes/routes.js

@@ -22,6 +22,7 @@ module.exports = function(app, express){
   app.get('/vacations/new', vacations.init);
   app.post('/vacations', vacations.create);
   app.get('/vacations', vacations.index);
+  app.get('/vacations/:id', vacations.show);
 
   console.log('Routes Loaded');
 };

app/static/js/user/vacation-show.js

@@ -0,0 +1,37 @@
+/* jshint unused:false, camelcase:false */
+/* global AmCharts:true, google:true */
+
+(function(){
+  'use strict';
+
+  var map;
+
+  $(document).ready(function(){
+    var p = getPosition();
+    initMap(p.lat, p.lng, 7);
+    addMarker(p.lat, p.lng, p.name);
+  });
+
+  function addMarker(lat, lng, name){
+    var latLng = new google.maps.LatLng(lat, lng);
+    new google.maps.Marker({map: map, position: latLng, title: name, animation: google.maps.Animation.DROP, icon: '/img/zombie.gif'});
+  }
+
+  function getPosition(){
+    var pos = {};
+    pos.name = $('#map').attr('data-name');
+    pos.lat = parseFloat($('#map').attr('data-lat'));
+    pos.lng = parseFloat($('#map').attr('data-lng'));
+    console.log(pos);
+    return pos;
+  }
+
+  function initMap(lat, lng, zoom){
+    var styles = [{'featureType':'landscape','stylers':[{'hue':'#F1FF00'},{'saturation':-27.4},{'lightness':9.4},{'gamma':1}]},{'featureType':'road.highway','stylers':[{'hue':'#0099FF'},{'saturation':-20},{'lightness':36.4},{'gamma':1}]},{'featureType':'road.arterial','stylers':[{'hue':'#00FF4F'},{'saturation':0},{'lightness':0},{'gamma':1}]},{'featureType':'road.local','stylers':[{'hue':'#FFB300'},{'saturation':-38},{'lightness':11.2},{'gamma':1}]},{'featureType':'water','stylers':[{'hue':'#00B6FF'},{'saturation':4.2},{'lightness':-63.4},{'gamma':1}]},{'featureType':'poi','stylers':[{'hue':'#9FFF00'},{'saturation':0},{'lightness':0},{'gamma':1}]}],
+        mapOptions = {center: new google.maps.LatLng(lat, lng), zoom: zoom, mapTypeId: google.maps.MapTypeId.ROADMAP, styles: styles};
+    map = new google.maps.Map(document.getElementById('map'), mapOptions);
+  }
+
+})();
+
+

app/static/js/user/vacations.js

@@ -7,9 +7,33 @@
   var map;
 
   $(document).ready(function(){
-    initMap(36.2, -86.7, 8);
+    initMap(36.2, -86.7, 2);
+    var positions = getPositions();
+    // console.log(positions);
+    positions.forEach(function(pos){
+      // console.log(pos);
+      addMarker(pos.lat, pos.lng, pos.name);
+    });
   });
 
+  function addMarker(lat, lng, name){
+    var latLng = new google.maps.LatLng(lat, lng);
+    new google.maps.Marker({map: map, position: latLng, title: name, animation: google.maps.Animation.DROP, icon: '/img/zombie.gif'});
+  }
+
+  function getPositions(){
+    var positions = $('table tbody tr').toArray().map(function(o){
+      var pos = {};
+      pos.name = $(o).attr('data-name');
+      pos.lat = parseFloat($(o).attr('data-lat'));
+      pos.lng = parseFloat($(o).attr('data-lng'));
+      // console.log(pos);
+      return pos;
+    });
+    // console.log(positions);
+    return positions;
+  }
+
   function initMap(lat, lng, zoom){
     var styles = [{'featureType':'landscape','stylers':[{'hue':'#F1FF00'},{'saturation':-27.4},{'lightness':9.4},{'gamma':1}]},{'featureType':'road.highway','stylers':[{'hue':'#0099FF'},{'saturation':-20},{'lightness':36.4},{'gamma':1}]},{'featureType':'road.arterial','stylers':[{'hue':'#00FF4F'},{'saturation':0},{'lightness':0},{'gamma':1}]},{'featureType':'road.local','stylers':[{'hue':'#FFB300'},{'saturation':-38},{'lightness':11.2},{'gamma':1}]},{'featureType':'water','stylers':[{'hue':'#00B6FF'},{'saturation':4.2},{'lightness':-63.4},{'gamma':1}]},{'featureType':'poi','stylers':[{'hue':'#9FFF00'},{'saturation':0},{'lightness':0},{'gamma':1}]}],
         mapOptions = {center: new google.maps.LatLng(lat, lng), zoom: zoom, mapTypeId: google.maps.MapTypeId.ROADMAP, styles: styles};

app/views/vacations/index.jade

@@ -18,8 +18,8 @@ block content
             th Lng
         tbody
           each vacation in vacations
-            tr
-              td= vacation.name
+            tr(data-lat='#{vacation.lat}', data-lng='#{vacation.lng}', data-name='#{vacation.name}')
+              td: a(href='/vacations/#{vacation._id}')= vacation.name
               td= momentjs(vacation.startDate).format('MMM Do YY')
               td= momentjs(vacation.endDate).format('MMM Do YY')
               td= vacation.lat.toFixed(3)

app/views/vacations/show.jade

@@ -0,0 +1,36 @@
+extends ../shared/template
+block content
+  .container-fluid
+    .row
+      .col-xs-6
+        #map(data-lat='#{vacation.lat}', data-lng='#{vacation.lng}', data-name='#{vacation.name}', style='height:300px;')
+      .col-xs-6
+        .row
+          .row
+            .col-xs-12
+              h3= vacation.name
+          .row
+            .col-xs-12
+              table.table
+                tbody
+                  tr
+                    td= moment(vacation.startDate).format('MMM Do YY')
+                    td ------->
+                    td= moment(vacation.endDate).format('MMM Do YY')
+          .row
+            .col-xs-12
+              form.form-horizontal(role='form', method='post', action='/vacations')
+                .form-group
+                  label.col-sm-2.control-label(for='url') Image URL:
+                  .col-sm-10
+                    input.form-control#name(type='text', name='url', placeholder='http://image.com/photo.jpg')
+                .form-group
+                  .col-sm-offset-2.col-sm-10
+                    button.btn.btn-default(type='submit') Add Image
+    .row
+      .col-xs-12
+        h3 Photos Go Here
+
+block scripts
+  script(src='/js/user/vacation-show.js')
+

test/unit/vacation.js

@@ -57,5 +57,16 @@ describe('Vacation', function(){
     });
   });
 
+  describe('.findById', function(){
+    it('should find a vacation in database by it\'s ID', function(done){
+      var id = '000000000000000000000003';
+      Vacation.findById(id, function(err, vacation){
+        expect(vacation._id).to.be.instanceof(Mongo.ObjectID);
+        expect(vacation._id.toString()).to.equal(id);
+        done();
+      });
+    });
+  });
+
 });