From 0af6337132b55abefe6c0f925c5e8ac38bc15a47 Mon Sep 17 00:00:00 2001 From: Edin Dazdarevic Date: Tue, 4 Apr 2017 03:00:04 +0200 Subject: [PATCH] Started to work on filters --- web/.babelrc | 2 +- web/components/Filters.js | 19 ++++++--- web/components/Main.js | 3 +- web/dist/main.css | 8 ++++ web/lib/handlers.js | 16 +++++++ web/package.json | 1 + web/yarn.lock | 87 +++++++++++++++++++++++++++++++++++++++ yarn.lock | 6 +++ 8 files changed, 135 insertions(+), 7 deletions(-) create mode 100644 yarn.lock diff --git a/web/.babelrc b/web/.babelrc index 86c445f..adf5ae6 100644 --- a/web/.babelrc +++ b/web/.babelrc @@ -1,3 +1,3 @@ { - "presets": ["es2015", "react"] + "presets": ["es2015", "react", "stage-3"] } diff --git a/web/components/Filters.js b/web/components/Filters.js index 9def1d6..2a427c1 100644 --- a/web/components/Filters.js +++ b/web/components/Filters.js @@ -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 (
@@ -25,7 +34,7 @@ export default class Filters extends React.Component {
- CIJENA + CIJENA
@@ -68,16 +77,16 @@ export default class Filters extends React.Component { BROJ SOBA
-
+
Garsonjera
-
+
2
-
+
3
-
+
4+
diff --git a/web/components/Main.js b/web/components/Main.js index 23044e9..a8f5ae8 100644 --- a/web/components/Main.js +++ b/web/components/Main.js @@ -14,7 +14,8 @@ class Main extends React.Component { listings: (new Map()), imageIndex: 0, filters: { - minPrice: 0 + minPrice: 0, + rooms: {} } }; } diff --git a/web/dist/main.css b/web/dist/main.css index 7a32694..05aa0a3 100644 --- a/web/dist/main.css +++ b/web/dist/main.css @@ -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; diff --git a/web/lib/handlers.js b/web/lib/handlers.js index 0cac030..6f2dcb7 100644 --- a/web/lib/handlers.js +++ b/web/lib/handlers.js @@ -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 } diff --git a/web/package.json b/web/package.json index 522e576..7a8995d 100644 --- a/web/package.json +++ b/web/package.json @@ -10,6 +10,7 @@ "author": "", "license": "ISC", "dependencies": { + "babel-preset-stage-3": "^6.22.0", "react": "^15.3.2", "react-dom": "^15.3.2" }, diff --git a/web/yarn.lock b/web/yarn.lock index c85d506..c57e84e 100644 --- a/web/yarn.lock +++ b/web/yarn.lock @@ -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" diff --git a/yarn.lock b/yarn.lock new file mode 100644 index 0000000..1223deb --- /dev/null +++ b/yarn.lock @@ -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" +