Making the buttons easier to grok

[betatim]

I was pondering is in which direction "upload" and "download" go. Technically I am uploading my notebook from my browser to the binder session (I think) and downloading/storing to my browser. However I have to think about that each time I want to click the button. Somehow the combo of arrows and "which way is it again?" is too tricky for me.

The flyout on each button does clearly describe what the button does. But I still end up hovering over them to see the flyout before clicking them (and then wonder "browser storage, who the heck is that?" when I put my brain into naive user mode).

All this made me wonder if we need three buttons or if two would be enough. As well as what icons could we pick that remove the need to hover. Two buttons:

• "Restore notebook" (does the average user care where we restore from?)
• "Download notebook" (visible? You mean there are invisible notebooks as well?)

When would a user explicitly press "store to browser"?

[betatim]

Ah, I think I just realised when you'd press that button: when you want to store it ... I somehow had gotten the impression that each time the notebook is saved it is also saved to IndexedDB.

[manics]

The icons are limited to those in font-awesome 4.something. 5.* has some extra ones that might be more suitable, but I think that would require bumping the icons in the notebook package.

[betatim]

What do you think of using a word instead of an icon? So like the "Binder" and "Repo" buttons where it just says the word. Or maybe icon + word?

The one to get the notebook after the binder expired could be "Download". I think there is no harm in using this button always instead of via the menu so we can use the super generic term.

The button to restore from the browser state could be "Restore".

I think replacing the button to store the notebook with a periodic task (every 30s or so) that saves the current state to IndexedDB would be nice. My hunch would be that people will only remember to press the "save state" button when they try and restore the notebook (aka when it is too late).

Both with a longer explanation in the flyout/label/hover thing.

[manics]

See #21 and in particular the notebook issue (bug?) with button labels vs tooltip help text.
The list of available icons is at https://fontawesome.com/v4.7.0/icons/ if you've got other suggestions.

I'd prefer not to automatically do anything at the moment until we're more confident about how IndexedDB behaves across browsers. E.g. it may require additional permissions. We also don't want to immediately autosave and overwrite the current stored copy when a user reloads the repo so it'll require UI work and is best left for later. I've added #23