search

PreTeXtBook / pretext

PreTeXt: an authoring and publishing system for scholarly documents
https://pretextbook.org
Other
254 stars 203 forks source link

Worksheets: button to print page #1948

Closed Alex-Jordan closed 1 year ago

Alex-Jordan commented 1 year ago

This adds a button to print the HTML page. Demonstrated here.

Only available on standalone worksheet pages, but could easily be extended.

The styling is uncommitted to navbar_default.css. Not sure if I should be messing with that file, so I'll await input from @davidfarmer. As well as input on the particular styling I went with (just copying the Calc button).

davidfarmer commented 1 year ago

The print button has an unknown character it in, when I see the page. (I assume it is a little printer emoji.)

But do we really need a print button, when the reader can just do control-p ?

On Wed, 8 Mar 2023, Alex Jordan wrote:

This adds a button to print the HTML page. Demonstrated here.

Only available on standalone worksheet pages, but could easily be extended.

The styling is uncommitted to navbar_default.css. Not sure if I should be messing with that file, so I'll await input from @davidfarmer. As well as input on the particular styling I went with (just copying the Calc button).

You can view, comment on, or merge this pull request online at:

  https://github.com/PreTeXtBook/pretext/pull/1948

Commit Summary

  • d59de59 Worksheets: button to print page

    File Changes

(16 files)

  • M xsl/localizations/af-ZA.xml (1)

  • M xsl/localizations/bg-BG.xml (1)

  • M xsl/localizations/ca-ES.xml (1)

  • M xsl/localizations/cs-CZ.xml (1)

  • M xsl/localizations/de-DE.xml (1)

  • M xsl/localizations/en-US.xml (2)

  • M xsl/localizations/es-ES.xml (1)

  • M xsl/localizations/fi-FI.xml (1)

  • M xsl/localizations/fr-CA.xml (1)

  • M xsl/localizations/fr-FR.xml (1)

  • M xsl/localizations/hu-HU.xml (1)

  • M xsl/localizations/it-IT.xml (1)

  • M xsl/localizations/nl-NL.xml (2)

  • M xsl/localizations/pt-BR.xml (1)

  • M xsl/localizations/pt-PT.xml (1)

  • M xsl/pretext-html.xsl (15)

    Patch Links:

  • https://github.com/PreTeXtBook/pretext/pull/1948.patch

  • https://github.com/PreTeXtBook/pretext/pull/1948.diff

— Reply to this email directly, view it on GitHub, or unsubscribe. You are receiving this because you were mentioned.[AABTULGHE2TTYWDWTLELKUTW3F5FLA5CNFSM6AAAAAAVUWBY7OWGG33NNVSW45C7OR4XAZNFJFZXG5LFVJRW63LNMVXHIX3JMTHGAWUC3Q.gif] Message ID: @.***>

Alex-Jordan commented 1 year ago

The reader can do that if they know about that. Or if they know about printing from a browser's menu. But I doubt most users think about a web browser as capable of printing.

And even when they do, if they are like me, they assume it would print the whole page including navigation and were surprised to learn otherwise. So might not even try.

A button says to the user that the web page designer intends for you to be able to print this worksheet and therefore set it up to print only the worksheet.

On Thu, Mar 9, 2023, 4:14 AM David W. Farmer @.***> wrote:

The print button has an unknown character it in, when I see the page. (I assume it is a little printer emoji.)

But do we really need a print button, when the reader can just do control-p ?

On Wed, 8 Mar 2023, Alex Jordan wrote:

This adds a button to print the HTML page. Demonstrated here.

Only available on standalone worksheet pages, but could easily be extended.

The styling is uncommitted to navbar_default.css. Not sure if I should be messing with that file, so I'll await input from @davidfarmer. As well as input on the particular styling I went with (just copying the Calc button).

You can view, comment on, or merge this pull request online at:

https://github.com/PreTeXtBook/pretext/pull/1948 https://protect2.fireeye.com/v1/url?k=31323334-501d2dca-3132feb7-454455534531-856e4d183125fa31&q=1&e=1547ecff-ec89-4aec-8c53-01a6bb80e45d&u=https%3A%2F%2Fgithub.com%2FPreTeXtBook%2Fpretext%2Fpull%2F1948

Commit Summary

  • d59de59 Worksheets: button to print page

File Changes

