@internetarchive/collection-browser 0.2.22 → 0.2.23-fa2

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.
@@ -29,6 +29,7 @@ export declare class AppRoot extends LitElement {
29
29
  private baseQueryChanged;
30
30
  private loginChanged;
31
31
  private outlineChanged;
32
+ private toggleFacetGroupOutline;
32
33
  private snippetsChanged;
33
34
  private rowGapChanged;
34
35
  private colGapChanged;
@@ -63,22 +63,33 @@ let AppRoot = class AppRoot extends LitElement {
63
63
  var _a;
64
64
  return html `
65
65
  <div id="dev-tools">
66
- <form @submit=${this.searchPressed}>
67
- Query:
68
- <input
69
- type="text"
70
- id="base-query-field"
71
- .value=${(_a = this.searchQuery) !== null && _a !== void 0 ? _a : ''}
72
- />
73
- <input type="submit" value="Search" />
74
- </form>
75
-
76
- <form @submit=${this.changePagePressed}>
77
- Page: <input type="number" value="1" id="page-number-input" />
78
- <input type="submit" value="Go" />
79
- </form>
80
-
81
- <div id="last-event">
66
+ <div id="search-and-page-inputs">
67
+ <form @submit=${this.searchPressed}>
68
+ Query:
69
+ <input
70
+ type="text"
71
+ id="base-query-field"
72
+ .value=${(_a = this.searchQuery) !== null && _a !== void 0 ? _a : ''}
73
+ />
74
+ <input type="submit" value="Search" />
75
+ </form>
76
+ <form @submit=${this.changePagePressed}>
77
+ Page: <input type="number" value="1" id="page-number-input" />
78
+ <input type="submit" value="Go" />
79
+ </form>
80
+ </div>
81
+ <div id="toggle-controls">
82
+ <button
83
+ @click=${() => {
84
+ var _a, _b;
85
+ const details = (_a = this.shadowRoot) === null || _a === void 0 ? void 0 : _a.getElementById('cell-size-control');
86
+ details === null || details === void 0 ? void 0 : details.classList.toggle('hidden');
87
+ const rowGapControls = (_b = this.shadowRoot) === null || _b === void 0 ? void 0 : _b.getElementById('cell-gap-control');
88
+ rowGapControls === null || rowGapControls === void 0 ? void 0 : rowGapControls.classList.toggle('hidden');
89
+ }}
90
+ >
91
+ Toggle Cell Controls
92
+ </button>
82
93
  <button
83
94
  @click=${() => {
84
95
  var _a;
@@ -88,13 +99,16 @@ let AppRoot = class AppRoot extends LitElement {
88
99
  >
89
100
  Last Event Captured
90
101
  </button>
102
+ </div>
103
+
104
+ <div id="last-event">
91
105
  <pre id="latest-event-details" class="hidden">
92
106
  ${JSON.stringify(this.latestAction, null, 2)}
93
107
  </pre
94
108
  >
95
109
  </div>
96
110
 
97
- <div id="cell-controls">
111
+ <div id="cell-controls" class="hidden">
98
112
  <div id="cell-size-control">
99
113
  <div>
100
114
  <label for="cell-width-slider">Minimum cell width:</label>
@@ -130,6 +144,16 @@ let AppRoot = class AppRoot extends LitElement {
130
144
  @click=${this.outlineChanged}
131
145
  />
132
146
  </div>
147
+ <div>
148
+ <label for="show-facet-group-outline-check"
149
+ >Show Facet Group Outlines:</label
150
+ >
151
+ <input
152
+ type="checkbox"
153
+ id="show-facet-group-outline-check"
154
+ @click=${this.toggleFacetGroupOutline}
155
+ />
156
+ </div>
133
157
  <div>
134
158
  <label for="simulate-login">Simulate Login:</label>
135
159
  <input
@@ -218,6 +242,17 @@ let AppRoot = class AppRoot extends LitElement {
218
242
  this.collectionBrowser.style.removeProperty('--infiniteScrollerCellOutline');
219
243
  }
220
244
  }
245
+ toggleFacetGroupOutline(e) {
246
+ const target = e.target;
247
+ if (target.checked) {
248
+ this.collectionBrowser.classList.add('showFacetGroupOutlines');
249
+ this.modalManager.classList.add('showFacetGroupOutlines');
250
+ }
251
+ else {
252
+ this.collectionBrowser.classList.remove('showFacetGroupOutlines');
253
+ this.modalManager.classList.remove('showFacetGroupOutlines');
254
+ }
255
+ }
221
256
  async snippetsChanged(e) {
222
257
  const target = e.target;
223
258
  if (target.checked) {
@@ -328,6 +363,12 @@ AppRoot.styles = css `
328
363
  margin-top: 20rem;
329
364
  }
330
365
 
366
+ modal-manager.showFacetGroupOutlines,
367
+ collection-browser.showFacetGroupOutlines {
368
+ --facet-row-border-top: 1px solid red;
369
+ --facet-row-border-bottom: 1px solid blue;
370
+ }
371
+
331
372
  #base-query-field {
332
373
  width: 300px;
333
374
  }
@@ -341,6 +382,11 @@ AppRoot.styles = css `
341
382
  backdrop-filter: blur(10px);
342
383
  padding: 0.5rem 1rem;
343
384
  border: 1px solid black;
385
+ font-size: 1.4rem;
386
+ }
387
+
388
+ #dev-tools > * {
389
+ display: flex;
344
390
  }
345
391
 
346
392
  #cell-controls {
@@ -365,6 +411,12 @@ AppRoot.styles = css `
365
411
  .hidden {
366
412
  display: none;
367
413
  }
