robertrouse / theographic-web Goto Github PK

• Decide on ranking and grouping of auto-complete
• Best way to differentiate people/places and shared names
• Data methods to retrieve search index and serve results
• What do results look like: another page or just auto-complete? Should the search box be on every page, and how should it appear? (idea: add a drop-down triangle below titles listing page history and search box)

Small, one-line thing with dots for single years or lines for events of some duration. Example below.

Consider Semiotic library, a React implementation of D3. https://github.com/emeeks/Semiotic

Finding a book/chapter/verse in as few clicks as possible
Consider scroll methods similar to Google Photos (below) where a timeline, alphabetical list , or book list defines the scrollbar. This works well on mobile in my experience.

Current flow is left-to-right, then top-to-bottom. It should flow down a column top-to-bottom, then restart at the next column. This may be possible with CSS grid.

Most verses will be embedded in events lists. Remaining verses listed need a cleaner layout with the book name in a left column and chapter/verse links indented in another column.

• Replaces "Related" People/Places and Verses sections with a timeline referencing people, places, verses in each event.
• Verses not related to events go at the bottom. These would be places where a person is mentioned in the verse but was not a participant in the event (e.g. Stephen mentions Moses in a speech...Moses isn't a part of the even but needs a verse ref).

Some fields are null and should be hidden. Current method is a function for each field. Simpler alternatives may be:

• single if/then function that passes in a field name and renders appropriately
• condensed logic as in: {data.detailMap && (<Img fluid={data.detailMap.childImageSharp.fluid} className="map"/>)}

Static pages have the Bible dictionary text but it disappears after the script loads.

Send to stub pages (#7) if "wip" or other pages if "publish."

Edit options from gatsby starter demo content, make it relevant to Theographic.

Large text for Regions & water. Special icons with text label for city, landmark, mountain. See "custom marker" section here: https://www.mapbox.com/api-documentation/#retrieve-a-static-map-from-a-style

Make sure it has a method to provide feedback. It's nice if this page has something clever, too.

When you run gatsby build, the images in src/images/ don't move to public/images. I think we can fix this by referring to the images in the gatsby-filesystem source instead of using the file path.

Depends on #39. Includes People, Places, Events, Books, Chapters, Verses. Word-level linkages will come from logical operations or another data source.

• Edit Layout.js to handle headers (<Helmet> stuff), overall layout wrappers (container class, padding, centering, etc)
• Wrap pages in resulting <Layout> component
• Add meta tags for page titles, og: tags, image preview, keywords, other SEO info.
• Include Google analytics tracking code

Used for URLs. Lookup fields currently have special characters and spaces, which isn't good in code or URLs. Remove spaces from lookups, make all lowercase, etc.

Replace spaces with underscores, keep casing consistent everywhere (go with camelCase)

See "group" section of this reference: https://www.gatsbyjs.org/docs/graphql-reference/

Breadcrumbs on detail pages? Where's the menu, what does it look like?

should resolve by removing spaces in key fields, then regenerate map images.

• Webflow left some unused CSS classes and assigned ".header" in places that should be a <h1> tag, for example. Reduce styles to only those needed, generally simplify.
• Consider switching to styled components and follow practices here: https://www.gatsbyjs.org/tutorial/part-two/

Larger text, reconsider background style and colors for best contrast and identification of central marker.

Group by events? What visuals would help the most, and where should they be placed? Possibilities include network diagrams, gantt charts, etc.

Dependent on several data management tasks.

How to we jump around long lists: scrollbar, alphabetical links, filtering scheme?

Removing HTML tags rom Easton's (#4) will be a stop-gap. We need to rewrite these to better fit the layout and link to related content within the paragraphs.

Using gatsby-image allows for optimal, progressive loading of higher resolution assets. They should be part of the database instead of the file system. Or, store them in a filestore and reference it in the database to manage references.

• For all places, insert place type at the top
• For regions and water, exclude detail map
• Below maps, add lat/long info, "precision", and link to source (recogito URI or OpenBible url)

Define fields, nodes, and edges in Neo4j for migration from Airtable.

After #47 is complete, code React components to handle searching.