@net7/boilerplate-muruca 5.3.4 → 5.4.0

package/lib/config-types/muruca/layouts.d.ts

@@ -1,6 +1,6 @@
 import { LibOptions, NetworkLibOptions } from '@net7/components';
 import { MrSearchConfig } from '../../interfaces/search.interface';
-import { ConfigMurucaBreadcrumbsSection, ConfigMurucaCollectionSection, ConfigMurucaContentSection, ConfigMurucaGallerySection, ConfigMurucaHeroSection, ConfigMurucaImageViewerSection, ConfigMurucaInfoBoxSection, ConfigMurucaItemPreviewSection, ConfigMurucaMetadataSection, ConfigMurucaSliderSection, ConfigMurucaTabsSection, ConfigMurucaTextViewerSection, ConfigMurucaTitleSection, ConfigMurucaMetadataDynamicSection, ConfigMurucaButtonSection } from './sections';
+import { ConfigMurucaBreadcrumbsSection, ConfigMurucaCollectionSection, ConfigMurucaContentSection, ConfigMurucaGallerySection, ConfigMurucaHeroSection, ConfigMurucaImageViewerSection, ConfigMurucaInfoBoxSection, ConfigMurucaItemPreviewSection, ConfigMurucaMetadataSection, ConfigMurucaSliderSection, ConfigMurucaTabsSection, ConfigMurucaTextViewerSection, ConfigMurucaTitleSection, ConfigMurucaMetadataDynamicSection, ConfigMurucaButtonSection, ConfigMurucaParallelTextViewerSection } from './sections';
 export interface ConfigMurucaLayout {
     /** page title */
     title: string;
@@ -15,10 +15,12 @@ export interface ConfigMurucaResourceLayout extends ConfigMurucaLayout {
     /** resource type (used by resource modal) */
     type: string;
     /** delay time before scrolling to an anchor */
-    pageLoad: number;
+    pageLoad?: number;
+    /** Threshold where the "read-more" button appears */
+    maxHeight?: number;
     /** layout sections (top | content) */
     sections: {
-        [key in 'top' | 'content']: (ConfigMurucaTabsSection | ConfigMurucaTitleSection | ConfigMurucaImageViewerSection | ConfigMurucaMetadataSection | ConfigMurucaCollectionSection | ConfigMurucaItemPreviewSection | ConfigMurucaTextViewerSection | ConfigMurucaInfoBoxSection | ConfigMurucaBreadcrumbsSection | ConfigMurucaMetadataDynamicSection | ConfigMurucaButtonSection)[];
+        [key in 'top' | 'content']: (ConfigMurucaTabsSection | ConfigMurucaTitleSection | ConfigMurucaImageViewerSection | ConfigMurucaMetadataSection | ConfigMurucaCollectionSection | ConfigMurucaItemPreviewSection | ConfigMurucaTextViewerSection | ConfigMurucaParallelTextViewerSection | ConfigMurucaInfoBoxSection | ConfigMurucaBreadcrumbsSection | ConfigMurucaMetadataDynamicSection | ConfigMurucaButtonSection)[];
     };
 }
 export interface ConfigMurucaItineraryLayout extends ConfigMurucaLayout {

package/lib/config-types/muruca/sections.d.ts

@@ -51,6 +51,15 @@ export interface ConfigMurucaInfoBoxSection extends ConfigMurucaSection {
 export interface ConfigMurucaTextViewerSection extends ConfigMurucaSection {
     type: 'text-viewer';
 }
+export interface ConfigMurucaParallelTextViewerSection extends ConfigMurucaSection {
+    type: 'parallel-text-viewer';
+    options?: {
+        /** grid */
+        grid?: any;
+        /** panels */
+        panels?: any;
+    };
+}
 export interface ConfigMurucaTitleSection extends ConfigMurucaSection {
     type: 'title';
 }

package/lib/data-sources/index.d.ts

@@ -20,6 +20,7 @@ export * from './timeline.ds';
 export * from './year-header.ds';
 export * from './gallery.ds';
 export * from './network.ds';
+export * from './parallel-text-viewer.ds';
 export * from './search/search-page-title.ds';
 export * from './search/search-results-title.ds';
 export * from './search/search-results.ds';

package/lib/data-sources/parallel-text-viewer.ds.d.ts

@@ -0,0 +1,12 @@
+import { ParallelTextViewerData } from '@net7/components';
+import { DataSource } from '@net7/core';
+export declare class MrParallelTextViewerDS extends DataSource {
+    id: string;
+    protected transform(data: ParallelTextViewerData): ParallelTextViewerData;
+    displayIndex(): void;
+    setupViewClickListeners(): void;
+    onClick(payload: any): void;
+    viewListenerUpdate(): void;
+    changeView(view: any, refresh: any): void;
+    scrollElementsIntoView(target: any, type: any, view: any): void;
+}

package/lib/event-handlers/index.d.ts

@@ -8,6 +8,7 @@ export * from './collection.eh';
 export * from './text-viewer.eh';
 export * from './button.eh';
 export * from './network.eh';
+export * from './parallel-text-viewer.eh';
 export * from './search/search-tags.eh';
 export * from './search/search-results-title.eh';
 export * from './search/search-page-title.eh';

package/lib/event-handlers/parallel-text-viewer.eh.d.ts

@@ -0,0 +1,7 @@
+import { EventHandler } from '@net7/core';
+import { MrParallelTextViewerDS } from '../data-sources/parallel-text-viewer.ds';
+export declare class MrParallelTextViewerEH extends EventHandler {
+    layoutId: string;
+    dataSource: MrParallelTextViewerDS;
+    listen(): void;
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@net7/boilerplate-muruca",
-  "version": "5.3.4",
+  "version": "5.4.0",
   "peerDependencies": {
     "@angular/common": "^17.3.11",
     "@angular/core": "^17.3.11"

package/src/lib/styles/muruca/components/_parallel-text-viewer.scss

@@ -0,0 +1,122 @@
+/**
+ * PARALLEL-TEXT-VIEWER
+ *
+ * Style for the TEI-Publisher text viewer.
+ * This SCSS extends and overwrites the original CSS.
+ */
+
+/* ------------------------------------ *\
+   #PROPERTIES
+\* ------------------------------------ */
+.n7-parallel-text-viewer {
+    pb-page {
+        --pb-base-font-family: 'Open Sans', sans-serif; // TODO SASS variable should be used: $font-family-main;
+        --pb-base-font-size: $font-size-l-xl;
+        --pb-base-line-height: 1.42857143;
+        --pb-base-font-weight: $font-weight-normal;
+        --pb-base-font: var(--pb-base-font-weight) var(--pb-base-font-size)/var(--pb-base-line-height) var(--pb-base-font-family);
+        --pb-serif-font-family: #{$font-family-text}; // TODO SASS variable should be used: $font-family-text;
+        --pb-content-font-family: var(--pb-serif-font-family);
+        --pb-content-font-size: 20px;
+        --pb-heading-font-family: 'Open Sans', sans-serif; // TODO SASS variable should be used: "Oswald", Verdana, "Helvetica", sans-serif;
+        --pb-heading-font-weight: 400 !important;
+        --pb-heading-line-height: 1.2;
+        --pb-breadcrumbs-font-size: 18px;
+        --pb-color-primary: $color-gray-05; // #303030;
+        --pb-color-inverse: #f0f0f0;
+        --pb-color-lighter: #35424b;
+        --pb-color-focus: #f6a623;
+        --pb-header-background-image: none;
+        --pb-drawer-background-color: var(--pb-color-inverse);
+        --pb-menubar-background-color: #35424b;
+        --pb-menubar-background-image: none;
+        --pb-menubar-color: var(--pb-color-inverse);
+        --pb-toolbar-background-color: #d1dae0;
+        --pb-toolbar-background-image: none;
+        --pb-toolbar-color: var(--pb-color-primary);
+        --paper-tooltip-delay-in: 200;
+        --pb-footnote-font-size: 13px;
+        --pb-footnote-font-family: var(--pb-content-font-family);
+        --pb-footnote-font-weight: var(--pb-content-font-weight);
+        --pb-footnote-color: #303030;
+        --pb-footnote-padding: 0 0 0 .25em;
+        --pb-popover-theme: "material";
+        --pb-popover-max-width: 480px;
+        --pb-popover-font-size: 16px;
+        --pb-popover-line-height: 1.2;
+        --pb-popover-placement: "bottom";
+        --pb-popover-fallback-placement: "top right left";
+        --pb-lang-input-color: var(--pb-color-inverse);
+        --pb-lang-label-color: var(--pb-color-inverse);
+        --pb-link-color: black;
+        --pb-link-font-family: var(--pb-serif-font-family);
+        --pb-highlight-color: #f9e976;
+        --paper-input-container-focus-color: var(--pb-color-focus);
+        --pb-view-max-width: #{$page-readable-width};
+        font: var(--pb-base-font);
+        color: var(--pb-color-primary);
+        margin: 0;
+    }
+}
+
+/* ------------------------------------ *\
+   #PARALLEL-TEXT-VIEWER
+\* ------------------------------------ */
+.n7-parallel-text-viewer {
+    border-bottom: 2px solid $color-border-normal;
+
+    app-header-layout {
+        overflow: hidden;
+    }
+    /* Table of contents */
+    pb-drawer {
+        position: absolute;
+        top: 64px; // 64 is the height of the header of the text viewer
+    }
+
+    pb-view {
+        padding-top: $space*5;
+        padding-bottom: $space*5;
+    }
+
+    pb-panel {
+        ._pb_panel {
+            height: 100%;
+        }
+    }
+
+}
+
+pb-load {
+    ul {
+        list-style: none;
+    }
+
+    pb-collapse {
+        cursor: pointer;
+    }
+}
+
+.n7-parallel-text-viewer {
+    .place {
+        color: red;
+    }
+}
+
+
+
+/* ------------------------------------ *\
+   #MEDIA-QUERIES
+\* ------------------------------------ */
+@media all and (max-width: $breakpoint-laptop) {
+}
+
+@media all and (max-width: $breakpoint-ipad-portrait) {
+}
+
+@media all and (max-width: $breakpoint-smartphone-landscape) {
+}
+
+/* Retina */
+@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
+}