Well Alignments

import { Plot } from "@int/geotoolkit/plot/Plot.ts";
import { MultiWellWidget } from "@int/geotoolkit/welllog/multiwell/MultiWellWidget.ts";
import { TrackType as MultiWellTrackType } from "@int/geotoolkit/welllog/multiwell/TrackType.ts";
import { TrackType as WellLogTrackType } from "@int/geotoolkit/welllog/TrackType.ts";
import { LogData } from "@int/geotoolkit/welllog/data/LogData.ts";
import { LogCurve } from "@int/geotoolkit/welllog/LogCurve.ts";
import { LogMarker } from "@int/geotoolkit/welllog/LogMarker.ts";
import { CorrelationMarker } from "@int/geotoolkit/welllog/multiwell/correlation/CorrelationMarker.ts";
import { AlignmentStyle, TextStyle } from "@int/geotoolkit/attributes/TextStyle.ts";
import { AnchorType } from "@int/geotoolkit/util/AnchorType.ts";
import { KnownColors } from "@int/geotoolkit/util/ColorUtil.ts";
import { Range } from "@int/geotoolkit/util/Range.ts";
import { MathUtil } from "@int/geotoolkit/util/MathUtil.ts";
import { Orientation } from "@int/geotoolkit/util/Orientation.ts";
import { WellState } from "/src/code/WellLog/MultiWell/WellAlignments/wellState.ts";
import curvesData from "/src/code/WellLog/MultiWell/data/data.json?import";
function createWidget() {
  const widget = new MultiWellWidget({
    "verticalscrollable": "auto",
    "horizontalscrollable": "auto",
    "tools": {
      "cursortracking": {
        "tooltip": {
          "enabled": true
        }
      }
    }
  });
  const well1 = widget.addTrack(MultiWellTrackType.WellTrack, {
    "range": new Range(0, 500),
    "welllog": {
      "range": new Range(4500, 5e3)
    },
    "name": "Well #1",
    "title": '${name}<br/><span style="background-color: #DCDCDC">1 ${deviceUnit} : ${scaleValue} ${scaleUnit}</span>'
  });
  const correlationTrack1 = widget.addTrack(MultiWellTrackType.CorrelationTrack, {
    "width": 50
  });
  const well2 = widget.addTrack(MultiWellTrackType.WellTrack, {
    "range": new Range(50, 300),
    "welllog": {
      "range": new Range(2500, 5e3)
    },
    "name": "Well #2",
    "title": '${name}<br/><span style="background-color: #DCDCDC">1 ${deviceUnit} : ${scaleValue} ${scaleUnit}</span>'
  });
  const correlationTrack2 = widget.addTrack(MultiWellTrackType.CorrelationTrack, {
    "width": 50
  });
  const well3 = widget.addTrack(MultiWellTrackType.WellTrack, {
    "range": new Range(25, 400),
    "welllog": {
      "range": new Range(4700, 5e3)
    },
    "name": "Well #3",
    "title": '${name}<br/><span style="background-color: #DCDCDC">1 ${deviceUnit} : ${scaleValue} ${scaleUnit}</span>'
  });
  addWellData(well1, 4500);
  addWellData(well2, 2500);
  addWellData(well3, 4700);
  function addWellData(well, startDepth) {
    well.addTrack(WellLogTrackType.IndexTrack);
    well.addTrack(WellLogTrackType.LinearTrack).addChild([
      createCurve(createTestData(startDepth, 10, "GR")).setLineStyle(KnownColors.Green),
      createCurve(createTestData(startDepth, 10, "CALI")).setLineStyle(KnownColors.Orange)
    ]);
  }
  addTops(well1, "Top C", 4600, KnownColors.DarkRed);
  addTops(well2, "Top C", 3e3, KnownColors.DarkRed);
  addTops(well3, "Top C", 4800, KnownColors.DarkRed);
  addTops(well1, "Top D", 4700, KnownColors.Blue);
  addTops(well2, "Top D", 4e3, KnownColors.Blue);
  addTops(well3, "Top D", 4900, KnownColors.Blue);
  addTops(well1, "Top G", 4800, KnownColors.Green);
  addTops(well1, "Top G", 4900, KnownColors.Yellow);
  function addTops(well, name, depth, color) {
    const top = new LogMarker(depth);
    top.setLineStyle("2px " + color);
    top.setTextStyle(TextStyle.fromObject({
      "color": color,
      "alignment": AlignmentStyle.Left,
      "font": "12px sans-serif"
    }));
    top.setNameLabel(name);
    top.setNameLabelPosition(AnchorType.TopCenter);
    top.setDepthLabel(depth + "");
    top.setDepthLabelPosition(AnchorType.BottomCenter);
    well.getMarkerLayer().addChild(top);
  }
  addTopsCorrelation(correlationTrack1, 4600, 3e3, KnownColors.DarkRed);
  addTopsCorrelation(correlationTrack2, 3e3, 4800, KnownColors.DarkRed);
  addTopsCorrelation(correlationTrack1, 4700, 4e3, KnownColors.Blue);
  addTopsCorrelation(correlationTrack2, 4e3, 4900, KnownColors.Blue);
  function addTopsCorrelation(track, leftDepth, rightDepth, color) {
    track.addChild(new CorrelationMarker({
      "linestyle": "2px " + color,
      "leftdepth": leftDepth,
      "rightdepth": rightDepth
    }));
  }
  widget.setHeaderHeight("auto");
  return widget;
}
function createCurve(dataSource) {
  const limits = MathUtil.calculateNeatLimits(dataSource.getMinValue(), dataSource.getMaxValue(), false, false);
  return new LogCurve(dataSource).setLineStyle({
    color: KnownColors.Blue,
    width: 2
  }).setNormalizationLimits(limits.getLow(), limits.getHigh());
}
let zoomState;
function toggleOrientation(widget) {
  widget.setOrientation(widget.getOrientation() === Orientation.Horizontal ? Orientation.Vertical : Orientation.Horizontal);
}
function resetZoom(widget) {
  widget.alignToMarkers(null);
  if (zoomState != null) {
    zoomState.restore();
  }
}
function createScene(canvas) {
  const widget = createWidget();
  const plot = new Plot({
    "canvaselement": canvas,
    "root": widget
  });
  widget.fitToHeight();
  zoomState = new WellState(widget);
  return {
    plot,
    widget
  };
}
function getCurveData(curveMnemonic) {
  const curveNames = curvesData.curveNames;
  const curveData = curvesData.curveData;
  for (let i = 0; i < curveNames.length; i++) {
    if (curveNames[i] === curveMnemonic)
      return curveData[i];
  }
  return null;
}
function createTestData(from, step, curveMnemonic) {
  const data = new LogData(curveMnemonic);
  const depths = [];
  const values = [];
  const curveData = getCurveData(curveMnemonic);
  const amountOfPoints = curveData.length;
  for (let i = 0; i < amountOfPoints; i++) {
    depths.push(i * step + from);
    values.push(curveData[i]);
  }
  data.setValues(depths, values);
  return data;
}
export { createScene, resetZoom, toggleOrientation };

createScene(document.querySelector('[ref="plot"]'));