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

Started to work on filters

Browse Source
This commit is contained in:
Edin Dazdarevic
2017-04-04 03:00:04 +02:00
parent a6c5ee80e8
commit 0af6337132
8 changed files with 135 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
web/.babelrc
View File

@@ -1,3 +1,3 @@
{
"presets": ["es2015", "react"]
"presets": ["es2015", "react", "stage-3"]
}

19
web/components/Filters.js
View File

@@ -12,8 +12,17 @@ export default class Filters extends React.Component {
this.props.dispatch({type: 'SET_MIN_PRICE', action: {minPrice: e.target.value}})
}
onRoomsClick(rooms) {
console.log('rooms:', rooms);
this.props.dispatch({type: 'SET_ROOMS', action: {rooms}});
}
render() {
const {filters} = this.props;
const selectedRooms = (val) => filters.rooms[val] ? 'selected' : '';
return (
<div className="filters">
<div className="filters-close">
@@ -25,7 +34,7 @@ export default class Filters extends React.Component {
<div className="filter-row">
<div className="filter-title">
CIJENA
CIJENA
</div>
<div className="filter-content value-between-box">
@@ -68,16 +77,16 @@ export default class Filters extends React.Component {
BROJ SOBA
</div>
<div className="filter-content">
<div className="filter-btn property-rooms-studio-btn">
<div onClick={this.onRoomsClick.bind(this, 'Garsonjera')} className={`filter-btn property-rooms-studio-btn ${selectedRooms('Garsonjera')}`}>
Garsonjera
</div>
<div className="filter-btn property-rooms-btn">
<div onClick={this.onRoomsClick.bind(this, 2)} className={`filter-btn property-rooms-btn ${selectedRooms(2)}`}>
2
</div>
<div className="filter-btn property-rooms-btn">
<div onClick={this.onRoomsClick.bind(this, 3)} className={`filter-btn property-rooms-btn ${selectedRooms(3)}`}>
3
</div>
<div className="filter-btn property-rooms-btn">
<div onClick={this.onRoomsClick.bind(this, '4+')} className={`filter-btn property-rooms-btn ${selectedRooms('4+')}`}>
4+
</div>
</div>

3
web/components/Main.js
View File

@@ -14,7 +14,8 @@ class Main extends React.Component {
listings: (new Map()),
imageIndex: 0,
filters: {
minPrice: 0
minPrice: 0,
rooms: {}
}
};
}

8
web/dist/main.css vendored
View File

@@ -235,6 +235,14 @@ html {
width: 58px;
}
.filter-btn.selected {
background-color: #b6d53b;
}
.filter-btn.selected:hover {
background-color: #b6d53b;
}
.property-rooms-studio {
width: 93px;
flex-grow: 2;

16
web/lib/handlers.js
View File

@@ -1,6 +1,7 @@
const setMinPrice = ({type, action}, component) => {
component.setState({
filters: {
...component.state.filters,
minPrice: parseFloat(action.minPrice) || 0
}
})
@@ -61,6 +62,20 @@ const searchPlaceChanged = ({type, action}, component) => {
});
}
const setRooms = ({type, action}, component) => {
const prevRooms = (component.state.filters.rooms || {});
component.setState({
filters: {
...component.state.filters,
rooms: {
...prevRooms,
[action.rooms]: !prevRooms[action.rooms]
}
}
});
}
const handlers = {
'SET_MIN_PRICE': setMinPrice,
'LISTINGS_LOADED': listingsLoaded,
@@ -69,6 +84,7 @@ const handlers = {
'NEXT_IMAGE': nextImage,
'VIEW_IMAGE': viewImage,
'SEARCH_PLACE_CHANGED': searchPlaceChanged,
'SET_ROOMS': setRooms,
'VIEW_LISTING_DETAILS': viewListingDetails
}

1
web/package.json
View File

@@ -10,6 +10,7 @@
"author": "",
"license": "ISC",
"dependencies": {
"babel-preset-stage-3": "^6.22.0",
"react": "^15.3.2",
"react-dom": "^15.3.2"
},

87
web/yarn.lock
View File

@@ -177,6 +177,14 @@ babel-generator@^6.24.0:
source-map "^0.5.0"
trim-right "^1.0.1"
babel-helper-builder-binary-assignment-operator-visitor@^6.22.0:
version "6.22.0"
resolved "https://registry.yarnpkg.com/babel-helper-builder-binary-assignment-operator-visitor/-/babel-helper-builder-binary-assignment-operator-visitor-6.22.0.tgz#29df56be144d81bdeac08262bfa41d2c5e91cdcd"
dependencies:
babel-helper-explode-assignable-expression "^6.22.0"
babel-runtime "^6.22.0"
babel-types "^6.22.0"
babel-helper-builder-react-jsx@^6.23.0:
version "6.23.0"
resolved "https://registry.yarnpkg.com/babel-helper-builder-react-jsx/-/babel-helper-builder-react-jsx-6.23.0.tgz#d53fc8c996e0bc56d0de0fc4cc55a7138395ea4b"
@@ -204,6 +212,14 @@ babel-helper-define-map@^6.23.0:
babel-types "^6.23.0"
lodash "^4.2.0"
babel-helper-explode-assignable-expression@^6.22.0:
version "6.22.0"
resolved "https://registry.yarnpkg.com/babel-helper-explode-assignable-expression/-/babel-helper-explode-assignable-expression-6.22.0.tgz#c97bf76eed3e0bae4048121f2b9dae1a4e7d0478"
dependencies:
babel-runtime "^6.22.0"
babel-traverse "^6.22.0"
babel-types "^6.22.0"
babel-helper-function-name@^6.22.0, babel-helper-function-name@^6.23.0:
version "6.23.0"
resolved "https://registry.yarnpkg.com/babel-helper-function-name/-/babel-helper-function-name-6.23.0.tgz#25742d67175c8903dbe4b6cb9d9e1fcb8dcf23a6"
@@ -243,6 +259,16 @@ babel-helper-regex@^6.22.0:
babel-types "^6.22.0"
lodash "^4.2.0"
babel-helper-remap-async-to-generator@^6.22.0:
version "6.22.0"
resolved "https://registry.yarnpkg.com/babel-helper-remap-async-to-generator/-/babel-helper-remap-async-to-generator-6.22.0.tgz#2186ae73278ed03b8b15ced089609da981053383"
dependencies:
babel-helper-function-name "^6.22.0"
babel-runtime "^6.22.0"
babel-template "^6.22.0"
babel-traverse "^6.22.0"
babel-types "^6.22.0"
babel-helper-replace-supers@^6.22.0, babel-helper-replace-supers@^6.23.0:
version "6.23.0"
resolved "https://registry.yarnpkg.com/babel-helper-replace-supers/-/babel-helper-replace-supers-6.23.0.tgz#eeaf8ad9b58ec4337ca94223bacdca1f8d9b4bfd"
@@ -282,6 +308,18 @@ babel-plugin-check-es2015-constants@^6.22.0:
dependencies:
babel-runtime "^6.22.0"
babel-plugin-syntax-async-functions@^6.8.0:
version "6.13.0"
resolved "https://registry.yarnpkg.com/babel-plugin-syntax-async-functions/-/babel-plugin-syntax-async-functions-6.13.0.tgz#cad9cad1191b5ad634bf30ae0872391e0647be95"
babel-plugin-syntax-async-generators@^6.5.0:
version "6.13.0"
resolved "https://registry.yarnpkg.com/babel-plugin-syntax-async-generators/-/babel-plugin-syntax-async-generators-6.13.0.tgz#6bc963ebb16eccbae6b92b596eb7f35c342a8b9a"
babel-plugin-syntax-exponentiation-operator@^6.8.0:
version "6.13.0"
resolved "https://registry.yarnpkg.com/babel-plugin-syntax-exponentiation-operator/-/babel-plugin-syntax-exponentiation-operator-6.13.0.tgz#9ee7e8337290da95288201a6a57f4170317830de"
babel-plugin-syntax-flow@^6.18.0:
version "6.18.0"
resolved "https://registry.yarnpkg.com/babel-plugin-syntax-flow/-/babel-plugin-syntax-flow-6.18.0.tgz#4c3ab20a2af26aa20cd25995c398c4eb70310c8d"
@@ -290,6 +328,30 @@ babel-plugin-syntax-jsx@^6.3.13, babel-plugin-syntax-jsx@^6.8.0:
version "6.18.0"
resolved "https://registry.yarnpkg.com/babel-plugin-syntax-jsx/-/babel-plugin-syntax-jsx-6.18.0.tgz#0af32a9a6e13ca7a3fd5069e62d7b0f58d0d8946"
babel-plugin-syntax-object-rest-spread@^6.8.0:
version "6.13.0"
resolved "https://registry.yarnpkg.com/babel-plugin-syntax-object-rest-spread/-/babel-plugin-syntax-object-rest-spread-6.13.0.tgz#fd6536f2bce13836ffa3a5458c4903a597bb3bf5"
babel-plugin-syntax-trailing-function-commas@^6.22.0:
version "6.22.0"
resolved "https://registry.yarnpkg.com/babel-plugin-syntax-trailing-function-commas/-/babel-plugin-syntax-trailing-function-commas-6.22.0.tgz#ba0360937f8d06e40180a43fe0d5616fff532cf3"
babel-plugin-transform-async-generator-functions@^6.22.0:
version "6.22.0"
resolved "https://registry.yarnpkg.com/babel-plugin-transform-async-generator-functions/-/babel-plugin-transform-async-generator-functions-6.22.0.tgz#a720a98153a7596f204099cd5409f4b3c05bab46"
dependencies:
babel-helper-remap-async-to-generator "^6.22.0"
babel-plugin-syntax-async-generators "^6.5.0"
babel-runtime "^6.22.0"
babel-plugin-transform-async-to-generator@^6.22.0:
version "6.22.0"
resolved "https://registry.yarnpkg.com/babel-plugin-transform-async-to-generator/-/babel-plugin-transform-async-to-generator-6.22.0.tgz#194b6938ec195ad36efc4c33a971acf00d8cd35e"
dependencies:
babel-helper-remap-async-to-generator "^6.22.0"
babel-plugin-syntax-async-functions "^6.8.0"
babel-runtime "^6.22.0"
babel-plugin-transform-es2015-arrow-functions@^6.22.0:
version "6.22.0"
resolved "https://registry.yarnpkg.com/babel-plugin-transform-es2015-arrow-functions/-/babel-plugin-transform-es2015-arrow-functions-6.22.0.tgz#452692cb711d5f79dc7f85e440ce41b9f244d221"
@@ -458,6 +520,14 @@ babel-plugin-transform-es2015-unicode-regex@^6.22.0:
babel-runtime "^6.22.0"
regexpu-core "^2.0.0"
babel-plugin-transform-exponentiation-operator@^6.22.0:
version "6.22.0"
resolved "https://registry.yarnpkg.com/babel-plugin-transform-exponentiation-operator/-/babel-plugin-transform-exponentiation-operator-6.22.0.tgz#d57c8335281918e54ef053118ce6eb108468084d"
dependencies:
babel-helper-builder-binary-assignment-operator-visitor "^6.22.0"
babel-plugin-syntax-exponentiation-operator "^6.8.0"
babel-runtime "^6.22.0"
babel-plugin-transform-flow-strip-types@^6.22.0:
version "6.22.0"
resolved "https://registry.yarnpkg.com/babel-plugin-transform-flow-strip-types/-/babel-plugin-transform-flow-strip-types-6.22.0.tgz#84cb672935d43714fdc32bce84568d87441cf7cf"
@@ -465,6 +535,13 @@ babel-plugin-transform-flow-strip-types@^6.22.0:
babel-plugin-syntax-flow "^6.18.0"
babel-runtime "^6.22.0"
babel-plugin-transform-object-rest-spread@^6.22.0:
version "6.23.0"
resolved "https://registry.yarnpkg.com/babel-plugin-transform-object-rest-spread/-/babel-plugin-transform-object-rest-spread-6.23.0.tgz#875d6bc9be761c58a2ae3feee5dc4895d8c7f921"
dependencies:
babel-plugin-syntax-object-rest-spread "^6.8.0"
babel-runtime "^6.22.0"
babel-plugin-transform-react-display-name@^6.23.0:
version "6.23.0"
resolved "https://registry.yarnpkg.com/babel-plugin-transform-react-display-name/-/babel-plugin-transform-react-display-name-6.23.0.tgz#4398910c358441dc4cef18787264d0412ed36b37"
@@ -552,6 +629,16 @@ babel-preset-react@^6.16.0:
babel-plugin-transform-react-jsx-source "^6.22.0"
babel-preset-flow "^6.23.0"
babel-preset-stage-3:
version "6.22.0"
resolved "https://registry.yarnpkg.com/babel-preset-stage-3/-/babel-preset-stage-3-6.22.0.tgz#a4e92bbace7456fafdf651d7a7657ee0bbca9c2e"
dependencies:
babel-plugin-syntax-trailing-function-commas "^6.22.0"
babel-plugin-transform-async-generator-functions "^6.22.0"
babel-plugin-transform-async-to-generator "^6.22.0"
babel-plugin-transform-exponentiation-operator "^6.22.0"
babel-plugin-transform-object-rest-spread "^6.22.0"
babel-register@^6.24.0:
version "6.24.0"
resolved "https://registry.yarnpkg.com/babel-register/-/babel-register-6.24.0.tgz#5e89f8463ba9970356d02eb07dabe3308b080cfd"

6
yarn.lock Normal file
View File

@@ -0,0 +1,6 @@
# THIS IS AN AUTOGENERATED FILE. DO NOT EDIT THIS FILE DIRECTLY.
# yarn lockfile v1
lodash:
version "4.17.4"
resolved "https://registry.yarnpkg.com/lodash/-/lodash-4.17.4.tgz#78203a4d1c328ae1d86dca6460e369b57f4055ae"