154 |
155 |
238 |
239 | )
240 | }
241 | }
242 |
--------------------------------------------------------------------------------
/app/components/MilestoneFormContainer.jsx:
--------------------------------------------------------------------------------
1 | import React from 'react'
2 | import {Route} from 'react-router'
3 | import {getMilestoneRefs} from 'APP/fire/refs'
4 |
5 | import MilestoneForm from './MilestoneForm'
6 |
7 | export default ({params: {id, mid}}) => {
8 | const milestoneRefs = getMilestoneRefs(id, mid)
9 | return (
10 |
156 |
237 |
157 |
163 |
158 |
162 |
159 | {this.state.name}
160 |
161 | {this.state.name} browserHistory.push('/')} />
160 |
164 |
236 |
165 |
199 |
166 |
190 | Milestone Information
167 |
168 |
176 |
177 |
182 |
183 |
184 |
185 |
186 |
187 |
189 |
191 |
198 | Notes
192 |
200 |
229 |
201 |
214 | Resources
202 |
204 | {this.state.resources && this.state.resources.map((resourceId, index) => {
205 | return (
206 |
213 |
207 |
209 | )
210 | })
211 | }
212 |
215 |
228 | Uploads
216 |
218 | {this.state.uploads && this.state.uploads.map((upload, index) => {
219 | const uploadId = upload[0]
220 | const uploadInfo = upload[1]
221 | return (
222 |
227 |
230 |
234 |
235 |
11 |
13 | )
14 | }
15 |
--------------------------------------------------------------------------------
/app/components/Navbar.jsx:
--------------------------------------------------------------------------------
1 | import React, { Component } from 'react'
2 | import { Link, browserHistory } from 'react-router'
3 |
4 | import MuiThemeProvider from 'material-ui/styles/MuiThemeProvider'
5 | import darkBaseTheme from 'material-ui/styles/baseThemes/darkBaseTheme'
6 | import getMuiTheme from 'material-ui/styles/getMuiTheme'
7 | import FlatButton from 'material-ui/FlatButton'
8 |
9 | import { AppBar, Tabs, Tab } from 'material-ui'
10 |
11 | import WhoAmI from './WhoAmI'
12 |
13 | import firebase from 'APP/fire'
14 | const auth = firebase.auth()
15 |
16 | export const Navbar = ({ user, auth }) =>
17 | 
}
21 | onLeftIconButtonTouchTap={() => browserHistory.push('/')}
22 | iconElementRight={auth.currentUser ?
9 |
12 | )
13 | }
14 |
15 | export default NotFound
16 |
--------------------------------------------------------------------------------
/app/components/ResourceCard.jsx:
--------------------------------------------------------------------------------
1 | import React, { Component } from "react"
2 | import { Link, browserHistory } from "react-router"
3 |
4 | import firebase from "APP/fire"
5 | const db = firebase.database()
6 |
7 | import MuiThemeProvider from "material-ui/styles/MuiThemeProvider"
8 | import lightBaseTheme from "material-ui/styles/baseThemes/lightBaseTheme"
9 | import alignTheme from "./AlignTheme"
10 | import getMuiTheme from "material-ui/styles/getMuiTheme"
11 | import FlatButton from "material-ui/FlatButton"
12 | import IconButton from "material-ui/IconButton"
13 | import {
14 | Card,
15 | CardActions,
16 | CardHeader,
17 | CardMedia,
18 | CardText
19 | } from "material-ui/Card"
20 | import ContentEdit from "material-ui/svg-icons/content/create"
21 | import ContentLink from "material-ui/svg-icons/content/link"
22 | import Delete from "material-ui/svg-icons/content/clear"
23 |
24 | let urlRef, titleRef, imageRef, descriptionRef, milestoneRef
25 |
26 | export default class extends Component {
27 | constructor(props) {
28 | super()
29 | this.state = {
30 | title: '',
31 | url: '',
32 | image: '',
33 | description: ''
34 | }
35 | }
36 |
37 | componentDidMount() {
38 | // When the component mounts, start listening to the fireRef we were given.
39 | this.listenTo(this.props.fireRef)
40 | }
41 |
42 | componentWillUnmount() {
43 | // When we unmount, stop listening.
44 | this.unsubscribe()
45 | }
46 |
47 | componentWillReceiveProps(incoming, outgoing) {
48 | // When the props sent to us by our parent component change,
49 | // start listening to the new firebase reference.
50 | this.listenTo(incoming.fireRef)
51 | }
52 |
53 | listenTo(fireRef) {
54 | // If we're already listening to a ref, stop listening there.
55 | if (this.unsubscribe) this.unsubscribe()
56 |
57 | titleRef = fireRef.titleRef
58 | urlRef = fireRef.urlRef
59 | imageRef = fireRef.imageRef
60 | descriptionRef = fireRef.descriptionRef
61 | milestoneRef = fireRef.milestoneRef
62 |
63 | // Whenever our ref's value changes, set {value} on our state.
64 |
65 | const titleListener = titleRef.on("value", snapshot =>
66 | this.setState({ title: snapshot.val() })
67 | );
68 |
69 | const urlListener = urlRef.on("value", snapshot => {
70 | this.setState({ url: snapshot.val() });
71 | });
72 |
73 | const imageListener = imageRef.on("value", snapshot => {
74 | this.setState({ image: snapshot.val() });
75 | });
76 |
77 | const descriptionListener = descriptionRef.on("value", snapshot => {
78 | this.setState({ description: snapshot.val() });
79 | });
80 |
81 | const milestoneListener = milestoneRef.on("value", snapshot => {
82 | this.setState({ mileId: snapshot.val() });
83 | });
84 |
85 | // Set unsubscribe to be a function that detaches the listener.
86 | this.unsubscribe = () => {
87 | titleRef.off("value", titleListener);
88 | urlRef.off("value", urlListener);
89 | imageRef.off("value", imageListener);
90 | descriptionRef.off("value", descriptionListener);
91 | milestoneRef.off("value", milestoneListener);
92 | };
93 | }
94 |
95 | deleteResource = () => {
96 | // we want to delete resources from the goal they live on, as well as the milestone if one exists
97 | // for now, though, don't delete resources from resources object itself (on same level as goals)
98 | const resourceId = this.props.id
99 | const goalId = this.props.goalId
100 | const milestoneId = this.state.mileId
101 | this.unsubscribe()
102 |
103 | let dataToDelete = {}
104 | dataToDelete[`/goals/${goalId}/resources/${resourceId}`] = null // Set resource to null on goals object
105 | if (this.state.mileId) {
106 | dataToDelete[ // if resource also exists on a milestone, set it to null there too
107 | `/goals/${goalId}/milestones/${milestoneId}/resources/${resourceId}`
108 | ] = null
109 | }
110 | db.ref().update(dataToDelete, function(error) {
111 | if (error) {
112 | console.log("Error deleting data: ", error);
113 | }
114 | })
115 | }
116 |
117 | render() {
118 | // Rendering form with material UI
119 | return (
120 | Looks like there's no page here
10 |Lost? Here's a way home.
11 |
252 |
416 |
417 |
419 |
420 |
426 |
432 |
433 |
434 |
435 | )
436 | }
437 | }
438 |
--------------------------------------------------------------------------------
/app/components/Upload.jsx:
--------------------------------------------------------------------------------
1 | import React, { Component } from 'react'
2 | import firebase from 'APP/fire'
3 | import FileUploader from 'react-firebase-file-uploader'
4 | import Add from 'material-ui/svg-icons/content/add'
5 | import CircularProgress from 'material-ui/CircularProgress'
6 | import RaisedButton from 'material-ui/RaisedButton'
7 | const db = firebase.database()
8 |
9 | class InputButton extends Component {
10 | constructor(props) {
11 | super()
12 | this.state = {
13 |
14 | }
15 | }
16 |
17 | componentWillReceiveProps(newProps, oldProps) {
18 | this.setState({onChange: newProps.onChange})
19 | }
20 |
21 | render() {
22 | return (
23 |
253 | {this.state.goals.length > 0 ?
254 | { this.handleLineTap(event, goal) }
320 | }
321 | }]}
322 | data={this.getLineData(goalInfo, index)}
323 | labelComponent={ {
349 | let goalPath = props.data[props.index].key
350 | browserHistory.push(goalPath)
351 | }
352 | }
353 | }]}
354 | data={this.getScatterData(goalInfo, index, goalId)}
355 | labelComponent={
363 |
364 | {/* Overview chart at the bottom
365 | (Only shown if there are goals) */}
366 |
367 | {this.state.goals.length > 0 ?
368 |
369 |
: null }
415 |
87 |
112 |
113 | )
114 | }
115 | }
116 |
117 | export default Upload
118 |
--------------------------------------------------------------------------------
/app/components/UploadCard.jsx:
--------------------------------------------------------------------------------
1 | import React, { Component } from 'react'
2 |
3 | import MuiThemeProvider from 'material-ui/styles/MuiThemeProvider'
4 | import lightBaseTheme from 'material-ui/styles/baseThemes/lightBaseTheme'
5 | import alignTheme from './AlignTheme'
6 | import getMuiTheme from 'material-ui/styles/getMuiTheme'
7 | import TextField from 'material-ui/TextField'
8 | import {Card, CardMedia, CardText} from 'material-ui/Card'
9 |
10 | import firebase from 'APP/fire'
11 | const db = firebase.database()
12 | let captionRef, parentRef, child, childRef
13 |
14 | // we're basically adding a child (or updating child) for something that already exists
15 | // this component will receive goalRef, plus optional milestoneRef or checkInRef, as props
16 | // if we have milestone or checkIn refs, we'll also want to write to the goalRef (parent)?
17 | // BUT if we only get goalRef, we'll also want to check whether we can write to milestone or checkIn?
18 |
19 | export default class extends Component {
20 | constructor(props) {
21 | super()
22 | this.state = {
23 | caption: ''
24 | }
25 | }
26 |
27 | componentDidMount() {
28 | // When the component mounts, start listening to the fireRef we were given.
29 | this.listenTo(this.props.goalRef)
30 | }
31 |
32 | componentWillUnmount() {
33 | // When we unmount, stop listening.
34 | this.unsubscribe()
35 | }
36 |
37 | componentWillReceiveProps(incoming, outgoing) {
38 | // When the props sent by our parent component change, start listening to the new reference.
39 | this.listenTo(incoming.goalRef)
40 | }
41 |
42 | listenTo(goalRef) {
43 | // If we're already listening to a ref, stop listening there.
44 | if (this.unsubscribe) this.unsubscribe()
45 |
46 | let mileId = this.props.milestoneId
47 | let checkInId = this.props.checkInId
48 | const uploadId = this.props.uploadId
49 |
50 | // what if we just make it so that you can't update captions for mstone / checkin uploads on the goal??
51 | if (this.props.milestoneRef) {
52 | captionRef = goalRef.child('milestones').child(mileId).child('uploads').child(uploadId).child('caption')
53 | parentRef = goalRef.child('uploads').child(uploadId).child('caption')
54 | } else if (this.props.checkInRef) {
55 | captionRef = goalRef.child('checkIns').child(checkInId).child('uploads').child(uploadId).child('caption')
56 | parentRef = goalRef.child('uploads').child(uploadId).child('caption')
57 | } else {
58 | captionRef = goalRef.child(uploadId).child('caption')
59 | }
60 |
61 | /*
62 | // here's an attempt to start doing this by child instead of by parent; requires adjusting what we pass down as goalRefs
63 | const uploadId = this.props.uploadId
64 | const mileId = goalRef.child(uploadId).child('milestoneId') || null
65 | const checkInId = goalRef.child(uploadId).child('checkInId') || null
66 |
67 | captionRef = goalRef.child('uploads').child(uploadId).child('caption')
68 | if (mileId) {
69 | childRef = goalRef.child('milestones').child(mileId).child('uploads').child(uploadId).child('caption')
70 | } else if (checkInId) {
71 | childRef = goalRef.child('checkIns').child(checkInId).child('uploads').child(uploadId).child('caption')
72 | } else {
73 | childRef = null // ??
74 | }
75 | */
76 |
77 | // Whenever our ref's value changes, set {value} on our state
78 | const captionListener = captionRef.on('value', snapshot => {
79 | this.setState({ caption: snapshot.val() })
80 | })
81 |
82 | // Set unsubscribe to be a function that detaches the listener.
83 | this.unsubscribe = () => {
84 | captionRef.off('value', captionListener)
85 | }
86 | }
87 |
88 | writeCaption = (event) => {
89 | captionRef.set(event.target.value)
90 | if (parentRef) parentRef.set(event.target.value)
91 | if (childRef) childRef.set(event.target.value)
92 | }
93 |
94 | render() {
95 | const textStyle = { width: 215 }
96 |
97 | return (
98 |
19 | {name(user)}
20 |
21 | {
22 | auth.signOut()
23 | .then(() => { // After logging out, redirect to login/landing page
24 | browserHistory.push('/')})
25 | }} primary={true} />
26 |
27 |
28 |
29 | export default class extends React.Component {
30 | componentDidMount() {
31 | const {auth} = this.props
32 | this.unsubscribe = auth.onAuthStateChanged(user => this.setState({user}))
33 | }
34 |
35 | componentWillUnmount() {
36 | this.unsubscribe()
37 | }
38 |
39 | render() {
40 | const {user} = this.state || {}
41 | return
36 | {children}
40 |
41 |