Separate pins & listings

backend/build/server.js

@@ -78,7 +78,7 @@
 
 	router.get('/search/listings', function () {
 	  var _ref = _asyncToGenerator(regeneratorRuntime.mark(function _callee(req, res, next) {
-	    var bounds, minPrice, maxPrice, minSize, maxSize, rooms, adType, category, sort, page, properties, query, _bounds$split$map, _bounds$split$map2, lat1, lng1, lat2, lng2, box, price, and, allRooms, or, size, allCategories, _or, cnt, all;
+	    var bounds, minPrice, maxPrice, minSize, maxSize, rooms, adType, category, sort, page, pins, properties, query, _bounds$split$map, _bounds$split$map2, lat1, lng1, lat2, lng2, box, price, and, allRooms, or, size, allCategories, _or, cnt, all;
 
 	    return regeneratorRuntime.wrap(function _callee$(_context) {
 	      while (1) {
@@ -95,6 +95,7 @@
 	            category = req.query.category;
 	            sort = req.query.sort;
 	            page = req.query.page || 0;
+	            pins = req.query.pins || false;
 	            properties = db.collection('listings');
 	            query = {};
 
@@ -190,37 +191,42 @@
 	              });
 	            }
 
-	            //query = Object.assign(query, {
-	            //"_id": 1
-	            //});
-
 	            console.log('QUERY: ', query);
-	            _context.next = 24;
+	            _context.next = 25;
 	            return properties.find(query).count();
 
-	          case 24:
+	          case 25:
 	            cnt = _context.sent;
 
 
 	            res.header('X-Total-Count', cnt);
 
-	            //if (lastRecordId) {
+	            all = properties.find(query, {
-	            //query = Object.assign(query, {
-	            //"_id": {
-	            //"$gt": new ObjectID(lastRecordId)
-	            //}
-	            //});
-	            //}
-
-	            _context.next = 28;
-	            return properties.find(query, {
 	              //"sort": [['field1','asc'], ['field2','desc']]
 	              "sort": [['price', 'asc']]
-	            }).skip(20 * page).limit(20).toArray();
+	            });
 
-	          case 28:
+	            if (!(pins !== "true")) {
+	              _context.next = 34;
+	              break;
+	            }
+
+	            _context.next = 31;
+	            return all.skip(20 * page).limit(20).toArray();
+
+	          case 31:
+	            all = _context.sent;
+	            _context.next = 37;
+	            break;
+
+	          case 34:
+	            _context.next = 36;
+	            return all.toArray();
+
+	          case 36:
 	            all = _context.sent;
 
+	          case 37:
 
 	            if (all.length > 0) {
 	              res.header('X-Last-Record-Id', [].concat(_toConsumableArray(all)).pop()._id);
@@ -228,22 +234,22 @@
 
 	            res.json(all);
 	            res.end();
-	            _context.next = 38;
+	            _context.next = 46;
 	            break;
 
-	          case 34:
+	          case 42:
-	            _context.prev = 34;
+	            _context.prev = 42;
 	            _context.t0 = _context['catch'](0);
 
 	            console.log('error:', _context.t0);
 	            next(_context.t0);
 
-	          case 38:
+	          case 46:
 	          case 'end':
 	            return _context.stop();
 	        }
 	      }
-	    }, _callee, undefined, [[0, 34]]);
+	    }, _callee, undefined, [[0, 42]]);
 	  }));
 
 	  return function (_x, _x2, _x3) {

backend/server.js

@@ -26,6 +26,7 @@ router.get('/search/listings', async (req, res, next) => {
     const category     = req.query.category;
     const sort         = req.query.sort;
     const page         = req.query.page || 0;
+    const pins         = req.query.pins || false;
 
     const properties = db.collection('listings');
     let query        = {};
@@ -115,27 +116,21 @@ router.get('/search/listings', async (req, res, next) => {
       });
     }
 
-    //query = Object.assign(query, {
-      //"_id": 1
-    //});
-
     console.log('QUERY: ', query);
     const cnt = await properties.find(query).count();
 
     res.header('X-Total-Count', cnt);
 
-    //if (lastRecordId) {
+    let all = properties.find(query, {
-      //query = Object.assign(query, {
-        //"_id": {
-          //"$gt": new ObjectID(lastRecordId)
-        //}
-      //});
-    //}
-
-    const all = await properties.find(query, {
       //"sort": [['field1','asc'], ['field2','desc']]
       "sort": [['price','asc']]
-    }).skip(20 * page).limit(20).toArray();
+    });
+
+    if (pins !== "true") {
+      all = await all.skip(20 * page).limit(20).toArray();
+    } else {
+      all = await all.toArray();
+    }
 
     if (all.length > 0) {
       res.header('X-Last-Record-Id', [...all].pop()._id);

web/components/Main.js

@@ -128,12 +128,7 @@ class Main extends React.Component {
     return seen.findIndex(s => s === id) !== -1
   }
 
-  /*
+  loadPins () {
-   * Refreshes search
-   */
-  refreshListings(more = false) {
-    console.log('refreshListings');
-
     const map = this.map;
     const {
       rooms,
@@ -153,7 +148,8 @@ class Main extends React.Component {
       minPrice,
       maxPrice,
       category,
-      page: this.state.page
+      page: this.state.page,
+      pins: true
     });
 
 
@@ -248,16 +244,69 @@ class Main extends React.Component {
       }
 
       this.dispatch({
-        type: 'LISTINGS_LOADED',
+        type: 'PINS_LOADED',
         action: {
-          listings: data,
+          newMarkers
-          newMarkers,
-          more,
-          totalCount
         }
       });
       });
     })
