From 8ba25ddbbb9cc03b1d5da34f8bda811876c459b3 Mon Sep 17 00:00:00 2001 From: Jad Carson Date: Tue, 19 Jul 2016 11:56:13 -0500 Subject: [PATCH 01/20] test --- client/main.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/client/main.js b/client/main.js index e5fa666..a98b843 100644 --- a/client/main.js +++ b/client/main.js @@ -10,7 +10,7 @@ import FavsPage from './components/FavsPage' -//Create the route configuration +//Create the route configuration test render(( From d952a342dfda010436bf532728f1acf44953b590 Mon Sep 17 00:00:00 2001 From: Jennifer Date: Tue, 19 Jul 2016 14:29:06 -0500 Subject: [PATCH 02/20] Updated database --- client/components/ArtGallery.js | 2 +- client/components/ArtWindow.js | 4 ++-- client/components/ArtistPage.js | 2 +- client/components/Artists.js | 2 +- package.json | 8 ++++++++ server/db.js | 2 +- server/main.js | 2 +- 7 files changed, 15 insertions(+), 7 deletions(-) diff --git a/client/components/ArtGallery.js b/client/components/ArtGallery.js index 53b0753..cde7e43 100644 --- a/client/components/ArtGallery.js +++ b/client/components/ArtGallery.js @@ -33,7 +33,7 @@ export default class App extends React.Component { return art.getArt() .then((artwork) => { if(artist) { - this.setState({tempCollection: artwork.filter((art) => art['Artist Name'] == artist)}) + this.setState({tempCollection: artwork.filter((art) => art['Artist Full Name'] == artist)}) } else { this.setState({tempCollection: artwork}) diff --git a/client/components/ArtWindow.js b/client/components/ArtWindow.js index bc4fb77..1da680f 100644 --- a/client/components/ArtWindow.js +++ b/client/components/ArtWindow.js @@ -8,7 +8,7 @@ import * as auth from '../models/auth' import * as art from '../models/art' -const KEYS_TO_FILTERS = ['Artist Name', 'Art Title'] +const KEYS_TO_FILTERS = ['Artist Full Name', 'Art Title'] export default class ArtGallery extends React.Component { constructor(props) { @@ -113,7 +113,7 @@ class Info extends React.Component {

{this.props.currentArt['Art Title']}

-

By: {this.props.currentArt['Artist Name']}

+

By: {this.props.currentArt['Artist Full Name']}

Location: {this.props.currentArt['Art Location Name']}

Likes: {this.props.currentArt.likeCount.length}

