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

61.01% Statements 36/59
85.71% Branches 6/7
60% Functions 3/5
61.01% Lines 36/59

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 601x 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 1x 1x 1x         1x 1x 1x 1x                                       1x  
/*******************************************************************************
 * Copyright bei
 * Entwicklungs- und Pflegeverbund für das gemeinsame Fachverfahren gefa
 *
 *******************************************************************************/
import {
  ChangeDetectionStrategy,
  Component,
  type EffectCleanupRegisterFn,
  ElementRef,
  afterRenderEffect,
  inject,
  viewChild,
} from '@angular/core';
 
import { ContextPagelayoutComponent } from './context-pagelayout.component';
 
@Component({
  selector: 'gc-form-pagelayout',
  templateUrl: './form-pagelayout.component.html',
  styleUrls: ['./form-pagelayout.component.css'],
  changeDetection: ChangeDetectionStrategy.Default,
  standalone: false,
})
export class FormPagelayoutComponent {
  protected readonly $breadcrumbContainer = viewChild<ElementRef<HTMLElement>>(
    'breadcrumbContainer',
  );
 
  constructor() {
    const contextPage = inject(ContextPagelayoutComponent, { optional: true });
    if (contextPage) {
      afterRenderEffect({
        read: onCleanup => this.observeBreadcrumbPosition(onCleanup),
      });
    }
  }
 
  private observeBreadcrumbPosition(onCleanup: EffectCleanupRegisterFn) {
    const viewChild = this.$breadcrumbContainer();
    if (viewChild) {
      const element = viewChild.nativeElement;
      const intersectionObserver = new IntersectionObserver(
        ([e]) => {
          element.classList.toggle('surface-contrast', e.intersectionRatio < 1);
          element.classList.toggle('surface-view', e.intersectionRatio >= 1);
        },
        {
          threshold: 1,
          rootMargin: '0px',
        },
      );
      intersectionObserver.observe(element);
      onCleanup(() => {
        intersectionObserver.disconnect();
      });
    }
  }
}