@internetarchive/collection-browser 1.1.1-alpha.5 → 1.2.0
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.
- package/dist/index.d.ts +9 -9
- package/dist/index.js +9 -9
- package/dist/index.js.map +1 -1
- package/dist/src/app-root.d.ts +1 -1
- package/dist/src/app-root.js +1 -1
- package/dist/src/app-root.js.map +1 -1
- package/dist/src/collection-browser.d.ts +11 -13
- package/dist/src/collection-browser.js +16 -35
- package/dist/src/collection-browser.js.map +1 -1
- package/dist/src/collection-facets/facets-template.d.ts +1 -1
- package/dist/src/collection-facets/facets-template.js +3 -3
- package/dist/src/collection-facets/facets-template.js.map +1 -1
- package/dist/src/collection-facets/more-facets-content.d.ts +5 -5
- package/dist/src/collection-facets/more-facets-content.js +7 -7
- package/dist/src/collection-facets/more-facets-content.js.map +1 -1
- package/dist/src/collection-facets/more-facets-pagination.js +3 -3
- package/dist/src/collection-facets/more-facets-pagination.js.map +1 -1
- package/dist/src/collection-facets/toggle-switch.js +1 -1
- package/dist/src/collection-facets/toggle-switch.js.map +1 -1
- package/dist/src/collection-facets.d.ts +5 -5
- package/dist/src/collection-facets.js +10 -10
- package/dist/src/collection-facets.js.map +1 -1
- package/dist/src/empty-placeholder.js +2 -2
- package/dist/src/empty-placeholder.js.map +1 -1
- package/dist/src/language-code-handler/language-code-handler.js +1 -1
- package/dist/src/language-code-handler/language-code-handler.js.map +1 -1
- package/dist/src/mediatype/mediatype-config.js +13 -13
- package/dist/src/mediatype/mediatype-config.js.map +1 -1
- package/dist/src/restoration-state-handler.d.ts +1 -1
- package/dist/src/restoration-state-handler.js +2 -2
- package/dist/src/restoration-state-handler.js.map +1 -1
- package/dist/src/sort-filter-bar/alpha-bar.d.ts +2 -2
- package/dist/src/sort-filter-bar/alpha-bar.js +1 -1
- package/dist/src/sort-filter-bar/alpha-bar.js.map +1 -1
- package/dist/src/sort-filter-bar/sort-filter-bar.d.ts +2 -2
- package/dist/src/sort-filter-bar/sort-filter-bar.js +9 -9
- package/dist/src/sort-filter-bar/sort-filter-bar.js.map +1 -1
- package/dist/src/tiles/grid/account-tile.d.ts +3 -3
- package/dist/src/tiles/grid/account-tile.js +3 -3
- package/dist/src/tiles/grid/account-tile.js.map +1 -1
- package/dist/src/tiles/grid/collection-tile.d.ts +2 -2
- package/dist/src/tiles/grid/collection-tile.js +4 -4
- package/dist/src/tiles/grid/collection-tile.js.map +1 -1
- package/dist/src/tiles/grid/item-tile.d.ts +6 -6
- package/dist/src/tiles/grid/item-tile.js +8 -8
- package/dist/src/tiles/grid/item-tile.js.map +1 -1
- package/dist/src/tiles/grid/styles/tile-grid-shared-styles.js +1 -1
- package/dist/src/tiles/grid/styles/tile-grid-shared-styles.js.map +1 -1
- package/dist/src/tiles/grid/tile-stats.js +6 -6
- package/dist/src/tiles/grid/tile-stats.js.map +1 -1
- package/dist/src/tiles/hover/hover-pane-controller.d.ts +1 -1
- package/dist/src/tiles/hover/hover-pane-controller.js.map +1 -1
- package/dist/src/tiles/hover/tile-hover-pane.d.ts +2 -2
- package/dist/src/tiles/hover/tile-hover-pane.js +1 -1
- package/dist/src/tiles/hover/tile-hover-pane.js.map +1 -1
- package/dist/src/tiles/image-block.d.ts +3 -3
- package/dist/src/tiles/image-block.js +2 -2
- package/dist/src/tiles/image-block.js.map +1 -1
- package/dist/src/tiles/item-image.d.ts +1 -1
- package/dist/src/tiles/item-image.js +1 -1
- package/dist/src/tiles/item-image.js.map +1 -1
- package/dist/src/tiles/list/tile-list-compact-header.d.ts +1 -1
- package/dist/src/tiles/list/tile-list-compact-header.js +1 -1
- package/dist/src/tiles/list/tile-list-compact-header.js.map +1 -1
- package/dist/src/tiles/list/tile-list-compact.d.ts +3 -3
- package/dist/src/tiles/list/tile-list-compact.js +6 -6
- package/dist/src/tiles/list/tile-list-compact.js.map +1 -1
- package/dist/src/tiles/list/tile-list.d.ts +3 -3
- package/dist/src/tiles/list/tile-list.js +8 -8
- package/dist/src/tiles/list/tile-list.js.map +1 -1
- package/dist/src/tiles/mediatype-icon.js +1 -1
- package/dist/src/tiles/mediatype-icon.js.map +1 -1
- package/dist/src/tiles/overlay/icon-overlay.js +2 -2
- package/dist/src/tiles/overlay/icon-overlay.js.map +1 -1
- package/dist/src/tiles/overlay/icon-text-overlay.js +2 -2
- package/dist/src/tiles/overlay/icon-text-overlay.js.map +1 -1
- package/dist/src/tiles/overlay/text-overlay.js +2 -2
- package/dist/src/tiles/overlay/text-overlay.js.map +1 -1
- package/dist/src/tiles/tile-dispatcher.d.ts +10 -11
- package/dist/src/tiles/tile-dispatcher.js +8 -14
- package/dist/src/tiles/tile-dispatcher.js.map +1 -1
- package/dist/src/utils/format-date.js +2 -3
- package/dist/src/utils/format-date.js.map +1 -1
- package/index.ts +9 -9
- package/package.json +13 -14
- package/src/app-root.ts +2 -2
- package/src/collection-browser.ts +16 -31
- package/src/collection-facets/facets-template.ts +3 -3
- package/src/collection-facets/more-facets-content.ts +7 -7
- package/src/collection-facets/more-facets-pagination.ts +3 -3
- package/src/collection-facets/toggle-switch.ts +1 -1
- package/src/collection-facets.ts +10 -10
- package/src/empty-placeholder.ts +2 -2
- package/src/language-code-handler/language-code-handler.ts +1 -1
- package/src/mediatype/mediatype-config.ts +13 -13
- package/src/restoration-state-handler.ts +2 -2
- package/src/sort-filter-bar/alpha-bar.ts +3 -3
- package/src/sort-filter-bar/sort-filter-bar.ts +10 -10
- package/src/tiles/grid/account-tile.ts +4 -4
- package/src/tiles/grid/collection-tile.ts +5 -5
- package/src/tiles/grid/item-tile.ts +10 -10
- package/src/tiles/grid/styles/tile-grid-shared-styles.ts +1 -1
- package/src/tiles/grid/tile-stats.ts +6 -6
- package/src/tiles/hover/hover-pane-controller.ts +1 -1
- package/src/tiles/hover/tile-hover-pane.ts +2 -2
- package/src/tiles/image-block.ts +3 -3
- package/src/tiles/item-image.ts +2 -2
- package/src/tiles/list/tile-list-compact-header.ts +2 -2
- package/src/tiles/list/tile-list-compact.ts +7 -7
- package/src/tiles/list/tile-list.ts +8 -8
- package/src/tiles/mediatype-icon.ts +1 -1
- package/src/tiles/overlay/icon-overlay.ts +2 -2
- package/src/tiles/overlay/icon-text-overlay.ts +2 -2
- package/src/tiles/overlay/text-overlay.ts +2 -2
- package/src/tiles/tile-dispatcher.ts +10 -13
- package/src/utils/format-date.ts +3 -3
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { __decorate } from "tslib";
|
|
2
2
|
import { css, html, LitElement } from 'lit';
|
|
3
3
|
import { customElement, property } from 'lit/decorators.js';
|
|
4
|
-
import { mediatypeConfig } from '../mediatype/mediatype-config
|
|
4
|
+
import { mediatypeConfig } from '../mediatype/mediatype-config';
|
|
5
5
|
let MediatypeIcon = class MediatypeIcon extends LitElement {
|
|
6
6
|
constructor() {
|
|
7
7
|
super(...arguments);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"mediatype-icon.js","sourceRoot":"","sources":["../../../src/tiles/mediatype-icon.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAkB,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AAC5D,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAE5D,OAAO,EAAE,eAAe,EAAE,MAAM,
|
|
1
|
+
{"version":3,"file":"mediatype-icon.js","sourceRoot":"","sources":["../../../src/tiles/mediatype-icon.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAkB,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AAC5D,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAE5D,OAAO,EAAE,eAAe,EAAE,MAAM,+BAA+B,CAAC;AAGhE,IAAa,aAAa,GAA1B,MAAa,aAAc,SAAQ,UAAU;IAA7C;;QAK+B,aAAQ,GAAG,KAAK,CAAC;IAqEhD,CAAC;IAnEC,IAAY,gBAAgB;;QAC1B,MAAM,YAAY,GAAG,CAAC,QAAQ,EAAE,WAAW,EAAE,YAAY,CAAC,CAAC;QAC3D,MAAM,eAAe,GAAG,CAAC,OAAO,EAAE,cAAc,CAAC,CAAC;QAElD,IACE,IAAI,CAAC,SAAS,KAAK,QAAQ;aAC3B,MAAA,IAAI,CAAC,WAAW,0CAAE,IAAI,CAAC,EAAE,CAAC,EAAE,CAAC,YAAY,CAAC,OAAO,CAAC,EAAE,CAAC,IAAI,CAAC,CAAC,CAAA,EAC3D;YACA,OAAO,IAAI,CAAC;SACb;QACD,IACE,IAAI,CAAC,SAAS,KAAK,OAAO;aAC1B,MAAA,IAAI,CAAC,WAAW,0CAAE,IAAI,CAAC,EAAE,CAAC,EAAE,CAAC,eAAe,CAAC,OAAO,CAAC,EAAE,CAAC,IAAI,CAAC,CAAC,CAAA,EAC9D;YACA,OAAO,OAAO,CAAC;SAChB;QACD,OAAO,IAAI,CAAC,SAAS,IAAI,EAAE,CAAC;IAC9B,CAAC;IAED,MAAM;QACJ,MAAM,MAAM,GAAG,eAAe,CAAC,IAAI,CAAC,gBAAgB,CAAC,CAAC;QACtD,IAAI,CAAC,MAAM,EAAE;YACX,OAAO,IAAI,CAAA,EAAE,CAAC;SACf;QAED,OAAO,IAAI,CAAA;;;iBAGE,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,WAAW;iBACzC,MAAM,CAAC,IAAI;kCACM,MAAM,CAAC,KAAK;;UAEpC,MAAM,CAAC,IAAI;iCACY,MAAM,CAAC,IAAI;;KAEvC,CAAC;IACJ,CAAC;IAED,MAAM,KAAK,MAAM;QACf,OAAO,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;KA0BT,CAAC;IACJ,CAAC;CACF,CAAA;AAzE6B;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;gDAA+B;AAE/B;IAA1B,QAAQ,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,CAAC;kDAAmC;AAEhC;IAA5B,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;+CAAkB;AALnC,aAAa;IADzB,aAAa,CAAC,gBAAgB,CAAC;GACnB,aAAa,CA0EzB;SA1EY,aAAa","sourcesContent":["import { css, CSSResultGroup, html, LitElement } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\n\nimport { mediatypeConfig } from '../mediatype/mediatype-config';\n\n@customElement('mediatype-icon')\nexport class MediatypeIcon extends LitElement {\n @property({ type: String }) mediatype: string | undefined;\n\n @property({ type: Array }) collections: string[] | undefined;\n\n @property({ type: Boolean }) showText = false;\n\n private get displayMediatype(): string {\n const tvIdentifier = ['tvnews', 'tvarchive', 'television'];\n const radioIdentifier = ['radio', 'radioprogram'];\n\n if (\n this.mediatype === 'movies' &&\n this.collections?.some(id => tvIdentifier.indexOf(id) >= 0)\n ) {\n return 'tv';\n }\n if (\n this.mediatype === 'audio' &&\n this.collections?.some(id => radioIdentifier.indexOf(id) >= 0)\n ) {\n return 'radio';\n }\n return this.mediatype || '';\n }\n\n render() {\n const config = mediatypeConfig[this.displayMediatype];\n if (!config) {\n return html``;\n }\n\n return html`\n <div\n id=\"icon\"\n class=\"${this.showText ? 'show-text' : 'hide-text'}\"\n title=\"${config.text}\"\n style=\"--iconFillColor: ${config.color}\"\n >\n ${config.icon}\n <p class=\"status-text\">${config.text}</p>\n </div>\n `;\n }\n\n static get styles(): CSSResultGroup {\n return css`\n #icon {\n height: var(--iconHeight, 25px);\n }\n\n .status-text {\n font-size: 14px;\n color: #2c2c2c;\n margin: auto;\n display: block;\n text-align: var(--iconTextAlign, center);\n }\n\n #icon.hide-text p {\n display: none;\n }\n\n svg {\n height: var(--iconHeight, 10px);\n width: var(--iconWidth, 10px);\n pointer-events: none;\n }\n\n .fill-color {\n fill: var(--iconFillColor, '#000000');\n }\n `;\n }\n}\n"]}
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import { __decorate } from "tslib";
|
|
2
2
|
import { css, html, LitElement } from 'lit';
|
|
3
3
|
import { customElement, property } from 'lit/decorators.js';
|
|
4
|
-
import { restrictedIcon } from '../../assets/img/icons/restricted
|
|
5
|
-
import { loginRequiredIcon } from '../../assets/img/icons/login-required
|
|
4
|
+
import { restrictedIcon } from '../../assets/img/icons/restricted';
|
|
5
|
+
import { loginRequiredIcon } from '../../assets/img/icons/login-required';
|
|
6
6
|
let IconOverlay = class IconOverlay extends LitElement {
|
|
7
7
|
constructor() {
|
|
8
8
|
super(...arguments);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"icon-overlay.js","sourceRoot":"","sources":["../../../../src/tiles/overlay/icon-overlay.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAkB,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AAC5D,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAE5D,OAAO,EAAE,cAAc,EAAE,MAAM,
|
|
1
|
+
{"version":3,"file":"icon-overlay.js","sourceRoot":"","sources":["../../../../src/tiles/overlay/icon-overlay.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAkB,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AAC5D,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAE5D,OAAO,EAAE,cAAc,EAAE,MAAM,mCAAmC,CAAC;AACnE,OAAO,EAAE,iBAAiB,EAAE,MAAM,uCAAuC,CAAC;AAG1E,IAAa,WAAW,GAAxB,MAAa,WAAY,SAAQ,UAAU;IAA3C;;QAC+B,aAAQ,GAAG,KAAK,CAAC;QAEjB,kBAAa,GAAG,KAAK,CAAC;QAEtB,kBAAa,GAAG,KAAK,CAAC;IAkDrD,CAAC;IAhDC,MAAM;QACJ,OAAO,IAAI,CAAA,4BAA4B,IAAI,CAAC,QAAQ;QAChD,IAAI,CAAC,WAAW;WACb,CAAC;IACV,CAAC;IAED,IAAY,QAAQ;QAClB,OAAO,IAAI,CAAC,aAAa,CAAC,CAAC,CAAC,cAAc,CAAC,CAAC,CAAC,aAAa,CAAC;IAC7D,CAAC;IAED,IAAY,WAAW;QACrB,OAAO,IAAI,CAAC,aAAa,IAAI,CAAC,IAAI,CAAC,QAAQ;YACzC,CAAC,CAAC,IAAI,CAAA,GAAG,iBAAiB,EAAE;YAC5B,CAAC,CAAC,IAAI,CAAA,GAAG,cAAc,EAAE,CAAC;IAC9B,CAAC;IAED,MAAM,KAAK,MAAM;QACf,OAAO,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KA6BT,CAAC;IACJ,CAAC;CACF,CAAA;AAtD8B;IAA5B,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;6CAAkB;AAEjB;IAA5B,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;kDAAuB;AAEtB;IAA5B,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;kDAAuB;AALxC,WAAW;IADvB,aAAa,CAAC,cAAc,CAAC;GACjB,WAAW,CAuDvB;SAvDY,WAAW","sourcesContent":["import { css, CSSResultGroup, html, LitElement } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\n\nimport { restrictedIcon } from '../../assets/img/icons/restricted';\nimport { loginRequiredIcon } from '../../assets/img/icons/login-required';\n\n@customElement('icon-overlay')\nexport class IconOverlay extends LitElement {\n @property({ type: Boolean }) loggedIn = false;\n\n @property({ type: Boolean }) loginRequired = false;\n\n @property({ type: Boolean }) isCompactTile = false;\n\n render() {\n return html`<div class=\"icon-overlay ${this.getClass}\">\n ${this.iconDisplay}\n </div>`;\n }\n\n private get getClass() {\n return this.isCompactTile ? 'list-compact' : 'list-detail';\n }\n\n private get iconDisplay() {\n return this.loginRequired && !this.loggedIn\n ? html`${loginRequiredIcon}`\n : html`${restrictedIcon}`;\n }\n\n static get styles(): CSSResultGroup {\n return css`\n :host {\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n width: 100%;\n z-index: 2;\n background-color: rgb(255, 254, 203);\n display: flex;\n justify-content: center;\n border: 1px solid #2c2c2c;\n }\n\n .icon-overlay {\n height: 20px;\n width: 20px;\n padding: 2px;\n padding: 2px;\n }\n\n .list-detail {\n height: 20px;\n width: 20px;\n }\n .list-compact {\n height: 15px;\n width: 15px;\n }\n `;\n }\n}\n"]}
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import { __decorate } from "tslib";
|
|
2
2
|
import { css, html, LitElement } from 'lit';
|
|
3
3
|
import { customElement, property } from 'lit/decorators.js';
|
|
4
|
-
import { loginRequiredIcon } from '../../assets/img/icons/login-required
|
|
5
|
-
import { restrictedIcon } from '../../assets/img/icons/restricted
|
|
4
|
+
import { loginRequiredIcon } from '../../assets/img/icons/login-required';
|
|
5
|
+
import { restrictedIcon } from '../../assets/img/icons/restricted';
|
|
6
6
|
let IconTextOverlay = class IconTextOverlay extends LitElement {
|
|
7
7
|
constructor() {
|
|
8
8
|
super(...arguments);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"icon-text-overlay.js","sourceRoot":"","sources":["../../../../src/tiles/overlay/icon-text-overlay.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAkB,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AAC5D,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC5D,OAAO,EAAE,iBAAiB,EAAE,MAAM,
|
|
1
|
+
{"version":3,"file":"icon-text-overlay.js","sourceRoot":"","sources":["../../../../src/tiles/overlay/icon-text-overlay.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAkB,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AAC5D,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC5D,OAAO,EAAE,iBAAiB,EAAE,MAAM,uCAAuC,CAAC;AAC1E,OAAO,EAAE,cAAc,EAAE,MAAM,mCAAmC,CAAC;AAGnE,IAAa,eAAe,GAA5B,MAAa,eAAgB,SAAQ,UAAU;IAA/C;;QAC+B,aAAQ,GAAG,KAAK,CAAC;QAEjB,kBAAa,GAAG,KAAK,CAAC;IAiErD,CAAC;IA/DC,MAAM;QACJ,OAAO,IAAI,CAAA;;oCAEqB,IAAI,CAAC,WAAW;kCAClB,IAAI,CAAC,WAAW;;KAE7C,CAAC;IACJ,CAAC;IAED,IAAY,WAAW;QACrB,OAAO,IAAI,CAAC,aAAa,IAAI,CAAC,IAAI,CAAC,QAAQ;YACzC,CAAC,CAAC,IAAI,CAAA,GAAG,iBAAiB,EAAE;YAC5B,CAAC,CAAC,IAAI,CAAA,GAAG,cAAc,EAAE,CAAC;IAC9B,CAAC;IAED,IAAY,WAAW;QACrB,OAAO,IAAI,CAAC,aAAa,IAAI,CAAC,IAAI,CAAC,QAAQ;YACzC,CAAC,CAAC,2BAA2B;YAC7B,CAAC,CAAC,8BAA8B,CAAC;IACrC,CAAC;IAED,MAAM,KAAK,MAAM;QACf,OAAO,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KAuCT,CAAC;IACJ,CAAC;CACF,CAAA;AAnE8B;IAA5B,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;iDAAkB;AAEjB;IAA5B,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;sDAAuB;AAHxC,eAAe;IAD3B,aAAa,CAAC,mBAAmB,CAAC;GACtB,eAAe,CAoE3B;SApEY,eAAe","sourcesContent":["import { css, CSSResultGroup, html, LitElement } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\nimport { loginRequiredIcon } from '../../assets/img/icons/login-required';\nimport { restrictedIcon } from '../../assets/img/icons/restricted';\n\n@customElement('icon-text-overlay')\nexport class IconTextOverlay extends LitElement {\n @property({ type: Boolean }) loggedIn = false;\n\n @property({ type: Boolean }) loginRequired = false;\n\n render() {\n return html`\n <div class=\"overlay no-preview\">\n <div class=\"icon-overlay\">${this.iconDisplay}</div>\n <p class=\"text-overlay\">${this.textDisplay}</p>\n </div>\n `;\n }\n\n private get iconDisplay() {\n return this.loginRequired && !this.loggedIn\n ? html`${loginRequiredIcon}`\n : html`${restrictedIcon}`;\n }\n\n private get textDisplay() {\n return this.loginRequired && !this.loggedIn\n ? 'Log in\\nto view this item'\n : 'Content may be inappropriate';\n }\n\n static get styles(): CSSResultGroup {\n return css`\n :host {\n align-items: center;\n display: flex;\n }\n\n .overlay {\n border: 1px solid #2c2c2c;\n border-radius: 1px;\n position: absolute;\n right: 0;\n left: 0;\n width: auto;\n height: auto;\n padding: 5px;\n display: flex;\n align-items: center;\n border-radius: 1px;\n text-align: center;\n }\n\n .icon-overlay {\n width: 40px;\n height: 40px;\n display: inherit;\n }\n .text-overlay {\n margin: 0;\n vertical-align: bottom;\n padding-left: 5px;\n }\n\n .no-preview {\n background-color: #fffecb;\n border: 1px solid #2c2c2c;\n color: #2c2c2c;\n font-size: 1.4rem;\n line-height: 2rem;\n }\n `;\n }\n}\n"]}
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import { __decorate } from "tslib";
|
|
2
2
|
import { css, html, LitElement } from 'lit';
|
|
3
3
|
import { customElement, property } from 'lit/decorators.js';
|
|
4
|
-
import { loginRequiredIcon } from '../../assets/img/icons/login-required
|
|
5
|
-
import { restrictedIcon } from '../../assets/img/icons/restricted
|
|
4
|
+
import { loginRequiredIcon } from '../../assets/img/icons/login-required';
|
|
5
|
+
import { restrictedIcon } from '../../assets/img/icons/restricted';
|
|
6
6
|
let TextOverlay = class TextOverlay extends LitElement {
|
|
7
7
|
constructor() {
|
|
8
8
|
super(...arguments);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"text-overlay.js","sourceRoot":"","sources":["../../../../src/tiles/overlay/text-overlay.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAkB,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AAC5D,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC5D,OAAO,EAAE,iBAAiB,EAAE,MAAM,
|
|
1
|
+
{"version":3,"file":"text-overlay.js","sourceRoot":"","sources":["../../../../src/tiles/overlay/text-overlay.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAkB,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AAC5D,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC5D,OAAO,EAAE,iBAAiB,EAAE,MAAM,uCAAuC,CAAC;AAC1E,OAAO,EAAE,cAAc,EAAE,MAAM,mCAAmC,CAAC;AAGnE,IAAa,WAAW,GAAxB,MAAa,WAAY,SAAQ,UAAU;IAA3C;;QAC+B,aAAQ,GAAG,KAAK,CAAC;QAEjB,kBAAa,GAAG,KAAK,CAAC;QAEtB,iBAAY,GAAG,KAAK,CAAC;IA+DpD,CAAC;IA7DC,MAAM;QACJ,OAAO,IAAI,CAAA;;oCAEqB,IAAI,CAAC,WAAW;kCAClB,IAAI,CAAC,WAAW;;KAE7C,CAAC;IACJ,CAAC;IAED,IAAY,WAAW;QACrB,OAAO,IAAI,CAAC,aAAa,IAAI,CAAC,IAAI,CAAC,QAAQ;YACzC,CAAC,CAAC,IAAI,CAAA,GAAG,iBAAiB,EAAE;YAC5B,CAAC,CAAC,IAAI,CAAA,GAAG,cAAc,EAAE,CAAC;IAC9B,CAAC;IAED,IAAY,WAAW;QACrB,OAAO,IAAI,CAAC,aAAa,IAAI,CAAC,IAAI,CAAC,QAAQ;YACzC,CAAC,CAAC,IAAI,CAAA,0BAA0B;YAChC,CAAC,CAAC,IAAI,CAAA,8BAA8B,CAAC;IACzC,CAAC;IAED,MAAM,KAAK,MAAM;QACf,OAAO,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KAqCT,CAAC;IACJ,CAAC;CACF,CAAA;AAnE8B;IAA5B,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;6CAAkB;AAEjB;IAA5B,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;kDAAuB;AAEtB;IAA5B,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;iDAAsB;AALvC,WAAW;IADvB,aAAa,CAAC,cAAc,CAAC;GACjB,WAAW,CAoEvB;SApEY,WAAW","sourcesContent":["import { css, CSSResultGroup, html, LitElement } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\nimport { loginRequiredIcon } from '../../assets/img/icons/login-required';\nimport { restrictedIcon } from '../../assets/img/icons/restricted';\n\n@customElement('text-overlay')\nexport class TextOverlay extends LitElement {\n @property({ type: Boolean }) loggedIn = false;\n\n @property({ type: Boolean }) loginRequired = false;\n\n @property({ type: Boolean }) iconRequired = false;\n\n render() {\n return html`\n <div class=\"overlay no-preview\">\n <div class=\"icon-overlay\">${this.iconDisplay}</div>\n <p class=\"text-overlay\">${this.textDisplay}</p>\n </div>\n `;\n }\n\n private get iconDisplay() {\n return this.loginRequired && !this.loggedIn\n ? html`${loginRequiredIcon}`\n : html`${restrictedIcon}`;\n }\n\n private get textDisplay() {\n return this.loginRequired && !this.loggedIn\n ? html`Log in to view this item`\n : html`Content may be inappropriate`;\n }\n\n static get styles(): CSSResultGroup {\n return css`\n :host {\n align-items: center;\n display: flex;\n }\n\n .overlay {\n border: 1px solid #2c2c2c;\n border-radius: 1px;\n position: absolute;\n right: 0;\n left: 0;\n top: 50%;\n transform: translate(0px, -50%);\n width: auto;\n height: auto;\n padding: 5px;\n background-color: #fffecb;\n display: flex;\n align-items: center;\n border-radius: 1px;\n }\n\n .icon-overlay {\n width: 40px;\n height: 40px;\n display: inherit;\n }\n .text-overlay {\n margin: 0;\n vertical-align: bottom;\n padding-left: 5px;\n text-align: center;\n color: #2c2c2c;\n font-size: 1.4rem;\n line-height: 2rem;\n }\n `;\n }\n}\n"]}
|
|
@@ -2,16 +2,16 @@ import { LitElement, PropertyValues } from 'lit';
|
|
|
2
2
|
import type { SharedResizeObserverInterface, SharedResizeObserverResizeHandlerInterface } from '@internetarchive/shared-resize-observer';
|
|
3
3
|
import type { CollectionNameCacheInterface } from '@internetarchive/collection-name-cache';
|
|
4
4
|
import type { SortParam } from '@internetarchive/search-service';
|
|
5
|
-
import type { TileDisplayMode, TileModel } from '../models
|
|
6
|
-
import './grid/collection-tile
|
|
7
|
-
import './grid/item-tile
|
|
8
|
-
import './grid/account-tile
|
|
9
|
-
import './hover/tile-hover-pane
|
|
10
|
-
import './list/tile-list
|
|
11
|
-
import './list/tile-list-compact
|
|
12
|
-
import './list/tile-list-compact-header
|
|
13
|
-
import type { TileHoverPane } from './hover/tile-hover-pane
|
|
14
|
-
import { HoverPaneProperties, HoverPaneProviderInterface } from './hover/hover-pane-controller
|
|
5
|
+
import type { TileDisplayMode, TileModel } from '../models';
|
|
6
|
+
import './grid/collection-tile';
|
|
7
|
+
import './grid/item-tile';
|
|
8
|
+
import './grid/account-tile';
|
|
9
|
+
import './hover/tile-hover-pane';
|
|
10
|
+
import './list/tile-list';
|
|
11
|
+
import './list/tile-list-compact';
|
|
12
|
+
import './list/tile-list-compact-header';
|
|
13
|
+
import type { TileHoverPane } from './hover/tile-hover-pane';
|
|
14
|
+
import { HoverPaneProperties, HoverPaneProviderInterface } from './hover/hover-pane-controller';
|
|
15
15
|
export declare class TileDispatcher extends LitElement implements SharedResizeObserverResizeHandlerInterface, HoverPaneProviderInterface {
|
|
16
16
|
tileDisplayMode?: TileDisplayMode;
|
|
17
17
|
model?: TileModel;
|
|
@@ -26,7 +26,6 @@ export declare class TileDispatcher extends LitElement implements SharedResizeOb
|
|
|
26
26
|
loggedIn: boolean;
|
|
27
27
|
/** Whether this tile should include a hover pane at all (for applicable tile modes) */
|
|
28
28
|
enableHoverPane: boolean;
|
|
29
|
-
prerender: boolean;
|
|
30
29
|
private hoverPaneController?;
|
|
31
30
|
private container;
|
|
32
31
|
private hoverPane?;
|
|
@@ -3,14 +3,14 @@ import { __decorate } from "tslib";
|
|
|
3
3
|
import { css, html, LitElement, nothing } from 'lit';
|
|
4
4
|
import { customElement, property, query } from 'lit/decorators.js';
|
|
5
5
|
import { ifDefined } from 'lit/directives/if-defined.js';
|
|
6
|
-
import './grid/collection-tile
|
|
7
|
-
import './grid/item-tile
|
|
8
|
-
import './grid/account-tile
|
|
9
|
-
import './hover/tile-hover-pane
|
|
10
|
-
import './list/tile-list
|
|
11
|
-
import './list/tile-list-compact
|
|
12
|
-
import './list/tile-list-compact-header
|
|
13
|
-
import { HoverPaneController, } from './hover/hover-pane-controller
|
|
6
|
+
import './grid/collection-tile';
|
|
7
|
+
import './grid/item-tile';
|
|
8
|
+
import './grid/account-tile';
|
|
9
|
+
import './hover/tile-hover-pane';
|
|
10
|
+
import './list/tile-list';
|
|
11
|
+
import './list/tile-list-compact';
|
|
12
|
+
import './list/tile-list-compact-header';
|
|
13
|
+
import { HoverPaneController, } from './hover/hover-pane-controller';
|
|
14
14
|
let TileDispatcher = TileDispatcher_1 = class TileDispatcher extends LitElement {
|
|
15
15
|
constructor() {
|
|
16
16
|
super(...arguments);
|
|
@@ -18,7 +18,6 @@ let TileDispatcher = TileDispatcher_1 = class TileDispatcher extends LitElement
|
|
|
18
18
|
this.loggedIn = false;
|
|
19
19
|
/** Whether this tile should include a hover pane at all (for applicable tile modes) */
|
|
20
20
|
this.enableHoverPane = false;
|
|
21
|
-
this.prerender = false;
|
|
22
21
|
}
|
|
23
22
|
render() {
|
|
24
23
|
var _a, _b;
|
|
@@ -93,8 +92,6 @@ let TileDispatcher = TileDispatcher_1 = class TileDispatcher extends LitElement
|
|
|
93
92
|
TileDispatcher_1.HOVER_PANE_DISPLAY_MODES[this.tileDisplayMode]);
|
|
94
93
|
}
|
|
95
94
|
get isHoverEnabled() {
|
|
96
|
-
if (this.prerender)
|
|
97
|
-
return false;
|
|
98
95
|
return window.matchMedia('(hover: hover)').matches;
|
|
99
96
|
}
|
|
100
97
|
/** @inheritdoc */
|
|
@@ -319,9 +316,6 @@ __decorate([
|
|
|
319
316
|
__decorate([
|
|
320
317
|
property({ type: Boolean })
|
|
321
318
|
], TileDispatcher.prototype, "enableHoverPane", void 0);
|
|
322
|
-
__decorate([
|
|
323
|
-
property({ type: Boolean })
|
|
324
|
-
], TileDispatcher.prototype, "prerender", void 0);
|
|
325
319
|
__decorate([
|
|
326
320
|
query('#container')
|
|
327
321
|
], TileDispatcher.prototype, "container", void 0);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"tile-dispatcher.js","sourceRoot":"","sources":["../../../src/tiles/tile-dispatcher.ts"],"names":[],"mappings":"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","sourcesContent":["import { css, html, LitElement, nothing, PropertyValues } from 'lit';\nimport { customElement, property, query } from 'lit/decorators.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport type {\n SharedResizeObserverInterface,\n SharedResizeObserverResizeHandlerInterface,\n} from '@internetarchive/shared-resize-observer';\nimport type { CollectionNameCacheInterface } from '@internetarchive/collection-name-cache';\nimport type { SortParam } from '@internetarchive/search-service';\nimport type { TileDisplayMode, TileModel } from '../models.js';\nimport './grid/collection-tile.js';\nimport './grid/item-tile.js';\nimport './grid/account-tile.js';\nimport './hover/tile-hover-pane.js';\nimport './list/tile-list.js';\nimport './list/tile-list-compact.js';\nimport './list/tile-list-compact-header.js';\nimport type { TileHoverPane } from './hover/tile-hover-pane.js';\nimport {\n HoverPaneController,\n HoverPaneControllerInterface,\n HoverPaneProperties,\n HoverPaneProviderInterface,\n} from './hover/hover-pane-controller.js';\n\n@customElement('tile-dispatcher')\nexport class TileDispatcher\n extends LitElement\n implements\n SharedResizeObserverResizeHandlerInterface,\n HoverPaneProviderInterface\n{\n @property({ type: String }) tileDisplayMode?: TileDisplayMode;\n\n @property({ type: Object }) model?: TileModel;\n\n @property({ type: String }) baseNavigationUrl?: string;\n\n @property({ type: Number }) currentWidth?: number;\n\n @property({ type: Number }) currentHeight?: number;\n\n @property({ type: Object }) resizeObserver?: SharedResizeObserverInterface;\n\n @property({ type: Object })\n collectionNameCache?: CollectionNameCacheInterface;\n\n @property({ type: Object }) sortParam: SortParam | null = null;\n\n @property({ type: Number }) mobileBreakpoint?: number;\n\n @property({ type: String }) baseImageUrl?: string;\n\n @property({ type: Boolean }) loggedIn = false;\n\n /** Whether this tile should include a hover pane at all (for applicable tile modes) */\n @property({ type: Boolean }) enableHoverPane = false;\n\n @property({ type: Boolean }) prerender = false;\n\n private hoverPaneController?: HoverPaneControllerInterface;\n\n @query('#container')\n private container!: HTMLDivElement;\n\n @query('tile-hover-pane')\n private hoverPane?: TileHoverPane;\n\n /** Maps each display mode to whether hover panes should appear in that mode */\n private static readonly HOVER_PANE_DISPLAY_MODES: Record<\n TileDisplayMode,\n boolean\n > = {\n grid: true,\n 'list-compact': true,\n 'list-detail': false,\n 'list-header': false,\n };\n\n render() {\n const isGridMode = this.tileDisplayMode === 'grid';\n const hoverPaneTemplate =\n this.hoverPaneController?.getTemplate() ?? nothing;\n return html`\n <div id=\"container\" class=${isGridMode ? 'hoverable' : nothing}>\n ${this.tileDisplayMode === 'list-header'\n ? this.headerTemplate\n : this.tileTemplate}\n ${hoverPaneTemplate}\n </div>\n `;\n }\n\n protected firstUpdated(): void {\n if (this.shouldPrepareHoverPane) {\n this.hoverPaneController = new HoverPaneController(this, {\n mobileBreakpoint: this.mobileBreakpoint,\n enableLongPress: false,\n });\n }\n }\n\n private get headerTemplate() {\n const { currentWidth, sortParam, mobileBreakpoint } = this;\n return html`\n <tile-list-compact-header\n class=\"header\"\n .currentWidth=${currentWidth}\n .sortParam=${sortParam}\n .mobileBreakpoint=${mobileBreakpoint}\n >\n </tile-list-compact-header>\n `;\n }\n\n private get tileTemplate() {\n return html`\n ${this.tileDisplayMode === 'list-detail'\n ? this.tile\n : this.linkTileTemplate}\n `;\n }\n\n private get linkTileTemplate() {\n return html`\n <a\n href=\"${this.linkTileHref}\"\n aria-label=${this.model?.title ?? 'Untitled item'}\n title=${this.shouldPrepareHoverPane\n ? nothing // Don't show title tooltips when we have the tile info popups\n : ifDefined(this.model?.title)}\n @click=${() =>\n this.dispatchEvent(\n new CustomEvent('resultSelected', { detail: this.model })\n )}\n >\n ${this.tile}\n </a>\n `;\n }\n\n private get linkTileHref() {\n // Use the server-specified href if available.\n // Otherwise, construct a details page URL from the item identifier.\n return this.model?.href\n ? `${this.baseNavigationUrl}${this.model?.href}`\n : `${this.baseNavigationUrl}/details/${this.model?.identifier}`;\n }\n\n /**\n * Whether hover pane behavior should be prepared for this tile\n * (e.g., whether mouse listeners should be attached, etc.)\n */\n private get shouldPrepareHoverPane(): boolean {\n return (\n this.enableHoverPane &&\n !!this.tileDisplayMode &&\n TileDispatcher.HOVER_PANE_DISPLAY_MODES[this.tileDisplayMode]\n );\n }\n\n private get isHoverEnabled(): boolean {\n if (this.prerender) return false;\n return window.matchMedia('(hover: hover)').matches;\n }\n\n /** @inheritdoc */\n getHoverPane(): TileHoverPane | undefined {\n return this.hoverPane;\n }\n\n /** @inheritdoc */\n getHoverPaneProps(): HoverPaneProperties {\n return this;\n }\n\n handleResize(entry: ResizeObserverEntry): void {\n this.currentWidth = entry.contentRect.width;\n this.currentHeight = entry.contentRect.height;\n }\n\n disconnectedCallback(): void {\n this.stopResizeObservation(this.resizeObserver);\n }\n\n private stopResizeObservation(observer?: SharedResizeObserverInterface) {\n observer?.removeObserver({\n handler: this,\n target: this.container,\n });\n }\n\n private startResizeObservation() {\n this.stopResizeObservation(this.resizeObserver);\n this.resizeObserver?.addObserver({\n handler: this,\n target: this.container,\n });\n }\n\n updated(props: PropertyValues) {\n if (props.has('resizeObserver')) {\n const previousObserver = props.get(\n 'resizeObserver'\n ) as SharedResizeObserverInterface;\n this.stopResizeObservation(previousObserver);\n this.startResizeObservation();\n }\n }\n\n private tileInfoButtonPressed(\n e: CustomEvent<{ x: number; y: number }>\n ): void {\n this.hoverPaneController?.toggleHoverPane({\n coords: e.detail,\n enableTouchBackdrop: true,\n });\n }\n\n private get tile() {\n const {\n model,\n baseNavigationUrl,\n currentWidth,\n currentHeight,\n sortParam,\n mobileBreakpoint,\n } = this;\n\n if (!model) return nothing;\n\n switch (this.tileDisplayMode) {\n case 'grid':\n switch (model.mediatype) {\n case 'collection':\n return html`<collection-tile\n .model=${model}\n .baseImageUrl=${this.baseImageUrl}\n .currentWidth=${currentWidth}\n .currentHeight=${currentHeight}\n ?showInfoButton=${!this.isHoverEnabled}\n @infoButtonPressed=${this.tileInfoButtonPressed}\n >\n </collection-tile>`;\n case 'account':\n return html`<account-tile\n .model=${model}\n .baseImageUrl=${this.baseImageUrl}\n .currentWidth=${currentWidth}\n .currentHeight=${currentHeight}\n ?showInfoButton=${!this.isHoverEnabled}\n @infoButtonPressed=${this.tileInfoButtonPressed}\n >\n </account-tile>`;\n default:\n return html`<item-tile\n .model=${model}\n .currentWidth=${this.currentWidth}\n .currentHeight=${this.currentHeight}\n .collectionNameCache=${this.collectionNameCache}\n .baseImageUrl=${this.baseImageUrl}\n .sortParam=${sortParam}\n .loggedIn=${this.loggedIn}\n ?showInfoButton=${!this.isHoverEnabled}\n @infoButtonPressed=${this.tileInfoButtonPressed}\n >\n </item-tile>`;\n }\n case 'list-compact':\n return html`<tile-list-compact\n .model=${model}\n .currentWidth=${currentWidth}\n .currentHeight=${currentHeight}\n .baseNavigationUrl=${baseNavigationUrl}\n .sortParam=${sortParam}\n .mobileBreakpoint=${mobileBreakpoint}\n .baseImageUrl=${this.baseImageUrl}\n .loggedIn=${this.loggedIn}\n >\n </tile-list-compact>`;\n case 'list-detail':\n return html`<tile-list\n .model=${model}\n .collectionNameCache=${this.collectionNameCache}\n .currentWidth=${currentWidth}\n .currentHeight=${currentHeight}\n .baseNavigationUrl=${baseNavigationUrl}\n .sortParam=${sortParam}\n .mobileBreakpoint=${mobileBreakpoint}\n .baseImageUrl=${this.baseImageUrl}\n .loggedIn=${this.loggedIn}\n >\n </tile-list>`;\n default:\n return nothing;\n }\n }\n\n static get styles() {\n return css`\n :host {\n display: block;\n height: 100%;\n }\n\n collection-tile {\n --tileBorderColor: #555555;\n --tileBackgroundColor: #666666;\n --imageBlockBackgroundColor: #666666;\n }\n\n account-tile {\n --tileBorderColor: #dddddd;\n --imageBlockBackgroundColor: #fcf5e6;\n }\n\n item-tile {\n --tileBorderColor: #dddddd;\n --imageBlockBackgroundColor: #f1f1f4;\n }\n\n #container {\n position: relative;\n height: 100%;\n border-radius: 4px;\n }\n\n #container.hoverable:hover {\n box-shadow: 0 0 6px 2px rgba(8, 8, 32, 0.8);\n transition: box-shadow 0.1s ease;\n }\n\n a {\n display: block;\n height: 100%;\n color: unset;\n text-decoration: none;\n transition: transform 0.05s ease;\n }\n\n a :first-child {\n display: block;\n height: 100%;\n }\n\n #touch-backdrop {\n position: fixed;\n width: 100vw;\n height: 100vh;\n top: 0;\n left: 0;\n z-index: 2;\n background: transparent;\n }\n\n tile-hover-pane {\n position: absolute;\n top: 0;\n left: -9999px;\n z-index: 2;\n }\n `;\n }\n}\n"]}
|
|
1
|
+
{"version":3,"file":"tile-dispatcher.js","sourceRoot":"","sources":["../../../src/tiles/tile-dispatcher.ts"],"names":[],"mappings":"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","sourcesContent":["import { css, html, LitElement, nothing, PropertyValues } from 'lit';\nimport { customElement, property, query } from 'lit/decorators.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport type {\n SharedResizeObserverInterface,\n SharedResizeObserverResizeHandlerInterface,\n} from '@internetarchive/shared-resize-observer';\nimport type { CollectionNameCacheInterface } from '@internetarchive/collection-name-cache';\nimport type { SortParam } from '@internetarchive/search-service';\nimport type { TileDisplayMode, TileModel } from '../models';\nimport './grid/collection-tile';\nimport './grid/item-tile';\nimport './grid/account-tile';\nimport './hover/tile-hover-pane';\nimport './list/tile-list';\nimport './list/tile-list-compact';\nimport './list/tile-list-compact-header';\nimport type { TileHoverPane } from './hover/tile-hover-pane';\nimport {\n HoverPaneController,\n HoverPaneControllerInterface,\n HoverPaneProperties,\n HoverPaneProviderInterface,\n} from './hover/hover-pane-controller';\n\n@customElement('tile-dispatcher')\nexport class TileDispatcher\n extends LitElement\n implements\n SharedResizeObserverResizeHandlerInterface,\n HoverPaneProviderInterface\n{\n @property({ type: String }) tileDisplayMode?: TileDisplayMode;\n\n @property({ type: Object }) model?: TileModel;\n\n @property({ type: String }) baseNavigationUrl?: string;\n\n @property({ type: Number }) currentWidth?: number;\n\n @property({ type: Number }) currentHeight?: number;\n\n @property({ type: Object }) resizeObserver?: SharedResizeObserverInterface;\n\n @property({ type: Object })\n collectionNameCache?: CollectionNameCacheInterface;\n\n @property({ type: Object }) sortParam: SortParam | null = null;\n\n @property({ type: Number }) mobileBreakpoint?: number;\n\n @property({ type: String }) baseImageUrl?: string;\n\n @property({ type: Boolean }) loggedIn = false;\n\n /** Whether this tile should include a hover pane at all (for applicable tile modes) */\n @property({ type: Boolean }) enableHoverPane = false;\n\n private hoverPaneController?: HoverPaneControllerInterface;\n\n @query('#container')\n private container!: HTMLDivElement;\n\n @query('tile-hover-pane')\n private hoverPane?: TileHoverPane;\n\n /** Maps each display mode to whether hover panes should appear in that mode */\n private static readonly HOVER_PANE_DISPLAY_MODES: Record<\n TileDisplayMode,\n boolean\n > = {\n grid: true,\n 'list-compact': true,\n 'list-detail': false,\n 'list-header': false,\n };\n\n render() {\n const isGridMode = this.tileDisplayMode === 'grid';\n const hoverPaneTemplate =\n this.hoverPaneController?.getTemplate() ?? nothing;\n return html`\n <div id=\"container\" class=${isGridMode ? 'hoverable' : nothing}>\n ${this.tileDisplayMode === 'list-header'\n ? this.headerTemplate\n : this.tileTemplate}\n ${hoverPaneTemplate}\n </div>\n `;\n }\n\n protected firstUpdated(): void {\n if (this.shouldPrepareHoverPane) {\n this.hoverPaneController = new HoverPaneController(this, {\n mobileBreakpoint: this.mobileBreakpoint,\n enableLongPress: false,\n });\n }\n }\n\n private get headerTemplate() {\n const { currentWidth, sortParam, mobileBreakpoint } = this;\n return html`\n <tile-list-compact-header\n class=\"header\"\n .currentWidth=${currentWidth}\n .sortParam=${sortParam}\n .mobileBreakpoint=${mobileBreakpoint}\n >\n </tile-list-compact-header>\n `;\n }\n\n private get tileTemplate() {\n return html`\n ${this.tileDisplayMode === 'list-detail'\n ? this.tile\n : this.linkTileTemplate}\n `;\n }\n\n private get linkTileTemplate() {\n return html`\n <a\n href=\"${this.linkTileHref}\"\n aria-label=${this.model?.title ?? 'Untitled item'}\n title=${this.shouldPrepareHoverPane\n ? nothing // Don't show title tooltips when we have the tile info popups\n : ifDefined(this.model?.title)}\n @click=${() =>\n this.dispatchEvent(\n new CustomEvent('resultSelected', { detail: this.model })\n )}\n >\n ${this.tile}\n </a>\n `;\n }\n\n private get linkTileHref() {\n // Use the server-specified href if available.\n // Otherwise, construct a details page URL from the item identifier.\n return this.model?.href\n ? `${this.baseNavigationUrl}${this.model?.href}`\n : `${this.baseNavigationUrl}/details/${this.model?.identifier}`;\n }\n\n /**\n * Whether hover pane behavior should be prepared for this tile\n * (e.g., whether mouse listeners should be attached, etc.)\n */\n private get shouldPrepareHoverPane(): boolean {\n return (\n this.enableHoverPane &&\n !!this.tileDisplayMode &&\n TileDispatcher.HOVER_PANE_DISPLAY_MODES[this.tileDisplayMode]\n );\n }\n\n private get isHoverEnabled(): boolean {\n return window.matchMedia('(hover: hover)').matches;\n }\n\n /** @inheritdoc */\n getHoverPane(): TileHoverPane | undefined {\n return this.hoverPane;\n }\n\n /** @inheritdoc */\n getHoverPaneProps(): HoverPaneProperties {\n return this;\n }\n\n handleResize(entry: ResizeObserverEntry): void {\n this.currentWidth = entry.contentRect.width;\n this.currentHeight = entry.contentRect.height;\n }\n\n disconnectedCallback(): void {\n this.stopResizeObservation(this.resizeObserver);\n }\n\n private stopResizeObservation(observer?: SharedResizeObserverInterface) {\n observer?.removeObserver({\n handler: this,\n target: this.container,\n });\n }\n\n private startResizeObservation() {\n this.stopResizeObservation(this.resizeObserver);\n this.resizeObserver?.addObserver({\n handler: this,\n target: this.container,\n });\n }\n\n updated(props: PropertyValues) {\n if (props.has('resizeObserver')) {\n const previousObserver = props.get(\n 'resizeObserver'\n ) as SharedResizeObserverInterface;\n this.stopResizeObservation(previousObserver);\n this.startResizeObservation();\n }\n }\n\n private tileInfoButtonPressed(\n e: CustomEvent<{ x: number; y: number }>\n ): void {\n this.hoverPaneController?.toggleHoverPane({\n coords: e.detail,\n enableTouchBackdrop: true,\n });\n }\n\n private get tile() {\n const {\n model,\n baseNavigationUrl,\n currentWidth,\n currentHeight,\n sortParam,\n mobileBreakpoint,\n } = this;\n\n if (!model) return nothing;\n\n switch (this.tileDisplayMode) {\n case 'grid':\n switch (model.mediatype) {\n case 'collection':\n return html`<collection-tile\n .model=${model}\n .baseImageUrl=${this.baseImageUrl}\n .currentWidth=${currentWidth}\n .currentHeight=${currentHeight}\n ?showInfoButton=${!this.isHoverEnabled}\n @infoButtonPressed=${this.tileInfoButtonPressed}\n >\n </collection-tile>`;\n case 'account':\n return html`<account-tile\n .model=${model}\n .baseImageUrl=${this.baseImageUrl}\n .currentWidth=${currentWidth}\n .currentHeight=${currentHeight}\n ?showInfoButton=${!this.isHoverEnabled}\n @infoButtonPressed=${this.tileInfoButtonPressed}\n >\n </account-tile>`;\n default:\n return html`<item-tile\n .model=${model}\n .currentWidth=${this.currentWidth}\n .currentHeight=${this.currentHeight}\n .collectionNameCache=${this.collectionNameCache}\n .baseImageUrl=${this.baseImageUrl}\n .sortParam=${sortParam}\n .loggedIn=${this.loggedIn}\n ?showInfoButton=${!this.isHoverEnabled}\n @infoButtonPressed=${this.tileInfoButtonPressed}\n >\n </item-tile>`;\n }\n case 'list-compact':\n return html`<tile-list-compact\n .model=${model}\n .currentWidth=${currentWidth}\n .currentHeight=${currentHeight}\n .baseNavigationUrl=${baseNavigationUrl}\n .sortParam=${sortParam}\n .mobileBreakpoint=${mobileBreakpoint}\n .baseImageUrl=${this.baseImageUrl}\n .loggedIn=${this.loggedIn}\n >\n </tile-list-compact>`;\n case 'list-detail':\n return html`<tile-list\n .model=${model}\n .collectionNameCache=${this.collectionNameCache}\n .currentWidth=${currentWidth}\n .currentHeight=${currentHeight}\n .baseNavigationUrl=${baseNavigationUrl}\n .sortParam=${sortParam}\n .mobileBreakpoint=${mobileBreakpoint}\n .baseImageUrl=${this.baseImageUrl}\n .loggedIn=${this.loggedIn}\n >\n </tile-list>`;\n default:\n return nothing;\n }\n }\n\n static get styles() {\n return css`\n :host {\n display: block;\n height: 100%;\n }\n\n collection-tile {\n --tileBorderColor: #555555;\n --tileBackgroundColor: #666666;\n --imageBlockBackgroundColor: #666666;\n }\n\n account-tile {\n --tileBorderColor: #dddddd;\n --imageBlockBackgroundColor: #fcf5e6;\n }\n\n item-tile {\n --tileBorderColor: #dddddd;\n --imageBlockBackgroundColor: #f1f1f4;\n }\n\n #container {\n position: relative;\n height: 100%;\n border-radius: 4px;\n }\n\n #container.hoverable:hover {\n box-shadow: 0 0 6px 2px rgba(8, 8, 32, 0.8);\n transition: box-shadow 0.1s ease;\n }\n\n a {\n display: block;\n height: 100%;\n color: unset;\n text-decoration: none;\n transition: transform 0.05s ease;\n }\n\n a :first-child {\n display: block;\n height: 100%;\n }\n\n #touch-backdrop {\n position: fixed;\n width: 100vw;\n height: 100vh;\n top: 0;\n left: 0;\n z-index: 2;\n background: transparent;\n }\n\n tile-hover-pane {\n position: absolute;\n top: 0;\n left: -9999px;\n z-index: 2;\n }\n `;\n }\n}\n"]}
|
|
@@ -2,9 +2,8 @@ export function formatDate(date, format = 'short', locale = 'en-US') {
|
|
|
2
2
|
// Return blank if undefined
|
|
3
3
|
if (!date)
|
|
4
4
|
return '';
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
};
|
|
5
|
+
// the date is already in UTC timezone so we should not add timeZone here again.
|
|
6
|
+
const options = {};
|
|
8
7
|
switch (format) {
|
|
9
8
|
case 'year-only':
|
|
10
9
|
options.year = 'numeric';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"format-date.js","sourceRoot":"","sources":["../../../src/utils/format-date.ts"],"names":[],"mappings":"AASA,MAAM,UAAU,UAAU,CACxB,IAAsB,EACtB,SAAqB,OAAO,EAC5B,SAAiB,OAAO;IAExB,4BAA4B;IAC5B,IAAI,CAAC,IAAI;QAAE,OAAO,EAAE,CAAC;IAErB,MAAM,OAAO,GAA+B
|
|
1
|
+
{"version":3,"file":"format-date.js","sourceRoot":"","sources":["../../../src/utils/format-date.ts"],"names":[],"mappings":"AASA,MAAM,UAAU,UAAU,CACxB,IAAsB,EACtB,SAAqB,OAAO,EAC5B,SAAiB,OAAO;IAExB,4BAA4B;IAC5B,IAAI,CAAC,IAAI;QAAE,OAAO,EAAE,CAAC;IAErB,gFAAgF;IAChF,MAAM,OAAO,GAA+B,EAAE,CAAC;IAE/C,QAAQ,MAAM,EAAE;QACd,KAAK,WAAW;YACd,OAAO,CAAC,IAAI,GAAG,SAAS,CAAC;YACzB,MAAM;QACR,KAAK,OAAO;YACV,OAAO,CAAC,KAAK,GAAG,OAAO,CAAC;YACxB,OAAO,CAAC,IAAI,GAAG,SAAS,CAAC;YACzB,MAAM;QACR,KAAK,MAAM;YACT,OAAO,CAAC,IAAI,GAAG,SAAS,CAAC;YACzB,OAAO,CAAC,KAAK,GAAG,OAAO,CAAC;YACxB,OAAO,CAAC,GAAG,GAAG,SAAS,CAAC;YACxB,MAAM;QACR;YACE,MAAM;KACT;IAED,MAAM,aAAa,GAAG,IAAI,IAAI,CAAC,cAAc,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IAC/D,OAAO,aAAa,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC;AACpC,CAAC","sourcesContent":["/*\n * Display date\n * Override browser timezone to always display same date as in data\n */\nexport type DateFormat =\n | 'year-only' // 2020\n | 'short' // Dec 2020\n | 'long'; // Dec 20, 2020\n\nexport function formatDate(\n date: Date | undefined,\n format: DateFormat = 'short',\n locale: string = 'en-US'\n): string {\n // Return blank if undefined\n if (!date) return '';\n\n // the date is already in UTC timezone so we should not add timeZone here again.\n const options: Intl.DateTimeFormatOptions = {};\n\n switch (format) {\n case 'year-only':\n options.year = 'numeric';\n break;\n case 'short':\n options.month = 'short';\n options.year = 'numeric';\n break;\n case 'long':\n options.year = 'numeric';\n options.month = 'short';\n options.day = '2-digit';\n break;\n default:\n break;\n }\n\n const dateFormatter = new Intl.DateTimeFormat(locale, options);\n return dateFormatter.format(date);\n}\n"]}
|
package/index.ts
CHANGED
|
@@ -1,9 +1,9 @@
|
|
|
1
|
-
export { CollectionBrowser } from './src/collection-browser
|
|
2
|
-
export { SortFilterBar } from './src/sort-filter-bar/sort-filter-bar
|
|
3
|
-
export { CollectionDisplayMode } from './src/models
|
|
4
|
-
export { CollectionBrowserLoadingTile } from './src/tiles/collection-browser-loading-tile
|
|
5
|
-
export { CollectionTile } from './src/tiles/grid/collection-tile
|
|
6
|
-
export { AccountTile } from './src/tiles/grid/account-tile
|
|
7
|
-
export { ItemTile } from './src/tiles/grid/item-tile
|
|
8
|
-
export { TileList } from './src/tiles/list/tile-list
|
|
9
|
-
export { TileListCompact } from './src/tiles/list/tile-list-compact
|
|
1
|
+
export { CollectionBrowser } from './src/collection-browser';
|
|
2
|
+
export { SortFilterBar } from './src/sort-filter-bar/sort-filter-bar';
|
|
3
|
+
export { CollectionDisplayMode } from './src/models';
|
|
4
|
+
export { CollectionBrowserLoadingTile } from './src/tiles/collection-browser-loading-tile';
|
|
5
|
+
export { CollectionTile } from './src/tiles/grid/collection-tile';
|
|
6
|
+
export { AccountTile } from './src/tiles/grid/account-tile';
|
|
7
|
+
export { ItemTile } from './src/tiles/grid/item-tile';
|
|
8
|
+
export { TileList } from './src/tiles/list/tile-list';
|
|
9
|
+
export { TileListCompact } from './src/tiles/list/tile-list-compact';
|
package/package.json
CHANGED
|
@@ -3,10 +3,9 @@
|
|
|
3
3
|
"description": "The Internet Archive Collection Browser.",
|
|
4
4
|
"license": "AGPL-3.0-only",
|
|
5
5
|
"author": "Internet Archive",
|
|
6
|
-
"version": "1.
|
|
6
|
+
"version": "1.2.0",
|
|
7
7
|
"main": "dist/index.js",
|
|
8
8
|
"module": "dist/index.js",
|
|
9
|
-
"type": "module",
|
|
10
9
|
"scripts": {
|
|
11
10
|
"start": "yarn run prepare && tsc && concurrently -k -r \"tsc --watch --preserveWatchOutput\" \"wds\"",
|
|
12
11
|
"prepare:ghpages": "rimraf ghpages && yarn run prepare && vite build",
|
|
@@ -23,18 +22,18 @@
|
|
|
23
22
|
},
|
|
24
23
|
"types": "dist/index.d.ts",
|
|
25
24
|
"dependencies": {
|
|
26
|
-
"@internetarchive/analytics-manager": "^0.1.
|
|
27
|
-
"@internetarchive/collection-name-cache": "^0.2.
|
|
28
|
-
"@internetarchive/feature-feedback": "^0.1.
|
|
29
|
-
"@internetarchive/field-parsers": "^0.1.
|
|
30
|
-
"@internetarchive/histogram-date-range": "^1.1.
|
|
31
|
-
"@internetarchive/ia-activity-indicator": "^0.0.
|
|
32
|
-
"@internetarchive/ia-dropdown": "^1.1.
|
|
33
|
-
"@internetarchive/infinite-scroller": "^0.1.
|
|
34
|
-
"@internetarchive/local-cache": "^0.2.
|
|
35
|
-
"@internetarchive/modal-manager": "^0.2.
|
|
36
|
-
"@internetarchive/search-service": "^0.4.
|
|
37
|
-
"@internetarchive/shared-resize-observer": "^0.2.
|
|
25
|
+
"@internetarchive/analytics-manager": "^0.1.2",
|
|
26
|
+
"@internetarchive/collection-name-cache": "^0.2.7",
|
|
27
|
+
"@internetarchive/feature-feedback": "^0.1.4",
|
|
28
|
+
"@internetarchive/field-parsers": "^0.1.3",
|
|
29
|
+
"@internetarchive/histogram-date-range": "^1.1.0",
|
|
30
|
+
"@internetarchive/ia-activity-indicator": "^0.0.4",
|
|
31
|
+
"@internetarchive/ia-dropdown": "^1.1.0",
|
|
32
|
+
"@internetarchive/infinite-scroller": "^0.1.4",
|
|
33
|
+
"@internetarchive/local-cache": "^0.2.1",
|
|
34
|
+
"@internetarchive/modal-manager": "^0.2.8",
|
|
35
|
+
"@internetarchive/search-service": "^0.4.7",
|
|
36
|
+
"@internetarchive/shared-resize-observer": "^0.2.0",
|
|
38
37
|
"@lit/localize": "^0.11.2",
|
|
39
38
|
"dompurify": "^2.3.6",
|
|
40
39
|
"eslint-plugin-lit": "^1.6.1",
|
package/src/app-root.ts
CHANGED
|
@@ -17,9 +17,9 @@ import { CollectionNameCache } from '@internetarchive/collection-name-cache';
|
|
|
17
17
|
|
|
18
18
|
import type { ModalManagerInterface } from '@internetarchive/modal-manager';
|
|
19
19
|
import type { AnalyticsManagerInterface } from '@internetarchive/analytics-manager';
|
|
20
|
-
import type { CollectionBrowser } from '../src/collection-browser
|
|
20
|
+
import type { CollectionBrowser } from '../src/collection-browser';
|
|
21
21
|
|
|
22
|
-
import '../src/collection-browser
|
|
22
|
+
import '../src/collection-browser';
|
|
23
23
|
|
|
24
24
|
@customElement('app-root')
|
|
25
25
|
export class AppRoot extends LitElement {
|
|
@@ -37,12 +37,12 @@ import type { CollectionNameCacheInterface } from '@internetarchive/collection-n
|
|
|
37
37
|
import type { ModalManagerInterface } from '@internetarchive/modal-manager';
|
|
38
38
|
import type { FeatureFeedbackServiceInterface } from '@internetarchive/feature-feedback';
|
|
39
39
|
import type { RecaptchaManagerInterface } from '@internetarchive/recaptcha-manager';
|
|
40
|
-
import './tiles/tile-dispatcher
|
|
41
|
-
import './tiles/collection-browser-loading-tile
|
|
42
|
-
import './sort-filter-bar/sort-filter-bar
|
|
43
|
-
import './collection-facets
|
|
44
|
-
import './circular-activity-indicator
|
|
45
|
-
import './sort-filter-bar/sort-filter-bar
|
|
40
|
+
import './tiles/tile-dispatcher';
|
|
41
|
+
import './tiles/collection-browser-loading-tile';
|
|
42
|
+
import './sort-filter-bar/sort-filter-bar';
|
|
43
|
+
import './collection-facets';
|
|
44
|
+
import './circular-activity-indicator';
|
|
45
|
+
import './sort-filter-bar/sort-filter-bar';
|
|
46
46
|
import {
|
|
47
47
|
SelectedFacets,
|
|
48
48
|
SortField,
|
|
@@ -56,21 +56,21 @@ import {
|
|
|
56
56
|
PrefixFilterCounts,
|
|
57
57
|
prefixFilterAggregationKeys,
|
|
58
58
|
FacetEventDetails,
|
|
59
|
-
} from './models
|
|
59
|
+
} from './models';
|
|
60
60
|
import {
|
|
61
61
|
RestorationStateHandlerInterface,
|
|
62
62
|
RestorationStateHandler,
|
|
63
63
|
RestorationState,
|
|
64
|
-
} from './restoration-state-handler
|
|
65
|
-
import chevronIcon from './assets/img/icons/chevron
|
|
66
|
-
import type { PlaceholderType } from './empty-placeholder
|
|
67
|
-
import './empty-placeholder
|
|
64
|
+
} from './restoration-state-handler';
|
|
65
|
+
import chevronIcon from './assets/img/icons/chevron';
|
|
66
|
+
import type { PlaceholderType } from './empty-placeholder';
|
|
67
|
+
import './empty-placeholder';
|
|
68
68
|
|
|
69
69
|
import {
|
|
70
70
|
analyticsActions,
|
|
71
71
|
analyticsCategories,
|
|
72
|
-
} from './utils/analytics-events
|
|
73
|
-
import { srOnlyStyle } from './styles/sr-only
|
|
72
|
+
} from './utils/analytics-events';
|
|
73
|
+
import { srOnlyStyle } from './styles/sr-only';
|
|
74
74
|
|
|
75
75
|
@customElement('collection-browser')
|
|
76
76
|
export class CollectionBrowser
|
|
@@ -147,10 +147,6 @@ export class CollectionBrowser
|
|
|
147
147
|
*/
|
|
148
148
|
@property({ type: Boolean }) isManageView = false;
|
|
149
149
|
|
|
150
|
-
@property({ type: Boolean }) prerender = false;
|
|
151
|
-
@property({ type: Object }) prerenderSearchResults?: SearchResult[];
|
|
152
|
-
@property({ type: Number }) totalResults?: number;
|
|
153
|
-
|
|
154
150
|
/**
|
|
155
151
|
* The page that the consumer wants to load.
|
|
156
152
|
*/
|
|
@@ -177,6 +173,8 @@ export class CollectionBrowser
|
|
|
177
173
|
|
|
178
174
|
@state() private fullYearsHistogramAggregation: Aggregation | undefined;
|
|
179
175
|
|
|
176
|
+
@state() private totalResults?: number;
|
|
177
|
+
|
|
180
178
|
@state() private queryErrorMessage?: string;
|
|
181
179
|
|
|
182
180
|
@state() private mobileView = false;
|
|
@@ -347,12 +345,6 @@ export class CollectionBrowser
|
|
|
347
345
|
|
|
348
346
|
render() {
|
|
349
347
|
this.setPlaceholderType();
|
|
350
|
-
|
|
351
|
-
if (this.prerender && this.prerenderSearchResults) {
|
|
352
|
-
this.updateDataSource(1, this.prerenderSearchResults);
|
|
353
|
-
this.totalResults ??= this.prerenderSearchResults.length;
|
|
354
|
-
}
|
|
355
|
-
|
|
356
348
|
return html`
|
|
357
349
|
<div
|
|
358
350
|
id="content-container"
|
|
@@ -366,8 +358,6 @@ export class CollectionBrowser
|
|
|
366
358
|
}
|
|
367
359
|
|
|
368
360
|
private setPlaceholderType() {
|
|
369
|
-
if (this.prerender && this.prerenderSearchResults) return null;
|
|
370
|
-
|
|
371
361
|
this.placeholderType = null;
|
|
372
362
|
if (!this.baseQuery?.trim()) {
|
|
373
363
|
this.placeholderType = 'empty-query';
|
|
@@ -491,14 +481,10 @@ export class CollectionBrowser
|
|
|
491
481
|
}
|
|
492
482
|
|
|
493
483
|
private get infiniteScrollerTemplate() {
|
|
494
|
-
let itemCount = this.placeholderType ? 0 : nothing;
|
|
495
|
-
if (this.prerender && this.totalResults) itemCount = this.totalResults;
|
|
496
|
-
|
|
497
484
|
return html`<infinite-scroller
|
|
498
485
|
class=${this.infiniteScrollerClasses}
|
|
486
|
+
itemCount=${this.placeholderType ? 0 : nothing}
|
|
499
487
|
ariaLandmarkLabel="Search results"
|
|
500
|
-
?prerender=${this.prerender}
|
|
501
|
-
.itemCount=${itemCount}
|
|
502
488
|
.cellProvider=${this}
|
|
503
489
|
.placeholderCellTemplate=${this.placeholderCellTemplate}
|
|
504
490
|
@scrollThresholdReached=${this.scrollThresholdReached}
|
|
@@ -1834,7 +1820,6 @@ export class CollectionBrowser
|
|
|
1834
1820
|
|
|
1835
1821
|
return html`
|
|
1836
1822
|
<tile-dispatcher
|
|
1837
|
-
?prerender=${this.prerender}
|
|
1838
1823
|
.baseNavigationUrl=${this.baseNavigationUrl}
|
|
1839
1824
|
.baseImageUrl=${this.baseImageUrl}
|
|
1840
1825
|
.model=${model}
|
|
@@ -2,8 +2,8 @@ import { css, html, LitElement, TemplateResult, CSSResultGroup } from 'lit';
|
|
|
2
2
|
import { customElement, property } from 'lit/decorators.js';
|
|
3
3
|
import { repeat } from 'lit/directives/repeat.js';
|
|
4
4
|
import type { CollectionNameCacheInterface } from '@internetarchive/collection-name-cache';
|
|
5
|
-
import eyeIcon from '../assets/img/icons/eye
|
|
6
|
-
import eyeClosedIcon from '../assets/img/icons/eye-closed
|
|
5
|
+
import eyeIcon from '../assets/img/icons/eye';
|
|
6
|
+
import eyeClosedIcon from '../assets/img/icons/eye-closed';
|
|
7
7
|
import {
|
|
8
8
|
FacetGroup,
|
|
9
9
|
FacetOption,
|
|
@@ -12,7 +12,7 @@ import {
|
|
|
12
12
|
getDefaultSelectedFacets,
|
|
13
13
|
FacetEventDetails,
|
|
14
14
|
FacetState,
|
|
15
|
-
} from '../models
|
|
15
|
+
} from '../models';
|
|
16
16
|
|
|
17
17
|
@customElement('facets-template')
|
|
18
18
|
export class FacetsTemplate extends LitElement {
|
|
@@ -31,16 +31,16 @@ import {
|
|
|
31
31
|
suppressedCollections,
|
|
32
32
|
valueFacetSort,
|
|
33
33
|
defaultFacetSort,
|
|
34
|
-
} from '../models
|
|
35
|
-
import '@internetarchive/ia-activity-indicator';
|
|
36
|
-
import './more-facets-pagination
|
|
37
|
-
import './facets-template
|
|
34
|
+
} from '../models';
|
|
35
|
+
import '@internetarchive/ia-activity-indicator/ia-activity-indicator';
|
|
36
|
+
import './more-facets-pagination';
|
|
37
|
+
import './facets-template';
|
|
38
38
|
import {
|
|
39
39
|
analyticsActions,
|
|
40
40
|
analyticsCategories,
|
|
41
|
-
} from '../utils/analytics-events
|
|
42
|
-
import './toggle-switch
|
|
43
|
-
import { srOnlyStyle } from '../styles/sr-only
|
|
41
|
+
} from '../utils/analytics-events';
|
|
42
|
+
import './toggle-switch';
|
|
43
|
+
import { srOnlyStyle } from '../styles/sr-only';
|
|
44
44
|
|
|
45
45
|
@customElement('more-facets-content')
|
|
46
46
|
export class MoreFacetsContent extends LitElement {
|
|
@@ -7,9 +7,9 @@ import {
|
|
|
7
7
|
TemplateResult,
|
|
8
8
|
} from 'lit';
|
|
9
9
|
import { customElement, property, state } from 'lit/decorators.js';
|
|
10
|
-
import arrowLeftIcon from '../assets/img/icons/arrow-left
|
|
11
|
-
import arrowRightIcon from '../assets/img/icons/arrow-right
|
|
12
|
-
import { srOnlyStyle } from '../styles/sr-only
|
|
10
|
+
import arrowLeftIcon from '../assets/img/icons/arrow-left';
|
|
11
|
+
import arrowRightIcon from '../assets/img/icons/arrow-right';
|
|
12
|
+
import { srOnlyStyle } from '../styles/sr-only';
|
|
13
13
|
|
|
14
14
|
@customElement('more-facets-pagination')
|
|
15
15
|
export class MoreFacetsPagination extends LitElement {
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { css, html, LitElement, CSSResultGroup } from 'lit';
|
|
2
2
|
import { customElement, property, query } from 'lit/decorators.js';
|
|
3
|
-
import { srOnlyStyle } from '../styles/sr-only
|
|
3
|
+
import { srOnlyStyle } from '../styles/sr-only';
|
|
4
4
|
|
|
5
5
|
export type Side = 'left' | 'right';
|
|
6
6
|
|
package/src/collection-facets.ts
CHANGED
|
@@ -30,8 +30,8 @@ import type { FeatureFeedbackServiceInterface } from '@internetarchive/feature-f
|
|
|
30
30
|
import type { RecaptchaManagerInterface } from '@internetarchive/recaptcha-manager';
|
|
31
31
|
import type { AnalyticsManagerInterface } from '@internetarchive/analytics-manager';
|
|
32
32
|
import type { SharedResizeObserverInterface } from '@internetarchive/shared-resize-observer';
|
|
33
|
-
import chevronIcon from './assets/img/icons/chevron
|
|
34
|
-
import expandIcon from './assets/img/icons/expand
|
|
33
|
+
import chevronIcon from './assets/img/icons/chevron';
|
|
34
|
+
import expandIcon from './assets/img/icons/expand';
|
|
35
35
|
import {
|
|
36
36
|
FacetOption,
|
|
37
37
|
SelectedFacets,
|
|
@@ -44,17 +44,17 @@ import {
|
|
|
44
44
|
LendingFacetKey,
|
|
45
45
|
suppressedCollections,
|
|
46
46
|
defaultFacetSort,
|
|
47
|
-
} from './models
|
|
48
|
-
import './collection-facets/more-facets-content
|
|
49
|
-
import './collection-facets/facets-template
|
|
50
|
-
import './collection-facets/facet-tombstone-row
|
|
51
|
-
import './expanded-date-picker
|
|
47
|
+
} from './models';
|
|
48
|
+
import './collection-facets/more-facets-content';
|
|
49
|
+
import './collection-facets/facets-template';
|
|
50
|
+
import './collection-facets/facet-tombstone-row';
|
|
51
|
+
import './expanded-date-picker';
|
|
52
52
|
import {
|
|
53
53
|
analyticsActions,
|
|
54
54
|
analyticsCategories,
|
|
55
|
-
} from './utils/analytics-events
|
|
56
|
-
import { srOnlyStyle } from './styles/sr-only
|
|
57
|
-
import { ExpandedDatePicker } from './expanded-date-picker
|
|
55
|
+
} from './utils/analytics-events';
|
|
56
|
+
import { srOnlyStyle } from './styles/sr-only';
|
|
57
|
+
import { ExpandedDatePicker } from './expanded-date-picker';
|
|
58
58
|
|
|
59
59
|
@customElement('collection-facets')
|
|
60
60
|
export class CollectionFacets extends LitElement {
|