Allow click events to pass through the toolbar padding.

Previously triggering the toolbar to be displayed was achieved by adding an
event listener to the toolbar and setting an element padding. When the mouse
was moved over the padding, an event would be fired on the toolbar and we
would display it. However, this also blocks click events from passing through
the element to the underlying document.

There is no way to ensure that events are passed to all siblings of a node in
the DOM. In our case we have something like:
<body>
  <viewer-toolbar>...</viewer-toolbar>
  <object ... />
</body>

In this case, an event will only be fired on either the toolbar or the plugin,
depending on which is topmost. We want the toolbar to show when the mouse moves
over a region but we always want clicks to pass through to the plugin below.
The solution used here is to attach an event listener to the parent listener
and manually test if the mouse is moving over the toolbar in order to trigger
it being shown. The toolbar is then set to ignore pointer events. This allows
events to be dispatched properly.

Buttons within the toolbar will recieve all pointer events.

This CL also adds the ability to do an "initialFadeIn" of the page indicator
and toolbar components, which should remain faded in longer when the page
initially loads.

BUG=303491
R=ganetsky@chromium.org

Review URL: https://codereview.chromium.org/169163004
5 files changed
tree: a05547f59c928245794f5d3cb7b6277a010b1b4d
  1. elements/
  2. codereview.settings
  3. OWNERS