nycJSorg/angular-presentation

View on GitHub
apps/kirjs/src/app/modules/webassembly/webassembly-playground/monaco-directives/monaco-scrolling.directive.ts

Summary

Maintainability
A
0 mins
Test Coverage
import { Directive, Input, OnChanges, Optional, Self } from '@angular/core';
import { CodeDemoEditorInjector } from '@codelab/code-demos/src/lib/code-demo-editor/code-demo-editor.injector';
import { findPosition } from '@codelab/code-demos/src/lib/code-demo-editor/utils/utils';

@Directive({
  selector: '[slidesMonacoScrolling]'
})
export class MonacoScrollingDirective implements OnChanges {
  @Input() slidesMonacoScrolling = '';
  lastValue: string;

  constructor(
    @Self() @Optional() private editorInjector: CodeDemoEditorInjector
  ) {}

  ngOnChanges(changes) {
    const editor = this.editorInjector.editor;
    if (
      editor &&
      changes.slidesMonacoScrolling &&
      changes.slidesMonacoScrolling.currentValue !== this.lastValue
    ) {
      this.lastValue = this.slidesMonacoScrolling;

      if (this.slidesMonacoScrolling) {
        const range = findPosition(
          editor.getModel().getValue(),
          this.slidesMonacoScrolling
        );

        // This does not really work
        editor.revealRangeInCenter({
          startColumn: range.indexStart,
          endColumn: range.indexEnd,
          startLineNumber: range.lineStart,
          endLineNumber: range.lineEnd
        });
      }
    }
  }
}