Change Detection for BIM/CAD Models with Cesium ion API

const API_URL = "https://api.ion.cesium.com";
const ION_ACCESS_TOKEN = "YOUR_READ_ONLY_ION_TOKEN";
const BIM_CAD_DATABASE_ASSET_ID = "YOUR DATABASE ASSET ID";

Cesium.Ion.defaultServer = `${API_URL}/`;
Cesium.Ion.defaultAccessToken = ION_ACCESS_TOKEN;

const viewer = new Cesium.Viewer("cesiumContainer", {
  baseLayer: false,
  timeline: false,
  animation: false,
  baseLayerPicker: false,
  sceneModePicker: false,
});

const changes = {
  inserted: new Set(),
  updated: new Set(),
  deleted: new Set(),
};
const visibility = {
  inserted: true,
  updated: true,
  deleted: true,
};

let currentTileset;
let previousTileset;
let currentStyle;
let previousStyle;

const highlightColors = {
  inserted: Cesium.Color.LIME,
  updated: Cesium.Color.ORANGE,
  deleted: Cesium.Color.RED,
};

async function fetchIonJson(path, options = {}) {
  const response = await fetch(`${API_URL}${path}`, {
    ...options,
    headers: {
      Accept: "application/json",
      ...options.headers,
      Authorization: `Bearer ${ION_ACCESS_TOKEN}`,
    },
  });
  if (!response.ok) {
    throw new Error(
      `Ion request failed: ${response.status} ${response.statusText}`,
    );
  }
  return response.json();
}

async function getLatestRevisions() {
  const { items } = await fetchIonJson(
    `/assets/${BIM_CAD_DATABASE_ASSET_ID}/tileset-revisions?limit=2`,
  );
  if (!Array.isArray(items) || items.length < 2) {
    throw new Error("At least two model revisions are required.");
  }

  const [toRevision, fromRevision] = items;

  return {
    fromAssetId: fromRevision.assetId,
    toAssetId: toRevision.assetId,
  };
}

async function createComparisonPrivately(
  { fromAssetId, toAssetId },
  privateWriteToken,
) {
  const response = await fetch(`${API_URL}/assets/compare`, {
    method: "POST",
    headers: {
      Accept: "application/json",
      "Content-Type": "application/json",
      Authorization: `Bearer ${privateWriteToken}`,
    },
    body: JSON.stringify({ fromAssetId, toAssetId }),
  });
  if (!response.ok) {
    throw new Error(
      `Create request failed: ${response.status} ${response.statusText}`,
    );
  }
  return response.json();
}

async function getComparisonReport({ fromAssetId, toAssetId }) {
  const compareParams = new URLSearchParams({ fromAssetId, toAssetId });
  const comparePath = `/assets/compare?${compareParams}`;
  let comparison = await fetchIonJson(comparePath);

  const deadline = Date.now() + 120000;
  while (["QUEUED", "IN_PROGRESS"].includes(comparison.status)) {
    if (Date.now() >= deadline) {
      throw new Error("Comparison timed out.");
    }
    await new Promise((resolve) => setTimeout(resolve, 2000));
    comparison = await fetchIonJson(comparePath);
  }

  if (comparison.status !== "COMPLETE") {
    throw new Error(comparison.error ?? "Comparison failed.");
  }

  const fullReportUrl = comparison.results?.fullReport;
  if (!fullReportUrl) {
    throw new Error("The comparison does not include a full report.");
  }

  const reportResponse = await fetch(fullReportUrl);
  if (!reportResponse.ok) {
    throw new Error(
      `Report request failed: ${reportResponse.status} ${reportResponse.statusText}`,
    );
  }

  const items = await reportResponse.json();
  if (!Array.isArray(items)) {
    throw new Error("The comparison report does not contain an element list.");
  }
  return items;
}

function normalizeElementId(value) {
  return BigInt(value).toString();
}

function getElementId(feature) {
  const id = feature.getProperty("element");
  return id === undefined ? undefined : normalizeElementId(id);
}

function readChanges(items) {
  for (const item of items) {
    const type = item.$meta.op.toLowerCase();
    changes[type].add(normalizeElementId(item.ECInstanceId));
  }
}

const revisions = await getLatestRevisions();
readChanges(await getComparisonReport(revisions));

[previousTileset, currentTileset] = await Promise.all([
  Cesium.Cesium3DTileset.fromIonAssetId(revisions.fromAssetId),
  Cesium.Cesium3DTileset.fromIonAssetId(revisions.toAssetId),
]);
viewer.scene.primitives.add(previousTileset);
viewer.scene.primitives.add(currentTileset);

function getCurrentFeatureType(feature) {
  const id = getElementId(feature);
  return changes.inserted.has(id)
    ? "inserted"
    : changes.updated.has(id)
      ? "updated"
      : undefined;
}

currentStyle = new Cesium.Cesium3DTileStyle({
  color: {
    evaluateColor(feature, result) {
      const type = getCurrentFeatureType(feature);
      return Cesium.Color.clone(
        type && visibility[type] ? highlightColors[type] : Cesium.Color.WHITE,
        result,
      );
    },
  },
});

previousStyle = new Cesium.Cesium3DTileStyle({
  color: {
    evaluateColor(feature, result) {
      const deleted = changes.deleted.has(getElementId(feature));
      return Cesium.Color.clone(
        deleted && visibility.deleted
          ? highlightColors.deleted
          : Cesium.Color.TRANSPARENT,
        result,
      );
    },
  },
});

function showRevision(mode) {
  if (!currentTileset) {
    return;
  }
  previousTileset.show = mode !== "latest";
  currentTileset.show = mode !== "previous";
  previousTileset.style = mode === "changes" ? previousStyle : undefined;
  currentTileset.style = mode === "changes" ? currentStyle : undefined;
}