(16 files)

  • M xsl/localizations/af-ZA.xml (1)
  • M xsl/localizations/bg-BG.xml (1)
  • M xsl/localizations/ca-ES.xml (1)
  • M xsl/localizations/cs-CZ.xml (1)
  • M xsl/localizations/de-DE.xml (1)
  • M xsl/localizations/en-US.xml (2)
  • M xsl/localizations/es-ES.xml (1)
  • M xsl/localizations/fi-FI.xml (1)
  • M xsl/localizations/fr-CA.xml (1)
  • M xsl/localizations/fr-FR.xml (1)
  • M xsl/localizations/hu-HU.xml (1)
  • M xsl/localizations/it-IT.xml (1)
  • M xsl/localizations/nl-NL.xml (2)
  • M xsl/localizations/pt-BR.xml (1)
  • M xsl/localizations/pt-PT.xml (1)
  • M xsl/pretext-html.xsl (15)

Patch Links:

— Reply to this email directly, view it on GitHub, or unsubscribe. You are receiving this because you were

mentioned.[AABTULGHE2TTYWDWTLELKUTW3F5FLA5CNFSM6AAAAAAVUWBY7OWGG33NNVSW45C7OR4XAZNFJFZXG5LFVJRW63LNMVXHIX3JMTHGAWUC3Q.gif] Message ID: @.***>

— Reply to this email directly, view it on GitHub https://protect2.fireeye.com/v1/url?k=31323334-501d2dca-3132feb7-454455534531-3f43ad702d009c88&q=1&e=1547ecff-ec89-4aec-8c53-01a6bb80e45d&u=https%3A%2F%2Fgithub.com%2FPreTeXtBook%2Fpretext%2Fpull%2F1948%23issuecomment-1461929757, or unsubscribe https://protect2.fireeye.com/v1/url?k=31323334-501d2dca-3132feb7-454455534531-8c98e0f924c52cf9&q=1&e=1547ecff-ec89-4aec-8c53-01a6bb80e45d&u=https%3A%2F%2Fgithub.com%2Fnotifications%2Funsubscribe-auth%2FABEDOAECW6O5GH2TM7T7QJ3W3HCSFANCNFSM6AAAAAAVUWBY7M . You are receiving this because you authored the thread.Message ID: @.***>

Alex-Jordan commented 1 year ago

I will change the Unicode character to a word. I also need to change something else because the tab order on the button is wrong.

On Thu, Mar 9, 2023, 7:05 AM Alex Jordan @.***> wrote:

The reader can do that if they know about that. Or if they know about printing from a browser's menu. But I doubt most users think about a web browser as capable of printing.

And even when they do, if they are like me, they assume it would print the whole page including navigation and were surprised to learn otherwise. So might not even try.

A button says to the user that the web page designer intends for you to be able to print this worksheet and therefore set it up to print only the worksheet.

On Thu, Mar 9, 2023, 4:14 AM David W. Farmer @.***> wrote:

The print button has an unknown character it in, when I see the page. (I assume it is a little printer emoji.)

But do we really need a print button, when the reader can just do control-p ?

On Wed, 8 Mar 2023, Alex Jordan wrote:

This adds a button to print the HTML page. Demonstrated here.

Only available on standalone worksheet pages, but could easily be extended.

The styling is uncommitted to navbar_default.css. Not sure if I should be messing with that file, so I'll await input from @davidfarmer. As well as input on the particular styling I went with (just copying the Calc button).

You can view, comment on, or merge this pull request online at:

https://github.com/PreTeXtBook/pretext/pull/1948 https://protect2.fireeye.com/v1/url?k=31323334-501d2dca-3132feb7-454455534531-856e4d183125fa31&q=1&e=1547ecff-ec89-4aec-8c53-01a6bb80e45d&u=https%3A%2F%2Fgithub.com%2FPreTeXtBook%2Fpretext%2Fpull%2F1948

Commit Summary

  • d59de59 Worksheets: button to print page

File Changes

(16 files)

  • M xsl/localizations/af-ZA.xml (1)
  • M xsl/localizations/bg-BG.xml (1)
  • M xsl/localizations/ca-ES.xml (1)
  • M xsl/localizations/cs-CZ.xml (1)
  • M xsl/localizations/de-DE.xml (1)
  • M xsl/localizations/en-US.xml (2)
  • M xsl/localizations/es-ES.xml (1)
  • M xsl/localizations/fi-FI.xml (1)
  • M xsl/localizations/fr-CA.xml (1)
  • M xsl/localizations/fr-FR.xml (1)
  • M xsl/localizations/hu-HU.xml (1)
  • M xsl/localizations/it-IT.xml (1)
  • M xsl/localizations/nl-NL.xml (2)
  • M xsl/localizations/pt-BR.xml (1)
  • M xsl/localizations/pt-PT.xml (1)
  • M xsl/pretext-html.xsl (15)

