Pages (terms/tos/privacy), comments improvements, etc
This commit is contained in:
parent
cd16f45d8e
commit
952431d296
34 changed files with 435 additions and 97 deletions
|
|
@ -1,12 +1,16 @@
|
|||
/* eslint-disable import/no-absolute-path */
|
||||
/* eslint-disable react/jsx-indent-props */
|
||||
/* eslint-disable react/jsx-indent */
|
||||
|
||||
import React from 'react';
|
||||
import Page from '../Page/Page';
|
||||
import { translate } from 'react-i18next';
|
||||
import Page from '../Page/Page';
|
||||
|
||||
const Credits = props => (
|
||||
<div className="Credits">
|
||||
<Page
|
||||
title={props.t("Créditos")}
|
||||
subtitle={props.t("Sobre los datos y imágenes usados")}
|
||||
title={props.t('Créditos')}
|
||||
subtitle={props.t('Sobre los datos y imágenes usados')}
|
||||
page="credits"
|
||||
/>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -8,12 +8,12 @@ import { withTracker } from 'meteor/react-meteor-data';
|
|||
import { translate } from 'react-i18next';
|
||||
import { Meteor } from 'meteor/meteor';
|
||||
import { Map, Circle } from 'react-leaflet';
|
||||
import moment from 'moment-timezone';
|
||||
import Blaze from 'meteor/gadicc:blaze-react-component';
|
||||
import DefMapLayers from '/imports/ui/components/Maps/DefMapLayers';
|
||||
import NotFound from '/imports/ui/pages/NotFound/NotFound';
|
||||
import FiresCollection from '/imports/api/Fires/Fires';
|
||||
import { dateLongFormat, dateFromNow } from '/imports/api/Common/dates';
|
||||
import '/imports/startup/client/comments';
|
||||
|
||||
import './Fires.scss';
|
||||
|
||||
class Fire extends React.Component {
|
||||
|
|
@ -27,16 +27,17 @@ class Fire extends React.Component {
|
|||
render() {
|
||||
const { loading, fire, t } = this.props;
|
||||
if (fire && fire.when) {
|
||||
this.when = moment.tz(fire.when, moment.tz.guess());
|
||||
this.dateLongFormat = dateLongFormat(fire.when);
|
||||
this.dateFromNow = dateFromNow(fire.when);
|
||||
}
|
||||
return (
|
||||
<div className="ViewFire">
|
||||
return (fire ?
|
||||
(<div className="ViewFire">
|
||||
{!loading &&
|
||||
<Fragment>
|
||||
<h4 className="page-header">
|
||||
{fire.address ?
|
||||
t('Información adicional sobre fuego detectado en {{where}} el {{when}}', { where: fire.address, when: this.when.format('LLLL (z)') }) :
|
||||
t('Información adicional sobre fuego detectado el {{when}}', { when: this.when.format('LLLL (z)') })}
|
||||
t('Información adicional sobre fuego detectado en {{where}} el {{when}}', { where: fire.address, when: this.dateLongFormat }) :
|
||||
t('Información adicional sobre fuego detectado el {{when}}', { when: this.dateLongFormat })}
|
||||
</h4>
|
||||
|
||||
<Map
|
||||
|
|
@ -62,10 +63,10 @@ class Fire extends React.Component {
|
|||
</Map>
|
||||
<p>{t('Coordenadas:')} {fire.lat}, {fire.lon}</p>
|
||||
{(fire.type === 'modis' || fire.type === 'viirs') &&
|
||||
<p>{t('Fuego detectado por satélites de la NASA {{when}}', { when: this.when.fromNow() })}</p>
|
||||
<p>{t('Fuego detectado por satélites de la NASA {{when}}', { when: this.dateFromNow })}</p>
|
||||
}
|
||||
{(fire.type === 'vecinal') &&
|
||||
<p>{t('Fuego notificado por uno de nuestros usuarios/as {{when}}', { when: this.when.fromNow() })}</p>
|
||||
<p>{t('Fuego notificado por uno de nuestros usuarios/as {{when}}', { when: this.dateFromNow })}</p>
|
||||
}
|
||||
{/* TODO: marcar tipo de fuego, industria, etc */}
|
||||
<h4>{t('Comentarios')}</h4>
|
||||
|
|
@ -85,8 +86,8 @@ class Fire extends React.Component {
|
|||
</div>
|
||||
</Fragment>
|
||||
}
|
||||
</div>
|
||||
);
|
||||
</div>
|
||||
) : <NotFound />);
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -9,7 +9,7 @@
|
|||
width: 100%;
|
||||
/* min-width: 75vw; */
|
||||
display: flex;
|
||||
margin: 20px auto;
|
||||
margin: 10px auto;
|
||||
}
|
||||
|
||||
@include breakpoint(mobile) {
|
||||
|
|
|
|||
|
|
@ -166,6 +166,7 @@
|
|||
position: relative;
|
||||
width: 100vw;
|
||||
margin-left: calc(-50vw + 50%);
|
||||
margin-top: -21px;
|
||||
position: relative;
|
||||
/*
|
||||
width: 100vw;
|
||||
|
|
@ -212,4 +213,8 @@
|
|||
|
||||
.device[data-device=iPhone6][data-orientation=portrait][data-color=white] {
|
||||
background-image: url(/mobile.png);
|
||||
}
|
||||
|
||||
.full-width .page-header { // section titles
|
||||
margin-top: 20px;
|
||||
}
|
||||
|
|
@ -208,7 +208,7 @@ class Index extends Component {
|
|||
</div>
|
||||
<div className="col-lg-6">
|
||||
<div className="feature-item">
|
||||
<i className="icon-envelope-open text-primary" />
|
||||
<i className="icon-speech text-primary" />
|
||||
<h3><Trans>Notificaciones</Trans></h3>
|
||||
<p className="text-muted"><Trans>Recibe nuestras notificaciones de fuegos por correo o en tu navegador</Trans></p>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -1,12 +1,17 @@
|
|||
/* eslint-disable import/no-absolute-path */
|
||||
/* eslint-disable react/jsx-indent-props */
|
||||
/* eslint-disable react/jsx-indent */
|
||||
|
||||
import React from 'react';
|
||||
import Page from '../Page/Page';
|
||||
import { translate } from 'react-i18next';
|
||||
import { dateParseShortFormat } from '/imports/api/Common/dates';
|
||||
import Page from '../Page/Page';
|
||||
|
||||
const License = props => (
|
||||
<div className="License">
|
||||
<Page
|
||||
title={props.t("Licencia")}
|
||||
subtitle={props.t("Última actualización 15 de noviembre de 2017")}
|
||||
title={props.t('Licencia')}
|
||||
subtitle={props.t('Última actualización, {{when}}', { when: dateParseShortFormat('2017-01-19') })}
|
||||
page="license"
|
||||
/>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -1,12 +1,15 @@
|
|||
import React from 'react';
|
||||
import { Alert } from 'react-bootstrap';
|
||||
import { translate, Trans } from 'react-i18next';
|
||||
|
||||
const NotFound = () => (
|
||||
<div className="NotFound">
|
||||
<Alert bsStyle="danger">
|
||||
<p><strong>Error [404]</strong>: {window.location.pathname} does not exist.</p>
|
||||
<p>
|
||||
<Trans i18nKey="not-found">Upppps: Esta página no existe</Trans>
|
||||
</p>
|
||||
</Alert>
|
||||
</div>
|
||||
);
|
||||
|
||||
export default NotFound;
|
||||
export default translate([], { wait: true })(NotFound);
|
||||
|
|
|
|||
|
|
@ -5,6 +5,7 @@ import { createContainer } from 'meteor/react-meteor-data';
|
|||
import { ReactiveVar } from 'meteor/reactive-var';
|
||||
import PageHeader from '../../components/PageHeader/PageHeader';
|
||||
import Content from '../../components/Content/Content';
|
||||
import i18n from '/imports/startup/client/i18n';
|
||||
|
||||
import './Page.scss';
|
||||
|
||||
|
|
@ -16,13 +17,13 @@ const Page = ({ title, subtitle, content }) => (
|
|||
);
|
||||
|
||||
Page.defaultProps = {
|
||||
subtitle: '',
|
||||
subtitle: ''
|
||||
};
|
||||
|
||||
Page.propTypes = {
|
||||
title: PropTypes.string.isRequired,
|
||||
subtitle: PropTypes.string,
|
||||
content: PropTypes.string.isRequired,
|
||||
content: PropTypes.string.isRequired
|
||||
};
|
||||
|
||||
const pageContent = new ReactiveVar('');
|
||||
|
|
@ -30,7 +31,7 @@ const pageContent = new ReactiveVar('');
|
|||
export default createContainer(({ content, page }) => {
|
||||
window.scrollTo(0, 0); // Force window to top of page.
|
||||
|
||||
Meteor.call('utility.getPage', page, (error, response) => {
|
||||
Meteor.call('utility.getPage', page, i18n.language, (error, response) => {
|
||||
if (error) {
|
||||
console.warn(error);
|
||||
} else {
|
||||
|
|
@ -39,6 +40,6 @@ export default createContainer(({ content, page }) => {
|
|||
});
|
||||
|
||||
return {
|
||||
content: content || pageContent.get(),
|
||||
content: content || pageContent.get()
|
||||
};
|
||||
}, Page);
|
||||
|
|
|
|||
|
|
@ -1,12 +1,17 @@
|
|||
/* eslint-disable import/no-absolute-path */
|
||||
/* eslint-disable react/jsx-indent-props */
|
||||
/* eslint-disable react/jsx-indent */
|
||||
|
||||
import React from 'react';
|
||||
import Page from '../Page/Page';
|
||||
import { translate } from 'react-i18next';
|
||||
import { dateParseShortFormat } from '/imports/api/Common/dates';
|
||||
import Page from '../Page/Page';
|
||||
|
||||
const Privacy = props => (
|
||||
<div className="Privacy">
|
||||
<Page
|
||||
title={props.t("Política de Privacidad")}
|
||||
subtitle={props.t("Última actualización 15 de noviembre de 2017")}
|
||||
title={props.t('Política de Privacidad')}
|
||||
subtitle={props.t('Última actualización, {{when}}', { when: dateParseShortFormat('2017-01-19') })}
|
||||
page="privacy"
|
||||
/>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -1,12 +1,17 @@
|
|||
/* eslint-disable import/no-absolute-path */
|
||||
/* eslint-disable react/jsx-indent-props */
|
||||
/* eslint-disable react/jsx-indent */
|
||||
|
||||
import React from 'react';
|
||||
import Page from '../Page/Page';
|
||||
import { translate } from 'react-i18next';
|
||||
import { dateParseShortFormat } from '/imports/api/Common/dates';
|
||||
import Page from '../Page/Page';
|
||||
|
||||
const Terms = props => (
|
||||
<div className="Terms">
|
||||
<Page
|
||||
title={props.t("Términos de Servicio")}
|
||||
subtitle={props.t("Última actualización 15 de noviembre de 2017")}
|
||||
title={props.t('Términos de Servicio')}
|
||||
subtitle={props.t('Última actualización, {{when}}', { when: dateParseShortFormat('2017-01-19') })}
|
||||
page="terms"
|
||||
/>
|
||||
</div>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue