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.
This commit is contained in:
Jonas Jenwald 2018-07-08 10:56:01 +02:00
parent 46e1d5daa4
commit 36d6255866
4 changed files with 32 additions and 8 deletions

View File

@ -183,6 +183,12 @@ class BaseViewer {
this.spreadMode = options.spreadMode;
}
}
// Defer the dispatching of this event, to give other viewer components
// time to initialize *and* register 'baseviewerinit' event listeners.
Promise.resolve().then(() => {
this.eventBus.dispatch('baseviewerinit', { source: this, });
});
}
get pagesCount() {

View File

@ -15,6 +15,7 @@
import { ScrollMode, SpreadMode } from './base_viewer';
import { CursorTool } from './pdf_cursor_tools';
import { PDFSinglePageViewer } from './pdf_single_page_viewer';
import { SCROLLBAR_PADDING } from './ui_utils';
/**
@ -117,6 +118,18 @@ class SecondaryToolbar {
// Bind the event listener for adjusting the 'max-height' of the toolbar.
this.eventBus.on('resize', this._setMaxHeight.bind(this));
// Hide the Scroll/Spread mode buttons, when they're not applicable to the
// current `BaseViewer` instance (in particular `PDFSinglePageViewer`).
this.eventBus.on('baseviewerinit', (evt) => {
if (evt.source instanceof PDFSinglePageViewer) {
this.toolbarButtonContainer.classList.add('hiddenScrollModeButtons');
this.toolbarButtonContainer.classList.add('hiddenSpreadModeButtons');
} else {
this.toolbarButtonContainer.classList.remove('hiddenScrollModeButtons');
this.toolbarButtonContainer.classList.remove('hiddenSpreadModeButtons');
}
});
}
/**

View File

@ -394,6 +394,11 @@ html[dir='rtl'] .secondaryToolbar {
margin-bottom: -4px;
}
#secondaryToolbarButtonContainer.hiddenScrollModeButtons > .scrollModeButtons,
#secondaryToolbarButtonContainer.hiddenSpreadModeButtons > .spreadModeButtons {
display: none !important;
}
.doorHanger,
.doorHangerRight {
border: 1px solid hsla(0,0%,0%,.5);

View File

@ -168,29 +168,29 @@ See https://github.com/adobe-type-tools/cmap-resources
<div class="horizontalToolbarSeparator"></div>
<button id="scrollVertical" class="secondaryToolbarButton scrollVertical toggled" title="Use Vertical Scrolling" tabindex="62" data-l10n-id="scroll_vertical">
<button id="scrollVertical" class="secondaryToolbarButton scrollModeButtons scrollVertical toggled" title="Use Vertical Scrolling" tabindex="62" data-l10n-id="scroll_vertical">
<span data-l10n-id="scroll_vertical_label">Vertical Scrolling</span>
</button>
<button id="scrollHorizontal" class="secondaryToolbarButton scrollHorizontal" title="Use Horizontal Scrolling" tabindex="63" data-l10n-id="scroll_horizontal">
<button id="scrollHorizontal" class="secondaryToolbarButton scrollModeButtons scrollHorizontal" title="Use Horizontal Scrolling" tabindex="63" data-l10n-id="scroll_horizontal">
<span data-l10n-id="scroll_horizontal_label">Horizontal Scrolling</span>
</button>
<button id="scrollWrapped" class="secondaryToolbarButton scrollWrapped" title="Use Wrapped Scrolling" tabindex="64" data-l10n-id="scroll_wrapped">
<button id="scrollWrapped" class="secondaryToolbarButton scrollModeButtons scrollWrapped" title="Use Wrapped Scrolling" tabindex="64" data-l10n-id="scroll_wrapped">
<span data-l10n-id="scroll_wrapped_label">Wrapped Scrolling</span>
</button>
<div class="horizontalToolbarSeparator"></div>
<div class="horizontalToolbarSeparator scrollModeButtons"></div>
<button id="spreadNone" class="secondaryToolbarButton spreadNone toggled" title="Do not join page spreads" tabindex="65" data-l10n-id="spread_none">
<button id="spreadNone" class="secondaryToolbarButton spreadModeButtons spreadNone toggled" title="Do not join page spreads" tabindex="65" data-l10n-id="spread_none">
<span data-l10n-id="spread_none_label">No Spreads</span>
</button>
<button id="spreadOdd" class="secondaryToolbarButton spreadOdd" title="Join page spreads starting with odd-numbered pages" tabindex="66" data-l10n-id="spread_odd">
<button id="spreadOdd" class="secondaryToolbarButton spreadModeButtons spreadOdd" title="Join page spreads starting with odd-numbered pages" tabindex="66" data-l10n-id="spread_odd">
<span data-l10n-id="spread_odd_label">Odd Spreads</span>
</button>
<button id="spreadEven" class="secondaryToolbarButton spreadEven" title="Join page spreads starting with even-numbered pages" tabindex="67" data-l10n-id="spread_even">
<button id="spreadEven" class="secondaryToolbarButton spreadModeButtons spreadEven" title="Join page spreads starting with even-numbered pages" tabindex="67" data-l10n-id="spread_even">
<span data-l10n-id="spread_even_label">Even Spreads</span>
</button>
<div class="horizontalToolbarSeparator"></div>
<div class="horizontalToolbarSeparator spreadModeButtons"></div>
<button id="documentProperties" class="secondaryToolbarButton documentProperties" title="Document Properties…" tabindex="68" data-l10n-id="document_properties">
<span data-l10n-id="document_properties_label">Document Properties…</span>