@internetarchive/collection-browser 4.3.2-alpha-webdev7939.1 → 4.3.2-alpha-webdev7939.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.js.map +1 -1
- package/dist/src/collection-browser.d.ts +10 -0
- package/dist/src/collection-browser.js +34 -16
- package/dist/src/collection-browser.js.map +1 -1
- package/dist/src/tiles/base-tile-component.js.map +1 -1
- package/dist/src/tiles/grid/item-tile.js +138 -138
- package/dist/src/tiles/grid/item-tile.js.map +1 -1
- package/dist/src/tiles/list/tile-list-compact-header.js +45 -45
- package/dist/src/tiles/list/tile-list-compact-header.js.map +1 -1
- package/dist/src/tiles/list/tile-list-compact.js +99 -99
- package/dist/src/tiles/list/tile-list-compact.js.map +1 -1
- package/dist/src/tiles/list/tile-list.js +297 -297
- package/dist/src/tiles/list/tile-list.js.map +1 -1
- package/dist/src/tiles/models.js.map +1 -1
- package/dist/src/tiles/tile-dispatcher.js +216 -216
- package/dist/src/tiles/tile-dispatcher.js.map +1 -1
- package/index.ts +28 -28
- package/package.json +2 -2
- package/src/collection-browser.ts +43 -16
- package/src/tiles/base-tile-component.ts +65 -65
- package/src/tiles/grid/item-tile.ts +346 -346
- package/src/tiles/list/tile-list-compact-header.ts +86 -86
- package/src/tiles/list/tile-list-compact.ts +239 -239
- package/src/tiles/list/tile-list.ts +700 -700
- package/src/tiles/models.ts +8 -8
- package/src/tiles/tile-dispatcher.ts +527 -527
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"tile-dispatcher.js","sourceRoot":"","sources":["../../../src/tiles/tile-dispatcher.ts"],"names":[],"mappings":";;AAAA,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,OAAO,EAAkB,MAAM,KAAK,CAAC;AACzD,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AACnE,OAAO,EAAE,SAAS,EAAE,MAAM,8BAA8B,CAAC;AACzD,OAAO,EAAE,GAAG,EAAE,MAAM,eAAe,CAAC;AAOpC,OAAO,wBAAwB,CAAC;AAChC,OAAO,kBAAkB,CAAC;AAC1B,OAAO,qBAAqB,CAAC;AAC7B,OAAO,oBAAoB,CAAC;AAC5B,OAAO,yBAAyB,CAAC;AACjC,OAAO,kBAAkB,CAAC;AAC1B,OAAO,0BAA0B,CAAC;AAClC,OAAO,iCAAiC,CAAC;AAEzC,OAAO,EAAE,iBAAiB,EAAE,MAAM,uBAAuB,CAAC;AAE1D,OAAO,EACL,mBAAmB,GAIpB,MAAM,+BAA+B,CAAC;AACvC,OAAO,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAGzC,IAAM,cAAc,GAApB,MAAM,cACX,SAAQ,iBAAiB;IADpB;QAML;;;;;;;;;;;;;;;WAeG;;QAI0B,iBAAY,GAAG,KAAK,CAAC;QAOrB,gBAAW,GAAG,KAAK,CAAC;QAEjD,iEAAiE;QACrC,eAAU,GAAe,SAAS,CAAC;QAE/D,uFAAuF;QAC1D,oBAAe,GAAG,KAAK,CAAC;QAEzB,qBAAgB,GAAG,GAAG,CAChD,gCAAgC,CACjC,CAAC;IAscJ,CAAC;;IAzbC,YAAY;QACV,IAAI,CAAC,eAAe,EAAE,KAAK,EAAE,CAAC;IAChC,CAAC;IAED,YAAY;QACV,IAAI,CAAC,eAAe,EAAE,IAAI,EAAE,CAAC;IAC/B,CAAC;IAED,+EAA+E;aACvD,6BAAwB,GAG5C;QACF,IAAI,EAAE,IAAI;QACV,cAAc,EAAE,IAAI;QACpB,aAAa,EAAE,KAAK;QACpB,aAAa,EAAE,KAAK;KACrB,AAR+C,CAQ9C;IAEF,MAAM;QACJ,MAAM,UAAU,GAAG,IAAI,CAAC,eAAe,KAAK,MAAM,CAAC;QACnD,MAAM,iBAAiB,GACrB,IAAI,CAAC,mBAAmB,EAAE,WAAW,EAAE,IAAI,OAAO,CAAC;QACrD,OAAO,IAAI,CAAA;kCACmB,UAAU,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,EAAE;UACrD,IAAI,CAAC,eAAe,KAAK,aAAa;YACtC,CAAC,CAAC,IAAI,CAAC,cAAc;YACrB,CAAC,CAAC,IAAI,CAAC,YAAY;UACnB,IAAI,CAAC,mBAAmB,IAAI,iBAAiB;;KAElD,CAAC;IACJ,CAAC;IAES,YAAY;QACpB,IAAI,IAAI,CAAC,sBAAsB,EAAE,CAAC;YAChC,IAAI,CAAC,mBAAmB,GAAG,IAAI,mBAAmB,CAAC,IAAI,EAAE;gBACvD,gBAAgB,EAAE,IAAI,CAAC,gBAAgB;gBACvC,eAAe,EAAE,KAAK;aACvB,CAAC,CAAC;QACL,CAAC;IACH,CAAC;IAED,IAAY,cAAc;QACxB,MAAM,EAAE,YAAY,EAAE,SAAS,EAAE,gBAAgB,EAAE,gBAAgB,EAAE,GACnE,IAAI,CAAC;QACP,OAAO,IAAI,CAAA;;;wBAGS,YAAY;qBACf,SAAS,IAAI,gBAAgB;4BACtB,gBAAgB;;;KAGvC,CAAC;IACJ,CAAC;IAED,IAAY,YAAY;QACtB,OAAO,IAAI,CAAA;QACP,IAAI,CAAC,eAAe,KAAK,aAAa;YACtC,CAAC,CAAC,IAAI,CAAC,IAAI;YACX,CAAC,CAAC,IAAI,CAAC,gBAAgB;KAC1B,CAAC;IACJ,CAAC;IAED,IAAY,gBAAgB;QAC1B,OAAO,IAAI,CAAA;;eAEA,IAAI,CAAC,YAAY;qBACX,IAAI,CAAC,KAAK,EAAE,KAAK,IAAI,eAAe;;wBAEjC,IAAI,CAAC,sBAAsB,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,OAAO;gBACxD,IAAI,CAAC,sBAAsB;YACjC,CAAC,CAAC,OAAO,CAAC,8DAA8D;YACxE,CAAC,CAAC,SAAS,CAAC,IAAI,CAAC,KAAK,EAAE,KAAK,CAAC;iBACvB,IAAI,CAAC,iBAAiB;uBAChB,IAAI,CAAC,qBAAqB;;;UAGvC,IAAI,CAAC,IAAI;;;UAGT,GAAG,CAAC,0CAA0C,CAAC;;KAEpD,CAAC;IACJ,CAAC;IAED,IAAY,YAAY;QACtB,IAAI,CAAC,IAAI,CAAC,KAAK,EAAE,UAAU,IAAI,IAAI,CAAC,iBAAiB,IAAI,IAAI;YAC3D,OAAO,OAAO,CAAC;QAEjB,8CAA8C;QAC9C,oEAAoE;QACpE,IAAI,IAAI,CAAC,KAAK,CAAC,IAAI,EAAE,CAAC;YACpB,OAAO,GAAG,IAAI,CAAC,iBAAiB,GAAG,IAAI,CAAC,KAAK,CAAC,IAAI,EAAE,CAAC;QACvD,CAAC;QAED,OAAO,IAAI,CAAC,oBAAoB,CAAC,WAAW,CAC1C,IAAI,CAAC,KAAK,CAAC,UAAU,EACrB,IAAI,CAAC,KAAK,CAAC,SAAS,KAAK,YAAY,CACtC,CAAC;IACJ,CAAC;IAED,IAAY,mBAAmB;QAC7B,IAAI,CAAC,IAAI,CAAC,YAAY,IAAI,IAAI,CAAC,eAAe,KAAK,MAAM;YAAE,OAAO,OAAO,CAAC;QAE1E,OAAO,IAAI,CAAA;;;;kBAIG,IAAI,CAAC,gBAAgB;qBAClB,IAAI,CAAC,KAAK,EAAE,OAAO;oBACpB,IAAI,CAAC,iBAAiB;;;KAGrC,CAAC;IACJ,CAAC;IAED;;;OAGG;IACH,IAAY,sBAAsB;QAChC,OAAO,CACL,IAAI,CAAC,eAAe;YACpB,CAAC,CAAC,IAAI,CAAC,eAAe;YACtB,gBAAc,CAAC,wBAAwB,CAAC,IAAI,CAAC,eAAe,CAAC;YAC7D,IAAI,CAAC,KAAK,EAAE,SAAS,KAAK,QAAQ,IAAI,yCAAyC;YAC/E,CAAC,IAAI,CAAC,KAAK,EAAE,YAAY,CAAC,8CAA8C;SACzE,CAAC;IACJ,CAAC;IAED,IAAY,cAAc;QACxB,OAAO,MAAM,CAAC,UAAU,CAAC,gBAAgB,CAAC,CAAC,OAAO,CAAC;IACrD,CAAC;IAED;;;;OAIG;IACH,IAAY,oBAAoB;QAC9B,OAAO,CAAC,IAAI,CAAC,cAAc,IAAI,IAAI,CAAC,sBAAsB,CAAC;IAC7D,CAAC;IAED,kBAAkB;IAClB,YAAY;QACV,OAAO,IAAI,CAAC,SAAS,CAAC;IACxB,CAAC;IAED,kBAAkB;IAClB,iBAAiB;QACf,OAAO,IAAI,CAAC;IACd,CAAC;IAED,YAAY,CAAC,KAA0B;QACrC,IAAI,CAAC,YAAY,GAAG,KAAK,CAAC,WAAW,CAAC,KAAK,CAAC;QAC5C,IAAI,CAAC,aAAa,GAAG,KAAK,CAAC,WAAW,CAAC,MAAM,CAAC;IAChD,CAAC;IAED,oBAAoB;QAClB,IAAI,CAAC,qBAAqB,CAAC,IAAI,CAAC,cAAc,CAAC,CAAC;IAClD,CAAC;IAEO,qBAAqB,CAAC,QAAwC;QACpE,QAAQ,EAAE,cAAc,CAAC;YACvB,OAAO,EAAE,IAAI;YACb,MAAM,EAAE,IAAI,CAAC,SAAS;SACvB,CAAC,CAAC;IACL,CAAC;IAEO,sBAAsB;QAC5B,IAAI,CAAC,qBAAqB,CAAC,IAAI,CAAC,cAAc,CAAC,CAAC;QAChD,IAAI,CAAC,cAAc,EAAE,WAAW,CAAC;YAC/B,OAAO,EAAE,IAAI;YACb,MAAM,EAAE,IAAI,CAAC,SAAS;SACvB,CAAC,CAAC;IACL,CAAC;IAED,OAAO,CAAC,KAAqB;QAC3B,IAAI,KAAK,CAAC,GAAG,CAAC,gBAAgB,CAAC,EAAE,CAAC;YAChC,MAAM,gBAAgB,GAAG,KAAK,CAAC,GAAG,CAChC,gBAAgB,CACgB,CAAC;YACnC,IAAI,CAAC,qBAAqB,CAAC,gBAAgB,CAAC,CAAC;YAC7C,IAAI,CAAC,sBAAsB,EAAE,CAAC;QAChC,CAAC;IACH,CAAC;IAED;;;OAGG;IACK,iBAAiB,CAAC,CAAQ;QAChC,IAAI,IAAI,CAAC,YAAY,EAAE,CAAC;YACtB,CAAC,CAAC,cAAc,EAAE,CAAC;YACnB,IAAI,IAAI,CAAC,KAAK;gBAAE,IAAI,CAAC,KAAK,CAAC,OAAO,GAAG,CAAC,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC;QAC3D,CAAC;QAED,IAAI,CAAC,aAAa,CAChB,IAAI,WAAW,CAAC,gBAAgB,EAAE,EAAE,MAAM,EAAE,IAAI,CAAC,KAAK,EAAE,CAAC,CAC1D,CAAC;IACJ,CAAC;IAED;;;OAGG;IACK,qBAAqB,CAAC,CAAQ;QACpC,IAAI,IAAI,CAAC,YAAY,IAAI,IAAI,CAAC,YAAY,KAAK,OAAO,EAAE,CAAC;YACvD,CAAC,CAAC,cAAc,EAAE,CAAC;YACnB,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,YAAY,EAAE,QAAQ,CAAC,CAAC;QAC3C,CAAC;IACH,CAAC;IAEO,qBAAqB,CAC3B,CAAwC;QAExC,IAAI,CAAC,mBAAmB,EAAE,eAAe,CAAC;YACxC,MAAM,EAAE,CAAC,CAAC,MAAM;YAChB,mBAAmB,EAAE,IAAI;SAC1B,CAAC,CAAC;IACL,CAAC;IAED,IAAY,IAAI;QACd,MAAM,EACJ,KAAK,EACL,kBAAkB,EAClB,iBAAiB,EACjB,YAAY,EACZ,aAAa,EACb,SAAS,EACT,aAAa,EACb,gBAAgB,EAChB,gBAAgB,GACjB,GAAG,IAAI,CAAC;QAET,IAAI,CAAC,KAAK;YAAE,OAAO,OAAO,CAAC;QAE3B,QAAQ,IAAI,CAAC,eAAe,EAAE,CAAC;YAC7B,KAAK,MAAM;gBACT,QAAQ,KAAK,CAAC,SAAS,EAAE,CAAC;oBACxB,KAAK,YAAY;wBACf,OAAO,IAAI,CAAA;uBACA,KAAK;oCACQ,kBAAkB;8BACxB,IAAI,CAAC,YAAY;8BACjB,YAAY;+BACX,aAAa;+BACb,aAAa;kCACV,IAAI,CAAC,gBAAgB;8BACzB,IAAI,CAAC,YAAY;4BACnB,IAAI,CAAC,UAAU;gCACX,IAAI,CAAC,oBAAoB;mCACtB,IAAI,CAAC,qBAAqB;;+BAE9B,CAAC;oBACtB,KAAK,SAAS;wBACZ,OAAO,IAAI,CAAA;uBACA,KAAK;oCACQ,kBAAkB;8BACxB,IAAI,CAAC,YAAY;8BACjB,YAAY;+BACX,aAAa;+BACb,aAAa;kCACV,IAAI,CAAC,gBAAgB;8BACzB,IAAI,CAAC,YAAY;gCACf,IAAI,CAAC,oBAAoB;mCACtB,IAAI,CAAC,qBAAqB;;4BAEjC,CAAC;oBACnB,KAAK,QAAQ;wBACX,OAAO,IAAI,CAAA;uBACA,KAAK;oCACQ,kBAAkB;8BACxB,IAAI,CAAC,YAAY;8BACjB,YAAY;+BACX,aAAa;+BACb,aAAa;kCACV,IAAI,CAAC,gBAAgB;8BACzB,IAAI,CAAC,YAAY;gCACf,KAAK;mCACF,IAAI,CAAC,qBAAqB;;2BAElC,CAAC;oBAClB;wBACE,OAAO,IAAI,CAAA;uBACA,KAAK;oCACQ,kBAAkB;8BACxB,IAAI,CAAC,YAAY;+BAChB,IAAI,CAAC,aAAa;8BACnB,IAAI,CAAC,YAAY;2BACpB,SAAS;kCACF,gBAAgB;+BACnB,aAAa;0BAClB,IAAI,CAAC,QAAQ;kCACL,IAAI,CAAC,gBAAgB;8BACzB,IAAI,CAAC,YAAY;4BACnB,IAAI,CAAC,UAAU;6BACd,IAAI,CAAC,WAAW;gCACb,IAAI,CAAC,oBAAoB;8BAC3B,IAAI,CAAC,YAAY;mCACZ,IAAI,CAAC,qBAAqB;;yBAEpC,CAAC;gBAClB,CAAC;YACH,KAAK,cAAc;gBACjB,OAAO,IAAI,CAAA;mBACA,KAAK;gCACQ,kBAAkB;0BACxB,YAAY;2BACX,aAAa;+BACT,iBAAiB;uBACzB,SAAS;8BACF,gBAAgB;2BACnB,aAAa;8BACV,gBAAgB;0BACpB,IAAI,CAAC,YAAY;sBACrB,IAAI,CAAC,QAAQ;8BACL,IAAI,CAAC,gBAAgB;0BACzB,IAAI,CAAC,YAAY;;6BAEd,CAAC;YACxB,KAAK,aAAa;gBAChB,OAAO,IAAI,CAAA;mBACA,KAAK;gCACQ,kBAAkB;8BACpB,IAAI,CAAC,gBAAgB;0BACzB,YAAY;2BACX,aAAa;+BACT,iBAAiB;uBACzB,SAAS;8BACF,gBAAgB;2BACnB,aAAa;8BACV,gBAAgB;0BACpB,IAAI,CAAC,YAAY;sBACrB,IAAI,CAAC,QAAQ;8BACL,IAAI,CAAC,gBAAgB;0BACzB,IAAI,CAAC,YAAY;;qBAEtB,CAAC;YAChB;gBACE,OAAO,OAAO,CAAC;QACnB,CAAC;IACH,CAAC;IAED,MAAM,KAAK,MAAM;QACf,OAAO;YACL,WAAW;YACX,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;OA0FF;SACF,CAAC;IACJ,CAAC;;AAxd2B;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;uDAAmC;AAEjC;IAA5B,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;oDAAsB;AAEtB;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;sDAAgD;AAG3E;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;wDACS;AAEP;IAA5B,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;mDAAqB;AAGrB;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;kDAAoC;AAGlC;IAA5B,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;uDAAyB;AAEzB;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;wDAEzB;AAKM;IADP,KAAK,CAAC,YAAY,CAAC;iDACe;AAG3B;IADP,KAAK,CAAC,iBAAiB,CAAC;iDACS;AAG1B;IADP,KAAK,CAAC,YAAY,CAAC;uDACwB;AArDjC,cAAc;IAD1B,aAAa,CAAC,iBAAiB,CAAC;GACpB,cAAc,CAgf1B","sourcesContent":["import { css, html, nothing, PropertyValues } from 'lit';\r\nimport { customElement, property, query } from 'lit/decorators.js';\r\nimport { ifDefined } from 'lit/directives/if-defined.js';\r\nimport { msg } from '@lit/localize';\r\nimport type {\r\n SharedResizeObserverInterface,\r\n SharedResizeObserverResizeHandlerInterface,\r\n} from '@internetarchive/shared-resize-observer';\r\nimport type { TileDisplayMode } from '../models';\r\nimport type { CollectionTitles } from '../data-source/models';\r\nimport './grid/collection-tile';\r\nimport './grid/item-tile';\r\nimport './grid/account-tile';\r\nimport './grid/search-tile';\r\nimport './hover/tile-hover-pane';\r\nimport './list/tile-list';\r\nimport './list/tile-list-compact';\r\nimport './list/tile-list-compact-header';\r\nimport type { TileHoverPane } from './hover/tile-hover-pane';\r\nimport { BaseTileComponent } from './base-tile-component';\r\nimport { LayoutType } from './models';\r\nimport {\r\n HoverPaneController,\r\n HoverPaneControllerInterface,\r\n HoverPaneProperties,\r\n HoverPaneProviderInterface,\r\n} from './hover/hover-pane-controller';\r\nimport { srOnlyStyle } from '../styles/sr-only';\r\n\r\n@customElement('tile-dispatcher')\r\nexport class TileDispatcher\r\n extends BaseTileComponent\r\n implements\r\n SharedResizeObserverResizeHandlerInterface,\r\n HoverPaneProviderInterface\r\n{\r\n /*\r\n * Reactive properties inherited from BaseTileComponent:\r\n * - model?: TileModel;\r\n * - currentWidth?: number;\r\n * - currentHeight?: number;\r\n * - baseNavigationUrl?: string;\r\n * - baseImageUrl?: string;\r\n * - collectionPagePath?: string;\r\n * - sortParam: SortParam | null = null;\r\n * - defaultSortParam: SortParam | null = null;\r\n * - creatorFilter?: string;\r\n * - mobileBreakpoint?: number;\r\n * - loggedIn = false;\r\n * - suppressTileBlurring = false;\r\n * - useLocalTime = false;\r\n */\r\n\r\n @property({ type: String }) tileDisplayMode?: TileDisplayMode;\r\n\r\n @property({ type: Boolean }) isManageView = false;\r\n\r\n @property({ type: Object }) resizeObserver?: SharedResizeObserverInterface;\r\n\r\n @property({ type: Object })\r\n collectionTitles?: CollectionTitles;\r\n\r\n @property({ type: Boolean }) showTvClips = false;\r\n\r\n /** What type of simplified layout to use in grid mode, if any */\r\n @property({ type: String }) layoutType: LayoutType = 'default';\r\n\r\n /** Whether this tile should include a hover pane at all (for applicable tile modes) */\r\n @property({ type: Boolean }) enableHoverPane = false;\r\n\r\n @property({ type: String }) manageCheckTitle = msg(\r\n 'Remove this item from the list',\r\n );\r\n\r\n private hoverPaneController?: HoverPaneControllerInterface;\r\n\r\n @query('#container')\r\n private container!: HTMLDivElement;\r\n\r\n @query('tile-hover-pane')\r\n private hoverPane?: TileHoverPane;\r\n\r\n @query('.tile-link')\r\n private tileLinkElement?: HTMLAnchorElement;\r\n\r\n acquireFocus(): void {\r\n this.tileLinkElement?.focus();\r\n }\r\n\r\n releaseFocus(): void {\r\n this.tileLinkElement?.blur();\r\n }\r\n\r\n /** Maps each display mode to whether hover panes should appear in that mode */\r\n private static readonly HOVER_PANE_DISPLAY_MODES: Record<\r\n TileDisplayMode,\r\n boolean\r\n > = {\r\n grid: true,\r\n 'list-compact': true,\r\n 'list-detail': false,\r\n 'list-header': false,\r\n };\r\n\r\n render() {\r\n const isGridMode = this.tileDisplayMode === 'grid';\r\n const hoverPaneTemplate =\r\n this.hoverPaneController?.getTemplate() ?? nothing;\r\n return html`\r\n <div id=\"container\" class=${isGridMode ? 'hoverable' : ''}>\r\n ${this.tileDisplayMode === 'list-header'\r\n ? this.headerTemplate\r\n : this.tileTemplate}\r\n ${this.manageCheckTemplate} ${hoverPaneTemplate}\r\n </div>\r\n `;\r\n }\r\n\r\n protected firstUpdated(): void {\r\n if (this.shouldPrepareHoverPane) {\r\n this.hoverPaneController = new HoverPaneController(this, {\r\n mobileBreakpoint: this.mobileBreakpoint,\r\n enableLongPress: false,\r\n });\r\n }\r\n }\r\n\r\n private get headerTemplate() {\r\n const { currentWidth, sortParam, defaultSortParam, mobileBreakpoint } =\r\n this;\r\n return html`\r\n <tile-list-compact-header\r\n class=\"header\"\r\n .currentWidth=${currentWidth}\r\n .sortParam=${sortParam ?? defaultSortParam}\r\n .mobileBreakpoint=${mobileBreakpoint}\r\n >\r\n </tile-list-compact-header>\r\n `;\r\n }\r\n\r\n private get tileTemplate() {\r\n return html`\r\n ${this.tileDisplayMode === 'list-detail'\r\n ? this.tile\r\n : this.linkTileTemplate}\r\n `;\r\n }\r\n\r\n private get linkTileTemplate() {\r\n return html`\r\n <a\r\n href=${this.linkTileHref}\r\n aria-label=${this.model?.title ?? 'Untitled item'}\r\n aria-describedby=\"link-aria-description\"\r\n aria-haspopup=${this.shouldPrepareHoverPane ? 'dialog' : 'false'}\r\n title=${this.shouldPrepareHoverPane\r\n ? nothing // Don't show title tooltips when we have the tile info popups\r\n : ifDefined(this.model?.title)}\r\n @click=${this.handleLinkClicked}\r\n @contextmenu=${this.handleLinkContextMenu}\r\n class=\"tile-link\"\r\n >\r\n ${this.tile}\r\n </a>\r\n <div id=\"link-aria-description\" class=\"sr-only\">\r\n ${msg('Press Down Arrow to preview item details')}\r\n </div>\r\n `;\r\n }\r\n\r\n private get linkTileHref(): string | typeof nothing {\r\n if (!this.model?.identifier || this.baseNavigationUrl == null)\r\n return nothing;\r\n\r\n // Use the server-specified href if available.\r\n // Otherwise, construct a details page URL from the item identifier.\r\n if (this.model.href) {\r\n return `${this.baseNavigationUrl}${this.model.href}`;\r\n }\r\n\r\n return this.displayValueProvider.itemPageUrl(\r\n this.model.identifier,\r\n this.model.mediatype === 'collection',\r\n );\r\n }\r\n\r\n private get manageCheckTemplate() {\r\n if (!this.isManageView || this.tileDisplayMode !== 'grid') return nothing;\r\n\r\n return html`\r\n <div class=\"manage-check\">\r\n <input\r\n type=\"checkbox\"\r\n title=${this.manageCheckTitle}\r\n ?checked=${this.model?.checked}\r\n @change=${this.handleLinkClicked}\r\n />\r\n </div>\r\n `;\r\n }\r\n\r\n /**\r\n * Whether hover pane behavior should be prepared for this tile\r\n * (e.g., whether mouse listeners should be attached, etc.)\r\n */\r\n private get shouldPrepareHoverPane(): boolean {\r\n return (\r\n this.enableHoverPane &&\r\n !!this.tileDisplayMode &&\r\n TileDispatcher.HOVER_PANE_DISPLAY_MODES[this.tileDisplayMode] &&\r\n this.model?.mediatype !== 'search' && // don't show hover panes on search tiles\r\n !this.model?.captureDates // don't show hover panes on web archive tiles\r\n );\r\n }\r\n\r\n private get isHoverEnabled(): boolean {\r\n return window.matchMedia('(hover: hover)').matches;\r\n }\r\n\r\n /**\r\n * Whether the info button should be shown on this tile.\r\n * Only shown on touch/non-hover devices where a hover pane is available,\r\n * so the button always has something to toggle.\r\n */\r\n private get shouldShowInfoButton(): boolean {\r\n return !this.isHoverEnabled && this.shouldPrepareHoverPane;\r\n }\r\n\r\n /** @inheritdoc */\r\n getHoverPane(): TileHoverPane | undefined {\r\n return this.hoverPane;\r\n }\r\n\r\n /** @inheritdoc */\r\n getHoverPaneProps(): HoverPaneProperties {\r\n return this;\r\n }\r\n\r\n handleResize(entry: ResizeObserverEntry): void {\r\n this.currentWidth = entry.contentRect.width;\r\n this.currentHeight = entry.contentRect.height;\r\n }\r\n\r\n disconnectedCallback(): void {\r\n this.stopResizeObservation(this.resizeObserver);\r\n }\r\n\r\n private stopResizeObservation(observer?: SharedResizeObserverInterface) {\r\n observer?.removeObserver({\r\n handler: this,\r\n target: this.container,\r\n });\r\n }\r\n\r\n private startResizeObservation() {\r\n this.stopResizeObservation(this.resizeObserver);\r\n this.resizeObserver?.addObserver({\r\n handler: this,\r\n target: this.container,\r\n });\r\n }\r\n\r\n updated(props: PropertyValues) {\r\n if (props.has('resizeObserver')) {\r\n const previousObserver = props.get(\r\n 'resizeObserver',\r\n ) as SharedResizeObserverInterface;\r\n this.stopResizeObservation(previousObserver);\r\n this.startResizeObservation();\r\n }\r\n }\r\n\r\n /**\r\n * Handler for when the tile link is left-clicked. Emits the `resultSelected` event.\r\n * In manage view, it also checks/unchecks the tile.\r\n */\r\n private handleLinkClicked(e: Event): void {\r\n if (this.isManageView) {\r\n e.preventDefault();\r\n if (this.model) this.model.checked = !this.model.checked;\r\n }\r\n\r\n this.dispatchEvent(\r\n new CustomEvent('resultSelected', { detail: this.model }),\r\n );\r\n }\r\n\r\n /**\r\n * Handler for when the tile link is right-clicked.\r\n * In manage view, it opens the item in a new tab. Otherwise, does nothing.\r\n */\r\n private handleLinkContextMenu(e: Event): void {\r\n if (this.isManageView && this.linkTileHref !== nothing) {\r\n e.preventDefault();\r\n window.open(this.linkTileHref, '_blank');\r\n }\r\n }\r\n\r\n private tileInfoButtonPressed(\r\n e: CustomEvent<{ x: number; y: number }>,\r\n ): void {\r\n this.hoverPaneController?.toggleHoverPane({\r\n coords: e.detail,\r\n enableTouchBackdrop: true,\r\n });\r\n }\r\n\r\n private get tile() {\r\n const {\r\n model,\r\n collectionPagePath,\r\n baseNavigationUrl,\r\n currentWidth,\r\n currentHeight,\r\n sortParam,\r\n creatorFilter,\r\n mobileBreakpoint,\r\n defaultSortParam,\r\n } = this;\r\n\r\n if (!model) return nothing;\r\n\r\n switch (this.tileDisplayMode) {\r\n case 'grid':\r\n switch (model.mediatype) {\r\n case 'collection':\r\n return html`<collection-tile\r\n .model=${model}\r\n .collectionPagePath=${collectionPagePath}\r\n .baseImageUrl=${this.baseImageUrl}\r\n .currentWidth=${currentWidth}\r\n .currentHeight=${currentHeight}\r\n .creatorFilter=${creatorFilter}\r\n .suppressBlurring=${this.suppressBlurring}\r\n .isManageView=${this.isManageView}\r\n .layoutType=${this.layoutType}\r\n ?showInfoButton=${this.shouldShowInfoButton}\r\n @infoButtonPressed=${this.tileInfoButtonPressed}\r\n >\r\n </collection-tile>`;\r\n case 'account':\r\n return html`<account-tile\r\n .model=${model}\r\n .collectionPagePath=${collectionPagePath}\r\n .baseImageUrl=${this.baseImageUrl}\r\n .currentWidth=${currentWidth}\r\n .currentHeight=${currentHeight}\r\n .creatorFilter=${creatorFilter}\r\n .suppressBlurring=${this.suppressBlurring}\r\n .isManageView=${this.isManageView}\r\n ?showInfoButton=${this.shouldShowInfoButton}\r\n @infoButtonPressed=${this.tileInfoButtonPressed}\r\n >\r\n </account-tile>`;\r\n case 'search':\r\n return html`<search-tile\r\n .model=${model}\r\n .collectionPagePath=${collectionPagePath}\r\n .baseImageUrl=${this.baseImageUrl}\r\n .currentWidth=${currentWidth}\r\n .currentHeight=${currentHeight}\r\n .creatorFilter=${creatorFilter}\r\n .suppressBlurring=${this.suppressBlurring}\r\n .isManageView=${this.isManageView}\r\n ?showInfoButton=${false}\r\n @infoButtonPressed=${this.tileInfoButtonPressed}\r\n >\r\n </search-tile>`;\r\n default:\r\n return html`<item-tile\r\n .model=${model}\r\n .collectionPagePath=${collectionPagePath}\r\n .currentWidth=${this.currentWidth}\r\n .currentHeight=${this.currentHeight}\r\n .baseImageUrl=${this.baseImageUrl}\r\n .sortParam=${sortParam}\r\n .defaultSortParam=${defaultSortParam}\r\n .creatorFilter=${creatorFilter}\r\n .loggedIn=${this.loggedIn}\r\n .suppressBlurring=${this.suppressBlurring}\r\n .isManageView=${this.isManageView}\r\n .layoutType=${this.layoutType}\r\n ?showTvClips=${this.showTvClips}\r\n ?showInfoButton=${this.shouldShowInfoButton}\r\n ?useLocalTime=${this.useLocalTime}\r\n @infoButtonPressed=${this.tileInfoButtonPressed}\r\n >\r\n </item-tile>`;\r\n }\r\n case 'list-compact':\r\n return html`<tile-list-compact\r\n .model=${model}\r\n .collectionPagePath=${collectionPagePath}\r\n .currentWidth=${currentWidth}\r\n .currentHeight=${currentHeight}\r\n .baseNavigationUrl=${baseNavigationUrl}\r\n .sortParam=${sortParam}\r\n .defaultSortParam=${defaultSortParam}\r\n .creatorFilter=${creatorFilter}\r\n .mobileBreakpoint=${mobileBreakpoint}\r\n .baseImageUrl=${this.baseImageUrl}\r\n .loggedIn=${this.loggedIn}\r\n .suppressBlurring=${this.suppressBlurring}\r\n ?useLocalTime=${this.useLocalTime}\r\n >\r\n </tile-list-compact>`;\r\n case 'list-detail':\r\n return html`<tile-list\r\n .model=${model}\r\n .collectionPagePath=${collectionPagePath}\r\n .collectionTitles=${this.collectionTitles}\r\n .currentWidth=${currentWidth}\r\n .currentHeight=${currentHeight}\r\n .baseNavigationUrl=${baseNavigationUrl}\r\n .sortParam=${sortParam}\r\n .defaultSortParam=${defaultSortParam}\r\n .creatorFilter=${creatorFilter}\r\n .mobileBreakpoint=${mobileBreakpoint}\r\n .baseImageUrl=${this.baseImageUrl}\r\n .loggedIn=${this.loggedIn}\r\n .suppressBlurring=${this.suppressBlurring}\r\n ?useLocalTime=${this.useLocalTime}\r\n >\r\n </tile-list>`;\r\n default:\r\n return nothing;\r\n }\r\n }\r\n\r\n static get styles() {\r\n return [\r\n srOnlyStyle,\r\n css`\r\n :host {\r\n display: block;\r\n height: 100%;\r\n }\r\n\r\n collection-tile {\r\n --tileBorderColor: #555555;\r\n --tileBackgroundColor: #666666;\r\n --imageBlockBackgroundColor: #666666;\r\n }\r\n\r\n account-tile {\r\n --tileBorderColor: #dddddd;\r\n --imageBlockBackgroundColor: #fcf5e6;\r\n }\r\n\r\n item-tile {\r\n --tileBorderColor: #dddddd;\r\n --imageBlockBackgroundColor: #f1f1f4;\r\n }\r\n\r\n search-tile {\r\n --tileBorderColor: #555555;\r\n --tileBackgroundColor: #666666;\r\n --imageBlockBackgroundColor: #666666;\r\n --iconFillColor: #2c2c2c;\r\n }\r\n\r\n #container {\r\n position: relative;\r\n height: 100%;\r\n border-radius: 4px;\r\n }\r\n\r\n #container.hoverable a:focus,\r\n #container.hoverable a:hover {\r\n box-shadow: var(\r\n --tileHoverBoxShadow,\r\n 0 0 6px 2px rgba(8, 8, 32, 0.8)\r\n );\r\n transition: box-shadow 0.1s ease;\r\n }\r\n\r\n a {\r\n display: block;\r\n height: 100%;\r\n color: unset;\r\n text-decoration: none;\r\n transition: transform 0.05s ease;\r\n border-radius: 4px;\r\n outline: none;\r\n }\r\n\r\n a :first-child {\r\n display: block;\r\n height: 100%;\r\n }\r\n\r\n .manage-check {\r\n position: absolute;\r\n right: 0;\r\n top: 0;\r\n border: 5px solid #2c2c2c;\r\n border-radius: 3px;\r\n background-color: #2c2c2c;\r\n z-index: 1;\r\n }\r\n\r\n .manage-check > input[type='checkbox'] {\r\n display: block;\r\n margin: 0;\r\n }\r\n\r\n #touch-backdrop {\r\n position: fixed;\r\n width: 100vw;\r\n height: 100vh;\r\n top: 0;\r\n left: 0;\r\n z-index: 2;\r\n background: transparent;\r\n }\r\n\r\n tile-hover-pane {\r\n position: absolute;\r\n top: 0;\r\n left: -9999px;\r\n z-index: 2;\r\n }\r\n `,\r\n ];\r\n }\r\n}\r\n"]}
|
|
1
|
+
{"version":3,"file":"tile-dispatcher.js","sourceRoot":"","sources":["../../../src/tiles/tile-dispatcher.ts"],"names":[],"mappings":"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","sourcesContent":["import { css, html, nothing, PropertyValues } from 'lit';\nimport { customElement, property, query } from 'lit/decorators.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport { msg } from '@lit/localize';\nimport type {\n SharedResizeObserverInterface,\n SharedResizeObserverResizeHandlerInterface,\n} from '@internetarchive/shared-resize-observer';\nimport type { TileDisplayMode } from '../models';\nimport type { CollectionTitles } from '../data-source/models';\nimport './grid/collection-tile';\nimport './grid/item-tile';\nimport './grid/account-tile';\nimport './grid/search-tile';\nimport './hover/tile-hover-pane';\nimport './list/tile-list';\nimport './list/tile-list-compact';\nimport './list/tile-list-compact-header';\nimport type { TileHoverPane } from './hover/tile-hover-pane';\nimport { BaseTileComponent } from './base-tile-component';\nimport { LayoutType } from './models';\nimport {\n HoverPaneController,\n HoverPaneControllerInterface,\n HoverPaneProperties,\n HoverPaneProviderInterface,\n} from './hover/hover-pane-controller';\nimport { srOnlyStyle } from '../styles/sr-only';\n\n@customElement('tile-dispatcher')\nexport class TileDispatcher\n extends BaseTileComponent\n implements\n SharedResizeObserverResizeHandlerInterface,\n HoverPaneProviderInterface\n{\n /*\n * Reactive properties inherited from BaseTileComponent:\n * - model?: TileModel;\n * - currentWidth?: number;\n * - currentHeight?: number;\n * - baseNavigationUrl?: string;\n * - baseImageUrl?: string;\n * - collectionPagePath?: string;\n * - sortParam: SortParam | null = null;\n * - defaultSortParam: SortParam | null = null;\n * - creatorFilter?: string;\n * - mobileBreakpoint?: number;\n * - loggedIn = false;\n * - suppressTileBlurring = false;\n * - useLocalTime = false;\n */\n\n @property({ type: String }) tileDisplayMode?: TileDisplayMode;\n\n @property({ type: Boolean }) isManageView = false;\n\n @property({ type: Object }) resizeObserver?: SharedResizeObserverInterface;\n\n @property({ type: Object })\n collectionTitles?: CollectionTitles;\n\n @property({ type: Boolean }) showTvClips = false;\n\n /** What type of simplified layout to use in grid mode, if any */\n @property({ type: String }) layoutType: LayoutType = 'default';\n\n /** Whether this tile should include a hover pane at all (for applicable tile modes) */\n @property({ type: Boolean }) enableHoverPane = false;\n\n @property({ type: String }) manageCheckTitle = msg(\n 'Remove this item from the list',\n );\n\n private hoverPaneController?: HoverPaneControllerInterface;\n\n @query('#container')\n private container!: HTMLDivElement;\n\n @query('tile-hover-pane')\n private hoverPane?: TileHoverPane;\n\n @query('.tile-link')\n private tileLinkElement?: HTMLAnchorElement;\n\n acquireFocus(): void {\n this.tileLinkElement?.focus();\n }\n\n releaseFocus(): void {\n this.tileLinkElement?.blur();\n }\n\n /** Maps each display mode to whether hover panes should appear in that mode */\n private static readonly HOVER_PANE_DISPLAY_MODES: Record<\n TileDisplayMode,\n boolean\n > = {\n grid: true,\n 'list-compact': true,\n 'list-detail': false,\n 'list-header': false,\n };\n\n render() {\n const isGridMode = this.tileDisplayMode === 'grid';\n const hoverPaneTemplate =\n this.hoverPaneController?.getTemplate() ?? nothing;\n return html`\n <div id=\"container\" class=${isGridMode ? 'hoverable' : ''}>\n ${this.tileDisplayMode === 'list-header'\n ? this.headerTemplate\n : this.tileTemplate}\n ${this.manageCheckTemplate} ${hoverPaneTemplate}\n </div>\n `;\n }\n\n protected firstUpdated(): void {\n if (this.shouldPrepareHoverPane) {\n this.hoverPaneController = new HoverPaneController(this, {\n mobileBreakpoint: this.mobileBreakpoint,\n enableLongPress: false,\n });\n }\n }\n\n private get headerTemplate() {\n const { currentWidth, sortParam, defaultSortParam, mobileBreakpoint } =\n this;\n return html`\n <tile-list-compact-header\n class=\"header\"\n .currentWidth=${currentWidth}\n .sortParam=${sortParam ?? defaultSortParam}\n .mobileBreakpoint=${mobileBreakpoint}\n >\n </tile-list-compact-header>\n `;\n }\n\n private get tileTemplate() {\n return html`\n ${this.tileDisplayMode === 'list-detail'\n ? this.tile\n : this.linkTileTemplate}\n `;\n }\n\n private get linkTileTemplate() {\n return html`\n <a\n href=${this.linkTileHref}\n aria-label=${this.model?.title ?? 'Untitled item'}\n aria-describedby=\"link-aria-description\"\n aria-haspopup=${this.shouldPrepareHoverPane ? 'dialog' : 'false'}\n title=${this.shouldPrepareHoverPane\n ? nothing // Don't show title tooltips when we have the tile info popups\n : ifDefined(this.model?.title)}\n @click=${this.handleLinkClicked}\n @contextmenu=${this.handleLinkContextMenu}\n class=\"tile-link\"\n >\n ${this.tile}\n </a>\n <div id=\"link-aria-description\" class=\"sr-only\">\n ${msg('Press Down Arrow to preview item details')}\n </div>\n `;\n }\n\n private get linkTileHref(): string | typeof nothing {\n if (!this.model?.identifier || this.baseNavigationUrl == null)\n return nothing;\n\n // Use the server-specified href if available.\n // Otherwise, construct a details page URL from the item identifier.\n if (this.model.href) {\n return `${this.baseNavigationUrl}${this.model.href}`;\n }\n\n return this.displayValueProvider.itemPageUrl(\n this.model.identifier,\n this.model.mediatype === 'collection',\n );\n }\n\n private get manageCheckTemplate() {\n if (!this.isManageView || this.tileDisplayMode !== 'grid') return nothing;\n\n return html`\n <div class=\"manage-check\">\n <input\n type=\"checkbox\"\n title=${this.manageCheckTitle}\n ?checked=${this.model?.checked}\n @change=${this.handleLinkClicked}\n />\n </div>\n `;\n }\n\n /**\n * Whether hover pane behavior should be prepared for this tile\n * (e.g., whether mouse listeners should be attached, etc.)\n */\n private get shouldPrepareHoverPane(): boolean {\n return (\n this.enableHoverPane &&\n !!this.tileDisplayMode &&\n TileDispatcher.HOVER_PANE_DISPLAY_MODES[this.tileDisplayMode] &&\n this.model?.mediatype !== 'search' && // don't show hover panes on search tiles\n !this.model?.captureDates // don't show hover panes on web archive tiles\n );\n }\n\n private get isHoverEnabled(): boolean {\n return window.matchMedia('(hover: hover)').matches;\n }\n\n /**\n * Whether the info button should be shown on this tile.\n * Only shown on touch/non-hover devices where a hover pane is available,\n * so the button always has something to toggle.\n */\n private get shouldShowInfoButton(): boolean {\n return !this.isHoverEnabled && this.shouldPrepareHoverPane;\n }\n\n /** @inheritdoc */\n getHoverPane(): TileHoverPane | undefined {\n return this.hoverPane;\n }\n\n /** @inheritdoc */\n getHoverPaneProps(): HoverPaneProperties {\n return this;\n }\n\n handleResize(entry: ResizeObserverEntry): void {\n this.currentWidth = entry.contentRect.width;\n this.currentHeight = entry.contentRect.height;\n }\n\n disconnectedCallback(): void {\n this.stopResizeObservation(this.resizeObserver);\n }\n\n private stopResizeObservation(observer?: SharedResizeObserverInterface) {\n observer?.removeObserver({\n handler: this,\n target: this.container,\n });\n }\n\n private startResizeObservation() {\n this.stopResizeObservation(this.resizeObserver);\n this.resizeObserver?.addObserver({\n handler: this,\n target: this.container,\n });\n }\n\n updated(props: PropertyValues) {\n if (props.has('resizeObserver')) {\n const previousObserver = props.get(\n 'resizeObserver',\n ) as SharedResizeObserverInterface;\n this.stopResizeObservation(previousObserver);\n this.startResizeObservation();\n }\n }\n\n /**\n * Handler for when the tile link is left-clicked. Emits the `resultSelected` event.\n * In manage view, it also checks/unchecks the tile.\n */\n private handleLinkClicked(e: Event): void {\n if (this.isManageView) {\n e.preventDefault();\n if (this.model) this.model.checked = !this.model.checked;\n }\n\n this.dispatchEvent(\n new CustomEvent('resultSelected', { detail: this.model }),\n );\n }\n\n /**\n * Handler for when the tile link is right-clicked.\n * In manage view, it opens the item in a new tab. Otherwise, does nothing.\n */\n private handleLinkContextMenu(e: Event): void {\n if (this.isManageView && this.linkTileHref !== nothing) {\n e.preventDefault();\n window.open(this.linkTileHref, '_blank');\n }\n }\n\n private tileInfoButtonPressed(\n e: CustomEvent<{ x: number; y: number }>,\n ): void {\n this.hoverPaneController?.toggleHoverPane({\n coords: e.detail,\n enableTouchBackdrop: true,\n });\n }\n\n private get tile() {\n const {\n model,\n collectionPagePath,\n baseNavigationUrl,\n currentWidth,\n currentHeight,\n sortParam,\n creatorFilter,\n mobileBreakpoint,\n defaultSortParam,\n } = this;\n\n if (!model) return nothing;\n\n switch (this.tileDisplayMode) {\n case 'grid':\n switch (model.mediatype) {\n case 'collection':\n return html`<collection-tile\n .model=${model}\n .collectionPagePath=${collectionPagePath}\n .baseImageUrl=${this.baseImageUrl}\n .currentWidth=${currentWidth}\n .currentHeight=${currentHeight}\n .creatorFilter=${creatorFilter}\n .suppressBlurring=${this.suppressBlurring}\n .isManageView=${this.isManageView}\n .layoutType=${this.layoutType}\n ?showInfoButton=${this.shouldShowInfoButton}\n @infoButtonPressed=${this.tileInfoButtonPressed}\n >\n </collection-tile>`;\n case 'account':\n return html`<account-tile\n .model=${model}\n .collectionPagePath=${collectionPagePath}\n .baseImageUrl=${this.baseImageUrl}\n .currentWidth=${currentWidth}\n .currentHeight=${currentHeight}\n .creatorFilter=${creatorFilter}\n .suppressBlurring=${this.suppressBlurring}\n .isManageView=${this.isManageView}\n ?showInfoButton=${this.shouldShowInfoButton}\n @infoButtonPressed=${this.tileInfoButtonPressed}\n >\n </account-tile>`;\n case 'search':\n return html`<search-tile\n .model=${model}\n .collectionPagePath=${collectionPagePath}\n .baseImageUrl=${this.baseImageUrl}\n .currentWidth=${currentWidth}\n .currentHeight=${currentHeight}\n .creatorFilter=${creatorFilter}\n .suppressBlurring=${this.suppressBlurring}\n .isManageView=${this.isManageView}\n ?showInfoButton=${false}\n @infoButtonPressed=${this.tileInfoButtonPressed}\n >\n </search-tile>`;\n default:\n return html`<item-tile\n .model=${model}\n .collectionPagePath=${collectionPagePath}\n .currentWidth=${this.currentWidth}\n .currentHeight=${this.currentHeight}\n .baseImageUrl=${this.baseImageUrl}\n .sortParam=${sortParam}\n .defaultSortParam=${defaultSortParam}\n .creatorFilter=${creatorFilter}\n .loggedIn=${this.loggedIn}\n .suppressBlurring=${this.suppressBlurring}\n .isManageView=${this.isManageView}\n .layoutType=${this.layoutType}\n ?showTvClips=${this.showTvClips}\n ?showInfoButton=${this.shouldShowInfoButton}\n ?useLocalTime=${this.useLocalTime}\n @infoButtonPressed=${this.tileInfoButtonPressed}\n >\n </item-tile>`;\n }\n case 'list-compact':\n return html`<tile-list-compact\n .model=${model}\n .collectionPagePath=${collectionPagePath}\n .currentWidth=${currentWidth}\n .currentHeight=${currentHeight}\n .baseNavigationUrl=${baseNavigationUrl}\n .sortParam=${sortParam}\n .defaultSortParam=${defaultSortParam}\n .creatorFilter=${creatorFilter}\n .mobileBreakpoint=${mobileBreakpoint}\n .baseImageUrl=${this.baseImageUrl}\n .loggedIn=${this.loggedIn}\n .suppressBlurring=${this.suppressBlurring}\n ?useLocalTime=${this.useLocalTime}\n >\n </tile-list-compact>`;\n case 'list-detail':\n return html`<tile-list\n .model=${model}\n .collectionPagePath=${collectionPagePath}\n .collectionTitles=${this.collectionTitles}\n .currentWidth=${currentWidth}\n .currentHeight=${currentHeight}\n .baseNavigationUrl=${baseNavigationUrl}\n .sortParam=${sortParam}\n .defaultSortParam=${defaultSortParam}\n .creatorFilter=${creatorFilter}\n .mobileBreakpoint=${mobileBreakpoint}\n .baseImageUrl=${this.baseImageUrl}\n .loggedIn=${this.loggedIn}\n .suppressBlurring=${this.suppressBlurring}\n ?useLocalTime=${this.useLocalTime}\n >\n </tile-list>`;\n default:\n return nothing;\n }\n }\n\n static get styles() {\n return [\n srOnlyStyle,\n css`\n :host {\n display: block;\n height: 100%;\n }\n\n collection-tile {\n --tileBorderColor: #555555;\n --tileBackgroundColor: #666666;\n --imageBlockBackgroundColor: #666666;\n }\n\n account-tile {\n --tileBorderColor: #dddddd;\n --imageBlockBackgroundColor: #fcf5e6;\n }\n\n item-tile {\n --tileBorderColor: #dddddd;\n --imageBlockBackgroundColor: #f1f1f4;\n }\n\n search-tile {\n --tileBorderColor: #555555;\n --tileBackgroundColor: #666666;\n --imageBlockBackgroundColor: #666666;\n --iconFillColor: #2c2c2c;\n }\n\n #container {\n position: relative;\n height: 100%;\n border-radius: 4px;\n }\n\n #container.hoverable a:focus,\n #container.hoverable a:hover {\n box-shadow: var(\n --tileHoverBoxShadow,\n 0 0 6px 2px rgba(8, 8, 32, 0.8)\n );\n transition: box-shadow 0.1s ease;\n }\n\n a {\n display: block;\n height: 100%;\n color: unset;\n text-decoration: none;\n transition: transform 0.05s ease;\n border-radius: 4px;\n outline: none;\n }\n\n a :first-child {\n display: block;\n height: 100%;\n }\n\n .manage-check {\n position: absolute;\n right: 0;\n top: 0;\n border: 5px solid #2c2c2c;\n border-radius: 3px;\n background-color: #2c2c2c;\n z-index: 1;\n }\n\n .manage-check > input[type='checkbox'] {\n display: block;\n margin: 0;\n }\n\n #touch-backdrop {\n position: fixed;\n width: 100vw;\n height: 100vh;\n top: 0;\n left: 0;\n z-index: 2;\n background: transparent;\n }\n\n tile-hover-pane {\n position: absolute;\n top: 0;\n left: -9999px;\n z-index: 2;\n }\n `,\n ];\n }\n}\n"]}
|
package/index.ts
CHANGED
|
@@ -1,28 +1,28 @@
|
|
|
1
|
-
export { CollectionBrowser } from './src/collection-browser';
|
|
2
|
-
export { CollectionBrowserDataSource } from './src/data-source/collection-browser-data-source';
|
|
3
|
-
export { CollectionBrowserDataSourceInterface } from './src/data-source/collection-browser-data-source-interface';
|
|
4
|
-
export { CollectionBrowserQueryState } from './src/data-source/collection-browser-query-state';
|
|
5
|
-
export { SortFilterBar } from './src/sort-filter-bar/sort-filter-bar';
|
|
6
|
-
export {
|
|
7
|
-
CollectionDisplayMode,
|
|
8
|
-
SortField,
|
|
9
|
-
TileModel,
|
|
10
|
-
FacetOption,
|
|
11
|
-
SelectedFacets,
|
|
12
|
-
getDefaultSelectedFacets,
|
|
13
|
-
} from './src/models';
|
|
14
|
-
export { CollectionBrowserLoadingTile } from './src/tiles/collection-browser-loading-tile';
|
|
15
|
-
export { CollectionTile } from './src/tiles/grid/collection-tile';
|
|
16
|
-
export { AccountTile } from './src/tiles/grid/account-tile';
|
|
17
|
-
export { ItemTile } from './src/tiles/grid/item-tile';
|
|
18
|
-
export { TileList } from './src/tiles/list/tile-list';
|
|
19
|
-
export { TileListCompact } from './src/tiles/list/tile-list-compact';
|
|
20
|
-
export { TileDispatcher } from './src/tiles/tile-dispatcher';
|
|
21
|
-
export { LayoutType } from './src/tiles/models';
|
|
22
|
-
export {
|
|
23
|
-
SmartQueryHeuristic,
|
|
24
|
-
KeywordFacetMap,
|
|
25
|
-
SmartFacet,
|
|
26
|
-
} from './src/collection-facets/smart-facets/models';
|
|
27
|
-
export * from './src/collection-facets/smart-facets/heuristics/index';
|
|
28
|
-
export { SmartQueryHeuristicGroup } from './src/collection-facets/smart-facets/smart-facet-heuristics';
|
|
1
|
+
export { CollectionBrowser } from './src/collection-browser';
|
|
2
|
+
export { CollectionBrowserDataSource } from './src/data-source/collection-browser-data-source';
|
|
3
|
+
export { CollectionBrowserDataSourceInterface } from './src/data-source/collection-browser-data-source-interface';
|
|
4
|
+
export { CollectionBrowserQueryState } from './src/data-source/collection-browser-query-state';
|
|
5
|
+
export { SortFilterBar } from './src/sort-filter-bar/sort-filter-bar';
|
|
6
|
+
export {
|
|
7
|
+
CollectionDisplayMode,
|
|
8
|
+
SortField,
|
|
9
|
+
TileModel,
|
|
10
|
+
FacetOption,
|
|
11
|
+
SelectedFacets,
|
|
12
|
+
getDefaultSelectedFacets,
|
|
13
|
+
} from './src/models';
|
|
14
|
+
export { CollectionBrowserLoadingTile } from './src/tiles/collection-browser-loading-tile';
|
|
15
|
+
export { CollectionTile } from './src/tiles/grid/collection-tile';
|
|
16
|
+
export { AccountTile } from './src/tiles/grid/account-tile';
|
|
17
|
+
export { ItemTile } from './src/tiles/grid/item-tile';
|
|
18
|
+
export { TileList } from './src/tiles/list/tile-list';
|
|
19
|
+
export { TileListCompact } from './src/tiles/list/tile-list-compact';
|
|
20
|
+
export { TileDispatcher } from './src/tiles/tile-dispatcher';
|
|
21
|
+
export { LayoutType } from './src/tiles/models';
|
|
22
|
+
export {
|
|
23
|
+
SmartQueryHeuristic,
|
|
24
|
+
KeywordFacetMap,
|
|
25
|
+
SmartFacet,
|
|
26
|
+
} from './src/collection-facets/smart-facets/models';
|
|
27
|
+
export * from './src/collection-facets/smart-facets/heuristics/index';
|
|
28
|
+
export { SmartQueryHeuristicGroup } from './src/collection-facets/smart-facets/smart-facet-heuristics';
|
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": "4.3.2-alpha-webdev7939.
|
|
6
|
+
"version": "4.3.2-alpha-webdev7939.3",
|
|
7
7
|
"main": "dist/index.js",
|
|
8
8
|
"module": "dist/index.js",
|
|
9
9
|
"scripts": {
|
|
@@ -31,7 +31,7 @@
|
|
|
31
31
|
"@internetarchive/histogram-date-range": "^1.4.2",
|
|
32
32
|
"@internetarchive/ia-dropdown": "^2.0.0",
|
|
33
33
|
"@internetarchive/iaux-item-metadata": "^1.0.5",
|
|
34
|
-
"@internetarchive/infinite-scroller": "1.1.0-alpha-webdev7939.
|
|
34
|
+
"@internetarchive/infinite-scroller": "1.1.0-alpha-webdev7939.5",
|
|
35
35
|
"@internetarchive/modal-manager": "^2.0.5",
|
|
36
36
|
"@internetarchive/search-service": "^2.7.1",
|
|
37
37
|
"@internetarchive/shared-resize-observer": "^0.2.0",
|
|
@@ -1168,7 +1168,7 @@ export class CollectionBrowser
|
|
|
1168
1168
|
if ((this.currentPage ?? 1) > 1) {
|
|
1169
1169
|
this.goToPage(1);
|
|
1170
1170
|
}
|
|
1171
|
-
this.
|
|
1171
|
+
this.setCurrentPage(1);
|
|
1172
1172
|
}
|
|
1173
1173
|
|
|
1174
1174
|
/**
|
|
@@ -2198,27 +2198,45 @@ export class CollectionBrowser
|
|
|
2198
2198
|
private visibleCellsChanged(
|
|
2199
2199
|
e: CustomEvent<{ visibleCellIndices: number[] }>,
|
|
2200
2200
|
) {
|
|
2201
|
+
this.updateVisiblePage(e.detail.visibleCellIndices);
|
|
2202
|
+
}
|
|
2203
|
+
|
|
2204
|
+
/**
|
|
2205
|
+
* Recomputes the current page from the given set of visible cell indices
|
|
2206
|
+
* and emits `visiblePageChanged` if the page actually changed.
|
|
2207
|
+
*/
|
|
2208
|
+
private updateVisiblePage(visibleCellIndices: number[]): void {
|
|
2201
2209
|
if (this.isScrollingToCell) return;
|
|
2202
|
-
const { visibleCellIndices } = e.detail;
|
|
2203
2210
|
if (visibleCellIndices.length === 0) return;
|
|
2204
2211
|
|
|
2212
|
+
// The indices aren't necessarily sorted, so sort them here to ensure our
|
|
2213
|
+
// calculations below find the right cell/page.
|
|
2214
|
+
const sorted = [...visibleCellIndices].sort((a, b) => a - b);
|
|
2215
|
+
|
|
2205
2216
|
// For page determination, do not count more than a single page of visible cells,
|
|
2206
2217
|
// since otherwise patrons using very tall screens will be treated as one page
|
|
2207
2218
|
// further than they actually are.
|
|
2208
2219
|
const lastIndexWithinCurrentPage =
|
|
2209
|
-
Math.min(this.pageSize,
|
|
2210
|
-
const lastVisibleCellIndex =
|
|
2220
|
+
Math.min(this.pageSize, sorted.length) - 1;
|
|
2221
|
+
const lastVisibleCellIndex = sorted[lastIndexWithinCurrentPage];
|
|
2211
2222
|
const lastVisibleCellPage =
|
|
2212
2223
|
Math.floor(lastVisibleCellIndex / this.pageSize) + 1;
|
|
2213
|
-
|
|
2214
|
-
|
|
2215
|
-
|
|
2216
|
-
|
|
2217
|
-
|
|
2218
|
-
|
|
2219
|
-
|
|
2220
|
-
|
|
2221
|
-
|
|
2224
|
+
|
|
2225
|
+
this.setCurrentPage(lastVisibleCellPage);
|
|
2226
|
+
}
|
|
2227
|
+
|
|
2228
|
+
/**
|
|
2229
|
+
* Sets the current page number and emits a `visiblePageChanged`
|
|
2230
|
+
* event if the new page differs from the previous one.
|
|
2231
|
+
*/
|
|
2232
|
+
private setCurrentPage(pageNumber: number): void {
|
|
2233
|
+
if (this.currentPage === pageNumber) return;
|
|
2234
|
+
this.currentPage = pageNumber;
|
|
2235
|
+
this.dispatchEvent(
|
|
2236
|
+
new CustomEvent('visiblePageChanged', {
|
|
2237
|
+
detail: { pageNumber },
|
|
2238
|
+
}),
|
|
2239
|
+
);
|
|
2222
2240
|
}
|
|
2223
2241
|
|
|
2224
2242
|
// we only want to scroll on the very first query change
|
|
@@ -2318,10 +2336,10 @@ export class CollectionBrowser
|
|
|
2318
2336
|
this.selectedCreatorFilter = restorationState.selectedCreatorFilter ?? null;
|
|
2319
2337
|
this.selectedFacets = restorationState.selectedFacets;
|
|
2320
2338
|
if (!this.suppressURLQuery) this.baseQuery = restorationState.baseQuery;
|
|
2321
|
-
this.
|
|
2339
|
+
this.setCurrentPage(restorationState.currentPage ?? 1);
|
|
2322
2340
|
this.minSelectedDate = restorationState.minSelectedDate;
|
|
2323
2341
|
this.maxSelectedDate = restorationState.maxSelectedDate;
|
|
2324
|
-
if (this.currentPage > 1) {
|
|
2342
|
+
if (this.currentPage && this.currentPage > 1) {
|
|
2325
2343
|
this.goToPage(this.currentPage);
|
|
2326
2344
|
}
|
|
2327
2345
|
}
|
|
@@ -2423,9 +2441,18 @@ export class CollectionBrowser
|
|
|
2423
2441
|
});
|
|
2424
2442
|
|
|
2425
2443
|
this.isScrollingToCell = true;
|
|
2426
|
-
await this.infiniteScroller.scrollToCell(
|
|
2444
|
+
const scrolled = await this.infiniteScroller.scrollToCell(
|
|
2445
|
+
cellIndexToScrollTo,
|
|
2446
|
+
true,
|
|
2447
|
+
);
|
|
2427
2448
|
this.isScrollingToCell = false;
|
|
2428
2449
|
this.infiniteScroller.refreshAllVisibleCells();
|
|
2450
|
+
|
|
2451
|
+
// After we finish scrolling, recompute the visible page from the new state
|
|
2452
|
+
// so that it doesn't fall out of sync.
|
|
2453
|
+
if (scrolled) {
|
|
2454
|
+
this.updateVisiblePage(this.infiniteScroller.getVisibleCellIndices());
|
|
2455
|
+
}
|
|
2429
2456
|
}
|
|
2430
2457
|
|
|
2431
2458
|
/**
|
|
@@ -1,65 +1,65 @@
|
|
|
1
|
-
import { LitElement, PropertyValues } from 'lit';
|
|
2
|
-
import { property } from 'lit/decorators.js';
|
|
3
|
-
import type { SortParam } from '@internetarchive/search-service';
|
|
4
|
-
import { TileDisplayValueProvider } from './tile-display-value-provider';
|
|
5
|
-
import type { TileModel } from '../models';
|
|
6
|
-
import { DateFormat, formatDate } from '../utils/format-date';
|
|
7
|
-
|
|
8
|
-
export abstract class BaseTileComponent extends LitElement {
|
|
9
|
-
@property({ type: Object }) model?: TileModel;
|
|
10
|
-
|
|
11
|
-
@property({ type: Number }) currentWidth?: number;
|
|
12
|
-
|
|
13
|
-
@property({ type: Number }) currentHeight?: number;
|
|
14
|
-
|
|
15
|
-
@property({ type: String }) baseNavigationUrl?: string;
|
|
16
|
-
|
|
17
|
-
@property({ type: String }) baseImageUrl?: string;
|
|
18
|
-
|
|
19
|
-
@property({ type: String }) collectionPagePath?: string;
|
|
20
|
-
|
|
21
|
-
@property({ type: Object }) sortParam: SortParam | null = null;
|
|
22
|
-
|
|
23
|
-
@property({ type: Object }) defaultSortParam: SortParam | null = null;
|
|
24
|
-
|
|
25
|
-
@property({ type: String }) creatorFilter?: string;
|
|
26
|
-
|
|
27
|
-
@property({ type: Number }) mobileBreakpoint?: number;
|
|
28
|
-
|
|
29
|
-
@property({ type: Boolean }) loggedIn = false;
|
|
30
|
-
|
|
31
|
-
@property({ type: Boolean }) suppressBlurring = false;
|
|
32
|
-
|
|
33
|
-
@property({ type: Boolean }) useLocalTime = false;
|
|
34
|
-
|
|
35
|
-
protected displayValueProvider = new TileDisplayValueProvider();
|
|
36
|
-
|
|
37
|
-
protected willUpdate(changed: PropertyValues<this>) {
|
|
38
|
-
// Ensure the TileDisplayValueProvider stays up-to-date as properties change
|
|
39
|
-
if (
|
|
40
|
-
changed.has('model') ||
|
|
41
|
-
changed.has('baseNavigationUrl') ||
|
|
42
|
-
changed.has('collectionPagePath') ||
|
|
43
|
-
changed.has('sortParam') ||
|
|
44
|
-
changed.has('defaultSortParam') ||
|
|
45
|
-
changed.has('creatorFilter')
|
|
46
|
-
) {
|
|
47
|
-
this.displayValueProvider = new TileDisplayValueProvider({
|
|
48
|
-
model: this.model,
|
|
49
|
-
baseNavigationUrl: this.baseNavigationUrl,
|
|
50
|
-
collectionPagePath: this.collectionPagePath,
|
|
51
|
-
sortParam: this.sortParam ?? this.defaultSortParam ?? undefined,
|
|
52
|
-
creatorFilter: this.creatorFilter,
|
|
53
|
-
});
|
|
54
|
-
}
|
|
55
|
-
}
|
|
56
|
-
|
|
57
|
-
/**
|
|
58
|
-
* The formatted date string for given date and format type, taking into
|
|
59
|
-
* account whether this tile component should be using local time or UTC.
|
|
60
|
-
*/
|
|
61
|
-
protected getFormattedDate(date?: Date, format?: DateFormat): string {
|
|
62
|
-
const { useLocalTime } = this;
|
|
63
|
-
return formatDate(date, format, { useLocalTime });
|
|
64
|
-
}
|
|
65
|
-
}
|
|
1
|
+
import { LitElement, PropertyValues } from 'lit';
|
|
2
|
+
import { property } from 'lit/decorators.js';
|
|
3
|
+
import type { SortParam } from '@internetarchive/search-service';
|
|
4
|
+
import { TileDisplayValueProvider } from './tile-display-value-provider';
|
|
5
|
+
import type { TileModel } from '../models';
|
|
6
|
+
import { DateFormat, formatDate } from '../utils/format-date';
|
|
7
|
+
|
|
8
|
+
export abstract class BaseTileComponent extends LitElement {
|
|
9
|
+
@property({ type: Object }) model?: TileModel;
|
|
10
|
+
|
|
11
|
+
@property({ type: Number }) currentWidth?: number;
|
|
12
|
+
|
|
13
|
+
@property({ type: Number }) currentHeight?: number;
|
|
14
|
+
|
|
15
|
+
@property({ type: String }) baseNavigationUrl?: string;
|
|
16
|
+
|
|
17
|
+
@property({ type: String }) baseImageUrl?: string;
|
|
18
|
+
|
|
19
|
+
@property({ type: String }) collectionPagePath?: string;
|
|
20
|
+
|
|
21
|
+
@property({ type: Object }) sortParam: SortParam | null = null;
|
|
22
|
+
|
|
23
|
+
@property({ type: Object }) defaultSortParam: SortParam | null = null;
|
|
24
|
+
|
|
25
|
+
@property({ type: String }) creatorFilter?: string;
|
|
26
|
+
|
|
27
|
+
@property({ type: Number }) mobileBreakpoint?: number;
|
|
28
|
+
|
|
29
|
+
@property({ type: Boolean }) loggedIn = false;
|
|
30
|
+
|
|
31
|
+
@property({ type: Boolean }) suppressBlurring = false;
|
|
32
|
+
|
|
33
|
+
@property({ type: Boolean }) useLocalTime = false;
|
|
34
|
+
|
|
35
|
+
protected displayValueProvider = new TileDisplayValueProvider();
|
|
36
|
+
|
|
37
|
+
protected willUpdate(changed: PropertyValues<this>) {
|
|
38
|
+
// Ensure the TileDisplayValueProvider stays up-to-date as properties change
|
|
39
|
+
if (
|
|
40
|
+
changed.has('model') ||
|
|
41
|
+
changed.has('baseNavigationUrl') ||
|
|
42
|
+
changed.has('collectionPagePath') ||
|
|
43
|
+
changed.has('sortParam') ||
|
|
44
|
+
changed.has('defaultSortParam') ||
|
|
45
|
+
changed.has('creatorFilter')
|
|
46
|
+
) {
|
|
47
|
+
this.displayValueProvider = new TileDisplayValueProvider({
|
|
48
|
+
model: this.model,
|
|
49
|
+
baseNavigationUrl: this.baseNavigationUrl,
|
|
50
|
+
collectionPagePath: this.collectionPagePath,
|
|
51
|
+
sortParam: this.sortParam ?? this.defaultSortParam ?? undefined,
|
|
52
|
+
creatorFilter: this.creatorFilter,
|
|
53
|
+
});
|
|
54
|
+
}
|
|
55
|
+
}
|
|
56
|
+
|
|
57
|
+
/**
|
|
58
|
+
* The formatted date string for given date and format type, taking into
|
|
59
|
+
* account whether this tile component should be using local time or UTC.
|
|
60
|
+
*/
|
|
61
|
+
protected getFormattedDate(date?: Date, format?: DateFormat): string {
|
|
62
|
+
const { useLocalTime } = this;
|
|
63
|
+
return formatDate(date, format, { useLocalTime });
|
|
64
|
+
}
|
|
65
|
+
}
|