feat: 1023 feat calibration page v0

packages/client/hmi-client/src/components/widgets/tera-infinite-canvas.vue

@@ -1,12 +1,17 @@
 <template>
 	<main ref="canvasRef">
-		<svg class="background-layer" ref="backgroundLayerRef" :width="width" :height="height">
+		<svg
+			class="canvas-layer background-layer"
+			ref="backgroundLayerRef"
+			:width="width"
+			:height="height"
+		>
 			<slot name="background" />
 		</svg>
-		<div class="data-layer" ref="dataLayerRef">
+		<div class="canvas-layer data-layer" ref="dataLayerRef">
 			<slot name="data" />
 		</div>
-		<div>
+		<div class="canvas-layer">
 			<slot name="foreground" />
 		</div>
 	</main>
@@ -106,6 +111,13 @@ onMounted(() => {
 	// Zoom config is applied and event handler
 	const zoom = d3
 		.zoom()
+		.filter((evt: any) => {
+			const classStr = d3.select(evt.target).attr('class');
+			if (classStr.includes('canvas-layer') || evt.type === 'wheel') {
+				return true;
+			}
+			return false;
+		})
 		.scaleExtent(props.scaleExtent)
 		.on('zoom', (e) => handleZoom(e, container))
 		.on('end', handleZoomEnd);
@@ -129,8 +141,6 @@ onMounted(() => {
 		// Default position - triggers handleZoom which in turn sets currentTransform
 		svg.transition().call(zoom.transform as any, d3.zoomIdentity);
 	}
-
-	container.append('circle').attr('cx', 400).attr('cy', 300).attr('r', 20).attr('fill', 'red');
 });
 </script>
 
@@ -153,6 +163,9 @@ main > * {
 .background-layer:deep(.tick line) {
 	color: var(--surface-border);
 }
+.background-layer:deep(.tick text) {
+	color: var(--surface-border);
+}
 
 svg:active {
 	cursor: grabbing;

packages/client/hmi-client/src/components/workflow/tera-calibration-node.vue

@@ -0,0 +1,55 @@
+<template>
+	<Button @click="startCalibration">Start Calibration Job</Button>
+	<form>
+		<label for="calibrationStatus">
+			<input v-model="runId" type="text" placeholder="Run ID" />
+		</label>
+		<Button @click="getCalibrationStatus"> Get Run Status </Button>
+	</form>
+
+	<form>
+		<label for="calibrationResult">
+			<input v-model="runId" type="text" placeholder="Run ID" />
+		</label>
+		<Button @click="getCalibrationResults"> Get Run Results </Button>
+	</form>
+</template>
+
+<script setup lang="ts">
+import { ref } from 'vue';
+import Button from 'primevue/button';
+import { makeCalibrateJob, getRunStatus, getRunResult } from '@/services/models/simulation-service';
+import { CalibrationParams } from '@/types/Types';
+import { calibrationParamExample } from '@/temp/calibrationExample';
+import { WorkflowNode } from '@/types/workflow';
+
+defineProps<{
+	node: WorkflowNode;
+}>();
+
+const runId = ref('');
+
+const startCalibration = async () => {
+	// Make calibration job.
+	const calibrationParam: CalibrationParams = calibrationParamExample;
+	const results = await makeCalibrateJob(calibrationParam);
+	runId.value = results.id;
+	console.log(runId.value);
+};
+
+const getCalibrationStatus = async () => {
+	console.log('Getting status of run');
+	const results = await getRunStatus(Number(runId.value));
+	console.log('Done');
+	console.log(results);
+};
+
+const getCalibrationResults = async () => {
+	console.log('Getting results of run');
+	const results = await getRunResult(Number(runId.value));
+	console.log('Done');
+	console.log(results);
+};
+</script>
+
+<style scoped></style>

packages/client/hmi-client/src/workflow/tera-workflow-node.vue → packages/client/hmi-client/src/components/workflow/tera-workflow-node.vue

@@ -7,6 +7,7 @@
 				{{ input.label }}
 			</li>
 		</section>
+		<slot name="body"></slot>
 		<section class="outputs">
 			<li v-for="(output, index) in node.outputs" :key="index">
 				{{ output.label }}

packages/client/hmi-client/src/temp/TA2Playground.vue

@@ -14,8 +14,6 @@ import { defineComponent, ref } from 'vue';
 import { fetchStratificationResult } from '@/services/models/stratification-service';
 import { runDagreLayout, D3SelectionINode, D3SelectionIEdge } from '@/services/graph';
 import API from '@/api/api';
-import { CalibrationParams } from '@/types/Types';
-import { makeCalibrateJob } from '@/services/models/simulation-service';
 
 enum NodeType {
 	Species = 'S',
@@ -765,77 +763,13 @@ export default defineComponent({
 			resultGraph.height = 500;
 			await renderer?.setData(resultGraph);
 			await renderer?.render();
-		},
-		async testCalibration() {
-			console.log('Testing Calibration:');
-			let calibrationParam: CalibrationParams = {
-				petri: JSON.stringify({
-					T: [{ tname: 'exp' }, { tname: 'conv' }, { tname: 'rec' }, { tname: 'death' }],
-					S: [{ sname: 'S' }, { sname: 'E' }, { sname: 'I' }, { sname: 'R' }, { sname: 'D' }],
-					I: [
-						{ it: 1, is: 1 },
-						{ it: 1, is: 3 },
-						{ it: 2, is: 2 },
-						{ it: 3, is: 3 },
-						{ it: 4, is: 3 }
-					],
-					O: [
-						{ ot: 1, os: 2 },
-						{ ot: 1, os: 3 },
-						{ ot: 2, os: 3 },
-						{ ot: 3, os: 4 },
-						{ ot: 4, os: 5 }
-					]
-				}),
-				initials: {
-					S: 0.49457800495224524,
-					E: 0.26745259325403603,
-					I: 0.4497387877393193,
-					R: 0.32807705995998604,
-					D: 0.8545934885162726
-				},
-				t: [0.0, 1.0, 2.0, 3.0, 4.0, 5.0],
-				data: {
-					S: [
-						0.8457800495224524, 0.7989147588862952, 0.7717574792075946, 0.7555359186659574,
-						0.7456920016554676, 0.7396688112881398
-					],
-					E: [
-						0.21745259325403604, 0.1404833532397162, 0.088632010007611, 0.05529630617740498,
-						0.03431001255438966, 0.021230743198302895
-					],
-					I: [
-						0.4497387877393193, 0.27034535589195036, 0.1653910436709313, 0.10194987107919627,
-						0.06301885280976183, 0.03898091182580745
-					],
-					R: [
-						0.8545934885162726, 0.575704439041781, 0.7259355031548465, 0.8182142842907686,
-						0.8751839322495475, 0.9104140088945406
-					],
-					D: [
-						0.3545934885162726, 0.41019407193232343, 0.44392594295108295, 0.4646455987787392,
-						0.47743717972289984, 0.48534750378527575
-					]
-				},
-				params: {
-					exp: 0.16207166221196045,
-					conv: 0.7009195813964052,
-					rec: 0.7040317196117394,
-					death: 0.15807853921067516
-				}
-			};
-			console.log('Calibration Params setup done');
-			const results = await makeCalibrateJob(calibrationParam);
-			console.log('Done');
-			console.log(results);
 		}
 	}
 });
 </script>
 <template>
 	<section class="playground">
 		<p>A playground for testing TA2 API integrations.</p>
-		<button type="button" @click="testCalibration">Test Calibration</button>
 		<button type="button" @click="addPlace">Add place</button>
 		<button type="button" @click="addTransition">Add transition</button>
 		&nbsp;

packages/client/hmi-client/src/temp/calibrationExample.ts

@@ -0,0 +1,170 @@
+import { CalibrationParams } from '@/types/Types';
+
+export const calibrationParamExample: CalibrationParams = {
+	petri: JSON.stringify({
+		T: [{ tname: 'exp' }, { tname: 'conv' }, { tname: 'rec' }, { tname: 'death' }],
+		S: [{ sname: 'S' }, { sname: 'E' }, { sname: 'I' }, { sname: 'R' }, { sname: 'D' }],
+		I: [
+			{ it: 1, is: 1 },
+			{ it: 1, is: 3 },
+			{ it: 2, is: 2 },
+			{ it: 3, is: 3 },
+			{ it: 4, is: 3 }
+		],
+		O: [
+			{ ot: 1, os: 2 },
+			{ ot: 1, os: 3 },
+			{ ot: 2, os: 3 },
+			{ ot: 3, os: 4 },
+			{ ot: 4, os: 5 }
+		]
+	}),
+	initials: {
+		S: 0.49457800495224524,
+		E: 0.26745259325403603,
+		I: 0.4497387877393193,
+		R: 0.32807705995998604,
+		D: 0.8545934885162726
+	},
+	timesteps: [
+		0.0, 1.0, 2.0, 3.0, 4.0, 5.0, 6.0, 7.0, 8.0, 9.0, 10.0, 11.0, 12.0, 13.0, 14.0, 15.0, 16.0,
+		17.0, 18.0, 19.0, 20.0, 21.0, 22.0, 23.0, 24.0, 25.0, 26.0, 27.0, 28.0, 29.0, 30.0, 31.0, 32.0,
+		33.0, 34.0, 35.0, 36.0, 37.0, 38.0, 39.0, 40.0, 41.0, 42.0, 43.0, 44.0, 45.0, 46.0, 47.0, 48.0,
+		49.0, 50.0, 51.0, 52.0, 53.0, 54.0, 55.0, 56.0, 57.0, 58.0, 59.0, 60.0, 61.0, 62.0, 63.0, 64.0,
+		65.0, 66.0, 67.0, 68.0, 69.0, 70.0, 71.0, 72.0, 73.0, 74.0, 75.0, 76.0, 77.0, 78.0, 79.0, 80.0,
+		81.0, 82.0, 83.0, 84.0, 85.0, 86.0, 87.0, 88.0, 89.0, 90.0
+	],
+	data: {
+		S: [
+			0.8457800495224524, 0.7989147588862952, 0.7717574792075946, 0.7555359186659574,
+			0.7456920016554676, 0.7396688112881398, 0.7359674505077398, 0.733687938266877,
+			0.7322826633014184, 0.7314156264067815, 0.7308804557081816, 0.7305502951721528,
+			0.730346448584973, 0.7302205972596495, 0.7301429778227182, 0.7300949977873166,
+			0.7300654335334856, 0.730047144258963, 0.7300358864204086, 0.73002890908885,
+			0.730024629042432, 0.7300219622444799, 0.7300203331637952, 0.7300193219752432,
+			0.7300186914052434, 0.7300183147077333, 0.7300180744975032, 0.7300179226974934,
+			0.7300178363018128, 0.7300177832030919, 0.7300177442606378, 0.7300177212694495,
+			0.7300177109424568, 0.7300177052872375, 0.7300176984613497, 0.730017693784836,
+			0.7300176914001032, 0.7300176908506781, 0.7300176910990095, 0.7300177219074794,
+			0.7300178458024273, 0.7300179345285785, 0.7300179072318298, 0.7300177547480409,
+			0.7300175396030346, 0.7300173960125973, 0.7300175363444509, 0.730017912737607,
+			0.7300177386150222, 0.7300174202020968, 0.7300177284913968, 0.7300177123167327,
+			0.7300175532942412, 0.7300177171274255, 0.7300176919754777, 0.7300176235282271,
+			0.7300177181879278, 0.7300176938299692, 0.7300176424408426, 0.7300177168767108,
+			0.7300177049794416, 0.7300176427971512, 0.7300177097969711, 0.7300177230196913,
+			0.7300176477927348, 0.7300176880711062, 0.7300177406695283, 0.7300176686418995,
+			0.7300176522675123, 0.7300177435777646, 0.7300177016229011, 0.7300176226569584,
+			0.7300176569508812, 0.7300176826579916, 0.7300177007038987, 0.7300177110886026,
+			0.7300177138121032, 0.7300177088744005, 0.7300176994020061, 0.7300176938927453,
+			0.730017689480069, 0.7300176861639774, 0.7300176839444705, 0.7300176828215483,
+			0.7300176827952107, 0.7300176838654578, 0.7300176860322897, 0.7300176878300157,
+			0.730017688937628, 0.7300176894334329, 0.7300176893174307
+		],
+		E: [
+			0.217452593254036, 0.1404833532397162, 0.088632010007611, 0.0552963061774049,
+			0.0343100125543896, 0.0212307431983028, 0.0131195391705995, 0.0081018926034363,
+			0.0050021747290917, 0.0030878740632234, 0.0019058189715296, 0.0011765103673726,
+			0.0007262006132702, 0.0004481938724756, 0.0002767404236125, 0.0001707569164318,
+			0.0001054559433752, 6.505848872204872e-5, 4.019311351184087e-5, 2.478189020708888e-5,
+			1.5328655255094524e-5, 9.438387358063689e-6, 5.840286483038082e-6, 3.6068759808457466e-6,
+			2.214113804391068e-6, 1.3821494011314538e-6, 8.51573374279463e-7, 5.162622885181237e-7,
+			3.254925316256019e-7, 2.082282990279533e-7, 1.220137453281243e-7, 7.1209207397538e-8,
+			4.867191969701728e-8, 3.63384002842148e-8, 1.8287085423410195e-8, 4.665386113775543e-9,
+			1.0770495710384207e-9, 6.14378482299531e-9, 1.1527792880149082e-8, -8.362901541072997e-8,
+			-4.504371012477758e-7, -7.134866529110417e-7, -6.374765412561147e-7, -1.9554335065173602e-7,
+			4.3073862102014507e-7, 8.513573623644157e-7, 4.502358673376463e-7, -6.273118044533418e-7,
+			-1.353925922945228e-7, 7.687307162182654e-7, -1.1023424604761453e-7, -6.510054210534464e-8,
+			3.869754757232925e-7, -7.969665699893962e-8, -8.322081593118136e-9, 1.863674779812018e-7,
+			-8.314683083207985e-8, -1.3868152265098973e-8, 1.323692126105411e-7, -7.951765100918856e-8,
+			-4.566685952634925e-8, 1.3131475728721093e-7, -5.9391474108796086e-8, -9.703024328237189e-8,
+			1.1708587860358057e-7, 2.44038991154976e-9, -1.472709141288501e-7, 5.774030335551677e-8,
+			1.0434595580506445e-7, -1.555500662598952e-7, -3.6134414911451415e-8, 1.886253035122505e-7,
+			9.101428015414449e-8, 1.7843941481753958e-8, -3.3520287896786234e-8, -6.307840798147604e-8,
+			-7.083041877231543e-8, -5.677632026930445e-8, -2.9815085378066694e-8, -1.413407668776829e-8,
+			-1.574276315884203e-9, 7.864315737585585e-9, 1.4181699472641062e-8, 1.7377874889282224e-8,
+			1.7452841987509093e-8, 1.4406600767321636e-8, 8.239151228719873e-9, 3.1222862385595557e-9,
+			-3.0309217043157454e-11, -1.4415191680171683e-9, -1.111343614362474e-9
+		],
+		I: [
+			0.4497387877393193, 0.2703453558919503, 0.1653910436709313, 0.1019498710791962,
+			0.0630188528097618, 0.0389809118258074, 0.0241083368473905, 0.0149044038581098,
+			0.009211194579637, 0.0056906061008903, 0.0035143080526178, 0.0021703370346262,
+			0.0013400270966871, 0.000827196170478, 0.0005108171815234, 0.0003152198819452,
+			0.0001946818676834, 0.0001201097632167, 7.420476326892384e-5, 4.575360736524228e-5,
+			2.8300472720058342e-5, 1.7425910306088104e-5, 1.078275738828892e-5, 6.659295756205264e-6,
+			4.087951098286808e-6, 2.5517885635365483e-6, 1.5722706609474684e-6, 9.532825993129216e-7,
+			6.009212494743482e-7, 3.843775758378507e-7, 2.257781668456925e-7, 1.3204727752626754e-7,
+			8.966337611148167e-8, 6.644508425991673e-8, 4.158506541928465e-8, 2.5807590806114457e-8,
+			1.4404168084575729e-8, 5.883446258331484e-9, 2.0605949546011224e-9, 2.908964615185167e-7,
+			1.436576585246252e-6, 2.257407617734316e-6, 2.0097949037680603e-6, 6.092642788981324e-7,
+			-1.3695379305593796e-6, -2.6928449075230503e-6, -1.4095223432849782e-6, 2.034197390485977e-6,
+			4.476699669663285e-7, -2.4581111175867632e-6, 3.589147619815499e-7, 2.12102564827637e-7,
+			-1.2396504208438817e-6, 2.5696291871873894e-7, 2.74714220891997e-8, -5.975087570024642e-7,
+			2.670869216182632e-7, 4.4681543928191686e-8, -4.246136348603734e-7, 2.55217127418659e-7,
+			1.4657379359677668e-7, -4.2131813728946084e-7, 1.905851959640476e-7, 3.113489576805776e-7,
+			-3.7568344418951466e-7, -7.825907097209913e-9, 4.7254686353887043e-7, -1.8526792098122545e-7,
+			-3.348104609788996e-7, 4.991099995234981e-7, 1.1594406973346749e-7, -6.052357806743842e-7,
+			-2.920340702260703e-7, -5.7254556977615096e-8, 1.0755628995366001e-7, 2.0239847056775485e-7,
+			2.2727198486466962e-7, 1.821768328444043e-7, 9.566693079778256e-8, 4.535163864789735e-8,
+			5.051297687341081e-9, -2.523409208388622e-8, -4.550453066578466e-8, -5.576001805835408e-8,
+			-5.60005542615946e-8, -4.6226139275506176e-8, -2.643677310008877e-8, -1.0018400843478872e-8,
+			9.72615938096802e-11, 4.6253778944017745e-9, 3.565948058297408e-9
+		],
+		R: [
+			0.328077059959986, 0.575704439041781, 0.7259355031548465, 0.8182142842907686,
+			0.8751839322495475, 0.9104140088945406, 0.9322060994766032, 0.9456815127600474,
+			0.954009748853752, 0.9591561390989404, 0.9623357373642007, 0.9642984771532586,
+			0.965510748248018, 0.966259351017806, 0.9667211203236034, 0.9670065848779302,
+			0.9671824912805328, 0.96729131546496, 0.967358302794905, 0.9673998204182364,
+			0.967425288420584, 0.9674411570203612, 0.9674508507827414, 0.9674568678187088,
+			0.967460620004928, 0.9674628615319908, 0.9674642908963146, 0.9674651941785616,
+			0.9674657082738553, 0.9674660242363848, 0.967466255962566, 0.967466392771112,
+			0.9674664542216124, 0.9674664878728264, 0.9674665284901154, 0.9674665563176058,
+			0.967466570507904, 0.9674665737772408, 0.9674665722995444, 0.9674663889745708,
+			0.9674656517410362, 0.967465123778545, 0.967465286207249, 0.9674661935580388,
+			0.967467473772543, 0.9674683282031288, 0.9674674931642172, 0.967465253482127,
+			0.967466289575498, 0.9674681842326472, 0.9674663497784228, 0.9674664460217516,
+			0.967467392259387, 0.9674664173782408, 0.9674665670425042, 0.9674669743306402,
+			0.9674664110620944, 0.967466556002753, 0.967466861790233, 0.9674664188624796,
+			0.967466489656646, 0.9674668596691384, 0.967466460989138, 0.9674663823079656,
+			0.9674668299423852, 0.9674665902670504, 0.9674662772825848, 0.9674667058795138,
+			0.9674668033135962, 0.9674662599762196, 0.9674665096265568, 0.9674669795085046,
+			0.967466775443317, 0.967466622473781, 0.9674665150920312, 0.967466453298067,
+			0.967466437091889, 0.9674664664734968, 0.9674665228386964, 0.9674665556214272,
+			0.9674665818789554, 0.9674666016112812, 0.9674666148184043, 0.9674666215003253,
+			0.9674666216570434, 0.9674666152885592, 0.9674666023948724, 0.9674665916975448,
+			0.967466585106724, 0.967466582156448, 0.9674665828467162
+		],
+		D: [
+			0.3545934885162726, 0.4101940719323234, 0.4439259429510829, 0.4646455987787392,
+			0.4774371797228998, 0.4853475037852757, 0.4902405529897334, 0.493266231503596,
+			0.4951361975281673, 0.4962917333222308, 0.4970056588955365, 0.4974463592646562,
+			0.4977185544491183, 0.4978866406716573, 0.4979903232406089, 0.4980544195284428,
+			0.4980939163669894, 0.4981183510162046, 0.4981333918999721, 0.4981427139874078,
+			0.4981484324010752, 0.4981519954295613, 0.4981541720016586, 0.4981555230263775,
+			0.4981563655169925, 0.4981568688143778, 0.4981571897542133, 0.4981573925711236,
+			0.4981575080026174, 0.4981575789467151, 0.4981576309769506, 0.4981576616950199,
+			0.4981576754927013, 0.4981576830485181, 0.4981576921684505, 0.4981576984166478,
+			0.4981577016028417, 0.4981577023369166, 0.4981577020051246, 0.4981576608425702,
+			0.498157495309119, 0.4981573767639782, 0.4981574132346251, 0.4981576169650586,
+			0.4981579044157985, 0.4981580962638858, 0.4981579087698743, 0.4981574058867467,
+			0.4981576385241719, 0.4981580639377238, 0.4981576520417311, 0.4981576736515598,
+			0.4981578861133836, 0.4981576672201388, 0.4981577008247442, 0.4981577922744784,
+			0.4981576658019538, 0.4981576983459528, 0.4981577670054135, 0.4981576675533998,
+			0.498157683449045, 0.4981577665291572, 0.4981576770122358, 0.4981576593456955,
+			0.4981577598545123, 0.4981577060394274, 0.498157635764004, 0.498157731998271,
+			0.4981577538754634, 0.4981576318781494, 0.4981576879329542, 0.4981577934370811,
+			0.4981577476176587, 0.4981577132709096, 0.4981576891601349, 0.4981576752853345,
+			0.4981576716465085, 0.4981576782436568, 0.4981576908995189, 0.4981576982603324,
+			0.4981577041560209, 0.4981577085865845, 0.4981577115520229, 0.4981577130523364,
+			0.4981577130875249, 0.4981577116575883, 0.4981577087625267, 0.4981577063606208,
+			0.4981577048807624, 0.4981577042183272, 0.4981577043733154
+		]
+	},
+	params: {
+		exp: 0.16207166221196045,
+		conv: 0.7009195813964052,
+		rec: 0.7040317196117394,
+		death: 0.15807853921067516
+	}
+};

packages/client/hmi-client/src/types/Types.ts

@@ -49,7 +49,7 @@ export interface Simulation {
 export interface CalibrationParams {
     petri: string;
     initials: { [index: string]: number };
-    t: number[];
+    timesteps: number[];
     params: { [index: string]: number };
     data: { [index: string]: number[] };
 }

packages/client/hmi-client/src/types/workflow.ts

@@ -48,7 +48,6 @@ export interface WorkflowNode {
 	y: number;
 	width: number;
 	height: number;
-
 	inputs: WorkflowPort[];
 	outputs: WorkflowPort[];