Commit 55165034 authored by Florent Chehab's avatar Florent Chehab

Saving map status when exiting component operational ! (retreiving such status also...)

parent 8c79ad3c
Pipeline #26606 passed with stages
in 2 minutes and 59 seconds
export const SAVE_MAIN_MAP_POSITION = 'SAVE_MAIN_MAP_POSITION';
import {
SAVE_MAIN_MAP_POSITION
} from "./action-types";
export function saveMainMapPosition(new_position) {
return {
type: SAVE_MAIN_MAP_POSITION,
new_position
};
}
......@@ -115,7 +115,6 @@ class App extends React.Component {
componentDidMount() {
if (this.props.countries.fetched.countries.length == 0 || this.props.invalidated) {
console.log("here mother uc", this.props.countries.fetched.countries);
this.props.fetchData();
}
}
......@@ -129,7 +128,6 @@ class App extends React.Component {
}
componentWillUnmount() {
console.log("ça serait bien de save la config de la carte...");
}
render() {
......
......@@ -6,14 +6,19 @@ import { Map, TileLayer, Marker, Popup, LayersControl, FeatureGroup, Circle, Lay
// import MarkerClusterGroup from 'react-leaflet-markercluster';
import {
universitiesFetchData,
universitiesInvalidated,
mainCampusFetchData,
mainCampusInvalidated
} from '../../generated/actions';
import UnivMarkers from './UnivMakers';
import { saveMainMapPosition } from '../../actions/map'
class UnivMap extends MyComponent {
constructor() {
super();
this.state = {
leaflet_instance: null
};
}
componentDidMount() {
let univ_data = this.props.universities.fetched.universities;
......@@ -36,10 +41,26 @@ class UnivMap extends MyComponent {
if (this.props.mainCampus.invalidated) {
this.props.fetchMainCampus();
}
}
componentWillUnmount() {
console.log("ça serait bien de save la config de la carte...");
if (this.state.leaflet_instance) {
let l = this.state.leaflet_instance
let center = [l.getCenter().lat, l.getCenter().lng]
this.props.saveMainMap({
zoom: l.getZoom(),
center
})
}
}
saveLeafletInstance = (l) => {
this.setState(Object.assign(this.state, {
leaflet_instance: l,
}))
}
render() {
......@@ -52,7 +73,7 @@ class UnivMap extends MyComponent {
}
return (
<Map center={[35, 0]} zoom={2} style={{ height: "800px" }}>
<Map center={this.props.map.center} zoom={this.props.map.zoom} style={{ height: "800px" }} whenReady={(e) => this.saveLeafletInstance(e.target)}>
<LayersControl position="topright">
<LayersControl.BaseLayer name="OpenStreetMap France" checked={false}>
<TileLayer
......@@ -102,6 +123,7 @@ const mapStateToProps = (state) => {
return {
universities: state.universities,
mainCampus: state.mainCampus,
map: state.app.mainMap
};
};
......@@ -109,8 +131,7 @@ const mapDispatchToProps = (dispatch) => {
return {
fetchUniversities: () => dispatch(universitiesFetchData()),
fetchMainCampus: () => dispatch(mainCampusFetchData()),
// invalidateUniversities: (bool) => dispatch(universitiesInvalidated(bool)),
// invalidateMainCampus: (bool) => dispatch(mainCampusInvalidated(bool))
saveMainMap: (pos) => dispatch(saveMainMapPosition(pos)),
};
};
......
......@@ -6,10 +6,19 @@ import {
countriesReducers
} from '../generated/combinedReducers';
import {
saveMainMapPosition
} from './map'
const appReducers = combineReducers({
mainMap: saveMainMapPosition,
})
const rootReducer = combineReducers({
universities: universitiesReducers,
mainCampus: mainCampusReducers,
countries: countriesReducers
countries: countriesReducers,
app: appReducers
})
export default rootReducer
import { SAVE_MAIN_MAP_POSITION } from '../actions/action-types'
export function saveMainMapPosition(state = { center: [0, 2], zoom: 2 }, action) {
switch (action.type) {
case SAVE_MAIN_MAP_POSITION:
return {
center: action.new_position.center,
zoom: action.new_position.zoom
}
default:
return state;
}
}
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