Limited size of output cells and provide scroll bars for such output cells

[cschin]

It will be desirable to have the output cell to have a finite height and width regardless the output in the HTML notebook. This will make scroll the code easier when we have to look at long or wide output. One possibility is to have a way to control the max-height (a configurable options?) of an output cell. When the output is shorter than the max-height, we can output the results as is. When the output is long (or wider than the browser window), the output cell can have it own scroll bars for navigating the output but the size of the whole output box is still limited. This way, we can browser the long (or wide) output but keeping the code (within the input cells) closer.

[minrk]

Were you at @ctb's presentation yesterday? Because I made a hackish implementation of exactly this for him in my ctb branch. We will definitely figure out a real version of this, probably implemented as a third state in [expand | collapse | summary].

[fperez]

I'm very curious about @ctb's feedback here: watching his demo, I liked @minrk's "hack" a lot more than I thought I would. Having the explicit scroll bars everywhere without needing to manually toggle anything felt very natural. Titus, do you think you like Min's implementation for permanent use UI-wise, or do you think a manual state toggle would work better?

[ctb]

On Wed, Apr 04, 2012 at 01:14:00PM -0700, Fernando Perez wrote:

I'm very curious about @ctb's feedback here: watching his demo, I liked @minrk's "hack" a lot more than I thought I would. Having the explicit scroll bars everywhere without needing to manually toggle anything felt very natural. Titus, do you think you like Min's implementation for permanent use UI-wise, or do you think a manual state toggle would work better?

It works OK, but needs some fine tuning. I think a manual state toggle would
be annoying.

--titus

[fperez]

ok, thanks for the info. We'll certainly refine it, let us know what you think are the key witnesses user-experience-wise right now. Once we agree on that, we can sort out internal implementation details.

[cschin]

I think it will be great that we can use the "max-height" CSS property. Namely, by default, if the output is less then some per-specified height, it outputs as usual. If it is more than then "max-height", we use the scroll bar. The output cell will never be more than the max-height. I tried to modify some the CSS to test it out, but I can not get it working properly on Firefox but the max-height behavior is correct in Safari. I think it is a bug in Firefox CSS implementation. One way to workaround that is to use something like @minrk's patch, using javascript to manipulate the height CSS property directly.

[hmeine]

I just tested this in Safari on Lion. First of all, it works mostly, i.e. the output is limited to 27 rows of print-output and I can scroll up and down using my MBP touchpad.

What’s not so nice is that there is no indicator of the existence of elided output at all, since Lion only displays the scrollbar during active scrolling (actually, even then only the moving part of it). IMO that should be addressed before the merge.