414
+
415
+ #toggle-controls {
416
+ background-color: lightskyblue;
417
+ padding: 5px;
418
+ margin: 5px auto;
419
+ }
368
420
  `;
369
421
  __decorate([
370
422
  state()
@@ -1 +1 @@
1
- {"version":3,"file":"app-root.js","sourceRoot":"","sources":["../../src/app-root.ts"],"names":[],"mappings":"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","sourcesContent":["import {\n AnalyticsEvent,\n AnalyticsManager,\n} from '@internetarchive/analytics-manager';\nimport { SearchService } from '@internetarchive/search-service';\nimport { LocalCache } from '@internetarchive/local-cache';\nimport { html, css, LitElement, PropertyValues } from 'lit';\nimport { customElement, property, query, state } from 'lit/decorators.js';\nimport { SharedResizeObserver } from '@internetarchive/shared-resize-observer';\nimport { CollectionNameCache } from '@internetarchive/collection-name-cache';\n\nimport type { ModalManagerInterface } from '@internetarchive/modal-manager';\nimport type { AnalyticsManagerInterface } from '@internetarchive/analytics-manager';\nimport type { CollectionBrowser } from '../src/collection-browser';\n\nimport '../src/collection-browser';\n\n@customElement('app-root')\nexport class AppRoot extends LitElement {\n private searchService = SearchService.default;\n\n private resizeObserver = new SharedResizeObserver();\n\n private localCache = new LocalCache();\n\n private collectionNameCache = new CollectionNameCache({\n searchService: this.searchService,\n localCache: this.localCache,\n });\n\n @state() private currentPage?: number;\n\n @state() private searchQuery?: string;\n\n @state() private cellWidth: number = 18;\n\n @state() private cellHeight: number = 29;\n\n @state() private rowGap: number = 1.7;\n\n @state() private colGap: number = 1.7;\n\n @state() private loggedIn: boolean = false;\n\n @property({ type: Object, reflect: false }) latestAction?: AnalyticsEvent;\n\n @query('#base-query-field') private baseQueryField!: HTMLInputElement;\n\n @query('#page-number-input') private pageNumberInput!: HTMLInputElement;\n\n @query('collection-browser') private collectionBrowser!: CollectionBrowser;\n\n @query('modal-manager') private modalManager!: ModalManagerInterface;\n\n private analyticsManager = new AnalyticsManager();\n\n private analyticsHandler: AnalyticsManagerInterface = {\n sendPing: this.sendAnalytics.bind(this),\n sendEvent: this.sendAnalytics.bind(this),\n sendEventNoSampling: this.sendAnalytics.bind(this),\n };\n\n private sendAnalytics(ae: AnalyticsEvent) {\n console.log('Analytics Received ----', ae);\n this.latestAction = ae;\n this.analyticsManager?.sendEventNoSampling(ae);\n }\n\n private searchPressed(e: Event) {\n e.preventDefault();\n this.searchQuery = this.baseQueryField.value;\n if ((this.currentPage ?? 1) > 1) {\n this.collectionBrowser.goToPage(this.currentPage ?? 1);\n }\n }\n\n private changePagePressed(e: Event) {\n e.preventDefault();\n this.currentPage = this.pageNumberInput.valueAsNumber;\n this.collectionBrowser.goToPage(this.currentPage);\n }\n\n protected override updated(changed: PropertyValues): void {\n if (changed.has('currentPage') && this.currentPage) {\n this.pageNumberInput.value = this.currentPage.toString();\n }\n\n if (changed.has('searchQuery')) {\n this.queryUpdated();\n }\n }\n\n private queryUpdated() {\n this.collectionBrowser.baseQuery = this.searchQuery;\n }\n\n render() {\n return html`\n <div id=\"dev-tools\">\n <form @submit=${this.searchPressed}>\n Query:\n <input\n type=\"text\"\n id=\"base-query-field\"\n .value=${this.searchQuery ?? ''}\n />\n <input type=\"submit\" value=\"Search\" />\n </form>\n\n <form @submit=${this.changePagePressed}>\n Page: <input type=\"number\" value=\"1\" id=\"page-number-input\" />\n <input type=\"submit\" value=\"Go\" />\n </form>\n\n <div id=\"last-event\">\n <button\n @click=${() => {\n const details = this.shadowRoot?.getElementById(\n 'latest-event-details'\n );\n details?.classList.toggle('hidden');\n }}\n >\n Last Event Captured\n </button>\n <pre id=\"latest-event-details\" class=\"hidden\">\n ${JSON.stringify(this.latestAction, null, 2)}\n </pre\n >\n </div>\n\n <div id=\"cell-controls\">\n <div id=\"cell-size-control\">\n <div>\n <label for=\"cell-width-slider\">Minimum cell width:</label>\n <input\n type=\"range\"\n min=\"10\"\n max=\"100\"\n value=\"18\"\n step=\"0.1\"\n id=\"cell-width-slider\"\n @input=${this.widthChanged}\n />\n <span>${this.cellWidth}rem</span>\n </div>\n <div>\n <label for=\"cell-height-slider\">Cell height:</label>\n <input\n type=\"range\"\n min=\"10\"\n max=\"100\"\n value=\"29\"\n step=\"0.1\"\n id=\"cell-height-slider\"\n @input=${this.heightChanged}\n />\n <span>${this.cellHeight}rem</span>\n </div>\n <div>\n <label for=\"show-outline-check\">Show outlines:</label>\n <input\n type=\"checkbox\"\n id=\"show-outline-check\"\n @click=${this.outlineChanged}\n />\n </div>\n <div>\n <label for=\"simulate-login\">Simulate Login:</label>\n <input\n type=\"checkbox\"\n id=\"simulate-login\"\n @click=${this.loginChanged}\n />\n </div>\n <div>\n <label for=\"show-dummy-snippets\">Show dummy snippets:</label>\n <input\n type=\"checkbox\"\n id=\"show-dummy-snippets\"\n @click=${this.snippetsChanged}\n />\n </div>\n </div>\n <div id=\"cell-gap-control\">\n <div>\n <label for=\"cell-row-gap-slider\">Row gap:</label>\n <input\n type=\"range\"\n min=\"0\"\n max=\"5\"\n value=\"1.7\"\n step=\"0.1\"\n id=\"cell-row-gap-slider\"\n @input=${this.rowGapChanged}\n />\n <span>${this.rowGap}rem</span>\n </div>\n <div>\n <label for=\"cell-col-gap-slider\">Col gap:</label>\n <input\n type=\"range\"\n min=\"0\"\n max=\"5\"\n value=\"1.7\"\n step=\"0.1\"\n id=\"cell-col-gap-slider\"\n @input=${this.colGapChanged}\n />\n <span>${this.colGap}rem</span>\n </div>\n </div>\n </div>\n </div>\n\n <div id=\"collection-browser-container\">\n <collection-browser\n .baseNavigationUrl=${'https://archive.org'}\n .baseImageUrl=${'https://archive.org'}\n .searchService=${this.searchService}\n .resizeObserver=${this.resizeObserver}\n .collectionNameCache=${this.collectionNameCache}\n .showHistogramDatePicker=${true}\n .loggedIn=${this.loggedIn}\n .modalManager=${this.modalManager}\n .analyticsHandler=${this.analyticsHandler}\n @visiblePageChanged=${this.visiblePageChanged}\n @baseQueryChanged=${this.baseQueryChanged}\n >\n </collection-browser>\n </div>\n <modal-manager></modal-manager>\n `;\n }\n\n private baseQueryChanged(e: CustomEvent<{ baseQuery?: string }>) {\n this.searchQuery = e.detail.baseQuery;\n }\n\n private loginChanged(e: Event) {\n const target = e.target as HTMLInputElement;\n if (target.checked) {\n this.loggedIn = true;\n } else {\n this.loggedIn = false;\n }\n }\n\n private outlineChanged(e: Event) {\n const target = e.target as HTMLInputElement;\n if (target.checked) {\n this.collectionBrowser.style.setProperty(\n '--infiniteScrollerCellOutline',\n '1px solid #33D1FF'\n );\n } else {\n this.collectionBrowser.style.removeProperty(\n '--infiniteScrollerCellOutline'\n );\n }\n }\n\n private async snippetsChanged(e: Event) {\n const target = e.target as HTMLInputElement;\n if (target.checked) {\n // Decorate the default search service with a wrapper that adds\n // dummy snippets to any successful searches\n this.searchService = {\n ...SearchService.default,\n async search(params) {\n const result = await SearchService.default.search(params);\n result.success?.response.docs.forEach(doc => {\n const metadata = doc.rawMetadata;\n if (metadata) {\n metadata.snippets = [\n 'this is a text {{{snippet}}} block with potentially',\n 'multiple {{{snippets}}} and such',\n 'but the {{{snippet}}} block may be quite long perhaps',\n 'depending on how many {{{snippet}}} matches there are',\n 'there may be multiple lines of {{{snippets}}} to show',\n 'but each {{{snippet}}} should be relatively short',\n 'and {{{snippets}}} are each a {{{snippet}}} of text',\n 'but every {{{snippet}}} might have multiple matches',\n 'the {{{snippets}}} should be separated and surrounded by ellipses',\n ];\n }\n });\n return result;\n },\n };\n } else {\n // Restore the default seach service\n this.searchService = SearchService.default;\n }\n\n // Re-perform the current search to show/hide the snippets immediately\n const oldQuery = this.searchQuery;\n this.searchQuery = ''; // Should just reset to the placeholder\n await this.updateComplete;\n // For unclear reasons, Safari refuses to re-apply the old query until the next tick, hence:\n await new Promise(res => {\n setTimeout(res, 0);\n });\n this.searchQuery = oldQuery; // Re-apply the original query\n }\n\n private rowGapChanged(e: Event) {\n const input = e.target as HTMLInputElement;\n this.rowGap = parseFloat(input.value);\n this.collectionBrowser.style.setProperty(\n '--collectionBrowserRowGap',\n `${input.value}rem`\n );\n }\n\n private colGapChanged(e: Event) {\n const input = e.target as HTMLInputElement;\n this.colGap = parseFloat(input.value);\n this.collectionBrowser.style.setProperty(\n '--collectionBrowserColGap',\n `${input.value}rem`\n );\n }\n\n private widthChanged(e: Event) {\n const input = e.target as HTMLInputElement;\n this.cellWidth = parseFloat(input.value);\n this.collectionBrowser.style.setProperty(\n '--collectionBrowserCellMinWidth',\n `${input.value}rem`\n );\n }\n\n private heightChanged(e: Event) {\n const input = e.target as HTMLInputElement;\n this.cellHeight = parseFloat(input.value);\n this.collectionBrowser.style.setProperty(\n '--collectionBrowserCellMinHeight',\n `${input.value}rem`\n );\n this.collectionBrowser.style.setProperty(\n '--collectionBrowserCellMaxHeight',\n `${input.value}rem`\n );\n }\n\n private visiblePageChanged(e: CustomEvent<{ pageNumber: number }>) {\n const { pageNumber } = e.detail;\n if (pageNumber === this.currentPage) return;\n this.currentPage = pageNumber;\n }\n\n static styles = css`\n :host {\n display: block;\n --primaryButtonBGColor: #194880;\n --ia-theme-link-color: #4b64ff;\n }\n\n /* add the following styles to ensure proper modal visibility */\n body.modal-manager-open {\n overflow: hidden;\n }\n modal-manager {\n display: none;\n }\n modal-manager[mode='open'] {\n display: block;\n }\n modal-manager.more-search-facets {\n --modalWidth: 85rem;\n --modalBorder: 2px solid var(--primaryButtonBGColor, #194880);\n --modalTitleLineHeight: 4rem;\n --modalTitleFontSize: 1.8rem;\n --modalCornerRadius: 0;\n --modalBottomPadding: 0;\n --modalBottomMargin: 0;\n --modalScrollOffset: 0;\n --modalCornerRadius: 0.5rem;\n }\n\n input,\n button {\n font-size: 1.6rem;\n }\n\n collection-browser {\n margin-top: 20rem;\n }\n\n #base-query-field {\n width: 300px;\n }\n\n #dev-tools {\n position: fixed;\n top: 0;\n left: 0;\n z-index: 1;\n -webkit-backdrop-filter: blur(10px);\n backdrop-filter: blur(10px);\n padding: 0.5rem 1rem;\n border: 1px solid black;\n }\n\n #cell-controls {\n display: flex;\n }\n\n #cell-controls label {\n display: inline-block;\n width: 10rem;\n }\n\n #cell-gap-control {\n margin-left: 1rem;\n }\n\n #last-event {\n background-color: aliceblue;\n padding: 5px;\n margin: 5px auto;\n }\n\n .hidden {\n display: none;\n }\n `;\n}\n"]}
1
+ {"version":3,"file":"app-root.js","sourceRoot":"","sources":["../../src/app-root.ts"],"names":[],"mappings":"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","sourcesContent":["import {\n AnalyticsEvent,\n AnalyticsManager,\n} from '@internetarchive/analytics-manager';\nimport { SearchService } from '@internetarchive/search-service';\nimport { LocalCache } from '@internetarchive/local-cache';\nimport { html, css, LitElement, PropertyValues } from 'lit';\nimport { customElement, property, query, state } from 'lit/decorators.js';\nimport { SharedResizeObserver } from '@internetarchive/shared-resize-observer';\nimport { CollectionNameCache } from '@internetarchive/collection-name-cache';\n\nimport type { ModalManagerInterface } from '@internetarchive/modal-manager';\nimport type { AnalyticsManagerInterface } from '@internetarchive/analytics-manager';\nimport type { CollectionBrowser } from '../src/collection-browser';\n\nimport '../src/collection-browser';\n\n@customElement('app-root')\nexport class AppRoot extends LitElement {\n private searchService = SearchService.default;\n\n private resizeObserver = new SharedResizeObserver();\n\n private localCache = new LocalCache();\n\n private collectionNameCache = new CollectionNameCache({\n searchService: this.searchService,\n localCache: this.localCache,\n });\n\n @state() private currentPage?: number;\n\n @state() private searchQuery?: string;\n\n @state() private cellWidth: number = 18;\n\n @state() private cellHeight: number = 29;\n\n @state() private rowGap: number = 1.7;\n\n @state() private colGap: number = 1.7;\n\n @state() private loggedIn: boolean = false;\n\n @property({ type: Object, reflect: false }) latestAction?: AnalyticsEvent;\n\n @query('#base-query-field') private baseQueryField!: HTMLInputElement;\n\n @query('#page-number-input') private pageNumberInput!: HTMLInputElement;\n\n @query('collection-browser') private collectionBrowser!: CollectionBrowser;\n\n @query('modal-manager') private modalManager!: ModalManagerInterface;\n\n private analyticsManager = new AnalyticsManager();\n\n private analyticsHandler: AnalyticsManagerInterface = {\n sendPing: this.sendAnalytics.bind(this),\n sendEvent: this.sendAnalytics.bind(this),\n sendEventNoSampling: this.sendAnalytics.bind(this),\n };\n\n private sendAnalytics(ae: AnalyticsEvent) {\n console.log('Analytics Received ----', ae);\n this.latestAction = ae;\n this.analyticsManager?.sendEventNoSampling(ae);\n }\n\n private searchPressed(e: Event) {\n e.preventDefault();\n this.searchQuery = this.baseQueryField.value;\n if ((this.currentPage ?? 1) > 1) {\n this.collectionBrowser.goToPage(this.currentPage ?? 1);\n }\n }\n\n private changePagePressed(e: Event) {\n e.preventDefault();\n this.currentPage = this.pageNumberInput.valueAsNumber;\n this.collectionBrowser.goToPage(this.currentPage);\n }\n\n protected override updated(changed: PropertyValues): void {\n if (changed.has('currentPage') && this.currentPage) {\n this.pageNumberInput.value = this.currentPage.toString();\n }\n\n if (changed.has('searchQuery')) {\n this.queryUpdated();\n }\n }\n\n private queryUpdated() {\n this.collectionBrowser.baseQuery = this.searchQuery;\n }\n\n render() {\n return html`\n <div id=\"dev-tools\">\n <div id=\"search-and-page-inputs\">\n <form @submit=${this.searchPressed}>\n Query:\n <input\n type=\"text\"\n id=\"base-query-field\"\n .value=${this.searchQuery ?? ''}\n />\n <input type=\"submit\" value=\"Search\" />\n </form>\n <form @submit=${this.changePagePressed}>\n Page: <input type=\"number\" value=\"1\" id=\"page-number-input\" />\n <input type=\"submit\" value=\"Go\" />\n </form>\n </div>\n <div id=\"toggle-controls\">\n <button\n @click=${() => {\n const details =\n this.shadowRoot?.getElementById('cell-size-control');\n details?.classList.toggle('hidden');\n const rowGapControls =\n this.shadowRoot?.getElementById('cell-gap-control');\n rowGapControls?.classList.toggle('hidden');\n }}\n >\n Toggle Cell Controls\n </button>\n <button\n @click=${() => {\n const details = this.shadowRoot?.getElementById(\n 'latest-event-details'\n );\n details?.classList.toggle('hidden');\n }}\n >\n Last Event Captured\n </button>\n </div>\n\n <div id=\"last-event\">\n <pre id=\"latest-event-details\" class=\"hidden\">\n ${JSON.stringify(this.latestAction, null, 2)}\n </pre\n >\n </div>\n\n <div id=\"cell-controls\" class=\"hidden\">\n <div id=\"cell-size-control\">\n <div>\n <label for=\"cell-width-slider\">Minimum cell width:</label>\n <input\n type=\"range\"\n min=\"10\"\n max=\"100\"\n value=\"18\"\n step=\"0.1\"\n id=\"cell-width-slider\"\n @input=${this.widthChanged}\n />\n <span>${this.cellWidth}rem</span>\n </div>\n <div>\n <label for=\"cell-height-slider\">Cell height:</label>\n <input\n type=\"range\"\n min=\"10\"\n max=\"100\"\n value=\"29\"\n step=\"0.1\"\n id=\"cell-height-slider\"\n @input=${this.heightChanged}\n />\n <span>${this.cellHeight}rem</span>\n </div>\n <div>\n <label for=\"show-outline-check\">Show outlines:</label>\n <input\n type=\"checkbox\"\n id=\"show-outline-check\"\n @click=${this.outlineChanged}\n />\n </div>\n <div>\n <label for=\"show-facet-group-outline-check\"\n >Show Facet Group Outlines:</label\n >\n <input\n type=\"checkbox\"\n id=\"show-facet-group-outline-check\"\n @click=${this.toggleFacetGroupOutline}\n />\n </div>\n <div>\n <label for=\"simulate-login\">Simulate Login:</label>\n <input\n type=\"checkbox\"\n id=\"simulate-login\"\n @click=${this.loginChanged}\n />\n </div>\n <div>\n <label for=\"show-dummy-snippets\">Show dummy snippets:</label>\n <input\n type=\"checkbox\"\n id=\"show-dummy-snippets\"\n @click=${this.snippetsChanged}\n />\n </div>\n </div>\n <div id=\"cell-gap-control\">\n <div>\n <label for=\"cell-row-gap-slider\">Row gap:</label>\n <input\n type=\"range\"\n min=\"0\"\n max=\"5\"\n value=\"1.7\"\n step=\"0.1\"\n id=\"cell-row-gap-slider\"\n @input=${this.rowGapChanged}\n />\n <span>${this.rowGap}rem</span>\n </div>\n <div>\n <label for=\"cell-col-gap-slider\">Col gap:</label>\n <input\n type=\"range\"\n min=\"0\"\n max=\"5\"\n value=\"1.7\"\n step=\"0.1\"\n id=\"cell-col-gap-slider\"\n @input=${this.colGapChanged}\n />\n <span>${this.colGap}rem</span>\n </div>\n </div>\n </div>\n </div>\n\n <div id=\"collection-browser-container\">\n <collection-browser\n .baseNavigationUrl=${'https://archive.org'}\n .baseImageUrl=${'https://archive.org'}\n .searchService=${this.searchService}\n .resizeObserver=${this.resizeObserver}\n .collectionNameCache=${this.collectionNameCache}\n .showHistogramDatePicker=${true}\n .loggedIn=${this.loggedIn}\n .modalManager=${this.modalManager}\n .analyticsHandler=${this.analyticsHandler}\n @visiblePageChanged=${this.visiblePageChanged}\n @baseQueryChanged=${this.baseQueryChanged}\n >\n </collection-browser>\n </div>\n <modal-manager></modal-manager>\n `;\n }\n\n private baseQueryChanged(e: CustomEvent<{ baseQuery?: string }>) {\n this.searchQuery = e.detail.baseQuery;\n }\n\n private loginChanged(e: Event) {\n const target = e.target as HTMLInputElement;\n if (target.checked) {\n this.loggedIn = true;\n } else {\n this.loggedIn = false;\n }\n }\n\n private outlineChanged(e: Event) {\n const target = e.target as HTMLInputElement;\n if (target.checked) {\n this.collectionBrowser.style.setProperty(\n '--infiniteScrollerCellOutline',\n '1px solid #33D1FF'\n );\n } else {\n this.collectionBrowser.style.removeProperty(\n '--infiniteScrollerCellOutline'\n );\n }\n }\n\n private toggleFacetGroupOutline(e: Event) {\n const target = e.target as HTMLInputElement;\n if (target.checked) {\n this.collectionBrowser.classList.add('showFacetGroupOutlines');\n this.modalManager.classList.add('showFacetGroupOutlines');\n } else {\n this.collectionBrowser.classList.remove('showFacetGroupOutlines');\n this.modalManager.classList.remove('showFacetGroupOutlines');\n }\n }\n\n private async snippetsChanged(e: Event) {\n const target = e.target as HTMLInputElement;\n if (target.checked) {\n // Decorate the default search service with a wrapper that adds\n // dummy snippets to any successful searches\n this.searchService = {\n ...SearchService.default,\n async search(params) {\n const result = await SearchService.default.search(params);\n result.success?.response.docs.forEach(doc => {\n const metadata = doc.rawMetadata;\n if (metadata) {\n metadata.snippets = [\n 'this is a text {{{snippet}}} block with potentially',\n 'multiple {{{snippets}}} and such',\n 'but the {{{snippet}}} block may be quite long perhaps',\n 'depending on how many {{{snippet}}} matches there are',\n 'there may be multiple lines of {{{snippets}}} to show',\n 'but each {{{snippet}}} should be relatively short',\n 'and {{{snippets}}} are each a {{{snippet}}} of text',\n 'but every {{{snippet}}} might have multiple matches',\n 'the {{{snippets}}} should be separated and surrounded by ellipses',\n ];\n }\n });\n return result;\n },\n };\n } else {\n // Restore the default seach service\n this.searchService = SearchService.default;\n }\n\n // Re-perform the current search to show/hide the snippets immediately\n const oldQuery = this.searchQuery;\n this.searchQuery = ''; // Should just reset to the placeholder\n await this.updateComplete;\n // For unclear reasons, Safari refuses to re-apply the old query until the next tick, hence:\n await new Promise(res => {\n setTimeout(res, 0);\n });\n this.searchQuery = oldQuery; // Re-apply the original query\n }\n\n private rowGapChanged(e: Event) {\n const input = e.target as HTMLInputElement;\n this.rowGap = parseFloat(input.value);\n this.collectionBrowser.style.setProperty(\n '--collectionBrowserRowGap',\n `${input.value}rem`\n );\n }\n\n private colGapChanged(e: Event) {\n const input = e.target as HTMLInputElement;\n this.colGap = parseFloat(input.value);\n this.collectionBrowser.style.setProperty(\n '--collectionBrowserColGap',\n `${input.value}rem`\n );\n }\n\n private widthChanged(e: Event) {\n const input = e.target as HTMLInputElement;\n this.cellWidth = parseFloat(input.value);\n this.collectionBrowser.style.setProperty(\n '--collectionBrowserCellMinWidth',\n `${input.value}rem`\n );\n }\n\n private heightChanged(e: Event) {\n const input = e.target as HTMLInputElement;\n this.cellHeight = parseFloat(input.value);\n this.collectionBrowser.style.setProperty(\n '--collectionBrowserCellMinHeight',\n `${input.value}rem`\n );\n this.collectionBrowser.style.setProperty(\n '--collectionBrowserCellMaxHeight',\n `${input.value}rem`\n );\n }\n\n private visiblePageChanged(e: CustomEvent<{ pageNumber: number }>) {\n const { pageNumber } = e.detail;\n if (pageNumber === this.currentPage) return;\n this.currentPage = pageNumber;\n }\n\n static styles = css`\n :host {\n display: block;\n --primaryButtonBGColor: #194880;\n --ia-theme-link-color: #4b64ff;\n }\n\n /* add the following styles to ensure proper modal visibility */\n body.modal-manager-open {\n overflow: hidden;\n }\n modal-manager {\n display: none;\n }\n modal-manager[mode='open'] {\n display: block;\n }\n modal-manager.more-search-facets {\n --modalWidth: 85rem;\n --modalBorder: 2px solid var(--primaryButtonBGColor, #194880);\n --modalTitleLineHeight: 4rem;\n --modalTitleFontSize: 1.8rem;\n --modalCornerRadius: 0;\n --modalBottomPadding: 0;\n --modalBottomMargin: 0;\n --modalScrollOffset: 0;\n --modalCornerRadius: 0.5rem;\n }\n\n input,\n button {\n font-size: 1.6rem;\n }\n\n collection-browser {\n margin-top: 20rem;\n }\n\n modal-manager.showFacetGroupOutlines,\n collection-browser.showFacetGroupOutlines {\n --facet-row-border-top: 1px solid red;\n --facet-row-border-bottom: 1px solid blue;\n }\n\n #base-query-field {\n width: 300px;\n }\n\n #dev-tools {\n position: fixed;\n top: 0;\n left: 0;\n z-index: 1;\n -webkit-backdrop-filter: blur(10px);\n backdrop-filter: blur(10px);\n padding: 0.5rem 1rem;\n border: 1px solid black;\n font-size: 1.4rem;\n }\n\n #dev-tools > * {\n display: flex;\n }\n\n #cell-controls {\n display: flex;\n }\n\n #cell-controls label {\n display: inline-block;\n width: 10rem;\n }\n\n #cell-gap-control {\n margin-left: 1rem;\n }\n\n #last-event {\n background-color: aliceblue;\n padding: 5px;\n margin: 5px auto;\n }\n\n .hidden {\n display: none;\n }\n\n #toggle-controls {\n background-color: lightskyblue;\n padding: 5px;\n margin: 5px auto;\n }\n `;\n}\n"]}
File without changes
@@ -0,0 +1,72 @@
1
+ "use strict";
2
+ // import { LitElement, html, css, CSSResultGroup } from "lit";
3
+ // import { query, property, customElement } from "lit/decorators.js";
4
+ // @customElement('facet-group')
5
+ // export class FacetGroup extends LitElement {
6
+ // override render() {
7
+ // return html`
8
+ // <slot></slot>
9
+ // <slot></slot>
10
+ // `
11
+ // }
12
+ // static get styles(): CSSResultGroup {
13
+ // return css`
14
+ // :host {
15
+ // margin-bottom: 1rem;
16
+ // display: flex;
17
+ // align-items: start;
18
+ // font-weight: 500;
19
+ // font-size: 1.2rem;
20
+ // cursor: pointer;
21
+ // }
22
+ // ::slotted(.facet-checkbox) {
23
+ // border: 1px solid red;
24
+ // margin-right: 0.5rem;
25
+ // display: flex;
26
+ // align-items: center;
27
+ // }
28
+ // ::slotted(.select-facet-checkbox) {
29
+ // cursor: pointer;
30
+ // margin-right: 5px;
31
+ // }
32
+ // ::slotted(.hide-facet-checkbox) {
33
+ // display: none;
34
+ // }
35
+ // ::slotted(.hide-facet-icon) {
36
+ // width: 15px;
37
+ // height: 15px;
38
+ // cursor: pointer;
39
+ // opacity: 0.3;
40
+ // }
41
+ // ::slotted(.facet-info-display) {
42
+ // border: 1px solid blue;
43
+ // display: flex;
44
+ // flex: 1;
45
+ // }
46
+ // ::slotted(.facet-title) {
47
+ // flex: 1;
48
+ // }
49
+ // `
50
+ // }
51
+ // )
52
+ // /**
53
+ // <div class="facet-row">
54
+ // <div class="facet-checkbox">
55
+ // <input type="checkbox" class="select-facet-checkbox" name="mediatype" value="texts" title="Only show mediatype: texts" id="mediatype:texts-show-only">
56
+ // <input type="checkbox" class="hide-facet-checkbox" id="mediatype:texts-negative" name="mediatype" value="texts">
57
+ // <label for="mediatype:texts-negative" class="hide-facet-icon" title="Hide mediatype: texts">
58
+ // <span class="eye"><!--?lit$141655362$-->
59
+ // <svg viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg"><path d="m98 50.5704143c-.2830293-.471515-.671154-1.1088947-1.1643742-1.9121392s-1.6003642-2.3617474-3.3214321-4.6755089c-1.7210678-2.3137614-3.522258-4.5325939-5.4035703-6.6564975-1.8813124-2.1239037-4.2828993-4.473133-7.2047606-7.0476881-2.9218612-2.5745551-5.8895067-4.7933876-8.9029363-6.6564976-3.0134295-1.86311-6.4628491-3.4330878-10.3482587-4.7099336-3.8854095-1.2768458-7.7822651-1.9142256-11.6905667-1.9121443-3.9083017.0020914-7.8051573.6154781-11.6905668 1.8401652-3.8854096 1.2246871-7.3702078 2.8301329-10.4543947 4.8163375-3.0841869 1.9862045-6.0278997 4.1695691-8.8311384 6.5500937s-5.2048256 4.7652219-7.2047605 7.1540919c-1.99993501 2.38887-3.75430043 4.5722346-5.26309632 6.5500938s-2.63883199 3.583305-3.39010829 4.8163374l-1.13003609 1.8401602c.2830293.4715149.67115403 1.1088946 1.16437421 1.9121391.49322017.8032445 1.5878776 2.3617475 3.28397229 4.6755089s3.47439274 4.521119 5.3348942 6.6220728c1.8605014 2.1009538 4.2506422 4.4387083 7.1704224 7.0132633 2.9197801 2.5745551 5.8874256 4.7819127 8.9029363 6.6220729 3.0155106 1.8401601 6.4774168 3.398663 10.3857184 4.6755088 3.9083017 1.2768458 7.8176438 1.9142256 11.7280266 1.9121443 3.9103827-.0020914 7.7957922-.6154781 11.6562286-1.8401652s7.3337886-2.818658 10.4200566-4.7819127 6.0299808-4.1351444 8.8311384-6.515669 5.2152311-4.7652219 7.2422203-7.1540919 3.8052873-4.5607597 5.3348942-6.515669c1.5296068-1.9549093 2.6721295-3.5488802 3.427568-4.7819127zm-24.5142913 0c0 6.467683-2.3079374 12.0152859-6.9238123 16.6428087s-10.1495139 6.9412843-16.600917 6.9412843c-6.4992683 0-12.0453939-2.3137615-16.6383767-6.9412843s-6.8894742-10.1751257-6.8894742-16.6428087 2.2964914-12.003811 6.8894742-16.608384 10.1391084-6.9068595 16.6383767-6.9068595c6.4534842 0 11.9871232 2.3022865 16.600917 6.9068595s6.9217312 10.140701 6.9238123 16.608384zm-23.5247293-10.552755c2.8261308 0 5.2870289 1.0619518 7.3826944 3.1858555 2.0956655 2.1239036 3.1434982 4.5795368 3.1434982 7.3668995 0 2.8332624-1.0478327 5.2888956-3.1434982 7.3668995-2.0956655 2.078004-4.5565636 3.1170059-7.3826944 3.1170059-2.873996 0-5.3348941-1.0264838-7.3826944-3.0794516-2.0478002-2.0529677-3.0717003-4.5200758-3.0717003-7.4013243 0-2.8332624 1.0239001-5.3003705 3.0717003-7.4013243 2.0478003-2.1009538 4.5086984-3.1514307 7.3826944-3.1514307z" fill="#000"></path></svg>
60
+ // </span>
61
+ // <span class="eye-closed"><!--?lit$141655362$-->
62
+ // <svg viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg"><path d="m97.5245976 14.5407294-15.0809624 14.6188347c3.3026825 2.8601369 6.4111526 6.0234269 9.3254105 9.48987 2.9142578 3.4664431 5.0023086 6.2183876 6.2641522 8.2558335l1.9668021 3.1268688c-.291855.4841879-.6920826 1.1386987-1.2006828 1.9635322s-1.6502683 2.4252247-3.4250041 4.8011737c-1.7747358 2.3759489-3.6202894 4.6426342-5.5366607 6.8000558-1.9163713 2.1574217-4.3810437 4.5580085-7.3940172 7.2017606-3.0129735 2.643752-6.0731589 4.9104373-9.180556 6.8000558-3.1073972 1.8896186-6.6643798 3.4900098-10.6709478 4.8011737-4.0065681 1.3111639-8.0249391 1.9656747-12.055113 1.9635322-6.7019347 0-13.2343359-1.6732336-19.5972037-5.019701l-17.1185824 16.6562806-10.27179318-10.6917703 14.93288898-14.5449211c-3.2533247-2.8601369-6.3371159-6.0116436-9.25137378-9.45452-2.91425785-3.4428764-5.02698749-6.1819664-6.33818892-8.2172698l-1.8927654-3.0529552c.29185498-.4841879.69208259-1.1386987 1.20068282-1.9635322.50860022-.8248335 1.65026824-2.437008 3.42500406-4.8365236 1.77473582-2.3995157 3.62028938-4.6908389 5.53666072-6.8739696 1.9163713-2.1831307 4.3810437-4.5955009 7.3940172-7.2371105s6.0731589-4.9200783 9.180556-6.8354059c3.1073972-1.9153277 6.6772558-3.5275022 10.7095757-4.8365237 4.03232-1.3090215 8.0635669-1.9635322 12.0937409-1.9635322 6.5560071 0 13.0637294 1.6968003 19.5231669 5.090401l17.1185824-16.5823669zm-46.478979 24.584323 10.7803934-10.473243c-3.5451796-1.891761-7.3092505-2.8376415-11.2922126-2.8376415-6.6547228 0-12.3609169 2.3641657-17.1185824 7.0924969-4.7576654 4.7283312-7.1375711 10.437893-7.1397171 17.1286852 0 3.8306553.8251341 7.3945787 2.4754024 10.6917703l10.9284669-10.5471566v-.1446137c0-2.9094127 1.0687043-5.4546132 3.2061128-7.6356015 2.1374086-2.1809883 4.6868477-3.2714825 7.6483174-3.2714825h.5086002zm-1.1652739 21.5988543-10.7803935 10.6178566c3.5945375 1.9388943 7.4068932 2.9083415 11.4370672 2.9083415 6.6547228 0 12.3491139-2.375949 17.0831734-7.1278469s7.1021623-10.4486051 7.1043083-17.0901215c0-4.0234736-.874492-7.6356015-2.6234759-10.836384l-10.7095757 10.473243v.363141c0 2.9586884-1.0687042 5.4803223-3.2061128 7.5649015-2.1374085 2.0845792-4.6868476 3.1268688-7.6483173 3.1268688z" fill="#000"></path></svg>
63
+ // </span>
64
+ // </label>
65
+ // </div>
66
+ // <label class="facet-info-display" for="mediatype:texts-show-only" title="Only show mediatype: texts">
67
+ // <div class="facet-title"><!--?lit$141655362$--><!--?lit$141655362$-->texts<!--?--></div>
68
+ // <div class="facet-count"><!--?lit$141655362$-->51</div>
69
+ // </label>
70
+ // </div>
71
+ // */
72
+ //# sourceMappingURL=facet-group.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"facet-group.js","sourceRoot":"","sources":["../../../src/collection-facets/facet-group.ts"],"names":[],"mappings":";AAAA,+DAA+D;AAC/D,sEAAsE;AAEtE,gCAAgC;AAChC,+CAA+C;AAE/C,wBAAwB;AACxB,mBAAmB;AACnB,sBAAsB;AACtB,sBAAsB;AACtB,QAAQ;AACR,MAAM;AAEN,0CAA0C;AAC1C,kBAAkB;AAClB,gBAAgB;AAChB,+BAA+B;AAC/B,yBAAyB;AACzB,8BAA8B;AAC9B,4BAA4B;AAC5B,6BAA6B;AAC7B,2BAA2B;AAC3B,UAAU;AAEV,qCAAqC;AACrC,iCAAiC;AACjC,gCAAgC;AAChC,yBAAyB;AACzB,+BAA+B;AAC/B,UAAU;AAEV,4CAA4C;AAC5C,2BAA2B;AAC3B,6BAA6B;AAC7B,UAAU;AAEV,0CAA0C;AAC1C,yBAAyB;AACzB,UAAU;AAEV,sCAAsC;AACtC,uBAAuB;AACvB,wBAAwB;AACxB,2BAA2B;AAC3B,wBAAwB;AACxB,UAAU;AAEV,yCAAyC;AACzC,kCAAkC;AAClC,yBAAyB;AACzB,mBAAmB;AACnB,UAAU;AAEV,kCAAkC;AAClC,mBAAmB;AACnB,UAAU;AAGV,QAAQ;AACR,MAAM;AACN,IAAI;AAEJ,MAAM;AAEN,0BAA0B;AAC1B,iDAAiD;AACjD,6KAA6K;AAC7K,uIAAuI;AACvI,mHAAmH;AACnH,iEAAiE;AACjE,60EAA60E;AAC70E,UAAU;AACV,wEAAwE;AACxE,8rEAA8rE;AAC9rE,UAAU;AACV,+BAA+B;AAC/B,2BAA2B;AAE3B,0HAA0H;AAC1H,+GAA+G;AAC/G,8EAA8E;AAC9E,6BAA6B;AAC7B,yBAAyB;AAEzB,MAAM","sourcesContent":["// import { LitElement, html, css, CSSResultGroup } from \"lit\";\n// import { query, property, customElement } from \"lit/decorators.js\";\n\n// @customElement('facet-group')\n// export class FacetGroup extends LitElement {\n\n// override render() {\n// return html`\n// <slot></slot>\n// <slot></slot>\n// `\n// }\n\n// static get styles(): CSSResultGroup {\n// return css`\n// :host {\n// margin-bottom: 1rem;\n// display: flex;\n// align-items: start;\n// font-weight: 500;\n// font-size: 1.2rem;\n// cursor: pointer;\n// }\n\n// ::slotted(.facet-checkbox) {\n// border: 1px solid red;\n// margin-right: 0.5rem;\n// display: flex;\n// align-items: center;\n// }\n\n// ::slotted(.select-facet-checkbox) {\n// cursor: pointer;\n// margin-right: 5px;\n// }\n\n// ::slotted(.hide-facet-checkbox) {\n// display: none;\n// }\n\n// ::slotted(.hide-facet-icon) {\n// width: 15px;\n// height: 15px;\n// cursor: pointer;\n// opacity: 0.3;\n// }\n\n// ::slotted(.facet-info-display) {\n// border: 1px solid blue;\n// display: flex;\n// flex: 1;\n// }\n\n// ::slotted(.facet-title) {\n// flex: 1;\n// }\n\n\n// `\n// }\n// )\n\n// /**\n\n// <div class=\"facet-row\">\n// <div class=\"facet-checkbox\">\n// <input type=\"checkbox\" class=\"select-facet-checkbox\" name=\"mediatype\" value=\"texts\" title=\"Only show mediatype: texts\" id=\"mediatype:texts-show-only\">\n// <input type=\"checkbox\" class=\"hide-facet-checkbox\" id=\"mediatype:texts-negative\" name=\"mediatype\" value=\"texts\">\n// <label for=\"mediatype:texts-negative\" class=\"hide-facet-icon\" title=\"Hide mediatype: texts\">\n// <span class=\"eye\"><!--?lit$141655362$-->\n// <svg viewBox=\"0 0 100 100\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"m98 50.5704143c-.2830293-.471515-.671154-1.1088947-1.1643742-1.9121392s-1.6003642-2.3617474-3.3214321-4.6755089c-1.7210678-2.3137614-3.522258-4.5325939-5.4035703-6.6564975-1.8813124-2.1239037-4.2828993-4.473133-7.2047606-7.0476881-2.9218612-2.5745551-5.8895067-4.7933876-8.9029363-6.6564976-3.0134295-1.86311-6.4628491-3.4330878-10.3482587-4.7099336-3.8854095-1.2768458-7.7822651-1.9142256-11.6905667-1.9121443-3.9083017.0020914-7.8051573.6154781-11.6905668 1.8401652-3.8854096 1.2246871-7.3702078 2.8301329-10.4543947 4.8163375-3.0841869 1.9862045-6.0278997 4.1695691-8.8311384 6.5500937s-5.2048256 4.7652219-7.2047605 7.1540919c-1.99993501 2.38887-3.75430043 4.5722346-5.26309632 6.5500938s-2.63883199 3.583305-3.39010829 4.8163374l-1.13003609 1.8401602c.2830293.4715149.67115403 1.1088946 1.16437421 1.9121391.49322017.8032445 1.5878776 2.3617475 3.28397229 4.6755089s3.47439274 4.521119 5.3348942 6.6220728c1.8605014 2.1009538 4.2506422 4.4387083 7.1704224 7.0132633 2.9197801 2.5745551 5.8874256 4.7819127 8.9029363 6.6220729 3.0155106 1.8401601 6.4774168 3.398663 10.3857184 4.6755088 3.9083017 1.2768458 7.8176438 1.9142256 11.7280266 1.9121443 3.9103827-.0020914 7.7957922-.6154781 11.6562286-1.8401652s7.3337886-2.818658 10.4200566-4.7819127 6.0299808-4.1351444 8.8311384-6.515669 5.2152311-4.7652219 7.2422203-7.1540919 3.8052873-4.5607597 5.3348942-6.515669c1.5296068-1.9549093 2.6721295-3.5488802 3.427568-4.7819127zm-24.5142913 0c0 6.467683-2.3079374 12.0152859-6.9238123 16.6428087s-10.1495139 6.9412843-16.600917 6.9412843c-6.4992683 0-12.0453939-2.3137615-16.6383767-6.9412843s-6.8894742-10.1751257-6.8894742-16.6428087 2.2964914-12.003811 6.8894742-16.608384 10.1391084-6.9068595 16.6383767-6.9068595c6.4534842 0 11.9871232 2.3022865 16.600917 6.9068595s6.9217312 10.140701 6.9238123 16.608384zm-23.5247293-10.552755c2.8261308 0 5.2870289 1.0619518 7.3826944 3.1858555 2.0956655 2.1239036 3.1434982 4.5795368 3.1434982 7.3668995 0 2.8332624-1.0478327 5.2888956-3.1434982 7.3668995-2.0956655 2.078004-4.5565636 3.1170059-7.3826944 3.1170059-2.873996 0-5.3348941-1.0264838-7.3826944-3.0794516-2.0478002-2.0529677-3.0717003-4.5200758-3.0717003-7.4013243 0-2.8332624 1.0239001-5.3003705 3.0717003-7.4013243 2.0478003-2.1009538 4.5086984-3.1514307 7.3826944-3.1514307z\" fill=\"#000\"></path></svg>\n// </span>\n// <span class=\"eye-closed\"><!--?lit$141655362$-->\n// <svg viewBox=\"0 0 100 100\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"m97.5245976 14.5407294-15.0809624 14.6188347c3.3026825 2.8601369 6.4111526 6.0234269 9.3254105 9.48987 2.9142578 3.4664431 5.0023086 6.2183876 6.2641522 8.2558335l1.9668021 3.1268688c-.291855.4841879-.6920826 1.1386987-1.2006828 1.9635322s-1.6502683 2.4252247-3.4250041 4.8011737c-1.7747358 2.3759489-3.6202894 4.6426342-5.5366607 6.8000558-1.9163713 2.1574217-4.3810437 4.5580085-7.3940172 7.2017606-3.0129735 2.643752-6.0731589 4.9104373-9.180556 6.8000558-3.1073972 1.8896186-6.6643798 3.4900098-10.6709478 4.8011737-4.0065681 1.3111639-8.0249391 1.9656747-12.055113 1.9635322-6.7019347 0-13.2343359-1.6732336-19.5972037-5.019701l-17.1185824 16.6562806-10.27179318-10.6917703 14.93288898-14.5449211c-3.2533247-2.8601369-6.3371159-6.0116436-9.25137378-9.45452-2.91425785-3.4428764-5.02698749-6.1819664-6.33818892-8.2172698l-1.8927654-3.0529552c.29185498-.4841879.69208259-1.1386987 1.20068282-1.9635322.50860022-.8248335 1.65026824-2.437008 3.42500406-4.8365236 1.77473582-2.3995157 3.62028938-4.6908389 5.53666072-6.8739696 1.9163713-2.1831307 4.3810437-4.5955009 7.3940172-7.2371105s6.0731589-4.9200783 9.180556-6.8354059c3.1073972-1.9153277 6.6772558-3.5275022 10.7095757-4.8365237 4.03232-1.3090215 8.0635669-1.9635322 12.0937409-1.9635322 6.5560071 0 13.0637294 1.6968003 19.5231669 5.090401l17.1185824-16.5823669zm-46.478979 24.584323 10.7803934-10.473243c-3.5451796-1.891761-7.3092505-2.8376415-11.2922126-2.8376415-6.6547228 0-12.3609169 2.3641657-17.1185824 7.0924969-4.7576654 4.7283312-7.1375711 10.437893-7.1397171 17.1286852 0 3.8306553.8251341 7.3945787 2.4754024 10.6917703l10.9284669-10.5471566v-.1446137c0-2.9094127 1.0687043-5.4546132 3.2061128-7.6356015 2.1374086-2.1809883 4.6868477-3.2714825 7.6483174-3.2714825h.5086002zm-1.1652739 21.5988543-10.7803935 10.6178566c3.5945375 1.9388943 7.4068932 2.9083415 11.4370672 2.9083415 6.6547228 0 12.3491139-2.375949 17.0831734-7.1278469s7.1021623-10.4486051 7.1043083-17.0901215c0-4.0234736-.874492-7.6356015-2.6234759-10.836384l-10.7095757 10.473243v.363141c0 2.9586884-1.0687042 5.4803223-3.2061128 7.5649015-2.1374085 2.0845792-4.6868476 3.1268688-7.6483173 3.1268688z\" fill=\"#000\"></path></svg>\n// </span>\n// </label>\n// </div>\n\n// <label class=\"facet-info-display\" for=\"mediatype:texts-show-only\" title=\"Only show mediatype: texts\">\n// <div class=\"facet-title\"><!--?lit$141655362$--><!--?lit$141655362$-->texts<!--?--></div>\n// <div class=\"facet-count\"><!--?lit$141655362$-->51</div>\n// </label>\n// </div>\n\n// */"]}
@@ -163,9 +163,6 @@ let FacetsTemplate = class FacetsTemplate extends LitElement {
163
163
  column-width: 25rem;
164
164
  column-gap: 15px;
165
165
  }
