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

More work with titles & descriptions

Browse source
This commit is contained in:
vjrj 2018-02-07 10:00:31 +01:00
parent 323c77322b
commit a1138c8c43
7 changed files with 37 additions and 23 deletions
Download patch file Download diff file Expand all files Collapse all files

14
client/main.html
View file

@ -1,25 +1,13 @@
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8">
<meta name="description" content="All agaist Fire: Corwdsourcing against wildfires | Tod@s contra el Fuego: Colaboración masiva contra los incendios">
<meta name="viewport" content="initial-scale=1, minimal-ui, maximum-scale=1, minimum-scale=1" /> <meta name="viewport" content="initial-scale=1, minimal-ui, maximum-scale=1, minimum-scale=1" />
<!-- FIXME integrate this better with meteor
https://fezvrasta.github.io/bootstrap-material-design/docs/4.0/getting-started/introduction/ -->
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:300,400,500,700|Material+Icons"> <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:300,400,500,700|Material+Icons">
<link href="https://fonts.googleapis.com/css?family=Lato" rel="stylesheet"> <link href="https://fonts.googleapis.com/css?family=Lato" rel="stylesheet">
<link href="https://fonts.googleapis.com/css?family=Catamaran:100,200,300,400,500,600,700,800,900" rel="stylesheet"> <link href="https://fonts.googleapis.com/css?family=Catamaran:100,200,300,400,500,600,700,800,900" rel="stylesheet">
<link href="https://fonts.googleapis.com/css?family=Muli" rel="stylesheet"> <link href="https://fonts.googleapis.com/css?family=Muli" rel="stylesheet">
<!-- <link rel="stylesheet" href="https://unpkg.com/bootstrap-material-design@4.0.0-beta.4/dist/css/bootstrap-material-design.min.css" integrity="sha384-R80DC0KVBO4GSTw+wZ5x2zn2pu4POSErBkf8/fSFhPXHxvHJydT0CSgAP2Yo2r4I" crossorigin="anonymous"> -->
<!-- <script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
<script src="https://unpkg.com/popper.js@1.12.6/dist/umd/popper.js" integrity="sha384-fA23ZRQ3G/J53mElWqVJEGJzU0sTs+SvzG8fXVWP+kJQ1lwFAOkcUOysnlKJC33U" crossorigin="anonymous"></script> -->
<!-- <script src="https://unpkg.com/bootstrap-material-design@4.0.0-beta.4/dist/js/bootstrap-material-design.js" integrity="sha384-3xciOSDAlaXneEmyOo0ME/2grfpqzhhTcM4cE32Ce9+8DW/04AGoTACzQpphYGYe" crossorigin="anonymous"></script>
<script>$(document).ready(function() { $('body').bootstrapMaterialDesign(); });</script> -->
<!-- End:FIXME -->
<!-- <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/daemonite-material@4.0.0-beta/css/material.min.css">
<script src="https://cdn.jsdelivr.net/npm/daemonite-material@4.0.0-beta/js/material.min.js"></script> -->
<link rel="shortcut icon" type="image/png" href="/favicon.ico?v4" sizes="16x16 32x32 64x64"> <link rel="shortcut icon" type="image/png" href="/favicon.ico?v4" sizes="16x16 32x32 64x64">
<link rel="apple-touch-icon" sizes="120x120" href="/apple-touch-icon-precomposed.png?v1"> <link rel="apple-touch-icon" sizes="120x120" href="/apple-touch-icon-precomposed.png?v1">
</head> </head>

2
client/main.js
View file

@ -1,3 +1 @@
import '../imports/startup/client'; import '../imports/startup/client';
/* import '../node_modules/daemonite-material/js/material.min.js';
import '../node_modules/daemonite-material/css/material.css'; */

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