Patch Links:

— Reply to this email directly, view it on GitHub, or unsubscribe. You are receiving this because you were

mentioned.[AABTULGHE2TTYWDWTLELKUTW3F5FLA5CNFSM6AAAAAAVUWBY7OWGG33NNVSW45C7OR4XAZNFJFZXG5LFVJRW63LNMVXHIX3JMTHGAWUC3Q.gif] Message ID: @.***>

— Reply to this email directly, view it on GitHub https://protect2.fireeye.com/v1/url?k=31323334-501d2dca-3132feb7-454455534531-3f43ad702d009c88&q=1&e=1547ecff-ec89-4aec-8c53-01a6bb80e45d&u=https%3A%2F%2Fgithub.com%2FPreTeXtBook%2Fpretext%2Fpull%2F1948%23issuecomment-1461929757, or unsubscribe https://protect2.fireeye.com/v1/url?k=31323334-501d2dca-3132feb7-454455534531-8c98e0f924c52cf9&q=1&e=1547ecff-ec89-4aec-8c53-01a6bb80e45d&u=https%3A%2F%2Fgithub.com%2Fnotifications%2Funsubscribe-auth%2FABEDOAECW6O5GH2TM7T7QJ3W3HCSFANCNFSM6AAAAAAVUWBY7M . You are receiving this because you authored the thread.Message ID: @.***>

kcrisman commented 1 year ago

The reader can do that if they know about that. Or if they know about printing from a browser's menu. But I doubt most users think about a web browser as capable of printing.

Agreed.

Message ID: @.***>

davidfarmer commented 1 year ago

I recall a similar argument(?) in another setting for the issue of whether a link should open a new browser window.

Someone argued against that, with "You are forcing me to open a new window. If I want to do that, I'll just right-click."

Someone else had an eloquent argument against that logic: "What is right-click?"

I'll leave you to speculate which side I was on and which side won the argument.

Such examples disprove the claim that kids these days understand technology.

Alex-Jordan commented 1 year ago

I hope I am not infusing my own user experience too much and projecting it onto students. But using links and navigating to new pages is essential to what a web browser is for in the first place. Printing things off is not what a web browser is for, and off radar.

In a meeting I showed a worksheet for ORCCA to colleagues. The first comment/question was "This is fine but what if I wanted to hand out copies in class?" They immediately (mis)understood the page to be a portal for students to type things into the big colored workspace fields.

davidfarmer commented 1 year ago

I am okay with the print button on the individual worksheet pages and I will work on the page fitting so that the 80% trick is not needed.

On Thu, 9 Mar 2023, Alex Jordan wrote:

I hope I am not infusing my own user experience too much and projecting it onto students. But using links and navigating to new pages is essential to what a web browser is for in the first place. Printing things off is not what a web browser is for, and off radar.

In a meeting I showed a worksheet for ORCCA to colleagues. The first comment/question was "This is fine but what if I wanted to hand out copies in class?" They immediately (mis)understood the page to be a portal for students to type things into the big colored workspace fields.

— Reply to this email directly, view it on GitHub, or unsubscribe. You are receiving this because you werementioned.[AABTULGHBQ5BAB2O644QP2LW3IGCJA5CNFSM6AAAAAAVUWBY7OWGG33NNVSW45C7OR4XAZNMJFZXG5LFINXW23LFNZ2KUY3PNVWWK3TUL5UWJTSXFMV5M.gi f] Message ID: @.***>

rbeezer commented 1 year ago

Nice. XSL looks good.

Sounds like you are going to replace the printer character? Will we need a beta to test styling? Or wait on changes in another repository?

Holler when this is ready. Might catch a few PRs Friday AM, but there is no rush.

Alex-Jordan commented 1 year ago

I'm wrestling with some CSS for this, and potentially the need to change the HTML. The issue starts because I feel like the print button should be over on the right (but left of the tree buttons). So let me check in. Does anyone want to convince me to put the print button on the left? Like next to the Calc button, or Index button?

Placing the button where I want to place it raises issues of floating things to the right. To accomplish that in this demo I had to move the tree buttons earlier in the DOM. They do not appear to be placed differently on that page, but the tab order is not what you would expect. It goes through the tree buttons first, then back to index, calc, print.

Is that a good change? Get the tab-navigating user to the tree buttons first? I think it's considered bad practice to have the tab order misaligned with the visual order.

