Tabular metadata file upload form is not displayed correctly

[hackdna]

The form should not appear before a file is selected. Running commit 6eec78c.

[hackdna]

Fixed as of 4c7f34b. However, the file is not displayed in the table after it is selected the following error message is logged in the browser console:

TypeError: f.options.columnDefs.forEach is not a function
    at p.buildColumns (ui-grid.min.js:7)
    at m (ui-grid.min.js:7)
    at Object.fn (angular.js:15775)
    at r.$digest (angular.js:15843)
    at r.$apply (angular.js:16125)
    at FileReader.c.onload (metadata-table-import.js:72)

[hackdna]

One more issue: initial column width used to be set automatically according to the column header length to make them more readable. Now all the columns are equally narrow and headers are unreadable unless manually resized. The code that performs the calculation is here.

[jkmarx]

Since we've reopened this issue, in Firefox only:

[hackdna]

Thanks for bringing this up. It looks like styling is missing from buttons and drop-downs in Firefox too.

[jkmarx]

From the bootstrap components website http://getbootstrap.com/components/ :
Textual inputs only

Avoid using select elements here as they cannot be fully styled in WebKit browsers.

Avoid using textarea elements here as their rows attribute will not be respected in some cases.

[jkmarx]

@hackdna This is the default bootstrap3 styling. Chrome has it's own styling which is being applied.

[jkmarx]

@flekschas @hackdna @ngehlenborg I fixed the column situation. If you agree, I'd like to close this issue and write a separate issue for tackling uniform styling between browsers and updating styling to the new style guide http://uspto.github.io/designpatterns/1.x/docs/patterns/fileUpload.html

[jkmarx]

Ref Commit 2081b4b
Ref Commit 8db5476

[ngehlenborg]

I agree with that plan.

[hackdna]

Looks good.