Skip to content

Commit 24726bb

Browse files
author
gondzo
committed
Merge branch 'droneDetails' into dev
# Conflicts: # README.md # package.json # src/components/Header/Header.jsx # src/components/InfoIcon/InfoIcon.jsx # src/components/TextField/TextField.jsx # src/containers/HeaderContainer.js # src/layouts/CoreLayout/CoreLayout.jsx # src/routes/DroneDetails/components/DroneDetailsView.jsx # src/routes/DroneDetails/components/DroneDetailsView.scss # src/routes/DroneDetails/components/DroneInfoDetails/DroneInfoDetails.jsx # src/routes/DroneDetails/components/DroneInfoDetails/DroneInfoDetails.scss # src/routes/DroneDetails/components/DroneInfoSpecification/DroneInfoSpecification.jsx # src/routes/DroneDetails/components/DroneInfoSpecification/DroneInfoSpecification.scss # src/routes/DroneDetails/containers/DroneDetailsContainer.js # src/routes/DroneDetails/index.js # src/routes/DroneDetails/modules/DroneDetails.js # src/routes/index.js # src/store/createStore.js # src/store/modules/global.js # src/styles/_slick-theme.scss # src/styles/img/icon-bronze.png # src/styles/img/icon-close-modal.png # src/styles/img/icon-dropdown-caret-sm.png # src/styles/img/icon-feature-tick.png # src/styles/img/icon-gold.png # src/styles/img/icon-rating.png # src/styles/img/icon-silver.png # src/styles/img/icon-spec-doc.png # src/styles/main.scss
2 parents 136dcab + eac942f commit 24726bb

File tree

205 files changed

+5313
-333
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

205 files changed

+5313
-333
lines changed

‎.env

+5
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
REACT_APP_API_BASE_PATH=https://kb-dsp-server.herokuapp.com
2+
REACT_APP_SOCKET_URL=https://kb-dsp-server.herokuapp.com
3+
REACT_APP_AUTH0_CLIEND_ID=3CGKzjS2nVSqHxHHE64RhvvKY6e0TYpK
4+
REACT_APP_AUTH0_DOMAIN=dronetest.auth0.com
5+
REACT_APP_GOOGLE_API_KEY=AIzaSyCR3jfBdv9prCBYBOf-fPUDhjPP4K05YjE

‎README.md