+
+  }
+
+  /*
+   * Refreshes search
+   */
+  refreshListings(more = false) {
+    console.log('refreshListings');
+
+    this.loadPins();
+
+    const map = this.map;
+    const {
+      rooms,
+      minSize,
+      maxSize,
+      minPrice,
+      maxPrice,
+      category
+    } = this.state.filters;
+
+    const bounds     = map.getBounds();
+    const properties = loadProperties({
+      bounds: bounds.toUrlValue(),
+      rooms,
+      minSize,
+      maxSize,
+      minPrice,
+      maxPrice,
+      category,
+      page: this.state.page
+    });
+
+
+    properties
+    .then(p => {
+      return {
+        body: p.text(),
+        totalCount: p.headers.get('X-Total-Count')
+      };
+    })
+    .then(({body, totalCount}) => {
+      body.then(p => {
+        console.log('results_received: ', totalCount);
+        const data = JSON.parse(p);
+
+        this.dispatch({
+          type: 'LISTINGS_LOADED',
+          action: {
+            listings: data,
+            more,
+            totalCount
+          }
+        });
+      });
+    })
   }
 
   /*

web/lib/api.js

@@ -8,7 +8,8 @@ export const loadProperties = ({
   maxSize  = '',
   rooms    = {},
   category = {},
-    page = 1
+  page = 1,
+  pins = false
 }) => {
   const allRooms = Object
     .keys(rooms)
@@ -22,13 +23,9 @@ export const loadProperties = ({
 
   // TODO: handle errors
   //return fetch(process.env.API_URL + '/api/search', {
-    let url = `http://localhost:3001/api/search/listings?bounds=${bounds}&minPrice=${minPrice}&maxPrice=${maxPrice}&rooms=${allRooms}&minSize=${minSize}&maxSize=${maxSize}&category=${allCategories}&page=${page}`
+    let url = `http://localhost:3001/api/search/listings?bounds=${bounds}&minPrice=${minPrice}&maxPrice=${maxPrice}&rooms=${allRooms}&minSize=${minSize}&maxSize=${maxSize}&category=${allCategories}&page=${page}&pins=${pins}`
 
-    //if (lastRecordId) {
+  return fetch(url, {
-      //url += `&lastRecordId=${lastRecordId}`;
-    //}
-
-    return fetch(url, {
     //credentials: 'include'
   });
 

web/lib/handlers.js

@@ -86,6 +86,13 @@ const listingsLoaded = ({ type, action }, component) => {
   });
 };
 
+const pinsLoaded = ({ type, action }, component) => {
+  component.setState({
+  }, () => {
+    component.markers = action.newMarkers;
+  });
+};
+
 const expandDescription = ({ type, action }, component) => {
   component.setState({
     descriptionExpanded: true
@@ -259,7 +266,8 @@ const handlers = {
   ON_LISTING_MOUSE_OVER: onListingMouseOver,
   BACK_TO_RESULTS: backToResults,
   LOAD_MORE_LISTINGS: loadMoreListings,
-  MAP_IDLE: mapIdle
+  MAP_IDLE: mapIdle,
+  PINS_LOADED: pinsLoaded
 };
 
 export const handleMessage = ({ type, action }, component) => {