Files
lmxopcua/src/Server/ZB.MOM.WW.OtOpcUa.AdminUI/wwwroot/js/monaco-init.js
T
Joseph Doherty dc0d7653b9 feat(v3-batch3): B3-WP4 — {{equip}}/<RefName> reference-relative resolution
Replace the deleted equipment-base-prefix {{equip}} mechanism (impossible now
that equipment is reference-only) with per-reference resolution:
{{equip}}/<RefName> resolves through the owning equipment's UnsTagReference rows
(by effective name) to the backing raw tag's RawPath. Every unresolved <RefName>
is a clear deploy error + authoring rejection + Monaco diagnostic — preserving
"editor accepts <=> publish accepts".

Commons:
- EquipmentScriptPaths: delete DeriveEquipmentBase; SubstituteEquipmentToken now
  takes the equipment's reference map (effectiveName -> RawPath) and substitutes
  {{equip}}/<RefName> inside path literals (unresolved left intact, never throws);
  add ExtractEquipReferenceNames (path-literal scoped) +
  ExtractEquipReferenceNamesFromText (message templates). Slash syntax replaces
  the v2 dot joint.
- New EquipmentReferenceMap: shared, input-shape-agnostic builder (entity + JSON
  sides) over RawPathResolver — the single authority both compose seams + the
  validator use, so resolved RawPaths agree byte-for-byte.

Compose seams (byte-parity kept):
- AddressSpaceComposer.Compose + DeploymentArtifact.ParseComposition both build
  the per-equipment reference map from UnsTagReferences + Tags + raw topology and
  substitute VirtualTag AND ScriptedAlarm-predicate sources before dependency
  extraction (runtime dep refs = resolved RawPaths).

Deploy gate + authoring + editor:
- DraftValidator.ValidateEquipReferenceResolution: EquipReferenceUnresolved error
  for unresolved {{equip}}/<RefName> in VirtualTag/ScriptedAlarm scripts + alarm
  message-template tokens (naming script, equipment, missing ref).
- UnsTreeService.ValidateEquipTokenAsync (Wave-A M1): reference-relative authoring
  rejection, replacing the stale DeriveEquipmentBase(empty)->reject-all logic.
- ScriptAnalysisService: {{equip}}/ completion offers the equipment's reference
  effective names; DiagnoseAsync flags unresolved refs (OTSCRIPT_EQUIPREF) same as
  the deploy gate. Requests carry optional EquipmentId (threaded MonacoEditor ->
  monaco-init.js -> fetch bodies). IScriptTagCatalog.GetEquipmentRelativeLeavesAsync
  repurposed to GetEquipmentReferenceNamesAsync(equipmentId, filter).

Tests: EquipmentScriptPaths substitution/extraction (slash pinned); composer<->
artifact reference-resolution byte-parity; DraftValidator unresolved-ref;
ScriptAnalysis completion+diagnostic; M1 authoring gate. Build clean (0/0); all
five affected suites green.

Claude-Session: https://claude.ai/code/session_01LVneM3eh1UtJxEisFXgmox
2026-07-16 06:58:17 -04:00

238 lines
13 KiB
JavaScript

