StatView: Make it nicer

[mkoskim]

Just generally tweak statistics display nicer. Sources:

https://github.com/mkoskim/mawejs/tree/master/src/gui/stats

Freeform issue: This is pretty independent work. It does not involve messing with document data structures themselves, the only input data is a list of dates and their word counts. This mainly involves just plain GUI work with React, Material UI (via factory.js) and Recharts.

So, if you feel, that you like to express yourself as a UI designer and use your artistic impressions, with freeformed assignment leaving lots of room for personal insights, then this issue might be just for you :) You don't need to know everything, no need to do everything, I can help with most issues - e.g. creating test data and such - or tailor an issue for you.

Incoming data: The data that comes in is following:

words = {
  date, // Date in YYYY-MM-DD format, easy to parse with standard Date class
  text, // Number of actual text words in the end of that day (last save)
  missing, // Number of missing words (fillers, incomplete text)
  chars // Number of characters
}

The data is processed so, that today's entry is already the actual situation from the document loaded to editor.

We might want to generate some history data for testing & development purposes. Small data, large data, different data. We could save those .mawe files to examples for later use.

Some thoughts: No need to make all at once, but here are some thoughts:

Add a side panel listing the history entries. Maybe show the delta between the entry and its predecessor, maybe show words, maybe words and missing.

Maybe a calendar view showing when you have worked with the story? Something like GitHub has?

Tweak the bar chart itself. When there are few entries - like two - the bars are thick as hell. They could be bit nicer, maybe by "padding" the history data suitable for viewing. For example, we could ensure like 20 entries or so, and fill enough empty entries.

For really large data, we might want to compress it somehow. Maybe, or maybe not.

At some point we might want to give the user an option to disable history entries. Not sure if anyone really wants that. Maybe, maybe not.

Notes:

For many considered features, you can consult either Arc View (arc/arc.js) or Export View (export/export.js). See:

https://github.com/mkoskim/mawejs/tree/master/src/gui/arc
https://github.com/mkoskim/mawejs/tree/master/src/gui/export

If you like to take this issue, we can split it to smaller pieces. There is no urgent need, and no need to make all at once.

[mkoskim]

Here are few examples, how the chart view looks now:

Three entries:

Few more entries, these are actual entries from a story:

Many generated entries, these are not actual, I just copy-pasted few artificially made entries to create longer data set: