Skip to content
GitLab
Menu
Projects
Groups
Snippets
Loading...
Help
Help
Support
Community forum
Keyboard shortcuts
?
Submit feedback
Contribute to GitLab
Sign in
Toggle navigation
Menu
Open sidebar
SRCT
whats-open-web
Commits
3af2f0c8
Commit
3af2f0c8
authored
Mar 16, 2018
by
Andrew Hrdy
Browse files
All campuses are now supported in the map.
Closes
#45
parent
f0753f32
Pipeline
#2194
passed with stage
in 1 minute and 45 seconds
Changes
7
Pipelines
1
Hide whitespace changes
Inline
Side-by-side
src/components/FacilitiesMap.js
View file @
3af2f0c8
import
React
from
'
react
'
;
import
ReactMapboxGl
,
{
Marker
}
from
'
react-mapbox-gl
'
;
import
{
MenuItem
}
from
'
material-ui/Menu
'
;
import
Select
from
'
material-ui/Select
'
;
import
{
FormControl
}
from
'
material-ui/Form
'
;
import
{
getMaxBounds
}
from
'
../utils/mapboxUtils
'
;
import
mapboxgl
from
'
mapbox-gl
'
;
...
...
@@ -16,12 +19,8 @@ const Mark = {
class
FacilitiesMap
extends
React
.
Component
{
constructor
(
props
)
{
super
(
props
);
const
{
campusRegion
,
interactive
=
true
}
=
this
.
props
;
const
maxBounds
=
getMaxBounds
(
campusRegion
);
const
southWestBounds
=
maxBounds
[
0
];
//Coordinates for the south-west bound
const
northEastBounds
=
maxBounds
[
1
];
//Coordinates for the north-east bound
const
{
facility
,
interactive
=
true
}
=
this
.
props
;
const
campusRegion
=
facility
&&
facility
.
facility_location
?
facility
.
facility_location
.
campus_region
:
'
fairfax
'
;
this
.
Map
=
ReactMapboxGl
({
accessToken
:
mapboxToken
,
...
...
@@ -30,23 +29,38 @@ class FacilitiesMap extends React.Component {
});
this
.
state
=
{
fit
Bounds
:
[
southWestBounds
,
northEastBounds
]
,
maxBounds
:
maxBounds
,
max
Bounds
:
getMaxBounds
(
campusRegion
)
,
campusRegion
:
campusRegion
,
fitBoundsOptions
:
{}
};
}
componentWillReceiveProps
(
nextProps
)
{
const
{
facility
}
=
nextProps
;
const
campusRegion
=
facility
&&
facility
.
facility_location
?
facility
.
facility_location
.
campus_region
:
'
fairfax
'
;
this
.
changeRegion
(
campusRegion
);
}
changeRegion
=
(
campusRegion
)
=>
{
this
.
setState
({
maxBounds
:
getMaxBounds
(
campusRegion
),
campusRegion
:
campusRegion
});
};
render
()
{
const
{
facilities
,
facility
,
interactive
=
true
}
=
this
.
props
;
const
{
fitBounds
,
maxBounds
,
fitBoundsOptions
}
=
this
.
state
;
const
{
maxBounds
,
fitBoundsOptions
}
=
this
.
state
;
let
center
,
zoom
;
try
{
if
(
facility
&&
facility
.
facility_location
&&
facility
.
facility_location
.
campus_region
===
this
.
state
.
campusRegion
)
{
center
=
facility
.
facility_location
.
coordinate_location
.
coordinates
;
zoom
=
[
17
];
}
catch
(
e
)
{
}
else
{
center
=
[(
maxBounds
[
0
][
0
]
+
maxBounds
[
1
][
0
])
/
2
,
(
maxBounds
[
0
][
1
]
+
maxBounds
[
1
][
1
])
/
2
];
zoom
=
[
17
];
zoom
=
[
0
];
}
return
(
...
...
@@ -73,10 +87,26 @@ class FacilitiesMap extends React.Component {
cursor
:
'
pointer
'
}}
center
=
{
center
}
fitBounds
=
{
fit
Bounds
}
fitBounds
=
{
max
Bounds
}
fitBoundsOptions
=
{
fitBoundsOptions
}
zoom
=
{
zoom
}
maxBounds
=
{
maxBounds
}
>
{
interactive
&&
(
<
FormControl
className
=
{
'
facilities-map-campus-select
'
}
>
<
Select
disableUnderline
value
=
{
this
.
state
.
campusRegion
}
onChange
=
{(
e
)
=>
this
.
changeRegion
(
e
.
target
.
value
)}
>
<
MenuItem
value
=
{
'
fairfax
'
}
>
Fairfax
<
/MenuItem
>
<
MenuItem
value
=
{
'
arlington
'
}
>
Arlington
<
/MenuItem
>
<
MenuItem
value
=
{
'
prince william
'
}
>
SciTech
<
/MenuItem
>
<
MenuItem
value
=
{
'
front royal
'
}
>
Front
Royal
<
/MenuItem
>
<
/Select
>
<
/FormControl
>
)}
{(
facilities
.
length
>
0
)
&&
facilities
.
map
((
item
)
=>
{
return
(
<
Marker
...
...
src/components/FacilityDialog.js
View file @
3af2f0c8
...
...
@@ -82,7 +82,6 @@ class FacilityDialog extends React.Component {
facilities
=
{
facilities
}
facility
=
{
facility
}
fullScreen
=
{
true
}
campusRegion
=
{
facility
.
facility_location
.
campus_region
}
onClose
=
{
this
.
toggleMap
}
/
>
<
/Dialog
>
...
...
src/components/Sidebar.js
View file @
3af2f0c8
...
...
@@ -36,7 +36,7 @@ class Sidebar extends React.Component {
};
render
()
{
const
{
facility
,
isSidebarOpen
,
facilities
,
campusRegion
}
=
this
.
props
;
const
{
facility
,
isSidebarOpen
,
facilities
}
=
this
.
props
;
const
{
mapDialogOpen
}
=
this
.
state
;
return
(
...
...
@@ -77,14 +77,12 @@ class Sidebar extends React.Component {
facilities
=
{
facilities
}
facility
=
{
facility
}
interactive
=
{
false
}
campusRegion
=
{
campusRegion
}
/
>
<
/div
>
<
MapDialog
open
=
{
mapDialogOpen
}
facilities
=
{
facilities
}
facility
=
{
facility
}
campusRegion
=
{
campusRegion
}
height
=
{
'
500px
'
}
width
=
{
'
600px
'
}
onClose
=
{
this
.
handleMapDialogClose
}
...
...
src/containers/Layout.js
View file @
3af2f0c8
...
...
@@ -51,8 +51,7 @@ class Layout extends React.Component {
<
/div
>
<
Sidebar
facilities
=
{
facilities
}
facility
=
{
selectedFacility
}
isSidebarOpen
=
{
isSidebarOpen
}
setSidebar
=
{
setSidebar
}
setSelectedFacility
=
{
setSelectedFacility
}
campusRegion
=
{
campusRegion
}
/
>
setSidebar
=
{
setSidebar
}
setSelectedFacility
=
{
setSelectedFacility
}
/
>
<
/div
>
<
/div
>
);
...
...
src/styles/components/facilitiesMap.scss
0 → 100644
View file @
3af2f0c8
.facilities-map-campus-select
{
position
:
absolute
!
important
;
z-index
:
100
;
left
:
50%
;
transform
:
translateX
(
-50%
);
top
:
10px
;
height
:
30px
!
important
;
background-color
:
white
!
important
;
border-radius
:
5px
;
box-shadow
:
0
0
0
2px
rgba
(
0
,
0
,
0
,
0
.1
);
}
\ No newline at end of file
src/styles/whatsOpen.scss
View file @
3af2f0c8
...
...
@@ -4,6 +4,7 @@
@import
'./components/alert'
;
@import
'./components/appBar'
;
@import
'./components/cardContainer'
;
@import
'./components/facilitiesMap'
;
@import
'./components/facilityCategory'
;
@import
'./components/facilityDialog'
;
@import
'./components/facilityStatus'
;
...
...
src/utils/mapboxUtils.js
View file @
3af2f0c8
...
...
@@ -4,16 +4,16 @@ const campusBounds = {
[
-
77.295213
,
38.835720
]
// Northeast coordinates
],
arlington
:
[
[
-
77.103
44017
,
38.88
401789
],
[
-
77.099
45977
,
38.886
3896
9
]
[
-
77.103
65559
,
38.88
232150
],
[
-
77.099
69515
,
38.886
2174
9
]
],
'
prince william
'
:
[
[
-
77.52
532482
,
38.754
97015
],
[
-
77.51
772881
,
38.75983938
]
[
-
77.52
645645
,
38.754
69300
],
[
-
77.51
416565
,
38.76009113
]
],
'
mason korea
'
:
[
[
126.65918827
,
37.37121447
],
[
126.68343544
,
37.3883676
6
]
'
front royal
'
:
[
[
-
77.02180979
,
38.88559549
],
[
-
77.01998030
,
38.8866339
6
]
]
};
/**
...
...
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
.
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment