Merge branch 'nfzManagement' into dev

# Conflicts:
#	package.json
#	src/routes/DronesMap/components/DronesMapView.jsx
#	src/routes/index.js
#	src/services/APIService.js
#	webpack.config.js

Author: gondzo

.eslintrc

@@ -11,7 +11,7 @@
     "google": true,
   },
   "rules": {
-    "import/no-unresolved": [2, { ignore: ['^components/', '^containers/', '^services/', '^layouts/', '^store/', '^api/', '^routes/'] }],
+    "import/no-unresolved": [2, { ignore: ['^components/', '^containers/', '^services/', '^layouts/', '^store/', '^api/', '^routes/', '^Const'] }],
 
     // temporary for in-progress features
     "no-alert": 0,

package.json

@@ -37,6 +37,7 @@
     "babel-preset-stage-0": "^6.16.0",
     "babel-runtime": "^6.11.6",
     "bluebird": "^3.4.6",
+    "circle-to-polygon": "^1.0.0",
     "classnames": "^2.2.5",
     "config": "^1.24.0",
     "connect-history-api-fallback": "^1.3.0",
@@ -79,6 +80,7 @@
     "react-icheck": "^0.3.6",
     "react-input-range": "^0.9.3",
     "react-modal": "^1.5.2",
+    "react-portal": "^3.0.0",
     "react-redux": "^4.0.0",
     "react-redux-toastr": "^4.2.2",
     "react-router": "^2.8.1",

src/Const.js

@@ -0,0 +1,6 @@
+
+export const GOOGLE_MAPS_BOUNDS_TIMEOUT = 1000;
+
+export default {
+  GOOGLE_MAPS_BOUNDS_TIMEOUT,
+};

src/components/AdminHeader/AdminHeader.jsx

@@ -0,0 +1,30 @@
+import React from 'react';
+import CSSModules from 'react-css-modules';
+import {Link} from 'react-router';
+import styles from './AdminHeader.scss';
+
+export const AdminHeader = () => (
+  <nav styleName="admin-header">
+    <ul>
+      <li styleName="branding">
+        DRONE MARKET
+      </li>
+      <li styleName="pages">
+        <ul>
+          <li>
+            <Link activeClassName="active" to="/admin/dashboard">Dashboard</Link>
+          </li>
+          <li>
+            <Link activeClassName="active" to="/admin/no-fly-zones">No Fly Zones</Link>
+          </li>
+        </ul>
+      </li>
+    </ul>
+  </nav>
+);
+
+AdminHeader.propTypes = {
+
+};
+
+export default CSSModules(AdminHeader, styles);

src/components/AdminHeader/AdminHeader.scss

@@ -0,0 +1,13 @@
+.admin-header {
+  composes: header from '../Header/Header.scss'
+}
+
+.branding {
+  composes: branding from '../Header/Header.scss'
+}
+
+.pages {
+  composes: pages from '../Header/Header.scss'
+}
+
+

src/components/AdminHeader/index.js

@@ -0,0 +1,3 @@
+import AdminHeader from './AdminHeader';
+
+export default AdminHeader;

src/components/Button/Button.scss

@@ -3,6 +3,11 @@
   color: white;
   border: none;
   font-weight: bold;
+
+  &[disabled] {
+    opacity: 0.6;
+    cursor: not-allowed;
+  }
 }
 
 .color-gray {
@@ -22,10 +27,17 @@
   padding: 0 10px;
 }
 
+.size-xs {
+  height: 20px;
+  padding: 0 5px;
+  font-size: 12px;
+  font-weight: normal;
+}
+
 .color-black {
   background: #4c4c4c;
 }
 
 .color-silver {
   background: #67879a;
-}
+}

src/components/Header/Header.jsx

@@ -39,23 +39,23 @@ export const Header = ({
           return (
             <li styleName="pages">
               <ul>
-                <li className={currentRoute === 'Dashboard' ? 'active' : null}>
-                  <Link to="/dashboard">Dashboard</Link>
+                <li>
+                  <Link to="/dashboard" activeClassName="active">Dashboard</Link>
                 </li>
-                <li className={currentRoute === 'Requests' ? 'active' : null}>
-                  <Link to="/my-request">Requests</Link>
+                <li>
+                  <Link to="/my-request" activeClassName="active">Requests</Link>
                 </li>
-                <li className={currentRoute === 'My Drones' ? 'active' : null}>
+                <li>
                   <Link to="/my-drone" activeClassName="active">My Drones</Link>
                 </li>
-                <li className={currentRoute === 'My Services' ? 'active' : null}>
+                <li>
                   <Link to="/my-services" activeClassName="active">My Services</Link>
                 </li>
                 <li><Link to="javascript:;" activeClassName="active">Analytics</Link></li>
                 <li className={currentRoute === 'DroneMap' ? 'active' : null}>
-                  <Link to="/drones-map">Drone Traffic</Link></li>
+                  <Link to="/drones-map" activeClassName="active">Drone Traffic</Link></li>
                 <li className={currentRoute === 'MissionPlanner' ? 'active' : null}>
-                  <Link to="/mission-planner">MissionPlanner</Link></li>
+                  <Link to="/mission-planner" activeClassName="active">MissionPlanner</Link></li>
               </ul>
             </li>
           );

src/components/Header/Header.scss

@@ -10,7 +10,7 @@
     margin: 0;
     width: 100%;
     display: flex;
-    
+
     > li {
       height: 60px;
       display: flex;
@@ -21,7 +21,7 @@
       + li {
         border-left: 1px solid #484848;
       }
-      
+
       &.search {
         flex-grow: 1;
       }
@@ -64,16 +64,16 @@
             align-items: center;
             padding: 8px 8px 0;
             border-bottom: 8px solid transparent;
-            &:hover, &:focus {
+            &:hover {
               border-bottom: 8px solid #315b95;
             }
           }
 
-        } 
+        }
 
         :global {
           .active {
-            border-bottom: 5px solid #214A84;
+            border-bottom: 8px solid #214A84;
           }
         }
       }
@@ -124,5 +124,5 @@
     color: #fff;
     font-weight: bold;
   }
-  
-}
+
+}

src/components/NoFlyZone/NoFlyZone.jsx

@@ -0,0 +1,30 @@
+import React, {PropTypes} from 'react';
+import {Circle, Polygon} from 'react-google-maps';
+
+export const NoFlyZone = ({zone}) => {
+  if (zone.circle) {
+    return (
+      <Circle
+        options={zone.style}
+        radius={zone.circle.radius}
+        center={{
+          lng: zone.circle.center[0],
+          lat: zone.circle.center[1],
+        }}
+      />
+    );
+  }
+
+  return (
+    <Polygon
+      options={zone.style}
+      path={zone.location.coordinates[0].map((pair) => ({lng: pair[0], lat: pair[1]}))}
+    />
+  );
+};
+
+NoFlyZone.propTypes = {
+  zone: PropTypes.object.isRequired,
+};
+
+export default NoFlyZone;