Add sort to dataset list

[knutole]

Moved here from https://github.com/systemapic/wu/issues/259

• [ ] sort: make dataset list sortable (with quick buttons - name, modified, size)
• [ ] filter: create "quick-search" box ( with filter, showing only matches in list)
• [ ] put boxes over first dataset-line

see also #255

[knutole]

@IgorZiegler :)

[jorgenevil]

This should be fairly simple, as the list is written in D3. All you have to do is updating the array of files, and run the list again.

I also think the sorting features should only appear if you have more than 10 files in your library.

[jorgenevil]

One thing that I also would have liked to see in the sort feature, is the ability to view files that's been added as layers in current project. I don't know if this is a big task, but I think it would be nice :)

[jorgenevil]

Here is a design suggestion of how sort and search can be mixed together to avoid cluttering.

[knutole]

I say, go for it! :) Looks great!

Btw, I think it should always be there! It looks unintrusive:)

[IgorZiegler]

@knutole @jorgenevil How will looks sort input when it expanded?

[IgorZiegler]

@knutole @jorgenevil looks cool. I begin do it without this design =(

[jorgenevil]

I'll design it!

[jorgenevil]

Something like this:

[jorgenevil]

Our data library have the option to have more than one file provider, even thought we only have one now, which is called postgis. This is for other kinds of file types in the future.

In chrome.data.js, you can see how we populate this.fileProviders.postgis here: https://github.com/systemapic/systemapic.js/blob/master/js/src/chrome/data/chrome.data.js#L379

Files gets populated with data here, which puts data into an array (this.fileProviders['postgis'].data): https://github.com/systemapic/systemapic.js/blob/master/js/src/chrome/data/chrome.data.js#L408

If you have a sorted array of data, you can store it on this.fileProviders['postgis'].data, and run this:

var D3container = this.fileListContainers['postgis'].D3container;
var data = this.fileProviders['postgis'].data;
this.initFileList(D3container, data, 'postgis');

To clear sorting, and get the original files back, you can do this by running this._refreshFiles()

[knutole]

fixed. great job @IgorZiegler ! :+1: