From 45c6727bec090e8af70e77ffc5d81b7cda96a890 Mon Sep 17 00:00:00 2001 From: vjrj Date: Thu, 14 Dec 2017 10:14:38 +0100 Subject: [PATCH] Lint fixes --- .../FireSubscription/FireSubscription.js | 88 ++++----- .../FireSubscription/SubsAutocomplete.js | 55 +++--- imports/ui/pages/Index/Index.js | 180 +++++++++--------- 3 files changed, 164 insertions(+), 159 deletions(-) diff --git a/imports/ui/pages/FireSubscription/FireSubscription.js b/imports/ui/pages/FireSubscription/FireSubscription.js index a1f18be..1ce057d 100644 --- a/imports/ui/pages/FireSubscription/FireSubscription.js +++ b/imports/ui/pages/FireSubscription/FireSubscription.js @@ -1,13 +1,14 @@ +/* eslint-disable import/no-absolute-path */ +/* eslint-disable react/jsx-indent-props */ import React from 'react'; import PropTypes from 'prop-types'; import { Row, Col } from 'react-bootstrap'; import { Trans, translate } from 'react-i18next'; import DistanceSlider from '/imports/ui/components/DistanceSlider/DistanceSlider'; import SelectionMap from '/imports/ui/components/SelectionMap/SelectionMap'; -import update from 'immutability-helper'; import Gkeys from '/imports/startup/client/Gkeys'; -import SubsAutocomplete from './SubsAutocomplete'; import CenterInMyPosition from '/imports/ui/components/CenterInMyPosition/CenterInMyPosition.js'; +import SubsAutocomplete from './SubsAutocomplete'; class FireSubscription extends React.Component { constructor(props) { @@ -18,26 +19,27 @@ class FireSubscription extends React.Component { // console.log(this.props.location.state); } - componentDidMount = () => { - Gkeys.load(function (err, key) { - this.setState({ init: true }); - }.bind(this)); - } - - centerOnUserLocation(value) { - this.setState(update(this.state, {$merge: {lat: value.center[0], lng: value.center[1]}})); + componentDidMount() { + const self = this; + Gkeys.load(() => { + self.setState({ init: true }); + }); } onAutocompleteChange(value) { - this.setState(update(this.state, {$merge: {lat: value.lat, lng: value.lng}})); + this.setState({ lat: value.lat, lng: value.lng }); } onSliderChange(value) { - this.setState(update(this.state, {$merge: {distance: value}})); + this.setState({ distance: value }); } onSelection(value) { - this.setState(update(this.state, {$merge: {lat: value.lat, lng: value.lng, distance: value.distance}})); + this.setState({ lat: value.lat, lng: value.lng, distance: value.distance }); + } + + centerOnUserLocation(value) { + this.setState({ lat: value.center[0], lng: value.center[1] }); } render() { @@ -45,37 +47,37 @@ class FireSubscription extends React.Component { // https://github.com/kenny-hibino/react-places-autocomplete/blob/master/demo/Demo.js if (!this.state.init) { - return
- } else { - return ( -
- - -
-

Suscríbete a alertas de fuegos

- this.onAutocompleteChange(value) }/> -
- - - this.onSliderChange(value)} /> - - this.centerOnUserLocation(viewport)} /> - - - - - this.onSelection(state)} - /> - -
- ); + return
; } + return ( +
+ + +
+

Suscríbete a alertas de fuegos

+ this.onAutocompleteChange(value)} + /> +
+ + + this.onSliderChange(value)} /> + + this.centerOnUserLocation(viewport)} /> + + + + + this.onSelection(state)} + /> + +
+ ); } } diff --git a/imports/ui/pages/FireSubscription/SubsAutocomplete.js b/imports/ui/pages/FireSubscription/SubsAutocomplete.js index 1e38223..a6e9426 100644 --- a/imports/ui/pages/FireSubscription/SubsAutocomplete.js +++ b/imports/ui/pages/FireSubscription/SubsAutocomplete.js @@ -1,35 +1,36 @@ +/* eslint-disable react/jsx-indent-props */ import React from 'react'; import PropTypes from 'prop-types'; import { Trans, translate } from 'react-i18next'; -import PlacesAutocomplete, { geocodeByAddress, geocodeByPlaceId, getLatLng } from 'react-places-autocomplete'; +import PlacesAutocomplete, { geocodeByAddress, getLatLng } from 'react-places-autocomplete'; import { FormGroup, ControlLabel, HelpBlock } from 'react-bootstrap'; class SubsAutocomplete extends React.Component { constructor(props) { super(props); this.state = { - address: '', + address: '' }; } - onChange = (address) => { this.setState({ address }); } + onChange(address) { this.setState({ address }); } - handleSelect = (address) => { + handleSelect(address) { const self = this; geocodeByAddress(address) - .then((results) => getLatLng(results[0])) + .then(results => getLatLng(results[0])) .then(({ lat, lng }) => { // console.log('Success Yay', { lat, lng }) // const newState = update(this.state, {$merge: {lat: lat, lng: lng}}); // console.log(newState); // this.setState(newState); - self.props.onChange({lat: lat, lng: lng}); + self.props.onChange({ lat, lng }); // console.log(this.state); }) - .catch(error => { + .catch((error) => { console.log(error); if (error === 'ZERO_RESULTS') { - console.log("No results"); + console.log('No results'); } }); } @@ -43,17 +44,17 @@ class SubsAutocomplete extends React.Component { backgroundSize: 'auto 12px', backgroundPosition: 'bottom left 10px', backgroundRepeat: 'no-repeat', - backgroundImage: "url('https://maps.gstatic.com/mapfiles/api-3/images/powered-by-google-on-white3_hdpi.png')", - }, - } + backgroundImage: "url('https://maps.gstatic.com/mapfiles/api-3/images/powered-by-google-on-white3_hdpi.png')" + } + }; // http://simplelineicons.com/ const AutocompleteItem = ({ formattedSuggestion }) => (
- {' '} + {' '} {formattedSuggestion.mainText}{' '} {formattedSuggestion.secondaryText} -
) +
); return (
@@ -67,11 +68,12 @@ class SubsAutocomplete extends React.Component { classNames={{ root: 'form-group', input: 'form-control', - autocompleteContainer: 'autocomplete-container'}} + autocompleteContainer: 'autocomplete-container' + }} googleLogo={false} - highlightFirstSuggestion={true} - onSelect={(address) => this.handleSelect(address)} - onEnterKeyDown={(address) => this.handleSelect(address)} + highlightFirstSuggestion + onSelect={address => this.handleSelect(address)} + onEnterKeyDown={address => this.handleSelect(address)} options={{ // location: new google.maps.LatLng(-34, 151), // radius: 2000, @@ -81,21 +83,24 @@ class SubsAutocomplete extends React.Component { inputProps={ { value: this.state.address, - onChange: (address) => this.onChange(address), - placeholder: this.props.t("Escribe aquí un lugar "), - onBlur:() => { /* console.log('Blur event!'); */ }, - onFocus:() => { /* console.log('Focused!'); */ }, + onChange: address => this.onChange(address), + placeholder: this.props.t('Escribe aquí un lugar'), + onBlur: () => { /* console.log('Blur event!'); */ }, + onFocus: () => { /* console.log('Focused!'); */ }, autoFocus: this.props.focusInput - }} /> + }} + /> También puedes seleccionar el lugar en el mapa arrastrando el puntero naranja.
- ) + ); } } SubsAutocomplete.propTypes = { - focusInput: PropTypes.bool.isRequired + focusInput: PropTypes.bool.isRequired, + t: PropTypes.func.isRequired, + i18n: PropTypes.object.isRequired }; -export default translate([], { wait: true }) (SubsAutocomplete); +export default translate([], { wait: true })(SubsAutocomplete); diff --git a/imports/ui/pages/Index/Index.js b/imports/ui/pages/Index/Index.js index 56a00a6..9e1598f 100644 --- a/imports/ui/pages/Index/Index.js +++ b/imports/ui/pages/Index/Index.js @@ -1,15 +1,19 @@ -import React, {Component} from 'react'; -import { Button } from 'react-bootstrap'; +/* eslint-disable import/no-absolute-path */ +/* eslint-disable react/jsx-indent-props */ +/* eslint-disable key-spacing */ +/* eslint-env jquery */ +import React, { Component } from 'react'; import { translate, Trans } from 'react-i18next'; -import {render} from 'react-dom'; +import PropTypes from 'prop-types'; // import { HashLink as Link } from 'react-router-hash-link'; // import { Link } from 'react-router-dom'; // https://www.npmjs.com/package/react-resize-detector import ReactResizeDetector from 'react-resize-detector'; -import {ScrollToTopOnMount, SectionsContainer, Section} from 'react-fullpage'; -import FiresMap from '../FiresMap/FiresMap'; -import FireSubscription from '/imports/ui/pages/FireSubscription/FireSubscription'; +import _ from 'lodash'; +import { ScrollToTopOnMount, SectionsContainer, Section } from 'react-fullpage'; import 'html5-device-mockups/dist/device-mockups.min.css'; +import FireSubscription from '/imports/ui/pages/FireSubscription/FireSubscription'; +import FiresMap from '../FiresMap/FiresMap'; import './Index.scss'; import './Index-custom.scss'; @@ -20,53 +24,39 @@ class Index extends Component { constructor(props) { super(props); + const self = this; + this.myScaleFunction = _.debounce(() => { + self.scaleHeader(); + }, 250); + this.onResize = this.onResize.bind(this); } - debounce = (func, wait, immediate) => { - var timeout; - return function() { - var context = this, args = arguments; - var later = function() { - timeout = null; - if (!immediate) func.apply(context, args); - }; - var callNow = immediate && !timeout; - clearTimeout(timeout); - timeout = setTimeout(later, wait); - if (callNow) func.apply(context, args); - }; - }; - - scaleHeader = () => { - var scalable = document.getElementById('tcefh1'); - var margin = 10; - var scalableContainer = scalable.parentNode; - scalable.style.transform = 'scale(1)'; - var scalableContainerWidth = scalableContainer.offsetWidth - margin; - var scalableWidth = scalable.offsetWidth; - scalable.style.transform = 'scale(' + scalableContainerWidth / scalableWidth + ')'; - scalableContainer.style.height = scalable.getBoundingClientRect().height + 'px'; - }; - - myScaleFunction = this.debounce(() => { - this.scaleHeader(); - }, 250); - - _onResize = () => { - this.myScaleFunction(); - }; - - componentDidMount = () => { + componentDidMount() { $('.carousel').carousel(); } - handleBtnClick = (event) => { + onResize() { + this.myScaleFunction(); + } + + scaleHeader() { + const scalable = document.getElementById('tcefh1'); + const margin = 10; + const scalableContainer = scalable.parentNode; + scalable.style.transform = 'scale(1)'; + const scalableContainerWidth = scalableContainer.offsetWidth - margin; + const scalableWidth = scalable.offsetWidth; + scalable.style.transform = `scale(${scalableContainerWidth / scalableWidth})`; + scalableContainer.style.height = `${scalable.getBoundingClientRect().height}px`; + } + + handleBtnClick() { window.open('https://t.me/TodosContraElFuego_bot', '_blank'); } render() { // https://github.com/subtirelumihail/react-fullpage - let fullPageOptions = { + const fullPageOptions = { activeClass: 'active', // the class that is appended to the sections links anchors: ['home', 'crowdsourcing', 'platforms', 'participe', 'fires'], // the anchors for each sections arrowNavigation: false, // use arrow keys (true after development) @@ -88,67 +78,70 @@ class Index extends Component {
- -
+ +
{ this.slides = ref; }} + >
    -
  1. -
  2. -
  3. -
  4. +
  5. +
  6. +
  7. +
-
+
-

Elige un lugar

-

+