comunes/todos-contra-el-fuego-web
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Login/Auth and pariticipate. Telegram auth (wip)

Browse source
This commit is contained in:
vjrj 2017-12-22 09:33:37 +01:00
parent 91b4197b04
commit 4227389a67
14 changed files with 161 additions and 48 deletions
Download patch file Download diff file Expand all files Collapse all files

12
imports/ui/components/Public/Public.js
View file

@ -2,14 +2,18 @@ import React from 'react';
import PropTypes from 'prop-types';
import { Route, Redirect } from 'react-router-dom';
const Public = ({ loggingIn, authenticated, component, path, exact, ...rest }) => (
const Public = ({
loggingIn, authenticated, component, location, path, exact, ...rest
}) => (
<Route
path={path}
exact={exact}
render={props => (
!authenticated ?
(React.createElement(component, { ...props, ...rest, loggingIn, authenticated })) :
(<Redirect to="/subscriptions" />)
(React.createElement(component, {
...props, ...rest, loggingIn, authenticated
})) :
(<Redirect to={{ pathname: '/subscriptions', state: location.state }} />)
)}
/>
);
@ -17,7 +21,7 @@ const Public = ({ loggingIn, authenticated, component, path, exact, ...rest }) =
Public.propTypes = {
loggingIn: PropTypes.bool.isRequired,
authenticated: PropTypes.bool.isRequired,
component: PropTypes.func.isRequired,
component: PropTypes.func.isRequired
};
export default Public;

4
imports/ui/components/SelectionMap/SelectionMap.js
View file

@ -74,7 +74,7 @@ class SelectionMap extends Component {
onFstBtn() {
this.props.onFstBtn({
location: { lat: this.state.center[0], lon: this.state.center[1] },
location: { lat: this.state.marker[0], lon: this.state.marker[1] },
distance: this.state.distance
});
}
@ -113,7 +113,7 @@ class SelectionMap extends Component {
fit() {
// console.log("fit!");
if (this.props.currentSubs.length > 0 && this.state.subsFit) {
if (this.props.currentSubs.length > 0 && this.state.subsFit && this.props.action !== action.add) {
// has autofit, do nothing
} else if (this.selectionMap && this.distanceCircle) {
if (!this.getMap().getBounds().contains(this.distanceCircle.leafletElement.getBounds())) {

5
imports/ui/pages/FireSubscription/FireSubscription.js
View file

@ -20,7 +20,10 @@ class FireSubscription extends React.Component {
zoom: this.props.zoom,
distance: this.props.distance
};
// console.log(this.props.location.state);
if (props.location) {
console.log(props.location.state);
}
console.log(this.state);
}
componentDidMount() {

15
imports/ui/pages/FiresMap/FiresMap.js
View file

@ -38,7 +38,10 @@ class FiresMap extends React.Component {
constructor(props) {
super(props);
this.state = {
viewport: this.props.viewport,
viewport: {
center: props.center,
zoom: props.zoom
},
useMarkers: false,
showSubsUnion: true
};
@ -214,7 +217,8 @@ FiresMap.propTypes = {
activefires: PropTypes.arrayOf(PropTypes.object).isRequired,
firealerts: PropTypes.arrayOf(PropTypes.object).isRequired,
activefirestotal: PropTypes.number.isRequired,
viewport: PropTypes.object.isRequired,
center: PropTypes.arrayOf(PropTypes.number),
zoom: PropTypes.number,
t: PropTypes.func.isRequired
};
@ -224,6 +228,7 @@ export default translate([], { wait: true })(withTracker(() => {
Meteor.autorun(() => {
if (geolocation.get() && init) {
center.set(geolocation.get());
// console.log(`Geolocation ${geolocation.get()}`);
init = false;
}
if (mapSize.get()) {
@ -258,9 +263,7 @@ export default translate([], { wait: true })(withTracker(() => {
firealerts: FireAlertsCollection.find().fetch().map(doc => (
{ _id: doc._id, lat: doc.location.lat, lon: doc.location.lon }
)),
viewport: {
center: geolocation.get(),
zoom: zoom.get()
}
center: geolocation.get(),
zoom: zoom.get()
};
})(FiresMap));

4
imports/ui/pages/Login/Login.js
View file

@ -16,7 +16,8 @@ class Login extends React.Component {
super(props);
this.t = props.t;
this.handleSubmit = this.handleSubmit.bind(this);
// console.log(this.props.location.state);
console.log(this.props.location.state);
this.state = props.location.state;
}
componentDidMount() {
@ -110,6 +111,7 @@ class Login extends React.Component {
Login.propTypes = {
history: PropTypes.object.isRequired,
t: PropTypes.func.isRequired,
location: PropTypes.object
};
export default translate([], { wait: true })(Login);

11
imports/ui/pages/NewSubscription/NewSubscription.js
View file

@ -11,7 +11,15 @@ class NewSubscription extends Component {
const pushState = this.props.location.state;
this.state = {
center: pushState ? pushState.center : [null, null],
zoom: pushState ? pushState.zoom : null
zoom: pushState ? pushState.zoom : null,
// we have a subscription from home?
doc: pushState && pushState.location ? {
location: {
lat: pushState.location.lat,
lot: pushState.location.lon
},
distance: pushState.distance
} : undefined
};
}
@ -24,6 +32,7 @@ class NewSubscription extends Component {
history={history}
center={this.state.center}
zoom={this.state.zoom}
doc={this.state.doc}
/>
</div>
);

47
imports/ui/pages/Signup/Signup.js
View file

@ -1,3 +1,5 @@
/* eslint-disable react/jsx-indent-props */
import React from 'react';
import { Row, FormGroup, ControlLabel, Button } from 'react-bootstrap';
import Col from '../../components/Col/Col';
@ -6,6 +8,8 @@ import { Link } from 'react-router-dom';
import { Meteor } from 'meteor/meteor';
import { Accounts } from 'meteor/accounts-base';
import { Bert } from 'meteor/themeteorchef:bert';
import randomHex from 'random-hexadecimal';
import Icon from '../../components/Icon/Icon';
import OAuthLoginButtons from '../../components/OAuthLoginButtons/OAuthLoginButtons';
import InputHint from '../../components/InputHint/InputHint';
import AccountPageFooter from '../../components/AccountPageFooter/AccountPageFooter';
@ -64,7 +68,7 @@ class Signup extends React.Component {
}
handleSubmit() {
const { history } = this.props;
const { history, t } = this.props;
Accounts.createUser({
email: this.emailAddress.value,
@ -80,31 +84,35 @@ class Signup extends React.Component {
Bert.alert(T9n.get(`error.accounts.${error.reason}`), 'danger');
} else {
Meteor.call('users.sendVerificationEmail');
Bert.alert('Welcome!', 'success');
Bert.alert(t('Bienvenid@!'), 'success');
history.push('/subscriptions');
}
});
}
render() {
const { t, history } = this.props;
return (<div className="Signup">
<Row className="align-items-center justify-content-center">
<Col xs={12} sm={6} md={5} lg={4}>
<h4 className="page-header">{this.t('Registrarse')}</h4>
<h4 className="page-header">{t('Registrarse')}</h4>
<Row>
{/* <Col xs={12}>
<button
className={`btn btn-block btn-raised btn-primary OAuthLoginButtonDis OAuthLoginButton-telegram`}
type="button" onClick={() => handleLogin(service, callback)}>
<span><Icon icon="telegram" /> Usa nuestro bot de Telegram</span>
</button>
</Col> */}
<Col xs={12}>
<button
className="btn btn-block btn-raised btn-primary OAuthLoginButtonDis OAuthLoginButton-telegram"
type="button"
onClick={() => { const hex = randomHex({ max: 20 }); window.open(`https://t.me/TodosContraElFuego_bot?start=${hex}`); }}
>
<span><Icon icon="telegram" /> {t('Iniciar sesión con Telegram')}</span>
</button>
</Col>
<Col xs={12}>
<OAuthLoginButtons
services={['telegram', 'google']}
emailMessage={{
offset: 97,
text: this.t('o regístrate con un correo')
text: t('o regístrate con un correo')
}}
/>
</Col>
@ -113,7 +121,7 @@ class Signup extends React.Component {
<Row>
<Col xs={6}>
<FormGroup>
<ControlLabel>{this.t('Nombre')}</ControlLabel>
<ControlLabel>{t('Nombre')}</ControlLabel>
<input
type="text"
name="firstName"
@ -124,7 +132,7 @@ class Signup extends React.Component {
</Col>
<Col xs={6}>
<FormGroup>
<ControlLabel>{this.t('Apellidos')}</ControlLabel>
<ControlLabel>{t('Apellidos')}</ControlLabel>
<input
type="text"
name="lastName"
@ -135,7 +143,7 @@ class Signup extends React.Component {
</Col>
</Row>
<FormGroup>
<ControlLabel>{this.t('Correo electrónico')}</ControlLabel>
<ControlLabel>{t('Correo electrónico')}</ControlLabel>
<input
type="email"
name="emailAddress"
@ -144,18 +152,18 @@ class Signup extends React.Component {
/>
</FormGroup>
<FormGroup>
<ControlLabel>{this.t('Contraseña')}</ControlLabel>
<ControlLabel>{t('Contraseña')}</ControlLabel>
<input
type="password"
name="password"
ref={password => (this.password = password)}
className="form-control"
/>
<InputHint>{this.t('Usa al menos seis caracteres.')}</InputHint>
<InputHint>{t('Usa al menos seis caracteres.')}</InputHint>
</FormGroup>
<Button type="submit" bsStyle="success">{this.t('Registrarse')}</Button>
<Button type="submit" bsStyle="success">{t('Registrarse')}</Button>
<AccountPageFooter>
<p>{this.t('¿Ya tienes un cuenta?')} <Link to={{ pathname: '/login', state: this.state }} >{this.t('Iniciar sesión')}</Link>.</p>
<p>{t('¿Ya tienes un cuenta?')} <Link to={{ pathname: '/login', state: this.state }} >{t('Iniciar sesión')}</Link>.</p>
</AccountPageFooter>
</form>
</Col>
@ -165,7 +173,8 @@ class Signup extends React.Component {
}
Signup.propTypes = {
history: PropTypes.object.isRequired
history: PropTypes.object.isRequired,
location: PropTypes.object
};
export default translate([], { wait: true })(Signup);

16
imports/ui/pages/Subscriptions/Subscriptions.js
View file

@ -19,9 +19,16 @@ class Subscriptions extends Component {
constructor(props) {
super(props);
this.t = props.t;
this.state = {
action: action.view
};
if (props.location.state) {
const received = props.location.state;
props.history.push(`${this.props.match.url}/new`, {
location: received.location,
distance: received.distance,
center: [received.location.lat, received.location.lon]
});
}
this.state = {};
this.state.action = action.view;
this.onViewportChanged = this.onViewportChanged.bind(this);
this.onFstBtn = this.onFstBtn.bind(this);
this.onSndBtn = this.onSndBtn.bind(this);
@ -109,7 +116,8 @@ Subscriptions.propTypes = {
subscriptions: PropTypes.arrayOf(PropTypes.object).isRequired,
match: PropTypes.object.isRequired,
t: PropTypes.func.isRequired,
history: PropTypes.object.isRequired
history: PropTypes.object.isRequired,
location: PropTypes.object
};
export default translate([], { wait: true })(withTracker(() => {

1
imports/ui/stylesheets/new-age.scss
View file

@ -190,6 +190,7 @@ div.section.contact ul.list-social li.social-google-plus a:hover {
font-size: 16px;
}
.OAuthLoginButton-telegram,
.OAuthLoginButtons > .btn {
letter-spacing: inherit;
text-transform: none;