harvard-lil / h2o

H2O is a web app for creating and reading open educational resources, primarily in the legal field
https://opencasebook.org
GNU Affero General Public License v3.0
36 stars 30 forks source link

Add basic version of "reader mode" for viewing casebooks in longer form #1842

Closed lizadaly closed 1 year ago

lizadaly commented 1 year ago

First steps in making a usable "reader mode" for students or people just looking to read a casebook end-to-end, or print it.

This is now the default mode for the "printable HTML" view—the two column print layout is now triggered with an explicit "Print preview" button. This view is still only available to staff users.

Some of this is a little janky and is starting to push at the edges of not using Vue for the client-side controls. When the functionality gets nailed down more I can look at whether it makes sense to put this under Vue's control. Alternatively I could just polish the rendering steps up so there's fewer repainting/layout changes.

When you click "HTML preview" now you get this view:

image

The footer lets you toggle among the different modes, or page through the casebook.

Notes and highlights are rendered somewhere between the default edit view, and the print-preview view. The note target here is dotted-underlined; we can look at other kinds of indicators that are less likely to be confused with hyperlinks.

Clicking "Print Preview" takes you to the two-up view:

image

Note that the annotation is now a footnote. Same markup though!

part of #1841

codecov-commenter commented 1 year ago

Codecov Report

Merging #1842 (72f0aab) into develop (d78fab8) will decrease coverage by 0.09%. The diff coverage is 38.88%.

@@             Coverage Diff             @@
##           develop    #1842      +/-   ##
===========================================
- Coverage    76.96%   76.87%   -0.10%     
===========================================
  Files           50       50              
  Lines         6565     6582      +17     
===========================================
+ Hits          5053     5060       +7     
- Misses        1512     1522      +10     
Impacted Files Coverage Δ
web/main/test/functional/test_functional.py 56.81% <35.29%> (-5.69%) :arrow_down:
web/main/views.py 71.98% <100.00%> (+0.11%) :arrow_up:

Help us with your feedback. Take ten seconds to tell us how you rate us. Have a feature suggestion? Share it here.