Separate pins & listings

web/components/Main.js

@@ -128,12 +128,7 @@ class Main extends React.Component {
     return seen.findIndex(s => s === id) !== -1
   }
 
-  /*
-   * Refreshes search
-   */
-  refreshListings(more = false) {
-    console.log('refreshListings');
-
+  loadPins () {
     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,
-          more,
-          totalCount
+          newMarkers
         }
       });
       });
     })
+
+  }
+
+  /*
+   * 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
+          }
+        });
+      });
+    })
   }
 
   /*