diff --git a/client/components/ArtistPage.js b/client/components/ArtistPage.js index 517230a..ff7c92a 100644 --- a/client/components/ArtistPage.js +++ b/client/components/ArtistPage.js @@ -18,7 +18,7 @@ export default class ArtistPage extends React.Component { art.getArt() .then((artwork) => { if(artist) { - this.setState({art: artwork.filter((art) => art['Artist Name'] == artist)}) + this.setState({art: artwork.filter((art) => art['Artist Full Name'] == artist)}) } else { this.setState({art: artwork}) diff --git a/client/components/Artists.js b/client/components/Artists.js index 4c7865d..14c2e6a 100644 --- a/client/components/Artists.js +++ b/client/components/Artists.js @@ -18,7 +18,7 @@ export default class Artists extends React.Component { componentWillMount() { art.getArt() .then((res) => { - this.setState({artists: res.map((obj) => obj['Artist Name']).filter(this.onlyUnique)}) + this.setState({artists: res.map((obj) => obj['Artist Full Name']).filter(this.onlyUnique)}) }) } render() { diff --git a/package.json b/package.json index cdac853..f116ad0 100644 --- a/package.json +++ b/package.json @@ -40,5 +40,13 @@ "react-slick": "^0.12.2", "react-spinjs": "^3.0.0", "uuid-js": "^0.7.5" + }, + + "babel": { + "presets": [ + "es2015", + "react" + ] } + } diff --git a/server/db.js b/server/db.js index 592c945..e34964d 100644 --- a/server/db.js +++ b/server/db.js @@ -1,6 +1,6 @@ var pmongo = require('promised-mongo'); -var uri = 'mongodb://fullstackwizards:pancakes@ds015995.mlab.com:15995/austinart'; +var uri = 'mongodb://jad:carson@ds023485.mlab.com:23485/austin_art'; var db = pmongo(uri, { authMechanism: 'ScramSHA1' diff --git a/server/main.js b/server/main.js index 0be67b3..38ed5a4 100644 --- a/server/main.js +++ b/server/main.js @@ -20,7 +20,7 @@ browserify(path.join(__dirname, '../client/main.js'), { // client asking for art data app.get('/art', function(req,res) { //retrieve all art from db - db.collection('art').find() + db.art.find() .then((art) => { res.send(art) }) From 84fba75bc7a0c718affa40de57dc8f15deaf1102 Mon Sep 17 00:00:00 2001 From: Chris Ritchie Date: Wed, 20 Jul 2016 19:16:03 -0500 Subject: [PATCH 03/20] local-signup working. Some issues with updating username in top right corner after sign up but will figure that out. --- client/components/NavBar.js | 7 +++- server/main.js | 63 +++++++++++++++++++----------- server/passport.js | 76 +++++++++++++++++++++++++++++++++++++ 3 files changed, 122 insertions(+), 24 deletions(-) create mode 100644 server/passport.js diff --git a/client/components/NavBar.js b/client/components/NavBar.js index 62ffaa9..2410b7a 100644 --- a/client/components/NavBar.js +++ b/client/components/NavBar.js @@ -176,14 +176,19 @@ class SignUpModal extends React.Component { e.preventDefault(); auth.signUp({username: this.state.username, password: this.state.password}) .then((x) => { + console.log("xxxxxxxx", x) if(x === 'Success') { this.setState({showError: false}) this.props.onClose(true) this.props.fetchUser() } else { - this.setState({showError: x.statusText}) + this.setState({showError: x}) } }) + // .catch(err => { + // console.log("ERRRRRR", err) + // this.setState({showError: err}) + // }) this.load.call(this); }}>

SignUp

diff --git a/server/main.js b/server/main.js index 38ed5a4..5a361dc 100644 --- a/server/main.js +++ b/server/main.js @@ -2,11 +2,16 @@ var express = require('express'); var path = require('path'); var browserify = require("browserify-middleware"); var bodyParser = require('body-parser'); +var passport = require("passport"); +var LocalStrategy = require('passport-local').Strategy; var Utils = require(path.join(__dirname, './utils.js')); var db = require(path.join(__dirname, './db.js')); var app = express(); +var session = require('express-session') + +require('./passport')(passport); app.use(express.static(path.join(__dirname, "../client/public"))); app.use(bodyParser.json()); @@ -17,6 +22,13 @@ browserify(path.join(__dirname, '../client/main.js'), { }) ); + +app.use(session({ secret: 'keyboard cat', resave: false, saveUninitialized: false })); + + +app.use(passport.initialize()); +app.use(passport.session()); + // client asking for art data app.get('/art', function(req,res) { //retrieve all art from db @@ -26,33 +38,37 @@ app.get('/art', function(req,res) { }) }) -app.post('/signUp', function(req, res) { - var username = req.body.username; +app.post('/signUp',passport.authenticate('local-signup'),function(req, res) { + console.log("IN MAIN NOW") + var username = req.body.username; var password = req.body.password; - - db.collection('users').find({username: username}) - .then((user) => { - if(user[0]){ - res.statusMessage = "Username taken." - res.status(400).end(); - } else { - return Utils.hashPassword(password) - } - }) - .then(function(hash){ - return db.collection('users').insert({username: username, password: hash}); - }) - .then(function(obj){ - var sessionId = Utils.createSessionId(); - return db.collection('sessions').insert({id: obj._id, sessionId: sessionId}); - }) - .then(function(obj){ - res.send(JSON.stringify(obj.sessionId)); - }) + // console.log("req",req.sessionID) + // // console.log("res",res.body) + // db.collection('users').find({username: username}) + // .then((user) => { + // if(user[0]){ + // res.statusMessage = "Username taken." + // res.status(400).end(); + // } else { + // return Utils.hashPassword(password) + // } + // }) + // .then(function(hash){ + // return db.collection('users').insert({username: username, password: hash}); + // }) + // .then(function(obj){ + // var sessionId = Utils.createSessionId(); + // return db.collection('sessions').insert({id: obj._id, sessionId: sessionId}); + // }) + // .then(function(obj){ + console.log("SIGN UP SESSION",req.sessionID) + res.send(JSON.stringify(req.sessionID)); + // }) }) + // Logs in current user as long as username is in users collection and provided a valid password -app.post('/login', function(req, res) { +app.post('/login', function(req, res) { var username = req.body.username; var password = req.body.password; var userID; @@ -77,6 +93,7 @@ app.post('/login', function(req, res) { } }) .then((userObj) => { + console.log("SIGN IN SESSION",userObj.sessionId) res.send(JSON.stringify(userObj.sessionId)) }) }) diff --git a/server/passport.js b/server/passport.js new file mode 100644 index 0000000..b8598fe --- /dev/null +++ b/server/passport.js @@ -0,0 +1,76 @@ +var FACEBOOK_ID = '932055926922953'; +var FACEBOOK_CALLBACK_URL = 'http://localhost:4040/facebookLogin/Callback' +var FACEBOOK_SECRET = 'c283a4b04e8635a09c8ac2d0ed071e30' +var passport = require("passport"); +var LocalStrategy = require('passport-local').Strategy; +var FacebookStrategy = require('passport-facebook').Strategy; +var path = require('path'); +var db = require(path.join(__dirname, './db.js')); +var Utils = require(path.join(__dirname, './utils.js')); + +module.exports = function(passport){ + + passport.serializeUser(function(user, callback){ + console.log("HEY THERE") + console.log("SUSERS", user.userID) + callback(null, user.userID) + }); + + passport.deserializeUser(function(id,callback){ + console.log("Decerael") + User.findById(id, function(err,user){ + callback(err,user) + }) + }) + + passport.use('local-signup', new LocalStrategy( + function(username,password,callback){ + process.nextTick(function(){ + console.log('Local', username, password, callback) + db.collection('users').find({username: username}).then((user) => { + console.log("user", user) + if(user.length > 0){ + if(user[0].username){ + return callback(null,false); + } + } + else { + console.log("ESEESE", password) + return Utils.hashPassword(password).then(function(hash) { + console.log("HASSSSHH", hash) + return db.collection('users').insert({username: username, password: hash}) + }) + .then(function(obj) { + var sessionId = Utils.createSessionId(); + return db.collection('sessions').insert({id: obj._id, sessionId: sessionId}); + }) + .then(function(obj) { + console.log("OBJOBJOBJ", callback) + console.log('SIGNUP USERID SUCCESS', {userID:obj}) + return callback(null, {userID:obj}) + }) + } + }) + } + ) + } + )) + + + // passport.use('local-login', new LocalStrategy({ + + // })) +} + + + + // else{ + // return hashPassword(password).then(function(hashword){ + // return knex('users').returning('userID').where({facebookEmail:username}).update({username:username,password:hashword}).then(function(value){ + // console.log('users',value) + // return callback(null,{userID:value[0]}) + // }) + // }) + + + // } \ No newline at end of file From c94d28fa3fca9101dd2aa04c0fa5c2d3d33379df Mon Sep 17 00:00:00 2001 From: Jad Carson Date: Wed, 20 Jul 2016 19:29:09 -0500 Subject: [PATCH 04/20] Have a working map and now adding extra info to it --- client/components/ArtGallery.js | 3 +- client/components/ArtMap.js | 82 +++++++++++++++++++++++++++++++++ client/components/ArtWindow.js | 7 ++- client/components/ArtistPage.js | 2 +- client/components/Artists.js | 2 +- client/components/HomePage.js | 7 ++- client/components/Map.js | 43 +++++++++++++++++ client/components/NavBar.js | 2 + client/components/theMap.js | 79 +++++++++++++++++++++++++++++++ client/main.js | 7 ++- client/models/art.js | 1 + package.json | 3 ++ server/db.js | 2 +- server/main.js | 10 +++- 14 files changed, 240 insertions(+), 10 deletions(-) create mode 100644 client/components/ArtMap.js create mode 100644 client/components/Map.js create mode 100644 client/components/theMap.js diff --git a/client/components/ArtGallery.js b/client/components/ArtGallery.js index 53b0753..bcaced5 100644 --- a/client/components/ArtGallery.js +++ b/client/components/ArtGallery.js @@ -17,6 +17,7 @@ export default class App extends React.Component { this.update() } update() { + console.log("params",this.props.params) this.fetchArt(this.props.params.artistName) .then(() => { this.getLikes() @@ -33,7 +34,7 @@ export default class App extends React.Component { return art.getArt() .then((artwork) => { if(artist) { - this.setState({tempCollection: artwork.filter((art) => art['Artist Name'] == artist)}) + this.setState({tempCollection: artwork.filter((art) => art['Artist Full Name'] == artist)}) } else { this.setState({tempCollection: artwork}) diff --git a/client/components/ArtMap.js b/client/components/ArtMap.js new file mode 100644 index 0000000..4012909 --- /dev/null +++ b/client/components/ArtMap.js @@ -0,0 +1,82 @@ +import React from 'react' +import {Link} from 'react-router' +import NavBar from './NavBar' +import * as auth from '../models/auth' +import * as art from '../models/art' +import GoogleMap from 'google-map-react'; +import TheMap from './theMap' + + + +export default class ArtistMap extends React.Component { + +constructor() { + super() + this.state = { + artists: [], + artistLat:[], + artName:[], + ArtLocation:[], + ArtTitle:[], + ArtistName:[], + ArtImage:[], + ArtWeb:[] + } + + } + +componentDidMount() { + art.getArt() + .then((res) => { + this.setState({artists: res},(next)=>{ + console.log("artists",this.state.artists) + var newArray = this.state.artName.slice(); + var artLocation = this.state.ArtLocation.slice(); + var artTitle = this.state.ArtTitle.slice(); + var artistName = this.state.ArtistName.slice(); + var artImage = this.state.ArtImage.slice(); + var artWeb = this.state.ArtWeb.slice(); + + var latLong = this.state.artists.map(artist =>{ + newArray.push(artist['Art Location Name']); + artLocation.push(artist['Art Location Street Address']) + artTitle.push(artist['Art Title']) + artistName.push(artist['Artist Full Name']) + artImage.push(artist['Images']) + artWeb.push(artist['Web Detail Page']) + + + var stillNotFormatted = artist.Location.split('(')[1] + var slicedInfo = stillNotFormatted.slice(0,stillNotFormatted.length-1) + var lat = Number(slicedInfo.split(',')[0]) + var lon = Number(slicedInfo.split(',')[1]) + var latLon = {lat:lat,lng:lon} + return latLon + }) + this.setState({artName:newArray}) + this.setState({ArtLocation:newArray}) + this.setState({ArtTitle:newArray}) + this.setState({ArtistName:newArray}) + this.setState({ArtWeb:newArray}) + + console.log("lat",latLong) + this.setState({artistLat:latLong}) + console.log("here") + }) + + + }) + } + + render() { + return ( +
+ +

Artist List

+ {this.state.artistLat.length>0?:null} + +
+ ) + } + + } \ No newline at end of file diff --git a/client/components/ArtWindow.js b/client/components/ArtWindow.js index bc4fb77..b3f3d44 100644 --- a/client/components/ArtWindow.js +++ b/client/components/ArtWindow.js @@ -8,7 +8,7 @@ import * as auth from '../models/auth' import * as art from '../models/art' -const KEYS_TO_FILTERS = ['Artist Name', 'Art Title'] +const KEYS_TO_FILTERS = ['Artist Full Name', 'Art Title'] export default class ArtGallery extends React.Component { constructor(props) { @@ -18,7 +18,9 @@ export default class ArtGallery extends React.Component { showInfo: false, searchTerm: '' } + } + parseImageUrl(imgUrl) { imgUrl = imgUrl.split(';') return imgUrl.filter((x) => x !== '') @@ -39,6 +41,7 @@ export default class ArtGallery extends React.Component { render() { const filteredArt = this.props.gallery.filter(createFilter(this.state.searchTerm, KEYS_TO_FILTERS)) + console.log('propsss',this.props) return (
{/*If the gallery state is not populated, show the loading div. Else diaplay gallery*/} @@ -113,7 +116,7 @@ class Info extends React.Component {

{this.props.currentArt['Art Title']}

-

By: {this.props.currentArt['Artist Name']}

+

By: {this.props.currentArt['Artist Full Name']}

Location: {this.props.currentArt['Art Location Name']}

Likes: {this.props.currentArt.likeCount.length}

diff --git a/client/components/ArtistPage.js b/client/components/ArtistPage.js index 517230a..ff7c92a 100644 --- a/client/components/ArtistPage.js +++ b/client/components/ArtistPage.js @@ -18,7 +18,7 @@ export default class ArtistPage extends React.Component { art.getArt() .then((artwork) => { if(artist) { - this.setState({art: artwork.filter((art) => art['Artist Name'] == artist)}) + this.setState({art: artwork.filter((art) => art['Artist Full Name'] == artist)}) } else { this.setState({art: artwork}) diff --git a/client/components/Artists.js b/client/components/Artists.js index 4c7865d..14c2e6a 100644 --- a/client/components/Artists.js +++ b/client/components/Artists.js @@ -18,7 +18,7 @@ export default class Artists extends React.Component { componentWillMount() { art.getArt() .then((res) => { - this.setState({artists: res.map((obj) => obj['Artist Name']).filter(this.onlyUnique)}) + this.setState({artists: res.map((obj) => obj['Artist Full Name']).filter(this.onlyUnique)}) }) } render() { diff --git a/client/components/HomePage.js b/client/components/HomePage.js index 388662b..b216807 100644 --- a/client/components/HomePage.js +++ b/client/components/HomePage.js @@ -5,20 +5,25 @@ export default class HomePage extends React.Component { //The homepage component with links to gallery and artists page on the two buttons. render() { + return (

AUSTIN ART

- GALLERY + GALLERY ARTISTS
) + } + grabStuff(){ + console.log("hellos") + } } diff --git a/client/components/Map.js b/client/components/Map.js new file mode 100644 index 0000000..215e303 --- /dev/null +++ b/client/components/Map.js @@ -0,0 +1,43 @@ +import React from 'react' +import {GoogleApiWrapper} from 'google-maps-react' +export class Map extends React.Component { + + componentDidUpdate(prevProps, prevState) { + if (prevProps.google !== this.props.google) { + this.loadMap(); + } + } + componentDidMount() { + this.loadMap(); + } + + loadMap() { + if (this.props && this.props.google) { + // google is available + const {google} = this.props; + const maps = google.maps; + + const mapRef = this.refs.map; + const node = ReactDOM.findDOMNode(mapRef); + + let zoom = 14; + let lat = 37.774929; + let lng = -122.419416; + const center = new maps.LatLng(lat, lng); + const mapConfig = Object.assign({}, { + center: center, + zoom: zoom + }) + this.map = new maps.Map(node, mapConfig); + } + } + + render() { + console.log("heyyyy!") + return( +
+

Loading map

+
+ ) + } +} \ No newline at end of file diff --git a/client/components/NavBar.js b/client/components/NavBar.js index 62ffaa9..d9ce546 100644 --- a/client/components/NavBar.js +++ b/client/components/NavBar.js @@ -68,7 +68,9 @@ export default class NavBar extends React.Component {
  • HOME
  • ARTISTS
  • GALLERY
  • +
  • MAP
  • {this.state.loggedIn ?
  • FAVORITES
  • : null} +
  • ACCOUNT
    diff --git a/client/components/theMap.js b/client/components/theMap.js new file mode 100644 index 0000000..d0fa0c8 --- /dev/null +++ b/client/components/theMap.js @@ -0,0 +1,79 @@ +import React from 'react' +//import Map from './Map' +//import {GoogleApiWrapper} from 'GoogleMapsReactComponent' +import {GoogleApiWrapper, Map, Marker, InfoWindow} from 'google-maps-react' + + +export class TheMap extends React.Component { + constructor(props) { + super(props) + this.state = { + artistLocations: [], + activeMarker:{}, + showingInfoWindow:false, + selectedPlace:{} + } + console.log("this",this) + + } + + +onMarkerClick(props, marker, e){ + console.log("hey now") + this.setState({ + selectedPlace: props, + activeMarker: marker, + showingInfoWindow: true + }); + +} +onMapClicked(props){ + console.log("OH MY") + if (this.state.showingInfoWindow) { + this.setState({ + showingInfoWindow: false, + activeMarker: null + }) + } + +} + render() { + const style = { + width: '100vw', + height: '100vh' + } + var positions = this.props.artists; + console.log(this.props.artists[0]) + console.log('SO',this.props) + + + return ( +
    + + {positions.map(yup=>{ + return() + })} + +
    +

    {this.state.selectedPlace.name}

    +
    +
    + + + + +
    + +
    + ) + } +} + +export default GoogleApiWrapper({ + apiKey: 'AIzaSyBBJCIum7iZSy8nRDjJhSjFjRx4nrGZiPU' +})(TheMap) \ No newline at end of file diff --git a/client/main.js b/client/main.js index a98b843..b6eb5d7 100644 --- a/client/main.js +++ b/client/main.js @@ -6,7 +6,7 @@ import Home from './components/HomePage' import Gallery from './components/ArtGallery' import ArtistPage from './components/ArtistPage' import FavsPage from './components/FavsPage' - +import ArtistMap from './components/ArtMap' @@ -15,9 +15,12 @@ render(( - + + + + ), document.getElementById('app')) diff --git a/client/models/art.js b/client/models/art.js index 5034dcc..d3ea168 100644 --- a/client/models/art.js +++ b/client/models/art.js @@ -1,6 +1,7 @@ import fetch from 'isomorphic-fetch'; export function getArt (){ + console.log('hello') let obj = { method: 'GET' }; diff --git a/package.json b/package.json index cdac853..c7b1ae7 100644 --- a/package.json +++ b/package.json @@ -26,6 +26,8 @@ "body-parser": "^1.15.2", "browserify-middleware": "^7.0.0", "express": "^4.13.4", + "google-map-react": "^0.16.0", + "google-maps-react": "^1.0.16", "isomorphic-fetch": "^2.2.1", "node-uuid": "^1.4.7", "nodemon": "^1.9.2", @@ -34,6 +36,7 @@ "react": "^15.1.0", "react-bootstrap": "^0.29.5", "react-dom": "^15.1.0", + "react-google-maps": "^4.11.0", "react-modal-dialog": "^3.0.1", "react-router": "^2.5.2", "react-search-input": "^0.10.1", diff --git a/server/db.js b/server/db.js index 592c945..f8490aa 100644 --- a/server/db.js +++ b/server/db.js @@ -1,6 +1,6 @@ var pmongo = require('promised-mongo'); -var uri = 'mongodb://fullstackwizards:pancakes@ds015995.mlab.com:15995/austinart'; +var uri ='mongodb://jad:carson@ds023485.mlab.com:23485/austin_art'; var db = pmongo(uri, { authMechanism: 'ScramSHA1' diff --git a/server/main.js b/server/main.js index 0be67b3..2948e55 100644 --- a/server/main.js +++ b/server/main.js @@ -20,11 +20,19 @@ browserify(path.join(__dirname, '../client/main.js'), { // client asking for art data app.get('/art', function(req,res) { //retrieve all art from db - db.collection('art').find() + db.art.find() .then((art) => { res.send(art) }) }) +app.post('/insertArt',function(req,res){ + db.collection('art').insert(req.body).then(function(value){ + db.collection('art').find().then(function(value){ + res.send(value) + }) + }) + +}) app.post('/signUp', function(req, res) { var username = req.body.username; From 7824ed588b1b7caf0599330203e56998a7e67cad Mon Sep 17 00:00:00 2001 From: sdavisonswim Date: Wed, 20 Jul 2016 20:00:22 -0500 Subject: [PATCH 05/20] added 'trash' button, need to add logic so you cant like and trash the same photo --- client/components/ArtGallery.js | 23 ++++++++++++-- client/components/ArtWindow.js | 20 ++++++++++++- client/models/art.js | 10 +++++++ client/models/auth.js | 14 +++++++++ server/main.js | 53 +++++++++++++++++++++++++++++++++ 5 files changed, 117 insertions(+), 3 deletions(-) diff --git a/client/components/ArtGallery.js b/client/components/ArtGallery.js index cde7e43..9b2cc32 100644 --- a/client/components/ArtGallery.js +++ b/client/components/ArtGallery.js @@ -14,14 +14,19 @@ export default class App extends React.Component { } componentWillMount() { - this.update() + if(true){ + this.update() + } } + update() { this.fetchArt(this.props.params.artistName) .then(() => { this.getLikes() + this.getTrash() }) } + signUp(userData) { auth.signUp(userData) } @@ -54,12 +59,26 @@ export default class App extends React.Component { }) } + getTrash(){ + var trashResults = []; + this.state.tempCollection.forEach((artWork) => { + art.getTrash(artWork._id) + .then((trashCount) => { + trashResults.push(Object.assign(artWork, {trashCount: trashCount.trashCount})) + if (trashResults.length === this.state.tempCollection.length) { + this.setState({trashCollection: trashResults}) + } + }) + }) + } + + render(){ return (


    - +
    ) } diff --git a/client/components/ArtWindow.js b/client/components/ArtWindow.js index 1da680f..77ccf6f 100644 --- a/client/components/ArtWindow.js +++ b/client/components/ArtWindow.js @@ -33,9 +33,13 @@ export default class ArtGallery extends React.Component { searchUpdated (term) { this.setState({searchTerm: term}) } + updateCurrent(likeCount) { this.setState({currentArt: Object.assign(this.state.currentArt, {likeCount: likeCount.likeCount})}) } + updateCurrentTrash(trashCount) { + this.setState({currentArt: Object.assign(this.state.currentArt, {trashCount: trashCount.trashCount})}) + } render() { const filteredArt = this.props.gallery.filter(createFilter(this.state.searchTerm, KEYS_TO_FILTERS)) @@ -54,7 +58,7 @@ export default class ArtGallery extends React.Component {
    {this.state.showInfo ? - + : null} {filteredArt.map((art) => { return ( @@ -116,6 +120,8 @@ class Info extends React.Component {

    By: {this.props.currentArt['Artist Full Name']}

    Location: {this.props.currentArt['Art Location Name']}

    Likes: {this.props.currentArt.likeCount.length}

    +

    Trash: {this.props.currentArt.trashCount.length}

    +
    {images.map((x) =>
    )} @@ -144,6 +150,18 @@ class Info extends React.Component { }>{this.state.userFavs.includes(this.props.currentArt._id) ? "Unfav!" : "Fav!"} + +
    : ''} diff --git a/client/models/art.js b/client/models/art.js index 5034dcc..df89483 100644 --- a/client/models/art.js +++ b/client/models/art.js @@ -19,3 +19,13 @@ export function getLikes(artId) { return artwork.json() }) } + +export function getTrash(artId) { + let obj = { + method: 'GET' + }; + return fetch(`/trash/${artId}`, obj) + .then((artwork) => { + return artwork.json() + }) +} diff --git a/client/models/auth.js b/client/models/auth.js index f1e3aa3..7b8fa67 100644 --- a/client/models/auth.js +++ b/client/models/auth.js @@ -54,6 +54,20 @@ export function likePhoto(artId) { }) } +export function trashPhoto(artId) { + let obj = { + method: "POST", + headers: { + 'Content-Type': 'application/json' + }, + body: JSON.stringify({cookie: document.cookie}) + } + return fetch(`/trash/${artId}`, obj) + .then(function(data){ + return data.json() + }) +} + export function favoritePhoto(artId) { let obj = { method: "POST", diff --git a/server/main.js b/server/main.js index 38ed5a4..282b98f 100644 --- a/server/main.js +++ b/server/main.js @@ -220,6 +220,59 @@ app.post('/like/:id', function(req, res){ } }) +app.post('/trash/:id', function(req, res){ + var artId = req.params.id; + var sessionId = req.body.cookie.substring(10); + var userId; + + if(!sessionId){ + res.sendStatus(401) + } else { + db.collection('sessions').find({ sessionId: sessionId }) + .then((users) => { + // Get user id from session + userId = users[0].id; + return db.collection('users').find({ _id: userId }) + }) + .then((users) => { + // Check if user exists + if(users[0]){ + return db.collection('trash').find({ userId: userId, artId: artId }) + } else { + // User doesn't exist, send back -bad request- + res.sendStatus(400) + } + }) + .then((trash) => { + // Check if user has already liked the art + if(trash[0]){ + // if so then the user will unlike the art + return db.collection('trash').remove({ userId: userId, artId: artId }) + } else { + // if not then the user will like the art + return db.collection('trash').insert({ userId: userId, artId: artId }) + } + + }) + .then((result) => { + res.send({ "Status": "Success" }) + }) + } +}) + +app.get('/trash/:id', function(req, res){ + var artId = req.params.id; + + if(!artId){ + res.status(400).send({"Error": "No art id... Come on now"}) + } else { + db.collection("trash").find({ artId: artId }) + .then((trash) => { + res.send({ trashCount: trash.map((x) => x.userId) }) + }) + } +}) + app.get('/likes/:id', function(req, res){ var artId = req.params.id; From 99825680a3a5c1a0e2c346fa711cad9328d9ad99 Mon Sep 17 00:00:00 2001 From: Jad Carson Date: Wed, 20 Jul 2016 20:01:01 -0500 Subject: [PATCH 06/20] sending correct props --- client/components/ArtMap.js | 50 ++++++++++++++++++++----------------- client/components/theMap.js | 6 +++-- 2 files changed, 31 insertions(+), 25 deletions(-) diff --git a/client/components/ArtMap.js b/client/components/ArtMap.js index 4012909..3a3fab0 100644 --- a/client/components/ArtMap.js +++ b/client/components/ArtMap.js @@ -15,7 +15,7 @@ constructor() { this.state = { artists: [], artistLat:[], - artName:[], + ArtName:[], ArtLocation:[], ArtTitle:[], ArtistName:[], @@ -30,21 +30,21 @@ componentDidMount() { .then((res) => { this.setState({artists: res},(next)=>{ console.log("artists",this.state.artists) - var newArray = this.state.artName.slice(); - var artLocation = this.state.ArtLocation.slice(); - var artTitle = this.state.ArtTitle.slice(); - var artistName = this.state.ArtistName.slice(); - var artImage = this.state.ArtImage.slice(); - var artWeb = this.state.ArtWeb.slice(); + var ArtName = this.state.ArtName.slice(); + var ArtLocation = this.state.ArtLocation.slice(); + var ArtTitle = this.state.ArtTitle.slice(); + var ArtistName = this.state.ArtistName.slice(); + var ArtImage = this.state.ArtImage.slice(); + var ArtWeb = this.state.ArtWeb.slice(); var latLong = this.state.artists.map(artist =>{ - newArray.push(artist['Art Location Name']); - artLocation.push(artist['Art Location Street Address']) - artTitle.push(artist['Art Title']) - artistName.push(artist['Artist Full Name']) - artImage.push(artist['Images']) - artWeb.push(artist['Web Detail Page']) - + ArtName.push(artist['Art Location Name']); + ArtLocation.push(artist['Art Location Street Address']) + ArtTitle.push(artist['Art Title']) + ArtistName.push(artist['Artist Full Name']) + ArtImage.push(artist['Images']) + ArtWeb.push(artist['Web Detail Page']) + //console.log("what",artTitle) var stillNotFormatted = artist.Location.split('(')[1] var slicedInfo = stillNotFormatted.slice(0,stillNotFormatted.length-1) @@ -53,15 +53,19 @@ componentDidMount() { var latLon = {lat:lat,lng:lon} return latLon }) - this.setState({artName:newArray}) - this.setState({ArtLocation:newArray}) - this.setState({ArtTitle:newArray}) - this.setState({ArtistName:newArray}) - this.setState({ArtWeb:newArray}) - - console.log("lat",latLong) + this.setState({ArtName}) + this.setState({ArtLocation}) + this.setState({ArtTitle}) + this.setState({ArtistName}) + this.setState({ArtWeb},function(){ + // console.log("here",this.state.artName) + // console.log("ok",this.state.ArtTitle) + // console.log("here",this.state.artWeb) + // console.log("ok",this.state.artistName) + }) + this.setState({artistLat:latLong}) - console.log("here") + }) @@ -73,7 +77,7 @@ componentDidMount() {

    Artist List

    - {this.state.artistLat.length>0?:null} + {this.state.artistLat.length>0?:null}
    ) diff --git a/client/components/theMap.js b/client/components/theMap.js index d0fa0c8..4048496 100644 --- a/client/components/theMap.js +++ b/client/components/theMap.js @@ -53,14 +53,16 @@ onMapClicked(props){ {lat: 30.267153, lng: -97.743061} }> - {positions.map(yup=>{ - return() + {positions.map((yup,index)=>{ + return() })}

    {this.state.selectedPlace.name}

    +

    {this.state.selectedPlace.location}

    +

    {this.state.selectedPlace.title}

    From ea1164389c88064df5635a35652d2271b219ccee Mon Sep 17 00:00:00 2001 From: sdavisonswim Date: Thu, 21 Jul 2016 11:19:37 -0500 Subject: [PATCH 07/20] added logic so that you can only like OR trash a pic, not both --- client/components/ArtWindow.js | 50 +++++++++++++++++++--------------- 1 file changed, 28 insertions(+), 22 deletions(-) diff --git a/client/components/ArtWindow.js b/client/components/ArtWindow.js index 77ccf6f..0ce951b 100644 --- a/client/components/ArtWindow.js +++ b/client/components/ArtWindow.js @@ -8,6 +8,8 @@ import * as auth from '../models/auth' import * as art from '../models/art' +var trashClass = "displayInline"; + const KEYS_TO_FILTERS = ['Artist Full Name', 'Art Title'] export default class ArtGallery extends React.Component { @@ -131,17 +133,19 @@ class Info extends React.Component { {document.cookie ?
    - + {(this.props.currentArt.trashCount.includes(this.state.userId)) ? '' : + + } - + {(this.props.currentArt.likeCount.includes(this.state.userId)) ? '' : + + }
    : ''} From b60604a886b47dd5ab174c521627a4c7ed7b480b Mon Sep 17 00:00:00 2001 From: Jennifer Date: Thu, 21 Jul 2016 16:37:26 -0500 Subject: [PATCH 08/20] Began implementing filter; does not re-render --- client/components/ArtWindow.js | 42 +++++++++++---- client/components/Filter.js | 96 ++++++++++++++++++++++++++++++++++ client/components/HomePage.js | 9 ++-- client/components/NavBar.js | 42 +++++++++++---- client/public/css/style.css | 89 +++++++++++++++++++++---------- client/public/index.html | 4 +- 6 files changed, 229 insertions(+), 53 deletions(-) create mode 100644 client/components/Filter.js diff --git a/client/components/ArtWindow.js b/client/components/ArtWindow.js index 1da680f..d1fbefd 100644 --- a/client/components/ArtWindow.js +++ b/client/components/ArtWindow.js @@ -3,12 +3,13 @@ import {ModalContainer, ModalDialog} from 'react-modal-dialog'; import ReactSpinner from 'react-spinjs'; import SearchInput, {createFilter} from 'react-search-input' import NavBar from './NavBar' +import Filter from './Filter' import Slider from 'react-slick' import * as auth from '../models/auth' import * as art from '../models/art' -const KEYS_TO_FILTERS = ['Artist Full Name', 'Art Title'] +const KEYS_TO_FILTERS = ['Artist Full Name', 'Art Title', 'Art Location Zip', 'Art Location Name'] export default class ArtGallery extends React.Component { constructor(props) { @@ -16,7 +17,8 @@ export default class ArtGallery extends React.Component { this.state = { showInfo: false, - searchTerm: '' + searchTerm: [''], + } } parseImageUrl(imgUrl) { @@ -31,21 +33,37 @@ export default class ArtGallery extends React.Component { this.setState({showInfo: false}); } searchUpdated (term) { - this.setState({searchTerm: term}) + var words = this.state.searchTerm; + console.log('what the fuck is this', this) + console.log('what is happening', words) + contacts.unshift(term); + console.log('is this updated?????', words[0]) } updateCurrent(likeCount) { this.setState({currentArt: Object.assign(this.state.currentArt, {likeCount: likeCount.likeCount})}) } + addToSearchTerm(contact) { + var contacts = this.searchTerm; + console.log(this) + console.log(contacts) + contacts.unshift(contact); + console.log(contacts[0]) + + } + render() { - const filteredArt = this.props.gallery.filter(createFilter(this.state.searchTerm, KEYS_TO_FILTERS)) + const filteredArt = this.props.gallery.filter(createFilter(this.state.searchTerm[0], KEYS_TO_FILTERS)) + {console.log('DA FUCK IS THIS', this.state.searchTerm)} + return (
    {/*If the gallery state is not populated, show the loading div. Else diaplay gallery*/} - {!this.props.gallery[0] ? + {!this.props.gallery[0] + ?
    -

    Drawing pictures...

    - +


    Finding your 'art'

    +
    :
    @@ -65,6 +83,11 @@ export default class ArtGallery extends React.Component { })}
    } + + + {} + +
    ) } @@ -98,6 +121,7 @@ class Info extends React.Component { } //The info modal that pops up with the props currentArt set as the object of the work of art you clicked on render() { + let images = this.props.parseImageUrl(this.props.currentArt.Images); let settings = { dots: true, @@ -112,10 +136,10 @@ class Info extends React.Component { -

    {this.props.currentArt['Art Title']}

    +

    {this.props.currentArt['Art Title']}

    By: {this.props.currentArt['Artist Full Name']}

    Location: {this.props.currentArt['Art Location Name']}

    -

    Likes: {this.props.currentArt.likeCount.length}

    +

    Likes: {this.props.currentArt.likeCount.length}

    {images.map((x) =>
    )} diff --git a/client/components/Filter.js b/client/components/Filter.js new file mode 100644 index 0000000..f97e4bc --- /dev/null +++ b/client/components/Filter.js @@ -0,0 +1,96 @@ +import React from 'react' +import {Link} from 'react-router' +import {ModalContainer, ModalDialog} from 'react-modal-dialog'; +import ReactSpinner from 'react-spinjs'; +import ArtWindow from './ArtWindow'; + +import * as auth from '../models/auth' + +export default class Filter extends React.Component { + + constructor() { + super() + + this.state = { + isLoading: false, + showError: false, + artists: null, + locations: null, + zip: null, + } + + } + + load() { + this.setState({isLoading: true}); + setTimeout(() => { + this.setState({isLoading: false}); + }, 1500); + } + + render() { + + var artList; + if(this.props.gallery){ + artList = this.props.gallery; + } + + return + {this.state.isLoading ? + + : + +
    { + e.preventDefault(); + this.props.onClose(true); + this.load.call(this); + }}> +

    Filter

    + +


    + +


    + +


    +

    +
    +
    + } + +
    ; + } +} + diff --git a/client/components/HomePage.js b/client/components/HomePage.js index 388662b..74b347d 100644 --- a/client/components/HomePage.js +++ b/client/components/HomePage.js @@ -1,22 +1,25 @@ import React, {PropTypes} from 'react'; import {Link} from 'react-router'; +import NavBar from './NavBar' export default class HomePage extends React.Component { //The homepage component with links to gallery and artists page on the two buttons. render() { return ( -
    +
    +
    -

    AUSTIN ART

    + {/*

    AUSTIN ART

    GALLERY ARTISTS + */}
    -
    +
    ) } } diff --git a/client/components/NavBar.js b/client/components/NavBar.js index 62ffaa9..04b7a23 100644 --- a/client/components/NavBar.js +++ b/client/components/NavBar.js @@ -2,6 +2,8 @@ import React from 'react' import {Link} from 'react-router' import {ModalContainer, ModalDialog} from 'react-modal-dialog'; import ReactSpinner from 'react-spinjs'; +import ArtWindow from './ArtWindow' +import Filter from './Filter' import * as auth from '../models/auth' @@ -11,6 +13,7 @@ export default class NavBar extends React.Component { this.state = { showLogin: false, showSignup: false, + showFilter: false, showError: false, loggedIn: document.cookie, username: null @@ -39,6 +42,12 @@ export default class NavBar extends React.Component { this.setState({loggedIn: bool}) this.setState({showSignup: false}); } + openFilter() { + this.setState({showFilter: true}); + } + closeFilter(bool) { + this.setState({showFilter: false}); + } logout(name) { document.cookie = 'sessionId' + '=; expires=Thu, 01 Jan 1970 00:00:01 GMT;'; this.setState({loggedIn: false}) @@ -58,27 +67,31 @@ export default class NavBar extends React.Component { //Render the navbar render() { + + return(
    -
      +
      • {/* Populate the navbar items. Use from react router to add links to different views. */} -
      • HOME
      • -
      • ARTISTS
      • -
      • GALLERY
      • - {this.state.loggedIn ?
      • FAVORITES
      • : null} -
      • - ACCOUNT -
        +
      • AUSTIN PUBLIC ART
      • +
      • ARTISTS
      • +
      • GALLERY
      • + {this.state.loggedIn ?
      • FAVORITES
      • : null} + + {this.props.gallery ?
      • FILTER
      • : null } + +
      • + ACCOUNT +
        {!this.state.loggedIn ? : Logout}
      • -
      • -
      • {this.drawUsername()}
      • + {this.state.loggedIn ?
      • {this.drawUsername()}
      • : null}
      {this.state.showSignup ? @@ -86,6 +99,13 @@ export default class NavBar extends React.Component { {this.state.showLogin ? : null} + {this.state.showFilter ? + + + + + + : null}
    ) } @@ -198,4 +218,4 @@ class SignUpModal extends React.Component { }
    ; } -} \ No newline at end of file +} diff --git a/client/public/css/style.css b/client/public/css/style.css index b4781c2..d421e7e 100644 --- a/client/public/css/style.css +++ b/client/public/css/style.css @@ -6,22 +6,26 @@ .slideContainer { margin: 0 auto; padding: 40px; - width: 800px; + width: 600px; height: 1000px color: #333; - background: black; +/* background: black;*/ } -.loadingDiv { - background-color: lightgrey; + +.loadingDiv { + text-align: -webkit-center; +/* background-color: lightgrey; width: 300px; border: 10px solid black; padding: 25px; - margin: auto; + margin: auto;*/ } -.loadingDiv p { + +/*.loadingDiv p { padding-top: 50px; text-align: -webkit-center; -} +}*/ + .closeButton--jss-0-1 { display: none !important; } @@ -29,15 +33,15 @@ color: red; } .artImage { - height: 345px; - width: 345px; + height: 250px; + width: 250px; border-radius: 100%; display: block; margin: 0 auto; } .artGallery { --moz-column-count: 3; --webkit-column-count: 3; +-moz-column-count: 4; +-webkit-column-count: 4; } .search-input { margin: 0 100px 10px 100px; @@ -48,11 +52,10 @@ text-align: center; } .artwork{ - display: block; margin: 0 auto; - height: 360px; - width: 360px; + height: 275px; + width: 275px; } .artTitle{ text-align: center; @@ -143,7 +146,7 @@ p { /* home section styles /* ========================================== */ #home { - background: url('../images/austin-texas-wallpaper-1.jpg') 50% 0 repeat-y fixed; + background: url('http://4.bp.blogspot.com/-uP2IZK4vPFc/UxlnO8hTk0I/AAAAAAAAASo/mNoQ9NuwIgM/s1600/IMG_1070.JPG') 50% 0 repeat-y fixed; -webkit-background-size: cover; background-size: cover; background-position: center center; @@ -159,38 +162,68 @@ p { text-align: center; } -#home h1 { - color: white; -} -#home .btn-danger { - background: black !important; - margin-right: 20px; +#home p { + color: white; + /* font-family: Arial, Helvetica, sans-serif;*/ + font-size: 125px; } -#home .btn-danger:hover { - background: #ffa400 !important; +/*#home span { + background-color: rgba(10, 128, 128, .5); } - +*/ #home .btn { - background: #4C8DF8; + background: transparent; border-color: transparent; color: #ffffff; - font-size: 12px; - font-weight: bold; + font-size: 33px; + /*font-weight: bold;*/ padding: 14px 52px; margin-top: 40px; transition: all 0.4s ease-in-out; } +/*#home .btn-danger { + background: black !important; + margin-right: 20px; +} + +#home .btn-danger:hover { + background: #ffa400 !important; +} + #home .btn:hover { background: #ffa400; -} +}*/ /* Navbar styles */ /* ========================================= */ + .usernameSpan { margin: 30px; position: relative; top: 11.5px; } + +/* Home Page Borders */ +/* ========================================= */ +/*#home .top, .bottom, .left, .right { + background: teal; + position: fixed; + opacity: 0.5; + } + +#home .left, .right { + top: 0; bottom: 0; + width: 15px; + } + .left { left: 0; } + .right { right: 0; } + +#home .top, .bottom { + left: 0; right: 0; + height: 15px; + } + .top { top: 0; } + .bottom { bottom: 0; }*/ \ No newline at end of file diff --git a/client/public/index.html b/client/public/index.html index ad35b08..cff327a 100644 --- a/client/public/index.html +++ b/client/public/index.html @@ -1,7 +1,7 @@ - Austin Art + LEGACY: Austin Art @@ -14,7 +14,7 @@ From 83829013b2c625ed06a26ebe8d9771a425bbdb2b Mon Sep 17 00:00:00 2001 From: Chris Ritchie Date: Thu, 21 Jul 2016 18:53:52 -0500 Subject: [PATCH 09/20] local login and signup working for the most part... some odd things with signup when checkning if user exists. Facebook login returning data but need to redirect correctly and then append data to front end. --- client/components/NavBar.js | 5 +- client/models/auth.js | 10 ++- server/main.js | 61 +++++++++++------- server/passport.js | 122 +++++++++++++++++++++++++++++++----- 4 files changed, 156 insertions(+), 42 deletions(-) diff --git a/client/components/NavBar.js b/client/components/NavBar.js index 2410b7a..ea70bd4 100644 --- a/client/components/NavBar.js +++ b/client/components/NavBar.js @@ -74,7 +74,8 @@ export default class NavBar extends React.Component {
    {!this.state.loggedIn ? : - Logout} + Logout} + Facebook
  • @@ -182,7 +183,7 @@ class SignUpModal extends React.Component { this.props.onClose(true) this.props.fetchUser() } else { - this.setState({showError: x}) + this.setState({showError: x.statusText}) } }) // .catch(err => { diff --git a/client/models/auth.js b/client/models/auth.js index f1e3aa3..6231980 100644 --- a/client/models/auth.js +++ b/client/models/auth.js @@ -11,12 +11,18 @@ export function signUp(userData) { } return fetch(`/signUp`, obj) .then(function(data){ + console.log("DATATATATATA", data) if(data.status < 400) { return data.json().then((data) => { + console.log("INSIDE OF THIS", data) document.cookie = "sessionId=" + data + ";path=/" return "Success" }) - } else return data + } + else{ + console.log("elseelse", data) + return data + } }) } @@ -31,8 +37,10 @@ export function login(userData) { } return fetch(`/login`, obj) .then(function(data){ + console.log("datalogin", data) if(data.status < 400) { return data.json().then((data) => { + console.log("logIN", data) document.cookie = "sessionId=" + data + ";path=/" return "Success" }) diff --git a/server/main.js b/server/main.js index 5a361dc..abc2b98 100644 --- a/server/main.js +++ b/server/main.js @@ -29,6 +29,19 @@ app.use(session({ secret: 'keyboard cat', resave: false, saveUninitialized: fals app.use(passport.initialize()); app.use(passport.session()); + +app.get('/facebookLogin', + passport.authenticate('facebook')); + + +app.get('/facebookLogin/Callback', + passport.authenticate('facebook', { failureRedirect: '/' }), + function(req, res) { + console.log("REQQQQQQQ",req.body) + console.log("RESSSSSSS",res.body) + res.redirect('/'); + }); + // client asking for art data app.get('/art', function(req,res) { //retrieve all art from db @@ -42,36 +55,40 @@ app.post('/signUp',passport.authenticate('local-signup'),function(req, res) { console.log("IN MAIN NOW") var username = req.body.username; var password = req.body.password; - // console.log("req",req.sessionID) - // // console.log("res",res.body) - // db.collection('users').find({username: username}) - // .then((user) => { - // if(user[0]){ - // res.statusMessage = "Username taken." - // res.status(400).end(); - // } else { - // return Utils.hashPassword(password) - // } - // }) - // .then(function(hash){ - // return db.collection('users').insert({username: username, password: hash}); - // }) - // .then(function(obj){ - // var sessionId = Utils.createSessionId(); - // return db.collection('sessions').insert({id: obj._id, sessionId: sessionId}); - // }) - // .then(function(obj){ + console.log("req",req.sessionID) + // console.log("res",res.body) + db.collection('users').find({username: username}) + .then((user) => { + console.log("USERS MAIN",user) + console.log("USERS[0]", user[0]) + if(user[0]){ + res.statusMessage = "Username taken." + res.status(400).end(); + } else { + return Utils.hashPassword(password) + } + }) + .then(function(hash){ + return db.collection('users').insert({username: username, password: hash}); + }) + .then(function(obj){ + var sessionId = Utils.createSessionId(); + return db.collection('sessions').insert({id: obj._id, sessionId: sessionId}); + }) + .then(function(obj){ console.log("SIGN UP SESSION",req.sessionID) - res.send(JSON.stringify(req.sessionID)); - // }) + res.send(JSON.stringify(obj.sessionId)); + }) }) // Logs in current user as long as username is in users collection and provided a valid password -app.post('/login', function(req, res) { +app.post('/login', passport.authenticate('local-login'),function(req, res) { var username = req.body.username; var password = req.body.password; var userID; + console.log("REQID", req.sessionId) + console.log("REQID", req.sessionID) db.collection('users') .find({username: username}) .then((userObj) => { diff --git a/server/passport.js b/server/passport.js index b8598fe..3d40bdf 100644 --- a/server/passport.js +++ b/server/passport.js @@ -1,6 +1,7 @@ var FACEBOOK_ID = '932055926922953'; var FACEBOOK_CALLBACK_URL = 'http://localhost:4040/facebookLogin/Callback' var FACEBOOK_SECRET = 'c283a4b04e8635a09c8ac2d0ed071e30' +var PROFILE_FIELDS = ['id', 'email', 'gender', 'link', 'locale', 'name', 'timezone', 'updated_time', 'verified'] var passport = require("passport"); var LocalStrategy = require('passport-local').Strategy; var FacebookStrategy = require('passport-facebook').Strategy; @@ -12,14 +13,22 @@ module.exports = function(passport){ passport.serializeUser(function(user, callback){ console.log("HEY THERE") - console.log("SUSERS", user.userID) - callback(null, user.userID) + console.log("SUSERS", user) + callback(null, user.userID || user.facebookID || user) }); passport.deserializeUser(function(id,callback){ - console.log("Decerael") - User.findById(id, function(err,user){ - callback(err,user) + console.log("Decerael" , id) + findUserByID(id).then(function(value){ + console.log("value", value) + if(value){ + console.log("IFVALUE!!!!!!", value) + done(null, value); + } + else{ + console.log("ELSE") + done('no session exists',value) + } }) }) @@ -36,7 +45,8 @@ module.exports = function(passport){ } else { console.log("ESEESE", password) - return Utils.hashPassword(password).then(function(hash) { + return Utils.hashPassword(password) + .then(function(hash) { console.log("HASSSSHH", hash) return db.collection('users').insert({username: username, password: hash}) }) @@ -56,21 +66,99 @@ module.exports = function(passport){ } )) + passport.use('local-login', new LocalStrategy( + function(username, password, callback) { + console.log('LOCAL LOGIN', username, password, callback) + process.nextTick(function() { + db.collection('users').find({username: username}).then((user) => { + console.log('USERVALUE', user) + if(user.length > 0) { + Utils.comparePassword(user[0].password, password).then(val => { + if (val === true) { + console.log('CORRECT PASSWORD') + return callback(null, user[0]); + } else { + console.log('user exists, but wrong password') + return callback(null, false, flash('badPass', 'Incorrect password')); + } + }) + .catch(val => { + console.log('Password incorrect', val); + return callback(null, false, flash('badPass', 'Incorrect password')); + }) + } else { + console.log('User not found'); + return callback(null, false, flash('noUser', 'Username not found')); + } + }) + }) + } + )) - // passport.use('local-login', new LocalStrategy({ - // })) + passport.use(new FacebookStrategy({ + clientID: FACEBOOK_ID, + clientSecret: FACEBOOK_SECRET, + callbackURL : FACEBOOK_CALLBACK_URL, + profileFields : PROFILE_FIELDS, + enableProof: true + },function(token,refreshToken,profile,done){ + process.nextTick(function(){ + console.log('profile',profile.id, profile[0]) + // check if in users database + // return db.collection('FBusers').find({facebookID: profile.id}).then(function(uservalue){ + // console.log("THIS VALUE1ST!!",userValue) + // if(userValue.length>0){ + // console.log("VALUEINFBSTAR", userValue) + // return done(null, userValue) //already exists + // } + // else{ + addFacebookUser(profile,token).then(function(userValue){ + console.log('HASH',userValue) + return done(null,userValue) + }) + }) + // return done(null,profile) + //doesn't exist + + })) } +// // }) +// // } +// // )) +// } + function addFacebookUser(user,token) { + console.log('USER',user, "token" ,token) + //check if user exists. Via email. If not, make new, is yes, update existing + // return db.collection('FBusers').find({facebookID: user.id}).then(function(existingUser){ + // if(existingUser.length>0){ + // return db.collection + return db.collection('FBusers').insert({ + facebookID: user.id, + facebookToken: token, + // facebookEmail:user.emails[0].value}) + }) + } + //create new user + // }) + // } - // else{ - // return hashPassword(password).then(function(hashword){ - // return knex('users').returning('userID').where({facebookEmail:username}).update({username:username,password:hashword}).then(function(value){ - // console.log('users',value) - // return callback(null,{userID:value[0]}) - // }) - // }) - + var findUserByID = function(ID) { + console.log("FINDUSERID", ID) + return db.collection('FBusers').find({ + facebookID : ID + }).then(function(value) { + console.log('valueIDID',value) + if (value.length > 0) { + return value[0]; + } + return false; + }) +} - // } \ No newline at end of file +//need to add a FB user to the database. Then i will be able to check for the id +// + // })) +// } From ffc62e273da754d3e7e2e151c532e507f975fc7b Mon Sep 17 00:00:00 2001 From: Jad Carson Date: Thu, 21 Jul 2016 19:08:21 -0500 Subject: [PATCH 10/20] maps work, had to set up some simple redux --- client/actions/index.js | 9 +++ client/components/ArtMap.js | 11 ++-- client/components/ArtWindow.js | 3 + client/components/googleMapTrial.js | 88 +++++++++++++++++++++++++++++ client/components/theMap.js | 87 ++++++++++++++++++++-------- client/main.js | 11 ++-- client/reducers/index.js | 11 ++++ client/reducers/reducer_google.js | 15 +++++ package.json | 3 + 9 files changed, 208 insertions(+), 30 deletions(-) create mode 100644 client/actions/index.js create mode 100644 client/components/googleMapTrial.js create mode 100644 client/reducers/index.js create mode 100644 client/reducers/reducer_google.js diff --git a/client/actions/index.js b/client/actions/index.js new file mode 100644 index 0000000..672a7f8 --- /dev/null +++ b/client/actions/index.js @@ -0,0 +1,9 @@ +export const FETCH_GOOGLE = 'FETCH_GOOGLE' + +export function fetchGoogle(google) { + console.log("fetching") + return{ + type:FETCH_GOOGLE, + payload: google + } +} diff --git a/client/components/ArtMap.js b/client/components/ArtMap.js index 3a3fab0..23d1bf9 100644 --- a/client/components/ArtMap.js +++ b/client/components/ArtMap.js @@ -5,7 +5,9 @@ import * as auth from '../models/auth' import * as art from '../models/art' import GoogleMap from 'google-map-react'; import TheMap from './theMap' - +import {connect} from 'react-redux' +import { bindActionCreators} from 'redux'; +import {fetchFilter} from '../actions/index'; export default class ArtistMap extends React.Component { @@ -57,6 +59,7 @@ componentDidMount() { this.setState({ArtLocation}) this.setState({ArtTitle}) this.setState({ArtistName}) + this.setState({ArtImage}) this.setState({ArtWeb},function(){ // console.log("here",this.state.artName) // console.log("ok",this.state.ArtTitle) @@ -75,12 +78,12 @@ componentDidMount() { render() { return (
    - +

    Artist List

    - {this.state.artistLat.length>0?:null} + {this.state.artistLat.length>0?:null}
    ) } - } \ No newline at end of file + } diff --git a/client/components/ArtWindow.js b/client/components/ArtWindow.js index b3f3d44..4c3b4a7 100644 --- a/client/components/ArtWindow.js +++ b/client/components/ArtWindow.js @@ -6,6 +6,7 @@ import NavBar from './NavBar' import Slider from 'react-slick' import * as auth from '../models/auth' import * as art from '../models/art' +import AMap from './googleMapTrial' const KEYS_TO_FILTERS = ['Artist Full Name', 'Art Title'] @@ -119,11 +120,13 @@ class Info extends React.Component {

    By: {this.props.currentArt['Artist Full Name']}

    Location: {this.props.currentArt['Art Location Name']}

    Likes: {this.props.currentArt.likeCount.length}

    +
    {images.map((x) =>
    )}
    + {/* Check if logged in (document.cookie?), if true display Like and Favorite button */} {document.cookie ?
    diff --git a/client/components/googleMapTrial.js b/client/components/googleMapTrial.js new file mode 100644 index 0000000..4ecea3e --- /dev/null +++ b/client/components/googleMapTrial.js @@ -0,0 +1,88 @@ +import React from 'react'; +import ReactDOM from 'react-dom'; +import {Gmaps, Marker, InfoWindow, Circle} from 'react-gmaps'; + + +export default class AMap extends React.Component { + +constructor(props) { + super(props) + + this.state = { + lat:Number(this.props.location[0]), + lng: Number(this.props.location[1]), + location:{} + } + + console.log("Location",this.props.location) + navigator.geolocation.getCurrentPosition(suc.bind(this),fail); + function suc(position){ + var latitude = position.coords.latitude; + var longitude = position.coords.longitude; + this.setState({location:{lat:latitude,lng:longitude}}) + } + function fail(){ + console.log("booo!") + } + } + + + + onMapCreated(map) { + map.setOptions({ + + + }); + } + + onDragEnd(e) { + console.log('onDragEnd', e); + } + + onCloseClick() { + console.log('onCloseClick'); + } + + onClick(e) { + console.log('onClick', e); + } + + + + render() { + return ( + + + + + + + + + ); + } + +}; \ No newline at end of file diff --git a/client/components/theMap.js b/client/components/theMap.js index 4048496..dbe45a9 100644 --- a/client/components/theMap.js +++ b/client/components/theMap.js @@ -2,24 +2,36 @@ import React from 'react' //import Map from './Map' //import {GoogleApiWrapper} from 'GoogleMapsReactComponent' import {GoogleApiWrapper, Map, Marker, InfoWindow} from 'google-maps-react' +import {connect} from 'react-redux' +import { bindActionCreators} from 'redux'; +import {fetchGoogle} from '../actions/index'; - -export class TheMap extends React.Component { +class TheMap extends React.Component { constructor(props) { super(props) this.state = { artistLocations: [], activeMarker:{}, showingInfoWindow:false, - selectedPlace:{} + selectedPlace:{}, + location:{}, + } + navigator.geolocation.getCurrentPosition(suc.bind(this),fail); + function suc(position){ + var latitude = position.coords.latitude; + var longitude = position.coords.longitude; + this.setState({location:{lat:latitude,lng:longitude}}) + } + function fail(){ + console.log("booo!") } - console.log("this",this) } + onMarkerClick(props, marker, e){ - console.log("hey now") + console.log("hey now",marker) this.setState({ selectedPlace: props, activeMarker: marker, @@ -40,42 +52,73 @@ onMapClicked(props){ render() { const style = { width: '100vw', - height: '100vh' + height: '95vh' } var positions = this.props.artists; console.log(this.props.artists[0]) - console.log('SO',this.props) - - + console.log('SO',this.state.location) + console.log("thiss",this.props.google) + if(this.props.google){ + this.props.fetchGoogle(this.props.google) + } + console.log("MONKEY",this.props.googley) return (
    - + {positions.map((yup,index)=>{ - return() + return() })} - -
    -

    {this.state.selectedPlace.name}

    -

    {this.state.selectedPlace.location}

    -

    {this.state.selectedPlace.title}

    -
    + {this.state.selectedPlace.title ?
    +

    Title: {this.state.selectedPlace.title}

    +
    Location: {this.state.selectedPlace.name}
    +
    {this.state.selectedPlace.location}
    +
    Artist: {this.state.selectedPlace.artistName}
    +
    + :

    {this.state.selectedPlace.name}

    } + +
    + +
    +

    Hello

    +
    -
    +:null}
    ) } } -export default GoogleApiWrapper({ +// export default GoogleApiWrapper({ +// apiKey: 'AIzaSyBBJCIum7iZSy8nRDjJhSjFjRx4nrGZiPU' +// })(TheMap) + + function mapDispatchToProps(dispatch) { //Think of mapDispatchToProps as this is how you SEND stuff to the store + return bindActionCreators({ + fetchGoogle, + }, dispatch) + } + + function mapStateToProps(state) { //this of mapStateToProps as this is how you GET stuff from the store + return { + googley: state.google, + + } + } + + export default connect(mapStateToProps, mapDispatchToProps)(GoogleApiWrapper({ apiKey: 'AIzaSyBBJCIum7iZSy8nRDjJhSjFjRx4nrGZiPU' -})(TheMap) \ No newline at end of file +})(TheMap)) \ No newline at end of file diff --git a/client/main.js b/client/main.js index b6eb5d7..6200935 100644 --- a/client/main.js +++ b/client/main.js @@ -7,11 +7,15 @@ import Gallery from './components/ArtGallery' import ArtistPage from './components/ArtistPage' import FavsPage from './components/FavsPage' import ArtistMap from './components/ArtMap' +import AMap from './components/googleMapTrial' +import { Provider } from 'react-redux'; +import { createStore, applyMiddleware } from 'redux'; +import reducers from './reducers'; - - +const createStoreWithMiddleware = applyMiddleware()(createStore); //Create the route configuration test render(( + @@ -19,9 +23,8 @@ render(( - - + ), document.getElementById('app')) diff --git a/client/reducers/index.js b/client/reducers/index.js new file mode 100644 index 0000000..234dc9e --- /dev/null +++ b/client/reducers/index.js @@ -0,0 +1,11 @@ +import { combineReducers } from 'redux'; +import GoogleReducer from './reducer_google' + +//So in the regular code, your component created an action which went to actions.js. That then goes to a specific reducer. All the reducers are then bundled up here +//and sent to the store. +const rootReducer = combineReducers({ + google: GoogleReducer +}); + +export default rootReducer; + diff --git a/client/reducers/reducer_google.js b/client/reducers/reducer_google.js new file mode 100644 index 0000000..b5cd88e --- /dev/null +++ b/client/reducers/reducer_google.js @@ -0,0 +1,15 @@ +import {FETCH_GOOGLE} from '../actions/index' + +const INITIAL_STATE = {all: [], post: null}; + + +export default function(state = INITIAL_STATE, action){ + switch(action.type){ + case FETCH_GOOGLE: + return action.payload + + default: + return state; + + } +} \ No newline at end of file diff --git a/package.json b/package.json index c7b1ae7..d5401f1 100644 --- a/package.json +++ b/package.json @@ -36,12 +36,15 @@ "react": "^15.1.0", "react-bootstrap": "^0.29.5", "react-dom": "^15.1.0", + "react-gmaps": "^1.5.0", "react-google-maps": "^4.11.0", "react-modal-dialog": "^3.0.1", + "react-redux": "^4.4.5", "react-router": "^2.5.2", "react-search-input": "^0.10.1", "react-slick": "^0.12.2", "react-spinjs": "^3.0.0", + "redux": "^3.5.2", "uuid-js": "^0.7.5" } } From 1267c28b90bedccd08e6cedbeb7bd6af1543a857 Mon Sep 17 00:00:00 2001 From: sdavisonswim Date: Thu, 21 Jul 2016 19:58:49 -0500 Subject: [PATCH 11/20] added logic for like/dislike.. adding hipster scale, still need to work out score --- client/components/ArtGallery.js | 17 ++++++++- client/components/ArtWindow.js | 61 ++++++++++++++++++++++++++++++--- client/models/art.js | 13 +++++++ client/models/auth.js | 17 +++++++++ client/public/index.html | 2 +- server/main.js | 46 +++++++++++++++++++++++++ 6 files changed, 149 insertions(+), 7 deletions(-) diff --git a/client/components/ArtGallery.js b/client/components/ArtGallery.js index 9b2cc32..caa479d 100644 --- a/client/components/ArtGallery.js +++ b/client/components/ArtGallery.js @@ -9,7 +9,8 @@ export default class App extends React.Component { this.state = { tempCollection: [], - artCollection: [] + artCollection: [], + hipCollection: [] } } @@ -24,6 +25,7 @@ export default class App extends React.Component { .then(() => { this.getLikes() this.getTrash() + this.getHipster() }) } @@ -72,6 +74,19 @@ export default class App extends React.Component { }) } + getHipster(){ + var hipResults = []; + this.state.tempCollection.forEach((artWork) => { + art.getHipster(artWork._id) + .then((userScore) => { + hipResults.push(Object.assign(artWork, {userScore: userScore.userScore})) + //if(hipResults.length === this.state.tempCollection.length) { + this.setState({hipCollection: hipResults}) + //} + }) + }) + } + render(){ return ( diff --git a/client/components/ArtWindow.js b/client/components/ArtWindow.js index 0ce951b..be8532c 100644 --- a/client/components/ArtWindow.js +++ b/client/components/ArtWindow.js @@ -42,6 +42,10 @@ export default class ArtGallery extends React.Component { updateCurrentTrash(trashCount) { this.setState({currentArt: Object.assign(this.state.currentArt, {trashCount: trashCount.trashCount})}) } + updateUserScore(userScore) { + this.setState({currentArt: Object.assign(this.state.currentArt, {userScore: userScore.userScore})}) + } + render() { const filteredArt = this.props.gallery.filter(createFilter(this.state.searchTerm, KEYS_TO_FILTERS)) @@ -60,7 +64,10 @@ export default class ArtGallery extends React.Component {
    {this.state.showInfo ? - + : null} {filteredArt.map((art) => { return ( @@ -81,7 +88,8 @@ class Info extends React.Component { super() this.state = { userFavs: [], - userId: null + userId: null, + // numRed:this.props..userScore } } componentWillMount() { @@ -102,6 +110,30 @@ class Info extends React.Component { this.setState({userId: res}) }) } + + buttonClick (event){ + var userScore = event.target.value; + this.setState({numRed:userScore}) + console.log('buttonClick', this.props.currentArt.userScore) + + // () => auth.hipsterScore(this.props.currentArt._id) + // .then((x) => { + // return art.getHipster(this.props.currentArt._id) + // }) + // .then((userScore) => { + // this.props.updateUserScore(userScore) + // }) + } + makeRed(userScore){ + for(var i=1;i<=userScore;i++){ + var redButton = 'button'+i + this.setState({[redButton]:'btn btn-danger'}) + } + for(var j = Number(userScore)+1 ;j<=5; j++){ + var redButton = 'button'+j + this.setState({[redButton]:'btn'}) + } + } //The info modal that pops up with the props currentArt set as the object of the work of art you clicked on render() { let images = this.props.parseImageUrl(this.props.currentArt.Images); @@ -122,7 +154,8 @@ class Info extends React.Component {

    By: {this.props.currentArt['Artist Full Name']}

    Location: {this.props.currentArt['Art Location Name']}

    Likes: {this.props.currentArt.likeCount.length}

    -

    Trash: {this.props.currentArt.trashCount.length}

    +

    Not Art: {this.props.currentArt.trashCount.length}

    +

    Hipster Scale: {this.props.currentArt.userScore.length}

    @@ -155,9 +188,9 @@ class Info extends React.Component { {(this.props.currentArt.likeCount.includes(this.state.userId)) ? '' : - } +
    Peace be the Journey:
    + + + + + + + + + + + +
    : ''} diff --git a/client/models/art.js b/client/models/art.js index df89483..ee05a7e 100644 --- a/client/models/art.js +++ b/client/models/art.js @@ -29,3 +29,16 @@ export function getTrash(artId) { return artwork.json() }) } + +export function getHipster(artId){ + let obj = { + method: 'GET' + }; + return fetch(`/hipster/${artId}`, obj) + .then((artwork) => { + return artwork.json() + }) + .catch((error) => { + console.log('art error', error) + }) +} diff --git a/client/models/auth.js b/client/models/auth.js index 7b8fa67..ab63b2e 100644 --- a/client/models/auth.js +++ b/client/models/auth.js @@ -68,6 +68,23 @@ export function trashPhoto(artId) { }) } +export function hipsterScore(artId) { + let obj = { + method: "POST", + headers: { + 'Content-Type': 'application/json' + }, + body: JSON.stringify({cookie: document.cookie}) + } + return fetch(`/hipster/${artId}`, obj) + .then(function(data){ + return data.json() + }) + .catch(function(error){ + console.log('auth error', error) + }) +} + export function favoritePhoto(artId) { let obj = { method: "POST", diff --git a/client/public/index.html b/client/public/index.html index ad35b08..dec97ce 100644 --- a/client/public/index.html +++ b/client/public/index.html @@ -4,7 +4,7 @@ Austin Art - + diff --git a/server/main.js b/server/main.js index 282b98f..6b55fc5 100644 --- a/server/main.js +++ b/server/main.js @@ -260,6 +260,39 @@ app.post('/trash/:id', function(req, res){ } }) +app.post('/hipster/:id', function(req, res){ + var artId = req.params.id; + var sessionId = req.body.cookie.substring(10); + var userId; + + if(!sessionId){ + res.sendStatus(401) + } else { + db.collection('sessions').find({ sessionId: sessionId }) + .then((users) => { + // Get user id from session + userId = users[0].id; + return db.collection('users').find({ _id: userId }) + }) + .then((users) => { + // Check if user exists + if(users[0]){ + return db.collection('hipster').find({ userId: userId, artId: artId }) + } else { + // User doesn't exist, send back -bad request- + res.sendStatus(400) + } + }) + .then((userScore) => { + return db.collection('hipster').insert({ userId: userId, artId: artId, userScore:userScore }) + }) + .then((result) => { + res.send({ "Status": "Success" }) + }) + .catch((error) => {console.log('main error', error)}) + } +}) + app.get('/trash/:id', function(req, res){ var artId = req.params.id; @@ -273,6 +306,19 @@ app.get('/trash/:id', function(req, res){ } }) +app.get('/hipster/:id', function(req, res){ + var artId = req.params.id; + + if(!artId){ + res.status(400).send({"Error": "No art id... Come on now"}) + } else { + db.collection("hipster").find({ artId: artId }) + .then((userScore) => { + res.send({ userScore: userScore.map((x) => x.userId) }) + }) + } +}) + app.get('/likes/:id', function(req, res){ var artId = req.params.id; From b137df7f0ea7c9231075e16978aaaded76c03798 Mon Sep 17 00:00:00 2001 From: Chris Ritchie Date: Thu, 21 Jul 2016 20:05:44 -0500 Subject: [PATCH 12/20] have FB profile pic and user names in database now --- server/main.js | 10 ++++++---- server/passport.js | 9 +++++++-- 2 files changed, 13 insertions(+), 6 deletions(-) diff --git a/server/main.js b/server/main.js index abc2b98..a83712d 100644 --- a/server/main.js +++ b/server/main.js @@ -37,9 +37,11 @@ app.get('/facebookLogin', app.get('/facebookLogin/Callback', passport.authenticate('facebook', { failureRedirect: '/' }), function(req, res) { - console.log("REQQQQQQQ",req.body) - console.log("RESSSSSSS",res.body) - res.redirect('/'); + + console.log("REQQQQQQQ",req.user) + console.log("RESSSSSSS",res.user) + res.send(res.user) + res.redirect('/#/gallery'); }); // client asking for art data @@ -77,7 +79,7 @@ app.post('/signUp',passport.authenticate('local-signup'),function(req, res) { }) .then(function(obj){ console.log("SIGN UP SESSION",req.sessionID) - res.send(JSON.stringify(obj.sessionId)); + res.send(JSON.stringify(req.sessionId)); }) }) diff --git a/server/passport.js b/server/passport.js index 3d40bdf..509d356 100644 --- a/server/passport.js +++ b/server/passport.js @@ -1,7 +1,7 @@ var FACEBOOK_ID = '932055926922953'; var FACEBOOK_CALLBACK_URL = 'http://localhost:4040/facebookLogin/Callback' var FACEBOOK_SECRET = 'c283a4b04e8635a09c8ac2d0ed071e30' -var PROFILE_FIELDS = ['id', 'email', 'gender', 'link', 'locale', 'name', 'timezone', 'updated_time', 'verified'] +var PROFILE_FIELDS = ['id', 'email', 'photos','gender', 'link', 'locale', 'name', 'timezone', 'updated_time', 'verified'] var passport = require("passport"); var LocalStrategy = require('passport-local').Strategy; var FacebookStrategy = require('passport-facebook').Strategy; @@ -137,6 +137,9 @@ module.exports = function(passport){ return db.collection('FBusers').insert({ facebookID: user.id, facebookToken: token, + facebookPicture: user.photos[0], + facebookName: user.name + // facebookEmail:user.emails[0].value}) }) } @@ -159,6 +162,8 @@ module.exports = function(passport){ } //need to add a FB user to the database. Then i will be able to check for the id -// + +//need to fetch the picture and put it in the facebook login modal. + // })) // } From a478c3b02dec465d309dc04464a3376c7b10adf7 Mon Sep 17 00:00:00 2001 From: Jad Carson Date: Fri, 22 Jul 2016 09:34:00 -0500 Subject: [PATCH 13/20] worked on map --- client/components/ArtMap.js | 4 +--- client/components/theMap.js | 5 +++-- 2 files changed, 4 insertions(+), 5 deletions(-) diff --git a/client/components/ArtMap.js b/client/components/ArtMap.js index 23d1bf9..20f9a59 100644 --- a/client/components/ArtMap.js +++ b/client/components/ArtMap.js @@ -5,9 +5,7 @@ import * as auth from '../models/auth' import * as art from '../models/art' import GoogleMap from 'google-map-react'; import TheMap from './theMap' -import {connect} from 'react-redux' -import { bindActionCreators} from 'redux'; -import {fetchFilter} from '../actions/index'; + export default class ArtistMap extends React.Component { diff --git a/client/components/theMap.js b/client/components/theMap.js index dbe45a9..3410255 100644 --- a/client/components/theMap.js +++ b/client/components/theMap.js @@ -47,13 +47,14 @@ onMapClicked(props){ activeMarker: null }) } - } + render() { const style = { width: '100vw', height: '95vh' } + console.log("active",this.state.activeMarker) var positions = this.props.artists; console.log(this.props.artists[0]) console.log('SO',this.state.location) @@ -67,7 +68,7 @@ onMapClicked(props){ {this.state.location.lat? - + {positions.map((yup,index)=>{ return() })} From c370a02d5173c88b14ac1027ea65d69d0fd30c6c Mon Sep 17 00:00:00 2001 From: Jad Carson Date: Tue, 19 Jul 2016 11:56:13 -0500 Subject: [PATCH 14/20] test --- client/main.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/client/main.js b/client/main.js index e5fa666..a98b843 100644 --- a/client/main.js +++ b/client/main.js @@ -10,7 +10,7 @@ import FavsPage from './components/FavsPage' -//Create the route configuration +//Create the route configuration test render(( From 355951bc0992f36096c113a5e4a0bf5a230ffea9 Mon Sep 17 00:00:00 2001 From: Jad Carson Date: Fri, 22 Jul 2016 09:59:00 -0500 Subject: [PATCH 15/20] I don't get rebasing --- client/components/ArtGallery.js | 1 + client/components/ArtMap.js | 82 +++++++++++++++++++++++++++++++++ client/components/ArtWindow.js | 12 +++++ client/components/HomePage.js | 11 ++++- client/components/Map.js | 43 +++++++++++++++++ client/components/NavBar.js | 21 +++++---- client/components/theMap.js | 79 +++++++++++++++++++++++++++++++ client/main.js | 7 ++- client/models/art.js | 1 + package.json | 3 ++ server/db.js | 4 ++ server/main.js | 8 ++++ 12 files changed, 258 insertions(+), 14 deletions(-) create mode 100644 client/components/ArtMap.js create mode 100644 client/components/Map.js create mode 100644 client/components/theMap.js diff --git a/client/components/ArtGallery.js b/client/components/ArtGallery.js index cde7e43..bcaced5 100644 --- a/client/components/ArtGallery.js +++ b/client/components/ArtGallery.js @@ -17,6 +17,7 @@ export default class App extends React.Component { this.update() } update() { + console.log("params",this.props.params) this.fetchArt(this.props.params.artistName) .then(() => { this.getLikes() diff --git a/client/components/ArtMap.js b/client/components/ArtMap.js new file mode 100644 index 0000000..4012909 --- /dev/null +++ b/client/components/ArtMap.js @@ -0,0 +1,82 @@ +import React from 'react' +import {Link} from 'react-router' +import NavBar from './NavBar' +import * as auth from '../models/auth' +import * as art from '../models/art' +import GoogleMap from 'google-map-react'; +import TheMap from './theMap' + + + +export default class ArtistMap extends React.Component { + +constructor() { + super() + this.state = { + artists: [], + artistLat:[], + artName:[], + ArtLocation:[], + ArtTitle:[], + ArtistName:[], + ArtImage:[], + ArtWeb:[] + } + + } + +componentDidMount() { + art.getArt() + .then((res) => { + this.setState({artists: res},(next)=>{ + console.log("artists",this.state.artists) + var newArray = this.state.artName.slice(); + var artLocation = this.state.ArtLocation.slice(); + var artTitle = this.state.ArtTitle.slice(); + var artistName = this.state.ArtistName.slice(); + var artImage = this.state.ArtImage.slice(); + var artWeb = this.state.ArtWeb.slice(); + + var latLong = this.state.artists.map(artist =>{ + newArray.push(artist['Art Location Name']); + artLocation.push(artist['Art Location Street Address']) + artTitle.push(artist['Art Title']) + artistName.push(artist['Artist Full Name']) + artImage.push(artist['Images']) + artWeb.push(artist['Web Detail Page']) + + + var stillNotFormatted = artist.Location.split('(')[1] + var slicedInfo = stillNotFormatted.slice(0,stillNotFormatted.length-1) + var lat = Number(slicedInfo.split(',')[0]) + var lon = Number(slicedInfo.split(',')[1]) + var latLon = {lat:lat,lng:lon} + return latLon + }) + this.setState({artName:newArray}) + this.setState({ArtLocation:newArray}) + this.setState({ArtTitle:newArray}) + this.setState({ArtistName:newArray}) + this.setState({ArtWeb:newArray}) + + console.log("lat",latLong) + this.setState({artistLat:latLong}) + console.log("here") + }) + + + }) + } + + render() { + return ( +
    + +

    Artist List

    + {this.state.artistLat.length>0?:null} + +
    + ) + } + + } \ No newline at end of file diff --git a/client/components/ArtWindow.js b/client/components/ArtWindow.js index d1fbefd..b8704ae 100644 --- a/client/components/ArtWindow.js +++ b/client/components/ArtWindow.js @@ -9,7 +9,11 @@ import * as auth from '../models/auth' import * as art from '../models/art' +<<<<<<< c370a02d5173c88b14ac1027ea65d69d0fd30c6c const KEYS_TO_FILTERS = ['Artist Full Name', 'Art Title', 'Art Location Zip', 'Art Location Name'] +======= +const KEYS_TO_FILTERS = ['Artist Full Name', 'Art Title'] +>>>>>>> Have a working map and now adding extra info to it export default class ArtGallery extends React.Component { constructor(props) { @@ -20,7 +24,9 @@ export default class ArtGallery extends React.Component { searchTerm: [''], } + } + parseImageUrl(imgUrl) { imgUrl = imgUrl.split(';') return imgUrl.filter((x) => x !== '') @@ -53,9 +59,11 @@ export default class ArtGallery extends React.Component { } render() { + const filteredArt = this.props.gallery.filter(createFilter(this.state.searchTerm[0], KEYS_TO_FILTERS)) {console.log('DA FUCK IS THIS', this.state.searchTerm)} + return (
    {/*If the gallery state is not populated, show the loading div. Else diaplay gallery*/} @@ -136,7 +144,11 @@ class Info extends React.Component { +<<<<<<< c370a02d5173c88b14ac1027ea65d69d0fd30c6c

    {this.props.currentArt['Art Title']}

    +======= +

    {this.props.currentArt['Art Title']}

    +>>>>>>> Have a working map and now adding extra info to it

    By: {this.props.currentArt['Artist Full Name']}

    Location: {this.props.currentArt['Art Location Name']}

    Likes: {this.props.currentArt.likeCount.length}

    diff --git a/client/components/HomePage.js b/client/components/HomePage.js index 74b347d..37d5ea9 100644 --- a/client/components/HomePage.js +++ b/client/components/HomePage.js @@ -6,22 +6,29 @@ export default class HomePage extends React.Component { //The homepage component with links to gallery and artists page on the two buttons. render() { + return (
    - {/*

    AUSTIN ART

    + +

    AUSTIN ART

    GALLERY + ARTISTS - */} +
    ) + } + grabStuff(){ + console.log("hellos") + } } diff --git a/client/components/Map.js b/client/components/Map.js new file mode 100644 index 0000000..215e303 --- /dev/null +++ b/client/components/Map.js @@ -0,0 +1,43 @@ +import React from 'react' +import {GoogleApiWrapper} from 'google-maps-react' +export class Map extends React.Component { + + componentDidUpdate(prevProps, prevState) { + if (prevProps.google !== this.props.google) { + this.loadMap(); + } + } + componentDidMount() { + this.loadMap(); + } + + loadMap() { + if (this.props && this.props.google) { + // google is available + const {google} = this.props; + const maps = google.maps; + + const mapRef = this.refs.map; + const node = ReactDOM.findDOMNode(mapRef); + + let zoom = 14; + let lat = 37.774929; + let lng = -122.419416; + const center = new maps.LatLng(lat, lng); + const mapConfig = Object.assign({}, { + center: center, + zoom: zoom + }) + this.map = new maps.Map(node, mapConfig); + } + } + + render() { + console.log("heyyyy!") + return( +
    +

    Loading map

    +
    + ) + } +} \ No newline at end of file diff --git a/client/components/NavBar.js b/client/components/NavBar.js index 8834082..3825772 100644 --- a/client/components/NavBar.js +++ b/client/components/NavBar.js @@ -76,16 +76,17 @@ export default class NavBar extends React.Component { {/* Populate the navbar items. Use from react router to add links to different views. */} -
  • AUSTIN PUBLIC ART
  • -
  • ARTISTS
  • -
  • GALLERY
  • - {this.state.loggedIn ?
  • FAVORITES
  • : null} - - {this.props.gallery ?
  • FILTER
  • : null } - -
  • - ACCOUNT -
    + +
  • HOME
  • +
  • ARTISTS
  • +
  • GALLERY
  • +
  • MAP
  • + {this.state.loggedIn ?
  • FAVORITES
  • : null} + +
  • + ACCOUNT +
    + {!this.state.loggedIn ? : Logout} diff --git a/client/components/theMap.js b/client/components/theMap.js new file mode 100644 index 0000000..d0fa0c8 --- /dev/null +++ b/client/components/theMap.js @@ -0,0 +1,79 @@ +import React from 'react' +//import Map from './Map' +//import {GoogleApiWrapper} from 'GoogleMapsReactComponent' +import {GoogleApiWrapper, Map, Marker, InfoWindow} from 'google-maps-react' + + +export class TheMap extends React.Component { + constructor(props) { + super(props) + this.state = { + artistLocations: [], + activeMarker:{}, + showingInfoWindow:false, + selectedPlace:{} + } + console.log("this",this) + + } + + +onMarkerClick(props, marker, e){ + console.log("hey now") + this.setState({ + selectedPlace: props, + activeMarker: marker, + showingInfoWindow: true + }); + +} +onMapClicked(props){ + console.log("OH MY") + if (this.state.showingInfoWindow) { + this.setState({ + showingInfoWindow: false, + activeMarker: null + }) + } + +} + render() { + const style = { + width: '100vw', + height: '100vh' + } + var positions = this.props.artists; + console.log(this.props.artists[0]) + console.log('SO',this.props) + + + return ( +
    + + {positions.map(yup=>{ + return() + })} + +
    +

    {this.state.selectedPlace.name}

    +
    +
    + + + + +
    + +
    + ) + } +} + +export default GoogleApiWrapper({ + apiKey: 'AIzaSyBBJCIum7iZSy8nRDjJhSjFjRx4nrGZiPU' +})(TheMap) \ No newline at end of file diff --git a/client/main.js b/client/main.js index a98b843..b6eb5d7 100644 --- a/client/main.js +++ b/client/main.js @@ -6,7 +6,7 @@ import Home from './components/HomePage' import Gallery from './components/ArtGallery' import ArtistPage from './components/ArtistPage' import FavsPage from './components/FavsPage' - +import ArtistMap from './components/ArtMap' @@ -15,9 +15,12 @@ render(( - + + + + ), document.getElementById('app')) diff --git a/client/models/art.js b/client/models/art.js index 5034dcc..d3ea168 100644 --- a/client/models/art.js +++ b/client/models/art.js @@ -1,6 +1,7 @@ import fetch from 'isomorphic-fetch'; export function getArt (){ + console.log('hello') let obj = { method: 'GET' }; diff --git a/package.json b/package.json index f116ad0..8ea1f79 100644 --- a/package.json +++ b/package.json @@ -26,6 +26,8 @@ "body-parser": "^1.15.2", "browserify-middleware": "^7.0.0", "express": "^4.13.4", + "google-map-react": "^0.16.0", + "google-maps-react": "^1.0.16", "isomorphic-fetch": "^2.2.1", "node-uuid": "^1.4.7", "nodemon": "^1.9.2", @@ -34,6 +36,7 @@ "react": "^15.1.0", "react-bootstrap": "^0.29.5", "react-dom": "^15.1.0", + "react-google-maps": "^4.11.0", "react-modal-dialog": "^3.0.1", "react-router": "^2.5.2", "react-search-input": "^0.10.1", diff --git a/server/db.js b/server/db.js index e34964d..f8b3665 100644 --- a/server/db.js +++ b/server/db.js @@ -1,6 +1,10 @@ var pmongo = require('promised-mongo'); +<<<<<<< c370a02d5173c88b14ac1027ea65d69d0fd30c6c var uri = 'mongodb://jad:carson@ds023485.mlab.com:23485/austin_art'; +======= +var uri ='mongodb://jad:carson@ds023485.mlab.com:23485/austin_art'; +>>>>>>> Have a working map and now adding extra info to it var db = pmongo(uri, { authMechanism: 'ScramSHA1' diff --git a/server/main.js b/server/main.js index a83712d..1e0bd44 100644 --- a/server/main.js +++ b/server/main.js @@ -52,6 +52,14 @@ app.get('/art', function(req,res) { res.send(art) }) }) +app.post('/insertArt',function(req,res){ + db.collection('art').insert(req.body).then(function(value){ + db.collection('art').find().then(function(value){ + res.send(value) + }) + }) + +}) app.post('/signUp',passport.authenticate('local-signup'),function(req, res) { console.log("IN MAIN NOW") From 9b24ba41bed20892a76c1ba4aec53f4121501ba7 Mon Sep 17 00:00:00 2001 From: Jad Carson Date: Wed, 20 Jul 2016 20:01:01 -0500 Subject: [PATCH 16/20] sending correct props --- client/components/ArtMap.js | 50 ++++++++++++++++++++----------------- client/components/theMap.js | 6 +++-- 2 files changed, 31 insertions(+), 25 deletions(-) diff --git a/client/components/ArtMap.js b/client/components/ArtMap.js index 4012909..3a3fab0 100644 --- a/client/components/ArtMap.js +++ b/client/components/ArtMap.js @@ -15,7 +15,7 @@ constructor() { this.state = { artists: [], artistLat:[], - artName:[], + ArtName:[], ArtLocation:[], ArtTitle:[], ArtistName:[], @@ -30,21 +30,21 @@ componentDidMount() { .then((res) => { this.setState({artists: res},(next)=>{ console.log("artists",this.state.artists) - var newArray = this.state.artName.slice(); - var artLocation = this.state.ArtLocation.slice(); - var artTitle = this.state.ArtTitle.slice(); - var artistName = this.state.ArtistName.slice(); - var artImage = this.state.ArtImage.slice(); - var artWeb = this.state.ArtWeb.slice(); + var ArtName = this.state.ArtName.slice(); + var ArtLocation = this.state.ArtLocation.slice(); + var ArtTitle = this.state.ArtTitle.slice(); + var ArtistName = this.state.ArtistName.slice(); + var ArtImage = this.state.ArtImage.slice(); + var ArtWeb = this.state.ArtWeb.slice(); var latLong = this.state.artists.map(artist =>{ - newArray.push(artist['Art Location Name']); - artLocation.push(artist['Art Location Street Address']) - artTitle.push(artist['Art Title']) - artistName.push(artist['Artist Full Name']) - artImage.push(artist['Images']) - artWeb.push(artist['Web Detail Page']) - + ArtName.push(artist['Art Location Name']); + ArtLocation.push(artist['Art Location Street Address']) + ArtTitle.push(artist['Art Title']) + ArtistName.push(artist['Artist Full Name']) + ArtImage.push(artist['Images']) + ArtWeb.push(artist['Web Detail Page']) + //console.log("what",artTitle) var stillNotFormatted = artist.Location.split('(')[1] var slicedInfo = stillNotFormatted.slice(0,stillNotFormatted.length-1) @@ -53,15 +53,19 @@ componentDidMount() { var latLon = {lat:lat,lng:lon} return latLon }) - this.setState({artName:newArray}) - this.setState({ArtLocation:newArray}) - this.setState({ArtTitle:newArray}) - this.setState({ArtistName:newArray}) - this.setState({ArtWeb:newArray}) - - console.log("lat",latLong) + this.setState({ArtName}) + this.setState({ArtLocation}) + this.setState({ArtTitle}) + this.setState({ArtistName}) + this.setState({ArtWeb},function(){ + // console.log("here",this.state.artName) + // console.log("ok",this.state.ArtTitle) + // console.log("here",this.state.artWeb) + // console.log("ok",this.state.artistName) + }) + this.setState({artistLat:latLong}) - console.log("here") + }) @@ -73,7 +77,7 @@ componentDidMount() {

    Artist List

    - {this.state.artistLat.length>0?:null} + {this.state.artistLat.length>0?:null}
    ) diff --git a/client/components/theMap.js b/client/components/theMap.js index d0fa0c8..4048496 100644 --- a/client/components/theMap.js +++ b/client/components/theMap.js @@ -53,14 +53,16 @@ onMapClicked(props){ {lat: 30.267153, lng: -97.743061} }> - {positions.map(yup=>{ - return() + {positions.map((yup,index)=>{ + return() })}

    {this.state.selectedPlace.name}

    +

    {this.state.selectedPlace.location}

    +

    {this.state.selectedPlace.title}

    From d3685b2fdb6c94309cc3fdd49883000e865c6c98 Mon Sep 17 00:00:00 2001 From: Jad Carson Date: Fri, 22 Jul 2016 10:02:05 -0500 Subject: [PATCH 17/20] fixed more rebasing --- client/actions/index.js | 9 +++ client/components/ArtMap.js | 11 ++-- client/components/ArtWindow.js | 16 +++--- client/components/googleMapTrial.js | 88 +++++++++++++++++++++++++++++ client/components/theMap.js | 87 ++++++++++++++++++++-------- client/main.js | 11 ++-- client/reducers/index.js | 11 ++++ client/reducers/reducer_google.js | 15 +++++ package.json | 3 + 9 files changed, 213 insertions(+), 38 deletions(-) create mode 100644 client/actions/index.js create mode 100644 client/components/googleMapTrial.js create mode 100644 client/reducers/index.js create mode 100644 client/reducers/reducer_google.js diff --git a/client/actions/index.js b/client/actions/index.js new file mode 100644 index 0000000..672a7f8 --- /dev/null +++ b/client/actions/index.js @@ -0,0 +1,9 @@ +export const FETCH_GOOGLE = 'FETCH_GOOGLE' + +export function fetchGoogle(google) { + console.log("fetching") + return{ + type:FETCH_GOOGLE, + payload: google + } +} diff --git a/client/components/ArtMap.js b/client/components/ArtMap.js index 3a3fab0..23d1bf9 100644 --- a/client/components/ArtMap.js +++ b/client/components/ArtMap.js @@ -5,7 +5,9 @@ import * as auth from '../models/auth' import * as art from '../models/art' import GoogleMap from 'google-map-react'; import TheMap from './theMap' - +import {connect} from 'react-redux' +import { bindActionCreators} from 'redux'; +import {fetchFilter} from '../actions/index'; export default class ArtistMap extends React.Component { @@ -57,6 +59,7 @@ componentDidMount() { this.setState({ArtLocation}) this.setState({ArtTitle}) this.setState({ArtistName}) + this.setState({ArtImage}) this.setState({ArtWeb},function(){ // console.log("here",this.state.artName) // console.log("ok",this.state.ArtTitle) @@ -75,12 +78,12 @@ componentDidMount() { render() { return (
    - +

    Artist List

    - {this.state.artistLat.length>0?:null} + {this.state.artistLat.length>0?:null}
    ) } - } \ No newline at end of file + } diff --git a/client/components/ArtWindow.js b/client/components/ArtWindow.js index b8704ae..e74c3d2 100644 --- a/client/components/ArtWindow.js +++ b/client/components/ArtWindow.js @@ -7,13 +7,12 @@ import Filter from './Filter' import Slider from 'react-slick' import * as auth from '../models/auth' import * as art from '../models/art' +import AMap from './googleMapTrial' + -<<<<<<< c370a02d5173c88b14ac1027ea65d69d0fd30c6c const KEYS_TO_FILTERS = ['Artist Full Name', 'Art Title', 'Art Location Zip', 'Art Location Name'] -======= -const KEYS_TO_FILTERS = ['Artist Full Name', 'Art Title'] ->>>>>>> Have a working map and now adding extra info to it + export default class ArtGallery extends React.Component { constructor(props) { @@ -144,19 +143,20 @@ class Info extends React.Component { -<<<<<<< c370a02d5173c88b14ac1027ea65d69d0fd30c6c +

    {this.props.currentArt['Art Title']}

    -======= -

    {this.props.currentArt['Art Title']}

    ->>>>>>> Have a working map and now adding extra info to it +

    By: {this.props.currentArt['Artist Full Name']}

    Location: {this.props.currentArt['Art Location Name']}

    +

    Likes: {this.props.currentArt.likeCount.length}

    +
    {images.map((x) =>
    )}
    + {/* Check if logged in (document.cookie?), if true display Like and Favorite button */} {document.cookie ?
    diff --git a/client/components/googleMapTrial.js b/client/components/googleMapTrial.js new file mode 100644 index 0000000..4ecea3e --- /dev/null +++ b/client/components/googleMapTrial.js @@ -0,0 +1,88 @@ +import React from 'react'; +import ReactDOM from 'react-dom'; +import {Gmaps, Marker, InfoWindow, Circle} from 'react-gmaps'; + + +export default class AMap extends React.Component { + +constructor(props) { + super(props) + + this.state = { + lat:Number(this.props.location[0]), + lng: Number(this.props.location[1]), + location:{} + } + + console.log("Location",this.props.location) + navigator.geolocation.getCurrentPosition(suc.bind(this),fail); + function suc(position){ + var latitude = position.coords.latitude; + var longitude = position.coords.longitude; + this.setState({location:{lat:latitude,lng:longitude}}) + } + function fail(){ + console.log("booo!") + } + } + + + + onMapCreated(map) { + map.setOptions({ + + + }); + } + + onDragEnd(e) { + console.log('onDragEnd', e); + } + + onCloseClick() { + console.log('onCloseClick'); + } + + onClick(e) { + console.log('onClick', e); + } + + + + render() { + return ( + + + + + + + + + ); + } + +}; \ No newline at end of file diff --git a/client/components/theMap.js b/client/components/theMap.js index 4048496..dbe45a9 100644 --- a/client/components/theMap.js +++ b/client/components/theMap.js @@ -2,24 +2,36 @@ import React from 'react' //import Map from './Map' //import {GoogleApiWrapper} from 'GoogleMapsReactComponent' import {GoogleApiWrapper, Map, Marker, InfoWindow} from 'google-maps-react' +import {connect} from 'react-redux' +import { bindActionCreators} from 'redux'; +import {fetchGoogle} from '../actions/index'; - -export class TheMap extends React.Component { +class TheMap extends React.Component { constructor(props) { super(props) this.state = { artistLocations: [], activeMarker:{}, showingInfoWindow:false, - selectedPlace:{} + selectedPlace:{}, + location:{}, + } + navigator.geolocation.getCurrentPosition(suc.bind(this),fail); + function suc(position){ + var latitude = position.coords.latitude; + var longitude = position.coords.longitude; + this.setState({location:{lat:latitude,lng:longitude}}) + } + function fail(){ + console.log("booo!") } - console.log("this",this) } + onMarkerClick(props, marker, e){ - console.log("hey now") + console.log("hey now",marker) this.setState({ selectedPlace: props, activeMarker: marker, @@ -40,42 +52,73 @@ onMapClicked(props){ render() { const style = { width: '100vw', - height: '100vh' + height: '95vh' } var positions = this.props.artists; console.log(this.props.artists[0]) - console.log('SO',this.props) - - + console.log('SO',this.state.location) + console.log("thiss",this.props.google) + if(this.props.google){ + this.props.fetchGoogle(this.props.google) + } + console.log("MONKEY",this.props.googley) return (
    - + {positions.map((yup,index)=>{ - return() + return() })} - -
    -

    {this.state.selectedPlace.name}

    -

    {this.state.selectedPlace.location}

    -

    {this.state.selectedPlace.title}

    -
    + {this.state.selectedPlace.title ?
    +

    Title: {this.state.selectedPlace.title}

    +
    Location: {this.state.selectedPlace.name}
    +
    {this.state.selectedPlace.location}
    +
    Artist: {this.state.selectedPlace.artistName}
    +
    + :

    {this.state.selectedPlace.name}

    } + +
    + +
    +

    Hello

    +
    -
    +:null}
    ) } } -export default GoogleApiWrapper({ +// export default GoogleApiWrapper({ +// apiKey: 'AIzaSyBBJCIum7iZSy8nRDjJhSjFjRx4nrGZiPU' +// })(TheMap) + + function mapDispatchToProps(dispatch) { //Think of mapDispatchToProps as this is how you SEND stuff to the store + return bindActionCreators({ + fetchGoogle, + }, dispatch) + } + + function mapStateToProps(state) { //this of mapStateToProps as this is how you GET stuff from the store + return { + googley: state.google, + + } + } + + export default connect(mapStateToProps, mapDispatchToProps)(GoogleApiWrapper({ apiKey: 'AIzaSyBBJCIum7iZSy8nRDjJhSjFjRx4nrGZiPU' -})(TheMap) \ No newline at end of file +})(TheMap)) \ No newline at end of file diff --git a/client/main.js b/client/main.js index b6eb5d7..6200935 100644 --- a/client/main.js +++ b/client/main.js @@ -7,11 +7,15 @@ import Gallery from './components/ArtGallery' import ArtistPage from './components/ArtistPage' import FavsPage from './components/FavsPage' import ArtistMap from './components/ArtMap' +import AMap from './components/googleMapTrial' +import { Provider } from 'react-redux'; +import { createStore, applyMiddleware } from 'redux'; +import reducers from './reducers'; - - +const createStoreWithMiddleware = applyMiddleware()(createStore); //Create the route configuration test render(( + @@ -19,9 +23,8 @@ render(( - - + ), document.getElementById('app')) diff --git a/client/reducers/index.js b/client/reducers/index.js new file mode 100644 index 0000000..234dc9e --- /dev/null +++ b/client/reducers/index.js @@ -0,0 +1,11 @@ +import { combineReducers } from 'redux'; +import GoogleReducer from './reducer_google' + +//So in the regular code, your component created an action which went to actions.js. That then goes to a specific reducer. All the reducers are then bundled up here +//and sent to the store. +const rootReducer = combineReducers({ + google: GoogleReducer +}); + +export default rootReducer; + diff --git a/client/reducers/reducer_google.js b/client/reducers/reducer_google.js new file mode 100644 index 0000000..b5cd88e --- /dev/null +++ b/client/reducers/reducer_google.js @@ -0,0 +1,15 @@ +import {FETCH_GOOGLE} from '../actions/index' + +const INITIAL_STATE = {all: [], post: null}; + + +export default function(state = INITIAL_STATE, action){ + switch(action.type){ + case FETCH_GOOGLE: + return action.payload + + default: + return state; + + } +} \ No newline at end of file diff --git a/package.json b/package.json index 8ea1f79..9ae5918 100644 --- a/package.json +++ b/package.json @@ -36,12 +36,15 @@ "react": "^15.1.0", "react-bootstrap": "^0.29.5", "react-dom": "^15.1.0", + "react-gmaps": "^1.5.0", "react-google-maps": "^4.11.0", "react-modal-dialog": "^3.0.1", + "react-redux": "^4.4.5", "react-router": "^2.5.2", "react-search-input": "^0.10.1", "react-slick": "^0.12.2", "react-spinjs": "^3.0.0", + "redux": "^3.5.2", "uuid-js": "^0.7.5" }, From fa93b5ade5cba3f5cd8b724342de1881b91b3183 Mon Sep 17 00:00:00 2001 From: Jad Carson Date: Fri, 22 Jul 2016 09:34:00 -0500 Subject: [PATCH 18/20] worked on map --- client/components/ArtMap.js | 4 +--- client/components/theMap.js | 5 +++-- 2 files changed, 4 insertions(+), 5 deletions(-) diff --git a/client/components/ArtMap.js b/client/components/ArtMap.js index 23d1bf9..20f9a59 100644 --- a/client/components/ArtMap.js +++ b/client/components/ArtMap.js @@ -5,9 +5,7 @@ import * as auth from '../models/auth' import * as art from '../models/art' import GoogleMap from 'google-map-react'; import TheMap from './theMap' -import {connect} from 'react-redux' -import { bindActionCreators} from 'redux'; -import {fetchFilter} from '../actions/index'; + export default class ArtistMap extends React.Component { diff --git a/client/components/theMap.js b/client/components/theMap.js index dbe45a9..3410255 100644 --- a/client/components/theMap.js +++ b/client/components/theMap.js @@ -47,13 +47,14 @@ onMapClicked(props){ activeMarker: null }) } - } + render() { const style = { width: '100vw', height: '95vh' } + console.log("active",this.state.activeMarker) var positions = this.props.artists; console.log(this.props.artists[0]) console.log('SO',this.state.location) @@ -67,7 +68,7 @@ onMapClicked(props){ {this.state.location.lat? - + {positions.map((yup,index)=>{ return() })} From c4f9b8151d81fc9a96097649a295332ecb5d912e Mon Sep 17 00:00:00 2001 From: Jad Carson Date: Fri, 22 Jul 2016 10:04:31 -0500 Subject: [PATCH 19/20] forgot to remove a git conflict line --- server/db.js | 6 ++---- 1 file changed, 2 insertions(+), 4 deletions(-) diff --git a/server/db.js b/server/db.js index f8b3665..1c4be34 100644 --- a/server/db.js +++ b/server/db.js @@ -1,10 +1,8 @@ var pmongo = require('promised-mongo'); -<<<<<<< c370a02d5173c88b14ac1027ea65d69d0fd30c6c + var uri = 'mongodb://jad:carson@ds023485.mlab.com:23485/austin_art'; -======= -var uri ='mongodb://jad:carson@ds023485.mlab.com:23485/austin_art'; ->>>>>>> Have a working map and now adding extra info to it + var db = pmongo(uri, { authMechanism: 'ScramSHA1' From 281ea03c387e80725f662e24183e5f5d3322b5c6 Mon Sep 17 00:00:00 2001 From: Jad Carson Date: Fri, 22 Jul 2016 10:18:28 -0500 Subject: [PATCH 20/20] forgot to commit this --- client/components/ArtWindow.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/client/components/ArtWindow.js b/client/components/ArtWindow.js index b5f2e6e..9646e23 100644 --- a/client/components/ArtWindow.js +++ b/client/components/ArtWindow.js @@ -196,7 +196,7 @@ class Info extends React.Component {

    Not Art: {this.props.currentArt.trashCount.length}

    Hipster Scale: {this.props.currentArt.userScore.length}

    - +