#3 #4 Geolocation from browser, show users on the map

app/controllers/offers.server.controller.js

@@ -54,11 +54,9 @@ function fuzzyLocation(location) {
 
 
 /**
- * Create a Offer
+ * Create (or update if exists) a Offer
  */
 exports.create = function(req, res) {
-  console.log('->offer.create');
-
   var offer = new Offer(req.body);
   offer.user = req.user;
 
@@ -98,42 +96,64 @@ exports.create = function(req, res) {
 };
 
 
-/**
- * Update a Offer
- */
-exports.update = function(req, res) {
-  console.log('->offer.read');
-
-};
-
 /**
  * Delete an Offer
  */
 exports.delete = function(req, res) {
   console.log('->offer.delete');
-
 };
 
 /**
  * List of Offers
  */
 exports.list = function(req, res) {
-  console.log('->offer.list');
+  Offer.find( {
+        $or: [
+          { status: 'yes' },
+          { status: 'maybe' }
+        ],
+        locationFuzzy: {
+            $geoWithin: {
+                $box: [
+                        [Number(req.query.northEastLng), Number(req.query.northEastLat)],
+                        [Number(req.query.southWestLng), Number(req.query.southWestLat)]
+                      ]
+            }
+          }
+        },
+        'locationFuzzy status user'
+        )
+        .exec(function(err, offers) {
+          if (err) {
+            return res.status(400).send({
+              message: errorHandler.getErrorMessage(err)
+            });
+          } else {
+
+            /*
+             * Could return something like this here already (so no need to refactor at frontend):
+             *
+             * lat: marker.locationFuzzy[0],
+             * lng: marker.locationFuzzy[1],
+             * user: marker.user,
+             * icon: $scope.icons[marker.status]
+             */
+            res.jsonp(offers);
+          }
+        });
 };
 
+
 /**
  * Show the current Offer
  */
 exports.read = function(req, res) {
-  console.log('->offer.read');
   res.jsonp(req.offer);
 };
 
 
 // Offer reading middleware
 exports.offerByUserID = function(req, res, next, userId) {
-  console.log('->offer.offerByUserID: ' + userId);
-
   Offer.findOne({
       user: userId
     })
@@ -174,7 +194,6 @@ exports.offerByUserID = function(req, res, next, userId) {
  * Offer authorization middleware
  */
 exports.hasAuthorization = function(req, res, next) {
-  console.log('->offer.hasAuthorization');
   if (req.offer.user.id !== req.user.id) {
     return res.status(403).send('User is not authorized');
   }

app/routes/offers.server.routes.js

@@ -13,7 +13,7 @@ module.exports = function(app) {
 
 		app.route('/offers/:userId')
 			.get(users.requiresLogin, offers.read)
-			.put(users.requiresLogin, offers.hasAuthorization, offers.update)
+			//.put(users.requiresLogin, offers.hasAuthorization, offers.update)
 			.delete(users.requiresLogin, offers.hasAuthorization, offers.delete);
 
 	// Finish by binding the middleware

bower.json

@@ -22,6 +22,7 @@
     "select2": "~3.4.5",
     "selectize": "~0.8.5",
     "angular-leaflet-directive": "~0.7.8",
-    "leaflet.markercluster": "~0.4.0"
+    "leaflet.markercluster": "~0.4.0",
+    "ngGeolocation": "~0.0.4"
   }
 }

config/env/all.js

@@ -49,6 +49,7 @@ module.exports = {
 				'public/lib/leaflet/dist/leaflet-src.js',
 				'public/lib/leaflet.markercluster/dist/leaflet.markercluster.js',
 				'public/lib/angular-leaflet-directive/dist/angular-leaflet-directive.js',
+				'public/lib/ngGeolocation/ngGeolocation.js',
 			]
 		},
     less: [

public/config.js

@@ -18,7 +18,8 @@ var ApplicationConfiguration = (function() {
 	                                            'angularMoment',
 	                                            'angular-medium-editor',
 	                                            'perfect_scrollbar',
-																							'leaflet-directive'
+																							'leaflet-directive',
+																							'ngGeolocation'
 	                                          ];
 
 	// Add a new vertical module

public/modules/core/controllers/header.client.controller.js

@@ -1,7 +1,7 @@
 'use strict';
 
-angular.module('core').controller('HeaderController', ['$scope', '$log', '$filter', 'Authentication', 'Menus', 'Socket',
-	function($scope, $log, $filter, Authentication, Menus, Socket) {
+angular.module('core').controller('HeaderController', ['$scope', '$log', '$filter', '$geolocation', 'Authentication', 'Menus', 'Socket',
+	function($scope, $log, $filter, $geolocation, Authentication, Menus, Socket) {
 
 		// @todo: show info popup when this happens
     Socket.on('reconnect', function () {
@@ -12,6 +12,12 @@ angular.module('core').controller('HeaderController', ['$scope', '$log', '$filte
       $log.log('Attempting to re-connect to the server');
     });
 
+		// Makes it faster for other controllers to load this if we get it already now
+		// @todo: should this be at some MainController?
+		$scope.position = $geolocation.getCurrentPosition({
+			timeout: 60000 // 1min
+		});
+
 		$scope.authentication = Authentication;
 		$scope.isCollapsed = false;
 		$scope.isHidden = false;

public/modules/core/less/panels.less

@@ -46,4 +46,9 @@
     &.panel-disabled {
       opacity: 0.4;
     }
+    &.panel-loading {
+      &, * {
+        color: lighten(@gray-lighter, 2%) !important;
+      }
+    }
 }

public/modules/messages/config/messages.client.config.js

@@ -5,6 +5,6 @@ angular.module('messages').run(['Menus',
 	function(Menus) {
 		// Set top bar menu items
 		// This menu has only icon and no text label
-		Menus.addMenuItem('topuserbar', '', 'messages', 'messages', 'messages', null, null, 0, 'comments fa-lg');
+		Menus.addMenuItem('topuserbar', '', 'messages', 'messages', '/messages', null, null, 0, 'comments fa-lg');
 	}
 ]);

public/modules/offers/controllers/add-offer.client.controller.js

@@ -5,22 +5,26 @@
 /*global jQuery:false */
 
 
-angular.module('offers').controller('AddOfferController', ['$scope', '$http', '$timeout', '$state', '$stateParams', 'Offers', 'Authentication',
-	function($scope, $http, $timeout, $state, $stateParams, Offers, Authentication) {
+angular.module('offers').controller('AddOfferController', ['$scope', '$rootScope', '$http', '$timeout', '$state', '$stateParams', '$geolocation', 'Offers', 'Authentication',
+	function($scope, $rootScope, $http, $timeout, $state, $stateParams, $geolocation, Offers, Authentication) {
 
 		$scope.authentication = Authentication;
 
-    $scope.isLoading = true;
+    $scope.isLoading = false;
 
 		$scope.offer = false;
 
+		$scope.position = $geolocation.getCurrentPosition({
+			timeout: 60000 // 1min
+		});
+
 		// Leaflet
 		angular.extend($scope, {
 			center: {
 				// Default to Europe
-				lat: $scope.offer ? $scope.offer.location[0] : 48.6908333333,
-				lng: $scope.offer ? $scope.offer.location[1] : 9.14055555556,
-				zoom: $scope.offer ? 16 : 4
+				lat: 48.6908333333,
+				lng: 9.14055555556,
+				zoom: 4
 			},
 			layers: {
 				baselayers: {
@@ -65,6 +69,15 @@ angular.module('offers').controller('AddOfferController', ['$scope', '$http', '$
 				  else {
 				  	offer.maxGuests = 1;
 				  	offer.status = 'yes';
+
+						// Center map to user's location
+						$scope.position.then(function(position){
+							if(position.coords.latitude && position.coords.longitude) {
+								$scope.center.lat = position.coords.latitude;
+							  $scope.center.lng = position.coords.longitude;
+								$scope.center.zoom = 13;
+						  }
+						});
 				  }
 
 				  // Determine new status from URL, overrides previous status

public/modules/offers/views/view-offers.client.view.html

@@ -25,11 +25,11 @@
     <div ng-show="offer.status !== 'no'">
       <div ng-show="offer.description" ng-bind-html="offer.description | trustedHtml"></div>
       <p class="offer-restrictions">
-        <em ng-show="offer.maxGuests > 1">At most {{offer.maxGuests}} guests</em>
-        <em ng-show="offer.maxGuests === 1">At most one guest</em>
-        <em ng-show="offer.maxGuests === 0">Zero guests</em>
+        <small ng-show="offer.description && user._id === profile.id" class="pull-right"><a ui-sref="offer" class="text-muted">edit</a></small>
+        <small ng-show="offer.maxGuests > 1">At most {{offer.maxGuests}} guests.</small>
+        <small ng-show="offer.maxGuests === 1">At most one guest.</small>
+        <small ng-show="offer.maxGuests === 0">Zero guests.</small>
       </p>
-      <small ng-show="offer.description && user._id === profile.id" class="pull-right"><a ui-sref="offer" class="text-muted">edit</a></small>
     </div>
     <!-- /Hosting: yes | maybe -->
 

public/modules/search/config/search.client.config.js

@@ -4,6 +4,7 @@
 angular.module('search').run(['Menus',
   function(Menus) {
     // Set top bar menu items
-    Menus.addMenuItem('topbar', 'Search', 'search', 'search');
+    Menus.addMenuItem('topbar', 'Search', 'search', 'search', '/search', null, null, 0, 'search fa-lg');
+
   }
 ]);