166
- .facets-on-page .select-facet-checkbox {
167
- margin-left: 0;
168
- }
169
166
  async-collection-name {
170
167
  display: contents;
171
168
  }
@@ -180,20 +177,31 @@ let FacetsTemplate = class FacetsTemplate extends LitElement {
180
177
  }
181
178
  .facet-checkbox {
182
179
  margin: 0 5px 0 0;
183
- display: inline-block;
184
- align-items: baseline;
180
+ display: flex;
181
+ height: 15px;
182
+ }
183
+ .facet-checkbox input:first-child {
184
+ margin-right: 5px;
185
+ }
186
+ .facet-checkbox input {
187
+ height: 15px;
188
+ width: 15px;
189
+ margin: 0;
185
190
  }
186
191
  .facet-row {
187
192
  display: flex;
188
193
  font-weight: 500;
189
194
  font-size: 1.2rem;
195
+ margin: 2.5px auto;
196
+ height: auto;
197
+ border-top: var(--facet-row-border-top, 1px solid transparent);
198
+ border-bottom: var(--facet-row-border-bottom, 1px solid transparent);
190
199
  }
191
200
  .facet-info-display {
192
201
  display: flex;
193
202
  flex: 1 1 0%;
194
203
  cursor: pointer;
195
204
  flex-wrap: wrap;
196
- align-content: center;
197
205
  }
