@internetarchive/ia-item-navigator 0.0.0-a10 → 0.0.0-a12

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (36) hide show
  1. package/demo/app-root.ts +6 -4
  2. package/dist/demo/app-root.d.ts +0 -1
  3. package/dist/demo/app-root.js +1 -3
  4. package/dist/demo/app-root.js.map +1 -1
  5. package/dist/src/interfaces/nav-controller-interface.d.ts +9 -0
  6. package/dist/src/interfaces/nav-controller-interface.js.map +1 -1
  7. package/dist/src/item-inspector/item-inspector.d.ts +0 -47
  8. package/dist/src/item-inspector/item-inspector.js +253 -271
  9. package/dist/src/item-inspector/item-inspector.js.map +1 -1
  10. package/dist/src/item-navigator.d.ts +14 -7
  11. package/dist/src/item-navigator.js +60 -30
  12. package/dist/src/item-navigator.js.map +1 -1
  13. package/dist/src/no-theater-available.d.ts +9 -0
  14. package/dist/src/no-theater-available.js +79 -0
  15. package/dist/src/no-theater-available.js.map +1 -0
  16. package/dist/test/book-nav-stub.d.ts +17 -0
  17. package/dist/test/book-nav-stub.js +42 -0
  18. package/dist/test/book-nav-stub.js.map +1 -0
  19. package/dist/test/ia-item-navigator.test.d.ts +1 -0
  20. package/dist/test/ia-item-navigator.test.js +146 -114
  21. package/dist/test/ia-item-navigator.test.js.map +1 -1
  22. package/dist/test/ia-stub.d.ts +22 -0
  23. package/dist/test/ia-stub.js +34 -3
  24. package/dist/test/ia-stub.js.map +1 -1
  25. package/dist/test/no-theater-available.test.d.ts +1 -0
  26. package/dist/test/no-theater-available.test.js +27 -0
  27. package/dist/test/no-theater-available.test.js.map +1 -0
  28. package/package.json +3 -2
  29. package/src/interfaces/nav-controller-interface.ts +13 -0
  30. package/src/item-navigator.ts +69 -36
  31. package/src/no-theater-available.ts +87 -0
  32. package/test/book-nav-stub.ts +35 -0
  33. package/test/ia-item-navigator.test.ts +191 -143
  34. package/test/ia-stub.ts +78 -2
  35. package/test/no-theater-available.test.ts +32 -0
  36. package/src/item-inspector/item-inspector.ts +0 -296
@@ -1,13 +1,14 @@
1
- import { LitElement, PropertyValues } from 'lit-element';
1
+ import { LitElement, PropertyValues, CSSResult } from 'lit-element';
2
2
  import { nothing, TemplateResult } from 'lit-html';
3
3
  import { MetadataResponse } from '@internetarchive/search-service';
4
- import { SharedResizeObserverInterface, SharedResizeObserverResizeHandlerInterface } from '@internetarchive/shared-resize-observer';
4
+ import { SharedResizeObserver, SharedResizeObserverResizeHandlerInterface } from '@internetarchive/shared-resize-observer';
5
5
  import '@internetarchive/ia-menu-slider';
6
6
  import { ModalManagerInterface } from '@internetarchive/modal-manager';
7
7
  import '@internetarchive/icon-ellipses/icon-ellipses';
8
8
  import './loader';
9
9
  import { IntManageSideMenuEvent, IntSetOpenMenuEvent, IntSetMenuContentsEvent, IntSetMenuShortcutsEvent, IntLoadingStateUpdatedEvent, IntManageFullscreenEvent } from './interfaces/event-interfaces';
10
10
  import { IntMenuProvider, IntMenuShortcut } from './interfaces/menu-interfaces';
11
+ import './no-theater-available';
11
12
  export declare class ItemNavigator extends LitElement implements SharedResizeObserverResizeHandlerInterface {
12
13
  item: MetadataResponse | undefined;
13
14
  itemType: string;
@@ -15,21 +16,27 @@ export declare class ItemNavigator extends LitElement implements SharedResizeObs
15
16
  signedIn: boolean;
16
17
  menuContents: IntMenuProvider[];
17
18
  menuShortcuts: IntMenuShortcut[];
18
- viewportInFullscreen: boolean;
19
+ viewportInFullscreen: boolean | null;
19
20
  menuOpened: boolean;
20
21
  openMenu: string;
21
22
  modal?: ModalManagerInterface;
22
- sharedObserver?: SharedResizeObserverInterface;
23
- loaded: boolean;
23
+ sharedObserver?: SharedResizeObserver;
24
+ loaded: boolean | null;
24
25
  openMenuState: 'overlay' | 'shift';
25
26
  private frame;
27
+ private headerSlot;
26
28
  disconnectedCallback(): void;
27
- firstUpdated(pp: any): void;
29
+ firstUpdated(): void;
28
30
  updated(changed: PropertyValues): void;
29
31
  handleResize(entry: ResizeObserverEntry): void;
30
32
  private startResizeObserver;
31
33
  get loaderTitle(): "" | "Internet Archive";
34
+ get readerHeightStyle(): string;
35
+ handleHeaderSlotChange(e: Event): void;
36
+ get loadingArea(): TemplateResult;
32
37
  render(): TemplateResult;
38
+ get noTheaterView(): TemplateResult;
39
+ get theaterSlot(): TemplateResult;
33
40
  get BooksViewer(): TemplateResult;
34
41
  get renderViewport(): TemplateResult | typeof nothing;
35
42
  loadingStateUpdated(e: IntLoadingStateUpdatedEvent): void;
@@ -56,5 +63,5 @@ export declare class ItemNavigator extends LitElement implements SharedResizeObs
56
63
  /** End Menu Shortcuts */
57
64
  /** Misc Render */
58
65
  get menuClass(): string;
59
- static get styles(): import("lit-element").CSSResult;
66
+ static get styles(): CSSResult;
60
67
  }
@@ -1,5 +1,4 @@
1
1
  import { __decorate } from "tslib";
2
- /* eslint-disable import/no-duplicates */
3
2
  import { css, html, LitElement, customElement, property, state, query, } from 'lit-element';
4
3
  import { nothing } from 'lit-html';
5
4
  import { MetadataResponse } from '@internetarchive/search-service';
@@ -9,6 +8,7 @@ import { IAMenuSlider } from '@internetarchive/ia-menu-slider';
9
8
  import '@internetarchive/ia-menu-slider';
10
9
  import '@internetarchive/icon-ellipses/icon-ellipses';
11
10
  import './loader';
