Print long topic to PDF, redux, again

[jomaxro (Joshua Rosenfeld)]

So has this been merged yet?

Subtly dealing with whisper I think exisits here…

[Falco (Rafael dos Santos Silva)]

I’m fixing my mistakes in the PR with help from @tgxworld and @zogstrip. Also we are discussing enabling by default with a small limit.

[pfaffman (Jay Pfaffman)]

Anything up with this? I have an academic user who needs to export entire discussions for offline analysis.

[codinghorror (Jeff Atwood)]

We weren’t able to come up with anything we liked here, so we kinda put it on the back burner.

[pfaffman (Jay Pfaffman)]

My solution is going to be a client-side parser that’ll take a topic URL and spit out something vaguely resembling in Mbox file.

[Falco (Rafael dos Santos Silva)]

First version is a go on Meta

1. Go to a long topic: The State of JavaScript on Android in 2015 is... poor

2. Press CTRL+P

[sam (Sam Saffron)]

First version is a go on Meta

The quote styling is a bit funky

[barryvan (Barry van Oudtshoorn)]

Looks great!

I’ve noticed on Firefox that I sometimes get the browser-native print dialog pop up immediately, then your new popup window once I close the print dialog, and then the desired print dialog. I also noticed that the popup-blocker kicked in – so is the keypress perhaps not prevent propagation of the event, and is it perhaps opening the popup after an async call, rather than as a direct result of the keypress?

[Falco (Rafael dos Santos Silva)]

is the keypress perhaps not prevent propagation of the event

Exactly. I couldn’t find a way to properly stop propagation on the print event. (it doesn’t look possible)

[barryvan (Barry van Oudtshoorn)]

I don’t know if it’s possible on the print event, but it’s possible on the key combo. (I didn’t know there was a print event!) Note that you can’t use keypress – that only works in Firefox, as the other browsers seem to handle the default print in keydown.

Here’s the super-simple approach:

https://jsfiddle.net/0kch2s63/2/

It works correctly in both Firefox and Chrome. Unfortunately in Edge you still get the printing popup – but the event is handled appropriately. Not sure about Safari – I don’t have a Mac on me at present.

[Falco (Rafael dos Santos Silva)]

@barryvan

I’ve noticed on Firefox that I sometimes get the browser-native print dialog pop up immediately, then your new popup window once I close the print dialog, and then the desired print dialog.

This was happening indeed in earlier versions. Since this line got added, it doesn’t happen anymore with me on latest Firefox at Ubuntu Linux.

[Falco (Rafael dos Santos Silva)]

The quote styling is a bit funky

I tried an approach were we could re-use the CSS we have:

Add some styling to print redux version

Not sure if it’s the best way, but this way we doesn’t bloat the crawler version for bots and keep the style DRY.

---

One of the pages of our longest topic (157 pages long) on meta with quotes and oneboxes:

[codinghorror (Jeff Atwood)]

@falco can you summarize the final result here?

[Falco (Rafael dos Santos Silva)]

@falco can you summarize the final result here?

As requested, there is no UI for printing.

So any user can start to print by pressing CTRL+P when on a long topic. (This shortcut is show in our keyboard help)

For example, going to The State of JavaScript on Android in 2015 is... poor and pressing CTRL+P will open a popup with a print dialog asking to print 64 pages.

[tobiaseigen]

Nice work! I love this!

I don’t suppose there is a way to exclude certain (or all) html customizations from the javascriptless or print view, is there? Right now it shows up as a bulleted table of contents because it’s not including the accompanying css, which we don’t want.

Example:

How can we train people with basic education to understand and use complex laws?

[cpradio]

Sure you can! Or at least in theory. I haven’t had a chance to put it in practice yet though.

@media print {
  .menu-primary-container { display: none }
}

You can also hide such things from the crawler using

body.crawler {
  .menu-primary-container { display: none }
}

Edit: and by crawler, I mean the crawler view the print window seems to utilize. Google will still see your links as I don’t think it parses CSS to know what content it should index (I could be wrong on that though).

[riking (Kane York)]

@cpradio

as I don’t think it parses CSS to know what content it should index (I could be wrong on that though).

(This is off topic)
I think Google does do this, I remember some posts talking about how they detected font-color: #fffffe on keyword stuffing as being too invisible to see.

[angus (Angus McLeod)]

There is actually a slight inconsistency in the crawler.html.erb as it includes theme html, but doesn’t include theme css. (see here; compare with application.html.erb which includes everything in discourse_stylesheet.html.erb).

This means any custom html added by a theme will appear in the print (or other crawler-based views), but cannot be styled, or removed via styling.

I’ve made a pr to add theme styles to the crawler view.

Add theme stylesheet(s) to the crawler layout

cc @Falco

[sam (Sam Saffron)]

I wonder if what we want here is a specific css theme piece for crawler view, uneasy just adding the blanket app css here cause people need to think about this if the want to customize css in crawler view

[angus (Angus McLeod)]

Yes, I was thinking the same thing.

Although, including the theme css is arguably better than current state, which just includes the un-styled theme html.