├── burger.png
├── .firebaserc
├── public
├── static
│ ├── offline-sprite.png
│ ├── favicons
│ │ ├── favicon.ico
│ │ ├── favicon-16x16.png
│ │ ├── favicon-32x32.png
│ │ ├── apple-touch-icon.png
│ │ ├── android-chrome-192x192.png
│ │ ├── android-chrome-512x512.png
│ │ └── safari-pinned-tab.svg
│ ├── print.css
│ ├── burger.svg
│ ├── addtohomescreen.css
│ └── addtohomescreen.min.js
├── manifest.json
└── index.html
├── bin
├── deploy.sh
├── appcache.sh
└── build.sh
├── src
├── index.css
├── App.test.js
├── index.js
├── heart.svg
├── Schema.js
├── Settings.js
├── App.css
├── Common.js
├── Store.js
├── Favorites.js
├── Days.js
├── Search.js
├── User.js
├── SignIn.js
├── Nav.js
├── Group.js
├── Day.js
└── App.js
├── .gitignore
├── sw-precache-config.js
├── .editorconfig
├── README.md
├── database-rules.json
├── Makefile
├── package.json
├── firebase.json
└── TODO
/burger.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/peterbe/dinnerd/master/burger.png
--------------------------------------------------------------------------------
/.firebaserc:
--------------------------------------------------------------------------------
1 | {
2 | "projects": {
3 | "dev": "dinnerd-dev",
4 | "prod": "dinnerd-45b97"
5 | }
6 | }
--------------------------------------------------------------------------------
/public/static/offline-sprite.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/peterbe/dinnerd/master/public/static/offline-sprite.png
--------------------------------------------------------------------------------
/public/static/favicons/favicon.ico:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/peterbe/dinnerd/master/public/static/favicons/favicon.ico
--------------------------------------------------------------------------------
/public/static/favicons/favicon-16x16.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/peterbe/dinnerd/master/public/static/favicons/favicon-16x16.png
--------------------------------------------------------------------------------
/public/static/favicons/favicon-32x32.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/peterbe/dinnerd/master/public/static/favicons/favicon-32x32.png
--------------------------------------------------------------------------------
/public/static/favicons/apple-touch-icon.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/peterbe/dinnerd/master/public/static/favicons/apple-touch-icon.png
--------------------------------------------------------------------------------
/bin/deploy.sh:
--------------------------------------------------------------------------------
1 | #!/bin/bash
2 | set -eo pipefail
3 |
4 |
5 | #firebase deploy
6 | firebase deploy --only database
7 | firebase deploy --only hosting
8 |
--------------------------------------------------------------------------------
/public/static/favicons/android-chrome-192x192.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/peterbe/dinnerd/master/public/static/favicons/android-chrome-192x192.png
--------------------------------------------------------------------------------
/public/static/favicons/android-chrome-512x512.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/peterbe/dinnerd/master/public/static/favicons/android-chrome-512x512.png
--------------------------------------------------------------------------------
/src/index.css:
--------------------------------------------------------------------------------
1 | /*body {
2 | margin: 0;
3 | padding: 0;
4 | font-family: sans-serif;
5 | }*/
6 |
7 |
8 |
9 | body, .smooth-container { scroll-behavior: smooth; }
10 |
--------------------------------------------------------------------------------
/src/App.test.js:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import ReactDOM from 'react-dom';
3 | import App from './App';
4 |
5 | it('renders without crashing', () => {
6 | const div = document.createElement('div');
7 | ReactDOM.render(
12 |
Settings
13 |
28 |
29 |
43 |
44 |
45 |
50 | Close Settings
51 |
52 |
21 | { dateFns.format(start, 'D MMM') }
22 | {' '}
23 | ...
24 | {' '}
25 | { dateFns.format(end, 'D MMM') }
26 |
27 | )
28 | })
29 |
30 | export const Heart = pure(
31 | ({ filled, bubble, size = 18 }) => {
32 | return (
33 |
34 |
35 |
39 |
40 | )
41 | })
42 |
43 |
44 | export function debounce(callback, wait, context = this) {
45 | let timeout = null
46 | let callbackArgs = null
47 |
48 | const later = () => callback.apply(context, callbackArgs)
49 |
50 | return function() {
51 | callbackArgs = arguments
52 | clearTimeout(timeout)
53 | timeout = setTimeout(later, wait)
54 | }
55 | }
56 |
57 |
58 | export const ShowFirebaseError = ({ heading, error }) => {
59 | if (!error) {
60 | return null
61 | }
62 | return (
63 |
64 |
{ heading }
65 |
66 |
67 | { error.code }
68 |
69 |
70 |
71 | { error.message }
72 |
73 |
25 |
26 | Favorites
27 | {' '}
28 | (most recent first)
29 |
30 | { !store.recentFavorites ? Loading... : null }
31 |
32 | {
33 | store.recentFavorites && !store.recentFavorites.length ?
34 | No favorites saved. Heart more!
35 | : null
36 | }
37 | {
38 | store.recentFavorites && store.recentFavorites.length ?
39 |
51 | Close Favorites
52 |
53 |
54 | )
55 | }
56 | })
57 |
58 | export default Favorites
59 |
60 |
61 | // Consider importing this from Search instead (or Common)
62 | const ShowSearchResults = ({ results, onClosePage }) => {
63 | return (
64 |
65 | {
66 | results.map(result => {
67 | return (
68 |
70 |
71 |
76 |
77 | Last used { dateFns.format(result.datetime, 'D MMM') },
78 | {' '}
79 | { dateFns.formatDistanceStrict(
80 | new Date(), result.datetime, {addSuffix: true}
81 | ) }
82 |
83 |
84 |
86 | {
90 | store.copied = {
91 | date: result.date,
92 | text: result.text,
93 | notes: result.notes,
94 | starred: result.starred,
95 | }
96 | onClosePage()
97 | }}>
98 | Copy
99 |
100 |
101 |
102 | )
103 | })
104 | }
105 |
7 |
8 | Created by potrace 1.11, written by Peter Selinger 2001-2013
9 |
10 |
12 |
59 |
60 |
--------------------------------------------------------------------------------
/src/Days.js:
--------------------------------------------------------------------------------
1 | import React, { Component } from 'react'
2 | import { observer } from 'mobx-react'
3 | import zenscroll from 'zenscroll'
4 | import {
5 | startOfWeek,
6 | subDays,
7 | isEqual,
8 | } from 'date-fns/esm'
9 |
10 | import store from './Store'
11 | import { makeDayId } from './Common'
12 | import Day from './Day'
13 |
14 | const dateFns = {
15 | startOfWeek: startOfWeek,
16 | subDays: subDays,
17 | isEqual: isEqual,
18 | }
19 |
20 | const Days = observer(class Days extends Component {
21 |
22 | constructor(props) {
23 | super(props)
24 | this.state = {
25 | loadingPreviousWeek: false,
26 | loadingNextWeek: false,
27 | }
28 | }
29 |
30 | loadPreviousWeek = (event) => {
31 | const firstDatetime = store.dateRangeStart
32 | const firstDatePreviousWeek = dateFns.subDays(firstDatetime, 7)
33 | this.props.loadWeek(firstDatePreviousWeek)
34 | this.setState({loadingPreviousWeek: false}, () => {
35 | const id = makeDayId(firstDatePreviousWeek)
36 | const element = document.querySelector('#' + id)
37 | if (element) {
38 | zenscroll.to(element)
39 | }
40 | })
41 | }
42 |
43 | loadNextWeek = (event) => {
44 | const firstDateNextWeek = store.dateRangeEnd
45 | this.props.loadWeek(firstDateNextWeek)
46 | this.setState({loadingNextWeek: false}, () => {
47 | const id = makeDayId(firstDateNextWeek)
48 | const element = document.querySelector('#' + id)
49 | if (element) {
50 | zenscroll.to(element)
51 | }
52 | })
53 | }
54 |
55 | render() {
56 | const weekStartsOn = store.settings.weekStartsOnAMonday ? 1 : 0
57 | return (
58 |
59 | {/*
60 | By default currentUser===null, but if firebase
61 | has successfully run onAuthStateChanged at least once
62 | then it gets set to 'false'.
63 | Only then show the unauthorized warning.
64 | */}
65 | {
66 | store.currentUser === false && !store.offline ?
67 |
70 | : null
71 | }
72 |
73 | {
74 | store.days.size ?
75 |
76 | {
80 | // this.setState({loadingPreviousWeek: true})
81 | // setTimeout(() => {
82 | // this.setState({loadingPreviousWeek: false})
83 | // }, 1000)
84 | // }}
85 | onClick={this.loadPreviousWeek.bind(this)}>
86 | Previous week
87 |
88 |
89 | : null
90 | }
91 |
92 | { !store.days.size ?
Loading... : null }
93 |
94 | {
95 | store.filteredDays.map(day => {
96 | let firstDateThisWeek = dateFns.isEqual(
97 | day.datetime,
98 | dateFns.startOfWeek(day.datetime, {weekStartsOn: weekStartsOn})
99 | )
100 | return
107 | })
108 | }
109 | {
110 | store.days.size ?
111 |
112 | {
116 | // this.setState({loadingNextWeek: true})
117 | // setTimeout(() => {
118 | // this.setState({loadingNextWeek: false})
119 | // }, 1000)
120 | // }}
121 | onClick={this.loadNextWeek.bind(this)}>
122 | { this.state.loadingNextWeek ? 'Loading...' : 'Next week' }
123 |
124 |
125 | : null
126 | }
127 |
139 |
Not Signed In
140 |
141 | It's OK but nothing you enter will be backed up.
142 |
143 |
144 | {
148 | gotoSignInPage()
149 | }}
150 | >
151 | Sign In
152 |
153 |
154 |
71 |
Search
72 |
93 |
94 | { this.state.searching ?
Searching... : null }
95 |
96 | {
97 | !this.state.searching && this.state.searchResults && !this.state.searchResults.length ?
98 |
Nothing found.
99 | : null
100 | }
101 |
102 | {
103 | !this.state.searching && this.state.searchResults && this.state.searchResults.length ?
104 |
108 | : null
109 | }
110 |
111 |
116 | Close Search
117 |
118 |
129 | {
130 | results.map(result => {
131 | return (
132 |
134 |
135 |
141 |
142 | Last used { dateFns.format(result.datetime, 'D MMM') },
143 | {' '}
144 | { dateFns.formatDistanceStrict(
145 | new Date(), result.datetime, {addSuffix: true}
146 | ) }
147 |
148 |
149 |
151 | {
155 | store.copied = {
156 | date: result.date,
157 | text: result.text,
158 | notes: result.notes,
159 | starred: result.starred,
160 | }
161 | onClosePage()
162 | }}>
163 | Copy
164 |
165 |
166 |
167 | )
168 | })
169 | }
170 |
17 |
User
18 |
19 |
20 | {/* Name */}
21 | {/* { store.currentUser.displayName } */}
22 | Email
23 | { store.currentUser.email }
24 | Email Verified?
25 | { store.currentUser.emailVerified ? 'Yes' : 'Not yet' }
26 |
27 |
28 | {
29 | this.state.changePassword ?
30 |
{
33 | this.setState({changePassword: false})
34 | }}
35 | />
36 | : null
37 | }
38 |
39 |
44 | Sign out
45 |
46 | {
50 | this.setState({changePassword: !this.state.changePassword})
51 | }}
52 | >
53 | Change your password
54 |
55 | {
59 | store.currentUser.getToken().then(t => {
60 | console.warn('Access Token', t)
61 | prompt(t)
62 | })
63 | }}
64 | >
65 | Get your Access Token
66 |
67 |
68 |
73 | Close
74 |
75 |
19 |
Sign In
20 |
21 | {
22 | this.state.resetPassword ?
23 | {
25 | this.setState({resetPassword: false})
26 | }}
27 | auth={this.props.auth}
28 | /> :
29 | {
43 | this.setState({resetPassword: true})
44 | }}
45 | >
46 | Forgot your password?
47 |
48 | : null
49 | }
50 |
51 |
57 | Close
58 |
59 |
60 | )
61 | }
62 | })
63 |
64 | export default SignIn
65 |
66 |
67 | class Login extends Component {
68 |
69 | constructor(props) {
70 | super(props)
71 | this.state = {
72 | error: null,
73 | }
74 | }
75 |
76 | render() {
77 | return (
78 |
139 |
140 |
141 | )
142 | }
143 | }
144 |
145 |
146 | class ResetPassword extends Component {
147 |
148 | constructor(props) {
149 | super(props)
150 | this.state = {
151 | error: null,
152 | }
153 | }
154 |
155 | render() {
156 | return (
157 |
194 | )
195 | }
196 |
197 | }
198 |
--------------------------------------------------------------------------------
/public/static/burger.svg:
--------------------------------------------------------------------------------
1 |
34 | {
43 | this.setState({collapsing: true})
44 | window.setTimeout(() => {
45 | this.setState({collapsing: false, collapsed: !this.state.collapsed})
46 | }, 200)
47 | }}>
48 |
52 | {
56 | e.preventDefault()
57 | this.props.onGotoWeek()
58 | }}>
59 | Dinnerd
60 | {' '}
61 | {
62 | store.firstDateThisWeek ?
63 |
71 |
72 |
205 |
206 | )
207 | }
208 | })
209 |
210 | export default Nav
211 |
212 |
213 | export const ShowOfflineIndicator = pure(
214 | ({ offline }) => {
215 | let style = {
216 | backgroundImage: `url(${process.env.PUBLIC_URL}/static/offline-sprite.png)`,
217 | backgroundRepeat: 'no-repeat',
218 | display: 'inline-block',
219 | width: 16,
220 | height: 16,
221 | }
222 | if (offline) {
223 | style.backgroundPosition = '-16px 0'
224 | } else {
225 | style.backgroundPosition = '0 0'
226 | }
227 | return (
228 |
229 | {
230 | offline ?
231 |
235 |
238 | :
239 |
243 |
246 | }
247 |
248 | )
249 | })
250 |
--------------------------------------------------------------------------------
/public/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | Dinnerd
24 |
45 |
46 |
Loading...
47 |
48 |
49 |
50 | Taking forever?Reloading
54 |
55 |
56 |
94 |
Group
95 |
96 |
97 | Everything you save has to belong to a group.
100 |
101 | {
102 | store.currentGroup ?
103 |
You're currently in the { store.currentGroup.name } group.
104 | : null
105 | }
106 |
107 | {
108 | this.state.codes ?
109 |
110 | : null
111 | }
112 |
113 | {
114 | this.state.otherGroups ?
115 | {
117 | store.currentGroup = group
118 | store.setSetting('defaultGroupId', group.id)
119 | this.fetchOtherGroups()
120 | this.fetchCurrentGroupCodes()
121 | this.props.onDefaultGroupChanged()
122 | }}
123 | otherGroups={this.state.otherGroups}/>
124 | : null
125 | }
126 |
127 | {
128 | this.state.changeGroup || !store.currentGroup ?
129 | {
132 | let codes = this.state.codes || []
133 | codes.push(code)
134 | this.setState({codes: codes})
135 | }}
136 | onClose={() => {
137 | this.setState({changeGroup: false})
138 | }}
139 | /> :
140 | {
148 | this.setState({joinOtherGroup: false})
149 | }}
150 | /> :
151 | {
155 | this.setState({joinOtherGroup: true})
156 | }}
157 | >
158 | Join Other Group
159 |
160 | }
161 |
162 |
167 | Close
168 |
169 |
193 |
264 |
265 |
293 |
294 | {/*
{
298 | this.props.onClose()
299 | }}
300 | >
301 | Cancel
302 | */}
303 |
448 |
To invite others into this group, give them one of these codes:
449 |
450 | {
451 | codes.map(code => {
452 | return { code }
456 |
463 |
Your Groups
464 | {
465 | otherGroups.map(group => {
466 | return (
467 | {
470 | joinOtherGroup(group)
471 | }}
472 | >
473 | { group.name }
474 |
475 | )
476 | })
477 | }
478 |
479 | )
480 | }
481 |
--------------------------------------------------------------------------------
/src/Day.js:
--------------------------------------------------------------------------------
1 | import React, { Component } from 'react'
2 | import Highlighter from 'react-highlight-words'
3 | import { observer } from 'mobx-react'
4 | import ReactCSSTransitionGroup from 'react-addons-css-transition-group'
5 | import zenscroll from 'zenscroll'
6 | import Linkify from 'react-linkify'
7 | import { pure } from 'recompose'
8 | import shallowEqual from 'fbjs/lib/shallowEqual'
9 |
10 | import {
11 | format,
12 | formatDistanceStrict,
13 | isSameDay,
14 | startOfDay,
15 | addDays,
16 | subDays,
17 | } from 'date-fns/esm'
18 |
19 | import {
20 | makeDayId,
21 | makeWeekId,
22 | Heart,
23 | ShowWeekHeaderDates,
24 | debounce,
25 | pagifyPromptText,
26 | } from './Common'
27 | import store from './Store'
28 |
29 | const dateFns = {
30 | format: format,
31 | formatDistanceStrict: formatDistanceStrict,
32 | isSameDay: isSameDay,
33 | startOfDay: startOfDay,
34 | addDays: addDays,
35 | subDays: subDays,
36 | }
37 |
38 |
39 | const Day = observer(class Day extends Component {
40 |
41 | constructor(props) {
42 | super(props)
43 | const { day } = this.props
44 | this.state = {
45 | text: day.text,
46 | notes: day.notes,
47 | starred: day.starred,
48 | searchResults: {},
49 | edit: false,
50 | saving: false,
51 | saved: true,
52 | hadText: false,
53 | }
54 | this.saveChanges = this.saveChanges.bind(this)
55 | this.autoCompleteSearch = debounce(this.autoCompleteSearch.bind(this), 300)
56 | this.inputBlurred = this.inputBlurred.bind(this)
57 | this.inputFocused = this.inputFocused.bind(this)
58 | this.fieldClicked = this.fieldClicked.bind(this)
59 | }
60 |
61 | fieldClicked(field) {
62 | this.startEdit(field)
63 | }
64 |
65 | saveChanges() {
66 | this.props.updateDay(this.props.day, {
67 | text: this.state.text.trim(),
68 | notes: this.state.notes.trim(),
69 | starred: this.state.starred,
70 | }).then(r => {
71 | this.setState({
72 | text: this.state.text.trim(),
73 | notes: this.state.notes.trim(),
74 | saved: true,
75 | searchResults: {},
76 | })
77 | })
78 | }
79 |
80 | inputBlurred(event) {
81 | this.closeEditSoon = window.setTimeout(() => {
82 | this.setState({edit: false})
83 | }, 300)
84 | this.saveSoon = window.setTimeout(() => {
85 | this.saveChanges()
86 | }, 1000)
87 | }
88 |
89 | inputFocused(event) {
90 | if (event.target.setSelectionRange) {
91 | const inputLength = event.target.value.length
92 | event.target.setSelectionRange(inputLength, inputLength)
93 | }
94 | if (this.closeEditSoon) {
95 | window.clearTimeout(this.closeEditSoon)
96 | }
97 | if (this.saveSoon) {
98 | window.clearTimeout(this.saveSoon)
99 | }
100 | }
101 |
102 | autoCompleteSearch(text, field) {
103 | if (text.length < 2) {
104 | if (this.state.searchResults[field]) {
105 | this.setState({searchResults: {}})
106 | }
107 | return
108 | }
109 | let searchResults = {}
110 | const searchConfig = {
111 | fields: {
112 | text: field === 'text' ? 1 : 0,
113 | notes: field === 'notes' ? 1 : 0,
114 | },
115 | // Important otherwise the suggestions won't go away when
116 | // start typing a lot more.
117 | bool: 'AND',
118 | expand: true,
119 | }
120 | const results = this.props.searcher(text, searchConfig)
121 | let filteredResults = []
122 | results.forEach(r => {
123 | if (r.date !== this.props.day.date) {
124 | filteredResults.push(r)
125 | }
126 | })
127 | searchResults[field] = filteredResults
128 | this.setState({searchResults: searchResults})
129 | }
130 |
131 | startEdit(focusOn = 'text') {
132 | const { day } = this.props
133 | // const hadText =
134 | this.setState({
135 | text: day.text,
136 | notes: day.notes,
137 | starred: day.starred,
138 | edit: true,
139 | hadText: !!this.state.text,
140 | }, () => {
141 | const parentElement = document.querySelector(
142 | '#' + makeDayId(this.props.day.datetime)
143 | )
144 | if (parentElement) {
145 | const element = parentElement.querySelector(
146 | `textarea.${focusOn}`
147 | )
148 | if (element) {
149 | element.focus()
150 | }
151 | }
152 | })
153 | }
154 |
155 | shouldComponentUpdate(nextProps, nextState) {
156 | let a = {
157 | text: this.props.day.text,
158 | notes: this.props.day.notes,
159 | starred: this.props.day.starred,
160 | firstDateThisWeek: this.props.firstDateThisWeek,
161 | }
162 | let b = {
163 | text: nextProps.day.text,
164 | notes: nextProps.day.notes,
165 | starred: nextProps.day.starred,
166 | firstDateThisWeek: nextProps.firstDateThisWeek,
167 | }
168 | return !shallowEqual(a, b) || !shallowEqual(this.state, nextState)
169 | // // let b = nextProps
170 | // // console.log('Props?', shallowEqual(a, b), 'State?', shallowEqual(this.state, nextState));
171 | //
172 | // // return !shallowEqual(a, b) || !shallowEqual(this.state, nextState)
173 | // let r= !shallowEqual(a, b) || !shallowEqual(this.state, nextState)
174 | // if (r) {
175 | // if (!shallowEqual(a, b)) {
176 | // console.log('DIFFERENT this.props:', a, 'nextProps:', nextProps);
177 | // }
178 | // if (!shallowEqual(this.state, nextState)) {
179 | // console.log('DIFFERENT this.state:', this.state, 'nextState:', nextState);
180 | // }
181 | // }
182 | // return r
183 | }
184 |
185 | fieldClicked = (field) => {
186 | this.startEdit(field)
187 | }
188 |
189 | render() {
190 | let { day, firstDateThisWeek } = this.props
191 | let display
192 | if (this.state.edit) {
193 | display = (
194 |
195 |
252 |
253 |
254 | {
257 | this.setState({starred: !this.state.starred}, this.saveChanges)
258 | }}
259 | />
260 |
261 |
262 | {
263 | !this.state.saved || this.state.saving ?
264 | {
269 | if (this.saveSoon) {
270 | window.clearTimeout(this.saveSoon)
271 | }
272 | this.saveChanges()
273 | // If there was focus on any inputs, and you press a
274 | // button like that, that input triggers its onBlur,
275 | // so we want to prevent that from happening.
276 | if (this.closeEditSoon) {
277 | window.clearTimeout(this.closeEditSoon)
278 | }
279 | this.setState({saving: true})
280 | setTimeout(() => {
281 | this.setState({edit: false, saving: false})
282 | }, 1000)
283 | }}
284 | >{ this.state.saving ? 'Saving' : 'Save'}
285 | : null
286 | }
287 | {' '}
288 | {
292 | if (this.saveSoon) {
293 | window.clearTimeout(this.saveSoon)
294 | }
295 | this.setState({edit: false})
296 | }}
297 | >Close
298 | {' '}
299 | {
300 | this.state.text && this.state.hadText ?
301 | {
305 | store.copied = {
306 | date: day.date,
307 | text: this.state.text,
308 | notes: this.state.notes,
309 | starred: this.state.starred
310 | }
311 | if (this.saveSoon) {
312 | window.clearTimeout(this.saveSoon)
313 | }
314 | setTimeout(() => {
315 | this.setState({edit: false})
316 | }, 1000)
317 | }}
318 | >
319 | {
320 | store.copied && store.copied.date === day.date ?
321 | 'Copied': 'Copy'
322 | }
323 |
324 |
325 | : null
326 | }
327 | {' '}
328 | {
329 | store.copied && store.copied.date !== day.date && store.copied.text !== this.state.text ?
330 | {
334 | this.setState({
335 | text: store.copied.text,
336 | notes: store.copied.notes,
337 | starred: store.copied.starred,
338 | saved: false,
339 | })
340 | // If there was focus on any inputs, and you press a
341 | // button like that, that input triggers its onBlur,
342 | // so we want to prevent that from happening.
343 | if (this.closeEditSoon) {
344 | window.clearTimeout(this.closeEditSoon)
345 | }
346 | // this.saveChanges()
347 | }}>
348 | Paste
349 |
350 | : null
351 | }
352 |
353 |
354 |
363 | }
364 |
365 | return (
366 |
372 |
373 | { firstDateThisWeek ?
: null }
374 |
375 |
{dateFns.format(day.datetime, 'dddd')}
376 |
377 |
378 |
379 |
383 | )
384 | }
385 | })
386 |
387 | export default Day
388 |
389 |
390 | const ShowWeekdayHeadDate = pure(
391 | ({ datetime }) => {
392 | const now = new Date()
393 | let text
394 | if (dateFns.isSameDay(now, datetime)) {
395 | text = 'Today'
396 | } else if (dateFns.isSameDay(datetime, dateFns.subDays(now, 1))) {
397 | text = 'Yesterday'
398 | } else if (dateFns.isSameDay(datetime, dateFns.addDays(now, 1))) {
399 | text = 'Tomorrow'
400 | } else {
401 | text = dateFns.formatDistanceStrict(
402 | dateFns.startOfDay(now),
403 | datetime,
404 | {addSuffix: true}
405 | )
406 |
407 | }
408 |
409 | return (
410 |
411 | { text }
412 |
413 | )
414 |
415 | })
416 |
417 | export const DisplayDay = pure(
418 | ({ text, notes, starred, fieldClicked }) => {
419 | return (
420 |
421 | {
422 | !text.trim() && !notes.trim() ?
423 |
fieldClicked && fieldClicked('text')}>empty
424 | : null
425 | }
426 |
fieldClicked && fieldClicked('text')}>
429 | {
430 | text.split('\n').map((item, key) => (
431 | {item}
432 | ))
433 | }
434 |
435 |
fieldClicked && fieldClicked('notes')}>
438 |
440 | { notes }
441 |
442 |
443 | { starred ?
444 |
{}}
448 | />
: null
449 | }
450 |
{
460 | const id = makeDayId(datetime)
461 | // XXX Consider using refs instead. See TODO
462 | const element = document.querySelector('#' + id)
463 | zenscroll.to(element)
464 | }}>
465 |
469 | )
470 | })
471 |
472 |
473 | const ShowTextAutocomplete = pure(
474 | ({ text, results, picked, field = 'text' }) => {
475 | if (!results) {
476 | return null
477 | }
478 | if (!results.length) {
479 | return null
480 | }
481 | if (!text.trim()) {
482 | return null
483 | }
484 | const searchWords = text.match(/\b(\w+)\b/g).map(word => {
485 | // return '\b' + word
486 | return word
487 | })
488 | return (
489 |
490 |
491 | {
492 | results.map(result => {
493 | return (
494 | picked(result[field])}
497 | >
498 |
504 | )
505 | })
506 | }
507 |
508 |
Zum Home-Bildschirm .",android:'Um diese Web-App zum Home-Bildschirm hinzuzufügen, öffnen Sie das Menü und tippen dann auf Zum Startbildschirm hinzufügen . Wenn Ihr Gerät eine Menütaste hat, lässt sich das Browsermenü über diese öffnen. Ansonsten tippen Sie auf icon . '},da_dk:{ios:"For at tilføje denne web app til hjemmeskærmen: Tryk %icon og derefter Føj til hjemmeskærm .",android:'For at tilføje denne web app til hjemmeskærmen, åbn browser egenskaber menuen og tryk på Føj til hjemmeskærm . Denne menu kan tilgås ved at trykke på menu knappen, hvis din enhed har en, eller ved at trykke på det øverste højre menu ikon icon . '},en_us:{ios:"To add this web app to the home screen: tap %icon and then Add to Home Screen .",android:'To add this web app to the home screen open the browser option menu and tap on Add to homescreen . The menu can be accessed by pressing the menu hardware button if your device has one, or by tapping the top right menu icon icon . '},es_es:{ios:"Para añadir esta aplicación web a la pantalla de inicio: pulsa %icon y selecciona Añadir a pantalla de inicio .",android:'Para añadir esta aplicación web a la pantalla de inicio, abre las opciones y pulsa Añadir a pantalla inicio . El menú se puede acceder pulsando el botón táctil en caso de tenerlo, o bien el icono de la parte superior derecha de la pantalla icon . '},fi_fi:{ios:"Liitä tämä sovellus kotivalikkoon: klikkaa %icon ja tämän jälkeen Lisää kotivalikkoon .",android:'Lisätäksesi tämän sovelluksen aloitusnäytölle, avaa selaimen valikko ja klikkaa tähti -ikonia tai Lisää aloitusnäytölle tekstiä . Valikkoon pääsee myös painamalla menuvalikkoa, jos laitteessasi on sellainen tai koskettamalla oikealla yläkulmassa menu ikonia icon . '},fr_fr:{ios:"Pour ajouter cette application web sur l'écran d'accueil : Appuyez %icon et sélectionnez Ajouter sur l'écran d'accueil .",android:'Pour ajouter cette application web sur l\'écran d\'accueil : Appuyez sur le bouton "menu", puis sur Ajouter sur l\'écran d\'accueil . Le menu peut-être accessible en appyant sur le bouton "menu" du téléphone s\'il en possède un '},he_il:{ios:'להוספת האפליקציה למסך הבית: ללחוץ על %icon ואז הוסף למסך הבית . ',android:'To add this web app to the home screen open the browser option menu and tap on Add to homescreen . The menu can be accessed by pressing the menu hardware button if your device has one, or by tapping the top right menu icon icon . '},it_it:{ios:"Per aggiungere questa web app alla schermata iniziale: premi %icon e poi Aggiungi a Home .",android:'Per aggiungere questa web app alla schermata iniziale, apri il menu opzioni del browser e premi su Aggiungi alla homescreen . Puoi accedere al menu premendo il pulsante hardware delle opzioni se la tua device ne ha uno, oppure premendo l\'icona icon in alto a destra. '},ja_jp:{ios:"このウェプアプリをホーム画面に追加するために%iconを押してホーム画面に追加 。",android:'To add this web app to the home screen open the browser option menu and tap on Add to homescreen . The menu can be accessed by pressing the menu hardware button if your device has one, or by tapping the top right menu icon icon . '},ko_kr:{ios:"홈 화면에 바로가기 생성: %icon 을 클릭한 후 홈 화면에 추가 .",android:'브라우저 옵션 메뉴의 홈 화면에 추가 를 클릭하여 홈화면에 바로가기를 생성할 수 있습니다. 옵션 메뉴는 장치의 메뉴 버튼을 누르거나 오른쪽 상단의 메뉴 아이콘 icon 을 클릭하여 접근할 수 있습니다. '},nb_no:{ios:"For å installere denne appen på hjem-skjermen: trykk på %icon og deretter Legg til på Hjem-skjerm .",android:'For å legge til denne webappen på startsiden åpner en nettlesermenyen og velger Legg til på startsiden . Menyen åpnes ved å trykke på den fysiske menyknappen hvis enheten har det, eller ved å trykke på menyikonet øverst til høyre icon . '},pt_br:{ios:"Para adicionar este app à tela de início: clique %icon e então Tela de início .",android:'To add this web app to the home screen open the browser option menu and tap on Add to homescreen . The menu can be accessed by pressing the menu hardware button if your device has one, or by tapping the top right menu icon icon . '},pt_pt:{ios:"Para adicionar esta app ao ecrã principal: clique %icon e depois Ecrã principal .",android:'To add this web app to the home screen open the browser option menu and tap on Add to homescreen . The menu can be accessed by pressing the menu hardware button if your device has one, or by tapping the top right menu icon icon . '},nl_nl:{ios:"Om deze webapp op je telefoon te installeren, klik op %icon en dan Zet in beginscherm .",android:'To add this web app to the home screen open the browser option menu and tap on Add to homescreen . The menu can be accessed by pressing the menu hardware button if your device has one, or by tapping the top right menu icon icon . '},ru_ru:{ios:'Чтобы добавить этот сайт на свой домашний экран, нажмите на иконку %icon и затем На экран "Домой" .',android:'Чтобы добавить сайт на свой домашний экран, откройте меню браузера и нажмите на Добавить на главный экран . Меню можно вызвать, нажав на кнопку меню вашего телефона, если она есть. Или найдите иконку сверху справа иконка . '},sv_se:{ios:"För att lägga till denna webbapplikation på hemskärmen: tryck på %icon och därefter Lägg till på hemskärmen .",android:'För att lägga till den här webbappen på hemskärmen öppnar du webbläsarens alternativ-meny och väljer Lägg till på startskärmen . Man hittar menyn genom att trycka på hårdvaruknappen om din enhet har en sådan, eller genom att trycka på menyikonen högst upp till höger icon . '},zh_cn:{ios:"如要把应用程序加至主屏幕,请点击%icon, 然后添加到主屏幕 ",android:'To add this web app to the home screen open the browser option menu and tap on Add to homescreen . The menu can be accessed by pressing the menu hardware button if your device has one, or by tapping the top right menu icon icon . '},zh_tw:{ios:"如要把應用程式加至主屏幕, 請點擊%icon, 然後加至主屏幕 .",android:'To add this web app to the home screen open the browser option menu and tap on Add to homescreen . The menu can be accessed by pressing the menu hardware button if your device has one, or by tapping the top right menu icon icon . '}};for(var j in b.intl)b.intl[j.substr(0,2)]=b.intl[j];b.defaults={appID:"org.cubiq.addtohome",fontSize:15,debug:!1,logging:!1,modal:!1,mandatory:!1,autostart:!0,skipFirstVisit:!1,startDelay:1,lifespan:15,displayPace:1440,maxDisplayCount:0,icon:!0,message:"",validLocation:[],onInit:null,onShow:null,onRemove:null,onAdd:null,onPrivate:null,privateModeOverride:!1,detectHomescreen:!1};var k=window.navigator.userAgent,l=window.navigator;c(b,{hasToken:"#ath"==document.location.hash||h.test(document.location.href)||i.test(document.location.search),isRetina:window.devicePixelRatio&&window.devicePixelRatio>1,isIDevice:/iphone|ipod|ipad/i.test(k),isMobileChrome:k.indexOf("Android")>-1&&/Chrome\/[.0-9]*/.test(k)&&-1==k.indexOf("Version"),isMobileIE:k.indexOf("Windows Phone")>-1,language:l.language&&l.language.toLowerCase().replace("-","_")||""}),b.language=b.language&&b.language in b.intl?b.language:"en_us",b.isMobileSafari=b.isIDevice&&k.indexOf("Safari")>-1&&k.indexOf("CriOS")<0,b.OS=b.isIDevice?"ios":b.isMobileChrome?"android":b.isMobileIE?"windows":"unsupported",b.OSVersion=k.match(/(OS|Android) (\d+[_\.]\d+)/),b.OSVersion=b.OSVersion&&b.OSVersion[2]?+b.OSVersion[2].replace("_","."):0,b.isStandalone="standalone"in window.navigator&&window.navigator.standalone,b.isTablet=b.isMobileSafari&&k.indexOf("iPad")>-1||b.isMobileChrome&&k.indexOf("Mobile")<0,b.isCompatible=b.isMobileSafari&&b.OSVersion>=6||b.isMobileChrome;var m={lastDisplayTime:0,returningVisitor:!1,displayCount:0,optedout:!1,added:!1};b.removeSession=function(a){try{if(!localStorage)throw new Error("localStorage is not defined");localStorage.removeItem(a||b.defaults.appID)}catch(c){}},b.doLog=function(a){this.options.logging&&console.log(a)},b.Class=function(a){if(this.doLog=b.doLog,this.options=c({},b.defaults),c(this.options,a),a&&a.debug&&"undefined"==typeof a.logging&&(this.options.logging=!0),e){if(this.options.mandatory=this.options.mandatory&&("standalone"in window.navigator||this.options.debug),this.options.modal=this.options.modal||this.options.mandatory,this.options.mandatory&&(this.options.startDelay=-.5),this.options.detectHomescreen=this.options.detectHomescreen===!0?"hash":this.options.detectHomescreen,this.options.debug&&(b.isCompatible=!0,b.OS="string"==typeof this.options.debug?this.options.debug:"unsupported"==b.OS?"android":b.OS,b.OSVersion="ios"==b.OS?"8":"4"),this.container=document.documentElement,this.session=this.getItem(this.options.appID),this.session=this.session?JSON.parse(this.session):void 0,!b.hasToken||b.isCompatible&&this.session||(b.hasToken=!1,d()),!b.isCompatible)return void this.doLog("Add to homescreen: not displaying callout because device not supported");this.session=this.session||m;try{if(!localStorage)throw new Error("localStorage is not defined");localStorage.setItem(this.options.appID,JSON.stringify(this.session)),b.hasLocalStorage=!0}catch(f){b.hasLocalStorage=!1,this.options.onPrivate&&this.options.onPrivate.call(this)}for(var g=!this.options.validLocation.length,h=this.options.validLocation.length;h--;)if(this.options.validLocation[h].test(document.location.href)){g=!0;break}if(this.getItem("addToHome")&&this.optOut(),this.session.optedout)return void this.doLog("Add to homescreen: not displaying callout because user opted out");if(this.session.added)return void this.doLog("Add to homescreen: not displaying callout because already added to the homescreen");if(!g)return void this.doLog("Add to homescreen: not displaying callout because not a valid location");if(b.isStandalone)return this.session.added||(this.session.added=!0,this.updateSession(),this.options.onAdd&&b.hasLocalStorage&&this.options.onAdd.call(this)),void this.doLog("Add to homescreen: not displaying callout because in standalone mode");if(this.options.detectHomescreen){if(b.hasToken)return d(),this.session.added||(this.session.added=!0,this.updateSession(),this.options.onAdd&&b.hasLocalStorage&&this.options.onAdd.call(this)),void this.doLog("Add to homescreen: not displaying callout because URL has token, so we are likely coming from homescreen");"hash"==this.options.detectHomescreen?history.replaceState("",window.document.title,document.location.href+"#ath"):"smartURL"==this.options.detectHomescreen?history.replaceState("",window.document.title,document.location.href.replace(/(\/)?$/,"/ath$1")):history.replaceState("",window.document.title,document.location.href+(document.location.search?"&":"?")+"ath=")}if(!this.session.returningVisitor&&(this.session.returningVisitor=!0,this.updateSession(),this.options.skipFirstVisit))return void this.doLog("Add to homescreen: not displaying callout because skipping first visit");if(!this.options.privateModeOverride&&!b.hasLocalStorage)return void this.doLog("Add to homescreen: not displaying callout because browser is in private mode");this.ready=!0,this.options.onInit&&this.options.onInit.call(this),this.options.autostart&&(this.doLog("Add to homescreen: autostart displaying callout"),this.show())}},b.Class.prototype={events:{load:"_delayedShow",error:"_delayedShow",orientationchange:"resize",resize:"resize",scroll:"resize",click:"remove",touchmove:"_preventDefault",transitionend:"_removeElements",webkitTransitionEnd:"_removeElements",MSTransitionEnd:"_removeElements"},handleEvent:function(a){var b=this.events[a.type];b&&this[b](a)},show:function(a){if(this.options.autostart&&!f)return void setTimeout(this.show.bind(this),50);if(this.shown)return void this.doLog("Add to homescreen: not displaying callout because already shown on screen");var c=Date.now(),d=this.session.lastDisplayTime;if(a!==!0){if(!this.ready)return void this.doLog("Add to homescreen: not displaying callout because not ready");if(c-d<6e4*this.options.displayPace)return void this.doLog("Add to homescreen: not displaying callout because displayed recently");if(this.options.maxDisplayCount&&this.session.displayCount>=this.options.maxDisplayCount)return void this.doLog("Add to homescreen: not displaying callout because displayed too many times already")}this.shown=!0,this.session.lastDisplayTime=c,this.session.displayCount++,this.updateSession(),this.applicationIcon||("ios"==b.OS?this.applicationIcon=document.querySelector('head link[rel^=apple-touch-icon][sizes="152x152"],head link[rel^=apple-touch-icon][sizes="144x144"],head link[rel^=apple-touch-icon][sizes="120x120"],head link[rel^=apple-touch-icon][sizes="114x114"],head link[rel^=apple-touch-icon]'):this.applicationIcon=document.querySelector('head link[rel^="shortcut icon"][sizes="196x196"],head link[rel^=apple-touch-icon]'));var e="";"object"==typeof this.options.message&&b.language in this.options.message?e=this.options.message[b.language][b.OS]:"object"==typeof this.options.message&&b.OS in this.options.message?e=this.options.message[b.OS]:this.options.message in b.intl?e=b.intl[this.options.message][b.OS]:""!==this.options.message?e=this.options.message:b.OS in b.intl[b.language]&&(e=b.intl[b.language][b.OS]),e=""+e.replace("%icon",'icon ')+"
",this.viewport=document.createElement("div"),this.viewport.className="ath-viewport",this.options.modal&&(this.viewport.className+=" ath-modal"),this.options.mandatory&&(this.viewport.className+=" ath-mandatory"),this.viewport.style.position="absolute",this.element=document.createElement("div"),this.element.className="ath-container ath-"+b.OS+" ath-"+b.OS+(b.OSVersion+"").substr(0,1)+" ath-"+(b.isTablet?"tablet":"phone"),this.element.style.cssText="-webkit-transition-property:-webkit-transform,opacity;-webkit-transition-duration:0s;-webkit-transition-timing-function:ease-out;transition-property:transform,opacity;transition-duration:0s;transition-timing-function:ease-out;",this.element.style.webkitTransform="translate3d(0,-"+window.innerHeight+"px,0)",this.element.style.transform="translate3d(0,-"+window.innerHeight+"px,0)",this.options.icon&&this.applicationIcon&&(this.element.className+=" ath-icon",this.img=document.createElement("img"),this.img.className="ath-application-icon",this.img.addEventListener("load",this,!1),this.img.addEventListener("error",this,!1),this.img.src=this.applicationIcon.href,this.element.appendChild(this.img)),this.element.innerHTML+=e,this.viewport.style.left="-99999em",this.viewport.appendChild(this.element),this.container.appendChild(this.viewport),this.img?this.doLog("Add to homescreen: not displaying callout because waiting for img to load"):this._delayedShow()},_delayedShow:function(a){setTimeout(this._show.bind(this),1e3*this.options.startDelay+500)},_show:function(){var a=this;this.updateViewport(),window.addEventListener("resize",this,!1),window.addEventListener("scroll",this,!1),window.addEventListener("orientationchange",this,!1),this.options.modal&&document.addEventListener("touchmove",this,!0),this.options.mandatory||setTimeout(function(){a.element.addEventListener("click",a,!0)},1e3),setTimeout(function(){a.element.style.webkitTransitionDuration="0.5s ease-in",a.element.style.transitionDuration="0.5s ease-in",a.element.style.webkitTransform="translate3d(0,0,0)",a.element.style.transform="translate3d(0,0,0)"},0),this.options.lifespan&&(this.removeTimer=setTimeout(this.remove.bind(this),1e3*this.options.lifespan)),this.options.onShow&&this.options.onShow.call(this)},remove:function(){clearTimeout(this.removeTimer),this.img&&(this.img.removeEventListener("load",this,!1),this.img.removeEventListener("error",this,!1)),window.removeEventListener("resize",this,!1),window.removeEventListener("scroll",this,!1),window.removeEventListener("orientationchange",this,!1),document.removeEventListener("touchmove",this,!0),this.element.removeEventListener("click",this,!0),this.element.addEventListener("transitionend",this,!1),this.element.addEventListener("webkitTransitionEnd",this,!1),this.element.addEventListener("MSTransitionEnd",this,!1),this.element.style.webkitTransitionDuration="0.3s",this.element.style.opacity="0"},_removeElements:function(){this.element.removeEventListener("transitionend",this,!1),this.element.removeEventListener("webkitTransitionEnd",this,!1),this.element.removeEventListener("MSTransitionEnd",this,!1),this.container.removeChild(this.viewport),this.shown=!1,this.options.onRemove&&this.options.onRemove.call(this)},updateViewport:function(){if(this.shown){this.viewport.style.width=window.innerWidth+"px",this.viewport.style.height=window.innerHeight+"px",this.viewport.style.left=window.scrollX+"px",this.viewport.style.top=window.scrollY+"px";var a=document.documentElement.clientWidth;this.orientation=a>document.documentElement.clientHeight?"landscape":"portrait";var c="ios"==b.OS?"portrait"==this.orientation?screen.width:screen.height:screen.width;this.scale=screen.width>a?1:c/window.innerWidth,this.element.style.fontSize=this.options.fontSize/this.scale+"px"}},resize:function(){clearTimeout(this.resizeTimer),this.resizeTimer=setTimeout(this.updateViewport.bind(this),100)},updateSession:function(){b.hasLocalStorage!==!1&&localStorage&&localStorage.setItem(this.options.appID,JSON.stringify(this.session))},clearSession:function(){this.session=m,this.updateSession()},getItem:function(a){try{if(!localStorage)throw new Error("localStorage is not defined");return localStorage.getItem(a)}catch(c){b.hasLocalStorage=!1}},optOut:function(){this.session.optedout=!0,this.updateSession()},optIn:function(){this.session.optedout=!1,this.updateSession()},clearDisplayCount:function(){this.session.displayCount=0,this.updateSession()},_preventDefault:function(a){a.preventDefault(),a.stopPropagation()}},window.addToHomescreen=b});
--------------------------------------------------------------------------------
/src/App.js:
--------------------------------------------------------------------------------
1 | import React, { Component } from 'react'
2 | import elasticlunr from 'elasticlunr'
3 | import { observer } from 'mobx-react'
4 | import zenscroll from 'zenscroll'
5 | import * as firebase from 'firebase/app'
6 | import 'firebase/auth'
7 | import 'firebase/database'
8 | import { pure } from 'recompose'
9 |
10 | import {
11 | format,
12 | getTime,
13 | startOfWeek,
14 | addDays,
15 | toDate,
16 | } from 'date-fns/esm'
17 |
18 | // import Perf from 'react-addons-perf'
19 | // window.Perf = Perf
20 |
21 | import './App.css'
22 | import Nav from './Nav'
23 | import Days from './Days'
24 | import Settings from './Settings'
25 | import Favorites from './Favorites'
26 | import User from './User'
27 | import SignIn from './SignIn'
28 | import Search from './Search'
29 | import Group from './Group'
30 | import store from './Store'
31 | import { makeDayId, pagifyScrubText } from './Common'
32 |
33 | // Because I love namespaces
34 | const dateFns = {
35 | toDate: toDate,
36 | getTime: getTime,
37 | startOfWeek: startOfWeek,
38 | addDays: addDays,
39 | format: format,
40 | }
41 |
42 | const DATE_FORMAT = 'YYYY-MM-DD'
43 |
44 | // string to Date object
45 | const decodeDatetime = dateStr => dateFns.toDate(dateStr)
46 | // Date object to string
47 | const encodeDatetime = dateObj => dateFns.getTime(dateObj)
48 |
49 | if (process.env.REACT_APP_DEV === 'true') {
50 | store.dev = true
51 | document.title = 'Dev ' + document.title
52 | }
53 |
54 | const App = observer(class App extends Component {
55 | constructor() {
56 | super()
57 |
58 | this.state = {
59 | page: 'days',
60 | }
61 |
62 | // Initialize Firebase
63 | const config = {
64 | apiKey: process.env.REACT_APP_FIREBASE_API_KEY,
65 | authDomain: process.env.REACT_APP_FIREBASE_AUTH_DOMAIN,
66 | databaseURL: process.env.REACT_APP_FIREBASE_DATABASE_URL,
67 | storageBucket: process.env.REACT_APP_FIREBASE_STORAGE_BUCKET,
68 | messagingSenderId: process.env.REACT_APP_FIREBASE_MESSAGING_SENDER_ID,
69 | }
70 | const firebaseApp = firebase.initializeApp(config)
71 | this.auth = firebaseApp.auth()
72 | this.auth.onAuthStateChanged(this.onAuthStateChanged.bind(this))
73 | if (process.env.REACT_APP_FIREBASE_LOGGING === 'true') {
74 | firebaseApp.database.enableLogging(true)
75 | }
76 | this.database = firebaseApp.database()
77 | }
78 |
79 | onAuthStateChanged = (user) => {
80 |
81 | // Perf.start()
82 |
83 | if (user) {
84 | // User is signed in!
85 | // let profilePicUrl = user.photoURL
86 | // let userName = user.displayName
87 | store.currentUser = user
88 | // If you're signed in, let's set what you're current group is
89 | if (!store.currentGroup && store.settings.defaultGroupId) {
90 | this.database.ref('/groups/' + store.settings.defaultGroupId)
91 | .once('value')
92 | .then(snapshot => {
93 | if (snapshot.val()) {
94 | store.currentGroup = {
95 | id: store.settings.defaultGroupId,
96 | name: snapshot.val().name
97 | }
98 | }
99 | }, error => {
100 | console.warn('Unable to look up group');
101 | console.error(error);
102 | })
103 | } else {
104 | // console.warn('Figure out which is your default group!');
105 | this.setState({page: 'group'})
106 | }
107 |
108 | // Only bother for people who bother to sign in.
109 | if (window.addToHomescreen) {
110 | setTimeout(() => {
111 | // window.addToHomescreen({debug: true})
112 | window.addToHomescreen()
113 | }, 3000)
114 | }
115 |
116 | } else {
117 | // User is signed out!
118 | console.log('No user', 'Signed out?');
119 | store.currentUser = false
120 | }
121 | }
122 |
123 | componentDidMount() {
124 |
125 | // setTimeout(() => {
126 | // Perf.stop()
127 | // Perf.printWasted()
128 | // }, 20000)
129 |
130 | this.searchData = {}
131 |
132 | if (this.database) {
133 | this.database.ref('.info/connected')
134 | .on('value', snapshot => {
135 | if (snapshot.val()) { // Yay! Connected!
136 | if (this.setOfflineTimeout) {
137 | window.clearTimeout(this.setOfflineTimeout)
138 | }
139 | this.triggerNotOffline()
140 | } else {
141 | console.log('navigator.onLine?', navigator.onLine);
142 | if (store.offline === null) {
143 | // It it hasn't been set yet, give it some time to do so
144 | this.setOfflineTimeout = window.setTimeout(() => {
145 | this.triggerOffline()
146 | }, 2000);
147 | } else {
148 | this.triggerOffline()
149 | }
150 | }
151 | })
152 | }
153 |
154 | this.loadInitialWeek()
155 |
156 | if (store.settings.defaultGroupId) {
157 | // this.listenOnDayRefs()
158 |
159 | const searchIndexAsJson = localStorage.getItem('searchIndex')
160 | const searchDataAsJson = localStorage.getItem('searchData')
161 | if (searchIndexAsJson && searchDataAsJson) {
162 | // console.log('this.searchIndex created from JSON');
163 | this.searchIndex = elasticlunr.Index.load(
164 | JSON.parse(searchIndexAsJson)
165 | )
166 | this.searchData = JSON.parse(searchDataAsJson)
167 |
168 | // Offline or not, fill in as many days as we can from
169 | // the localStorage snapshot.
170 | const dayDates = Object.keys(this.searchData)
171 | if (dayDates.length) {
172 | dayDates.forEach(date => {
173 | let data = this.searchData[date]
174 | store.addDay(
175 | date,
176 | decodeDatetime(data.datetime),
177 | data.text,
178 | data.notes,
179 | data.starred
180 | )
181 | })
182 | }
183 |
184 | } else {
185 | // console.log('this.searchIndex created from, elasticlunr', elasticlunr);
186 | // this.searchIndex = elasticlunr(function () {
187 | // this.addField('text')
188 | // this.addField('notes')
189 | // this.setRef('date')
190 | // // not store the original JSON document to reduce the index size
191 | // this.saveDocument(false)
192 | // })
193 | // this.searchData = {}
194 | this.loadSearchIndex()
195 | }
196 | }
197 | }
198 |
199 | triggerNotOffline = () => {
200 | store.offline = false
201 | }
202 |
203 | triggerOffline = () => {
204 | store.offline = true
205 | }
206 |
207 | listenOnDayRefs = () => {
208 | if (!store.dateRangeStart) {
209 | throw new Error('store.dateRangeStart not set')
210 | }
211 | if (!store.dateRangeEnd) {
212 | throw new Error('store.dateRangeEnd not set')
213 | }
214 | if (this.daysRef) {
215 | this.daysRef.off()
216 | }
217 | this.daysRef = this.database.ref(
218 | 'groups/' + store.settings.defaultGroupId + '/days'
219 | )
220 | .orderByChild('datetime')
221 | .startAt(encodeDatetime(store.dateRangeStart))
222 | .endAt(encodeDatetime(store.dateRangeEnd))
223 |
224 | this.daysRef.on('child_added', child => {
225 | const data = child.val()
226 | // console.log('DAY ADDED!', child.key, data);
227 | store.addDay(
228 | child.key,
229 | decodeDatetime(data.datetime),
230 | data.text,
231 | data.notes,
232 | data.starred
233 | )
234 | if (this.differentSearchData(child.key, data)) {
235 | this.searchData[child.key] = {
236 | date: child.key,
237 | datetime: data.datetime,
238 | text: data.text,
239 | notes: data.notes,
240 | starred: data.starred,
241 | }
242 | localStorage.setItem('searchData', JSON.stringify(this.searchData))
243 | }
244 | })
245 | this.daysRef.on('child_changed', child => {
246 | // console.log('DAY CHANGED!', child.key, child.val());
247 | const data = child.val()
248 | store.addDay(
249 | child.key,
250 | decodeDatetime(data.datetime),
251 | data.text,
252 | data.notes,
253 | data.starred
254 | )
255 | if (this.differentSearchData(child.key, data)) {
256 |
257 | this.searchData[child.key] = {
258 | date: child.key,
259 | datetime: data.datetime,
260 | text: data.text,
261 | notes: data.notes,
262 | starred: data.starred,
263 | }
264 | localStorage.setItem('searchData', JSON.stringify(this.searchData))
265 | }
266 | })
267 | }
268 |
269 | differentSearchData = (date, data) => {
270 | // compare 'data' with 'this.searchData[date]' and if any of them is
271 | // different return true.
272 | if (!this.searchData[date]) {
273 | return true
274 | }
275 | let differentKeys = Object.keys(data).filter(key => {
276 | return this.searchData[date] && data[key] !== this.searchData[date][key]
277 | })
278 | return !!differentKeys.length
279 | }
280 |
281 | loadSearchIndex = () => {
282 | // console.log('this.searchIndex created from, elasticlunr', elasticlunr);
283 | this.searchIndex = elasticlunr(function () {
284 | this.addField('text')
285 | this.addField('notes')
286 | this.setRef('date')
287 | // not store the original JSON document to reduce the index size
288 | this.saveDocument(false)
289 | })
290 | this.searchData = {}
291 | if (this._searchCache) {
292 | this._searchCache = {}
293 | }
294 | this.database.ref(
295 | 'groups/' + store.settings.defaultGroupId + '/days'
296 | )
297 | .once('value', snapshot => {
298 | snapshot.forEach(child => {
299 | const data = child.val()
300 | if (data.text || data.notes) {
301 | this.searchIndex.addDoc({
302 | date: child.key,
303 | text: data.text,
304 | notes: data.notes,
305 | })
306 | this.searchData[child.key] = {
307 | date: child.key,
308 | datetime: data.datetime,
309 | text: data.text,
310 | notes: data.notes,
311 | starred: data.starred,
312 | }
313 | }
314 | })
315 | localStorage.setItem(
316 | 'searchIndex',
317 | JSON.stringify(this.searchIndex)
318 | )
319 | localStorage.setItem(
320 | 'searchData',
321 | JSON.stringify(this.searchData)
322 | )
323 | })
324 | }
325 |
326 | loadInitialWeek = () => {
327 | const weekStartsOnAMonday = store.settings.weekStartsOnAMonday || false
328 | store.firstDateThisWeek = dateFns.startOfWeek(
329 | new Date(), {weekStartsOn: weekStartsOnAMonday ? 1 : 0}
330 | )
331 | return this.loadWeek(store.firstDateThisWeek)
332 | }
333 |
334 | loadWeek = (firstDate) => { // should maybe be called loadBlankWeekDays
335 | if (!firstDate || typeof firstDate !== 'object') {
336 | throw new Error("Expect 'firstDate' to be a date object")
337 | }
338 | let lastDate = dateFns.addDays(firstDate, 7)
339 | store.extendDateRange(firstDate, lastDate)
340 | let dayNumbers = [0, 1, 2, 3, 4, 5, 6]
341 | dayNumbers.forEach(d => {
342 | let datetime = dateFns.addDays(firstDate, d)
343 | let date = dateFns.format(datetime, DATE_FORMAT)
344 | if (!store.days.has(date)) {
345 | // put a blank one in lieu
346 | // console.log('ADDING', date, datetime);
347 | store.addDay(date, datetime)
348 | } else {
349 | // console.log('SKIPPING', date, datetime);
350 | }
351 | })
352 | this.listenOnDayRefs()
353 | }
354 |
355 | updateDay = (day, data) => {
356 | // don't forget to update the big mutable
357 | day.text = data.text
358 | day.notes = data.notes
359 | day.starred = data.starred
360 |
361 | // update the search cache
362 | if (this._searchCache && this._searchCache[day.date]) {
363 | delete this._searchCache[day.date]
364 | }
365 |
366 | const dayRef = this.database.ref(
367 | 'groups/' + store.settings.defaultGroupId + '/days/' + day.date
368 | )
369 | this.searchIndex.addDoc({
370 | date: day.date,
371 | text: data.text,
372 | notes: data.notes,
373 | })
374 | localStorage.setItem('searchIndex', JSON.stringify(this.searchIndex))
375 | this.searchData[day.date] = {
376 | date: day.date,
377 | datetime: encodeDatetime(day.datetime),
378 | text: data.text,
379 | notes: data.notes,
380 | starred: data.starred,
381 | }
382 | localStorage.setItem('searchData', JSON.stringify(this.searchData))
383 | if (store.currentUser) {
384 | return dayRef.set({
385 | date: day.date, // XXX is this necessary
386 | datetime: encodeDatetime(day.datetime),
387 | text: data.text,
388 | notes: data.notes,
389 | starred: data.starred,
390 | })
391 | } else {
392 | return Promise.resolve(null)
393 | }
394 |
395 | }
396 |
397 | getFavorites = () => {
398 | return this.database.ref(
399 | 'groups/' + store.settings.defaultGroupId + '/days'
400 | )
401 | .orderByChild('starred')
402 | .equalTo(true)
403 | .once('value')
404 | .then(snapshot => {
405 | let results = []
406 | // Strange, snapshot has a .forEach but no .map or .filter
407 | snapshot.forEach(child => {
408 | results.push(child.val())
409 | })
410 | results.sort((a, b) => {
411 | return b.datetime - a.datetime
412 | })
413 | let hashes = new Set()
414 | results = results.filter(result => {
415 | let hash = result.text + result.notes
416 | hash = hash.toLowerCase()
417 | if (!hashes.has(hash)) {
418 | hashes.add(hash)
419 | return true
420 | }
421 | return false
422 | })
423 | return results
424 | })
425 | }
426 |
427 | searcher = (text, searchConfig) => {
428 | if (!text.trim()) {
429 | throw new Error('Empty search')
430 | }
431 | let found = this.searchIndex.search(
432 | text,
433 | searchConfig,
434 | )
435 | console.log('FOUND', found);
436 | if (!found.length) {
437 | return []
438 | }
439 | if (!this._searchCache) {
440 | // If this starts getting too large and bloated,
441 | // consider a LRU cache like
442 | // https://github.com/rsms/js-lru
443 | this._searchCache = {}
444 | }
445 | let refs = {}
446 | let cached = []
447 | found.forEach(f => {
448 | refs[f.ref] = f.score
449 | if (this._searchCache[f.ref]) {
450 | cached.push(this._searchCache[f.ref])
451 | }
452 | })
453 | if (found.length === cached.length) {
454 | // we had all of them cached!
455 | return cached
456 | }
457 | let uniqueTexts = new Set()
458 | let key = 'text'
459 | if (searchConfig.fields.notes) {
460 | key = 'notes'
461 | }
462 | return found.map(result => {
463 | return this.searchData[result.ref]
464 | }).filter(result => {
465 | let hash = result[key].toLowerCase()
466 | if (key === 'notes') {
467 | // This will make "some cookbook page 123" and "some cookbook p.100"
468 | // both into "some cookbook page ?"
469 | hash = pagifyScrubText(hash)
470 | }
471 | if (!uniqueTexts.has(hash)) {
472 | uniqueTexts.add(hash)
473 | return true
474 | }
475 | return false
476 | })
477 | }
478 |
479 | render() {
480 | let page = Loading...
481 |
482 | if (this.state.page === 'settings') {
483 | page = {
485 | this.setState({page: 'days'})
486 | }}
487 | onChangeWeekStart={() => {
488 | // if the user has changed start day of the week, re-load
489 | store.dateRangeStart = null
490 | store.dateRangeEnd = null
491 | this.loadInitialWeek()
492 | }}
493 | onClearCache={() => {
494 | localStorage.removeItem('searchData')
495 | localStorage.removeItem('searchIndex')
496 | window.location.reload(true)
497 | }}
498 | />
499 | } else if (this.state.page === 'search') {
500 | page = {
503 | this.setState({page: 'days'})
504 | // this.loadInitialWeek()
505 | }}
506 | />
507 | } else if (this.state.page === 'starred') {
508 | page = {
511 | this.setState({page: 'days'})
512 | if (!store.days.length) {
513 | this.loadInitialWeek()
514 | }
515 | }}
516 | />
517 | } else if (this.state.page === 'user') {
518 | page = {
521 | this.auth.signOut().then(() => {
522 | // Sign-out successful.
523 | this.setState({page: 'days'}, () => {
524 | store.currentUser = null
525 | if (!store.days.length) {
526 | this.loadInitialWeek()
527 | }
528 | })
529 | }, (error) => {
530 | // An error happened.
531 | console.warn('Unable to sign out');
532 | console.error(error);
533 | })
534 | }}
535 | onClosePage={e => {
536 | this.setState({page: 'days'})
537 | if (!store.days.length) {
538 | this.loadInitialWeek()
539 | }
540 | }}
541 | />
542 | } else if (this.state.page === 'signin') {
543 | page = {
546 | store.currentUser.sendEmailVerification().then(() => {
547 | // XXX flash message?
548 | console.log("Email verification email sent. Check your inbox.");
549 | }, error => {
550 | console.error(error);
551 | })
552 | }}
553 | onClosePage={e => {
554 | // XXX if there is already a group in store.settings
555 | // or something, then no need to redirect to the group page.
556 | this.setState({page: 'group'})
557 | }}
558 | />
559 | } else if (this.state.page === 'group' && store.currentUser) {
560 | page = {
564 | store.days.clear()
565 | this.loadInitialWeek()
566 | this.daysRef.off()
567 | this.listenOnDayRefs()
568 |
569 | this.loadSearchIndex()
570 | }}
571 | onClosePage={e => {
572 | this.setState({page: 'days'})
573 | if (!store.days.length) {
574 | this.loadInitialWeek()
575 | }
576 | }}
577 | />
578 | } else {
579 | if (this.state.page !== 'days' && store.currentUser) {
580 | // throw new Error(`Unsure about page '${page}'`)
581 | console.warn(`Unsure about page '${this.state.page}'`)
582 | }
583 | page = {
588 | this.setState({page: 'signin'})
589 | }}
590 | // firstDateThisWeek={store.firstDateThisWeek}
591 | />
592 | }
593 |
594 | return (
595 |
596 |
{
598 | this.setState({page: 'user'})
599 | }}
600 | onGotoSignIn={() => {
601 | this.setState({page: 'signin'})
602 | }}
603 | onGotoWeek={(resetDateRange = false) => {
604 | this.setState({page: 'days'}, () => {
605 | if (resetDateRange) {
606 | store.dateRangeStart = store.firstDateThisWeek
607 | store.dateRangeEnd = dateFns.addDays(store.firstDateThisWeek, 7)
608 | }
609 | const id = makeDayId(store.firstDateThisWeek)
610 | const element = document.querySelector('#' + id)
611 | setTimeout(() => {
612 | zenscroll.to(element)
613 | }, 100)
614 | })
615 | }}
616 | onGotoSettings={() => {
617 | this.setState({page: 'settings'})
618 | }}
619 | onGotoGroup={() => {
620 | this.setState({page: 'group'})
621 | }}
622 | onGotoStarred={() => {
623 | this.getFavorites().then(results => {
624 | // console.log('FAVORITES RESULT:', results);
625 | store.recentFavorites = results
626 | })
627 | this.setState({page: 'starred'})
628 | }}
629 | onGotoSearch={() => {
630 | this.setState({page: 'search'})
631 | }}
632 | />
633 |
634 |
635 | { page }
636 |
637 |
652 |
Offline!
653 |
654 | Seems you are offline :(
655 |
656 |
657 | {
661 | window.location.reload()
662 | }}
663 | >
664 | Try Reloading
665 |
666 |
667 |