nglviewer / ngl

WebGL protein viewer
http://nglviewer.org/ngl/
MIT License
667 stars 170 forks source link

How to catch error in stage.loadfile? #425

Closed martingraham closed 6 years ago

martingraham commented 6 years ago

Using our app which includes NGL, we let users type in pdb codes and sometimes these are just plain wrong / don't exist - on these occasions we get errors in the console like below, as NetworkStreamer throws an error:

ngl_verbose.js:50028 GET http://mmtf.rcsb.org/v1.0/full/xyz1 404 (Not Found)
_read @ ngl_verbose.js:50028
(anonymous) @ ngl_verbose.js:49686
read @ ngl_verbose.js:49684
parse @ ngl_verbose.js:88301
load @ ngl_verbose.js:50129
autoLoad @ ngl_verbose.js:50360
loadFile @ ngl_verbose.js:76325
etc

With this being asynchronous I can't wrap the .loadfile in a try/catch to get the error, and the promise catch clause isn't reached and .then isn't either

var promise = stage.loadFile (uri, params)
           .catch (function (reason) {
                console.log ("FAILED", reason);
            })
            .then (function (structureComp) {
                console.log ("whoooo");

So how do I get some sort of indication back from loadfile that things have failed?

arose commented 6 years ago

Right, the errors were not re-thrown, now they are https://github.com/arose/ngl/commit/4ececc67c57dea8a6d44297afad219da3fb35386. Can you try the ts2 branch?

martingraham commented 6 years ago

Thanks Alex, I'll give it a go tomorrow (uk time)

martingraham commented 6 years ago

Thanks, using the ts2 branch I can catch file errors now, thanks, but 2 caveats (I guess since it's labelled as 2.0.0 a fair bit is changing from the version I was using)

  1. I needed to change one of the lines in package.json so it worked on windows, the mkdir command looked like it was expecting the mac version:

    "ts": "tsc && cp src/shader/.vert src/shader/.frag build/js/src/shader/ && mkdir \"build/js/src/shader/chunk\" && cp src/shader/chunk/*.glsl build/js/src/shader/chunk/ && cp package.json build/js/",

I suppose a pure npm solution using one of the various makedir modules could be attempted

  1. The second is probably more serious for me since I haven't solved it. Basically all my DistanceRepresentations I use for crosslinks have turned into stripes, and the browser is toiling overtime to calculate them (50s and 2GB peak memory for quite a small protein and ~150 links) - it looks like every DistanceRepresentation is being segmented into tiny sub-objects - getFixedLengthDataDash and Float32Array are showing up in my profile as using this 50s hit.

Is there a way to just use the old cylinder-style representations to represent my cross-links or tell the dashing to turn off for the distance reps?

arose commented 6 years ago

1) should be fixed by 7560902f398c61c0f0be06b86a3dd3000772857a, please try

2) Added a parameter useCylinder to the distance representation (0036603667bff81e6d465274ca3eff1137f3254d), please try. Could you please make an example with a number of links on codepen? I would like to include it in the example scripts.

martingraham commented 6 years ago
  1. Had to switch to using 'copyfiles' as 'copy' kept chucking npm errors on my windows machine, but it was a straight swap - changed copy to copyfiles in the ts task.

  2. Superb! That worked straight off. I'll look at adding a codepen, just need to make it so I'm not adding all my code as well, just set up a protein with some preset links

Thanks a lot, Martin

arose commented 6 years ago
  1. switched to the copyfiles package (see 565a5688559ca66cd43c388f5eb551a50c492f0d), hope it works out of the box for you now
martingraham commented 6 years ago

Alex, have a look at this, see what you think --> https://codepen.io/martingraham/pen/RjqXmQ

arose commented 6 years ago

This is great! Do you want to make a PR? I.e. put it into examples/scripts/interactive/crosslink.js. Otherwise I can copy your code myself.