Add eslint and automatic fixes

sawasawasawa · Sep 9, 2017 · fd99872 · fd99872
1 parent fb9e67a
commit fd99872
Show file tree

Hide file tree

Showing 26 changed files with 575 additions and 619 deletions.
diff --git a/.eslintrc b/.eslintrc
@@ -0,0 +1,16 @@
+{
+  "parser": "babel-eslint",
+  "plugins": [
+    "eslint-plugin-babel"
+  ],
+  "extends": ["standard", "standard-jsx"],
+  "env": {
+    "browser": true,
+    "node": true,
+    "meteor": true
+  },
+  "globals": {
+    "Places": true,
+    "Media": false
+  }
+}
diff --git a/client/map/map.js b/client/map/map.js
@@ -2,6 +2,7 @@ import React from 'react'
 import { render } from 'react-dom'
 import App from '../../imports/ui/App.js'
 import './map.html'
+import {Template} from 'meteor/templating'
 
 Template.map.onRendered(() => {
   render(<App />, document.getElementById('main-container'))

diff --git a/imports/api/.Rhistory b/imports/api/.Rhistory
diff --git a/imports/ui/App.js b/imports/ui/App.js
@@ -1,78 +1,76 @@
-import React, {Component} from 'react';
-import MusicMap from './MusicMap';
-import Menu from './Menu';
-import Header from './Header';
-import MuiThemeProvider from 'material-ui/styles/MuiThemeProvider';
-import { Places } from '../api/places.js';
-import { Events } from '../api/events.js';
-import { Media } from '../api/media.js';
-import { createContainer } from 'meteor/react-meteor-data';
-import CircularProgress from 'material-ui/CircularProgress';
+import React, {Component} from 'react'
+import MusicMap from './MusicMap'
+import Menu from './Menu'
+import Header from './Header'
+import MuiThemeProvider from 'material-ui/styles/MuiThemeProvider'
+import { Places } from '../api/places.js'
+import { Events } from '../api/events.js'
+import { Media } from '../api/media.js'
+import { createContainer } from 'meteor/react-meteor-data'
+import CircularProgress from 'material-ui/CircularProgress'
 
 export class AppContent extends Component {
-  constructor(props) {
-    super(props);
-    this.state = {markers: this.props.places, markerType: 'places'};
+  constructor (props) {
+    super(props)
+    this.state = {markers: this.props.places, markerType: 'places'}
   }
-  
-  componentWillReceiveProps(nextProps) {
-    this.setState({places: nextProps.places, media: nextProps.media, events: nextProps.events, markers:nextProps.places})
+
+  componentWillReceiveProps (nextProps) {
+    this.setState({places: nextProps.places, media: nextProps.media, events: nextProps.events, markers: nextProps.places})
   }
 
-  getMediaMarkerPosition(marker) {
-    if (marker.placeId){
-       return this.props.places.find((place)=>{return place._id === marker.placeId}).position
+  getMediaMarkerPosition (marker) {
+    if (marker.placeId) {
+      return this.props.places.find((place) => { return place._id === marker.placeId }).position
     }
   }
 
   toggleMarkersFor = (markerType) => {
-    if (markerType == 'media'){
-      const newMarkers = this.props[markerType].map((marker)=>{
+    if (markerType === 'media') {
+      const newMarkers = this.props[markerType].map((marker) => {
         return {
           ...marker,
-          position: this.getMediaMarkerPosition(marker),
-        }});
+          position: this.getMediaMarkerPosition(marker)
+        }
+      })
       this.setState({markers: newMarkers, markerType: 'media'})
     } else {
       this.setState({markers: this.props.places, markerType: 'places'})
     }
   }
 
-  render() {
+  render () {
     return <MuiThemeProvider>
-      {this.props.dataReady ?  (
-          <div className="container">
-            <Header />
-            <Menu {...this.props} markerType={this.state.markerType}/>
-            <MusicMap {...this.props}
-                      markers={this.state.markers}
-                      markerType={this.state.markerType}
-                      toggleMarkersFor={this.toggleMarkersFor}
-            />
-          </div>
+      {this.props.dataReady ? (
+        <div className='container'>
+          <Header />
+          <Menu {...this.props} markerType={this.state.markerType} />
+          <MusicMap {...this.props}
+            markers={this.state.markers}
+            markerType={this.state.markerType}
+            toggleMarkersFor={this.toggleMarkersFor}
+          />
+        </div>
       ) : (
-          <div style={{marginTop: '20%', textAlign: 'center'}}>
-            <CircularProgress size={200} thickness={35} />
-            <h1>L O A D I N G . . .</h1>
-          </div>)}
-        </MuiThemeProvider>
+        <div style={{marginTop: '20%', textAlign: 'center'}}>
+          <CircularProgress size={200} thickness={35} />
+          <h1>L O A D I N G . . .</h1>
+        </div>)}
+    </MuiThemeProvider>
   }
 }
 
 const App = createContainer(() => {
-  let placesSub = Meteor.subscribe('places');
-  let eventsSub = Meteor.subscribe('events');
-  let mediaSub = Meteor.subscribe('media');
-  let subsReady = (placesSub.ready() && eventsSub.ready() && mediaSub.ready());
+  let placesSub = Meteor.subscribe('places')
+  let eventsSub = Meteor.subscribe('events')
+  let mediaSub = Meteor.subscribe('media')
+  let subsReady = (placesSub.ready() && eventsSub.ready() && mediaSub.ready())
   return {
     places: Places.find().fetch(),
     events: Events.find().fetch(),
     media: Media.find().fetch(),
-    dataReady: subsReady,
+    dataReady: subsReady
   }
-}, AppContent);
-
-export default App;
-
-
+}, AppContent)
 
+export default App
diff --git a/imports/ui/Header.js b/imports/ui/Header.js
@@ -1,5 +1,4 @@
 import React, {Component} from 'react'
-import { createContainer } from 'meteor/react-meteor-data'
 import Paper from 'material-ui/Paper'
 import LegendElement from './components/common/LegendElement'
 

diff --git a/imports/ui/Menu.js b/imports/ui/Menu.js
@@ -1,7 +1,7 @@
-import React, { Component } from 'react';
-import { render } from 'react-dom';
-import Drawer from 'material-ui/Drawer';
-import RaisedButton from 'material-ui/RaisedButton';
+import React, { Component } from 'react'
+import { render } from 'react-dom'
+import Drawer from 'material-ui/Drawer'
+import RaisedButton from 'material-ui/RaisedButton'
 import AddNewPlaceDialog from './components/dialogs/AddPlaceDialog'
 import AddNewEventDialog from './components/dialogs/AddEventDialog'
 import AddMediaDialog from './components/dialogs/AddMediaDialog'
@@ -11,67 +11,67 @@ import CreditsDialog from './components/dialogs/CreditsDialog'
 // import AddNewPlace from './AddNewPlace'
 
 export default class Menu extends Component {
-  constructor(props) {
-    super(props);
-    this.state = {open: false};
+  constructor (props) {
+    super(props)
+    this.state = {open: false}
   }
 
   openMenu = () => {
-    $('#header-background').css({ transform: 'rotateZ(7deg)' });
-    $('#legend-paper').css({ transform: 'rotateZ(7deg)' });
-    setTimeout(()=>{
-      this.setState({open: !this.state.open});
-    },100)
+    $('#header-background').css({ transform: 'rotateZ(7deg)' })
+    $('#legend-paper').css({ transform: 'rotateZ(7deg)' })
+    setTimeout(() => {
+      this.setState({open: !this.state.open})
+    }, 100)
   }
 
   hideMenu = () => {
-    this.setState({open: !this.state.open});
+    this.setState({open: !this.state.open})
     $('#header-background').css({ transform: 'rotateZ(45deg)' })
-    $('#legend-paper').css({ transform: 'rotateZ(45deg)' });
+    $('#legend-paper').css({ transform: 'rotateZ(45deg)' })
   }
 
   addNewPlace = () => {
     $('.searchBox').css('right', '-100%')
       .css('opacity', 1)
       .animate({'right': '0%'})
       .focus()
-    this.hideMenu();
+    this.hideMenu()
   }
 
-  render() {
+  render () {
     return (
-      <div id="menu" className={'bottomButton'}>
+      <div id='menu' className={'bottomButton'}>
         <RaisedButton
-          id="openMenuButton"
-          label="Menu"
+          id='openMenuButton'
+          label='Menu'
           onTouchTap={this.openMenu}
-          secondary={true}
-          backgroundColor={"#EE3858"}
+          secondary
+          backgroundColor={'#EE3858'}
         />
         <Drawer open={this.state.open} className={'menu--drawer'}
-                containerStyle={{
-                  background: 'transparent',
-                  boxShadow: 0
-                }}>
-          <div id="menu--items">
-            <AllEventsDialog {...this.props}/>
-            <AllMediaDialog {...this.props}/>
+          containerStyle={{
+            background: 'transparent',
+            boxShadow: 0
+          }}>
+          <div id='menu--items'>
+            <AllEventsDialog {...this.props} />
+            <AllMediaDialog {...this.props} />
             <br />
-            <AddMediaDialog places={this.props.places}/>
-            <AddNewPlaceDialog places={this.props.places}/>
-            <AddNewEventDialog places={this.props.places}/>
+            <AddMediaDialog places={this.props.places} />
+            <AddNewPlaceDialog places={this.props.places} />
+            <AddNewEventDialog places={this.props.places} />
             <br />
             <br />
             <CreditsDialog />
           </div>
           <RaisedButton className={'bottomButton'}
-                        label="Ukryj"
-                        onTouchTap={this.hideMenu}
-                        secondary={true}
-                        backgroundColor={"#EE3858"}
+            label='Ukryj'
+            onTouchTap={this.hideMenu}
+            secondary
+            backgroundColor={'#EE3858'}
           />
         </Drawer>
       </div>
-    );
+    )
   }
-}
+}
diff --git a/imports/ui/MusicMap/Markers.js b/imports/ui/MusicMap/Markers.js
@@ -1,7 +1,4 @@
-import {
-  default as React,
-  Component
-} from 'react'
+import React from 'react'
 import MarkerClusterer from 'react-google-maps/lib/addons/MarkerClusterer'
 import PlaceMarker from '../components/common/PlaceMarker'
 
@@ -22,17 +19,17 @@ export const Markers = (props) => {
       onClick={(cluster) => {
         props.handleClusterClick(cluster)
       }}
-      >
+    >
       {props.markers ? props.markers.map((marker, index) => {
         return <PlaceMarker key={index}
           marker={marker}
           onMarkerClick={() => props.onMarkerClick(marker)}
           onCloseClick={() => props.onCloseClick(marker)}
-          mediaAtPlace={props.media ? props.media.filter((e) => { return e.placeId == marker._id }) : []}
-          eventsAtPlace={props.events ? props.events.filter((e) => { return e.placeId == marker._id }) : []}
-          />
+          mediaAtPlace={props.media ? props.media.filter((e) => { return e.placeId === marker._id }) : []}
+          eventsAtPlace={props.events ? props.events.filter((e) => { return e.placeId === marker._id }) : []}
+        />
       })
-          : null}
+        : null}
     </MarkerClusterer>
   </div>
   )

diff --git a/imports/ui/MusicMap/MusicMapGoogleMap.js b/imports/ui/MusicMap/MusicMapGoogleMap.js
@@ -1,8 +1,5 @@
 /* global google */
-import {
-  default as React,
-  Component
-} from 'react'
+import React from 'react'
 import {withGoogleMap, GoogleMap} from 'react-google-maps'
 import mapStylesMagenta from '../../../client/map/mapStyles-magenta.json'
 import SearchBox from 'react-google-maps/lib/places/SearchBox' // TODO needed?
@@ -28,7 +25,7 @@ const INPUT_STYLE = {
 }
 
 const MusicMapGoogleMap = withGoogleMap(props => {
-  const showPlaces = props.markerType == 'places'
+  const showPlaces = props.markerType === 'places'
   return (
     <GoogleMap
       ref={props.onMapMounted}
@@ -44,7 +41,7 @@ const MusicMapGoogleMap = withGoogleMap(props => {
           position: google.maps.ControlPosition.TOP_RIGHT
         }
       }}
-      >
+    >
       <div style={{position: 'absolute', top: '10px', right: '60px'}}>
         <RaisedButton label='Miejsca' secondary={showPlaces} onClick={props.toggleMarkersForPlaces} />
         <RaisedButton label='Nagrania' secondary={!showPlaces} onClick={props.toggleMarkersForMedia} />
@@ -57,25 +54,25 @@ const MusicMapGoogleMap = withGoogleMap(props => {
         inputPlaceholder='Podaj dokładny adres'
         inputStyle={INPUT_STYLE}
         inputClassName={'searchBox'}
-        />
+      />
       <Markers markers={props.markers}
         onCloseClick={props.onCloseClick}
         onMarkerClick={props.onMarkerClick}
         handleClusterClick={(cluster) => {
           props.handleClusterClick(cluster)
         }}
-        />
+      />
       <ClusteredMarkerOverlay
         {...props.overlay}
         center={props.center}
         handleMarkerClick={(marker) => {
           props.onMarkerClick(marker)
         }}
-        />
+      />
       { props.modalContent
-          ? <MapDialog {...props} />
-          : null
-        }
+        ? <MapDialog {...props} />
+        : null
+      }
     </GoogleMap>
   )
 }