senaduka/old-kivi
1
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

Basic pagination working

Browse Source
This commit is contained in:
Edin Dazdarevic
2017-04-07 04:50:46 +02:00
parent 5515774d17
commit 0fcee4a741
6 changed files with 90 additions and 85 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
web/lib/api.js
View File

@@ -8,7 +8,7 @@ export const loadProperties = ({
maxSize = '',
rooms = {},
category = {},
lastRecordId
page = 1
}) => {
const allRooms = Object
.keys(rooms)
@@ -22,11 +22,11 @@ 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}`
let url = `http://localhost:3001/api/search/listings?bounds=${bounds}&minPrice=${minPrice}&maxPrice=${maxPrice}&rooms=${allRooms}&minSize=${minSize}&maxSize=${maxSize}&category=${allCategories}&page=${page}`
if (lastRecordId) {
url += `&lastRecordId=${lastRecordId}`;
}
//if (lastRecordId) {
//url += `&lastRecordId=${lastRecordId}`;
//}
return fetch(url, {
//credentials: 'include'

58
web/lib/handlers.js
View File

@@ -3,7 +3,7 @@ import { markSeen } from './api';
const setMaxPrice = ({ type, action }, component) => {
const maxPrice = parseFloat(action.maxPrice);
component.setState({
lastRecordId: null,
page: 0,
filters: {
...component.state.filters,
maxPrice: isNaN(maxPrice) ? undefined : maxPrice,
@@ -15,7 +15,7 @@ const setMaxPrice = ({ type, action }, component) => {
const setMinPrice = ({ type, action }, component) => {
const minPrice = parseFloat(action.minPrice);
component.setState({
lastRecordId: null,
page: 0,
filters: {
...component.state.filters,
minPrice: isNaN(minPrice) ? undefined : minPrice,
@@ -27,7 +27,7 @@ const setMinPrice = ({ type, action }, component) => {
const setMinSize = ({ type, action }, component) => {
const minSize = parseFloat(action.minSize);
component.setState({
lastRecordId: null,
page: 0,
filters: {
...component.state.filters,
minSize: isNaN(minSize) ? undefined : minSize,
@@ -39,7 +39,7 @@ const setMinSize = ({ type, action }, component) => {
const setMaxSize = ({ type, action }, component) => {
const maxSize = parseFloat(action.maxSize);
component.setState({
lastRecordId: null,
page: 0,
filters: {
...component.state.filters,
maxSize: isNaN(maxSize) ? undefined : maxSize,
@@ -78,8 +78,8 @@ const listingsLoaded = ({ type, action }, component) => {
component.setState({
listings: action.more ? (new Map([...component.state.listings, ...currentListings])) : currentListings,
lastRecordId: !action.more ? null : action.lastRecordId,
loadingMore: false
loadingMore: false,
totalCount: action.totalCount
}, () => {
component.markers = action.newMarkers;
console.log('ALL LOADED', component.state.listings);
@@ -117,7 +117,7 @@ const viewImage = ({ type, action }, component) => {
const searchPlaceChanged = ({ type, action }, component) => {
component.setState({
listingDetails: false,
lastRecordId: null
page: 0
});
};
@@ -126,7 +126,7 @@ const setRooms = ({ type, action }, component) => {
component.setState(
{
lastRecordId: null,
page: 0,
filters: {
...component.state.filters,
rooms: {
@@ -162,7 +162,7 @@ const setCategory = ({type, action}, component) => {
component.setState(
{
lastRecordId: null,
page: 0,
filters: {
...component.state.filters,
category: {
@@ -220,27 +220,26 @@ const backToResults = ({type, action}, component) => {
const loadMoreListings = ({type, action}, component) => {
console.log('loading more');
component.setState({
loadingMore: true
}, () => {
component.refreshListings(true);
});
const currentPage = component.state.page;
if (currentPage * 20 < component.state.totalCount) {
component.setState({
loadingMore: true,
page: currentPage + 1
}, () => {
component.refreshListings(true);
});
}
}
//const loadMoreListingsLoaded = ({type, action}, component) => {
//const currentListings = new Map();
//for (const listing of action.listings) {
//currentListings.set(listing._id, listing);
//}
//component.setState({
//listings: new Map([...component.state.listings, ...currentListings]),
//lastRecordId: action.lastRecordId
//}, () => {
//component.markers = action.newMarkers;
//});
//}
const mapIdle = ({type, action}, component) => {
component.setState({
page: 0
}, () => {
const scrollElem = document.querySelector('.right-content');
scrollElem.scrollTop = 0;
component.refreshListings();
})
}
const handlers = {
SET_MIN_PRICE: setMinPrice,
@@ -259,7 +258,8 @@ const handlers = {
SET_CATEGORY: setCategory,
ON_LISTING_MOUSE_OVER: onListingMouseOver,
BACK_TO_RESULTS: backToResults,
LOAD_MORE_LISTINGS: loadMoreListings
LOAD_MORE_LISTINGS: loadMoreListings,
MAP_IDLE: mapIdle
};
export const handleMessage = ({ type, action }, component) => {