198
206
  .facet-title {
199
207
  word-break: break-word;
@@ -1 +1 @@
1
- {"version":3,"file":"facets-template.js","sourceRoot":"","sources":["../../../src/collection-facets/facets-template.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,UAAU,EAAkC,MAAM,KAAK,CAAC;AAC5E,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC5D,OAAO,EAAE,MAAM,EAAE,MAAM,0BAA0B,CAAC;AAElD,OAAO,OAAO,MAAM,yBAAyB,CAAC;AAC9C,OAAO,aAAa,MAAM,gCAAgC,CAAC;AAC3D,OAAO,EAKL,qBAAqB,GACtB,MAAM,WAAW,CAAC;AAGnB,IAAa,cAAc,GAA3B,MAAa,cAAe,SAAQ,UAAU;IAUpC,YAAY,CAAC,CAAQ,EAAE,KAAa,EAAE,QAAiB;QAC7D,MAAM,MAAM,GAAG,CAAC,CAAC,MAA0B,CAAC;QAC5C,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,GAAG,MAAM,CAAC;QACxC,IAAI,OAAO,EAAE;YACX,IAAI,CAAC,YAAY,CAAC,IAAmB,EAAE,KAAK,EAAE,KAAK,EAAE,QAAQ,CAAC,CAAC;SAChE;aAAM;YACL,IAAI,CAAC,cAAc,CAAC,IAAmB,EAAE,KAAK,CAAC,CAAC;SACjD;IACH,CAAC;IAEO,YAAY,CAClB,GAAgB,EAChB,KAAa,EACb,KAAa,EACb,QAAiB;QAEjB,MAAM,EAAE,cAAc,EAAE,GAAG,IAAI,CAAC;QAChC,IAAI,SAAyB,CAAC;QAC9B,IAAI,cAAc,EAAE;YAClB,SAAS,GAAG;gBACV,GAAG,cAAc;aAClB,CAAC;SACH;aAAM;YACL,SAAS,GAAG,qBAAqB,CAAC;SACnC;QACD,SAAS,CAAC,GAAG,CAAC,CAAC,KAAK,CAAC,GAAG;YACtB,KAAK,EAAE,QAAQ,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,UAAU;YACvC,KAAK;SACS,CAAC;QAEjB,IAAI,CAAC,cAAc,GAAG,SAAS,CAAC;QAChC,IAAI,CAAC,6BAA6B,EAAE,CAAC;IACvC,CAAC;IAEO,cAAc,CAAC,GAAgB,EAAE,KAAa;QACpD,MAAM,EAAE,cAAc,EAAE,GAAG,IAAI,CAAC;QAChC,IAAI,SAAyB,CAAC;QAC9B,IAAI,cAAc,EAAE;YAClB,SAAS,GAAG;gBACV,GAAG,cAAc;aAClB,CAAC;SACH;aAAM;YACL,SAAS,GAAG,qBAAqB,CAAC;SACnC;QACD,OAAO,SAAS,CAAC,GAAG,CAAC,CAAC,KAAK,CAAC,CAAC;QAE7B,IAAI,CAAC,cAAc,GAAG,SAAS,CAAC;QAChC,IAAI,CAAC,6BAA6B,EAAE,CAAC;IACvC,CAAC;IAEO,6BAA6B;QACnC,MAAM,KAAK,GAAG,IAAI,WAAW,CAAiB,uBAAuB,EAAE;YACrE,MAAM,EAAE,IAAI,CAAC,cAAc;YAC3B,OAAO,EAAE,IAAI;YACb,QAAQ,EAAE,IAAI;SACf,CAAC,CAAC;QACH,IAAI,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;IAC5B,CAAC;IAEO,iBAAiB,CAAC,UAAsB;QAC9C,IAAI,YAAY,GAAG,UAAU,aAAV,UAAU,uBAAV,UAAU,CAAE,OAAwB,CAAC;QAExD;;;;;WAKG;QACH,YAAY,GAAG;YACb,GAAG,YAAY;iBACZ,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,KAAK,KAAK,UAAU,CAAC;iBACnC,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,CAAC,KAAK,GAAG,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;YAC/C,GAAG,YAAY;iBACZ,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,KAAK,KAAK,QAAQ,CAAC;iBACjC,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,CAAC,KAAK,GAAG,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;YAC/C,GAAG,YAAY,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,KAAK,KAAK,MAAM,CAAC;SAChD,CAAC;QAEF,OAAO,IAAI,CAAA;8BACe,IAAI,CAAC,QAAQ;UACjC,MAAM,CACN,YAAY,EACZ,MAAM,CAAC,EAAE,CAAC,GAAG,UAAU,CAAC,GAAG,IAAI,MAAM,CAAC,GAAG,EAAE,EAC3C,MAAM,CAAC,EAAE;;YACP,MAAM,kBAAkB,GAAG,GAAG,UAAU,CAAC,GAAG,IAAI,MAAM,CAAC,GAAG,YAAY,CAAC;YACvE,MAAM,kBAAkB,GAAG,GAAG,UAAU,CAAC,GAAG,IAAI,MAAM,CAAC,GAAG,WAAW,CAAC;YACtE,sEAAsE;YACtE,yEAAyE;YACzE,wBAAwB;YACxB,MAAM,iBAAiB,GACrB,UAAU,CAAC,GAAG,KAAK,YAAY;gBAC7B,CAAC,CAAC,IAAI,CAAA,GAAG,MAAA,MAAM,CAAC,WAAW,mCAAI,MAAM,CAAC,GAAG,EAAE;gBAC3C,CAAC,CAAC,IAAI,CAAA,qBAAqB,MAAM,CAAC,GAAG;;6CAER,IAAI,CAAC,mBAAmB;oCACjC,MAAM,CAAC,GAAG;;;wBAGtB,CAAC;YACb,MAAM,WAAW,GAAG,MAAM,CAAC,KAAK,KAAK,QAAQ,CAAC;YAC9C,MAAM,aAAa,GAAG,MAAM,CAAC,KAAK,KAAK,UAAU,CAAC;YAClD,MAAM,SAAS,GAAG,GAAG,UAAU,CAAC,GAAG,KACjC,MAAA,MAAM,CAAC,WAAW,mCAAI,MAAM,CAAC,GAC/B,EAAE,CAAC;YACH,MAAM,YAAY,GAAG,aAAa;gBAChC,CAAC,CAAC,YAAY,UAAU,CAAC,GAAG,GAAG;gBAC/B,CAAC,CAAC,aAAa,SAAS,EAAE,CAAC;YAC7B,MAAM,QAAQ,GAAG,QAAQ,SAAS,EAAE,CAAC;YACrC,MAAM,UAAU,GAAG,UAAU,SAAS,EAAE,CAAC;YACzC,MAAM,YAAY,GAAG,WAAW,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,QAAQ,CAAC;YACzD,OAAO,IAAI,CAAA;;;;;4BAKK,UAAU,CAAC,GAAG;6BACb,MAAM,CAAC,GAAG;6BACV,CAAC,CAAQ,EAAE,EAAE;gBACpB,IAAI,CAAC,YAAY,CAAC,CAAC,EAAE,MAAM,CAAC,KAAK,EAAE,KAAK,CAAC,CAAC;YAC5C,CAAC;+BACU,aAAa;;4BAEhB,YAAY;yBACf,kBAAkB;;;;yBAIlB,kBAAkB;4BACf,UAAU,CAAC,GAAG;6BACb,MAAM,CAAC,GAAG;6BACV,CAAC,CAAQ,EAAE,EAAE;gBACpB,IAAI,CAAC,YAAY,CAAC,CAAC,EAAE,MAAM,CAAC,KAAK,EAAE,IAAI,CAAC,CAAC;YAC3C,CAAC;+BACU,WAAW;;;;0BAIhB,kBAAkB;4CACA,WAAW,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,EAAE;4BAC5C,YAAY;;wCAEA,OAAO;+CACA,aAAa;;;;wBAIpC,kBAAkB;;0BAEhB,YAAY;;6CAEO,iBAAiB;6CACjB,MAAM,CAAC,KAAK;;;aAG5C,CAAC;QACJ,CAAC,CACF;;KAEJ,CAAC;IACJ,CAAC;IAED,MAAM;QACJ,OAAO,IAAI,CAAA,GAAG,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,UAAwB,CAAC,EAAE,CAAC;IACxE,CAAC;IAED,MAAM,KAAK,MAAM;QACf,OAAO,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KA0FT,CAAC;IACJ,CAAC;CACF,CAAA;AA3Q6B;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;kDAAyB;AAExB;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;sDAAiC;AAEhC;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;gDAAmB;AAG9C;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;2DACwB;AARxC,cAAc;IAD1B,aAAa,CAAC,iBAAiB,CAAC;GACpB,cAAc,CA4Q1B;SA5QY,cAAc","sourcesContent":["import { css, html, LitElement, TemplateResult, CSSResultGroup } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\nimport { repeat } from 'lit/directives/repeat.js';\nimport type { CollectionNameCacheInterface } from '@internetarchive/collection-name-cache';\nimport eyeIcon from '../assets/img/icons/eye';\nimport eyeClosedIcon from '../assets/img/icons/eye-closed';\nimport {\n FacetGroup,\n FacetOption,\n FacetBucket,\n SelectedFacets,\n defaultSelectedFacets,\n} from '../models';\n\n@customElement('facets-template')\nexport class FacetsTemplate extends LitElement {\n @property({ type: Object }) facetGroup?: FacetGroup;\n\n @property({ type: Object }) selectedFacets?: SelectedFacets;\n\n @property({ type: String }) renderOn?: string;\n\n @property({ type: Object })\n collectionNameCache?: CollectionNameCacheInterface;\n\n private facetClicked(e: Event, count: number, negative: boolean) {\n const target = e.target as HTMLInputElement;\n const { checked, name, value } = target;\n if (checked) {\n this.facetChecked(name as FacetOption, value, count, negative);\n } else {\n this.facetUnchecked(name as FacetOption, value);\n }\n }\n\n private facetChecked(\n key: FacetOption,\n value: string,\n count: number,\n negative: boolean\n ) {\n const { selectedFacets } = this;\n let newFacets: SelectedFacets;\n if (selectedFacets) {\n newFacets = {\n ...selectedFacets,\n };\n } else {\n newFacets = defaultSelectedFacets;\n }\n newFacets[key][value] = {\n state: negative ? 'hidden' : 'selected',\n count,\n } as FacetBucket;\n\n this.selectedFacets = newFacets;\n this.dispatchSelectedFacetsChanged();\n }\n\n private facetUnchecked(key: FacetOption, value: string) {\n const { selectedFacets } = this;\n let newFacets: SelectedFacets;\n if (selectedFacets) {\n newFacets = {\n ...selectedFacets,\n };\n } else {\n newFacets = defaultSelectedFacets;\n }\n delete newFacets[key][value];\n\n this.selectedFacets = newFacets;\n this.dispatchSelectedFacetsChanged();\n }\n\n private dispatchSelectedFacetsChanged() {\n const event = new CustomEvent<SelectedFacets>('selectedFacetsChanged', {\n detail: this.selectedFacets,\n bubbles: true,\n composed: true,\n });\n this.dispatchEvent(event);\n }\n\n private getFacetsTemplate(facetGroup: FacetGroup): TemplateResult {\n let facetsBucket = facetGroup?.buckets as FacetBucket[];\n\n /**\n * sorting FacetBucket before render page / modal\n * - first, selected items should be at top having sorted\n * - second, suppressed/hidden items should be after selected having sorted\n * - and then no-selected / not suppressed items should render having sorted\n */\n facetsBucket = [\n ...facetsBucket\n .filter(x => x.state === 'selected')\n .sort((a, b) => (a.count < b.count ? 1 : -1)),\n ...facetsBucket\n .filter(x => x.state === 'hidden')\n .sort((a, b) => (a.count < b.count ? 1 : -1)),\n ...facetsBucket.filter(x => x.state === 'none'),\n ];\n\n return html`\n <div class=\"facets-on-${this.renderOn}\">\n ${repeat(\n facetsBucket,\n bucket => `${facetGroup.key}:${bucket.key}`,\n bucket => {\n const showOnlyCheckboxId = `${facetGroup.key}:${bucket.key}-show-only`;\n const negativeCheckboxId = `${facetGroup.key}:${bucket.key}-negative`;\n // for collections, we need to asynchronously load the collection name\n // so we use the `async-collection-name` widget and for the rest, we have\n // a static value to use\n const bucketTextDisplay =\n facetGroup.key !== 'collection'\n ? html`${bucket.displayText ?? bucket.key}`\n : html`<a href=\"/details/${bucket.key}\">\n <async-collection-name\n .collectionNameCache=${this.collectionNameCache}\n .identifier=${bucket.key}\n placeholder=\"-\"\n ></async-collection-name>\n </a> `;\n const facetHidden = bucket.state === 'hidden';\n const facetSelected = bucket.state === 'selected';\n const titleText = `${facetGroup.key}: ${\n bucket.displayText ?? bucket.key\n }`;\n const onlyShowText = facetSelected\n ? `Show all ${facetGroup.key}s`\n : `Only show ${titleText}`;\n const hideText = `Hide ${titleText}`;\n const unhideText = `Unhide ${titleText}`;\n const showHideText = facetHidden ? unhideText : hideText;\n return html`\n <div class=\"facet-row\">\n <div class=\"facet-checkbox\">\n <input\n type=\"checkbox\"\n .name=${facetGroup.key}\n .value=${bucket.key}\n @click=${(e: Event) => {\n this.facetClicked(e, bucket.count, false);\n }}\n .checked=${facetSelected}\n class=\"select-facet-checkbox\"\n title=${onlyShowText}\n id=${showOnlyCheckboxId}\n />\n <input\n type=\"checkbox\"\n id=${negativeCheckboxId}\n .name=${facetGroup.key}\n .value=${bucket.key}\n @click=${(e: Event) => {\n this.facetClicked(e, bucket.count, true);\n }}\n .checked=${facetHidden}\n class=\"hide-facet-checkbox\"\n />\n <label\n for=${negativeCheckboxId}\n class=\"hide-facet-icon${facetHidden ? ' active' : ''}\"\n title=${showHideText}\n >\n <span class=\"eye\">${eyeIcon}</span>\n <span class=\"eye-closed\">${eyeClosedIcon}</span>\n </label>\n </div>\n <div\n for=${showOnlyCheckboxId}\n class=\"facet-info-display\"\n title=${onlyShowText}\n >\n <div class=\"facet-title\">${bucketTextDisplay}</div>\n <div class=\"facet-count\">${bucket.count}</div>\n </div>\n </div>\n `;\n }\n )}\n </div>\n `;\n }\n\n render() {\n return html`${this.getFacetsTemplate(this.facetGroup as FacetGroup)}`;\n }\n\n static get styles(): CSSResultGroup {\n return css`\n .facets-on-modal {\n /* For Chrome, Safari, Opera browsers */\n -webkit-column-width: 100px;\n /* For Firefox browser */\n -moz-column-width: 100px;\n column-width: 25rem;\n column-gap: 15px;\n }\n .facets-on-page .select-facet-checkbox {\n margin-left: 0;\n }\n async-collection-name {\n display: contents;\n }\n ul.facet-list {\n list-style: none;\n margin: 0;\n padding: 0;\n }\n ul.facet-list li {\n margin-bottom: 0.2rem;\n display: grid;\n }\n .facet-checkbox {\n margin: 0 5px 0 0;\n display: inline-block;\n align-items: baseline;\n }\n .facet-row {\n display: flex;\n font-weight: 500;\n font-size: 1.2rem;\n }\n .facet-info-display {\n display: flex;\n flex: 1 1 0%;\n cursor: pointer;\n flex-wrap: wrap;\n align-content: center;\n }\n .facet-title {\n word-break: break-word;\n display: inline-block;\n flex: 1 1 0%;\n }\n .facet-count {\n text-align: right;\n }\n .select-facet-checkbox {\n cursor: pointer;\n display: inline-block;\n }\n .hide-facet-checkbox {\n display: none;\n }\n .hide-facet-icon {\n width: 15px;\n height: 15px;\n cursor: pointer;\n opacity: 0.3;\n display: inline-block;\n }\n .hide-facet-icon:hover,\n .active {\n opacity: 1;\n }\n .hide-facet-icon:hover .eye,\n .hide-facet-icon .eye-closed {\n display: none;\n }\n .hide-facet-icon:hover .eye-closed,\n .hide-facet-icon.active .eye-closed {\n display: inline;\n }\n .hide-facet-icon.active .eye {\n display: none;\n }\n .sorting-icon {\n cursor: pointer;\n }\n\n a:link,\n a:visited {\n text-decoration: none;\n color: var(--ia-theme-link-color, #4b64ff);\n }\n a:hover {\n text-decoration: underline;\n }\n `;\n }\n}\n"]}
1
+ {"version":3,"file":"facets-template.js","sourceRoot":"","sources":["../../../src/collection-facets/facets-template.ts"],"names":[],"mappings":"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","sourcesContent":["import { css, html, LitElement, TemplateResult, CSSResultGroup } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\nimport { repeat } from 'lit/directives/repeat.js';\nimport type { CollectionNameCacheInterface } from '@internetarchive/collection-name-cache';\nimport eyeIcon from '../assets/img/icons/eye';\nimport eyeClosedIcon from '../assets/img/icons/eye-closed';\nimport {\n FacetGroup,\n FacetOption,\n FacetBucket,\n SelectedFacets,\n defaultSelectedFacets,\n} from '../models';\n\n@customElement('facets-template')\nexport class FacetsTemplate extends LitElement {\n @property({ type: Object }) facetGroup?: FacetGroup;\n\n @property({ type: Object }) selectedFacets?: SelectedFacets;\n\n @property({ type: String }) renderOn?: string;\n\n @property({ type: Object })\n collectionNameCache?: CollectionNameCacheInterface;\n\n private facetClicked(e: Event, count: number, negative: boolean) {\n const target = e.target as HTMLInputElement;\n const { checked, name, value } = target;\n if (checked) {\n this.facetChecked(name as FacetOption, value, count, negative);\n } else {\n this.facetUnchecked(name as FacetOption, value);\n }\n }\n\n private facetChecked(\n key: FacetOption,\n value: string,\n count: number,\n negative: boolean\n ) {\n const { selectedFacets } = this;\n let newFacets: SelectedFacets;\n if (selectedFacets) {\n newFacets = {\n ...selectedFacets,\n };\n } else {\n newFacets = defaultSelectedFacets;\n }\n newFacets[key][value] = {\n state: negative ? 'hidden' : 'selected',\n count,\n } as FacetBucket;\n\n this.selectedFacets = newFacets;\n this.dispatchSelectedFacetsChanged();\n }\n\n private facetUnchecked(key: FacetOption, value: string) {\n const { selectedFacets } = this;\n let newFacets: SelectedFacets;\n if (selectedFacets) {\n newFacets = {\n ...selectedFacets,\n };\n } else {\n newFacets = defaultSelectedFacets;\n }\n delete newFacets[key][value];\n\n this.selectedFacets = newFacets;\n this.dispatchSelectedFacetsChanged();\n }\n\n private dispatchSelectedFacetsChanged() {\n const event = new CustomEvent<SelectedFacets>('selectedFacetsChanged', {\n detail: this.selectedFacets,\n bubbles: true,\n composed: true,\n });\n this.dispatchEvent(event);\n }\n\n private getFacetsTemplate(facetGroup: FacetGroup): TemplateResult {\n let facetsBucket = facetGroup?.buckets as FacetBucket[];\n\n /**\n * sorting FacetBucket before render page / modal\n * - first, selected items should be at top having sorted\n * - second, suppressed/hidden items should be after selected having sorted\n * - and then no-selected / not suppressed items should render having sorted\n */\n facetsBucket = [\n ...facetsBucket\n .filter(x => x.state === 'selected')\n .sort((a, b) => (a.count < b.count ? 1 : -1)),\n ...facetsBucket\n .filter(x => x.state === 'hidden')\n .sort((a, b) => (a.count < b.count ? 1 : -1)),\n ...facetsBucket.filter(x => x.state === 'none'),\n ];\n\n return html`\n <div class=\"facets-on-${this.renderOn}\">\n ${repeat(\n facetsBucket,\n bucket => `${facetGroup.key}:${bucket.key}`,\n bucket => {\n const showOnlyCheckboxId = `${facetGroup.key}:${bucket.key}-show-only`;\n const negativeCheckboxId = `${facetGroup.key}:${bucket.key}-negative`;\n // for collections, we need to asynchronously load the collection name\n // so we use the `async-collection-name` widget and for the rest, we have\n // a static value to use\n const bucketTextDisplay =\n facetGroup.key !== 'collection'\n ? html`${bucket.displayText ?? bucket.key}`\n : html`<a href=\"/details/${bucket.key}\">\n <async-collection-name\n .collectionNameCache=${this.collectionNameCache}\n .identifier=${bucket.key}\n placeholder=\"-\"\n ></async-collection-name>\n </a> `;\n const facetHidden = bucket.state === 'hidden';\n const facetSelected = bucket.state === 'selected';\n const titleText = `${facetGroup.key}: ${\n bucket.displayText ?? bucket.key\n }`;\n const onlyShowText = facetSelected\n ? `Show all ${facetGroup.key}s`\n : `Only show ${titleText}`;\n const hideText = `Hide ${titleText}`;\n const unhideText = `Unhide ${titleText}`;\n const showHideText = facetHidden ? unhideText : hideText;\n return html`\n <div class=\"facet-row\">\n <div class=\"facet-checkbox\">\n <input\n type=\"checkbox\"\n .name=${facetGroup.key}\n .value=${bucket.key}\n @click=${(e: Event) => {\n this.facetClicked(e, bucket.count, false);\n }}\n .checked=${facetSelected}\n class=\"select-facet-checkbox\"\n title=${onlyShowText}\n id=${showOnlyCheckboxId}\n />\n <input\n type=\"checkbox\"\n id=${negativeCheckboxId}\n .name=${facetGroup.key}\n .value=${bucket.key}\n @click=${(e: Event) => {\n this.facetClicked(e, bucket.count, true);\n }}\n .checked=${facetHidden}\n class=\"hide-facet-checkbox\"\n />\n <label\n for=${negativeCheckboxId}\n class=\"hide-facet-icon${facetHidden ? ' active' : ''}\"\n title=${showHideText}\n >\n <span class=\"eye\">${eyeIcon}</span>\n <span class=\"eye-closed\">${eyeClosedIcon}</span>\n </label>\n </div>\n <div\n for=${showOnlyCheckboxId}\n class=\"facet-info-display\"\n title=${onlyShowText}\n >\n <div class=\"facet-title\">${bucketTextDisplay}</div>\n <div class=\"facet-count\">${bucket.count}</div>\n </div>\n </div>\n `;\n }\n )}\n </div>\n `;\n }\n\n render() {\n return html`${this.getFacetsTemplate(this.facetGroup as FacetGroup)}`;\n }\n\n static get styles(): CSSResultGroup {\n return css`\n .facets-on-modal {\n /* For Chrome, Safari, Opera browsers */\n -webkit-column-width: 100px;\n /* For Firefox browser */\n -moz-column-width: 100px;\n column-width: 25rem;\n column-gap: 15px;\n }\n async-collection-name {\n display: contents;\n }\n ul.facet-list {\n list-style: none;\n margin: 0;\n padding: 0;\n }\n ul.facet-list li {\n margin-bottom: 0.2rem;\n display: grid;\n }\n .facet-checkbox {\n margin: 0 5px 0 0;\n display: flex;\n height: 15px;\n }\n .facet-checkbox input:first-child {\n margin-right: 5px;\n }\n .facet-checkbox input {\n height: 15px;\n width: 15px;\n margin: 0;\n }\n .facet-row {\n display: flex;\n font-weight: 500;\n font-size: 1.2rem;\n margin: 2.5px auto;\n height: auto;\n border-top: var(--facet-row-border-top, 1px solid transparent);\n border-bottom: var(--facet-row-border-bottom, 1px solid transparent);\n }\n .facet-info-display {\n display: flex;\n flex: 1 1 0%;\n cursor: pointer;\n flex-wrap: wrap;\n }\n .facet-title {\n word-break: break-word;\n display: inline-block;\n flex: 1 1 0%;\n }\n .facet-count {\n text-align: right;\n }\n .select-facet-checkbox {\n cursor: pointer;\n display: inline-block;\n }\n .hide-facet-checkbox {\n display: none;\n }\n .hide-facet-icon {\n width: 15px;\n height: 15px;\n cursor: pointer;\n opacity: 0.3;\n display: inline-block;\n }\n .hide-facet-icon:hover,\n .active {\n opacity: 1;\n }\n .hide-facet-icon:hover .eye,\n .hide-facet-icon .eye-closed {\n display: none;\n }\n .hide-facet-icon:hover .eye-closed,\n .hide-facet-icon.active .eye-closed {\n display: inline;\n }\n .hide-facet-icon.active .eye {\n display: none;\n }\n .sorting-icon {\n cursor: pointer;\n }\n\n a:link,\n a:visited {\n text-decoration: none;\n color: var(--ia-theme-link-color, #4b64ff);\n }\n a:hover {\n text-decoration: underline;\n }\n `;\n }\n}\n"]}
@@ -353,7 +353,7 @@ let MoreFacetsContent = class MoreFacetsContent extends LitElement {
353
353
  }
354
354
  .scrollable-content {
355
355
  overflow-y: auto;
356
- max-height: 65vh;
356
+ max-height: 60vh;
357
357
  }
358
358
  .facets-content {
359
359
  font-size: 1.2rem;
@@ -1 +1 @@
1
- {"version":3,"file":"more-facets-content.js","sourceRoot":"","sources":["../../../src/collection-facets/more-facets-content.ts"],"names":[],"mappings":"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","sourcesContent":["/* eslint-disable dot-notation */\n/* eslint-disable lit-a11y/click-events-have-key-events */\nimport {\n css,\n CSSResultGroup,\n html,\n LitElement,\n nothing,\n PropertyValues,\n TemplateResult,\n} from 'lit';\nimport { customElement, property, state } from 'lit/decorators.js';\nimport type {\n Aggregation,\n Bucket,\n SearchServiceInterface,\n SearchParams,\n} from '@internetarchive/search-service';\nimport type { CollectionNameCacheInterface } from '@internetarchive/collection-name-cache';\nimport type { ModalManagerInterface } from '@internetarchive/modal-manager';\nimport {\n SelectedFacets,\n FacetGroup,\n FacetBucket,\n FacetOption,\n facetTitles,\n} from '../models';\nimport type { LanguageCodeHandlerInterface } from '../language-code-handler/language-code-handler';\nimport { getFacetOptionFromKey } from './facets-util';\nimport '@internetarchive/ia-activity-indicator/ia-activity-indicator';\nimport './more-facets-pagination';\nimport './facets-template';\n\n@customElement('more-facets-content')\nexport class MoreFacetsContent extends LitElement {\n @property({ type: String }) facetKey?: string;\n\n @property({ type: String }) facetAggregationKey?: string;\n\n @property({ type: String }) fullQuery?: string;\n\n @property({ type: Object }) modalManager?: ModalManagerInterface;\n\n @property({ type: Object }) searchService?: SearchServiceInterface;\n\n @property({ type: Object })\n collectionNameCache?: CollectionNameCacheInterface;\n\n @property({ type: Object })\n languageCodeHandler?: LanguageCodeHandlerInterface;\n\n @property({ type: Object }) selectedFacets?: SelectedFacets;\n\n @property({ type: String }) sortedBy = 'count'; // count | alpha\n\n @state() aggregations?: Record<string, Aggregation>;\n\n @state() facetGroup?: FacetGroup[] = [];\n\n @state() facetGroupTitle?: String = '';\n\n @state() pageNumber = 1;\n\n /**\n * Facets are loading on popup\n */\n @state() facetsLoading = true;\n\n @state() paginationSize = 0;\n\n @state() facetsType = 'modal';\n\n private facetsPerPage = 60; // TODO: Q. how many items we want to have on popup view\n\n updated(changed: PropertyValues) {\n if (changed.has('facetKey')) {\n this.facetsLoading = true;\n this.pageNumber = 1;\n\n this.updateSpecificFacets();\n }\n\n if (changed.has('pageNumber')) {\n this.facetGroup = this.aggregationFacetGroups;\n }\n }\n\n firstUpdated() {\n this.setupEscapeListeners();\n }\n\n /**\n * Close more facets modal on Escape click\n */\n private setupEscapeListeners() {\n if (this.modalManager) {\n document.addEventListener('keydown', (e: KeyboardEvent) => {\n if (e.key === 'Escape') {\n this.modalManager?.closeModal();\n }\n });\n } else {\n document.removeEventListener('keydown', () => {});\n }\n }\n\n /**\n * Get specific facets data from search-service API based of currently query params\n * - this.aggregations - hold result of search service and being used for further processing.\n */\n async updateSpecificFacets(): Promise<void> {\n const aggregations = {\n advancedParams: [\n {\n field: this.facetAggregationKey as string,\n size: 65535, // todo - do we want to have all the records at once?\n },\n ],\n };\n\n const params: SearchParams = {\n query: this.fullQuery as string,\n fields: ['identifier'],\n aggregations,\n rows: 1, // todo - do we want server-side pagination with offset/page/limit flag?\n };\n\n const results = await this.searchService?.search(params);\n this.aggregations = results?.success?.response.aggregations as any;\n\n this.facetGroup = this.aggregationFacetGroups;\n this.facetsLoading = false;\n }\n\n private pageNumberClicked(e: CustomEvent<{ page: number }>) {\n const page = e?.detail?.page;\n if (page) {\n this.pageNumber = Number(page);\n }\n }\n\n /**\n * Combines the selected facets with the aggregations to create a single list of facets\n */\n private get mergedFacets(): FacetGroup[] | void {\n const facetGroups: FacetGroup[] = [];\n\n const selectedFacetGroup = this.selectedFacetGroups.find(\n group => group.key === this.facetKey\n );\n const aggregateFacetGroup = this.aggregationFacetGroups.find(\n group => group.key === this.facetKey\n );\n\n // if the user selected a facet, but it's not in the aggregation, we add it as-is\n if (selectedFacetGroup && !aggregateFacetGroup) {\n facetGroups.push(selectedFacetGroup);\n return facetGroups;\n }\n\n // if we don't have an aggregate facet group, don't add this to the list\n if (!aggregateFacetGroup) return facetGroups;\n\n // start with either the selected group if we have one, or the aggregate group\n const facetGroup = selectedFacetGroup ?? aggregateFacetGroup;\n\n // attach the counts to the selected buckets\n const bucketsWithCount =\n selectedFacetGroup?.buckets.map(bucket => {\n const selectedBucket = aggregateFacetGroup.buckets.find(\n b => b.key === bucket.key\n );\n return selectedBucket\n ? {\n ...bucket,\n count: selectedBucket.count,\n }\n : bucket;\n }) ?? [];\n\n // append any additional buckets that were not selected\n aggregateFacetGroup.buckets.forEach(bucket => {\n const existingBucket = bucketsWithCount.find(b => b.key === bucket.key);\n if (existingBucket) return;\n bucketsWithCount.push(bucket);\n });\n facetGroup.buckets = bucketsWithCount;\n\n facetGroups.push(facetGroup);\n return facetGroups;\n }\n\n /**\n * Converts the selected facets to a `FacetGroup` array,\n * which is easier to work with\n */\n private get selectedFacetGroups(): FacetGroup[] {\n if (!this.selectedFacets) return [];\n\n const facetGroups: FacetGroup[] = Object.entries(this.selectedFacets).map(\n ([key, selectedFacets]) => {\n const option = key as FacetOption;\n const title = facetTitles[option];\n\n const buckets: FacetBucket[] = Object.entries(selectedFacets).map(\n ([value, data]) => {\n let displayText = value;\n // for selected languages, we store the language code instead of the\n // display name, so look up the name from the mapping\n if (option === 'language') {\n displayText =\n this.languageCodeHandler?.getLanguageNameFromCodeString(\n value\n ) ?? value;\n }\n return {\n displayText,\n key: value,\n count: data?.count,\n state: data?.state,\n };\n }\n );\n\n return {\n title,\n key: option,\n buckets,\n };\n }\n );\n\n return facetGroups;\n }\n\n /**\n * Converts the raw `aggregations` to `FacetGroups`, which are easier to use\n */\n private get aggregationFacetGroups(): FacetGroup[] {\n const facetGroups: FacetGroup[] = [];\n Object.entries(this.aggregations ?? []).forEach(([key, buckets]) => {\n // the year_histogram data is in a different format so can't be handled here\n if (key === 'year_histogram') return;\n\n const option = getFacetOptionFromKey(key);\n this.facetGroupTitle = facetTitles[option];\n let castedBuckets = buckets.buckets as Bucket[];\n\n // we are not showing fav- items in facets\n castedBuckets = castedBuckets?.filter(\n bucket => bucket?.key?.toString()?.startsWith('fav-') === false\n );\n\n // sort facets in specific order\n castedBuckets = this.sortedFacets(castedBuckets) as Bucket[];\n\n // find length and pagination size for modal pagination\n const { length } = Object.keys(castedBuckets as []);\n this.paginationSize = Math.ceil(length / this.facetsPerPage);\n\n // asynchronously load the collection name\n if (option === 'collection') {\n this.preloadCollectionNames(castedBuckets);\n }\n\n // render only items which will be visible as per this.facetsPerPage\n const bucketsMaxSix = castedBuckets?.slice(\n (this.pageNumber - 1) * this.facetsPerPage,\n this.pageNumber * this.facetsPerPage\n );\n\n const facetBucket: FacetBucket[] = bucketsMaxSix.map(bucket => {\n let bucketKey = bucket.key;\n // for languages, we need to search by language code instead of the\n // display name, which is what we get from the search engine result\n if (option === 'language') {\n bucketKey =\n this.languageCodeHandler?.getCodeStringFromLanguageName(\n `${bucket.key}`\n ) ?? bucket.key;\n }\n return {\n displayText: `${bucket.key}`,\n key: `${bucketKey}`,\n count: bucket.doc_count,\n state: 'none',\n };\n });\n const group: FacetGroup = {\n title: this.facetGroupTitle as string,\n key: option,\n buckets: facetBucket,\n };\n facetGroups.push(group);\n });\n\n return facetGroups;\n }\n\n /**\n * for collections, we need to asynchronously load the collection name\n * so we use the `async-collection-name` widget and for the rest, we have a static value to use\n *\n * @param castedBuckets\n */\n private preloadCollectionNames(castedBuckets: any[]) {\n const collectionIds = castedBuckets?.map(option => option.key);\n const collectionIdsArray = Array.from(new Set(collectionIds)) as string[];\n\n this.collectionNameCache?.preloadIdentifiers(collectionIdsArray);\n }\n\n /**\n * sort the facets on modal\n * - alpha sort perform in ascending order\n * - count/frequency sort perform in descending order\n *\n * @param facetBucket as Bucket[]\n *\n * @return sortedFacetBucket as Bucket\n */\n private sortedFacets(facetBucket: Bucket[]) {\n let sortedFacetBucket = facetBucket;\n if (this.sortedBy === 'alpha') {\n // sort by alphabetic in ascending order. eg. a,b,c,...\n sortedFacetBucket = facetBucket?.sort((a, b) => (a.key > b.key ? 1 : -1));\n } else {\n // sort by frequency/count in descending order. eg 100,99,98,...\n sortedFacetBucket = facetBucket?.sort((a, b) =>\n a.doc_count < b.doc_count ? 1 : -1\n );\n }\n\n return sortedFacetBucket;\n }\n\n private get getMoreFacetsTemplate(): TemplateResult {\n return html`\n <facets-template\n .facetGroup=${this.mergedFacets?.shift()}\n .selectedFacets=${this.selectedFacets}\n .renderOn=${'modal'}\n .collectionNameCache=${this.collectionNameCache}\n @selectedFacetsChanged=${(e: CustomEvent) => {\n this.selectedFacets = e.detail;\n }}\n ></facets-template>\n `;\n }\n\n private get loaderTemplate(): TemplateResult {\n return html`<div class=\"facets-loader\">\n <ia-activity-indicator .mode=${'processing'}></ia-activity-indicator>\n </div> `;\n }\n\n // render pagination if more then 1 page\n private get facetsPaginationTemplate() {\n return this.paginationSize > 1\n ? html`<more-facets-pagination\n .size=${this.paginationSize}\n .currentPage=${1}\n @pageNumberClicked=${this.pageNumberClicked}\n ></more-facets-pagination>`\n : nothing;\n }\n\n private get footerTemplate() {\n if (this.paginationSize > 0) {\n return html`${this.facetsPaginationTemplate}\n <div class=\"footer\">\n <button\n class=\"btn btn-cancel\"\n type=\"button\"\n @click=${this.cancelClick}\n >\n Cancel\n </button>\n <button\n class=\"btn btn-submit\"\n type=\"button\"\n @click=${this.applySearchFacetsClicked}\n >\n Apply filters\n </button>\n </div> `;\n }\n\n return nothing;\n }\n\n private sortFacetAggregation() {\n this.sortedBy = this.sortedBy === 'count' ? 'alpha' : 'count';\n this.dispatchEvent(\n new CustomEvent('sortedFacets', { detail: this.sortedBy })\n );\n }\n\n private get getModalHeaderTemplate(): TemplateResult {\n const title =\n this.sortedBy === 'alpha' ? 'Sort by count' : 'Sort by alphabetically';\n\n const image =\n this.sortedBy === 'alpha'\n ? 'https://archive.org/images/filter-alpha.png'\n : 'https://archive.org/images/filter-count.png';\n\n return html`<span class=\"sr-only\">More facets for:</span>\n <span class=\"title\">\n ${this.facetGroupTitle}\n <input\n class=\"sorting-icon\"\n type=\"image\"\n @click=${() => this.sortFacetAggregation()}\n src=\"${image}\"\n title=${title}\n alt=\"sort facets\"\n />\n </span> `;\n }\n\n render() {\n return html`\n ${this.facetsLoading\n ? this.loaderTemplate\n : html`\n <div class=\"header-content\">${this.getModalHeaderTemplate}</div>\n <div class=\"scrollable-content\">\n <div class=\"facets-content\">${this.getMoreFacetsTemplate}</div>\n </div>\n ${this.footerTemplate}\n `}\n `;\n }\n\n private applySearchFacetsClicked() {\n const event = new CustomEvent<SelectedFacets>('facetsChanged', {\n detail: this.selectedFacets,\n bubbles: true,\n composed: true,\n });\n this.dispatchEvent(event);\n this.modalManager?.closeModal();\n }\n\n private cancelClick() {\n this.modalManager?.closeModal();\n }\n\n static get styles(): CSSResultGroup {\n const modalSubmitButton = css`var(--primaryButtonBGColor, #194880)`;\n\n return css`\n .header-content .title {\n display: block;\n text-align: left;\n font-size: 1.8rem;\n padding: 0 10px;\n font-weight: bold;\n }\n .scrollable-content {\n overflow-y: auto;\n max-height: 65vh;\n }\n .facets-content {\n font-size: 1.2rem;\n margin: 10px;\n }\n .page-number {\n background: none;\n border: 0;\n cursor: pointer;\n border-radius: 100%;\n width: 25px;\n height: 25px;\n margin: 10px;\n font-size: 1.4rem;\n vertical-align: middle;\n }\n .current-page {\n background: black;\n color: white;\n }\n .facets-loader {\n margin-bottom: 20px;\n width: 70px;\n display: block;\n margin-left: auto;\n margin-right: auto;\n }\n .btn {\n border: none;\n padding: 10px;\n margin-bottom: 10px;\n width: auto;\n border-radius: 4px;\n cursor: pointer;\n }\n .btn-cancel {\n background-color: #000;\n color: white;\n }\n .btn-submit {\n background-color: ${modalSubmitButton};\n color: white;\n }\n .footer {\n text-align: center;\n margin-top: 10px;\n }\n\n .sr-only {\n position: absolute;\n width: 1px;\n height: 1px;\n padding: 0;\n margin: -1px;\n overflow: hidden;\n clip: rect(0, 0, 0, 0);\n border: 0;\n }\n .sorting-icon {\n height: 15px;\n vertical-align: baseline;\n cursor: pointer;\n }\n `;\n }\n}\n"]}
1
+ {"version":3,"file":"more-facets-content.js","sourceRoot":"","sources":["../../../src/collection-facets/more-facets-content.ts"],"names":[],"mappings":"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","sourcesContent":["/* eslint-disable dot-notation */\n/* eslint-disable lit-a11y/click-events-have-key-events */\nimport {\n css,\n CSSResultGroup,\n html,\n LitElement,\n nothing,\n PropertyValues,\n TemplateResult,\n} from 'lit';\nimport { customElement, property, state } from 'lit/decorators.js';\nimport type {\n Aggregation,\n Bucket,\n SearchServiceInterface,\n SearchParams,\n} from '@internetarchive/search-service';\nimport type { CollectionNameCacheInterface } from '@internetarchive/collection-name-cache';\nimport type { ModalManagerInterface } from '@internetarchive/modal-manager';\nimport {\n SelectedFacets,\n FacetGroup,\n FacetBucket,\n FacetOption,\n facetTitles,\n} from '../models';\nimport type { LanguageCodeHandlerInterface } from '../language-code-handler/language-code-handler';\nimport { getFacetOptionFromKey } from './facets-util';\nimport '@internetarchive/ia-activity-indicator/ia-activity-indicator';\nimport './more-facets-pagination';\nimport './facets-template';\n\n@customElement('more-facets-content')\nexport class MoreFacetsContent extends LitElement {\n @property({ type: String }) facetKey?: string;\n\n @property({ type: String }) facetAggregationKey?: string;\n\n @property({ type: String }) fullQuery?: string;\n\n @property({ type: Object }) modalManager?: ModalManagerInterface;\n\n @property({ type: Object }) searchService?: SearchServiceInterface;\n\n @property({ type: Object })\n collectionNameCache?: CollectionNameCacheInterface;\n\n @property({ type: Object })\n languageCodeHandler?: LanguageCodeHandlerInterface;\n\n @property({ type: Object }) selectedFacets?: SelectedFacets;\n\n @property({ type: String }) sortedBy = 'count'; // count | alpha\n\n @state() aggregations?: Record<string, Aggregation>;\n\n @state() facetGroup?: FacetGroup[] = [];\n\n @state() facetGroupTitle?: String = '';\n\n @state() pageNumber = 1;\n\n /**\n * Facets are loading on popup\n */\n @state() facetsLoading = true;\n\n @state() paginationSize = 0;\n\n @state() facetsType = 'modal';\n\n private facetsPerPage = 60; // TODO: Q. how many items we want to have on popup view\n\n updated(changed: PropertyValues) {\n if (changed.has('facetKey')) {\n this.facetsLoading = true;\n this.pageNumber = 1;\n\n this.updateSpecificFacets();\n }\n\n if (changed.has('pageNumber')) {\n this.facetGroup = this.aggregationFacetGroups;\n }\n }\n\n firstUpdated() {\n this.setupEscapeListeners();\n }\n\n /**\n * Close more facets modal on Escape click\n */\n private setupEscapeListeners() {\n if (this.modalManager) {\n document.addEventListener('keydown', (e: KeyboardEvent) => {\n if (e.key === 'Escape') {\n this.modalManager?.closeModal();\n }\n });\n } else {\n document.removeEventListener('keydown', () => {});\n }\n }\n\n /**\n * Get specific facets data from search-service API based of currently query params\n * - this.aggregations - hold result of search service and being used for further processing.\n */\n async updateSpecificFacets(): Promise<void> {\n const aggregations = {\n advancedParams: [\n {\n field: this.facetAggregationKey as string,\n size: 65535, // todo - do we want to have all the records at once?\n },\n ],\n };\n\n const params: SearchParams = {\n query: this.fullQuery as string,\n fields: ['identifier'],\n aggregations,\n rows: 1, // todo - do we want server-side pagination with offset/page/limit flag?\n };\n\n const results = await this.searchService?.search(params);\n this.aggregations = results?.success?.response.aggregations as any;\n\n this.facetGroup = this.aggregationFacetGroups;\n this.facetsLoading = false;\n }\n\n private pageNumberClicked(e: CustomEvent<{ page: number }>) {\n const page = e?.detail?.page;\n if (page) {\n this.pageNumber = Number(page);\n }\n }\n\n /**\n * Combines the selected facets with the aggregations to create a single list of facets\n */\n private get mergedFacets(): FacetGroup[] | void {\n const facetGroups: FacetGroup[] = [];\n\n const selectedFacetGroup = this.selectedFacetGroups.find(\n group => group.key === this.facetKey\n );\n const aggregateFacetGroup = this.aggregationFacetGroups.find(\n group => group.key === this.facetKey\n );\n\n // if the user selected a facet, but it's not in the aggregation, we add it as-is\n if (selectedFacetGroup && !aggregateFacetGroup) {\n facetGroups.push(selectedFacetGroup);\n return facetGroups;\n }\n\n // if we don't have an aggregate facet group, don't add this to the list\n if (!aggregateFacetGroup) return facetGroups;\n\n // start with either the selected group if we have one, or the aggregate group\n const facetGroup = selectedFacetGroup ?? aggregateFacetGroup;\n\n // attach the counts to the selected buckets\n const bucketsWithCount =\n selectedFacetGroup?.buckets.map(bucket => {\n const selectedBucket = aggregateFacetGroup.buckets.find(\n b => b.key === bucket.key\n );\n return selectedBucket\n ? {\n ...bucket,\n count: selectedBucket.count,\n }\n : bucket;\n }) ?? [];\n\n // append any additional buckets that were not selected\n aggregateFacetGroup.buckets.forEach(bucket => {\n const existingBucket = bucketsWithCount.find(b => b.key === bucket.key);\n if (existingBucket) return;\n bucketsWithCount.push(bucket);\n });\n facetGroup.buckets = bucketsWithCount;\n\n facetGroups.push(facetGroup);\n return facetGroups;\n }\n\n /**\n * Converts the selected facets to a `FacetGroup` array,\n * which is easier to work with\n */\n private get selectedFacetGroups(): FacetGroup[] {\n if (!this.selectedFacets) return [];\n\n const facetGroups: FacetGroup[] = Object.entries(this.selectedFacets).map(\n ([key, selectedFacets]) => {\n const option = key as FacetOption;\n const title = facetTitles[option];\n\n const buckets: FacetBucket[] = Object.entries(selectedFacets).map(\n ([value, data]) => {\n let displayText = value;\n // for selected languages, we store the language code instead of the\n // display name, so look up the name from the mapping\n if (option === 'language') {\n displayText =\n this.languageCodeHandler?.getLanguageNameFromCodeString(\n value\n ) ?? value;\n }\n return {\n displayText,\n key: value,\n count: data?.count,\n state: data?.state,\n };\n }\n );\n\n return {\n title,\n key: option,\n buckets,\n };\n }\n );\n\n return facetGroups;\n }\n\n /**\n * Converts the raw `aggregations` to `FacetGroups`, which are easier to use\n */\n private get aggregationFacetGroups(): FacetGroup[] {\n const facetGroups: FacetGroup[] = [];\n Object.entries(this.aggregations ?? []).forEach(([key, buckets]) => {\n // the year_histogram data is in a different format so can't be handled here\n if (key === 'year_histogram') return;\n\n const option = getFacetOptionFromKey(key);\n this.facetGroupTitle = facetTitles[option];\n let castedBuckets = buckets.buckets as Bucket[];\n\n // we are not showing fav- items in facets\n castedBuckets = castedBuckets?.filter(\n bucket => bucket?.key?.toString()?.startsWith('fav-') === false\n );\n\n // sort facets in specific order\n castedBuckets = this.sortedFacets(castedBuckets) as Bucket[];\n\n // find length and pagination size for modal pagination\n const { length } = Object.keys(castedBuckets as []);\n this.paginationSize = Math.ceil(length / this.facetsPerPage);\n\n // asynchronously load the collection name\n if (option === 'collection') {\n this.preloadCollectionNames(castedBuckets);\n }\n\n // render only items which will be visible as per this.facetsPerPage\n const bucketsMaxSix = castedBuckets?.slice(\n (this.pageNumber - 1) * this.facetsPerPage,\n this.pageNumber * this.facetsPerPage\n );\n\n const facetBucket: FacetBucket[] = bucketsMaxSix.map(bucket => {\n let bucketKey = bucket.key;\n // for languages, we need to search by language code instead of the\n // display name, which is what we get from the search engine result\n if (option === 'language') {\n bucketKey =\n this.languageCodeHandler?.getCodeStringFromLanguageName(\n `${bucket.key}`\n ) ?? bucket.key;\n }\n return {\n displayText: `${bucket.key}`,\n key: `${bucketKey}`,\n count: bucket.doc_count,\n state: 'none',\n };\n });\n const group: FacetGroup = {\n title: this.facetGroupTitle as string,\n key: option,\n buckets: facetBucket,\n };\n facetGroups.push(group);\n });\n\n return facetGroups;\n }\n\n /**\n * for collections, we need to asynchronously load the collection name\n * so we use the `async-collection-name` widget and for the rest, we have a static value to use\n *\n * @param castedBuckets\n */\n private preloadCollectionNames(castedBuckets: any[]) {\n const collectionIds = castedBuckets?.map(option => option.key);\n const collectionIdsArray = Array.from(new Set(collectionIds)) as string[];\n\n this.collectionNameCache?.preloadIdentifiers(collectionIdsArray);\n }\n\n /**\n * sort the facets on modal\n * - alpha sort perform in ascending order\n * - count/frequency sort perform in descending order\n *\n * @param facetBucket as Bucket[]\n *\n * @return sortedFacetBucket as Bucket\n */\n private sortedFacets(facetBucket: Bucket[]) {\n let sortedFacetBucket = facetBucket;\n if (this.sortedBy === 'alpha') {\n // sort by alphabetic in ascending order. eg. a,b,c,...\n sortedFacetBucket = facetBucket?.sort((a, b) => (a.key > b.key ? 1 : -1));\n } else {\n // sort by frequency/count in descending order. eg 100,99,98,...\n sortedFacetBucket = facetBucket?.sort((a, b) =>\n a.doc_count < b.doc_count ? 1 : -1\n );\n }\n\n return sortedFacetBucket;\n }\n\n private get getMoreFacetsTemplate(): TemplateResult {\n return html`\n <facets-template\n .facetGroup=${this.mergedFacets?.shift()}\n .selectedFacets=${this.selectedFacets}\n .renderOn=${'modal'}\n .collectionNameCache=${this.collectionNameCache}\n @selectedFacetsChanged=${(e: CustomEvent) => {\n this.selectedFacets = e.detail;\n }}\n ></facets-template>\n `;\n }\n\n private get loaderTemplate(): TemplateResult {\n return html`<div class=\"facets-loader\">\n <ia-activity-indicator .mode=${'processing'}></ia-activity-indicator>\n </div> `;\n }\n\n // render pagination if more then 1 page\n private get facetsPaginationTemplate() {\n return this.paginationSize > 1\n ? html`<more-facets-pagination\n .size=${this.paginationSize}\n .currentPage=${1}\n @pageNumberClicked=${this.pageNumberClicked}\n ></more-facets-pagination>`\n : nothing;\n }\n\n private get footerTemplate() {\n if (this.paginationSize > 0) {\n return html`${this.facetsPaginationTemplate}\n <div class=\"footer\">\n <button\n class=\"btn btn-cancel\"\n type=\"button\"\n @click=${this.cancelClick}\n >\n Cancel\n </button>\n <button\n class=\"btn btn-submit\"\n type=\"button\"\n @click=${this.applySearchFacetsClicked}\n >\n Apply filters\n </button>\n </div> `;\n }\n\n return nothing;\n }\n\n private sortFacetAggregation() {\n this.sortedBy = this.sortedBy === 'count' ? 'alpha' : 'count';\n this.dispatchEvent(\n new CustomEvent('sortedFacets', { detail: this.sortedBy })\n );\n }\n\n private get getModalHeaderTemplate(): TemplateResult {\n const title =\n this.sortedBy === 'alpha' ? 'Sort by count' : 'Sort by alphabetically';\n\n const image =\n this.sortedBy === 'alpha'\n ? 'https://archive.org/images/filter-alpha.png'\n : 'https://archive.org/images/filter-count.png';\n\n return html`<span class=\"sr-only\">More facets for:</span>\n <span class=\"title\">\n ${this.facetGroupTitle}\n <input\n class=\"sorting-icon\"\n type=\"image\"\n @click=${() => this.sortFacetAggregation()}\n src=\"${image}\"\n title=${title}\n alt=\"sort facets\"\n />\n </span> `;\n }\n\n render() {\n return html`\n ${this.facetsLoading\n ? this.loaderTemplate\n : html`\n <div class=\"header-content\">${this.getModalHeaderTemplate}</div>\n <div class=\"scrollable-content\">\n <div class=\"facets-content\">${this.getMoreFacetsTemplate}</div>\n </div>\n ${this.footerTemplate}\n `}\n `;\n }\n\n private applySearchFacetsClicked() {\n const event = new CustomEvent<SelectedFacets>('facetsChanged', {\n detail: this.selectedFacets,\n bubbles: true,\n composed: true,\n });\n this.dispatchEvent(event);\n this.modalManager?.closeModal();\n }\n\n private cancelClick() {\n this.modalManager?.closeModal();\n }\n\n static get styles(): CSSResultGroup {\n const modalSubmitButton = css`var(--primaryButtonBGColor, #194880)`;\n\n return css`\n .header-content .title {\n display: block;\n text-align: left;\n font-size: 1.8rem;\n padding: 0 10px;\n font-weight: bold;\n }\n .scrollable-content {\n overflow-y: auto;\n max-height: 60vh;\n }\n .facets-content {\n font-size: 1.2rem;\n margin: 10px;\n }\n .page-number {\n background: none;\n border: 0;\n cursor: pointer;\n border-radius: 100%;\n width: 25px;\n height: 25px;\n margin: 10px;\n font-size: 1.4rem;\n vertical-align: middle;\n }\n .current-page {\n background: black;\n color: white;\n }\n .facets-loader {\n margin-bottom: 20px;\n width: 70px;\n display: block;\n margin-left: auto;\n margin-right: auto;\n }\n .btn {\n border: none;\n padding: 10px;\n margin-bottom: 10px;\n width: auto;\n border-radius: 4px;\n cursor: pointer;\n }\n .btn-cancel {\n background-color: #000;\n color: white;\n }\n .btn-submit {\n background-color: ${modalSubmitButton};\n color: white;\n }\n .footer {\n text-align: center;\n margin-top: 10px;\n }\n\n .sr-only {\n position: absolute;\n width: 1px;\n height: 1px;\n padding: 0;\n margin: -1px;\n overflow: hidden;\n clip: rect(0, 0, 0, 0);\n border: 0;\n }\n .sorting-icon {\n height: 15px;\n vertical-align: baseline;\n cursor: pointer;\n }\n `;\n }\n}\n"]}
File without changes
@@ -0,0 +1,2 @@
1
+ "use strict";
2
+ //# sourceMappingURL=facet-group-styles.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"facet-group-styles.js","sourceRoot":"","sources":["../../../src/styles/facet-group-styles.ts"],"names":[],"mappings":"","sourcesContent":[""]}
package/package.json CHANGED
@@ -3,7 +3,7 @@
3
3
  "description": "The Internet Archive Collection Browser.",
4
4
  "license": "AGPL-3.0-only",
5
5
  "author": "Internet Archive",
6
- "version": "0.2.22",
6
+ "version": "0.2.23-fa2",
7
7
  "main": "dist/index.js",
8
8
  "module": "dist/index.js",
9
9
  "scripts": {
package/src/app-root.ts CHANGED
@@ -97,22 +97,34 @@ export class AppRoot extends LitElement {
97
97
  render() {
98
98
  return html`
99
99
  <div id="dev-tools">
100
- <form @submit=${this.searchPressed}>
101
- Query:
102
- <input
103
- type="text"
104
- id="base-query-field"
105
- .value=${this.searchQuery ?? ''}
106
- />
107
- <input type="submit" value="Search" />
108
- </form>
109
-
110
- <form @submit=${this.changePagePressed}>
111
- Page: <input type="number" value="1" id="page-number-input" />
112
- <input type="submit" value="Go" />
113
- </form>
114
-
115
- <div id="last-event">
100
+ <div id="search-and-page-inputs">
101
+ <form @submit=${this.searchPressed}>
102
+ Query:
103
+ <input
104
+ type="text"
105
+ id="base-query-field"
106
+ .value=${this.searchQuery ?? ''}
107
+ />
108
+ <input type="submit" value="Search" />
109
+ </form>
110
+ <form @submit=${this.changePagePressed}>
111
+ Page: <input type="number" value="1" id="page-number-input" />
112
+ <input type="submit" value="Go" />
113
+ </form>
114
+ </div>
115
+ <div id="toggle-controls">
116
+ <button
117
+ @click=${() => {
118
+ const details =
119
+ this.shadowRoot?.getElementById('cell-size-control');
120
+ details?.classList.toggle('hidden');
121
+ const rowGapControls =
122
+ this.shadowRoot?.getElementById('cell-gap-control');
123
+ rowGapControls?.classList.toggle('hidden');
124
+ }}
125
+ >
126
+ Toggle Cell Controls
127
+ </button>
116
128
  <button
117
129
  @click=${() => {
118
130
  const details = this.shadowRoot?.getElementById(
@@ -123,13 +135,16 @@ export class AppRoot extends LitElement {
123
135
  >
124
136
  Last Event Captured
125
137
  </button>
138
+ </div>
139
+
140
+ <div id="last-event">
126
141
  <pre id="latest-event-details" class="hidden">
127
142
  ${JSON.stringify(this.latestAction, null, 2)}
128
143
  </pre
129
144
  >
130
145
  </div>
131
146
 
132
- <div id="cell-controls">
147
+ <div id="cell-controls" class="hidden">
133
148
  <div id="cell-size-control">
134
149
  <div>
135
150
  <label for="cell-width-slider">Minimum cell width:</label>
@@ -165,6 +180,16 @@ export class AppRoot extends LitElement {
165
180
  @click=${this.outlineChanged}
166
181
  />
167
182
  </div>
183
+ <div>
184
+ <label for="show-facet-group-outline-check"
185
+ >Show Facet Group Outlines:</label
186
+ >
187
+ <input
188
+ type="checkbox"
189
+ id="show-facet-group-outline-check"
190
+ @click=${this.toggleFacetGroupOutline}
191
+ />
192
+ </div>
168
193
  <div>
169
194
  <label for="simulate-login">Simulate Login:</label>
170
195
  <input
@@ -260,6 +285,17 @@ export class AppRoot extends LitElement {
260
285
  }
261
286
  }
262
287
 
288
+ private toggleFacetGroupOutline(e: Event) {
289
+ const target = e.target as HTMLInputElement;
290
+ if (target.checked) {
291
+ this.collectionBrowser.classList.add('showFacetGroupOutlines');
292
+ this.modalManager.classList.add('showFacetGroupOutlines');
293
+ } else {
294
+ this.collectionBrowser.classList.remove('showFacetGroupOutlines');
295
+ this.modalManager.classList.remove('showFacetGroupOutlines');
296
+ }
297
+ }
298
+
263
299
  private async snippetsChanged(e: Event) {
264
300
  const target = e.target as HTMLInputElement;
265
301
  if (target.checked) {
@@ -388,6 +424,12 @@ export class AppRoot extends LitElement {
388
424
  margin-top: 20rem;
389
425
  }
390
426
 
427
+ modal-manager.showFacetGroupOutlines,
428
+ collection-browser.showFacetGroupOutlines {
429
+ --facet-row-border-top: 1px solid red;
430
+ --facet-row-border-bottom: 1px solid blue;
431
+ }
432
+
391
433
  #base-query-field {
392
434
  width: 300px;
393
435
  }
@@ -401,6 +443,11 @@ export class AppRoot extends LitElement {
401
443
  backdrop-filter: blur(10px);
402
444
  padding: 0.5rem 1rem;
403
445
  border: 1px solid black;
446
+ font-size: 1.4rem;
447
+ }
448
+
449
+ #dev-tools > * {
450
+ display: flex;
404
451
  }
405
452
 
406
453
  #cell-controls {
@@ -425,5 +472,11 @@ export class AppRoot extends LitElement {
425
472
  .hidden {
426
473
  display: none;
427
474
  }
475
+
476
+ #toggle-controls {
477
+ background-color: lightskyblue;
478
+ padding: 5px;
479
+ margin: 5px auto;
480
+ }
428
481
  `;
429
482
  }
@@ -0,0 +1,85 @@
1
+ // import { LitElement, html, css, CSSResultGroup } from "lit";
2
+ // import { query, property, customElement } from "lit/decorators.js";
3
+
4
+ // @customElement('facet-group')
5
+ // export class FacetGroup extends LitElement {
6
+
7
+ // override render() {
8
+ // return html`
9
+ // <slot></slot>
10
+ // <slot></slot>
11
+ // `
12
+ // }
13
+
14
+ // static get styles(): CSSResultGroup {
15
+ // return css`
16
+ // :host {
17
+ // margin-bottom: 1rem;
18
+ // display: flex;
19
+ // align-items: start;
20
+ // font-weight: 500;
21
+ // font-size: 1.2rem;
22
+ // cursor: pointer;
23
+ // }
24
+
25
+ // ::slotted(.facet-checkbox) {
26
+ // border: 1px solid red;
27
+ // margin-right: 0.5rem;
28
+ // display: flex;
29
+ // align-items: center;
30
+ // }
31
+
32
+ // ::slotted(.select-facet-checkbox) {
33
+ // cursor: pointer;
34
+ // margin-right: 5px;
35
+ // }
36
+
37
+ // ::slotted(.hide-facet-checkbox) {
38
+ // display: none;
39
+ // }
40
+
41
+ // ::slotted(.hide-facet-icon) {
42
+ // width: 15px;
43
+ // height: 15px;
44
+ // cursor: pointer;
45
+ // opacity: 0.3;
46
+ // }
47
+
48
+ // ::slotted(.facet-info-display) {
49
+ // border: 1px solid blue;
50
+ // display: flex;
51
+ // flex: 1;
52
+ // }
53
+
54
+ // ::slotted(.facet-title) {
55
+ // flex: 1;
56
+ // }
57
+
58
+
59
+ // `
60
+ // }
61
+ // )
62
+
63
+ // /**
64
+
65
+ // <div class="facet-row">
66
+ // <div class="facet-checkbox">
67
+ // <input type="checkbox" class="select-facet-checkbox" name="mediatype" value="texts" title="Only show mediatype: texts" id="mediatype:texts-show-only">
68
+ // <input type="checkbox" class="hide-facet-checkbox" id="mediatype:texts-negative" name="mediatype" value="texts">
69
+ // <label for="mediatype:texts-negative" class="hide-facet-icon" title="Hide mediatype: texts">
70
+ // <span class="eye"><!--?lit$141655362$-->
71
+ // <svg viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg"><path d="m98 50.5704143c-.2830293-.471515-.671154-1.1088947-1.1643742-1.9121392s-1.6003642-2.3617474-3.3214321-4.6755089c-1.7210678-2.3137614-3.522258-4.5325939-5.4035703-6.6564975-1.8813124-2.1239037-4.2828993-4.473133-7.2047606-7.0476881-2.9218612-2.5745551-5.8895067-4.7933876-8.9029363-6.6564976-3.0134295-1.86311-6.4628491-3.4330878-10.3482587-4.7099336-3.8854095-1.2768458-7.7822651-1.9142256-11.6905667-1.9121443-3.9083017.0020914-7.8051573.6154781-11.6905668 1.8401652-3.8854096 1.2246871-7.3702078 2.8301329-10.4543947 4.8163375-3.0841869 1.9862045-6.0278997 4.1695691-8.8311384 6.5500937s-5.2048256 4.7652219-7.2047605 7.1540919c-1.99993501 2.38887-3.75430043 4.5722346-5.26309632 6.5500938s-2.63883199 3.583305-3.39010829 4.8163374l-1.13003609 1.8401602c.2830293.4715149.67115403 1.1088946 1.16437421 1.9121391.49322017.8032445 1.5878776 2.3617475 3.28397229 4.6755089s3.47439274 4.521119 5.3348942 6.6220728c1.8605014 2.1009538 4.2506422 4.4387083 7.1704224 7.0132633 2.9197801 2.5745551 5.8874256 4.7819127 8.9029363 6.6220729 3.0155106 1.8401601 6.4774168 3.398663 10.3857184 4.6755088 3.9083017 1.2768458 7.8176438 1.9142256 11.7280266 1.9121443 3.9103827-.0020914 7.7957922-.6154781 11.6562286-1.8401652s7.3337886-2.818658 10.4200566-4.7819127 6.0299808-4.1351444 8.8311384-6.515669 5.2152311-4.7652219 7.2422203-7.1540919 3.8052873-4.5607597 5.3348942-6.515669c1.5296068-1.9549093 2.6721295-3.5488802 3.427568-4.7819127zm-24.5142913 0c0 6.467683-2.3079374 12.0152859-6.9238123 16.6428087s-10.1495139 6.9412843-16.600917 6.9412843c-6.4992683 0-12.0453939-2.3137615-16.6383767-6.9412843s-6.8894742-10.1751257-6.8894742-16.6428087 2.2964914-12.003811 6.8894742-16.608384 10.1391084-6.9068595 16.6383767-6.9068595c6.4534842 0 11.9871232 2.3022865 16.600917 6.9068595s6.9217312 10.140701 6.9238123 16.608384zm-23.5247293-10.552755c2.8261308 0 5.2870289 1.0619518 7.3826944 3.1858555 2.0956655 2.1239036 3.1434982 4.5795368 3.1434982 7.3668995 0 2.8332624-1.0478327 5.2888956-3.1434982 7.3668995-2.0956655 2.078004-4.5565636 3.1170059-7.3826944 3.1170059-2.873996 0-5.3348941-1.0264838-7.3826944-3.0794516-2.0478002-2.0529677-3.0717003-4.5200758-3.0717003-7.4013243 0-2.8332624 1.0239001-5.3003705 3.0717003-7.4013243 2.0478003-2.1009538 4.5086984-3.1514307 7.3826944-3.1514307z" fill="#000"></path></svg>
72
+ // </span>
73
+ // <span class="eye-closed"><!--?lit$141655362$-->
74
+ // <svg viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg"><path d="m97.5245976 14.5407294-15.0809624 14.6188347c3.3026825 2.8601369 6.4111526 6.0234269 9.3254105 9.48987 2.9142578 3.4664431 5.0023086 6.2183876 6.2641522 8.2558335l1.9668021 3.1268688c-.291855.4841879-.6920826 1.1386987-1.2006828 1.9635322s-1.6502683 2.4252247-3.4250041 4.8011737c-1.7747358 2.3759489-3.6202894 4.6426342-5.5366607 6.8000558-1.9163713 2.1574217-4.3810437 4.5580085-7.3940172 7.2017606-3.0129735 2.643752-6.0731589 4.9104373-9.180556 6.8000558-3.1073972 1.8896186-6.6643798 3.4900098-10.6709478 4.8011737-4.0065681 1.3111639-8.0249391 1.9656747-12.055113 1.9635322-6.7019347 0-13.2343359-1.6732336-19.5972037-5.019701l-17.1185824 16.6562806-10.27179318-10.6917703 14.93288898-14.5449211c-3.2533247-2.8601369-6.3371159-6.0116436-9.25137378-9.45452-2.91425785-3.4428764-5.02698749-6.1819664-6.33818892-8.2172698l-1.8927654-3.0529552c.29185498-.4841879.69208259-1.1386987 1.20068282-1.9635322.50860022-.8248335 1.65026824-2.437008 3.42500406-4.8365236 1.77473582-2.3995157 3.62028938-4.6908389 5.53666072-6.8739696 1.9163713-2.1831307 4.3810437-4.5955009 7.3940172-7.2371105s6.0731589-4.9200783 9.180556-6.8354059c3.1073972-1.9153277 6.6772558-3.5275022 10.7095757-4.8365237 4.03232-1.3090215 8.0635669-1.9635322 12.0937409-1.9635322 6.5560071 0 13.0637294 1.6968003 19.5231669 5.090401l17.1185824-16.5823669zm-46.478979 24.584323 10.7803934-10.473243c-3.5451796-1.891761-7.3092505-2.8376415-11.2922126-2.8376415-6.6547228 0-12.3609169 2.3641657-17.1185824 7.0924969-4.7576654 4.7283312-7.1375711 10.437893-7.1397171 17.1286852 0 3.8306553.8251341 7.3945787 2.4754024 10.6917703l10.9284669-10.5471566v-.1446137c0-2.9094127 1.0687043-5.4546132 3.2061128-7.6356015 2.1374086-2.1809883 4.6868477-3.2714825 7.6483174-3.2714825h.5086002zm-1.1652739 21.5988543-10.7803935 10.6178566c3.5945375 1.9388943 7.4068932 2.9083415 11.4370672 2.9083415 6.6547228 0 12.3491139-2.375949 17.0831734-7.1278469s7.1021623-10.4486051 7.1043083-17.0901215c0-4.0234736-.874492-7.6356015-2.6234759-10.836384l-10.7095757 10.473243v.363141c0 2.9586884-1.0687042 5.4803223-3.2061128 7.5649015-2.1374085 2.0845792-4.6868476 3.1268688-7.6483173 3.1268688z" fill="#000"></path></svg>
75
+ // </span>
76
+ // </label>
77
+ // </div>
78
+
79
+ // <label class="facet-info-display" for="mediatype:texts-show-only" title="Only show mediatype: texts">
80
+ // <div class="facet-title"><!--?lit$141655362$--><!--?lit$141655362$-->texts<!--?--></div>
81
+ // <div class="facet-count"><!--?lit$141655362$-->51</div>
82
+ // </label>
83
+ // </div>
84
+
85
+ // */
@@ -198,9 +198,6 @@ export class FacetsTemplate extends LitElement {
198
198
  column-width: 25rem;
199
199
  column-gap: 15px;
200
200
  }
201
- .facets-on-page .select-facet-checkbox {
202
- margin-left: 0;
203
- }
204
201
  async-collection-name {
205
202
  display: contents;
206
203
  }
@@ -215,20 +212,31 @@ export class FacetsTemplate extends LitElement {
215
212
  }
216
213
  .facet-checkbox {
217
214
  margin: 0 5px 0 0;
218
- display: inline-block;
219
- align-items: baseline;
215
+ display: flex;
216
+ height: 15px;
217
+ }
218
+ .facet-checkbox input:first-child {
219
+ margin-right: 5px;
220
+ }
221
+ .facet-checkbox input {
222
+ height: 15px;
223
+ width: 15px;
224
+ margin: 0;
220
225
  }
221
226
  .facet-row {
222
227
  display: flex;
223
228
  font-weight: 500;
224
229
  font-size: 1.2rem;
230
+ margin: 2.5px auto;
231
+ height: auto;
232
+ border-top: var(--facet-row-border-top, 1px solid transparent);
233
+ border-bottom: var(--facet-row-border-bottom, 1px solid transparent);
225
234
  }
226
235
  .facet-info-display {
227
236
  display: flex;
228
237
  flex: 1 1 0%;
229
238
  cursor: pointer;
230
239
  flex-wrap: wrap;
231
- align-content: center;
232
240
  }
233
241
  .facet-title {
234
242
  word-break: break-word;
@@ -460,7 +460,7 @@ export class MoreFacetsContent extends LitElement {
460
460
  }
461
461
  .scrollable-content {
462
462
  overflow-y: auto;
463
- max-height: 65vh;
463
+ max-height: 60vh;
464
464
  }
465
465
  .facets-content {
466
466
  font-size: 1.2rem;
File without changes