Skip to content

GitLab

Commit 8d7b1d5e authored by Mattias J Duffy's avatar Mattias J Duffy
Browse files

Merge branch 'development' into 'master' 

Matomo and Maps Hotfix

See merge request !9
parents 9142ec18 47963d0c
Pipeline #3777 passed with stage
in 1 minute and 50 seconds
Expand all Hide whitespace changes
Inline Side-by-side
Showing with 343 additions and 508 deletions
CHANGELOG.md
View file @ 8d7b1d5e
# Changelog # Changelog
## [2.2.1] - 2018-09-18
### Added
- Matomo Events API
### Removed
### Changed
- FacilityMap update code for better map performance
### Fixed
- Mapbox updated for beter performance on macOS
## [2.2.0] - 2018-09-05 ## [2.2.0] - 2018-09-05
### Added ### Added
......
public/index.html
View file @ 8d7b1d5e
...@@ -35,19 +35,19 @@ ...@@ -35,19 +35,19 @@
<body> <body>
<script type="text/javascript"> <script type="text/javascript">
/* // /*
The following code is generated by matomo to use for analytics. // The following code is generated by matomo to use for analytics.
*/ // */
var _paq = _paq || []; // var _paq = _paq || [];
_paq.push(['trackPageView']); // _paq.push(['trackPageView']);
_paq.push(['enableLinkTracking']); // _paq.push(['enableLinkTracking']);
(function () { // (function () {
var u = "//matomo.srct.gmu.edu/"; // var u = "//matomo.srct.gmu.edu/";
_paq.push(['setTrackerUrl', u + 'piwik.php']); // _paq.push(['setTrackerUrl', u + 'piwik.php']);
_paq.push(['setSiteId', '2']); // _paq.push(['setSiteId', '2']);
var d = document, g = d.createElement('script'), s = d.getElementsByTagName('script')[0]; // var d = document, g = d.createElement('script'), s = d.getElementsByTagName('script')[0];
g.type = 'text/javascript'; g.async = true; g.defer = true; g.src = u + 'piwik.js'; s.parentNode.insertBefore(g, s); // g.type = 'text/javascript'; g.async = true; g.defer = true; g.src = u + 'piwik.js'; s.parentNode.insertBefore(g, s);
})(); // })();
</script> </script>
<noscript> <noscript>
......
src/components/FacilitiesMap.js
View file @ 8d7b1d5e
...@@ -29,7 +29,6 @@ class FacilitiesMap extends React.Component { ...@@ -29,7 +29,6 @@ class FacilitiesMap extends React.Component {
interactive: interactive, interactive: interactive,
attributionControl: false attributionControl: false
}); });
const facilityLocationExists = facility && facility.facility_location && facility.facility_location.campus_region === campusRegion; const facilityLocationExists = facility && facility.facility_location && facility.facility_location.campus_region === campusRegion;
/** /**
...@@ -42,12 +41,22 @@ class FacilitiesMap extends React.Component { ...@@ -42,12 +41,22 @@ class FacilitiesMap extends React.Component {
this.state = { this.state = {
maxBounds: getMaxBounds(campusRegion), maxBounds: getMaxBounds(campusRegion),
campusRegion: campusRegion, campusRegion: campusRegion,
zoom: [17],
center: facilityLocationExists ? facility.facility_location.coordinate_location.coordinates : getCenterOfCampusRegion(campusRegion), center: facilityLocationExists ? facility.facility_location.coordinate_location.coordinates : getCenterOfCampusRegion(campusRegion),
zoom: facilityLocationExists ? [17] : [0],
fitBoundsOptions: {}, fitBoundsOptions: {},
facilityLocations: [], facilityLocations: [],
selectedLocation: null selectedLocation: null,
isLoaded: false
}; };
// if (interactive) {
// this.state.center = facilityLocationExists ? facility.facility_location.coordinate_location.coordinates : getCenterOfCampusRegion(campusRegion);
// }else{
// setTimeout(() => {
// this.setState({
// center: facilityLocationExists ? facility.facility_location.coordinate_location.coordinates : getCenterOfCampusRegion(campusRegion)
// });
// }, 500);
// }
} }
componentWillReceiveProps(nextProps) { componentWillReceiveProps(nextProps) {
...@@ -68,12 +77,15 @@ class FacilitiesMap extends React.Component { ...@@ -68,12 +77,15 @@ class FacilitiesMap extends React.Component {
const facilityLocationExists = facility && facility.facility_location && facility.facility_location.campus_region === campusRegion; const facilityLocationExists = facility && facility.facility_location && facility.facility_location.campus_region === campusRegion;
this.setState({ const newState = {
maxBounds: getMaxBounds(campusRegion), maxBounds: getMaxBounds(campusRegion),
campusRegion: campusRegion, campusRegion: campusRegion,
center: facilityLocationExists ? facility.facility_location.coordinate_location.coordinates : getCenterOfCampusRegion(campusRegion), center: facilityLocationExists ? facility.facility_location.coordinate_location.coordinates : getCenterOfCampusRegion(campusRegion),
zoom: facilityLocationExists ? [17] : [0] zoom: [17]
}); };
setTimeout(() => {
this.setState(newState);
}, 100);
}; };
generateLocationArray = (facilities) => { generateLocationArray = (facilities) => {
...@@ -108,14 +120,13 @@ class FacilitiesMap extends React.Component { ...@@ -108,14 +120,13 @@ class FacilitiesMap extends React.Component {
this.setState({ this.setState({
selectedLocation: oldSelectedLocation !== location ? location : null, selectedLocation: oldSelectedLocation !== location ? location : null,
center: location && location.location.coordinate_location.coordinates, center: location && location.location.coordinate_location.coordinates,
zoom: oldSelectedLocation !== location ? [17] : oldZoom zoom: [17]
}); });
} }
render() { render() {
const {interactive = true} = this.props; const {interactive = true} = this.props;
const {maxBounds, fitBoundsOptions, facilityLocations, selectedLocation, center, zoom} = this.state; const {maxBounds, fitBoundsOptions, facilityLocations, selectedLocation, center, zoom} = this.state;
return ( return (
<this.Map <this.Map
onStyleLoad={(map) => { onStyleLoad={(map) => {
...@@ -130,7 +141,7 @@ class FacilitiesMap extends React.Component { ...@@ -130,7 +141,7 @@ class FacilitiesMap extends React.Component {
}} }}
animationOptions={{ animationOptions={{
animate: true, animate: true,
duration: 1500 duration: 1250
}} }}
style="mapbox://styles/mduffy8/cjbcdxi3v73hp2spiyhxbkjde" style="mapbox://styles/mduffy8/cjbcdxi3v73hp2spiyhxbkjde"
movingMethod="easeTo" movingMethod="easeTo"
......
src/components/FavoriteButton.js
View file @ 8d7b1d5e
...@@ -3,6 +3,7 @@ import FavoriteBorderIcon from 'material-ui-icons/FavoriteBorder'; ...@@ -3,6 +3,7 @@ import FavoriteBorderIcon from 'material-ui-icons/FavoriteBorder';
import FavoriteIcon from 'material-ui-icons/Favorite'; import FavoriteIcon from 'material-ui-icons/Favorite';
import PropTypes from 'prop-types'; import PropTypes from 'prop-types';
import classNames from 'classnames'; import classNames from 'classnames';
import ReactPiwik from 'react-piwik';
class FavoriteButton extends React.Component { class FavoriteButton extends React.Component {
...@@ -17,8 +18,10 @@ class FavoriteButton extends React.Component { ...@@ -17,8 +18,10 @@ class FavoriteButton extends React.Component {
e.stopPropagation(); //Stops the card from being selected in the sidebar. e.stopPropagation(); //Stops the card from being selected in the sidebar.
if (this.props.isFavorite) { if (this.props.isFavorite) {
ReactPiwik.push(['trackEvent', 'card-action', 'un-favorite']);
this.props.removeFavoriteFacility(this.props.facility.slug); this.props.removeFavoriteFacility(this.props.facility.slug);
} else { } else {
ReactPiwik.push(['trackEvent', 'card-action', 'favorite']);
this.props.addFavoriteFacility(this.props.facility.slug); this.props.addFavoriteFacility(this.props.facility.slug);
} }
}; };
......
src/components/Sidebar.js
View file @ 8d7b1d5e
...@@ -13,7 +13,7 @@ import CloseIcon from 'material-ui-icons/Close'; ...@@ -13,7 +13,7 @@ import CloseIcon from 'material-ui-icons/Close';
import IconButton from 'material-ui/IconButton'; import IconButton from 'material-ui/IconButton';
import {removeBrackets} from '../utils/nameUtils'; import {removeBrackets} from '../utils/nameUtils';
import phoneFormatter from 'phone-formatter'; import phoneFormatter from 'phone-formatter';
import ReactPiwik from 'react-piwik';
class Sidebar extends React.Component { class Sidebar extends React.Component {
constructor(props) { constructor(props) {
...@@ -30,11 +30,19 @@ class Sidebar extends React.Component { ...@@ -30,11 +30,19 @@ class Sidebar extends React.Component {
}; };
handleMapDialogClose = () => { handleMapDialogClose = () => {
ReactPiwik.push(['trackEvent', 'map-action', 'close']);
this.setState({ this.setState({
mapDialogOpen: false mapDialogOpen: false
}); });
}; };
handleMapDialogOpen = () => {
ReactPiwik.push(['trackEvent', 'map-action', 'open']);
this.setState({
mapDialogOpen: true
});
}
render() { render() {
const {facility, isSidebarOpen, facilities} = this.props; const {facility, isSidebarOpen, facilities} = this.props;
const {mapDialogOpen} = this.state; const {mapDialogOpen} = this.state;
...@@ -68,11 +76,7 @@ class Sidebar extends React.Component { ...@@ -68,11 +76,7 @@ class Sidebar extends React.Component {
</div> </div>
</div> </div>
<div className={'sidebar-row2'}> <div className={'sidebar-row2'}>
<div className={'sidebar-map-container'} onClick={() => { <div className={'sidebar-map-container'} onClick={this.handleMapDialogOpen}>
this.setState({
mapDialogOpen: true
});
}}>
<FacilitiesMap <FacilitiesMap
facilities={facilities} facilities={facilities}
facility={facility} facility={facility}
......
src/containers/FacilityCard.js
View file @ 8d7b1d5e
...@@ -12,6 +12,7 @@ import {removeBrackets} from '../utils/nameUtils'; ...@@ -12,6 +12,7 @@ import {removeBrackets} from '../utils/nameUtils';
import classNames from 'classnames'; import classNames from 'classnames';
import FacilityDialog from '../components/FacilityDialog'; import FacilityDialog from '../components/FacilityDialog';
import FacilityUtils from '../utils/facilityUtils'; import FacilityUtils from '../utils/facilityUtils';
import ReactPiwik from 'react-piwik';
class FacilityCard extends React.Component { class FacilityCard extends React.Component {
...@@ -23,6 +24,7 @@ class FacilityCard extends React.Component { ...@@ -23,6 +24,7 @@ class FacilityCard extends React.Component {
} }
handleCardClick = () => { handleCardClick = () => {
ReactPiwik.push(['trackEvent', 'card-action', 'click']);
const isSelected = this.props.selectedFacility.slug === this.props.facility.slug; const isSelected = this.props.selectedFacility.slug === this.props.facility.slug;
this.props.setSelectedFacility(isSelected ? null : this.props.facility); this.props.setSelectedFacility(isSelected ? null : this.props.facility);
this.props.setSidebar(!isSelected); this.props.setSidebar(!isSelected);
......
src/containers/Layout.js
View file @ 8d7b1d5e
...@@ -5,7 +5,7 @@ import Sidebar from '../components/Sidebar'; ...@@ -5,7 +5,7 @@ import Sidebar from '../components/Sidebar';
import {getAlerts, getFacilities, setAlerts, setFacilities, sortFacilityCards} from '../actions/api'; import {getAlerts, getFacilities, setAlerts, setFacilities, sortFacilityCards} from '../actions/api';
import {setSidebar, setSelectedFacility, setAllFavorites} from '../actions/ui'; import {setSidebar, setSelectedFacility, setAllFavorites} from '../actions/ui';
import CardContainer from '../components/CardContainer'; import CardContainer from '../components/CardContainer';
import ReactPiwik from 'react-piwik';
class Layout extends React.Component { class Layout extends React.Component {
constructor(props) { constructor(props) {
super(props); super(props);
......
src/containers/SearchBar.js
View file @ 8d7b1d5e
...@@ -12,6 +12,7 @@ import {MenuItem} from 'material-ui/Menu'; ...@@ -12,6 +12,7 @@ import {MenuItem} from 'material-ui/Menu';
import Select from 'material-ui/Select'; import Select from 'material-ui/Select';
import {FormControl} from 'material-ui/Form'; import {FormControl} from 'material-ui/Form';
import classNames from 'classnames'; import classNames from 'classnames';
import ReactPiwik from 'react-piwik';
class SearchBar extends React.Component { class SearchBar extends React.Component {
...@@ -35,6 +36,7 @@ class SearchBar extends React.Component { ...@@ -35,6 +36,7 @@ class SearchBar extends React.Component {
}; };
handleRegionChange = (e) => { handleRegionChange = (e) => {
ReactPiwik.push(['trackEvent', 'change-campus', e.target.value]);
this.setState({ this.setState({
campus: e.target.value campus: e.target.value
}); });
...@@ -43,6 +45,7 @@ class SearchBar extends React.Component { ...@@ -43,6 +45,7 @@ class SearchBar extends React.Component {
}; };
handleFocus = () => { handleFocus = () => {
ReactPiwik.push(['trackEvent', 'search-action', 'focused']);
this.setState({ this.setState({
isFocused: true isFocused: true
}); });
......
src/index.js
View file @ 8d7b1d5e
import React from 'react'; import React from 'react';
import ReactDOM from 'react-dom'; import ReactDOM from 'react-dom';
import ReactPiwik from 'react-piwik';
import {applyMiddleware, compose, createStore} from 'redux'; import {applyMiddleware, compose, createStore} from 'redux';
import './index.css'; import './index.css';
import Layout from './containers/Layout'; import Layout from './containers/Layout';
...@@ -17,8 +18,17 @@ import '../public/manifest.json'; ...@@ -17,8 +18,17 @@ import '../public/manifest.json';
import '../public/favicon.png'; import '../public/favicon.png';
import '../public/apple-app-site-association'; import '../public/apple-app-site-association';
const piwik = new ReactPiwik({
url: 'matomo.srct.gmu.edu/',
siteId: 2,
trackErrors: true,
enableLinkTracking: true,
trackDocumentTitle: true
});
// Create a history of your choosing (we're using a browser history in this case) // Create a history of your choosing (we're using a browser history in this case)
const history = createHistory(); const history = piwik.connectToHistory(createHistory());
// const history = createHistory();
const extension = window.__REDUX_DEVTOOLS_EXTENSION__ && window.__REDUX_DEVTOOLS_EXTENSION__(); const extension = window.__REDUX_DEVTOOLS_EXTENSION__ && window.__REDUX_DEVTOOLS_EXTENSION__();
const isProduction = process.env.NODE_ENV === 'production'; const isProduction = process.env.NODE_ENV === 'production';
......
yarn.lock
View file @ 8d7b1d5e
This diff is collapsed.
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment