Removes the largest batch of React-19-blocking warnings: the 0.31 components (Grid, FormGroup, ControlLabel, Navbar.Header/Brand, Checkbox, SafeAnchor) all leaned on legacy context / defaultProps. 29 files converted: Grid->Container, FormGroup/ControlLabel/FormControl/ HelpBlock -> Form.Group/Label/Control/Text, Checkbox -> Form.Check (label as prop), bsStyle->variant (default->secondary), bsSize->size, pull-right->float-end. Custom Col.js now re-exports v2's Col; custom NavItem.js rewritten self-contained (no SafeAnchor/createChainedFunction); Navigation.js drops react-bootstrap Navbar (raw markup anyway). CSS stays on Bootstrap 4 (alexwine:bootstrap-4) for now: the BS4->5 jump is entangled with the jQuery carousel/swipe + navbar-collapse and is tracked as separate debt in UPGRADE.md. Only .form-label needed a shim (forms.scss). Browser-verified home carousel+navbar, signup form + terms checkbox, login form; REST smoke byte-identical.
66 lines
2.2 KiB
JavaScript
66 lines
2.2 KiB
JavaScript
/* global Geolocation */
|
|
import React from 'react';
|
|
import PropTypes from 'prop-types';
|
|
import { Tracker } from 'meteor/tracker';
|
|
import { ReactiveVar } from 'meteor/reactive-var';
|
|
import { Button } from 'react-bootstrap';
|
|
import { withTranslation } from 'react-i18next';
|
|
import { Bert } from 'meteor/themeteorchef:bert';
|
|
|
|
import './CenterInMyPosition.scss';
|
|
|
|
class CenterInMyPosition extends React.Component {
|
|
onClick() {
|
|
// this.props.onClick(event);
|
|
// https://atmospherejs.com/mdg/geolocation
|
|
// only with SSL:
|
|
// https://developer.mozilla.org/en-US/docs/Web/API/Geolocation/getCurrentPosition
|
|
|
|
// https://stackoverflow.com/questions/31608579/somethings-wrong-with-my-meteor-geolocation-functions
|
|
const userGeoLocation = new ReactiveVar(null);
|
|
const self = this;
|
|
Tracker.autorun((computation) => {
|
|
userGeoLocation.set(Geolocation.latLng());
|
|
if (userGeoLocation.get()) {
|
|
// stop the tracker if we got something
|
|
const viewport = {
|
|
center: [userGeoLocation.get().lat, userGeoLocation.get().lng],
|
|
zoom: 11
|
|
};
|
|
self.props.onClick(viewport);
|
|
computation.stop();
|
|
}
|
|
// https://developer.mozilla.org/en-US/docs/Web/API/PositionError)
|
|
const error = Geolocation.error();
|
|
if (error) {
|
|
const cod = error.code;
|
|
// window.alert(cod);
|
|
if (cod === 1) Bert.alert(self.props.t('geo-not-perms-error'), 'danger');
|
|
else if (cod === 2) Bert.alert(self.props.t('geo-not-avail-error'), 'danger');
|
|
else if (cod === 3) Bert.alert(self.props.t('geo-not-timeout-error'), 'danger');
|
|
else Bert.alert(error.message, 'danger');
|
|
computation.stop();
|
|
}
|
|
});
|
|
}
|
|
|
|
render() {
|
|
const { onlyIcon, t } = this.props;
|
|
const msg = t('Centrar en tu ubicación');
|
|
return (
|
|
<Button variant="secondary" title={msg} onClick={() => this.onClick()}>
|
|
<i className="fa fa-crosshairs" />{!onlyIcon ? ` ${msg}` : ''}
|
|
</Button>);
|
|
}
|
|
}
|
|
|
|
CenterInMyPosition.defaultProps = {
|
|
onlyIcon: false
|
|
};
|
|
|
|
CenterInMyPosition.propTypes = {
|
|
t: PropTypes.func.isRequired,
|
|
onlyIcon: PropTypes.bool
|
|
};
|
|
|
|
export default withTranslation()(CenterInMyPosition);
|