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

complete frontend restyling

Browse Source
This commit is contained in:
lion
2019-01-29 20:30:43 +01:00
parent c7aa9ca499
commit 2559afc1e8
34 changed files with 1235 additions and 145 deletions
Download Patch File Download Diff File Expand all files Collapse all files

400
frontend-react/package-lock.json generated
View File

@@ -902,6 +902,152 @@
"resolved": "https://registry.npmjs.org/@emotion/weak-memoize/-/weak-memoize-0.2.2.tgz",
"integrity": "sha512-n/VQ4mbfr81aqkx/XmVicOLjviMuy02eenSdJY33SVA7S2J42EU0P1H0mOogfYedb3wXA0d/LVtBrgTSm04WEA=="
},
"@material-ui/core": {
"version": "3.9.0",
"resolved": "https://registry.npmjs.org/@material-ui/core/-/core-3.9.0.tgz",
"integrity": "sha512-9fxu0B9zx/TfiU0OJmwRFk+I+2J7fcXzTfQl+ZPxqlVRrPDqTHnMZlqWRJjlHCe3AVXlgpJ6/a4QCvGEohEbIQ==",
"requires": {
"@babel/runtime": "^7.2.0",
"@material-ui/system": "^3.0.0-alpha.0",
"@material-ui/utils": "^3.0.0-alpha.2",
"@types/jss": "^9.5.6",
"@types/react-transition-group": "^2.0.8",
"brcast": "^3.0.1",
"classnames": "^2.2.5",
"csstype": "^2.5.2",
"debounce": "^1.1.0",
"deepmerge": "^3.0.0",
"dom-helpers": "^3.2.1",
"hoist-non-react-statics": "^3.2.1",
"is-plain-object": "^2.0.4",
"jss": "^9.8.7",
"jss-camel-case": "^6.0.0",
"jss-default-unit": "^8.0.2",
"jss-global": "^3.0.0",
"jss-nested": "^6.0.1",
"jss-props-sort": "^6.0.0",
"jss-vendor-prefixer": "^7.0.0",
"keycode": "^2.1.9",
"normalize-scroll-left": "^0.1.2",
"popper.js": "^1.14.1",
"prop-types": "^15.6.0",
"react-event-listener": "^0.6.2",
"react-transition-group": "^2.2.1",
"recompose": "0.28.0 - 0.30.0",
"warning": "^4.0.1"
},
"dependencies": {
"@babel/runtime": {
"version": "7.3.1",
"resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.3.1.tgz",
"integrity": "sha512-7jGW8ppV0ant637pIqAcFfQDDH1orEPGJb8aXfUozuCU3QqX7rX4DA8iwrbPrR1hcH0FTTHz47yQnk+bl5xHQA==",
"requires": {
"regenerator-runtime": "^0.12.0"
}
},
"regenerator-runtime": {
"version": "0.12.1",
"resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.12.1.tgz",
"integrity": "sha512-odxIc1/vDlo4iZcfXqRYFj0vpXFNoGdKMAUieAlFYO6m/nl5e9KR/beGf41z4a1FI+aQgtjhuaSlDxQ0hmkrHg=="
},
"warning": {
"version": "4.0.2",
"resolved": "https://registry.npmjs.org/warning/-/warning-4.0.2.tgz",
"integrity": "sha512-wbTp09q/9C+jJn4KKJfJfoS6VleK/Dti0yqWSm6KMvJ4MRCXFQNapHuJXutJIrWV0Cf4AhTdeIe4qdKHR1+Hug==",
"requires": {
"loose-envify": "^1.0.0"
}
}
}
},
"@material-ui/icons": {
"version": "3.0.2",
"resolved": "https://registry.npmjs.org/@material-ui/icons/-/icons-3.0.2.tgz",
"integrity": "sha512-QY/3gJnObZQ3O/e6WjH+0ah2M3MOgLOzCy8HTUoUx9B6dDrS18vP7Ycw3qrDEKlB6q1KNxy6CZHm5FCauWGy2g==",
"requires": {
"@babel/runtime": "^7.2.0",
"recompose": "0.28.0 - 0.30.0"
},
"dependencies": {
"@babel/runtime": {
"version": "7.3.1",
"resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.3.1.tgz",
"integrity": "sha512-7jGW8ppV0ant637pIqAcFfQDDH1orEPGJb8aXfUozuCU3QqX7rX4DA8iwrbPrR1hcH0FTTHz47yQnk+bl5xHQA==",
"requires": {
"regenerator-runtime": "^0.12.0"
}
},
"regenerator-runtime": {
"version": "0.12.1",
"resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.12.1.tgz",
"integrity": "sha512-odxIc1/vDlo4iZcfXqRYFj0vpXFNoGdKMAUieAlFYO6m/nl5e9KR/beGf41z4a1FI+aQgtjhuaSlDxQ0hmkrHg=="
}
}
},
"@material-ui/system": {
"version": "3.0.0-alpha.1",
"resolved": "https://registry.npmjs.org/@material-ui/system/-/system-3.0.0-alpha.1.tgz",
"integrity": "sha512-5EihYa6Ct5mA/shfFSjWO8e/whV+otbXAduYfiL34GH+Mh4vZs+wjcy0P80XA/cDIwSgkQ7vTvvY1x04AgIz4w==",
"requires": {
"@babel/runtime": "7.1.2",
"deepmerge": "^2.0.1",
"prop-types": "^15.6.0",
"warning": "^4.0.1"
},
"dependencies": {
"@babel/runtime": {
"version": "7.1.2",
"resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.1.2.tgz",
"integrity": "sha512-Y3SCjmhSupzFB6wcv1KmmFucH6gDVnI30WjOcicV10ju0cZjak3Jcs67YLIXBrmZYw1xCrVeJPbycFwrqNyxpg==",
"requires": {
"regenerator-runtime": "^0.12.0"
}
},
"deepmerge": {
"version": "2.2.1",
"resolved": "https://registry.npmjs.org/deepmerge/-/deepmerge-2.2.1.tgz",
"integrity": "sha512-R9hc1Xa/NOBi9WRVUWg19rl1UB7Tt4kuPd+thNJgFZoxXsTz7ncaPaeIm+40oSGuP33DfMb4sZt1QIGiJzC4EA=="
},
"regenerator-runtime": {
"version": "0.12.1",
"resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.12.1.tgz",
"integrity": "sha512-odxIc1/vDlo4iZcfXqRYFj0vpXFNoGdKMAUieAlFYO6m/nl5e9KR/beGf41z4a1FI+aQgtjhuaSlDxQ0hmkrHg=="
},
"warning": {
"version": "4.0.2",
"resolved": "https://registry.npmjs.org/warning/-/warning-4.0.2.tgz",
"integrity": "sha512-wbTp09q/9C+jJn4KKJfJfoS6VleK/Dti0yqWSm6KMvJ4MRCXFQNapHuJXutJIrWV0Cf4AhTdeIe4qdKHR1+Hug==",
"requires": {
"loose-envify": "^1.0.0"
}
}
}
},
"@material-ui/utils": {
"version": "3.0.0-alpha.3",
"resolved": "https://registry.npmjs.org/@material-ui/utils/-/utils-3.0.0-alpha.3.tgz",
"integrity": "sha512-rwMdMZptX0DivkqBuC+Jdq7BYTXwqKai5G5ejPpuEDKpWzi1Oxp+LygGw329FrKpuKeiqpcymlqJTjmy+quWng==",
"requires": {
"@babel/runtime": "^7.2.0",
"prop-types": "^15.6.0",
"react-is": "^16.6.3"
},
"dependencies": {
"@babel/runtime": {
"version": "7.3.1",
"resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.3.1.tgz",
"integrity": "sha512-7jGW8ppV0ant637pIqAcFfQDDH1orEPGJb8aXfUozuCU3QqX7rX4DA8iwrbPrR1hcH0FTTHz47yQnk+bl5xHQA==",
"requires": {
"regenerator-runtime": "^0.12.0"
}
},
"regenerator-runtime": {
"version": "0.12.1",
"resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.12.1.tgz",
"integrity": "sha512-odxIc1/vDlo4iZcfXqRYFj0vpXFNoGdKMAUieAlFYO6m/nl5e9KR/beGf41z4a1FI+aQgtjhuaSlDxQ0hmkrHg=="
}
}
},
"@mrmlnc/readdir-enhanced": {
"version": "2.2.1",
"resolved": "https://registry.npmjs.org/@mrmlnc/readdir-enhanced/-/readdir-enhanced-2.2.1.tgz",
@@ -943,11 +1089,42 @@
"loader-utils": "^1.1.0"
}
},
"@types/jss": {
"version": "9.5.7",
"resolved": "https://registry.npmjs.org/@types/jss/-/jss-9.5.7.tgz",
"integrity": "sha512-OZimStu2QdDMtZ0h72JXqvLVbWUjXd5ZLk8vxLmfuC/nM1AabRyyGoxSufnzixrbpEcVcyy/JV5qeQu2JnjVZw==",
"requires": {
"csstype": "^2.0.0",
"indefinite-observable": "^1.0.1"
}
},
"@types/prop-types": {
"version": "15.5.8",
"resolved": "https://registry.npmjs.org/@types/prop-types/-/prop-types-15.5.8.tgz",
"integrity": "sha512-3AQoUxQcQtLHsK25wtTWIoIpgYjH3vSDroZOUr7PpCHw/jLY1RB9z9E8dBT/OSmwStVgkRNvdh+ZHNiomRieaw=="
},
"@types/q": {
"version": "1.5.1",
"resolved": "https://registry.npmjs.org/@types/q/-/q-1.5.1.tgz",
"integrity": "sha512-eqz8c/0kwNi/OEHQfvIuJVLTst3in0e7uTKeuY+WL/zfKn0xVujOTp42bS/vUUokhK5P2BppLd9JXMOMHcgbjA=="
},
"@types/react": {
"version": "16.7.20",
"resolved": "https://registry.npmjs.org/@types/react/-/react-16.7.20.tgz",
"integrity": "sha512-Qd5RWkwl6SL7R2XzLk/cicjVQm1Mhc6HqXY5Ei4pWd1Vi8Fkbd5O0sA398x8fRSTPAuHdDYD9nrWmJMYTJI0vQ==",
"requires": {
"@types/prop-types": "*",
"csstype": "^2.2.0"
}
},
"@types/react-transition-group": {
"version": "2.0.15",
"resolved": "https://registry.npmjs.org/@types/react-transition-group/-/react-transition-group-2.0.15.tgz",
"integrity": "sha512-S0QnNzbHoWXDbKBl/xk5dxA4FT+BNlBcI3hku991cl8Cz3ytOkUMcCRtzdX11eb86E131bSsQqy5WrPCdJYblw==",
"requires": {
"@types/react": "*"
}
},
"@types/tapable": {
"version": "1.0.2",
"resolved": "https://registry.npmjs.org/@types/tapable/-/tapable-1.0.2.tgz",
@@ -2434,6 +2611,11 @@
"repeat-element": "^1.1.2"
}
},
"brcast": {
"version": "3.0.1",
"resolved": "https://registry.npmjs.org/brcast/-/brcast-3.0.1.tgz",
"integrity": "sha512-eI3yqf9YEqyGl9PCNTR46MGvDylGtaHjalcz6Q3fAPnP/PhpKkkve52vFdfGpwp4VUvK6LUr4TQN+2stCrEwTg=="
},
"brorand": {
"version": "1.1.0",
"resolved": "https://registry.npmjs.org/brorand/-/brorand-1.1.0.tgz",
@@ -2723,6 +2905,11 @@
"supports-color": "^5.3.0"
}
},
"change-emitter": {
"version": "0.1.6",
"resolved": "https://registry.npmjs.org/change-emitter/-/change-emitter-0.1.6.tgz",
"integrity": "sha1-6LL+PX8at9aaMhma/5HqaTFAlRU="
},
"chardet": {
"version": "0.7.0",
"resolved": "https://registry.npmjs.org/chardet/-/chardet-0.7.0.tgz",
@@ -3450,6 +3637,14 @@
"resolved": "https://registry.npmjs.org/css-url-regex/-/css-url-regex-1.1.0.tgz",
"integrity": "sha1-g4NCMMyfdMRX3lnuvRVD/uuDt+w="
},
"css-vendor": {
"version": "0.3.8",
"resolved": "https://registry.npmjs.org/css-vendor/-/css-vendor-0.3.8.tgz",
"integrity": "sha1-ZCHP0wNM5mT+dnOXL9ARn8KJQfo=",
"requires": {
"is-in-browser": "^1.0.2"
}
},
"css-what": {
"version": "2.1.2",
"resolved": "https://registry.npmjs.org/css-what/-/css-what-2.1.2.tgz",
@@ -3741,6 +3936,11 @@
"resolved": "https://registry.npmjs.org/date-now/-/date-now-0.1.4.tgz",
"integrity": "sha1-6vQ5/U1ISK105cx9vvIAZyueNFs="
},
"debounce": {
"version": "1.2.0",
"resolved": "https://registry.npmjs.org/debounce/-/debounce-1.2.0.tgz",
"integrity": "sha512-mYtLl1xfZLi1m4RtQYlZgJUNQjl4ZxVnHzIR8nLLgi4q1YT8o/WM+MK/f8yfcc9s5Ir5zRaPZyZU6xs1Syoocg=="
},
"debug": {
"version": "4.1.1",
"resolved": "https://registry.npmjs.org/debug/-/debug-4.1.1.tgz",
@@ -3774,6 +3974,11 @@
"resolved": "https://registry.npmjs.org/deep-is/-/deep-is-0.1.3.tgz",
"integrity": "sha1-s2nW+128E+7PUk+RsHD+7cNXzzQ="
},
"deepmerge": {
"version": "3.1.0",
"resolved": "https://registry.npmjs.org/deepmerge/-/deepmerge-3.1.0.tgz",
"integrity": "sha512-/TnecbwXEdycfbsM2++O3eGiatEFHjjNciHEwJclM+T5Kd94qD1AP+2elP/Mq0L5b9VZJao5znR01Mz6eX8Seg=="
},
"default-gateway": {
"version": "2.7.2",
"resolved": "https://registry.npmjs.org/default-gateway/-/default-gateway-2.7.2.tgz",
@@ -4184,6 +4389,14 @@
"resolved": "https://registry.npmjs.org/encodeurl/-/encodeurl-1.0.2.tgz",
"integrity": "sha1-rT/0yG7C0CkyL1oCw6mmBslbP1k="
},
"encoding": {
"version": "0.1.12",
"resolved": "https://registry.npmjs.org/encoding/-/encoding-0.1.12.tgz",
"integrity": "sha1-U4tm8+5izRq1HsMjgp0flIDHS+s=",
"requires": {
"iconv-lite": "~0.4.13"
}
},
"end-of-stream": {
"version": "1.4.1",
"resolved": "https://registry.npmjs.org/end-of-stream/-/end-of-stream-1.4.1.tgz",
@@ -5189,6 +5402,35 @@
"bser": "^2.0.0"
}
},
"fbjs": {
"version": "0.8.17",
"resolved": "https://registry.npmjs.org/fbjs/-/fbjs-0.8.17.tgz",
"integrity": "sha1-xNWY6taUkRJlPWWIsBpc3Nn5D90=",
"requires": {
"core-js": "^1.0.0",
"isomorphic-fetch": "^2.1.1",
"loose-envify": "^1.0.0",
"object-assign": "^4.1.0",
"promise": "^7.1.1",
"setimmediate": "^1.0.5",
"ua-parser-js": "^0.7.18"
},
"dependencies": {
"core-js": {
"version": "1.2.7",
"resolved": "https://registry.npmjs.org/core-js/-/core-js-1.2.7.tgz",
"integrity": "sha1-ZSKUwUZR2yj6k70tX/KYOk8IxjY="
},
"promise": {
"version": "7.3.1",
"resolved": "https://registry.npmjs.org/promise/-/promise-7.3.1.tgz",
"integrity": "sha512-nolQXZ/4L+bP/UGlkfaIujX9BKxGwmQ9OT4mOt5yvy8iK1h3wqTEJCijzGANTCCl9nWjY41juyAn2K3Q1hLLTg==",
"requires": {
"asap": "~2.0.3"
}
}
}
},
"figgy-pudding": {
"version": "3.5.1",
"resolved": "https://registry.npmjs.org/figgy-pudding/-/figgy-pudding-3.5.1.tgz",
@@ -7021,6 +7263,11 @@
"resolved": "https://registry.npmjs.org/https-browserify/-/https-browserify-1.0.0.tgz",
"integrity": "sha1-7AbBDgo0wPL68Zn3/X/Hj//QPHM="
},
"hyphenate-style-name": {
"version": "1.0.2",
"resolved": "https://registry.npmjs.org/hyphenate-style-name/-/hyphenate-style-name-1.0.2.tgz",
"integrity": "sha1-MRYKNpMK2vH8BMYHT360FGXU7Es="
},
"iconv-lite": {
"version": "0.4.24",
"resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.4.24.tgz",
@@ -7109,6 +7356,14 @@
"resolved": "https://registry.npmjs.org/imurmurhash/-/imurmurhash-0.1.4.tgz",
"integrity": "sha1-khi5srkoojixPcT7a21XbyMUU+o="
},
"indefinite-observable": {
"version": "1.0.2",
"resolved": "https://registry.npmjs.org/indefinite-observable/-/indefinite-observable-1.0.2.tgz",
"integrity": "sha512-Mps0898zEduHyPhb7UCgNmfzlqNZknVmaFz5qzr0mm04YQ5FGLhAyK/dJ+NaRxGyR6juQXIxh5Ev0xx+qq0nYA==",
"requires": {
"symbol-observable": "1.2.0"
}
},
"indexes-of": {
"version": "1.0.1",
"resolved": "https://registry.npmjs.org/indexes-of/-/indexes-of-1.0.1.tgz",
@@ -7359,6 +7614,11 @@
"is-extglob": "^1.0.0"
}
},
"is-in-browser": {
"version": "1.1.3",
"resolved": "https://registry.npmjs.org/is-in-browser/-/is-in-browser-1.1.3.tgz",
"integrity": "sha1-Vv9NtoOgeMYILrldrX3GLh0E+DU="
},
"is-number": {
"version": "2.1.0",
"resolved": "https://registry.npmjs.org/is-number/-/is-number-2.1.0.tgz",
@@ -7503,6 +7763,15 @@
"resolved": "https://registry.npmjs.org/isobject/-/isobject-3.0.1.tgz",
"integrity": "sha1-TkMekrEalzFjaqH5yNHMvP2reN8="
},
"isomorphic-fetch": {
"version": "2.2.1",
"resolved": "https://registry.npmjs.org/isomorphic-fetch/-/isomorphic-fetch-2.2.1.tgz",
"integrity": "sha1-YRrhrPFPXoH3KVB0coGf6XM1WKk=",
"requires": {
"node-fetch": "^1.0.1",
"whatwg-fetch": ">=0.10.0"
}
},
"isstream": {
"version": "0.1.2",
"resolved": "https://registry.npmjs.org/isstream/-/isstream-0.1.2.tgz",
@@ -8294,6 +8563,55 @@
"verror": "1.10.0"
}
},
"jss": {
"version": "9.8.7",
"resolved": "https://registry.npmjs.org/jss/-/jss-9.8.7.tgz",
"integrity": "sha512-awj3XRZYxbrmmrx9LUSj5pXSUfm12m8xzi/VKeqI1ZwWBtQ0kVPTs3vYs32t4rFw83CgFDukA8wKzOE9sMQnoQ==",
"requires": {
"is-in-browser": "^1.1.3",
"symbol-observable": "^1.1.0",
"warning": "^3.0.0"
}
},
"jss-camel-case": {
"version": "6.1.0",
"resolved": "https://registry.npmjs.org/jss-camel-case/-/jss-camel-case-6.1.0.tgz",
"integrity": "sha512-HPF2Q7wmNW1t79mCqSeU2vdd/vFFGpkazwvfHMOhPlMgXrJDzdj9viA2SaHk9ZbD5pfL63a8ylp4++irYbbzMQ==",
"requires": {
"hyphenate-style-name": "^1.0.2"
}
},
"jss-default-unit": {
"version": "8.0.2",
"resolved": "https://registry.npmjs.org/jss-default-unit/-/jss-default-unit-8.0.2.tgz",
"integrity": "sha512-WxNHrF/18CdoAGw2H0FqOEvJdREXVXLazn7PQYU7V6/BWkCV0GkmWsppNiExdw8dP4TU1ma1dT9zBNJ95feLmg=="
},
"jss-global": {
"version": "3.0.0",
"resolved": "https://registry.npmjs.org/jss-global/-/jss-global-3.0.0.tgz",
"integrity": "sha512-wxYn7vL+TImyQYGAfdplg7yaxnPQ9RaXY/cIA8hawaVnmmWxDHzBK32u1y+RAvWboa3lW83ya3nVZ/C+jyjZ5Q=="
},
"jss-nested": {
"version": "6.0.1",
"resolved": "https://registry.npmjs.org/jss-nested/-/jss-nested-6.0.1.tgz",
"integrity": "sha512-rn964TralHOZxoyEgeq3hXY8hyuCElnvQoVrQwKHVmu55VRDd6IqExAx9be5HgK0yN/+hQdgAXQl/GUrBbbSTA==",
"requires": {
"warning": "^3.0.0"
}
},
"jss-props-sort": {
"version": "6.0.0",
"resolved": "https://registry.npmjs.org/jss-props-sort/-/jss-props-sort-6.0.0.tgz",
"integrity": "sha512-E89UDcrphmI0LzmvYk25Hp4aE5ZBsXqMWlkFXS0EtPkunJkRr+WXdCNYbXbksIPnKlBenGB9OxzQY+mVc70S+g=="
},
"jss-vendor-prefixer": {
"version": "7.0.0",
"resolved": "https://registry.npmjs.org/jss-vendor-prefixer/-/jss-vendor-prefixer-7.0.0.tgz",
"integrity": "sha512-Agd+FKmvsI0HLcYXkvy8GYOw3AAASBUpsmIRvVQheps+JWaN892uFOInTr0DRydwaD91vSSUCU4NssschvF7MA==",
"requires": {
"css-vendor": "^0.3.8"
}
},
"jsx-ast-utils": {
"version": "2.0.1",
"resolved": "https://registry.npmjs.org/jsx-ast-utils/-/jsx-ast-utils-2.0.1.tgz",
@@ -8302,6 +8620,11 @@
"array-includes": "^3.0.3"
}
},
"keycode": {
"version": "2.2.0",
"resolved": "https://registry.npmjs.org/keycode/-/keycode-2.2.0.tgz",
"integrity": "sha1-PQr1bce4uOXLqNCpfxByBO7CKwQ="
},
"killable": {
"version": "1.0.1",
"resolved": "https://registry.npmjs.org/killable/-/killable-1.0.1.tgz",
@@ -8964,6 +9287,15 @@
"lower-case": "^1.1.1"
}
},
"node-fetch": {
"version": "1.7.3",
"resolved": "https://registry.npmjs.org/node-fetch/-/node-fetch-1.7.3.tgz",
"integrity": "sha512-NhZ4CsKx7cYm2vSrBAr2PvFOe6sWDf0UYLRqA6svUYg7+/TSfVAu49jYC4BvQ4Sms9SZgdqGBgroqfDhJdTyKQ==",
"requires": {
"encoding": "^0.1.11",
"is-stream": "^1.0.1"
}
},
"node-forge": {
"version": "0.7.5",
"resolved": "https://registry.npmjs.org/node-forge/-/node-forge-0.7.5.tgz",
@@ -9054,6 +9386,11 @@
"resolved": "https://registry.npmjs.org/normalize-range/-/normalize-range-0.1.2.tgz",
"integrity": "sha1-LRDAa9/TEuqXd2laTShDlFa3WUI="
},
"normalize-scroll-left": {
"version": "0.1.2",
"resolved": "https://registry.npmjs.org/normalize-scroll-left/-/normalize-scroll-left-0.1.2.tgz",
"integrity": "sha512-F9YMRls0zCF6BFIE2YnXDRpHPpfd91nOIaNdDgrx5YMoPLo8Wqj+6jNXHQsYBavJeXP4ww8HCt0xQAKc5qk2Fg=="
},
"normalize-url": {
"version": "3.3.0",
"resolved": "https://registry.npmjs.org/normalize-url/-/normalize-url-3.3.0.tgz",
@@ -9536,6 +9873,11 @@
"resolved": "https://registry.npmjs.org/pnp-webpack-plugin/-/pnp-webpack-plugin-1.1.0.tgz",
"integrity": "sha512-CPCdcFxx7fEcDMWTDjXe2Wypt4JuMt4q5Q2UrpTcyBBkLiCIyPEh/mCGmUWIcNkKGyXwQ9Y2wVhlKm6ketiBNQ=="
},
"popper.js": {
"version": "1.14.6",
"resolved": "https://registry.npmjs.org/popper.js/-/popper.js-1.14.6.tgz",
"integrity": "sha512-AGwHGQBKumlk/MDfrSOf0JHhJCImdDMcGNoqKmKkU+68GFazv3CQ6q9r7Ja1sKDZmYWTckY/uLyEznheTDycnA=="
},
"portfinder": {
"version": "1.0.20",
"resolved": "https://registry.npmjs.org/portfinder/-/portfinder-1.0.20.tgz",
@@ -13521,6 +13863,39 @@
"resolved": "https://registry.npmjs.org/react-error-overlay/-/react-error-overlay-5.1.2.tgz",
"integrity": "sha512-7kEBKwU9R8fKnZJBRa5RSIfay4KJwnYvKB6gODGicUmDSAhQJ7Tdnll5S0RLtYrzRfMVXlqYw61rzrSpP4ThLQ=="
},
"react-event-listener": {
"version": "0.6.5",
"resolved": "https://registry.npmjs.org/react-event-listener/-/react-event-listener-0.6.5.tgz",
"integrity": "sha512-//lCxOM3DQ0+xmTa/u9mI9mm55zCPdIKp89d8MGjlNsOOnXQ5sFDD1eed+sMBzQXKiRBLBMtSg/2T9RJFtfovw==",
"requires": {
"@babel/runtime": "7.2.0",
"prop-types": "^15.6.0",
"warning": "^4.0.1"
},
"dependencies": {
"@babel/runtime": {
"version": "7.2.0",
"resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.2.0.tgz",
"integrity": "sha512-oouEibCbHMVdZSDlJBO6bZmID/zA/G/Qx3H1d3rSNPTD+L8UNKvCat7aKWSJ74zYbm5zWGh0GQN0hKj8zYFTCg==",
"requires": {
"regenerator-runtime": "^0.12.0"
}
},
"regenerator-runtime": {
"version": "0.12.1",
"resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.12.1.tgz",
"integrity": "sha512-odxIc1/vDlo4iZcfXqRYFj0vpXFNoGdKMAUieAlFYO6m/nl5e9KR/beGf41z4a1FI+aQgtjhuaSlDxQ0hmkrHg=="
},
"warning": {
"version": "4.0.2",
"resolved": "https://registry.npmjs.org/warning/-/warning-4.0.2.tgz",
"integrity": "sha512-wbTp09q/9C+jJn4KKJfJfoS6VleK/Dti0yqWSm6KMvJ4MRCXFQNapHuJXutJIrWV0Cf4AhTdeIe4qdKHR1+Hug==",
"requires": {
"loose-envify": "^1.0.0"
}
}
}
},
"react-input-autosize": {
"version": "2.2.1",
"resolved": "https://registry.npmjs.org/react-input-autosize/-/react-input-autosize-2.2.1.tgz",
@@ -14040,6 +14415,26 @@
"util.promisify": "^1.0.0"
}
},
"recompose": {
"version": "0.30.0",
"resolved": "https://registry.npmjs.org/recompose/-/recompose-0.30.0.tgz",
"integrity": "sha512-ZTrzzUDa9AqUIhRk4KmVFihH0rapdCSMFXjhHbNrjAWxBuUD/guYlyysMnuHjlZC/KRiOKRtB4jf96yYSkKE8w==",
"requires": {
"@babel/runtime": "^7.0.0",
"change-emitter": "^0.1.2",
"fbjs": "^0.8.1",
"hoist-non-react-statics": "^2.3.1",
"react-lifecycles-compat": "^3.0.2",
"symbol-observable": "^1.0.4"
},
"dependencies": {
"hoist-non-react-statics": {
"version": "2.5.5",
"resolved": "https://registry.npmjs.org/hoist-non-react-statics/-/hoist-non-react-statics-2.5.5.tgz",
"integrity": "sha512-rqcy4pJo55FTTLWt+bU8ukscqHeE/e9KWvsOW2b/a3afxQZhwkQdT1rPPCJ0rYXdj4vNcasY8zHTH+jF/qStxw=="
}
}
},
"recursive-readdir": {
"version": "2.2.2",
"resolved": "https://registry.npmjs.org/recursive-readdir/-/recursive-readdir-2.2.2.tgz",
@@ -15974,6 +16369,11 @@
"resolved": "https://registry.npmjs.org/typedarray/-/typedarray-0.0.6.tgz",
"integrity": "sha1-hnrHTjhkGHsdPUfZlqeOxciDB3c="
},
"ua-parser-js": {
"version": "0.7.19",
"resolved": "https://registry.npmjs.org/ua-parser-js/-/ua-parser-js-0.7.19.tgz",
"integrity": "sha512-T3PVJ6uz8i0HzPxOF9SWzWAlfN/DavlpQqepn22xgve/5QecC+XMCAtmUNnY7C9StehaV6exjUCI801lOI7QlQ=="
},
"uglify-js": {
"version": "3.4.9",
"resolved": "https://registry.npmjs.org/uglify-js/-/uglify-js-3.4.9.tgz",

2
frontend-react/package.json
View File

@@ -3,6 +3,8 @@
"version": "0.1.0",
"private": true,
"dependencies": {
"@material-ui/core": "^3.9.0",
"@material-ui/icons": "^3.0.2",
"axios": "^0.18.0",
"history": "^4.7.2",
"prettier": "^1.15.3",

7
frontend-react/public/index.html
View File

@@ -13,6 +13,13 @@
homescreen on Android. See https://developers.google.com/web/fundamentals/web-app-manifest/
-->
<link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
<link
rel="stylesheet"
type="text/css"
href="https://fonts.googleapis.com/css?family=Roboto:300,400,500,700|Roboto+Slab:400,700|Material+Icons"
/>
<link rel="stylesheet" href="./style.css" />
<!--
Notice the use of %PUBLIC_URL% in the tags above.
It will be replaced with the URL of the `public` folder during the build.

8
frontend-react/public/style.css Normal file
View File

@@ -0,0 +1,8 @@
html {
font-family: Roboto, sans-serif;
-ms-text-size-adjust: 100%;
-webkit-text-size-adjust: 100%;
}
* {
font-family: Roboto, serif;
}

10
frontend-react/src/assets/checkboxAndRadioStyle.css Normal file
View File

@@ -0,0 +1,10 @@
.radio-style {
color: #e91e63 !important;
}
.checkbox-style {
color: #e91e63 !important;
}
.label-style {
color: white;
}

26
frontend-react/src/assets/dashboardStyle.js Normal file
View File

@@ -0,0 +1,26 @@
import { drawerWidth, transition } from "./globalStyle";
const appStyle = theme => ({
wrapper: {
top: "0",
display: "grid",
minHeight: "750px",
"grid-template-columns": `${drawerWidth}px 1fr`,
"grid-template-areas": `"sidebar content"`,
[theme.breakpoints.down("sm")]: {
"grid-template-areas": `"sidebar" "content"`,
"grid-template-columns": "1fr",
"grid-template-rows": "auto 1fr"
}
},
mainPanel: {
...transition,
overflowScrolling: "touch",
"grid-area": "content",
zIndex: "1",
backgroundColor: "#272727",
backgroundImage: "linear-gradient(180deg,#272727, #21525f)"
}
});
export default appStyle;

42
frontend-react/src/assets/globalStyle.js Normal file
View File

@@ -0,0 +1,42 @@
const drawerWidth = 360;
const transition = {
transition: "all 0.33s cubic-bezier(0.685, 0.0473, 0.346, 1)"
};
const boxShadow = {
boxShadow:
"0 10px 30px -12px rgba(0, 0, 0, 0.42), 0 4px 25px 0px rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(0, 0, 0, 0.2)"
};
const defaultFont = {
fontFamily: '"Roboto", "Helvetica", "Arial", sans-serif',
fontWeight: "300",
lineHeight: "1.5em"
};
const primaryColor = "#e91e63";
const primaryBoxShadow = {
boxShadow:
"0 4px 20px 0px rgba(0, 0, 0, 0.14), 0 7px 10px -5px rgba(233, 30, 99, 0.4)"
};
const defaultBoxShadow = {
border: "0",
borderRadius: "3px",
boxShadow:
"0 10px 20px -12px rgba(0, 0, 0, 0.42), 0 3px 20px 0px rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(0, 0, 0, 0.2)",
padding: "10px 0",
transition: "all 150ms ease 0s"
};
export {
drawerWidth,
transition,
boxShadow,
defaultFont,
primaryColor,
primaryBoxShadow,
defaultBoxShadow
};

BIN
frontend-react/src/assets/img/reactlogo.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 5.6 KiB

BIN
frontend-react/src/assets/img/sidebar-1.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 272 KiB

28
frontend-react/src/assets/rangeStyle.css Normal file
View File

@@ -0,0 +1,28 @@
.rc-slider-handle {
border: solid 2px #e91e63 !important;
}
.rc-slider-handle:hover {
border: solid 2px #e91e63 !important;
}
.rc-slider-rail {
background-color: #e91e63 !important;
width: 20px;
}
.rc-slider-track {
background-color: grey !important;
}
.input-style:after {
border-bottom: 1px solid #e91e63 !important;
}
.input-style {
color: white !important;
width: 80% !important;
margin: 0 auto !important;
position: relative !important;
display: block !important;
margin: 10px auto !important;
}
.rc-slider {
width: 80% !important;
margin: 0 auto !important;
}

171
frontend-react/src/assets/sidebarStyle.js Normal file
View File

@@ -0,0 +1,171 @@
import {
boxShadow,
defaultFont,
primaryColor,
primaryBoxShadow
} from "./globalStyle";
const sidebarStyle = theme => ({
drawerPaper: {
border: "none",
position: "relative",
"overflow-y": "auto",
"overflow-x": "none",
zIndex: "1",
...boxShadow,
"grid-area": "sidebar",
[theme.breakpoints.down("sm")]: {
position: "relative"
}
},
logo: {
position: "relative",
padding: "15px 15px",
zIndex: "4",
"&:after": {
content: '""',
position: "absolute",
bottom: "0",
height: "1px",
right: "15px",
width: "calc(100% - 30px)",
backgroundColor: "rgba(180, 180, 180, 0.3)"
}
},
logoLink: {
...defaultFont,
textTransform: "uppercase",
padding: "5px 0",
display: "block",
fontSize: "18px",
textAlign: "left",
fontWeight: "400",
lineHeight: "30px",
textDecoration: "none",
backgroundColor: "transparent",
"&,&:hover": {
color: "#FFFFFF"
}
},
logoImage: {
width: "30px",
display: "inline-block",
maxHeight: "30px",
marginLeft: "10px",
marginRight: "15px"
},
img: {
width: "35px",
top: "22px",
position: "absolute",
verticalAlign: "middle",
border: "0"
},
background: {
position: "absolute",
zIndex: "1",
height: "100%",
width: "100%",
display: "block",
top: "0",
left: "0",
backgroundSize: "cover",
backgroundPosition: "center center",
"&:after": {
position: "absolute",
zIndex: "3",
width: "100%",
height: "100%",
content: '""',
display: "block",
background: "#000",
opacity: ".8"
}
},
list: {
marginTop: "20px",
paddingLeft: "0",
paddingTop: "0",
paddingBottom: "0",
marginBottom: "0",
listStyle: "none",
position: "unset"
},
item: {
position: "relative",
display: "block",
textDecoration: "none",
"&:hover,&:focus,&:visited,&": {
color: "#FFFFFF"
}
},
itemLink: {
width: "auto",
transition: "all 300ms linear",
margin: "10px 15px 0",
borderRadius: "3px",
position: "relative",
display: "block",
padding: "10px 15px",
backgroundColor: "transparent",
...defaultFont
},
itemIcon: {
width: "24px",
height: "30px",
fontSize: "24px",
lineHeight: "30px",
float: "left",
marginRight: "15px",
textAlign: "center",
verticalAlign: "middle",
color: "rgba(255, 255, 255, 0.8)"
},
itemText: {
...defaultFont,
margin: "0",
lineHeight: "30px",
fontSize: "14px",
color: "#FFFFFF"
},
whiteFont: {
color: "#FFFFFF"
},
sidebarWrapper: {
width: "360px",
position: "relative",
overflow: "auto",
zIndex: "4",
overflowScrolling: "touch"
},
whiteText: {
zIndex: "5000",
color: "white"
},
collapsedItemStyle: {
zIndex: "5000",
color: "white",
"&:hover": {
backgroundColor: primaryColor,
color: "#FFFFFF",
...primaryBoxShadow
},
cursor: "pointer"
},
collapse: {
width: "80%",
margin: "0 auto"
},
checkedItem: {
backgroundColor: primaryColor,
color: "#FFFFFF",
...primaryBoxShadow
},
subOptionIndent: {
paddingLeft: "20px"
}
});
export default sidebarStyle;

60
frontend-react/src/components/App.js
View File

@@ -1,26 +1,20 @@
import React from "react";
import Select from "react-select";
import PropTypes from "prop-types";
import withStyles from "@material-ui/core/styles/withStyles";
import { connect } from "react-redux";
import {
CATEGORY_SELECT,
ITEMS_CHANGED,
USER_DATA_CHANGED
} from "constants/actionTypes";
import { hoc, areObjectEqual } from "utils/helpers";
import { ITEMS_CHANGED, USER_DATA_CHANGED } from "constants/actionTypes";
import { areObjectEqual } from "utils/helpers";
import { createOlxLink } from "utils/createOlxLink";
import axios from "axios";
import * as Vozila from "./categories/Vozila";
import * as Nekretnine from "./categories/Nekretnine";
import image from "assets/img/sidebar-1.jpg";
import logo from "assets/img/reactlogo.png";
import DeepCategoryWrapper from "components/widgets/DeepCategoryWrapper";
import Sidebar from "components/Sidebar.js";
import ItemsContainer from "./items/itemscontainer/ItemsContainer";
import NotificationModal from "./NotificationModal";
const options = [
{ value: "Vozila", label: "Vozila" },
{ value: "Nekretnine", label: "Nekretnine" }
];
import dashboardStyle from "assets/dashboardStyle.js";
const mapStateToProps = state => {
return {
@@ -33,7 +27,6 @@ const mapStateToProps = state => {
};
const mapDispatchToProps = dispatch => ({
onCategoryChanged: option => dispatch({ type: CATEGORY_SELECT, option }),
onItemsChanged: items => dispatch({ type: ITEMS_CHANGED, items }),
onUserDataChange: change => dispatch({ type: USER_DATA_CHANGED, ...change })
});
@@ -84,32 +77,29 @@ class App extends React.Component {
lastUpdateTime = Date.now();
}
}
handleChange = selectedOption => {
this.props.onCategoryChanged(selectedOption);
};
render() {
const { category, items } = this.props;
const { items, classes } = this.props;
return (
<div>
<Select
value={category}
onChange={this.handleChange}
options={options}
/>
{hoc(category && category.value, {
Vozila: <DeepCategoryWrapper {...Vozila.properties} />,
Nekretnine: <DeepCategoryWrapper {...Nekretnine.properties} />
})}
<ItemsContainer />
{items.length ? <NotificationModal /> : null}
<div className={classes.wrapper}>
<Sidebar logoText={"Market Alarm"} logo={logo} image={image} />
<div className={classes.mainPanel}>
<ItemsContainer />
{items.length ? <NotificationModal /> : null}
</div>
</div>
);
}
}
App.propTypes = {
classes: PropTypes.object.isRequired
};
export default connect(
mapStateToProps,
mapDispatchToProps
)(App);
export default withStyles(dashboardStyle)(
connect(
mapStateToProps,
mapDispatchToProps
)(App)
);

20
frontend-react/src/components/NotificationModal.js
View File

@@ -19,6 +19,22 @@ const modalStyle = function() {
};
};
const buttonStyle = function() {
return {
width: "100px",
margin: "0 auto",
position: "relative",
borderRadius: "8px",
display: "block",
padding: "10px 10px",
textAlign: "center",
marginBottom: "20px",
color: "white",
backgroundColor: "#e91e63",
border: "1px solid #e91e63"
};
};
class NotificationModal extends React.Component {
handleOpen = () => {
this.props.onModalOpen();
@@ -50,7 +66,9 @@ class NotificationModal extends React.Component {
return (
<div>
<button onClick={this.handleOpen}>Open Modal</button>
<button style={buttonStyle()} onClick={this.handleOpen}>
Open Modal
</button>
<div style={modalStyle()} aria-labelledby="modal-label" hidden={!modal}>
<div>

135
frontend-react/src/components/Sidebar.js Normal file
View File

@@ -0,0 +1,135 @@
import React from "react";
import PropTypes from "prop-types";
import withStyles from "@material-ui/core/styles/withStyles";
import List from "@material-ui/core/List";
import ListItem from "@material-ui/core/ListItem";
import ListItemIcon from "@material-ui/core/ListItemIcon";
import ListItemText from "@material-ui/core/ListItemText";
import Dashboard from "@material-ui/icons/Dashboard";
import ExpandLess from "@material-ui/icons/ExpandLess";
import ExpandMore from "@material-ui/icons/ExpandMore";
import Collapse from "@material-ui/core/Collapse";
import StarBorder from "@material-ui/icons/StarBorder";
import sidebarStyle from "assets/sidebarStyle.js";
import CollapseWrapperStyled from "components/widgets/CollapseWrapperStyled";
import DeepCategoryWrapper from "./widgets/DeepCategoryWrapper";
import { hoc } from "utils/helpers";
import * as Vozila from "./categories/Vozila";
import * as Nekretnine from "./categories/Nekretnine";
import { connect } from "react-redux";
import { CATEGORY_SELECT } from "constants/actionTypes";
const options = [
{ value: "Vozila", label: "Vozila" },
{ value: "Nekretnine", label: "Nekretnine" }
];
const mapStateToProps = state => {
return {
category: state.category
};
};
const mapDispatchToProps = dispatch => ({
onCategoryChanged: option => dispatch({ type: CATEGORY_SELECT, option })
});
class Sidebar extends React.Component {
handleCategoryChange = selectedOption => {
this.props.onCategoryChanged(selectedOption);
};
render() {
const { classes, logo, image, logoText, category } = this.props;
return (
<div className={classes.drawerPaper}>
<div className={classes.logo}>
<a href="https://www.creative-tim.com" className={classes.logoLink}>
<div className={classes.logoImage}>
<img src={logo} alt="logo" className={classes.img} />
</div>
{logoText}
</a>
</div>
<div className={classes.sidebarWrapper}>
<List role="menu">
<ListItem className={classes.whiteText} onClick={this.handleClick}>
<ListItemIcon className={classes.whiteText}>
<Dashboard />
</ListItemIcon>
<ListItemText
className={classes.whiteText}
inset
primary="Kategorija"
disableTypography={true}
/>
{true ? <ExpandLess /> : <ExpandMore />}
</ListItem>
<Collapse in={true} timeout="auto" unmountOnExit>
<List disablePadding>
{options.map(({ label, value }, index) => (
<ListItem
onClick={() => this.handleCategoryChange({ label, value })}
className={
classes.nested +
" " +
classes.collapsedItemStyle +
" " +
(category && category.value === value
? classes.checkedItem
: "")
}
key={index}
>
<ListItemIcon className={classes.whiteText}>
<StarBorder />
</ListItemIcon>
<ListItemText
className={classes.whiteText}
primary={label}
disableTypography={true}
/>
</ListItem>
))}
</List>
</Collapse>
{hoc(category && category.value, {
Vozila: (
<CollapseWrapperStyled componentName="Podkategorija">
<DeepCategoryWrapper {...Vozila.properties} />
</CollapseWrapperStyled>
),
Nekretnine: (
<CollapseWrapperStyled componentName="Podkategorija">
<DeepCategoryWrapper {...Nekretnine.properties} />
</CollapseWrapperStyled>
)
})}
</List>
</div>
{image !== undefined ? (
<div
className={classes.background}
style={{ backgroundImage: "url(" + image + ")" }}
/>
) : null}
</div>
);
}
}
Sidebar.propTypes = {
classes: PropTypes.object.isRequired
};
export default withStyles(sidebarStyle)(
connect(
mapStateToProps,
mapDispatchToProps
)(Sidebar)
);

6
frontend-react/src/components/filters/NekretnineFilter/KuceFilter/index.js
View File

@@ -1,5 +1,6 @@
import React from "react";
import CheckboxAndRadioWrapper from "components/widgets/CheckboxAndRadioWrapper";
import CollapseWrapperStyled from "components/widgets/CollapseWrapperStyled";
const elements = [
{
@@ -54,13 +55,12 @@ const elements = [
class KuceFilter extends React.Component {
render() {
return (
<div>
<span>Dodatno za kuce</span>
<CollapseWrapperStyled componentName="Dodatno za kuce">
<CheckboxAndRadioWrapper
componentName="dodatno-za-kuce"
elements={elements}
/>
</div>
</CollapseWrapperStyled>
);
}
}

6
frontend-react/src/components/filters/NekretnineFilter/StanoviFilter/index.js
View File

@@ -1,5 +1,6 @@
import React from "react";
import CheckboxAndRadioWrapper from "components/widgets/CheckboxAndRadioWrapper";
import CollapseWrapperStyled from "components/widgets/CollapseWrapperStyled";
const elements = [
{
@@ -61,13 +62,12 @@ const elements = [
class StanoviFilter extends React.Component {
render() {
return (
<div>
<span>Dodatno za stan</span>
<CollapseWrapperStyled componentName="Dodatno za stan">
<CheckboxAndRadioWrapper
componentName="dodatno-za-stan"
elements={elements}
/>
</div>
</CollapseWrapperStyled>
);
}
}

46
frontend-react/src/components/filters/NekretnineFilter/index.js
View File

@@ -2,21 +2,49 @@ import React from "react";
import * as Filters from "./AllFiltersDefined";
import CheckboxAndRadioWrapper from "components/widgets/CheckboxAndRadioWrapper";
import SelectDisplayCheckboxWrapper from "components/widgets/SelectDisplayCheckboxWrapper";
import CollapseWrapperStyled from "components/widgets/CollapseWrapperStyled";
import RangeWrapper from "components/widgets/RangeWrapper";
import SelectWrapper from "components/widgets/SelectWrapper";
import DropDownWrapper from "components/widgets/DropDownWrapper";
class NekretnineFilter extends React.Component {
render() {
return (
<div>
<CheckboxAndRadioWrapper
componentName="vrsta"
elements={Filters.vrstaElements}
/>
<SelectWrapper {...Filters.lokacijaOptions} />
<SelectDisplayCheckboxWrapper {...Filters.gradoviOptions} />
<RangeWrapper {...Filters.cijenaRangeOptions} optionName="cijena" />
<RangeWrapper {...Filters.velicinaRangeOptions} optionName="velicina" />
{[
<CheckboxAndRadioWrapper
componentName="Vrsta"
elements={Filters.vrstaElements}
/>,
<DropDownWrapper
componentName="Lokacija"
{...Filters.lokacijaOptions}
/>,
<SelectDisplayCheckboxWrapper
componentName="Grad"
{...Filters.gradoviOptions}
/>,
<RangeWrapper
componentName="Cijena"
{...Filters.cijenaRangeOptions}
optionName="cijena"
/>,
<RangeWrapper
componentName="Velicina"
{...Filters.velicinaRangeOptions}
optionName="velicina"
/>
].map(comp => (
<CollapseWrapperStyled
key={comp.props.componentName}
componentName={comp.props.componentName}
>
{comp}
</CollapseWrapperStyled>
))}
</div>
);
}

58
frontend-react/src/components/filters/VozilaFilter/index.js
View File

@@ -2,26 +2,54 @@ import React from "react";
import * as Filters from "./AllFiltersDefined";
import CheckboxAndRadioWrapper from "components/widgets/CheckboxAndRadioWrapper";
import RangeWrapper from "components/widgets/RangeWrapper";
import SelectWrapper from "components/widgets/SelectWrapper";
import CollapseWrapperStyled from "components/widgets/CollapseWrapperStyled";
import DropDownWrapper from "components/widgets/DropDownWrapper";
class VozilaFilter extends React.Component {
render() {
return (
<div>
<CheckboxAndRadioWrapper
componentName="stanje"
elements={Filters.stanjeElements}
/>
<SelectWrapper {...Filters.proizvodacOptions} />
<RangeWrapper {...Filters.cijenaRangeOptions} />
<SelectWrapper {...Filters.lokacijaOptions} />
<RangeWrapper {...Filters.godisteRangeOptions} />
<SelectWrapper {...Filters.kilometrazaOptions.kilometraMin} />
<SelectWrapper {...Filters.kilometrazaOptions.kilometraMax} />
<CheckboxAndRadioWrapper
componentName="gorivo"
elements={Filters.gorivoElements}
/>
{[
<CheckboxAndRadioWrapper
componentName="Stanje"
elements={Filters.stanjeElements}
/>,
<DropDownWrapper
componentName="Proizvodac"
{...Filters.proizvodacOptions}
/>,
<RangeWrapper
componentName="Cijena"
{...Filters.cijenaRangeOptions}
/>,
<DropDownWrapper
componentName="Lokacija"
{...Filters.lokacijaOptions}
/>,
<RangeWrapper
componentName="Godiste"
{...Filters.godisteRangeOptions}
/>,
<DropDownWrapper
componentName="Min kilometraza"
{...Filters.kilometrazaOptions.kilometraMin}
/>,
<DropDownWrapper
componentName="Max kilometraza"
{...Filters.kilometrazaOptions.kilometraMax}
/>,
<CheckboxAndRadioWrapper
componentName="Gorivo"
elements={Filters.gorivoElements}
/>
].map(comp => (
<CollapseWrapperStyled
key={comp.props.componentName}
componentName={comp.props.componentName}
>
{comp}
</CollapseWrapperStyled>
))}
</div>
);
}

26
frontend-react/src/components/items/itemcard/ItemCard.css
View File

@@ -1,36 +1,40 @@
.item {
display: grid;
border: solid #877ad2 1px;
border-radius: 10px;
max-width: 360px;
min-height: 300px;
border: solid #ffc600 1px;
border-radius: 5px;
max-width: 200px;
min-height: 150px;
grid-template-areas:
"image"
"title";
margin: 3%;
background-color: #dbdbd7;
background-color: #272727;
justify-items: center;
align-items: center;
}
.item > a > img {
width: 70%;
height: 60%;
max-height: 200px;
width: 90%;
height: 90%;
min-height: 100px !important;
min-width: 150px !important;
grid-area: image;
padding: 8% 8% 0 8%;
}
.item > a {
text-decoration: none;
}
.basic-info {
grid-area: title;
width: 85%;
width: 100%;
margin: 0 auto;
text-align: center;
}
.basic-info > h3 {
font-size: 90%;
margin: 5%;
margin-bottom: 0px;
color: #332390;
color: #ffc600;
padding-bottom: 10px;
overflow-wrap: break-word;
}

4
frontend-react/src/components/items/itemscontainer/ItemsContainer.css
View File

@@ -3,6 +3,6 @@
margin-top: 8%;
display: grid;
grid-gap: 5px;
grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));
grid-template-rows: repeat(2, 320px);
grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
justify-items: center;
}

6
frontend-react/src/components/items/itemscontainer/ItemsContainer.js
View File

@@ -19,11 +19,7 @@ class ItemContainer extends Component {
}
render() {
return (
<div>
<div className="items-list">{this.renderItems()}</div>
</div>
);
return <div className="items-list">{this.renderItems()}</div>;
}
}
export default connect(mapStateToProps)(ItemContainer);

17
frontend-react/src/components/subcategories/nekretnine/Kuce.js
View File

@@ -2,14 +2,13 @@ import React from "react";
import NekretnineFilter from "components/filters/NekretnineFilter/index";
import KuceFilter from "components/filters/NekretnineFilter/KuceFilter/index";
class Kuce extends React.Component {
render() {
return (
<div>
<span>Kuce</span>
<NekretnineFilter />
<KuceFilter />
</div>
);
}
render() {
return (
<div>
<NekretnineFilter />
<KuceFilter />
</div>
);
}
}
export default Kuce;

17
frontend-react/src/components/subcategories/nekretnine/Stanovi.js
View File

@@ -3,14 +3,13 @@ import NekretnineFilter from "components/filters/NekretnineFilter/index";
import StanoviFilter from "components/filters/NekretnineFilter/StanoviFilter/index";
class Stanovi extends React.Component {
render() {
return (
<div>
<span>Stanovi</span>
<NekretnineFilter />
<StanoviFilter />
</div>
);
}
render() {
return (
<div>
<NekretnineFilter />
<StanoviFilter />
</div>
);
}
}
export default Stanovi;

15
frontend-react/src/components/subcategories/vozila/Automobili.js
View File

@@ -2,13 +2,12 @@ import React from "react";
import VozilaFilter from "components/filters/VozilaFilter/index";
class Automobili extends React.Component {
render() {
return (
<div>
<span>Auto</span>
<VozilaFilter />
</div>
);
}
render() {
return (
<div>
<VozilaFilter />
</div>
);
}
}
export default Automobili;

15
frontend-react/src/components/subcategories/vozila/Motocikli.js
View File

@@ -2,13 +2,12 @@ import React from "react";
import VozilaFilter from "components/filters/VozilaFilter/index";
class Motocikli extends React.Component {
render() {
return (
<div>
<span>Motocikli</span>
<VozilaFilter />
</div>
);
}
render() {
return (
<div>
<VozilaFilter />
</div>
);
}
}
export default Motocikli;

38
frontend-react/src/components/widgets/CheckboxAndRadioWrapper.js
View File

@@ -1,5 +1,8 @@
import React from "react";
import { optionchangewrapper } from "utils/optionchangewrapper";
import Checkbox from "@material-ui/core/Checkbox";
import Radio from "@material-ui/core/Radio";
import "assets/checkboxAndRadioStyle.css";
class CheckboxAndRadioWrapper extends React.Component {
optionChange = (option, optionName, type) => {
@@ -22,26 +25,33 @@ class CheckboxAndRadioWrapper extends React.Component {
renderElements = (elements, componentName) => {
return elements.map(({ type, value, name, optionName } = {}) => (
<label key={name + type}>
<input
name={type === "radio" ? `${componentName}-radio` : ""}
type={type}
value={value}
checked={this.isChecked(type, value, optionName)}
onChange={option => this.optionChange(option, optionName, type)}
/>
{name}
{type === "radio" ? (
<Radio
className="radio-style"
name={type === "radio" ? `${componentName}-radio` : ""}
type={type}
value={value}
checked={this.isChecked(type, value, optionName)}
onChange={option => this.optionChange(option, optionName, type)}
/>
) : (
<Checkbox
className="checkbox-style"
type={type}
value={value}
checked={this.isChecked(type, value, optionName)}
onChange={option => this.optionChange(option, optionName, type)}
/>
)}
<span className="label-style">{name}</span>
<br />
</label>
));
};
render() {
const { elements, componentName } = this.props;
return (
<div>
<span>{componentName}</span>
{this.renderElements(elements, componentName)}
</div>
);
return <div>{this.renderElements(elements, componentName)}</div>;
}
}
export default optionchangewrapper(CheckboxAndRadioWrapper);

71
frontend-react/src/components/widgets/CollapseWrapperStyled.js Normal file
View File

@@ -0,0 +1,71 @@
import React from "react";
import { connect } from "react-redux";
import { OPTION_EXPAND_CHANGE } from "constants/actionTypes";
import withStyles from "@material-ui/core/styles/withStyles";
import sidebarStyle from "assets/sidebarStyle.js";
import Collapse from "@material-ui/core/Collapse";
import ListItem from "@material-ui/core/ListItem";
import ListItemIcon from "@material-ui/core/ListItemIcon";
import ListItemText from "@material-ui/core/ListItemText";
import ExpandLess from "@material-ui/icons/ExpandLess";
import ExpandMore from "@material-ui/icons/ExpandMore";
import Dashboard from "@material-ui/icons/Dashboard";
const mapStateToProps = state => {
return {
uiexpand: state.uiexpand
};
};
const mapDispatchToProps = dispatch => ({
onUIExpandChanged: uiExpandOption =>
dispatch({ type: OPTION_EXPAND_CHANGE, ...uiExpandOption })
});
class CollapseWrapperStyled extends React.Component {
handleClick = componentName => {
this.props.onUIExpandChanged({
controlName: componentName,
value: !this.props.uiexpand[componentName]
});
};
isopen = componentName => this.props.uiexpand[componentName];
render() {
let { classes, componentName } = this.props;
return (
<div>
<ListItem
className={classes.whiteText}
onClick={() => this.handleClick(componentName)}
>
<ListItemIcon className={classes.whiteText}>
<Dashboard />
</ListItemIcon>
<ListItemText
className={classes.whiteText}
inset
primary={componentName}
disableTypography={true}
/>
{this.isopen(componentName) ? <ExpandLess /> : <ExpandMore />}
</ListItem>
<Collapse
className={classes.subOptionIndent}
in={this.isopen(componentName)}
timeout="auto"
unmountOnExit
>
{this.props.children}
</Collapse>
</div>
);
}
}
export default withStyles(sidebarStyle)(
connect(
mapStateToProps,
mapDispatchToProps
)(CollapseWrapperStyled)
);

47
frontend-react/src/components/widgets/DeepCategoryWrapper.js
View File

@@ -1,8 +1,15 @@
import React from "react";
import Select from "react-select";
import { subcategorywrapper } from "utils/subcategorywrapper";
import { hoc } from "utils/helpers";
import withStyles from "@material-ui/core/styles/withStyles";
import sidebarStyle from "assets/sidebarStyle.js";
import List from "@material-ui/core/List";
import ListItem from "@material-ui/core/ListItem";
import ListItemIcon from "@material-ui/core/ListItemIcon";
import ListItemText from "@material-ui/core/ListItemText";
import StarBorder from "@material-ui/icons/StarBorder";
class DeepCategoryWrapper extends React.Component {
handleOptionChange = selectedOption => {
const { depth, onSubCategoryChanged } = this.props;
@@ -10,21 +17,45 @@ class DeepCategoryWrapper extends React.Component {
};
render() {
const { options, depth, childrenComponents } = this.props;
const { options, depth, childrenComponents, classes } = this.props;
const {
subcategory: { [depth]: deepSubCategory }
} = this.props;
return (
<div>
<Select
value={deepSubCategory || null}
onChange={this.handleOptionChange}
options={options}
/>
<List disablePadding>
{options.map(({ label, value }, index) => (
<ListItem
onClick={() => this.handleOptionChange({ label, value })}
className={
classes.nested +
" " +
classes.collapsedItemStyle +
" " +
(deepSubCategory && deepSubCategory.value === value
? classes.checkedItem
: "")
}
key={index}
>
<ListItemIcon className={classes.whiteText}>
<StarBorder />
</ListItemIcon>
<ListItemText
className={classes.whiteText}
primary={label}
disableTypography={true}
/>
</ListItem>
))}
</List>
{hoc(deepSubCategory && deepSubCategory.value, childrenComponents)}
</div>
);
}
}
export default subcategorywrapper(DeepCategoryWrapper);
export default withStyles(sidebarStyle)(
subcategorywrapper(DeepCategoryWrapper)
);

54
frontend-react/src/components/widgets/DropDownWrapper.js Normal file
View File

@@ -0,0 +1,54 @@
import React from "react";
import { optionchangewrapper } from "utils/optionchangewrapper";
import withStyles from "@material-ui/core/styles/withStyles";
import List from "@material-ui/core/List";
import ListItem from "@material-ui/core/ListItem";
import ListItemIcon from "@material-ui/core/ListItemIcon";
import ListItemText from "@material-ui/core/ListItemText";
import sidebarStyle from "assets/sidebarStyle.js";
import StarBorder from "@material-ui/icons/StarBorder";
class DropdownWrapper extends React.Component {
handleOptionChange = selectedOption => {
const { onOptionChanged, optionName } = this.props;
onOptionChanged({
optionName,
optionValue: selectedOption
});
};
render() {
let { value, options, choices, classes } = this.props;
let optionName = value;
return (
<List disablePadding>
{choices.map(({ label, value }, index) => (
<ListItem
onClick={() => this.handleOptionChange({ label, value })}
className={
classes.nested +
" " +
classes.collapsedItemStyle +
" " +
(options[optionName] && options[optionName].value === value
? classes.checkedItem
: "")
}
key={index}
>
<ListItemIcon className={classes.whiteText}>
<StarBorder />
</ListItemIcon>
<ListItemText
className={classes.whiteText}
primary={label}
disableTypography={true}
/>
</ListItem>
))}
</List>
);
}
}
export default withStyles(sidebarStyle)(optionchangewrapper(DropdownWrapper));

20
frontend-react/src/components/widgets/RangeWrapper.js
View File

@@ -1,7 +1,9 @@
import React from "react";
import { Range } from "rc-slider";
import { optionchangewrapper } from "utils/optionchangewrapper";
import "assets/rangeStyle.css";
import "rc-slider/assets/index.css";
import Input from "@material-ui/core/Input";
class RangeWrapper extends React.Component {
sendAction = (optionName, optionValue) => {
@@ -39,14 +41,24 @@ class RangeWrapper extends React.Component {
step={step}
onAfterChange={this.handleRangeChange}
/>
<input
ref={node => {
<Input
placeholder="Min"
className="input-style"
inputProps={{
"aria-label": "Min"
}}
inputRef={node => {
this.inputMin = node;
}}
onChange={this.handleInputChange}
/>
<input
ref={node => {
<Input
placeholder="Max"
className="input-style"
inputProps={{
"aria-label": "Max"
}}
inputRef={node => {
this.inputMax = node;
}}
onChange={this.handleInputChange}

1
frontend-react/src/constants/actionTypes.js
View File

@@ -5,3 +5,4 @@ export const ITEMS_CHANGED = "ITEMS_CHANGED";
export const MODAL_CLOSE = "MODAL_CLOSE";
export const MODAL_OPEN = " MODAL_OPEN";
export const USER_DATA_CHANGED = "USER_DATA_CHANGED";
export const OPTION_EXPAND_CHANGE = "OPTION_EXPAND_CHANGE";

2
frontend-react/src/index.js
View File

@@ -4,9 +4,11 @@ import React from "react";
import { store } from "./store";
import App from "./components/App";
import CssBaseline from "@material-ui/core/CssBaseline";
ReactDOM.render(
<Provider store={store}>
<CssBaseline />
<App />
</Provider>,
document.getElementById("root")

4
frontend-react/src/reducer.js
View File

@@ -4,6 +4,7 @@ import options from "./reducers/options";
import items from "./reducers/items";
import modal from "./reducers/modal";
import userdata from "./reducers/userdata";
import uiexpand from "./reducers/uiexpand";
import { combineReducers } from "redux";
export default combineReducers({
@@ -12,5 +13,6 @@ export default combineReducers({
options,
items,
modal,
userdata
userdata,
uiexpand
});

18
frontend-react/src/reducers/uiexpand.js Normal file
View File

@@ -0,0 +1,18 @@
import {
OPTION_EXPAND_CHANGE,
CATEGORY_SELECT,
SUBCATEGORY_SELECT
} from "constants/actionTypes";
export default (state = {}, action) => {
switch (action.type) {
case OPTION_EXPAND_CHANGE:
return { ...state, [action.controlName]: action.value };
case CATEGORY_SELECT:
return {};
case SUBCATEGORY_SELECT:
return { Podkategorija: state["Podkategorija"] };
default:
return state;
}
};