diff --git a/imports/api/Common/dates.js b/imports/api/Common/dates.js index 153bce3..7fb4bf3 100644 --- a/imports/api/Common/dates.js +++ b/imports/api/Common/dates.js @@ -3,4 +3,5 @@ import moment from 'moment-timezone'; export const momentTz = date => moment.tz(date, moment.tz.guess()); export const dateLongFormat = date => momentTz(date).format('LLLL (z)'); export const dateParseShortFormat = date => moment(date, 'YYYY-MM-DD').format('LL'); +export const dateYYYYMMDD = date => moment(date).format('YYYY-MM-DD'); export const dateFromNow = date => momentTz(date).fromNow(); diff --git a/imports/ui/pages/Fires/Fires.js b/imports/ui/pages/Fires/Fires.js index f871c0c..13aaf19 100644 --- a/imports/ui/pages/Fires/Fires.js +++ b/imports/ui/pages/Fires/Fires.js @@ -17,7 +17,7 @@ import NotFound from '/imports/ui/pages/NotFound/NotFound'; import FiresCollection from '/imports/api/Fires/Fires'; import FireList from '/imports/ui/components/Maps/FireList'; import FromNow from '/imports/ui/components/FromNow/FromNow'; -import { dateLongFormat } from '/imports/api/Common/dates'; +import { dateLongFormat, dateYYYYMMDD } from '/imports/api/Common/dates'; import '/imports/startup/client/comments'; import FalsePositiveTypes from '/imports/api/FalsePositives/FalsePositiveTypes'; import FalsePositivesCollection, { falsePositivesRemap } from '/imports/api/FalsePositives/FalsePositives'; @@ -52,7 +52,7 @@ class Fire extends React.Component { } shouldComponentUpdate(nextProps, nextState) { - return !(nextState.when === this.state.when && nextState.loading === this.state.loading && this.state.notfound === nextState.notfound); + return !(nextState.when === this.state.when && nextState.loading === this.state.loading && this.state.notfound === nextState.notfound && nextState.nasaLink === this.state.nasaLink); } onTypeSelect(key) { @@ -67,7 +67,18 @@ class Fire extends React.Component { }); } - handleLeafletLoad(circle) { + handleLeafletMapLoad(map) { + if (map && map.leafletElement) { + const lmap = map.leafletElement; + const bounds = lmap.getBounds(); + const ne = bounds.getNorthEast(); + const sw = bounds.getSouthWest(); + console.log(`${sw},${ne}`); + this.setState({ nasaLink: `https://worldview.earthdata.nasa.gov/?p=geographic&l=VIIRS_SNPP_CorrectedReflectance_TrueColor(hidden),MODIS_Aqua_CorrectedReflectance_TrueColor(hidden),MODIS_Terra_CorrectedReflectance_TrueColor,MODIS_Fires_All,MODIS_Fires_Aqua,VIIRS_SNPP_Fires_375m_Night,VIIRS_SNPP_Fires_375m_Day,MODIS_Fires_Terra,Reference_Labels(hidden),Reference_Features(hidden),Coastlines&t=${this.dateYYYYMMDD}&z=3&v=${sw.lng},${sw.lat},${ne.lng},${ne.lat}&ab=off&as=${this.dateYYYYMMDD}&ae=${this.dateYYYYMMDD}&av=3&al=true` }); + } + } + + handleLeafletCircleLoad(circle) { if (this.fireMap && this.fireMap.leafletElement && circle && circle.leafletElement) { this.fireMap.leafletElement.fitBounds(circle.leafletElement.getBounds()); } @@ -83,6 +94,7 @@ class Fire extends React.Component { * console.log(`Not found fire: ${notfound}`); */ if (fire && fire.when) { this.dateLongFormat = dateLongFormat(fire.when); + this.dateYYYYMMDD = dateYYYYMMDD(fire.when); this.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 }); @@ -98,7 +110,10 @@ class Fire extends React.Component { {this.title} { this.fireMap = map; }} + ref={(map) => { + this.fireMap = map; + this.handleLeafletMapLoad(map); + }} animate sleep={false} center={[fire.lat, fire.lon]} @@ -113,7 +128,7 @@ class Fire extends React.Component { fillOpacity={0.0} interactive={false} radius={fire.scan ? fire.scan * 500 : 300} - ref={(circle) => { this.circle = circle; this.handleLeafletLoad(circle); }} + ref={(circle) => { this.circle = circle; this.handleLeafletCircleLoad(circle); }} /> {t('Coordenadas:')} {fire.lat}, {fire.lon} {(fire.type === 'modis' || fire.type === 'viirs') && - Fuego detectado por satélites de la NASA + + Fuego detectado por satélites de la NASA + + } {(fire.type === 'vecinal') && Fuego notificado por uno de nuestros usuarios/as
{t('Coordenadas:')} {fire.lat}, {fire.lon}
Fuego detectado por satélites de la NASA
Fuego detectado por satélites de la NASA +
Fuego notificado por uno de nuestros usuarios/as