osteele/banyan

Visualize Dropbox file and folder sizes

banyan's Issues

Switch to native Elm visualizer

The app currently uses Highcharts. Find or create an Elm implementation.

Related to #15.

Better UI

Oliver has no graphic design skillz. The UI reflects this.

Some ideas:

• Remove the invert from the menubar. (Or make it go all the way across, a la github.)
• Progress bar should be lower contrast once it's complete.
• Make the GB / MB units lower contrast.
• The breadcrumbs are shown twice. Remove the second instance. Make the first one smaller.
• Make the level / sort buttons smaller. This will help on mobile too.
• Remove the “Sign In” / “Sign Out” icons?
• Or, add a Sync icon. But then we might want to spin it while it's syncing.
• Pick a color scheme.
• Use (low-contrast) folder and file icons? This could be helpful with different icons for different file types.
• Use background color or lines to separate the panels
• Add a footer with more information? (The Github link could go here.)

Display the name of the signed-in user

Cancel listFolder requests, or ignore results, after signing out

Once the user has signed out:

1. The app should ignore any listFolder responses, from requests that may have already gone out.
2. The app shouldn't make any more listFolder API requests from within the listFiles loop.

The first is a security issue.

Add a “remember me” option

The app currently stores the access token in localStorage, so the user is still signed in the next time they visit the page, until they explicitly sign out. Make this an option.

Switch to native Elm Dropbox.listFolder

listFolder is implemented in JavaScript and invoked via an Elm port. Port this to JavaScript, or adopt avh4/elm-dropbox#2.

Display more accurate progress information

The progress bar currently displays r/(r+1), once r responses have been received. This is at least monotonically increasing.

Ideally, it would display r/n, where n is the total number of responses. But we can't know n in advance.

Alternatively, d/(currentTime-firstRequestTime) could be a better estimate, where d = maxTime(currentRequest), firstRequestTime = maxTime(firstRequest), and maxTime(request) = max(data.clientModified, data.serverModified for data in currentRequest.items).

Fix flash-of-start-instruction-text on initial sign-in

Use “Sign in” to sign into Dropbox. SSO redirects back to the app. For a moment, the initial instructions are shown, before the view notices that you'v signed in. Stop that.

Export CSV of files and sizes

Allow user to switch between personal and team accounts without signing out

Or at least maintain the cache, so switching isn't so slow — but the only secure way I can think of to maintain the cache is to allow the user to by signed into both accounts at once.

Follow Dropbox changes

Invoke the Dropbox listFolder API with include_deleted: true. Use listFolder/continue with a cursor in order to update the model: when the user pushes a “sync” button; when the page is reloaded; and/or, by polling.

The listFolder API is much slower when include_deleted: true is specified. (It requires a much larger number of requests, that seem to be throttled.) If we do this, we probably want to initiate both a recursive and a non-recursive sequence of listFolder requests, so that we can show the full results from the include_deleted: false sequence early, and switch to the include_deleted: true results once they're complete.

Cache the state between page loads

Cache the Dropbox file entries so that re-visiting the page is fast.

index.js contains code for this, that used to work and has been disabled pending investigation of #2 as a possibly better solution.

Add an application icon

The Dropbox application page is configured with an image, that's displayed during OAuth. Add that to the app's navigation menu, and as a favicon.

Show more than one level in the treemap

The file tree shows up to three levels, but the treemap is pinned to one. This is because add a second level sometimes causes the treemap to crash. Fixing this may depend on #2.

Switch from Treemap to Sunburst diagram

A sunburst diagram would be more appropriate than a treemap.

Here's some nice ones in D3:

• https://bl.ocks.org/kerryrodden/766f8f6d31f645c39f488a0befa1e3c8
• https://bl.ocks.org/mbostock/4348373

Related to #2.