-2
Original file line numberDiff line numberDiff line change
@@ -34,5 +34,3 @@ See Guild https://github.com/lorenwest/node-config/wiki/Configuration-Files
3434
|`lint:fix`|Lint and fix all `.js` files. [Read more on this](http://eslint.org/docs/user-guide/command-line-interface.html#fix).|
3535
|`test`|Run tests using [mocha-webpack](https://github.com/webpack/mocha-loader) for all `*.spec.(js|jsx)` files in the `src` dir.|
3636

37-
## Google Map
38-
In this project module [react-google-maps](https://github.com/tomchentw/react-google-maps) is used to work with google maps. So it can be used for any new functionality.

‎envSample

+5
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
REACT_APP_API_BASE_PATH=https://kb-dsp-server.herokuapp.com
2+
REACT_APP_SOCKET_URL=https://kb-dsp-server.herokuapp.com
3+
REACT_APP_AUTH0_CLIEND_ID=3CGKzjS2nVSqHxHHE64RhvvKY6e0TYpK
4+
REACT_APP_AUTH0_DOMAIN=dronetest.auth0.com
5+
REACT_APP_GOOGLE_API_KEY=AIzaSyCR3jfBdv9prCBYBOf-fPUDhjPP4K05YjE

‎package.json

+8
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,9 @@
1414
"author": "",
1515
"license": "MIT",
1616
"dependencies": {
17+
"auth0-js": "^7.6.0",
1718
"autoprefixer": "^6.5.0",
19+
"axios": "^0.15.3",
1820
"babel-core": "^6.17.0",
1921
"babel-eslint": "^7.0.0",
2022
"babel-loader": "^6.2.5",
@@ -39,6 +41,7 @@
3941
"flexboxgrid": "^6.3.1",
4042
"history": "^2.0.0",
4143
"html-webpack-plugin": "^2.22.0",
44+
"icheck": "^1.0.2",
4245
"imports-loader": "^0.6.5",
4346
"ip": "^1.1.3",
4447
"json-loader": "^0.5.4",
@@ -53,12 +56,17 @@
5356
"react": "^15.3.2",
5457
"react-breadcrumbs": "^1.5.1",
5558
"react-count-down": "^1.0.3",
59+
"react-click-outside": "^2.2.0",
5660
"react-css-modules": "^3.7.10",
5761
"react-date-picker": "^5.3.28",
5862
"react-dom": "^15.3.2",
5963
"react-flexbox-grid": "^0.10.2",
6064
"react-google-maps": "^6.0.1",
6165
"react-modal": "^1.5.2",
66+
"react-dropdown": "^1.2.0",
67+
"react-icheck": "^0.3.6",
68+
"react-input-range": "^0.9.3",
69+
"react-modal": "^1.6.2",
6270
"react-flexbox-grid": "^0.10.2",
6371
"react-highcharts": "^11.0.0",
6472
"react-modal": "^1.5.2",

‎src/api/User.js

+75
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,75 @@
1+
/**
2+
* Copyright (c) 2016 Topcoder Inc, All rights reserved.
3+
*/
4+
5+
/**
6+
* A simple implementation of /missions API contract
7+
*
8+
* @author TCSCODER
9+
* @version 1.0.0
10+
*/
11+
import reqwest from 'reqwest';
12+
13+
/**
14+
* UserApi consumer, full implement the rest contract
15+
*/
16+
class UserApi {
17+
/**
18+
* Default Constructor
19+
* @param {String} basePath the base API path
20+
*/
21+
constructor(basePath) {
22+
this.basePath = basePath;
23+
}
24+
25+
login(email, password) {
26+
const url = `${this.basePath}/api/v1/login`;
27+
28+
return reqwest({
29+
url,
30+
method: 'post',
31+
type: 'json',
32+
contentType: 'application/json',
33+
data: JSON.stringify({
34+
email,
35+
password,
36+
}),
37+
error(err) {
38+
return err;
39+
},
40+
});
41+
}
42+
43+
register(name, email, password) {
44+
const url = `${this.basePath}/api/v1/register`;
45+
email = Math.floor((Math.random() * 100) + 1) + email;
46+
return reqwest({
47+
url,
48+
method: 'post',
49+
type: 'json',
50+
contentType: 'application/json',
51+
data: JSON.stringify({
52+
firstName: name,
53+
lastName: name,
54+
email,
55+
phone: '1',
56+
password,
57+
})});
58+
}
59+
60+
registerSocialUser(name, email) {
61+
const url = `${this.basePath}/api/v1/login/social`;
62+
63+
return reqwest({
64+
url,
65+
method: 'post',
66+
type: 'json',
67+
contentType: 'application/json',
68+
data: JSON.stringify({
69+
name,
70+
email,
71+
})});
72+
}
73+
}
74+
75+
export default UserApi;

‎src/components/Button/Button.scss

+4
Original file line numberDiff line numberDiff line change
@@ -24,4 +24,8 @@
2424

2525
.color-black {
2626
background: #4c4c4c;
27+
}
28+
29+
.color-silver {
30+
background: #67879a;
2731
}

‎src/components/Header/Header.jsx

+62-35
Original file line numberDiff line numberDiff line change
@@ -1,20 +1,25 @@
11
import React, { PropTypes } from 'react';
22
import CSSModules from 'react-css-modules';
33
import { Link } from 'react-router';
4+
import LogInSignUpModalContainer from 'routes/Home/containers/LogInSignUpModalContainer';
45
import SearchInput from '../SearchInput';
56
import Dropdown from '../Dropdown';
7+
import Notification from '../Notification';
68
import styles from './Header.scss';
79

8-
export const Header = ({location, selectedCategory, categories, user, notifications, routes}) => (
9-
<nav styleName="header">
10-
<ul>
11-
<li styleName="branding">
10+
export const Header = ({location, selectedCategory, categories, user, notifications,
11+
routes, handleNotification, toggleNotif, loggedUser}) => (
12+
13+
<nav styleName="header">
14+
<ul>
15+
<li styleName="branding">
1216
DRONE MARKET
1317
</li>
14-
{
18+
{
1519
(() => {
1620
const currentRoute = routes[routes.length - 1].name;
1721
if (currentRoute === 'ServiceRequest'
22+
|| currentRoute === 'Home'
1823
|| currentRoute === 'MyRequestStatus'
1924
|| currentRoute === 'StatusDetail') {
2025
return (
@@ -43,39 +48,57 @@ export const Header = ({location, selectedCategory, categories, user, notificati
4348
);
4449
})()
4550
}
46-
<li styleName="notifications">
47-
{notifications.length > 0 && <span styleName="counter">{notifications.length}</span>}
48-
</li>
49-
{(() => {
50-
const currentRoute = routes[routes.length - 1].name;
51-
if (currentRoute === 'ServiceRequest') {
51+
{
52+
(() => {
53+
const isLoggedIn = false;
54+
if (!loggedUser) {
55+
return (
56+
[
57+
(<li key="category">
58+
<Dropdown title={selectedCategory}>
59+
<ul>
60+
{categories.map((item, i) => <li key={i}><a href="javascript:">{item.name}</a></li>)}
61+
</ul>
62+
</Dropdown>
63+
</li>),
64+
(<li key="login" styleName="login">
65+
<LogInSignUpModalContainer />
66+
</li>),
67+
]
68+
);
69+
}
5270
return (
53-
<li>
54-
<Dropdown title={selectedCategory}>
55-
<ul>
56-
{categories.map((item, i) => <li key={i}><a href="javascript:">{item.name}</a></li>)}
57-
</ul>
58-
</Dropdown>
59-
</li>
71+
[
72+
(<li key="notification" styleName="notifications" onClick={() => handleNotification(!toggleNotif)}>
73+
{notifications.length > 0 && <span styleName="counter">{notifications.length}</span>}
74+
{toggleNotif && <Notification notifications={notifications} toggleNotif={toggleNotif} handleNotification={handleNotification} />}
75+
</li>),
76+
(<li key="category">
77+
<Dropdown title={selectedCategory}>
78+
<ul>
79+
{categories.map((item, i) => <li key={i}><a href="javascript:">{item.name}</a></li>)}
80+
</ul>
81+
</Dropdown>
82+
</li>),
83+
(<li key="welcome" styleName="user">
84+
<Dropdown title={<span>Welcome,<br />{user.name}e</span>}>
85+
<ul>
86+
<li>
87+
<a href="javascript:">Profile</a>
88+
</li>
89+
<li>
90+
<a href="javascript:">Logout</a>
91+
</li>
92+
</ul>
93+
</Dropdown>
94+
</li>),
95+
]
6096
);
61-
}
62-
return (<span />);
63-
})()
97+
})()
6498
}
65-
<li styleName="user">
66-
<Dropdown title={<span>Welcome,<br />{user.name}e</span>}>
67-
<ul>
68-
<li>
69-
<a href="javascript:">Profile</a>
70-
</li>
71-
<li>
72-
<a href="javascript:">Logout</a>
73-
</li>
74-
</ul>
75-
</Dropdown>
76-
</li>
77-
</ul>
78-
</nav>
99+
100+
</ul>
101+
</nav>
79102
);
80103

81104
Header.propTypes = {
@@ -85,6 +108,10 @@ Header.propTypes = {
85108
categories: PropTypes.array.isRequired,
86109
notifications: PropTypes.array.isRequired,
87110
user: PropTypes.object.isRequired,
111+
handleNotification: PropTypes.func,
112+
toggleNotif: PropTypes.bool,
113+
loggedUser: PropTypes.bool,
114+
isLoggedIn: PropTypes.bool,
88115
};
89116

90117
export default CSSModules(Header, styles);

‎src/components/Header/Header.scss

+12-1
Original file line numberDiff line numberDiff line change
@@ -99,7 +99,8 @@
9999

100100
.notifications {
101101
background: url("icon-notification.png") no-repeat center center;
102-
102+
cursor: pointer;
103+
position: relative;
103104
.counter {
104105
position: relative;
105106
top: -5px;
@@ -115,3 +116,13 @@
115116
font-weight: bold;
116117
}
117118
}
119+
120+
.signup, .login {
121+
a {
122+
display: block;
123+
font-size: 14px;
124+
color: #fff;
125+
font-weight: bold;
126+
}
127+
128+
}

‎src/components/InfoIcon/InfoIcon.jsx

+3-3
Original file line numberDiff line numberDiff line change
@@ -3,10 +3,10 @@ import CSSModules from 'react-css-modules';
33
import Tooltip from 'rc-tooltip';
44
import styles from './InfoIcon.scss';
55

6-
export const InfoIcon = ({ children }) => (
6+
export const InfoIcon = ({children, cName, position}) => (
77
<div styleName="info-icon">
8-
<Tooltip placement="right" trigger={['hover', 'click']} overlay={children}>
9-
<div styleName="icon" />
8+
<Tooltip placement={position} trigger={['hover', 'click']} overlay={children}>
9+
<div styleName="icon" className={cName} />
1010
</Tooltip>
1111
</div>
1212
);

‎src/components/InfoIcon/InfoIcon.scss

+17-2
Original file line numberDiff line numberDiff line change
@@ -9,8 +9,18 @@
99
display: block;
1010
}
1111

12-
:global {
1312

13+
:global {
14+
.black {
15+
background: url('../../styles/img/icon-info-black.png') no-repeat 0 0;
16+
width: 20px;
17+
height: 13px;
18+
display: inline-block;
19+
vertical-align: middle;
20+
margin-left: 7px;
21+
position: relative;
22+
top: -1px;
23+
}
1424
.rc-tooltip {
1525
position: absolute;
1626
z-index: 1070;
@@ -19,7 +29,7 @@
1929
line-height: 1.5;
2030
font-size: 13px;
2131
background-color: #fff;
22-
opacity: 0.73;
32+
opacity: 1;
2333
font-style: italic;
2434
box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.2);
2535
border-radius: 3px;
@@ -116,4 +126,9 @@
116126
transform: scale(0, 0);
117127
}
118128
}
129+
.infowindowContent {
130+
.rc-tooltip {
131+
opacity: 1;
132+
}
133+
}
119134
}

‎src/components/Notification/Notification.jsx

+39
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,39 @@
1+
import React, { PropTypes, Component } from 'react';
2+
import CSSModules from 'react-css-modules';
3+
import _ from 'lodash';
4+
import enhanceWithClickOutside from 'react-click-outside';
5+
import styles from './Notification.scss';
6+
import NotificationRow from './NotificationRow';
7+
8+
9+
class Notification extends Component {
10+
handleClickOutside() {
11+
this.props.handleNotification(!this.props.toggleNotif);
12+
}
13+
render() {
14+
const {toggleNotif, handleNotification, notifications} = this.props;
15+
return (
16+
<div styleName="notifications">
17+
<div styleName="notifications-head">
18+
<p>You have {notifications.length} notifications:</p>
19+
</div>
20+
<div styleName="notifications-rows">
21+
{
22+
notifications.map((notification, i) => (
23+
<div key={i} className={styles.notifiRow}><NotificationRow notification={notification} /></div>
24+
))
25+
}
26+
</div>
27+
<div styleName="notifications-footer">
28+
<a href="javascript:;">See All Notifications</a>
29+
</div>
30+
</div>
31+
);
32+
}
33+
}
34+
35+
Notification.defaultProps = {
36+
notifications: PropTypes.array.isRequired,
37+
};
38+
39+
export default enhanceWithClickOutside(CSSModules(Notification, styles));

0 commit comments

Comments
 (0)