@ -9,6 +9,7 @@ import { translate, Trans } from 'react-i18next';
import { FormGroup } from 'react-bootstrap'; import { FormGroup } from 'react-bootstrap';
import { Meteor } from 'meteor/meteor'; import { Meteor } from 'meteor/meteor';
import { Bert } from 'meteor/themeteorchef:bert'; import { Bert } from 'meteor/themeteorchef:bert';
import { Helmet } from 'react-helmet';
import { Map, Circle } from 'react-leaflet'; import { Map, Circle } from 'react-leaflet';
import Blaze from 'meteor/gadicc:blaze-react-component'; import Blaze from 'meteor/gadicc:blaze-react-component';
import DefMapLayers from '/imports/ui/components/Maps/DefMapLayers'; import DefMapLayers from '/imports/ui/components/Maps/DefMapLayers';
@ -58,16 +59,19 @@ class Fire extends React.Component {
if (fire && fire.when) { if (fire && fire.when) {
this.dateLongFormat = dateLongFormat(fire.when); this.dateLongFormat = dateLongFormat(fire.when);
} }
const title = fire.address ?
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 });
return (fire ? ( return (fire ? (
<div className="ViewFire"> <div className="ViewFire">
<Helmet>
<meta charSet="utf-8" />
<title>{t('AppName')}: {t('Información adicional sobre fuego')}</title>
<meta name="description" content={title} />
</Helmet>
{!loading && {!loading &&
<Fragment> <Fragment>
<h4 className="page-header"> <h4 className="page-header">{title}</h4>
{fire.address ?
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 <Map
ref={(map) => { ref={(map) => {
this.fireMap = map; this.fireMap = map;

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

@ -8,6 +8,7 @@ import { ButtonGroup, Row, Col, Checkbox } from 'react-bootstrap';
import { Meteor } from 'meteor/meteor'; import { Meteor } from 'meteor/meteor';
import { ReactiveVar } from 'meteor/reactive-var'; import { ReactiveVar } from 'meteor/reactive-var';
import { withTracker } from 'meteor/react-meteor-data'; import { withTracker } from 'meteor/react-meteor-data';
import { Helmet } from 'react-helmet';
import { Trans, translate } from 'react-i18next'; import { Trans, translate } from 'react-i18next';
import { Map } from 'react-leaflet'; import { Map } from 'react-leaflet';
import Control from 'react-leaflet-control'; import Control from 'react-leaflet-control';
@ -132,6 +133,7 @@ class FiresMap extends React.Component {
} }
render() { render() {
const { t } = this.props;
console.log(`Rendering ${this.props.loading ? 'loading' : 'LOADED'} map ${this.props.activefires.length + this.props.firealerts.length} of ${this.props.activefirestotal} total. Subs users ready ${this.props.subsready}, reactive ${this.state.viewport.zoom >= MAXZOOMREACTIVE}`); console.log(`Rendering ${this.props.loading ? 'loading' : 'LOADED'} map ${this.props.activefires.length + this.props.firealerts.length} of ${this.props.activefirestotal} total. Subs users ready ${this.props.subsready}, reactive ${this.state.viewport.zoom >= MAXZOOMREACTIVE}`);
return ( return (
@ -140,6 +142,11 @@ class FiresMap extends React.Component {
<div <div
ref={(divElement) => { this.divElement = divElement; }} ref={(divElement) => { this.divElement = divElement; }}
> >
{ window.location.pathname !== '/' &&
<Helmet>
<title>{t('AppName')}: {t('Fuegos activos')}</title>
<meta name="description" content={t('Fuegos activos en el mundo actualizados en tiempo real')} />
</Helmet> }
{this.props.loading || !this.props.subsready ? {this.props.loading || !this.props.subsready ?
<Row className="align-items-center justify-content-center"> <Row className="align-items-center justify-content-center">
<Loading /> <Loading />

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

@ -4,6 +4,7 @@
/* eslint-env jquery */ /* eslint-env jquery */
import React, { Component, Fragment } from 'react'; import React, { Component, Fragment } from 'react';
import { translate, Trans } from 'react-i18next'; import { translate, Trans } from 'react-i18next';
import { Helmet } from 'react-helmet';
import PropTypes from 'prop-types'; import PropTypes from 'prop-types';
// import { HashLink as Link } from 'react-router-hash-link'; // import { HashLink as Link } from 'react-router-hash-link';
// import { Link } from 'react-router-dom'; // import { Link } from 'react-router-dom';
@ -76,8 +77,12 @@ class Index extends Component {
} }
render() { render() {
const { t } = this.props;
return ( return (
<div className="IndexDisabled full-width"> <div className="IndexDisabled full-width">
<Helmet>
<title>{t('AppName')}: {t('Inicio')}</title>
</Helmet>
{/* https://v4-alpha.getbootstrap.com/components/carousel/ */} {/* https://v4-alpha.getbootstrap.com/components/carousel/ */}
<Fragment> <Fragment>
<section className="sect1"> <section className="sect1">

8
imports/ui/pages/Page/Page.js
View file

@ -3,14 +3,20 @@ import PropTypes from 'prop-types';
import { Meteor } from 'meteor/meteor'; import { Meteor } from 'meteor/meteor';
import { createContainer } from 'meteor/react-meteor-data'; import { createContainer } from 'meteor/react-meteor-data';
import { ReactiveVar } from 'meteor/reactive-var'; import { ReactiveVar } from 'meteor/reactive-var';
import i18n from '/imports/startup/client/i18n';
import PageHeader from '../../components/PageHeader/PageHeader'; import PageHeader from '../../components/PageHeader/PageHeader';
import Content from '../../components/Content/Content'; import Content from '../../components/Content/Content';
import i18n from '/imports/startup/client/i18n'; import { Helmet } from 'react-helmet';
import './Page.scss'; import './Page.scss';
const Page = ({ title, subtitle, content }) => ( const Page = ({ title, subtitle, content }) => (
<div className="Page"> <div className="Page">
<Helmet>
<meta charSet="utf-8" />
<title>{i18n.t('AppName')}: {title}</title>
<meta name="description" content={content.substr(0, 100).lastIndexOf(' ')} />
</Helmet>
<PageHeader title={title} subtitle={subtitle} /> <PageHeader title={title} subtitle={subtitle} />
<Content content={content} /> <Content content={content} />
</div> </div>

8
public/locales/es/common.json
View file

@ -247,5 +247,11 @@
"Es una quema controlada": "Es una quema controlada":
"Es una quema controlada", "Es una quema controlada",
"Parece una falsa alarma": "Parece una falsa alarma":
"Parece una falsa alarma" "Parece una falsa alarma",
"Inicio":
"Inicio",
"Fuegos activos en el mundo actualizados en tiempo real":
"Fuegos activos en el mundo actualizados en tiempo real",
"Información adicional sobre fuego":
"Información adicional sobre fuego"
} }