Commit Graph

309 Commits

Author SHA1 Message Date
Thiago da Silva
811c8803b3 Fix small visual quirk in thumbnail viewer 2018-12-18 22:48:26 +01:00
Brendan Dahl
826893e6f4 Use high DPI icons on semi-high DPI screens.
The icons looks really fuzzy on a machine with a device pixel ratio of
1.5. Using the 2x icons looks much better.
2018-12-14 16:27:38 -08:00
PalmerAL
5f15dc2023 Use span instead of div in the text layer
This improves copy/pasting text content since it reduces the amount of unnecessary newlines.
2018-11-18 15:54:08 +01:00
Jonas Jenwald
36d6255866 Hide the Scroll/Spread mode buttons when the viewer is a PDFSinglePageViewer instance
If the current viewer is a `PDFSinglePageViewer` instance the Scroll/Spread modes are no-ops, hence displaying buttons that do *nothing* when clicked will probably do very little besides confuse users.
2018-07-08 12:08:48 +02:00
Jonas Jenwald
5198b6d0dc Fix regression affecting the horizontal viewerContainer offset for small window widths (PR 9816 follow-up)
*The danger of fixing one bug is that it can, sometimes too easily, cause another one in the process; sorry for not catching this when testing PR 9816 locally.*

When the *entire* viewer becomes narrow enough, as controlled by the `@media all and (max-width: 840px)` media query, the sidebar should (semi-transparently) overlay the `viewerContainer` instead of moving it horizontally. Unfortunately the changes made in PR 9816 caused the relevant CSS rules to be skipped, because of how the inheritance model works in CSS.

I'm well aware that `!important` is usually advised against, since it "breaks" the CSS inheritance model. However in this case it seemed reasonable to use it, to not only fix the bug at hand but to also prevent similar bugs from occurring in the future.
2018-06-15 20:27:02 +02:00
Jonas Jenwald
39fc1c72fc Fix regression causing the pages to be offset horizontally in Presentation Mode (PR 8993 follow-up)
This is a regression from PR 8993; it causes the pages to be offset horizontally in Presentation Mode, if and only if the sidebar is currently open when the user triggers Presentation Mode.

