All files / lib/page-layout split-pagelayout.component.ts

63.76% Statements 44/69
83.33% Branches 5/6
60% Functions 3/5
63.76% Lines 44/69

Press n or j to go to the next uncovered block, b, p or k for the previous block.

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 701x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 2x 2x 2x 2x 2x 2x 1x 1x 2x             2x 2x 1x 1x     1x 1x                                   1x  
/*******************************************************************************
 * Copyright bei
 * Entwicklungs- und Pflegeverbund für das gemeinsame Fachverfahren gefa
 *
 *******************************************************************************/
import {
  ChangeDetectionStrategy,
  Component,
  ElementRef,
  HostBinding,
  OnDestroy,
  effect,
  inject,
  viewChild,
} from '@angular/core';
 
import { ContextPagelayoutComponent } from './context-pagelayout.component';
 
@Component({
  selector: 'gc-split-pagelayout',
  templateUrl: './split-pagelayout.component.html',
  styleUrls: ['./split-pagelayout.component.css'],
  changeDetection: ChangeDetectionStrategy.Eager,
  standalone: false,
})
export class SplitPagelayoutComponent implements OnDestroy {
  @HostBinding('class.gc-split-pagelayout')
  protected csshelper = true;
 
  protected readonly $breadcrumbContainer = viewChild<ElementRef<HTMLElement>>(
    'breadcrumbContainer',
  );
 
  private intersectionObserver?: IntersectionObserver;
 
  constructor() {
    const contextPage = inject(ContextPagelayoutComponent, { optional: true });

    if (contextPage) {
      effect(() => {
        const el = this.$breadcrumbContainer();
        this.observeBreadcrumbPosition(el?.nativeElement);
      });
    }
  }
 
  ngOnDestroy(): void {
    this.intersectionObserver?.disconnect();
  }
 
  private observeBreadcrumbPosition(element: HTMLElement | undefined) {
    this.intersectionObserver?.disconnect();
    this.intersectionObserver = undefined;

    if (element) {
      this.intersectionObserver = new IntersectionObserver(
        ([e]) => {
          element.classList.toggle('surface-contrast', e.intersectionRatio < 1);
          element.classList.toggle('surface-view', e.intersectionRatio >= 1);
        },
        {
          threshold: 1,
          rootMargin: '0px',
        },
      );
      this.intersectionObserver.observe(element);
    }
  }
}