To do this "right", the buttons navbar should use a flex-box scheme. That would be a significant change to the CSS and make it awkward to support existing pages that float the tree buttons right, while also supporting a new flex-box scheme.

Thoughts?

davidfarmer commented 1 year ago

The layout in the default and CRC styles are intentionally done differently: default is mostly vanilla CSS; CRC uses a mixture, including flex and grid. This is part of the main point of overhaul: we were changing the structure of the HTML and we needed to be sure it would work with multiple styles.

The navbars may be styled similarly at the moment, but I have misgivings about requiring a particular method.

There also is an ongoing problem which maybe we can take a step toward fixing: the work required to maintain multiple styles. Most recently this arose when we changed the layout of the footer content.

If the general layout of the navbar and footer were required to be basically the same (in terms of position if not style), then that can be common to all styles. We would split the navbar_*.css files and put part in pretext.css.

Then we have to decide of we go to the next CSS version. Probably yes.

Of just temporarily live with the print button next to the calculator button, or having the print button appear in a different location than suggested by the document order.

On Thu, 9 Mar 2023, Alex Jordan wrote:

I'm wresting with some CSS for this, and potentially the need to change the HTML. The issue starts because I feel like the print button should be over on the right (but left of the tree buttons). So let me check in. Does anyone want to convince me to put the print button on the left? Like next to the Calc button, or Index button?

Placing the button where I want to place it raises issues of floating things to the right. To accomplish that in this demo I had to move the tree buttons earlier in the DOM. They do not appear to be placed differently on that page, but the tab order is not what you would expect. It goes through the tree buttons first, then back to index, calc, print.

Is that a good change? Get the tab-navigating user to the tree buttons first? I think it's considered bad practice to have the tab order misaligned with the visual order.

To do this "right", the buttons navbar should use a flex-box scheme. That would be a significant change to the CSS and make it awkward to support existing pages that float the tree buttons right, while also supporting a new flex-box scheme.

Thoughts?

— Reply to this email directly, view it on GitHub, or unsubscribe. You are receiving this because you werementioned.[AABTULGML4QFWOA64DUKL23W3K6YLA5CNFSM6AAAAAAVUWBY7OWGG33NNVSW45C7OR4XAZNMJFZXG5LFINXW23LFNZ2KUY3PNVW WK3TUL5UWJTSXHBPT4.gif] Message ID: @.***>

oscarlevin commented 1 year ago

As a user, I think I would expect to see a "print" button or link "inside" the page, and not as a stealthy new button in the navigation. As a bonus, this wouldn't require any tweaks to the pages "frame"

davidfarmer commented 1 year ago

Like, floating at the top right, in the margin if space permits?

On Fri, 10 Mar 2023, Oscar Levin wrote:

As a user, I think I would expect to see a "print" button or link "inside" the page, and not as a stealthy new button in the navigation. As a bonus, this wouldn't require any tweaks to the pages "frame"

— Reply to this email directly, view it on GitHub, or unsubscribe. You are receiving this because you werementioned.[AABTULCWWLZR6YRTFRRXNJ3W3NF2RA5CNFSM6AAAAAAVUWBY7OWGG33NNVSW45C7OR4XAZNMJFZXG5LFINXW23LFNZ2KUY3PNVW WK3TUL5UWJTSXIMYJO.gif] Message ID: @.***>

Alex-Jordan commented 1 year ago

Alright, that helps. I put the button inside the page, and CSS changes are minimal additions:

https://spot.pcc.edu/~ajordan/temp/worksheet-1-letter.html

The button itself is not styled. If anyone has suggestions, I'll try them out. Going to force push with updated XSL now.

davidfarmer commented 1 year ago

For some reason I pucture the print button as green.

I can style after it is live.

On Fri, 10 Mar 2023, Alex Jordan wrote:

Alright, that helps. I put the button inside the page, and CSS changes are minimal additions:

https://spot.pcc.edu/~ajordan/temp/worksheet-1-letter.html

The button itself is not styled. If anyone has suggestions, I'll try them out. Going to force push with updated XSL now.

— Reply to this email directly, view it on GitHub, or unsubscribe. You are receiving this because you werementioned.[AABTULCZBLUI3HSFMLVGD53W3NTHVA5CNFSM6AAAAAAVUWBY7OWGG33NNVSW45C7OR4XAZNMJFZXG5LFINXW23LFNZ2KUY3PNVW WK3TUL5UWJTSXIVRE2.gif] Message ID: @.***>

Alex-Jordan commented 1 year ago

Now with the updated XSLT.

There are uncommitted edits to pretext.css that only impact .print-button.

