"e is undefined" error when using display:none on an embedded player about document-viewer HOT 5 CLOSED

I too am seeing this issue. I dug in further to the trace that @cadecairos started.

This error occurs when the checkTimer calls drawPages while the viewer is hidden. When that happens, the value of _sortedIndex(c, i) is zero, which causes the call to this.helpers.sortPages to have an argument of -1, which returns undefined as none of the if clauses offer a return for a negative value. This then causes the drawPageAt function to error when it tries to use the value from the result of this.helpers.sortPages(-1), and then various images in the viewer fail to appear at all.

Important to note here is that it isn't the act of hiding and showing that is causing the issue, but having the element hidden during the time at which the drawPages method is called. If you hide and then show the viewer very quickly, you won't notice this error, as the timeout for the checkTimer is 100ms, so it is likely you can hide and show before it runs the code that causes the error.

As a side note, is there an un-minified version of viewer.js available somewhere?

from document-viewer.

viewer.js is just a concatenation of the other JS files; see config/assets.yml.

from document-viewer.

@croby, did you ever come up with a good workaround? I tried adding logic in the drawPages function to not try rendering the pages if the viewer is hidden. It still raises javascript exceptions, but keeps the viewer from breaking. It's messy but simple. A better but trickier solution might be to change the code and add a "Hidden" state for the viewer that plays nice with all the state & event observers.

My change to docViewer/DV/events/events.js, at line 16:

...
  // Draw (or redraw) the visible pages on the screen.
  drawPages: function() {
    if (this.viewer.state != 'ViewDocument') return;
    if (!$(this.viewer.options.container).is(':visible')) return; // Hack by MattJones
    var doc           = this.models.document;
...

from document-viewer.

The viewer is a bit hack-ful. I'd be happy to incorporate that in.

I'm currently in the midst of a viewer refactor that will make screwing with the viewer a lot simpler (you can check it on the refactor branch).

from document-viewer.

Good to know you're still supporting docViewer. I've had more luck with checking for errors deeper in the function, to avoid errors when the viewer is loading. It still has a bad code-smell, but it works a little better as a quick fix than what I posted above. I haven't tried this out with any other views (thumbnails, annotation, etc).

...
  // Draw (or redraw) the visible pages on the screen.
  drawPages: function() {
    if (this.viewer.state != 'ViewDocument') return;
    var doc           = this.models.document;
    var win           = this.elements.window[0];
    var offsets       = doc.baseHeightsPortionOffsets;
    var scrollPos     = this.viewer.scrollPosition = win.scrollTop;
    var midpoint      = scrollPos + (this.viewer.$(win).height() / 3);
    var currentPage   = _.sortedIndex(offsets, scrollPos);
    var middlePage    = _.sortedIndex(offsets, midpoint);
    if( middlePage <= 0) return; // Don't draw pages if the viewer is hidden // Hack by MattJones
    if (offsets[currentPage] == scrollPos) currentPage++ && middlePage++;
    var pageIds       = this.helpers.sortPages(middlePage - 1);
    var total         = doc.totalPages;
    if (doc.currentPage() != currentPage) doc.setPageIndex(currentPage - 1);
    this.drawPageAt(pageIds, middlePage - 1);
  },
...

from document-viewer.