Function to load a gantt-like (timeline) of a workflow (using vis.js)

loadViz.js

function loadViz(){

	var now = moment().minutes(0).seconds(0).milliseconds(0);


	// create a dataset with items
	var items = new vis.DataSet();
	var groups = new vis.DataSet();

	var inn = top.aras.newIOMInnovator();
	var aras = parent.aras || parent.parent.aras;
	var topItem = parent.thisItem;

	// retrieve top node ID
	var topItemId = topItem.getID();
	var simData = inn.getItemById("Ansys_SimData",topItem.getProperty("simulationdata",""));
	var simDataConfigId = simData.getProperty("config_id");

	if (simDataConfigId !== ""){
		
		const start = now.clone().add(Math.random() * 200, 'hours');

		let simContainers = topItem.newItem("Ansys_SimData","get");
		simContainers.setProperty("config_id",simDataConfigId);
		simContainers.setAttribute("orderBy","major_rev");
		simContainers.setPropertyCondition("id","is not null");
		simContainers = simContainers.apply();
		
		
		var simContainer = simContainers.getItemByIndex(simContainers.getItemCount()-1);
		var wf = inn.newItem("Workflow","get");
		wf.setProperty("source_id",simContainer.getID());
		var wfp = wf.createRelatedItem("Workflow Process","get");
		var activities = wfp.createRelationship("Workflow Process Activity","get");
		activities.setAttribute("orderBy","name");
		//activities.setAttribute("where","is_auto = '0'");
		wf = wf.apply();
		
		var trailingDate;
		
		var processes= wf.getItemsByXPath(".//Item[@type='Workflow Process']");
		
		for (var j=0; j < processes.getItemCount();j++){
			var pro = processes.getItemByIndex(j);
			
			var activities = pro.getItemsByXPath(".//Item[@type='Activity']");
			
			let groupNames = [];
			
			
			////////////////////////////////////////////////
			// reorder Activities prior to send to dataset
			////////////////////////////////////////////////
			let ProcGroup = { 
						id:  ' Simulation Execution (' + j+')',
						order:' Simulation Execution (' + j+')',
						content: ' Simulation Execution (' + j+')',
						nestedGroups : []
					}
			let ordActivities = [];
			for (var i =0;i<activities.getItemCount();i++){
			
				var act = activities.getItemByIndex(i);
				if (act.getProperty("is_auto","1")==="0"){
					let ordActivity  = {
						
						name :act.getProperty("name",""),
						state : act.getProperty("state",""),
						aId : act.getID(),
						id : act.getProperty("name","")+ ' (' + j+')',
						createdOn : act.getProperty("created_on",""),
						activeDate : act.getProperty("active_date",""),
						closedDate : act.getProperty("closed_date",""),
						expectedDuration : act.getProperty("expected_duration","1")
					}
					switch (ordActivity.state){
						case "Closed":
						ordActivity.mainSort = 1;
							break;
						case "Active":
						ordActivity.mainSort = 2;
							break;
						case "Pending":
						ordActivity.mainSort = 3;
							break;
						case "":
							break;
					}
					ordActivities.push(ordActivity);
				}
			}
			
			ordActivities = _.sortBy(ordActivities, ['mainSort', 'name']);
			
			for (i =0;i<ordActivities.length;i++){
				var act = ordActivities[i];
				if (_.indexOf(groupNames,act.name)=== -1){
					groupNames.push(act.name);
					groups.add({ 
						id: act.name+ ' (' + j+')',
						order:act.name,
						content: act.name,
					}); 
					ProcGroup.nestedGroups.push( act.name+ ' (' + j+')');
				}
				var item ={
					id: act.aId+'-'+i,
					group: act.name+ ' (' + j+')',
					content: act.name
				};
				
				// test if is active
				var expectedDuration = parseInt(act.expectedDuration);
				switch (act.state){
					case "Active":
						item.start = moment(act.activeDate);   
						item.end = item.start.clone().add(expectedDuration, 'd');
						trailingDate = item.end.format();
						item.className = "active";
						item.type = "range";
						break;
					case "Closed":
						item.start = moment(act.activeDate);   
						item.end = moment(act.closedDate);   
						trailingDate = item.end.format();
						item.className = "closed";
						item.type = "range";
						break;
					case "Pending":
						if (trailingDate) {
							item.start = moment(trailingDate);
						}else {
							item.start = moment(act.createdOn);
						}
						item.end = item.start.clone().add(expectedDuration, 'd');
						trailingDate = item.end.format();
						item.className = "pending";
						item.type = "range";
						break;
					case "":
						break;
				}
				items.add(item);
			}
			groups.add(ProcGroup);
		}
		
	}


	// create visualization    
	const container = document.getElementById('visualization');
	const content = container.innerHTML;
    container.innerHTML= ""; 
	const options = {
		groupOrder:'order'
	};

	const timeline = new vis.Timeline(container);
	timeline.setOptions(options);
	timeline.setGroups(groups);
	timeline.setItems(items);
}