(function () {
const VS_BASE = "/_content/ZB.MOM.WW.OtOpcUa.AdminUI/lib/monaco/vs";
const editors = {};
let readyPromise = null;
function ensureLoaded() {
if (readyPromise) return readyPromise;
readyPromise = new Promise(function (resolve, reject) {
const loader = document.createElement("script");
loader.src = VS_BASE + "/loader.js";
loader.onload = function () {
require.config({ paths: { vs: VS_BASE } });
require(["vs/editor/editor.main"], function () {
registerCSharpProviders();
resolve();
});
};
loader.onerror = function (e) { reject(e); };
document.head.appendChild(loader);
});
return readyPromise;
}
const KIND_MAP = { Method: 0, Field: 3, Property: 9, Event: 10, Class: 5, Module: 8, Variable: 4, Text: 18 };
// The owning-equipment id is stamped onto each editor's model at createEditor time so the globally
// registered csharp providers (which only receive the model) can thread it into the {{equip}}/<RefName>
// completion + diagnostics. Null on the shared ScriptEdit page (equip-ref features inert there).
function equipmentIdOf(model) { return (model && model.__otEquipmentId) || null; }
function registerCSharpProviders() {
monaco.languages.registerCompletionItemProvider("csharp", {
triggerCharacters: [".", "(", "\""],
provideCompletionItems: async function (model, position) {
try {
const resp = await fetch("/api/script-analysis/completions", {
method: "POST", credentials: "same-origin",
headers: { "Content-Type": "application/json" },
body: JSON.stringify({ codeText: model.getValue(), line: position.lineNumber, column: position.column, equipmentId: equipmentIdOf(model) })
});
if (!resp.ok) return { suggestions: [] };
const data = await resp.json();
const word = model.getWordUntilPosition(position);
const wordRange = {
startLineNumber: position.lineNumber, endLineNumber: position.lineNumber,
startColumn: word.startColumn, endColumn: word.endColumn
};
// Tag-path items (detail "tag path") are full dotted paths inside a string literal.
// Monaco's word definition splits on '.', so the word range would cover only the last
// segment and accepting the full path would duplicate the prefix
// (e.g. "X.Protected" + insert "X.ProtectedValue" -> "X.X.ProtectedValue").
// Replace the whole partial path instead: from just after the opening quote to the caret.
const lineText = model.getLineContent(position.lineNumber);
const beforeCaret = lineText.substring(0, position.column - 1);
const quoteIdx = Math.max(beforeCaret.lastIndexOf('"'), beforeCaret.lastIndexOf("'"));
const literalRange = {
startLineNumber: position.lineNumber, endLineNumber: position.lineNumber,
startColumn: quoteIdx >= 0 ? quoteIdx + 2 : position.column,
endColumn: position.column
};
return {
suggestions: (data.items || []).map(function (it) {
return {
label: it.label, insertText: it.insertText, detail: it.detail,
kind: KIND_MAP[it.kind] != null ? KIND_MAP[it.kind] : 18,
insertTextRules: it.insertTextRules || 0,
range: it.detail === "tag path" ? literalRange : wordRange
};
})
};
} catch (e) { return { suggestions: [] }; }
}
});
monaco.languages.registerHoverProvider("csharp", {
provideHover: async function (model, position) {
try {
const resp = await fetch("/api/script-analysis/hover", {
method: "POST", credentials: "same-origin",
headers: { "Content-Type": "application/json" },
body: JSON.stringify({ codeText: model.getValue(), line: position.lineNumber, column: position.column, equipmentId: equipmentIdOf(model) })
});
if (!resp.ok) return null;
const data = await resp.json();
if (!data.markdown) return null;
return { contents: [{ value: data.markdown }] };
} catch (e) { return null; }
}
});
monaco.languages.registerDocumentFormattingEditProvider("csharp", {
provideDocumentFormattingEdits: async function (model) {
try {
const resp = await fetch("/api/script-analysis/format", {
method: "POST", credentials: "same-origin",
headers: { "Content-Type": "application/json" },
body: JSON.stringify({ code: model.getValue() })
});
if (!resp.ok) return [];
const data = await resp.json();
if (typeof data.code !== "string" || data.code === model.getValue()) return [];
return [{ range: model.getFullModelRange(), text: data.code }];
} catch (e) { return []; }
}
});
monaco.languages.registerInlayHintsProvider("csharp", {
provideInlayHints: async function (model) {
try {
const resp = await fetch("/api/script-analysis/inlay-hints", {
method: "POST", credentials: "same-origin",
headers: { "Content-Type": "application/json" },
body: JSON.stringify({ code: model.getValue() })
});
if (!resp.ok) return { hints: [], dispose: function () {} };
const data = await resp.json();
return {
hints: (data.hints || []).map(function (h) {
return { position: { lineNumber: h.line, column: h.column }, label: h.label, kind: 2, paddingRight: true };
}),
dispose: function () {}
};
} catch (e) { return { hints: [], dispose: function () {} }; }
}
});
monaco.languages.registerSignatureHelpProvider("csharp", {
signatureHelpTriggerCharacters: ["(", ","],
signatureHelpRetriggerCharacters: [","],
provideSignatureHelp: async function (model, position) {
try {
const resp = await fetch("/api/script-analysis/signature-help", {
method: "POST", credentials: "same-origin",
headers: { "Content-Type": "application/json" },
body: JSON.stringify({ codeText: model.getValue(), line: position.lineNumber, column: position.column })
});
if (!resp.ok) return null;
const data = await resp.json();
if (!data.label) return null;
return {
value: {
signatures: [{
label: data.label,
parameters: (data.parameters || []).map(function (p) { return { label: p.label, documentation: p.documentation }; })
}],
activeSignature: 0,
activeParameter: data.activeParameter ?? 0
},
dispose: function () {}
};
} catch (e) { return null; }
}
});
}
async function fetchDiagnostics(model) {
try {
const resp = await fetch("/api/script-analysis/diagnostics", {
method: "POST", credentials: "same-origin",
headers: { "Content-Type": "application/json" },
body: JSON.stringify({ code: model.getValue(), equipmentId: equipmentIdOf(model) })
});
if (!resp.ok) return [];
const data = await resp.json();
return data.markers || [];
} catch (e) { return []; }
}
// A single body-level node for Monaco's overflow widgets (suggest / hover / parameter hints).
// Rendering them here — outside any ancestor with a CSS transform (e.g. the theme's `.rise`
// entrance animation) — keeps the position:fixed widgets viewport-correct. Without it, the
// transformed ancestor becomes the containing block and the popup is offset far from the caret.
function overflowWidgetsNode() {
let node = document.getElementById("otopcua-monaco-overflow");
if (!node) {
node = document.createElement("div");
node.id = "otopcua-monaco-overflow";
node.className = "monaco-editor"; // so the suggest/hover widget CSS applies
node.style.position = "absolute";
node.style.top = "0";
node.style.left = "0";
node.style.zIndex = "2000";
document.body.appendChild(node);
}
return node;
}
async function createEditor(id, host, options, dotNetRef) {
await ensureLoaded();
if (!host) return;
const editor = monaco.editor.create(host, {
value: options.value || "", language: options.language || "csharp",
theme: "vs", minimap: { enabled: false }, scrollBeyondLastLine: false,
automaticLayout: true, fontSize: 13, lineNumbers: "on",
renderLineHighlight: "line", readOnly: !!options.readOnly,
tabSize: 4, insertSpaces: true, wordWrap: "off",
// Render overflow widgets (suggest/hover) in a body-level node so an ancestor CSS
// transform doesn't mis-position them; requires fixedOverflowWidgets.
fixedOverflowWidgets: true, overflowWidgetsDomNode: overflowWidgetsNode(),
// Auto-suggest inside string literals too, so tag-path completion surfaces while typing
// inside ctx.GetTag("…") / ctx.SetVirtualTag("…") without requiring an explicit Ctrl+Space.
quickSuggestions: { other: true, comments: false, strings: true }
});
// Stamp the owning-equipment id on the model so the global csharp providers can thread it into the
// {{equip}}/<RefName> completion + diagnostics (null on the shared ScriptEdit page).
try { const m0 = editor.getModel(); if (m0) m0.__otEquipmentId = options.equipmentId || null; } catch (x) {}
let diagTimer = null;
const scheduleDiagnostics = function () {
if (diagTimer) clearTimeout(diagTimer);
diagTimer = setTimeout(async function () {
const model = editor.getModel(); if (!model) return;
const markers = await fetchDiagnostics(model);
monaco.editor.setModelMarkers(model, "otopcua", markers);
dotNetRef.invokeMethodAsync("OnMarkersChanged", markers).catch(function () {});
}, 500);
};
editor.onDidChangeModelContent(function () {
dotNetRef.invokeMethodAsync("OnValueChanged", editor.getValue()).catch(function () {});
if (options.language === "csharp") scheduleDiagnostics();
});
editors[id] = { editor: editor, dotNetRef: dotNetRef };
if (options.language === "csharp") scheduleDiagnostics();
}
function setEditorOption(id, name, value) {
const e = editors[id]; if (!e) return;
// Note: monaco.editor.setTheme is global — it re-themes every editor on the page, not just this id.
if (name === "theme") { monaco.editor.setTheme(value); return; }
const u = {}; u[name] = value; e.editor.updateOptions(u);
}
function format(id) { editors[id]?.editor.getAction("editor.action.formatDocument")?.run(); }
function revealLine(id, line, col) {
const e = editors[id]; if (!e) return;
e.editor.revealLineInCenter(line); e.editor.setPosition({ lineNumber: line, column: col || 1 }); e.editor.focus();
}
function setValue(id, v) { const e = editors[id]; if (e && e.editor.getValue() !== v) e.editor.setValue(v || ""); }
function getValue(id) { const e = editors[id]; return e ? e.editor.getValue() : null; }
function setMarkers(id, m) { const e = editors[id]; const model = e && e.editor.getModel(); if (model) monaco.editor.setModelMarkers(model, "otopcua", m || []); }
function dispose(id) { const e = editors[id]; if (!e) return; try { e.editor.dispose(); } catch (x) {} delete editors[id]; }
window.MonacoBlazor = { createEditor, setValue, getValue, setMarkers, setEditorOption, format, revealLine, dispose };
})();