11
+ import './no-theater-available';
12
12
  let ItemNavigator = class ItemNavigator extends LitElement {
13
13
  constructor() {
14
14
  super(...arguments);
@@ -18,10 +18,10 @@ let ItemNavigator = class ItemNavigator extends LitElement {
18
18
  this.signedIn = false;
19
19
  this.menuContents = [];
20
20
  this.menuShortcuts = [];
21
- this.viewportInFullscreen = false;
21
+ this.viewportInFullscreen = null;
22
22
  this.menuOpened = false;
23
23
  this.openMenu = '';
24
- this.loaded = false;
24
+ this.loaded = null;
25
25
  this.openMenuState = 'shift';
26
26
  }
27
27
  disconnectedCallback() {
@@ -31,8 +31,7 @@ let ItemNavigator = class ItemNavigator extends LitElement {
31
31
  target: this.frame,
32
32
  });
33
33
  }
34
- firstUpdated(pp) {
35
- console.log('first updated item-nav', this.modal, pp);
34
+ firstUpdated() {
36
35
  if (!this.modal) {
37
36
  this.createModal();
38
37
  }
@@ -70,29 +69,57 @@ let ItemNavigator = class ItemNavigator extends LitElement {
70
69
  get loaderTitle() {
71
70
  return this.viewportInFullscreen ? 'Internet Archive' : '';
72
71
  }
72
+ get readerHeightStyle() {
73
+ var _a;
74
+ const calcFSHeight = `calc(100vh - ${(_a = this.headerSlot) === null || _a === void 0 ? void 0 : _a.offsetHeight}px)`;
75
+ return this.viewportInFullscreen ? `height: ${calcFSHeight}` : '';
76
+ }
77
+ handleHeaderSlotChange(e) {
78
+ console.log('~~~~ handleHeaderSlotChange', e);
79
+ }
80
+ get loadingArea() {
81
+ return html `
82
+ <div class="loading-area">
83
+ <div class="loading-view">
84
+ <ia-itemnav-loader .title=${this.loaderTitle}></ia-itemnav-loader>
85
+ </div>
86
+ </div>
87
+ `;
88
+ }
73
89
  render() {
74
90
  const displayReaderClass = this.loaded ? '' : 'hide';
75
91
  return html `
76
92
  <div id="frame" class=${`${this.menuClass}`}>
77
- <slot name="theater-header"></slot>
78
93
  <div class="menu-and-reader">
79
94
  ${this.shouldRenderMenu ? this.renderSideMenu : nothing}
80
- <div id="reader" class=${displayReaderClass}>
95
+ <slot
96
+ name="theater-header"
97
+ @slotchange=${this.handleHeaderSlotChange}
98
+ ></slot>
99
+ <div
100
+ id="reader"
101
+ class=${displayReaderClass}
102
+ style=${this.readerHeightStyle}
103
+ >
81
104
  ${this.renderViewport}
82
105
  </div>
83
- ${!this.loaded
84
- ? html ` <div class="loading-area">
85
- <div class="loading-view">
86
- <ia-itemnav-loader
87
- .title=${this.loaderTitle}
88
- ></ia-itemnav-loader>
89
- </div>
90
- </div>`
91
- : nothing}
106
+ ${!this.loaded ? this.loadingArea : nothing}
92
107
  </div>
93
108
  </div>
94
109
  `;
95
110
  }
111
+ get noTheaterView() {
112
+ var _a, _b;
113
+ return html `<ia-no-theater-available
114
+ .identifier=${(_b = (_a = this.item) === null || _a === void 0 ? void 0 : _a.metadata) === null || _b === void 0 ? void 0 : _b.identifier}
115
+ @loadingStateUpdated=${this.loadingStateUpdated}
116
+ ></ia-no-theater-available>`;
117
+ }
118
+ get theaterSlot() {
119
+ return html `
120
+ <slot name="theater-main" style=${this.readerHeightStyle}></slot>
121
+ `;
122
+ }
96
123
  get BooksViewer() {
97
124
  const slotVisibility = !this.loaded ? 'opacity: 0;' : 'opacity: 1;';
98
125
  return html `
@@ -110,7 +137,7 @@ let ItemNavigator = class ItemNavigator extends LitElement {
110
137
  @menuShortcutsUpdated=${this.setMenuShortcuts}
111
138
  >
112
139
  <div slot="theater-main" style=${slotVisibility}>
113
- <slot name="theater-main"></slot>
140
+ ${this.theaterSlot}
114
141
  </div>
115
142
  </book-navigator>
116
143
  `;
@@ -122,12 +149,11 @@ let ItemNavigator = class ItemNavigator extends LitElement {
122
149
  if (this.itemType === 'bookreader') {
123
150
  return this.BooksViewer;
124
151
  }
125
- return nothing;
152
+ return this.noTheaterView;
126
153
  }
127
154
  loadingStateUpdated(e) {
128
155
  const { loaded } = e.detail;
129
156
  this.loaded = !!loaded;
130
- console.log('******loadingStateUpdated', e.detail);
131
157
  }
132
158
  /** Creates modal DOM & attaches to `<body>` */
133
159
  createModal() {
@@ -137,10 +163,12 @@ let ItemNavigator = class ItemNavigator extends LitElement {
137
163
  /* End Modal management */
138
164
  /** Fullscreen Management */
139
165
  manageViewportFullscreen(e) {
140
- this.viewportInFullscreen = !!e.detail.isFullScreen;
141
- this.dispatchEvent(new CustomEvent('ViewportInFullScreen', {
166
+ const fullscreenStatus = !!e.detail.isFullScreen;
167
+ this.viewportInFullscreen = !fullscreenStatus ? null : fullscreenStatus;
168
+ const event = new CustomEvent('fullscreenToggled', {
142
169
  detail: e.detail,
143
- }));
170
+ });
171
+ this.dispatchEvent(event);
144
172
  }
145
173
  /** End Fullscreen Management */
146
174
  /** Side menu */
@@ -179,7 +207,6 @@ let ItemNavigator = class ItemNavigator extends LitElement {
179
207
  }
180
208
  }
181
209
  get menuToggleButton() {
182
- // <ia-icon icon="ellipses" style="width: var(--iconWidth); height: var(--iconHeight);"></ia-icon>
183
210
  return html `
184
211
  <button
185
212
  class="toggle-menu"
@@ -247,7 +274,6 @@ let ItemNavigator = class ItemNavigator extends LitElement {
247
274
  return css `
248
275
  :host,
249
276
  #frame,
250
- #reader,
251
277
  .menu-and-reader {
252
278
  min-height: inherit;
253
279
  height: inherit;
@@ -256,6 +282,11 @@ let ItemNavigator = class ItemNavigator extends LitElement {
256
282
  display: block;
257
283
  }
258
284
 
285
+ slot {
286
+ display: block;
287
+ overflow: hidden;
288
+ }
289
+
259
290
  #frame {
260
291
  background-color: ${theaterBg};
261
292
  color-scheme: dark;
@@ -270,11 +301,6 @@ let ItemNavigator = class ItemNavigator extends LitElement {
270
301
  z-index: 9;
271
302
  }
272
303
 
273
- #frame.fullscreen,
274
- #frame.fullscreen #reader {
275
- height: 100vh;
276
- }
277
-
278
304
  .loading-area {
279
305
  position: absolute;
280
306
  top: 0;
@@ -391,6 +417,7 @@ let ItemNavigator = class ItemNavigator extends LitElement {
391
417
  transition: ${transitionEffect};
392
418
  }
393
419
 
420
+ .open.shift slot[name='theater-header'],
394
421
  .open.shift #reader {
395
422
  width: calc(100% - var(--menuWidth));
396
423
  float: right;
@@ -457,7 +484,7 @@ __decorate([
457
484
  property({ attribute: false })
458
485
  ], ItemNavigator.prototype, "sharedObserver", void 0);
459
486
  __decorate([
460
- property({ type: Boolean, reflect: true })
487
+ property({ reflect: true, attribute: true })
461
488
  ], ItemNavigator.prototype, "loaded", void 0);
462
489
  __decorate([
463
490
  state()
@@ -465,6 +492,9 @@ __decorate([
465
492
  __decorate([
466
493
  query('#frame')
467
494
  ], ItemNavigator.prototype, "frame", void 0);
495
+ __decorate([
496
+ query('slot[name="theater-header"]')
497
+ ], ItemNavigator.prototype, "headerSlot", void 0);
468
498
  ItemNavigator = __decorate([
469
499
  customElement('ia-item-navigator')
470
500
  ], ItemNavigator);
@@ -1 +1 @@
1
- {"version":3,"file":"item-navigator.js","sourceRoot":"","sources":["../../src/item-navigator.ts"],"names":[],"mappings":"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","sourcesContent":["/* eslint-disable import/no-duplicates */\nimport {\n css,\n html,\n LitElement,\n customElement,\n property,\n state,\n query,\n PropertyValues,\n} from 'lit-element';\nimport { nothing, TemplateResult } from 'lit-html';\nimport { MetadataResponse } from '@internetarchive/search-service';\nimport {\n SharedResizeObserver,\n SharedResizeObserverInterface,\n SharedResizeObserverResizeHandlerInterface,\n} from '@internetarchive/shared-resize-observer';\n// @ts-ignore\nimport { IAMenuSlider } from '@internetarchive/ia-menu-slider';\nimport '@internetarchive/ia-menu-slider';\n\nimport { ModalManagerInterface } from '@internetarchive/modal-manager';\nimport '@internetarchive/icon-ellipses/icon-ellipses';\nimport './loader';\n\nimport {\n IntManageSideMenuEvent,\n IntSetOpenMenuEvent,\n IntSetMenuContentsEvent,\n IntSetMenuShortcutsEvent,\n IntLoadingStateUpdatedEvent,\n IntManageFullscreenEvent,\n} from './interfaces/event-interfaces';\n\nimport { IntMenuProvider, IntMenuShortcut } from './interfaces/menu-interfaces';\n\n@customElement('ia-item-navigator')\nexport class ItemNavigator\n extends LitElement\n implements SharedResizeObserverResizeHandlerInterface {\n @property({\n type: Object,\n converter: (value: string | MetadataResponse | null): MetadataResponse => {\n if (value && typeof value === 'string') {\n return new MetadataResponse(JSON.parse(atob(value)));\n }\n return value as MetadataResponse;\n },\n })\n item: MetadataResponse | undefined = undefined;\n\n @property({ type: String }) itemType = '';\n\n @property({ type: String }) baseHost = 'archive.org';\n\n @property({\n converter: (arg: string | boolean | null) => {\n if (typeof arg === 'boolean') {\n return arg;\n }\n return arg === 'true';\n },\n })\n signedIn = false;\n\n @property({\n type: Array,\n hasChanged: (newVal: Array<object>, oldVal: Array<object>) => {\n if (newVal !== oldVal) {\n return true;\n }\n return false;\n },\n })\n @property({ type: Array })\n menuContents: IntMenuProvider[] = [];\n\n @property({ type: Array }) menuShortcuts: IntMenuShortcut[] = [];\n\n @property({ type: Boolean, reflect: true }) viewportInFullscreen = false;\n\n @property({ type: Boolean }) menuOpened = false;\n\n @property({ type: String }) openMenu = '';\n\n @property({ attribute: false }) modal?: ModalManagerInterface;\n\n @property({ attribute: false })\n sharedObserver?: SharedResizeObserverInterface;\n\n @property({ type: Boolean, reflect: true }) loaded: boolean = false;\n\n @state() openMenuState: 'overlay' | 'shift' = 'shift';\n\n @query('#frame') private frame!: HTMLDivElement;\n\n disconnectedCallback() {\n this.sharedObserver?.removeObserver({\n handler: this,\n target: this.frame,\n });\n }\n\n firstUpdated(pp: any): void {\n console.log('first updated item-nav', this.modal, pp);\n if (!this.modal) {\n this.createModal();\n }\n\n this.startResizeObserver();\n }\n\n updated(changed: PropertyValues) {\n if (changed.has('modal')) {\n if (!this.modal) {\n this.createModal();\n }\n }\n if (changed.has('sharedObserver')) {\n if (!this.sharedObserver) {\n this.startResizeObserver();\n }\n }\n }\n\n handleResize(entry: ResizeObserverEntry): void {\n const { width } = entry.contentRect;\n if (width <= 600) {\n this.openMenuState = 'overlay';\n return;\n }\n this.openMenuState = 'shift';\n }\n\n private startResizeObserver(): void {\n if (!this.sharedObserver) {\n this.sharedObserver = new SharedResizeObserver();\n }\n this.sharedObserver.addObserver({\n handler: this,\n target: this.frame,\n });\n }\n\n get loaderTitle() {\n return this.viewportInFullscreen ? 'Internet Archive' : '';\n }\n\n render(): TemplateResult {\n const displayReaderClass = this.loaded ? '' : 'hide';\n return html`\n <div id=\"frame\" class=${`${this.menuClass}`}>\n <slot name=\"theater-header\"></slot>\n <div class=\"menu-and-reader\">\n ${this.shouldRenderMenu ? this.renderSideMenu : nothing}\n <div id=\"reader\" class=${displayReaderClass}>\n ${this.renderViewport}\n </div>\n ${!this.loaded\n ? html` <div class=\"loading-area\">\n <div class=\"loading-view\">\n <ia-itemnav-loader\n .title=${this.loaderTitle}\n ></ia-itemnav-loader>\n </div>\n </div>`\n : nothing}\n </div>\n </div>\n `;\n }\n\n get BooksViewer(): TemplateResult {\n const slotVisibility = !this.loaded ? 'opacity: 0;' : 'opacity: 1;';\n\n return html`\n <book-navigator\n .modal=${this.modal}\n .baseHost=${this.baseHost}\n .book=${this.item}\n ?signedIn=${this.signedIn}\n ?sideMenuOpen=${this.menuOpened}\n .sharedObserver=${this.sharedObserver}\n @ViewportInFullScreen=${this.manageViewportFullscreen}\n @loadingStateUpdated=${this.loadingStateUpdated}\n @updateSideMenu=${this.manageSideMenuEvents}\n @menuUpdated=${this.setMenuContents}\n @menuShortcutsUpdated=${this.setMenuShortcuts}\n >\n <div slot=\"theater-main\" style=${slotVisibility}>\n <slot name=\"theater-main\"></slot>\n </div>\n </book-navigator>\n `;\n }\n\n get renderViewport(): TemplateResult | typeof nothing {\n if (!this.item) {\n return nothing;\n }\n if (this.itemType === 'bookreader') {\n return this.BooksViewer;\n }\n return nothing;\n }\n\n loadingStateUpdated(e: IntLoadingStateUpdatedEvent): void {\n const { loaded } = e.detail;\n this.loaded = !!loaded;\n console.log('******loadingStateUpdated', e.detail);\n }\n\n /** Creates modal DOM & attaches to `<body>` */\n private createModal(): void {\n this.modal = document.createElement(\n 'modal-manager'\n ) as ModalManagerInterface;\n document.body.appendChild(this.modal);\n }\n /* End Modal management */\n\n /** Fullscreen Management */\n manageViewportFullscreen(e: IntManageFullscreenEvent): void {\n this.viewportInFullscreen = !!e.detail.isFullScreen;\n this.dispatchEvent(\n new CustomEvent('ViewportInFullScreen', {\n detail: e.detail,\n }) as IntManageFullscreenEvent\n );\n }\n /** End Fullscreen Management */\n\n /** Side menu */\n get shouldRenderMenu(): boolean {\n return !!this.menuContents.length;\n }\n\n toggleMenu(): void {\n this.menuOpened = !this.menuOpened;\n }\n\n closeMenu(): void {\n this.menuOpened = false;\n }\n\n setOpenMenu(e: IntSetOpenMenuEvent): void {\n const { id } = e.detail;\n this.openMenu = id === this.openMenu ? '' : id;\n }\n\n setMenuContents(e: IntSetMenuContentsEvent): void {\n const updatedContents = [...e.detail];\n this.menuContents = updatedContents;\n }\n\n setMenuShortcuts(e: IntSetMenuShortcutsEvent) {\n this.menuShortcuts = [...e.detail];\n }\n\n /** Toggles Side Menu & Sets viewable subpanel */\n manageSideMenuEvents(e: IntManageSideMenuEvent): void {\n const { menuId, action } = e.detail;\n if (!menuId) {\n return;\n }\n\n if (action === 'open') {\n this.openShortcut(menuId);\n } else if (action === 'toggle') {\n this.openMenu = menuId;\n this.toggleMenu();\n }\n }\n\n get menuToggleButton() {\n // <ia-icon icon=\"ellipses\" style=\"width: var(--iconWidth); height: var(--iconHeight);\"></ia-icon>\n return html`\n <button\n class=\"toggle-menu\"\n @click=${this.toggleMenu}\n title=\"Toggle theater side panels\"\n >\n <div>\n <ia-icon-ellipses\n style=\"width: var(--iconWidth); height: var(--iconHeight);\"\n ></ia-icon-ellipses>\n </div>\n </button>\n `;\n }\n\n get renderSideMenu(): TemplateResult {\n const drawerState = this.menuOpened ? '' : 'hidden';\n\n return html`\n <nav>\n <div class=\"minimized\">${this.shortcuts} ${this.menuToggleButton}</div>\n <div id=\"menu\" class=${drawerState}>\n <ia-menu-slider\n .menus=${this.menuContents}\n .selectedMenu=${this.openMenu}\n @menuTypeSelected=${this.setOpenMenu}\n @menuSliderClosed=${this.closeMenu}\n manuallyHandleClose\n open\n ></ia-menu-slider>\n </div>\n </nav>\n `;\n }\n /** End Side menu */\n\n /** Menu Shortcuts */\n openShortcut(selectedMenuId = ''): void {\n this.openMenu = selectedMenuId;\n this.menuOpened = true;\n }\n\n get shortcuts(): TemplateResult {\n const shortcuts = this.menuShortcuts.map(({ icon, id }) => {\n if (id === 'fullscreen') {\n return html`${icon}`;\n }\n\n return html`\n <button class=\"shortcut ${id}\" @click=\"${() => this.openShortcut(id)}\">\n ${icon}\n </button>\n `;\n });\n return html`<div class=\"shortcuts\">${shortcuts}</div>`;\n }\n /** End Menu Shortcuts */\n\n /** Misc Render */\n get menuClass(): string {\n const drawerState = this.menuOpened ? 'open' : '';\n const fullscreenState = this.viewportInFullscreen ? 'fullscreen' : '';\n return `${drawerState} ${fullscreenState} ${this.openMenuState}`;\n }\n\n static get styles() {\n const subnavWidth = css`var(--menuWidth, 320px)`;\n const transitionTiming = css`var(--animationTiming, 200ms)`;\n const transitionEffect = css`transform ${transitionTiming} ease-out`;\n const menuMargin = css`var(--theaterMenuMargin, 42px)`;\n const theaterBg = css`var(--theaterBgColor, #000)`;\n\n return css`\n :host,\n #frame,\n #reader,\n .menu-and-reader {\n min-height: inherit;\n height: inherit;\n position: relative;\n overflow: hidden;\n display: block;\n }\n\n #frame {\n background-color: ${theaterBg};\n color-scheme: dark;\n }\n\n #frame.fullscreen {\n position: fixed;\n top: 0;\n bottom: 0;\n left: 0;\n right: 0;\n z-index: 9;\n }\n\n #frame.fullscreen,\n #frame.fullscreen #reader {\n height: 100vh;\n }\n\n .loading-area {\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n height: inherit;\n min-height: inherit;\n }\n\n .loading-view {\n display: flex;\n align-items: center;\n justify-content: center;\n min-height: inherit;\n height: inherit;\n }\n\n ia-itemnav-loader {\n display: block;\n width: 100%;\n }\n\n .hidden {\n height: 1px;\n width: 1px;\n }\n\n button {\n cursor: pointer;\n padding: 0;\n border: 0;\n }\n\n button:focus,\n button:active {\n outline: none;\n }\n\n .menu-and-reader {\n position: relative;\n }\n\n nav button {\n background: none;\n }\n\n nav .minimized {\n background: rgba(0, 0, 0, 0.7);\n padding-top: 6px;\n position: absolute;\n width: ${menuMargin};\n z-index: 2;\n left: 0;\n border-bottom-right-radius: 5%;\n }\n\n nav .minimized button {\n width: var(--iconWidth);\n height: var(--iconHeight);\n margin-bottom: 0.2rem;\n margin: auto;\n display: inline-flex;\n vertical-align: middle;\n -webkit-box-align: center;\n align-items: center;\n -webkit-box-pack: center;\n justify-content: center;\n width: ${menuMargin};\n height: ${menuMargin};\n }\n\n nav .minimized button.toggle-menu > * {\n border: 2px solid var(--iconStrokeColor);\n border-radius: var(--iconWidth);\n width: var(--iconWidth);\n height: var(--iconHeight);\n margin: auto;\n }\n\n ia-icon-ellipses {\n width: var(--iconWidth);\n height: var(--iconHeight);\n }\n\n #menu {\n position: absolute;\n top: 0;\n bottom: 0;\n left: 0;\n z-index: 3;\n overflow: hidden;\n transform: translateX(-${subnavWidth});\n width: ${subnavWidth};\n transform: translateX(calc(${subnavWidth} * -1));\n transition: ${transitionEffect};\n }\n\n #reader {\n position: relative;\n z-index: 1;\n /* transition: ${transitionEffect}; */\n transform: translateX(0);\n width: 100%;\n }\n\n .open.overlay #reader {\n transition: none;\n }\n\n .open #menu {\n width: ${subnavWidth};\n transform: translateX(0);\n transition: ${transitionEffect};\n }\n\n .open.shift #reader {\n width: calc(100% - var(--menuWidth));\n float: right;\n transition: ${transitionEffect};\n }\n `;\n }\n}\n\ncustomElements.define('ia-menu-slider', IAMenuSlider);\n"]}
1
+ {"version":3,"file":"item-navigator.js","sourceRoot":"","sources":["../../src/item-navigator.ts"],"names":[],"mappings":"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","sourcesContent":["import {\n css,\n html,\n LitElement,\n customElement,\n property,\n state,\n query,\n PropertyValues,\n CSSResult,\n} from 'lit-element';\nimport { nothing, TemplateResult } from 'lit-html';\nimport { MetadataResponse } from '@internetarchive/search-service';\nimport {\n SharedResizeObserver,\n SharedResizeObserverResizeHandlerInterface,\n} from '@internetarchive/shared-resize-observer';\n// @ts-ignore\nimport { IAMenuSlider } from '@internetarchive/ia-menu-slider';\nimport '@internetarchive/ia-menu-slider';\n\nimport { ModalManagerInterface } from '@internetarchive/modal-manager';\nimport '@internetarchive/icon-ellipses/icon-ellipses';\nimport './loader';\n\nimport {\n IntManageSideMenuEvent,\n IntSetOpenMenuEvent,\n IntSetMenuContentsEvent,\n IntSetMenuShortcutsEvent,\n IntLoadingStateUpdatedEvent,\n IntManageFullscreenEvent,\n} from './interfaces/event-interfaces';\n\nimport { IntMenuProvider, IntMenuShortcut } from './interfaces/menu-interfaces';\nimport './no-theater-available';\n@customElement('ia-item-navigator')\nexport class ItemNavigator\n extends LitElement\n implements SharedResizeObserverResizeHandlerInterface {\n @property({\n type: Object,\n converter: (value: string | MetadataResponse | null): MetadataResponse => {\n if (value && typeof value === 'string') {\n return new MetadataResponse(JSON.parse(atob(value)));\n }\n return value as MetadataResponse;\n },\n })\n item: MetadataResponse | undefined = undefined;\n\n @property({ type: String }) itemType = '';\n\n @property({ type: String }) baseHost = 'archive.org';\n\n @property({\n converter: (arg: string | boolean | null) => {\n if (typeof arg === 'boolean') {\n return arg;\n }\n return arg === 'true';\n },\n })\n signedIn = false;\n\n @property({\n type: Array,\n hasChanged: (newVal: Array<object>, oldVal: Array<object>) => {\n if (newVal !== oldVal) {\n return true;\n }\n return false;\n },\n })\n @property({ type: Array })\n menuContents: IntMenuProvider[] = [];\n\n @property({ type: Array }) menuShortcuts: IntMenuShortcut[] = [];\n\n @property({ type: Boolean, reflect: true }) viewportInFullscreen:\n | boolean\n | null = null;\n\n @property({ type: Boolean }) menuOpened = false;\n\n @property({ type: String }) openMenu = '';\n\n @property({ attribute: false }) modal?: ModalManagerInterface;\n\n @property({ attribute: false })\n sharedObserver?: SharedResizeObserver;\n\n @property({ reflect: true, attribute: true }) loaded: boolean | null = null;\n\n @state() openMenuState: 'overlay' | 'shift' = 'shift';\n\n @query('#frame') private frame!: HTMLDivElement;\n\n @query('slot[name=\"theater-header\"]') private headerSlot!: HTMLDivElement;\n\n disconnectedCallback() {\n this.sharedObserver?.removeObserver({\n handler: this,\n target: this.frame,\n });\n }\n\n firstUpdated(): void {\n if (!this.modal) {\n this.createModal();\n }\n\n this.startResizeObserver();\n }\n\n updated(changed: PropertyValues) {\n if (changed.has('modal')) {\n if (!this.modal) {\n this.createModal();\n }\n }\n if (changed.has('sharedObserver')) {\n if (!this.sharedObserver) {\n this.startResizeObserver();\n }\n }\n }\n\n handleResize(entry: ResizeObserverEntry): void {\n const { width } = entry.contentRect;\n if (width <= 600) {\n this.openMenuState = 'overlay';\n return;\n }\n this.openMenuState = 'shift';\n }\n\n private startResizeObserver(): void {\n if (!this.sharedObserver) {\n this.sharedObserver = new SharedResizeObserver();\n }\n this.sharedObserver.addObserver({\n handler: this,\n target: this.frame,\n });\n }\n\n get loaderTitle() {\n return this.viewportInFullscreen ? 'Internet Archive' : '';\n }\n\n get readerHeightStyle(): string {\n const calcFSHeight = `calc(100vh - ${this.headerSlot?.offsetHeight}px)`;\n return this.viewportInFullscreen ? `height: ${calcFSHeight}` : '';\n }\n\n handleHeaderSlotChange(e: Event) {\n console.log('~~~~ handleHeaderSlotChange', e);\n }\n\n get loadingArea() {\n return html`\n <div class=\"loading-area\">\n <div class=\"loading-view\">\n <ia-itemnav-loader .title=${this.loaderTitle}></ia-itemnav-loader>\n </div>\n </div>\n `;\n }\n\n render(): TemplateResult {\n const displayReaderClass = this.loaded ? '' : 'hide';\n return html`\n <div id=\"frame\" class=${`${this.menuClass}`}>\n <div class=\"menu-and-reader\">\n ${this.shouldRenderMenu ? this.renderSideMenu : nothing}\n <slot\n name=\"theater-header\"\n @slotchange=${this.handleHeaderSlotChange}\n ></slot>\n <div\n id=\"reader\"\n class=${displayReaderClass}\n style=${this.readerHeightStyle}\n >\n ${this.renderViewport}\n </div>\n ${!this.loaded ? this.loadingArea : nothing}\n </div>\n </div>\n `;\n }\n\n get noTheaterView() {\n return html`<ia-no-theater-available\n .identifier=${this.item?.metadata?.identifier}\n @loadingStateUpdated=${this.loadingStateUpdated}\n ></ia-no-theater-available>`;\n }\n\n get theaterSlot() {\n return html`\n <slot name=\"theater-main\" style=${this.readerHeightStyle}></slot>\n `;\n }\n\n get BooksViewer(): TemplateResult {\n const slotVisibility = !this.loaded ? 'opacity: 0;' : 'opacity: 1;';\n\n return html`\n <book-navigator\n .modal=${this.modal}\n .baseHost=${this.baseHost}\n .book=${this.item}\n ?signedIn=${this.signedIn}\n ?sideMenuOpen=${this.menuOpened}\n .sharedObserver=${this.sharedObserver}\n @ViewportInFullScreen=${this.manageViewportFullscreen}\n @loadingStateUpdated=${this.loadingStateUpdated}\n @updateSideMenu=${this.manageSideMenuEvents}\n @menuUpdated=${this.setMenuContents}\n @menuShortcutsUpdated=${this.setMenuShortcuts}\n >\n <div slot=\"theater-main\" style=${slotVisibility}>\n ${this.theaterSlot}\n </div>\n </book-navigator>\n `;\n }\n\n get renderViewport(): TemplateResult | typeof nothing {\n if (!this.item) {\n return nothing;\n }\n if (this.itemType === 'bookreader') {\n return this.BooksViewer;\n }\n return this.noTheaterView;\n }\n\n loadingStateUpdated(e: IntLoadingStateUpdatedEvent): void {\n const { loaded } = e.detail;\n this.loaded = !!loaded;\n }\n\n /** Creates modal DOM & attaches to `<body>` */\n private createModal(): void {\n this.modal = document.createElement(\n 'modal-manager'\n ) as ModalManagerInterface;\n document.body.appendChild(this.modal);\n }\n /* End Modal management */\n\n /** Fullscreen Management */\n manageViewportFullscreen(e: IntManageFullscreenEvent): void {\n const fullscreenStatus = !!e.detail.isFullScreen;\n this.viewportInFullscreen = !fullscreenStatus ? null : fullscreenStatus;\n\n const event = new CustomEvent('fullscreenToggled', {\n detail: e.detail,\n }) as IntManageFullscreenEvent;\n\n this.dispatchEvent(event);\n }\n /** End Fullscreen Management */\n\n /** Side menu */\n get shouldRenderMenu(): boolean {\n return !!this.menuContents.length;\n }\n\n toggleMenu(): void {\n this.menuOpened = !this.menuOpened;\n }\n\n closeMenu(): void {\n this.menuOpened = false;\n }\n\n setOpenMenu(e: IntSetOpenMenuEvent): void {\n const { id } = e.detail;\n this.openMenu = id === this.openMenu ? '' : id;\n }\n\n setMenuContents(e: IntSetMenuContentsEvent): void {\n const updatedContents = [...e.detail];\n this.menuContents = updatedContents;\n }\n\n setMenuShortcuts(e: IntSetMenuShortcutsEvent) {\n this.menuShortcuts = [...e.detail];\n }\n\n /** Toggles Side Menu & Sets viewable subpanel */\n manageSideMenuEvents(e: IntManageSideMenuEvent): void {\n const { menuId, action } = e.detail;\n if (!menuId) {\n return;\n }\n\n if (action === 'open') {\n this.openShortcut(menuId);\n } else if (action === 'toggle') {\n this.openMenu = menuId;\n this.toggleMenu();\n }\n }\n\n get menuToggleButton() {\n return html`\n <button\n class=\"toggle-menu\"\n @click=${this.toggleMenu}\n title=\"Toggle theater side panels\"\n >\n <div>\n <ia-icon-ellipses\n style=\"width: var(--iconWidth); height: var(--iconHeight);\"\n ></ia-icon-ellipses>\n </div>\n </button>\n `;\n }\n\n get renderSideMenu(): TemplateResult {\n const drawerState = this.menuOpened ? '' : 'hidden';\n\n return html`\n <nav>\n <div class=\"minimized\">${this.shortcuts} ${this.menuToggleButton}</div>\n <div id=\"menu\" class=${drawerState}>\n <ia-menu-slider\n .menus=${this.menuContents}\n .selectedMenu=${this.openMenu}\n @menuTypeSelected=${this.setOpenMenu}\n @menuSliderClosed=${this.closeMenu}\n manuallyHandleClose\n open\n ></ia-menu-slider>\n </div>\n </nav>\n `;\n }\n /** End Side menu */\n\n /** Menu Shortcuts */\n openShortcut(selectedMenuId = ''): void {\n this.openMenu = selectedMenuId;\n this.menuOpened = true;\n }\n\n get shortcuts(): TemplateResult {\n const shortcuts = this.menuShortcuts.map(({ icon, id }) => {\n if (id === 'fullscreen') {\n return html`${icon}`;\n }\n\n return html`\n <button class=\"shortcut ${id}\" @click=\"${() => this.openShortcut(id)}\">\n ${icon}\n </button>\n `;\n });\n return html`<div class=\"shortcuts\">${shortcuts}</div>`;\n }\n /** End Menu Shortcuts */\n\n /** Misc Render */\n get menuClass(): string {\n const drawerState = this.menuOpened ? 'open' : '';\n const fullscreenState = this.viewportInFullscreen ? 'fullscreen' : '';\n return `${drawerState} ${fullscreenState} ${this.openMenuState}`;\n }\n\n static get styles(): CSSResult {\n const subnavWidth = css`var(--menuWidth, 320px)`;\n const transitionTiming = css`var(--animationTiming, 200ms)`;\n const transitionEffect = css`transform ${transitionTiming} ease-out`;\n const menuMargin = css`var(--theaterMenuMargin, 42px)`;\n const theaterBg = css`var(--theaterBgColor, #000)`;\n\n return css`\n :host,\n #frame,\n .menu-and-reader {\n min-height: inherit;\n height: inherit;\n position: relative;\n overflow: hidden;\n display: block;\n }\n\n slot {\n display: block;\n overflow: hidden;\n }\n\n #frame {\n background-color: ${theaterBg};\n color-scheme: dark;\n }\n\n #frame.fullscreen {\n position: fixed;\n top: 0;\n bottom: 0;\n left: 0;\n right: 0;\n z-index: 9;\n }\n\n .loading-area {\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n height: inherit;\n min-height: inherit;\n }\n\n .loading-view {\n display: flex;\n align-items: center;\n justify-content: center;\n min-height: inherit;\n height: inherit;\n }\n\n ia-itemnav-loader {\n display: block;\n width: 100%;\n }\n\n .hidden {\n height: 1px;\n width: 1px;\n }\n\n button {\n cursor: pointer;\n padding: 0;\n border: 0;\n }\n\n button:focus,\n button:active {\n outline: none;\n }\n\n .menu-and-reader {\n position: relative;\n }\n\n nav button {\n background: none;\n }\n\n nav .minimized {\n background: rgba(0, 0, 0, 0.7);\n padding-top: 6px;\n position: absolute;\n width: ${menuMargin};\n z-index: 2;\n left: 0;\n border-bottom-right-radius: 5%;\n }\n\n nav .minimized button {\n width: var(--iconWidth);\n height: var(--iconHeight);\n margin-bottom: 0.2rem;\n margin: auto;\n display: inline-flex;\n vertical-align: middle;\n -webkit-box-align: center;\n align-items: center;\n -webkit-box-pack: center;\n justify-content: center;\n width: ${menuMargin};\n height: ${menuMargin};\n }\n\n nav .minimized button.toggle-menu > * {\n border: 2px solid var(--iconStrokeColor);\n border-radius: var(--iconWidth);\n width: var(--iconWidth);\n height: var(--iconHeight);\n margin: auto;\n }\n\n ia-icon-ellipses {\n width: var(--iconWidth);\n height: var(--iconHeight);\n }\n\n #menu {\n position: absolute;\n top: 0;\n bottom: 0;\n left: 0;\n z-index: 3;\n overflow: hidden;\n transform: translateX(-${subnavWidth});\n width: ${subnavWidth};\n transform: translateX(calc(${subnavWidth} * -1));\n transition: ${transitionEffect};\n }\n\n #reader {\n position: relative;\n z-index: 1;\n /* transition: ${transitionEffect}; */\n transform: translateX(0);\n width: 100%;\n }\n\n .open.overlay #reader {\n transition: none;\n }\n\n .open #menu {\n width: ${subnavWidth};\n transform: translateX(0);\n transition: ${transitionEffect};\n }\n\n .open.shift slot[name='theater-header'],\n .open.shift #reader {\n width: calc(100% - var(--menuWidth));\n float: right;\n transition: ${transitionEffect};\n }\n `;\n }\n}\n\ncustomElements.define('ia-menu-slider', IAMenuSlider);\n"]}
@@ -0,0 +1,9 @@
1
+ import { LitElement, TemplateResult, PropertyValues, CSSResult } from 'lit-element';
2
+ export declare class IANoTheaterAvailable extends LitElement {
3
+ identifier?: string;
4
+ emitLoaded(): void;
5
+ updated(changed: PropertyValues): void;
6
+ get downloadUrl(): string;
7
+ render(): TemplateResult;
8
+ static get styles(): CSSResult;
9
+ }
@@ -0,0 +1,79 @@
1
+ import { __decorate } from "tslib";
2
+ import { LitElement, customElement, property, html, css, } from 'lit-element';
3
+ let IANoTheaterAvailable = class IANoTheaterAvailable extends LitElement {
4
+ constructor() {
5
+ super(...arguments);
6
+ this.identifier = '';
7
+ }
8
+ emitLoaded() {
9
+ this.dispatchEvent(new CustomEvent('loadingStateUpdated', {
10
+ detail: { loaded: true },
11
+ }));
12
+ }
13
+ updated(changed) {
14
+ if (changed.has('identifier')) {
15
+ this.emitLoaded();
16
+ }
17
+ }
18
+ get downloadUrl() {
19
+ return `/download/${this.identifier}`;
20
+ }
21
+ render() {
22
+ return html `
23
+ <section>
24
+ <h2>THERE IS NO PREVIEW AVAILABLE FOR THIS ITEM</h2>
25
+ <p>
26
+ This item does not appear to have any files that can be experienced on
27
+ Archive.org. <br />
28
+ Please download files in this item to interact with them on your
29
+ computer.
30
+ </p>
31
+ <a href=${this.downloadUrl}>Show all files</a>
32
+ </section>
33
+ `;
34
+ }
35
+ static get styles() {
36
+ return css `
37
+ :host {
38
+ color: var(--primaryTextColor, #fff);
39
+ text-align: center;
40
+ }
41
+ section {
42
+ margin: 10% auto 0;
43
+ padding: 0 5%;
44
+ }
45
+ p {
46
+ font-size: 1.4rem;
47
+ }
48
+ a {
49
+ color: var(--primaryTextColor, #fff);
50
+ background-color: rgb(25, 72, 128);
51
+ min-height: 35px;
52
+ outline: none;
53
+ cursor: pointer;
54
+ line-height: normal;
55
+ border-radius: 0.4rem;
56
+ text-align: center;
57
+ vertical-align: middle;
58
+ font-size: 1.4rem;
59
+ font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
60
+ display: inline-block;
61
+ padding: 0.85rem 1.2rem;
62
+ border: 1px solid rgb(197, 209, 223);
63
+ white-space: nowrap;
64
+ appearance: auto;
65
+ box-sizing: border-box;
66
+ user-select: none;
67
+ text-decoration: none;
68
+ }
69
+ `;
70
+ }
71
+ };
72
+ __decorate([
73
+ property({ type: String })
74
+ ], IANoTheaterAvailable.prototype, "identifier", void 0);
75
+ IANoTheaterAvailable = __decorate([
76
+ customElement('ia-no-theater-available')
77
+ ], IANoTheaterAvailable);
78
+ export { IANoTheaterAvailable };
79
+ //# sourceMappingURL=no-theater-available.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"no-theater-available.js","sourceRoot":"","sources":["../../src/no-theater-available.ts"],"names":[],"mappings":";AAAA,OAAO,EACL,UAAU,EACV,aAAa,EACb,QAAQ,EACR,IAAI,EAIJ,GAAG,GACJ,MAAM,aAAa,CAAC;AAKrB,IAAa,oBAAoB,GAAjC,MAAa,oBAAqB,SAAQ,UAAU;IAApD;;QAC8B,eAAU,GAAY,EAAE,CAAC;IAuEvD,CAAC;IArEC,UAAU;QACR,IAAI,CAAC,aAAa,CAChB,IAAI,WAAW,CAAC,qBAAqB,EAAE;YACrC,MAAM,EAAE,EAAE,MAAM,EAAE,IAAI,EAAE;SACzB,CAAgC,CAClC,CAAC;IACJ,CAAC;IAED,OAAO,CAAC,OAAuB;QAC7B,IAAI,OAAO,CAAC,GAAG,CAAC,YAAY,CAAC,EAAE;YAC7B,IAAI,CAAC,UAAU,EAAE,CAAC;SACnB;IACH,CAAC;IAED,IAAI,WAAW;QACb,OAAO,aAAa,IAAI,CAAC,UAAU,EAAE,CAAC;IACxC,CAAC;IAED,MAAM;QACJ,OAAO,IAAI,CAAA;;;;;;;;;kBASG,IAAI,CAAC,WAAW;;KAE7B,CAAC;IACJ,CAAC;IAED,MAAM,KAAK,MAAM;QACf,OAAO,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KAiCT,CAAC;IACJ,CAAC;CACF,CAAA;AAvE6B;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;wDAA0B;AAD1C,oBAAoB;IADhC,aAAa,CAAC,yBAAyB,CAAC;GAC5B,oBAAoB,CAwEhC;SAxEY,oBAAoB","sourcesContent":["import {\n LitElement,\n customElement,\n property,\n html,\n TemplateResult,\n PropertyValues,\n CSSResult,\n css,\n} from 'lit-element';\n\nimport { IntLoadingStateUpdatedEvent } from './interfaces/event-interfaces';\n\n@customElement('ia-no-theater-available')\nexport class IANoTheaterAvailable extends LitElement {\n @property({ type: String }) identifier?: string = '';\n\n emitLoaded(): void {\n this.dispatchEvent(\n new CustomEvent('loadingStateUpdated', {\n detail: { loaded: true },\n }) as IntLoadingStateUpdatedEvent\n );\n }\n\n updated(changed: PropertyValues): void {\n if (changed.has('identifier')) {\n this.emitLoaded();\n }\n }\n\n get downloadUrl(): string {\n return `/download/${this.identifier}`;\n }\n\n render(): TemplateResult {\n return html`\n <section>\n <h2>THERE IS NO PREVIEW AVAILABLE FOR THIS ITEM</h2>\n <p>\n This item does not appear to have any files that can be experienced on\n Archive.org. <br />\n Please download files in this item to interact with them on your\n computer.\n </p>\n <a href=${this.downloadUrl}>Show all files</a>\n </section>\n `;\n }\n\n static get styles(): CSSResult {\n return css`\n :host {\n color: var(--primaryTextColor, #fff);\n text-align: center;\n }\n section {\n margin: 10% auto 0;\n padding: 0 5%;\n }\n p {\n font-size: 1.4rem;\n }\n a {\n color: var(--primaryTextColor, #fff);\n background-color: rgb(25, 72, 128);\n min-height: 35px;\n outline: none;\n cursor: pointer;\n line-height: normal;\n border-radius: 0.4rem;\n text-align: center;\n vertical-align: middle;\n font-size: 1.4rem;\n font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;\n display: inline-block;\n padding: 0.85rem 1.2rem;\n border: 1px solid rgb(197, 209, 223);\n white-space: nowrap;\n appearance: auto;\n box-sizing: border-box;\n user-select: none;\n text-decoration: none;\n }\n `;\n }\n}\n"]}
@@ -0,0 +1,17 @@
1
+ import { ModalManagerInterface } from '@internetarchive/modal-manager';
2
+ import { MetadataResponse } from '@internetarchive/search-service';
3
+ import { SharedResizeObserver } from '@internetarchive/shared-resize-observer';
4
+ import { LitElement } from 'lit-element';
5
+ export declare class BookNavigator extends LitElement {
6
+ modal?: ModalManagerInterface;
7
+ baseHost?: string;
8
+ book?: MetadataResponse;
9
+ signedIn?: boolean | null;
10
+ sideMenuOpen?: boolean;
11
+ sharedObserver?: SharedResizeObserver;
12
+ addMenuShortcut(menuId: string): string;
13
+ removeMenuShortcut(menuId: string): string;
14
+ sortMenuShortcuts(): void;
15
+ emitMenuShortcutsUpdated(): void;
16
+ render(): import("lit-element").TemplateResult;
17
+ }
@@ -0,0 +1,42 @@
1
+ import { __decorate } from "tslib";
2
+ import { html, customElement, LitElement, property } from 'lit-element';
3
+ let BookNavigator = class BookNavigator extends LitElement {
4
+ constructor() {
5
+ super(...arguments);
6
+ this.signedIn = null;
7
+ }
8
+ addMenuShortcut(menuId) {
9
+ return menuId;
10
+ }
11
+ removeMenuShortcut(menuId) {
12
+ return menuId;
13
+ }
14
+ sortMenuShortcuts() { }
15
+ emitMenuShortcutsUpdated() { }
16
+ render() {
17
+ return html ` <p>foo</p> `;
18
+ }
19
+ };
20
+ __decorate([
21
+ property({ attribute: false })
22
+ ], BookNavigator.prototype, "modal", void 0);
23
+ __decorate([
24
+ property({ type: String })
25
+ ], BookNavigator.prototype, "baseHost", void 0);
26
+ __decorate([
27
+ property({ type: Object })
28
+ ], BookNavigator.prototype, "book", void 0);
29
+ __decorate([
30
+ property({ type: Boolean, reflect: true })
31
+ ], BookNavigator.prototype, "signedIn", void 0);
32
+ __decorate([
33
+ property({ type: Boolean })
34
+ ], BookNavigator.prototype, "sideMenuOpen", void 0);
35
+ __decorate([
36
+ property({ attribute: false })
37
+ ], BookNavigator.prototype, "sharedObserver", void 0);
38
+ BookNavigator = __decorate([
39
+ customElement('book-navigator')
40
+ ], BookNavigator);
41
+ export { BookNavigator };
42
+ //# sourceMappingURL=book-nav-stub.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"book-nav-stub.js","sourceRoot":"","sources":["../../test/book-nav-stub.ts"],"names":[],"mappings":";AAGA,OAAO,EAAE,IAAI,EAAE,aAAa,EAAE,UAAU,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AAGxE,IAAa,aAAa,GAA1B,MAAa,aAAc,SAAQ,UAAU;IAA7C;;QAO8C,aAAQ,GAAoB,IAAI,CAAC;IAqB/E,CAAC;IAfC,eAAe,CAAC,MAAc;QAC5B,OAAO,MAAM,CAAC;IAChB,CAAC;IAED,kBAAkB,CAAC,MAAc;QAC/B,OAAO,MAAM,CAAC;IAChB,CAAC;IAED,iBAAiB,KAAI,CAAC;IAEtB,wBAAwB,KAAI,CAAC;IAE7B,MAAM;QACJ,OAAO,IAAI,CAAA,cAAc,CAAC;IAC5B,CAAC;CACF,CAAA;AA3BiC;IAA/B,QAAQ,CAAC,EAAE,SAAS,EAAE,KAAK,EAAE,CAAC;4CAA+B;AAElC;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;+CAAmB;AAElB;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;2CAAyB;AAER;IAA3C,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;+CAAkC;AAEhD;IAA5B,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;mDAAwB;AAEpB;IAA/B,QAAQ,CAAC,EAAE,SAAS,EAAE,KAAK,EAAE,CAAC;qDAAuC;AAX3D,aAAa;IADzB,aAAa,CAAC,gBAAgB,CAAC;GACnB,aAAa,CA4BzB;SA5BY,aAAa","sourcesContent":["import { ModalManagerInterface } from '@internetarchive/modal-manager';\nimport { MetadataResponse } from '@internetarchive/search-service';\nimport { SharedResizeObserver } from '@internetarchive/shared-resize-observer';\nimport { html, customElement, LitElement, property } from 'lit-element';\n\n@customElement('book-navigator')\nexport class BookNavigator extends LitElement {\n @property({ attribute: false }) modal?: ModalManagerInterface;\n\n @property({ type: String }) baseHost?: string;\n\n @property({ type: Object }) book?: MetadataResponse;\n\n @property({ type: Boolean, reflect: true }) signedIn?: boolean | null = null;\n\n @property({ type: Boolean }) sideMenuOpen?: boolean;\n\n @property({ attribute: false }) sharedObserver?: SharedResizeObserver;\n\n addMenuShortcut(menuId: string) {\n return menuId;\n }\n\n removeMenuShortcut(menuId: string) {\n return menuId;\n }\n\n sortMenuShortcuts() {}\n\n emitMenuShortcutsUpdated() {}\n\n render() {\n return html` <p>foo</p> `;\n }\n}\n"]}
@@ -1 +1,2 @@
1
1
  import '../src/item-navigator';
2
+ import '../test/book-nav-stub';