In editing the localization files, I noticed two of them had CRLF style line breaks. Must have been submitted by a Windows user. I removed the CR part in a separate commit (along with a few other places in the repository where they showed up. They are also in some MOM static content that is committed to the repo, but I opened #1949 about that.

Alex-Jordan commented 1 year ago

Now "LightGreen". Just until David makes it better.

rbeezer commented 1 year ago

A project may be chunked in a manner where a worksheet is one of several divisions on the page. One such is 33.4 in sample article (screenshot). The "A4" and "US" buttons take you to a standalone version.

This suggests to me that a "Print" button maybe belongs only on the standalone page. Is that where this is going?

Am I just missing some CSS? See button placement in screenshots.

Screenshot 2023-03-10 at 10-42-48 SA Worksheets Screenshot 2023-03-10 at 10-43-26 SA Dot products and projection

rbeezer commented 1 year ago

I'm always happy to clean-up whitespace. But maybe this commit doesn't belong here on top of other changes to the localization files.

If nothing more changes, I can deal with it as-is now. But if there are more changes, maybe you can cherry-pick it away and merge into some other local branch and save it for just a bit later?

Alex-Jordan commented 1 year ago

You are missing some CSS. Refresh on the standalone page.

But the presence of the button on other pages is my mistake. I'll think that through and update.

Roger on the CR. IT was uglifying the diff on those localization files for this which is what got me going on it here.

rbeezer commented 1 year ago

Refresh on the standalone page.

That's better! Sorry, should have thought about that sooner.

rbeezer commented 1 year ago

But the presence of the button on other pages is my mistake. I'll think that through and update.

From the hip. Isn't there a template that makes the standalone version? Add the button in there, always? Without even having a separate template?

Alex-Jordan commented 1 year ago

From the hip. Isn't there a template that makes the standalone version? Add the button in there, always? Without even having a separate template?

One thing: If we are sure the button is only for printing worksheet pages, then I considered this. I was trying to make it abstract enough that it could apply to other things easily when they come up in the future. Still thinking, but I may give up.

Other thing: for the button to literally be inside the worksheet as it is in the current sample, the styling is simpler (I think?) if it is within the "structural division content". But that led to it showing up where I didn't want it...

Alex-Jordan commented 1 year ago

CR removal removed.

Now it builds the button outside of the actual content, but within the file wrapper. For the standalone worksheet, the context node is the "worksheet", not a section, etc. And the modal template for the print-button applied to a "worksheet" builds the button.

I don't think I can place the button on the top right corner of the worksheet this way. So it's in the top left corner, as here: https://spot.pcc.edu/~ajordan/temp/worksheet-1-letter.html

It's not really "in" the worksheet with the border outline. It is before that, but positioned to overlay.

davidfarmer commented 1 year ago

I'll move the button when Alex is done with what he is doing.

Or, Alex can change around line 732 of pretext.css

.print-button { position: relative; right: 2px; top: 66px; background-color: LightGreen; z-index: 1; margin-top: -4em; float: right; }

On Fri, 10 Mar 2023, Alex Jordan wrote:

CR removal removed.

Now it builds the button outside of the actual content, but within the file wrapper. For the standalone worksheet, the context node is the "worksheet", not a section, etc. And the modal template for the print-button applied to a "worksheet" builds the button.

I don't think I can place the button on the top right corner of the worksheet this way. So it's in the top left corner, as here: https://spot.pcc.edu/~ajordan/temp/worksheet-1-letter.html

It's not really "in" the worksheet with the border outline. It is before that, but positioned to overlay.

— Reply to this email directly, view it on GitHub, or unsubscribe. You are receiving this because you werementioned.[AABTULGYAZKVWG7YT3JO72LW3N6UBA5CNFSM6AAAAAAVUWBY7OWGG33NNVSW45C7OR4XAZNMJFZXG5LFINXW23LFNZ2KUY3PNVW WK3TUL5UWJTSXI6JWI.gif] Message ID: @.***>

Alex-Jordan commented 1 year ago

David's CSS is applied.

Not sure yet if Rob is sold on the print-button template being applied inside the file-wrap template. If not, this CSS will change.

Alex-Jordan commented 1 year ago

OK, you can take a more serious look at this now.

rbeezer commented 1 year ago

Thanks for sticking with this one! Merged, and might rebuild tonight (check first).

I'll leave publicity (pretext-announce) to you. I may post on -dev just now, have a look first.

Alex-Jordan commented 1 year ago

I don't think this is worth publicizing. But if we are revitalizing worksheets in other ways, then after all that is done, we could make one post to -announce.