Please note that while this doesn't seem to affect Firefox, both Chrome and IE are however affected.
Interestingly enough, despite the Chrome extension being affected as well, I cannot find any issue filed about this. (Either Presentation Mode isn't used much at all, or users don't open the sidebar before entering Presentation Mode.)
2018-06-14 16:32:19 +02:00
Ryan Hendrickson
3d83c646c6 Add spread modes to web viewer
This builds on the scrolling mode work to add three buttons for joining
page spreads together: one for the default view, with no page spreads,
and two for spreads starting on odd-numbered or even-numbered pages.
2018-05-14 23:10:32 -04:00
Ryan Hendrickson
91cbc185da Add scrolling modes to web viewer
In addition to the default scrolling mode (vertical), this commit adds
horizontal and wrapped scrolling, implemented primarily with CSS.
2018-05-14 23:10:32 -04:00
Wojciech Maj
dbb0e88bc1 Clean up browser-specific CSS 2018-04-04 00:25:12 +02:00
Soumya Himanish Mohapatra
b28962df1e Improve visibility of the findInput placeholder in Chrome 2017-12-12 15:34:51 +05:30
Jonas Jenwald
085e7a7a74 Implement sidebar resizing for modern browsers, by utilizing CSS variables (issue 2072)
By making use of modern CSS features, in this case [CSS variables](https://developer.mozilla.org/en-US/docs/Web/CSS/Using_CSS_variables), implementing sidebar resizing is actually quite simple. Not only will the amount of added code be fairly small, but it should also be easy to maintain since there's no need for complicated JavaScript hacks in order to update the CSS. Another benefit is that the JavaScript code doesn't need to make detailed assumptions about the exact structure of the HTML/CSS code.

Obviously this will not work in older browsers, such as IE, that lack support for CSS variables. In those cases sidebar resizing is simply disabled (via feature detection), and the resizing DOM element hidden, and the behaviour is thus *identical* to the current (fixed-width) sidebar.
However, considering the simplicity of the implementation, I really don't see why limiting this feature to "modern" browsers is a problem.

Finally, note that a few edge-cases meant that the patch is a bit larger than what the basic functionality would dictate. Among those is first of all proper RTL support, and secondly (automatic) resizing of the sidebar when the width of the *entire* viewer changes. Another, pre-existing, issue fixed here is the incomplete interface of `NullL10n`.

*Please note:* This patch has been successfully tested in both LTR and RTL viewer locales, in recent versions of Firefox and Chrome.

Fixes 2072.
2017-11-06 15:58:24 +01:00
Jonas Jenwald
7a0db8960d Layout the sidebar in the same vertical position regardless of the viewer width (issue 4052, bug 850591)
If we want to (eventually) make it possible to resize the sidebar, then having its width indirectly affect the toolbar is going to wreck havoc on the media queries used to show/hide buttons in the main toolbar (since many of them depend on the toolbar state, and thus its width).
Updating all of the media queries dynamically with JavaScript seems like a non-starter, given that it'd cause *very* messy code. It thus seem to me that we'd need to fix the position of the sidebar, to have any hope of (in the short term) addressing issue 2072.

Hence, I'm suggesting that the we always layout the sidebar in a consistent vertical position, and only animate the `viewerContainer` rather than the entire `mainContainer`.

Fixes 4052.
Fixes bug 850591.
2017-10-11 18:17:28 +02:00
Jonas Jenwald
36c2791296 Unify handling of various cursor tools, e.g. the current Hand Tool and a possible future Zoom Tool, in a new PDFCursorTools module
With the current way that the `HandTool` is implemented, if someone would try to also add a Zoom tool (as issue 1260 asks for) that probably wouldn't work very well given that you'd then have two cursor tools which may not play nice together.
Hence this patch, which attempts to refactor things so that it should be simpler to add e.g. a Zoom tool as well (given that that issue is marked as "good-beginner-bug", and I'm not sure if that really applies considering the current state of the code).

Note that I personally have no interest in implementing a Zoom tool (similar to Adobe Reader) since I wouldn't use it, but I figured that it can't hurt to make this code a bit more future proof.
2017-05-22 00:51:01 +02:00
Jonas Jenwald
8f96909e97 Remove unnecessary .toolbarButton.group CSS class
I noticed that we have a `.toolbarButton.group` CSS class, which is currently applied to some buttons in the viewer. Since it attempts to adjust the `margin-right` property, I was initially a bit puzzled as to why there wasn't different rules for LTR/RTL locales.

However, checking the viewer with the DevTools inspector, in both LTR and RTL locales, I quickly found that the rule in question is *always* being overridden by other CSS rules.
It thus seem to me that while this rule was probably useful at some point, it has been dead for years and could now be removed.
2017-03-10 13:49:24 +01:00
Jonas Jenwald
b151666c53
Viewer: consistently wrap find bar elements for small screen sizes
This patch ensures that the find bar is not extended to the window width
when element wrapping occurs on small screens.
2017-03-08 23:55:13 +01:00
Tim van der Meij
87a30a7ee1
Viewer: enable find functionality for small devices
The find functionality is currently not available for small devices
because the find dialog is not responsive. This patch fixes that.

To achieve this goal, the HTML is changed to always show the find
button. To prevent issues because of the addition of an extra button for
small views, the previous/next page buttons are hidden if the view
becomes small. These buttons are not useful anyway because on small
devices navigation is usually done via scrolling. The find functionality
is much more useful to have in this case. Moreover, we wrap the existing
elements into separate `div`s so that the browser can position the
elements itself when the view becomes smaller and logically connected
elements stay together when this happens.

In the CSS, extra rules for the find bar have been added to ensure that
the dialog's doorhanger is always below the find button. All findbar
`div`s are forced to be 32 pixels high to prevent the find message text
being aligned under the checkboxes. Finally, the find message is only
visible when there is actually text to display. This prevents wrapping
issues because, by default, the label has padding and margin even if
there is no text.
2017-03-08 23:54:28 +01:00
Jonas Jenwald
c79e5b3f17
Viewer: replace find label with placeholder/tooltip
This is common in the rest of the UI and helps us prevent responsiveness
issues for different length strings in different locales.
2017-03-08 23:54:14 +01:00
Jonas Jenwald
616e5fadff Display a notification on the sidebarToggle button for PDF documents with outline/attachments
A longstanding issue with the viewer is that you cannot tell if a PDF document includes an outline and/or attachments without actually opening the sidebar.
This patch contains a suggested solution for that, by displaying an hide-on-interaction notification on the `sidebarToggle` button (and the relevant sidebar view buttons). Note that this was inspired by e.g. the update notification that is displayed on the menu button in Firefox.

For an initial implementation, I've tried to do this in such a way that the notification isn't too distracting. Without being an UX expert, I don't think that we'd want something too in-your-face, in order to keep the viewer toolbars reasonable clean. (We probably do *not* want e.g. an entire notification bar in these situations, since that would take up unnecessary screen space and require actions from the user to close.)

However it's certainly possible that the current notification might simply be *too* inconspicuous to be truly helpful to users, but we could probably iterate on that if the feature itself is deemed useful.
2017-01-30 15:39:04 +01:00
Tim van der Meij
14d7e2f29c Viewer: remove unused CSS rule
This appears to have been part of the first mock-up of the viewer, but
hasn't been used since.
2016-11-24 23:44:57 +01:00
Tim van der Meij
f95915fc73 Viewer: amend .sidebarOpen responsiveness rules with rules for
`.sidebarMoving`
2016-11-07 16:23:50 +01:00
Tim van der Meij
28ef012727 Viewer: improve responsiveness and clean up CSS
This patch resolves the responsiveness issues for the toolbar in the
viewer. Depending on the language (for example the Dutch language),
elements could overlap when the viewport size is reduced.

The main issue here is that the CSS rules are unnecessarily complex and
handle lots of different cases (LTR/RTL, displacements for specific
viewport widths, et cetera). By removing this complexity and letting the
browser handle the responsiveness, we not only get simpler CSS rules and
HTML mark-up, but the responsiveness issues are mostly fixed at the same
time. We no longer have to position the elements manually (by setting
their `left` attribute value) anymore.
2016-11-03 22:56:46 +01:00
Jonas Jenwald
23ec02bb93 Remove the "Page: " label and replace it with a tooltip
The following reasoning was used for deciding to remove the "Page: " label, and replace it with a tooltip, from the main toolbar:
 - We have no other visible labels in the *main* toolbar (e.g. the Zoom dropdown doesn't have a label, but only a tooltip).
 - We already hide the "Page: " label when the viewer is narrow.
 - The varying width of the "Page: " label in different locales is already causing issues for many languages, with overlap in the main toolbar as a result.
Trying to create responsive CSS styles that works well in all locales is already difficult, and if we add support for page labels that will only further compound the issues.
 - Some PDF viewers (e.g. Adobe Reader, pdfium in Chrome) doesn't show labels in the UI by default.
2016-10-26 13:30:26 +02:00
Yury Delendik
c09f634bb6 Removes mozPrintCallback polyfill, converts canvas to PNG. 2016-10-11 10:08:13 -05:00
Yury Delendik
24a7a58da7 Moves mozPrintCallback specific code to firefox_printservice.js 2016-10-08 07:33:07 -05:00
Yury Delendik
29947b5a57 Printing canvases at PDF document size. 2016-10-06 07:51:45 -05:00
Tobias Schneider
aeabd0db20 Fix insertion of blank pages during printing due to non-matching page sizes 2016-03-21 14:21:07 -07:00
Yury Delendik
bd7f121c83 Better "text" testing. 2015-11-19 11:03:52 -06:00
Jonas Jenwald
0f50147ba8 Create a new indeterminate loading bar animation for the default viewer
This patch contains an alternative solution (see the referenced PRs in 4718), in order for the indeterminate loading bar to have a consistent speed regardless of width.

Fixes 4718.
2015-11-04 17:44:51 +01:00
Andy Parisi
17fe0b1470 Added find match counter 2015-10-30 10:21:26 -05:00
Rob Wu
9f80060a18 Add mirrored triangle (TOC item icon) 2015-09-06 15:35:58 +02:00
Jonas Jenwald
da1b9df74a Adjust the min-width of outline items and use more consistent border-radius (PR 6242 follow-up)
Prior to PR 6242, the width of all outline items was set such that their right (or left, in RTL locales) edges lined up vertically. In my opinion that looked more consistent, therefore this patch adjusts the CSS to make sure that this will be the case again.

The patch also makes the `border-radius` values of outline items a bit more consistent.
2015-09-06 13:01:30 +02:00
Jonas Jenwald
2df1b7b3cd Switch expanded/collapsed in the names of the treeitem-* assets
It appears to me that the `expanded/collapsed` part of the names got switched around, since I'd expect the following convention:
 - `v` == expanded
 - `>` == collapsed
2015-08-27 23:21:34 +02:00
Jonas Jenwald
b1950d3657 Use the Retina assets for outlineItemToggler when in HiDPI mode 2015-08-27 17:50:35 +02:00
Yury Delendik
70fd360d51 Merge pull request #6242 from Rob--W/outline-collapsible
Allow outline to be collapsed / shown via +/-.
2015-08-27 08:41:34 -05:00
Rob Wu
7c992243fd Allow outline to be collapsed / shown via icon.
- This commit adds a '>' before every outline item that has subitems.
- Click on the '>' to collapse all subitems under that item (which turns
  the '>' in a 'v').
- Shift + click expands/collapses all descendant items under that tree.
- Double-clicking on the "Show Document Outline" button in the toolbar
  expands/collapses all outline items.
2015-08-22 18:49:08 +02:00
Jonas Jenwald
421289c7bc Merge pull request #6233 from Rob--W/crx-local-files
Improve support for viewing PDFs from file://-URLs in the Chrome extension
2015-08-15 14:15:36 +02:00
Rob Wu
775d4e69cf Teach users how to enable access to local files. 2015-08-14 18:59:30 +02:00
Daan Sprenkels
c3b7ed4541 Apply hover style to .overlayButton not only when hovered, but also when focused (issue #6261) 2015-08-04 14:20:43 +02:00
Timothy Gu
099f99d6ad Apply padding on <select> and not the button 2015-06-03 12:16:12 -07:00
Mike Corbin
a22319b98a Eliminate transition effects from thumbnail loader
During A/B testing we found a significant preference (increased engagement
time, reduced downloads of original PDF for local viewing) for the version that
doesn't animate loading thumbnails.

Profiling shows that the transition effects hit at a pessimal time when the
compositor is busy rendering the main PDF page view, and rendering thumbnail
previews, causing the main scroll view to stutter. With the transition removed
scrolling is perceptibly smoother in Chrome and Firefox. We also hypothesize
that the transition effects added to a perception of slowness but presumably
the aforementioned stutter is the primary issue here.
2015-05-16 15:08:10 +01:00
Jonas Jenwald
4dc52cf92c Tweak the :focus/:hover CSS rules of the .toolbarField class used in Overlay dialogs
Having recently spent some time staring at the PasswordPrompt, while fixing issue 6010, I felt that the current border style does not really give a good visual  indication that the input field actually has focus.

The current appearance was first introduced in PR 3527; but I don't know if having a different border style in Overlay dialogs was intentional, or if it just "happened".
However, given the colour palette used in the viewer UI, I think that using the same border style for all .toolbarFields makes sense.
2015-05-15 13:52:18 +02:00
Tim van der Meij
d7aa95d6b1 Merge pull request #5857 from Rob--W/print-page-size
Set page size via @page + size
2015-05-14 16:52:40 +02:00
Jonas Jenwald
601bd4a930 Preface all "fullscreen" CSS rules with a |pdfPresentationMode| class, and add it to the |viewerContainer| while Presentation Mode is active 2015-04-21 16:28:50 +02:00
Rob Wu
d34e6ddd60 Set page size via @page + size
In Blink-based browsers, there is a mismatch between document size and
paper size. Even if exactly the same values and unit are used, it is
possible that the printed results takes more pages than expected.

To solve the issue, the page size is set via @page size, and the canvas
and ancestor nodes are assigned a width+height of 100% (=relative to the
page). This change resolves bugs such as blank pages and split pages.
2015-03-23 11:19:48 +01:00
Jonas Jenwald
f0d538d7cf Revert PR 5510, except in WebKit browsers, for breaking print preview in Firefox
See https://bugzilla.mozilla.org/show_bug.cgi?id=1138993.
2015-03-07 00:16:55 +01:00
Tim van der Meij
997c2b9d94 Merge pull request #5596 from fkaelberer/fixBordersAroundThumbnails
Fix border sizes around thumbnails
2015-01-23 21:29:49 +01:00
Jonas Jenwald
c149d4d75e Fix thumbnail rendering regression, when using |draw|, for PDF files with blend modes (issue 5637) 2015-01-19 21:55:59 +01:00
Brendan Dahl
e93cf5ca97 Merge pull request #5552 from yurydelendik/pdfpageview
Creates/refactors PDFPageView class
2015-01-05 11:26:36 -08:00
fkaelberer
1d31018c7d Make thumbnail CSS size independent of data-loaded tag 2014-12-30 15:07:20 +01:00
Jonas Jenwald
86edb8687d Fix the placement of arrows in the zoom box
Now that [bug 649849](https://bugzilla.mozilla.org/show_bug.cgi?id=649849) has been fixed, adding support for `-moz-appearance: none`, the arrow is now too close to the text in the zoom box. This is currently only an issue in Nightly, but assuming the patch doesn't get backed out, this will soon affect all versions of Firefox.

The only simple solution I could find seems to be removing `*-appearance: none` rules from the CSS. I haven't been able to find any easier solutions that still looks the same with/without bug 649849.
2014-12-30 11:37:21 +01:00